diff --git a/public/locales/en/layout/modals/add-app.json b/public/locales/en/layout/modals/add-app.json index 551f84dad..bed0d0630 100644 --- a/public/locales/en/layout/modals/add-app.json +++ b/public/locales/en/layout/modals/add-app.json @@ -24,7 +24,8 @@ "isOpeningNewTab": { "label": "Open in new tab", "description": "Open the app in a new tab instead of the current one." - } + }, + "customProtocolWarning": "Using a non-standard protocol. This may require pre-installed applications and can introduce security risks. Ensure that your address is secure and trusted." }, "network": { "statusChecker": { diff --git a/src/components/Dashboard/Modals/EditAppModal/EditAppModal.tsx b/src/components/Dashboard/Modals/EditAppModal/EditAppModal.tsx index c2dfa21f5..a618f6d2e 100644 --- a/src/components/Dashboard/Modals/EditAppModal/EditAppModal.tsx +++ b/src/components/Dashboard/Modals/EditAppModal/EditAppModal.tsx @@ -28,6 +28,9 @@ import { EditAppModalTab } from './Tabs/type'; const appUrlRegex = '(https?://(?:www.|(?!www))\\[?[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\\]?.[^\\s]{2,}|www.[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9].[^\\s]{2,}|https?://(?:www.|(?!www))\\[?[a-zA-Z0-9]+\\]?.[^\\s]{2,}|www.[a-zA-Z0-9]+.[^\\s]{2,})'; +const appUrlWithAnyProtocolRegex = + '([A-z]+://(?:www.|(?!www))\\[?[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\\]?.[^\\s]{2,}|www.[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9].[^\\s]{2,}|[A-z]+://(?:www.|(?!www))\\[?[a-zA-Z0-9]+\\]?.[^\\s]{2,}|www.[a-zA-Z0-9]+.[^\\s]{2,})'; + export const EditAppModal = ({ context, id, @@ -71,8 +74,8 @@ export const EditAppModal = ({ return null; } - if (!url.match(appUrlRegex)) { - return 'Uri override is not a valid uri'; + if (!url.match(appUrlWithAnyProtocolRegex)) { + return 'External URI is not a valid uri'; } return null; diff --git a/src/components/Dashboard/Modals/EditAppModal/Tabs/GeneralTab/GeneralTab.tsx b/src/components/Dashboard/Modals/EditAppModal/Tabs/GeneralTab/GeneralTab.tsx index fd5c2ea05..6bbc40a7b 100644 --- a/src/components/Dashboard/Modals/EditAppModal/Tabs/GeneralTab/GeneralTab.tsx +++ b/src/components/Dashboard/Modals/EditAppModal/Tabs/GeneralTab/GeneralTab.tsx @@ -1,4 +1,4 @@ -import { Tabs, TextInput } from '@mantine/core'; +import { Tabs, Text, TextInput } from '@mantine/core'; import { UseFormReturnType } from '@mantine/form'; import { IconClick, IconCursorText, IconLink } from '@tabler/icons-react'; import { useTranslation } from 'next-i18next'; @@ -22,6 +22,7 @@ export const GeneralTab = ({ form, openTab }: GeneralTabProps) => { placeholder="My example app" variant="default" withAsterisk + mb="md" {...form.getInputProps('name')} /> { placeholder="https://google.com" variant="default" withAsterisk + mb="md" {...form.getInputProps('url')} - onChange={(e) => { - form.setFieldValue('url', e.target.value); - }} /> } @@ -44,6 +43,13 @@ export const GeneralTab = ({ form, openTab }: GeneralTabProps) => { variant="default" {...form.getInputProps('behaviour.externalUrl')} /> + + {!form.values.behaviour.externalUrl.startsWith('https://') && + !form.values.behaviour.externalUrl.startsWith('http://') && ( + + {t('behaviour.customProtocolWarning')} + + )} ); };