diff --git a/package.json b/package.json index bef8a0f18..8f72efb94 100644 --- a/package.json +++ b/package.json @@ -61,6 +61,7 @@ "next": "12.2.0", "next-i18next": "^11.3.0", "nzbget-api": "^0.0.3", + "ping": "^0.4.2", "prism-react-renderer": "^1.3.5", "react": "^18.2.0", "react-dom": "^18.2.0", @@ -75,6 +76,7 @@ "@next/eslint-plugin-next": "^12.1.4", "@types/dockerode": "^3.3.9", "@types/node": "17.0.1", + "@types/ping": "^0.4.1", "@types/react": "17.0.1", "@types/uuid": "^8.3.4", "@typescript-eslint/eslint-plugin": "^5.30.7", diff --git a/public/locales/en/layout/add-service-app-shelf.json b/public/locales/en/layout/add-service-app-shelf.json index 735110906..ee5d2676e 100644 --- a/public/locales/en/layout/add-service-app-shelf.json +++ b/public/locales/en/layout/add-service-app-shelf.json @@ -113,12 +113,6 @@ "advancedOptions": { "title": "Advanced options", "form": { - "httpStatusCodes": { - "label": "HTTP Status Codes", - "placeholder": "Select valid status codes", - "clearButtonLabel": "Clear selection", - "nothingFound": "Nothing found" - }, "openServiceInNewTab": { "label": "Open service in new tab" }, diff --git a/src/components/AppShelf/AddAppShelfItem.tsx b/src/components/AppShelf/AddAppShelfItem.tsx index 01dd3da81..3b89d1c85 100644 --- a/src/components/AppShelf/AddAppShelfItem.tsx +++ b/src/components/AppShelf/AddAppShelfItem.tsx @@ -7,7 +7,6 @@ import { Image, LoadingOverlay, Modal, - MultiSelect, PasswordInput, Select, Space, @@ -25,7 +24,7 @@ import { useTranslation } from 'next-i18next'; import { useEffect, useState } from 'react'; import { v4 as uuidv4 } from 'uuid'; import { useConfig } from '../../tools/state'; -import { tryMatchPort, ServiceTypeList, StatusCodes, Config } from '../../tools/types'; +import { tryMatchPort, ServiceTypeList, Config } from '../../tools/types'; import apiKeyPaths from './apiKeyPaths.json'; import Tip from '../layout/Tip'; @@ -121,7 +120,6 @@ export function AddAppShelfItemForm(props: AddAppShelfItemFormProps) { password: props.password ?? undefined, openedUrl: props.openedUrl ?? undefined, ping: props.ping ?? true, - status: props.status ?? ['200'], newTab: props.newTab ?? true, }, validate: { @@ -139,12 +137,6 @@ export function AddAppShelfItemForm(props: AddAppShelfItemFormProps) { } return null; }, - status: (value: string[]) => { - if (!value.length) { - return t('modal.form.validation.noStatusCodeSelected'); - } - return null; - }, }, }); @@ -190,12 +182,6 @@ export function AddAppShelfItemForm(props: AddAppShelfItemFormProps) { if (newForm.openedUrl === '') newForm.openedUrl = undefined; if (newForm.category === null) newForm.category = undefined; if (newForm.ping === true) newForm.ping = undefined; - if ( - (newForm.status.length === 1 && newForm.status[0] === '200') || - newForm.ping === false - ) { - delete newForm.status; - } // If service already exists, update it. if (config.services && config.services.find((s) => s.id === newForm.id)) { setConfig({ @@ -451,26 +437,10 @@ export function AddAppShelfItemForm(props: AddAppShelfItemFormProps) { - {form.values.ping && ( - - )} @@ -18,13 +33,16 @@ function SettingsMenu(props: any) { {t('tabs.customizations')} - + + {newVersionAvailable && } + - + + @@ -34,6 +52,17 @@ function SettingsMenu(props: any) { export function SettingsMenuButton(props: any) { useHotkeys([['ctrl+L', () => setOpened(!opened)]]); const { t } = useTranslation('settings/common'); + const [newVersionAvailable, setNewVersionAvailable] = useState(''); + useEffect(() => { + // Fetch Data here when component first mounted + fetch(`https://api.github.com/repos/${REPO_URL}/releases/latest`).then((res) => { + res.json().then((data) => { + if (data.tag_name > CURRENT_VERSION) { + setNewVersionAvailable(data.tag_name); + } + }); + }); + }, [CURRENT_VERSION]); const [opened, setOpened] = useState(false); @@ -47,21 +76,47 @@ export function SettingsMenuButton(props: any) { opened={props.opened || opened} onClose={() => setOpened(false)} > - - + - setOpened(true)} - > - - + + setOpened(true)} + > + + + ); } + +function NewUpdateIndicator({ newVersionAvailable }: { newVersionAvailable: string }) { + return ( + } + disallowClose + color="teal" + radius="md" + title="New update available" + hidden={newVersionAvailable === ''} + > + Version{' '} + + + {newVersionAvailable} + + {' '} + is available ! Current version: {CURRENT_VERSION} + + ); +} diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx deleted file mode 100644 index f1b58cd2a..000000000 --- a/src/components/layout/Footer.tsx +++ /dev/null @@ -1,74 +0,0 @@ -import React, { useEffect } from 'react'; -import { createStyles, Footer as FooterComponent } from '@mantine/core'; -import { showNotification } from '@mantine/notifications'; -import { IconAlertCircle as AlertCircle } from '@tabler/icons'; -import { CURRENT_VERSION, REPO_URL } from '../../../data/constants'; - -const useStyles = createStyles((theme) => ({ - footer: { - borderTop: `1px solid ${ - theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[2] - }`, - }, - - inner: { - display: 'flex', - justifyContent: 'space-between', - alignItems: 'center', - padding: `${theme.spacing.md}px ${theme.spacing.md}px`, - - [theme.fn.smallerThan('sm')]: { - flexDirection: 'column', - }, - }, - - links: { - [theme.fn.smallerThan('sm')]: { - marginTop: theme.spacing.lg, - marginBottom: theme.spacing.sm, - }, - }, -})); - -interface FooterCenteredProps { - links: { link: string; label: string }[]; -} - -export function Footer({ links }: FooterCenteredProps) { - useEffect(() => { - // Fetch Data here when component first mounted - fetch(`https://api.github.com/repos/${REPO_URL}/releases/latest`).then((res) => { - res.json().then((data) => { - if (data.tag_name > CURRENT_VERSION) { - showNotification({ - color: 'yellow', - autoClose: false, - title: 'New version available', - icon: , - message: `Version ${data.tag_name} is available, update now!`, - }); - } else if (data.tag_name < CURRENT_VERSION) { - showNotification({ - color: 'orange', - autoClose: 5000, - title: 'You are using a development version', - icon: , - message: 'This version of Homarr is still in development! Bugs are expected 🐛', - }); - } - }); - }); - }, []); - - return ( - - ); -} diff --git a/src/components/layout/Layout.tsx b/src/components/layout/Layout.tsx index 5e8f074e0..db29e482a 100644 --- a/src/components/layout/Layout.tsx +++ b/src/components/layout/Layout.tsx @@ -1,6 +1,5 @@ import { AppShell, createStyles } from '@mantine/core'; import { Header } from './header/Header'; -import { Footer } from './Footer'; import Aside from './Aside'; import Navbar from './Navbar'; import { HeaderConfig } from './header/HeaderConfig'; @@ -30,7 +29,6 @@ export default function Layout({ children, style }: any) { header={
} navbar={widgetPosition ? : undefined} aside={widgetPosition ? undefined :