mirror of
https://github.com/ajnart/homarr.git
synced 2025-11-10 23:45:48 +01:00
🐛 Fix footer display issues
This commit is contained in:
@@ -1,14 +1,5 @@
|
|||||||
import React, { useEffect, useState } from 'react';
|
import React, { useEffect, useState } from 'react';
|
||||||
import {
|
import { createStyles, Anchor, Footer as FooterComponent, useMantineTheme } from '@mantine/core';
|
||||||
createStyles,
|
|
||||||
Anchor,
|
|
||||||
Text,
|
|
||||||
Group,
|
|
||||||
ActionIcon,
|
|
||||||
Footer as FooterComponent,
|
|
||||||
useMantineTheme,
|
|
||||||
} from '@mantine/core';
|
|
||||||
import { BrandGithub } from 'tabler-icons-react';
|
|
||||||
import { showNotification } from '@mantine/notifications';
|
import { showNotification } from '@mantine/notifications';
|
||||||
import { CURRENT_VERSION, REPO_URL } from '../../../data/constants';
|
import { CURRENT_VERSION, REPO_URL } from '../../../data/constants';
|
||||||
|
|
||||||
@@ -43,86 +34,31 @@ interface FooterCenteredProps {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function Footer({ links }: FooterCenteredProps) {
|
export function Footer({ links }: FooterCenteredProps) {
|
||||||
const [update, setUpdate] = useState(false);
|
|
||||||
const theme = useMantineTheme();
|
|
||||||
const { classes } = useStyles();
|
|
||||||
const items = links.map((link) => (
|
|
||||||
<Anchor<'a'>
|
|
||||||
color="dimmed"
|
|
||||||
key={link.label}
|
|
||||||
href={link.link}
|
|
||||||
sx={{ lineHeight: 1 }}
|
|
||||||
onClick={(event) => event.preventDefault()}
|
|
||||||
size="sm"
|
|
||||||
>
|
|
||||||
{link.label}
|
|
||||||
</Anchor>
|
|
||||||
));
|
|
||||||
|
|
||||||
const [latestVersion, setLatestVersion] = useState('0');
|
|
||||||
const [isOpen, setOpen] = useState(true);
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
// Fetch Data here when component first mounted
|
// Fetch Data here when component first mounted
|
||||||
fetch(`https://api.github.com/repos/${REPO_URL}/releases/latest`).then((res) => {
|
fetch(`https://api.github.com/repos/${REPO_URL}/releases/latest`).then((res) => {
|
||||||
res.json().then((data) => {
|
res.json().then((data) => {
|
||||||
setLatestVersion(data.tag_name);
|
|
||||||
if (data.tag_name !== CURRENT_VERSION) {
|
if (data.tag_name !== CURRENT_VERSION) {
|
||||||
setUpdate(true);
|
showNotification({
|
||||||
|
color: 'yellow',
|
||||||
|
autoClose: false,
|
||||||
|
title: 'New version available',
|
||||||
|
message: `Version ${data.tag_name} is available, update now! 😡`,
|
||||||
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}, []);
|
}, []);
|
||||||
if (update) {
|
|
||||||
showNotification({
|
|
||||||
color: 'yellow',
|
|
||||||
autoClose: false,
|
|
||||||
title: 'New version available',
|
|
||||||
message: `Version ${latestVersion} is available, update now! 😡`,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<FooterComponent
|
<FooterComponent
|
||||||
p={5}
|
|
||||||
height="auto"
|
height="auto"
|
||||||
style={{
|
style={{
|
||||||
position: 'relative',
|
|
||||||
background: 'none',
|
background: 'none',
|
||||||
border: 'none',
|
border: 'none',
|
||||||
clear: 'both',
|
clear: 'both',
|
||||||
}}
|
}}
|
||||||
>
|
children={undefined}
|
||||||
<Group position="right" direction="row" align="center" mr="xs">
|
/>
|
||||||
<Group spacing={0}>
|
|
||||||
<ActionIcon<'a'> component="a" href="https://github.com/ajnart/homarr" size="lg">
|
|
||||||
<BrandGithub size={18} />
|
|
||||||
</ActionIcon>
|
|
||||||
<Text
|
|
||||||
style={{
|
|
||||||
position: 'relative',
|
|
||||||
fontSize: '0.90rem',
|
|
||||||
color: 'gray',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{CURRENT_VERSION}
|
|
||||||
</Text>
|
|
||||||
</Group>
|
|
||||||
<Text
|
|
||||||
style={{
|
|
||||||
fontSize: '0.90rem',
|
|
||||||
textAlign: 'center',
|
|
||||||
color: '#a0aec0',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Made with ❤️ by @
|
|
||||||
<Anchor
|
|
||||||
href="https://github.com/ajnart"
|
|
||||||
style={{ color: 'inherit', fontStyle: 'inherit', fontSize: 'inherit' }}
|
|
||||||
>
|
|
||||||
ajnart
|
|
||||||
</Anchor>
|
|
||||||
</Text>
|
|
||||||
</Group>
|
|
||||||
</FooterComponent>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user