Dockery/Homarr
1
0
Fork 0
mirror of https://github.com/ajnart/homarr.git synced 2026-01-26 09:19:18 +01:00
Code Issues Packages Projects Releases Wiki Activity

Finish reworking update indicator

Browse Source
This commit is contained in:
ajnart
2022-12-11 14:40:53 +09:00
parent cabbf8f90d
commit bb8286e6d4
1 changed files with 47 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
src/components/Settings/SettingsMenu.tsx
View File

@@ -8,6 +8,7 @@ import {
Indicator,
Alert,
Notification,
Anchor,
} from '@mantine/core';
import { useElementSize, useHotkeys, useViewportSize } from '@mantine/hooks';
import { useEffect, useState } from 'react';
@@ -18,46 +19,33 @@ import AdvancedSettings from './AdvancedSettings';
import CommonSettings from './CommonSettings';
import Credits from './Credits';
import { CURRENT_VERSION, REPO_URL } from '../../../data/constants';
import Link from 'next/link';
import { NextLink } from '@mantine/next';
function SettingsMenu({ newVersionAvailable }: { newVersionAvailable: string }) {
const { t } = useTranslation('settings/common');
const { height, width } = useViewportSize();
return (
<>
<Notification
icon={<IconInfoCircle size={25} />}
disallowClose
color="teal"
radius="md"
title="New update available"
hidden={newVersionAvailable === ''}
>
{
//TODO: Translate and add link to release page}
}
Version <b>{newVersionAvailable}</b> is available, update now!
</Notification>
<Tabs defaultValue="Common">
<Tabs.List grow>
<Tabs.Tab value="Common">{t('tabs.common')}</Tabs.Tab>
<Tabs.Tab value="Customizations">{t('tabs.customizations')}</Tabs.Tab>
</Tabs.List>
<Tabs.Panel data-autofocus value="Common">
<ScrollArea style={{ height: height - 100 }} offsetScrollbars>
<CommonSettings />
<Credits />
</ScrollArea>
</Tabs.Panel>
<Tabs.Panel value="Customizations">
<ScrollArea style={{ height: height - 120 }} offsetScrollbars>
<AdvancedSettings />
<Credits />
</ScrollArea>
</Tabs.Panel>
</Tabs>
</>
<Tabs defaultValue="Common">
<Tabs.List grow>
<Tabs.Tab value="Common">{t('tabs.common')}</Tabs.Tab>
<Tabs.Tab value="Customizations">{t('tabs.customizations')}</Tabs.Tab>
</Tabs.List>
<Tabs.Panel data-autofocus value="Common">
<ScrollArea style={{ height: height - 100 }} offsetScrollbars>
{newVersionAvailable && <NewUpdateIndicator newVersionAvailable={newVersionAvailable} />}
<CommonSettings />
<Credits />
</ScrollArea>
</Tabs.Panel>
<Tabs.Panel value="Customizations">
<ScrollArea style={{ height: height - 120 }} offsetScrollbars>
<AdvancedSettings />
<Credits />
</ScrollArea>
</Tabs.Panel>
</Tabs>
);
}
@@ -107,3 +95,28 @@ export function SettingsMenuButton(props: any) {
</>
);
}
function NewUpdateIndicator({ newVersionAvailable }: { newVersionAvailable: string }) {
return (
<Notification
mt={10}
icon={<IconInfoCircle size={25} />}
disallowClose
color="teal"
radius="md"
title="New update available"
hidden={newVersionAvailable === ''}
>
Version{' '}
<b>
<Anchor
target="_blank"
href={`https://github.com/ajnart/homarr/releases/tag/${newVersionAvailable}`}
>
{newVersionAvailable}
</Anchor>
</b>{' '}
is available ! Current version: {CURRENT_VERSION}
</Notification>
);
}