diff --git a/src/core/react-query/settings/helpers.ts b/src/core/react-query/settings/helpers.ts index 503d82c61..65ea5f96c 100644 --- a/src/core/react-query/settings/helpers.ts +++ b/src/core/react-query/settings/helpers.ts @@ -316,6 +316,9 @@ export const initialSettings: SettingsType = { AVDumpKey: '', ClientPort: 4556, AVDumpClientPort: 4557, + HTTPServerUrl: '', + UDPServerAddress: '', + UDPServerPort: 9000, DownloadCharacters: false, DownloadCreators: false, DownloadRelatedAnime: false, diff --git a/src/core/types/api/settings.ts b/src/core/types/api/settings.ts index 71d9e1443..df204c7fc 100644 --- a/src/core/types/api/settings.ts +++ b/src/core/types/api/settings.ts @@ -18,6 +18,9 @@ export type SettingsAnidbType = { AVDumpKey: string; ClientPort: number; AVDumpClientPort: number; + HTTPServerUrl: string; + UDPServerAddress: string; + UDPServerPort: number; }; export type SettingsAnidbDownloadType = { diff --git a/src/pages/settings/SettingsPage.tsx b/src/pages/settings/SettingsPage.tsx index 8d24cc380..0a0c5e7d2 100644 --- a/src/pages/settings/SettingsPage.tsx +++ b/src/pages/settings/SettingsPage.tsx @@ -12,6 +12,7 @@ import toast from '@/components/Toast'; import { usePatchSettingsMutation } from '@/core/react-query/settings/mutations'; import { useSettingsQuery } from '@/core/react-query/settings/queries'; import { setItem as setMiscItem } from '@/core/slices/misc'; +import useEventCallback from '@/hooks/useEventCallback'; const items = [ { name: 'General', path: 'general' }, @@ -97,6 +98,23 @@ function SettingsPage() { updateSetting, }; + const validateAndPatchSettings = useEventCallback(() => { + const HttpServerUrl = newSettings.AniDb.HTTPServerUrl; + + if (!/^https?:\/\/\S+:\d+$/.test(HttpServerUrl)) { + toast.error( + 'Invalid HTTP Server URL', +
+ {'It must be in the following format: {scheme}://{address}:{port}'} + eg., http://api.anidb.net:9001 +
, + ); + return; + } + + patchSettings({ newSettings }); + }); + return (
@@ -139,7 +157,7 @@ function SettingsPage() { Cancel
-
- Port - updateSetting('AniDb', 'ClientPort', event.target.value)} - className="w-36 px-3 py-1" - /> -
AVDump Key
- AVDump Port + HTTP Server URL updateSetting('AniDb', 'AVDumpClientPort', event.target.value)} - className="w-36 px-3 py-1" + id="http-server-url" + value={HTTPServerUrl} + type="text" + onChange={event => updateSetting('AniDb', 'HTTPServerUrl', event.target.value)} + className="w-60 px-3 py-1" />