ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make "value" prop of setting components required

Browse Source
This commit is contained in:
schroda
2024-04-28 01:01:36 +02:00
parent f1ec97b0e6
commit ee0bf3c1e0
14 changed files with 87 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/settings/NumberSetting.tsx
View File

@@ -28,7 +28,7 @@ import { SxProps, Theme } from '@mui/material/styles';
type BaseProps = {
settingTitle: string;
settingValue?: string;
settingValue: string;
settingIcon?: React.ReactNode;
value: number;
defaultValue?: number;
@@ -117,7 +117,7 @@ export const NumberSetting = ({
{settingIcon ? <ListItemIcon>{settingIcon}</ListItemIcon> : null}
<ListItemText
primary={settingTitle}
secondary={settingValue ?? t('global.label.loading')}
secondary={settingValue}
sx={sx}
secondaryTypographyProps={{ style: { display: 'flex', flexDirection: 'column' } }}
/>

8
src/components/settings/SelectSetting.tsx
View File

@@ -36,15 +36,13 @@ export const SelectSetting = <SettingValue extends string | number>({
settingName,
dialogDescription,
value,
defaultValue,
values,
handleChange,
disabled = false,
}: {
settingName: string;
dialogDescription?: string;
value?: SettingValue;
defaultValue: SettingValue;
value: SettingValue;
values: SelectSettingValue<SettingValue>[];
handleChange: (value: SettingValue) => void;
disabled?: boolean;
@@ -52,7 +50,7 @@ export const SelectSetting = <SettingValue extends string | number>({
const { t } = useTranslation();
const [isDialogOpen, setIsDialogOpen] = useState(false);
const [dialogValue, setDialogValue] = useState(value ?? defaultValue);
const [dialogValue, setDialogValue] = useState(value);
const valueDisplayText = useMemo(() => values.find(([key]) => key === value)?.[1]?.text, [value]);
const dialogValueDisplayInfo = useMemo(() => values.find(([key]) => key === dialogValue)![1], [dialogValue]);
@@ -67,7 +65,7 @@ export const SelectSetting = <SettingValue extends string | number>({
const closeDialog = (resetValue: boolean = true) => {
if (resetValue) {
setDialogValue(value ?? defaultValue);
setDialogValue(value);
}
setIsDialogOpen(false);

10
src/components/settings/TimeSetting.tsx
View File

@@ -28,14 +28,14 @@ export const TimeSetting = ({
handleChange,
}: {
settingName: string;
value?: string;
value: string;
defaultValue: string;
handleChange: (path: string) => void;
}) => {
const { t, i18n } = useTranslation();
const [isDialogOpen, setIsDialogOpen] = useState(false);
const [dialogValue, setDialogValue] = useState(value ?? defaultValue);
const [dialogValue, setDialogValue] = useState(value);
const [locale, setLocale] = useState('en');
@@ -58,7 +58,7 @@ export const TimeSetting = ({
setIsDialogOpen(false);
if (resetValue) {
setDialogValue(value ?? defaultValue);
setDialogValue(value);
}
},
[value],
@@ -87,9 +87,7 @@ export const TimeSetting = ({
<ListItemButton onClick={() => setIsDialogOpen(true)}>
<ListItemText
primary={settingName}
secondary={
value ? dayjs(value, 'HH:mm').locale(currentLocale).format('LT') : t('global.label.loading')
}
secondary={dayjs(value, 'HH:mm').locale(currentLocale).format('LT')}
secondaryTypographyProps={{ style: { display: 'flex', flexDirection: 'column' } }}
/>
</ListItemButton>

9
src/components/settings/downloads/DeleteChaptersWhileReadingSetting.tsx
View File

@@ -42,11 +42,7 @@ const CHAPTERS_TO_DELETE_SELECT_VALUES: SelectSettingValue<(typeof CHAPTERS_TO_D
CHAPTERS_TO_DELETE_TO_TRANSLATION_KEY[chapterToDelete],
]);
const getNormalizedChapterToDelete = (chapterToDelete?: number | boolean) => {
if (chapterToDelete === undefined) {
return undefined;
}
const getNormalizedChapterToDelete = (chapterToDelete: number | boolean) => {
const isMigrationVersion0 = typeof chapterToDelete === 'boolean';
if (isMigrationVersion0) {
return Number(chapterToDelete);
@@ -59,7 +55,7 @@ export const DeleteChaptersWhileReadingSetting = ({
chapterToDelete,
handleChange,
}: {
chapterToDelete?: number;
chapterToDelete: number;
handleChange: (chapterToDelete: number) => void;
}) => {
const { t } = useTranslation();
@@ -70,7 +66,6 @@ export const DeleteChaptersWhileReadingSetting = ({
<SelectSetting
settingName={t('download.settings.delete_chapters.while_reading.label.title')}
value={normalizedChapterToDelete}
defaultValue={0}
values={CHAPTERS_TO_DELETE_SELECT_VALUES}
handleChange={handleChange}
/>

12
src/components/settings/downloads/DownloadAheadSetting.tsx
View File

@@ -56,14 +56,10 @@ export const DownloadAheadSetting = ({
</ListItem>
<NumberSetting
settingTitle={t('download.settings.download_ahead.label.unread_chapters_to_download')}
settingValue={
downloadAheadLimit !== undefined
? t('download.settings.download_ahead.label.value', {
chapters: currentDownloadAheadLimit,
count: currentDownloadAheadLimit,
})
: undefined
}
settingValue={t('download.settings.download_ahead.label.value', {
chapters: currentDownloadAheadLimit,
count: currentDownloadAheadLimit,
})}
value={currentDownloadAheadLimit}
minValue={MIN_LIMIT}
maxValue={MAX_LIMIT}

10
src/components/settings/globalUpdate/GlobalUpdateSettingsInterval.tsx
View File

@@ -61,13 +61,9 @@ export const GlobalUpdateSettingsInterval = ({
</ListItem>
<NumberSetting
settingTitle={t('library.settings.global_update.auto_update.interval.label.title')}
settingValue={
autoUpdateIntervalHours !== undefined
? t('library.settings.global_update.auto_update.interval.label.value', {
hours: currentAutoUpdateIntervalHours,
})
: undefined
}
settingValue={t('library.settings.global_update.auto_update.interval.label.value', {
hours: currentAutoUpdateIntervalHours,
})}
value={currentAutoUpdateIntervalHours}
minValue={MIN_INTERVAL_HOURS}
maxValue={MAX_INTERVAL_HOURS}

12
src/components/settings/text/TextSetting.tsx
View File

@@ -9,16 +9,14 @@
import ListItemText from '@mui/material/ListItemText';
import ListItemButton from '@mui/material/ListItemButton';
import { useState } from 'react';
import { useTranslation } from 'react-i18next';
import { TextSettingDialog, TextSettingDialogProps } from '@/components/settings/text/TextSettingDialog.tsx';
export type TextSettingProps = Omit<TextSettingDialogProps, 'isDialogOpen' | 'setIsDialogOpen'> & {
disabled?: boolean;
};
export type TextSettingProps = Omit<TextSettingDialogProps, 'isDialogOpen' | 'setIsDialogOpen' | 'value'> &
Required<Pick<TextSettingDialogProps, 'value'>> & {
disabled?: boolean;
};
export const TextSetting = (props: TextSettingProps) => {
const { t } = useTranslation();
const [isDialogOpen, setIsDialogOpen] = useState(false);
const { settingName, value, isPassword = false, disabled = false } = props;
@@ -28,7 +26,7 @@ export const TextSetting = (props: TextSettingProps) => {
<ListItemButton disabled={disabled} onClick={() => setIsDialogOpen(true)}>
<ListItemText
primary={settingName}
secondary={isPassword ? value?.replace(/./g, '*') : value ?? t('global.label.loading')}
secondary={isPassword ? value.replace(/./g, '*') : value}
secondaryTypographyProps={{
sx: { display: 'flex', flexDirection: 'column', wordWrap: 'break-word' },
}}

10
src/components/settings/webUI/WebUIUpdateIntervalSetting.tsx
View File

@@ -67,13 +67,9 @@ export const WebUIUpdateIntervalSetting = ({
</ListItem>
<NumberSetting
settingTitle={t('settings.webui.auto_update.label.interval')}
settingValue={
updateCheckInterval !== undefined
? t('library.settings.global_update.auto_update.interval.label.value', {
hours: currentUpdateCheckInterval,
})
: undefined
}
settingValue={t('library.settings.global_update.auto_update.interval.label.value', {
hours: currentUpdateCheckInterval,
})}
value={currentUpdateCheckInterval}
minValue={MIN_VALUE}
maxValue={MAX_VALUE}

1
src/components/tracker/TrackerActiveCard.tsx
View File

@@ -267,7 +267,6 @@ export const TrackerActiveCard = ({
<Divider orientation="vertical" flexItem />
<SelectSetting<string>
settingName={t('tracking.track_record.label.score')}
defaultValue={tracker.scores[0]}
value={currentScore}
values={selectSettingValues}
handleChange={(score) => updateTrackerBind({ scoreString: score })}

32
src/screens/settings/Backup.tsx
View File

@@ -44,11 +44,7 @@ const extractBackupSettings = (settings: ServerSettings): BackupSettingsType =>
backupTTL: settings.backupTTL,
});
const getBackupCleanupDisplayValue = (ttl?: number) => {
if (ttl === undefined) {
return undefined;
}
const getBackupCleanupDisplayValue = (ttl: number): string => {
if (ttl === 0) {
return translate('global.label.never');
}
@@ -81,8 +77,6 @@ export function Backup() {
} = requestManager.useGetServerSettings({ notifyOnNetworkStatusChange: true });
const [mutateSettings] = requestManager.useUpdateServerSettings();
const backupSettings = settingsData ? extractBackupSettings(settingsData.settings) : undefined;
const { data } = requestManager.useGetBackupRestoreStatus(backupRestoreId ?? '', {
skip: !backupRestoreId,
pollInterval: 1000,
@@ -245,6 +239,8 @@ export function Backup() {
);
}
const backupSettings = extractBackupSettings(settingsData!.settings);
return (
<>
<List sx={{ padding: 0 }}>
@@ -278,26 +274,22 @@ export function Backup() {
<TextSetting
settingName={t('settings.backup.automated.location.label.title')}
dialogDescription={t('settings.backup.automated.location.label.description')}
value={backupSettings?.backupPath}
value={backupSettings.backupPath}
handleChange={(path) => updateSetting('backupPath', path)}
/>
<TimeSetting
settingName={t('settings.backup.automated.label.time')}
value={backupSettings?.backupTime}
value={backupSettings.backupTime}
defaultValue="00:00"
handleChange={(time: string) => updateSetting('backupTime', time)}
/>
<NumberSetting
settingTitle={t('settings.backup.automated.label.interval')}
settingValue={
backupSettings?.backupInterval
? t('global.date.value.label.day', {
days: backupSettings.backupInterval,
count: backupSettings.backupInterval,
})
: undefined
}
value={backupSettings?.backupInterval ?? 1}
settingValue={t('global.date.value.label.day', {
days: backupSettings.backupInterval,
count: backupSettings.backupInterval,
})}
value={backupSettings.backupInterval}
defaultValue={1}
minValue={1}
maxValue={31}
@@ -308,8 +300,8 @@ export function Backup() {
/>
<NumberSetting
settingTitle={t('settings.backup.automated.cleanup.label.title')}
settingValue={getBackupCleanupDisplayValue(backupSettings?.backupTTL)}
value={backupSettings?.backupTTL ?? 14}
settingValue={getBackupCleanupDisplayValue(backupSettings.backupTTL)}
value={backupSettings.backupTTL}
defaultValue={14}
minValue={0}
maxValue={1000}

13
src/screens/settings/BrowseSettings.tsx
View File

@@ -51,7 +51,6 @@ export const BrowseSettings = () => {
const { data, loading, error, refetch } = requestManager.useGetServerSettings({
notifyOnNetworkStatusChange: true,
});
const serverSettings = data ? extractBrowseSettings(data.settings) : undefined;
const [mutateSettings] = requestManager.useUpdateServerSettings();
const updateSetting = <Setting extends keyof ExtensionsSettings>(
@@ -80,6 +79,8 @@ export const BrowseSettings = () => {
);
}
const serverSettings = extractBrowseSettings(data!.settings);
return (
<List>
<ListItem>
@@ -100,11 +101,11 @@ export const BrowseSettings = () => {
<NumberSetting
settingTitle={t('settings.server.requests.sources.parallel.label.title')}
settingValue={t('settings.server.requests.sources.parallel.label.value', {
value: serverSettings?.maxSourcesInParallel,
count: serverSettings?.maxSourcesInParallel,
value: serverSettings.maxSourcesInParallel,
count: serverSettings.maxSourcesInParallel,
})}
valueUnit={t('source.title')}
value={serverSettings?.maxSourcesInParallel ?? 6}
value={serverSettings.maxSourcesInParallel}
defaultValue={6}
minValue={1}
maxValue={20}
@@ -128,7 +129,7 @@ export const BrowseSettings = () => {
updateSetting('extensionRepos', repos);
requestManager.clearExtensionCache();
}}
valueInfos={serverSettings?.extensionRepos.map((extensionRepo) => [extensionRepo]) as [string][]}
valueInfos={serverSettings.extensionRepos.map((extensionRepo) => [extensionRepo]) as [string][]}
addItemButtonTitle={t('extension.settings.repositories.custom.dialog.action.button.add')}
placeholder="https://github.com/MY_ACCOUNT/MY_REPO/tree/repo"
validateItem={(repo) =>
@@ -141,7 +142,7 @@ export const BrowseSettings = () => {
<TextSetting
settingName={t('settings.server.local_source.path.label.title')}
dialogDescription={t('settings.server.local_source.path.label.description')}
value={serverSettings?.localSourcePath}
value={serverSettings.localSourcePath}
handleChange={(path) => updateSetting('localSourcePath', path)}
/>
</List>

15
src/screens/settings/DownloadSettings.tsx
View File

@@ -188,15 +188,12 @@ export const DownloadSettings = () => {
dialogDescription={t('download.settings.auto_download.download_limit.label.description')}
value={downloadSettings?.autoDownloadNewChaptersLimit ?? 0}
settingValue={
// eslint-disable-next-line no-nested-ternary
downloadSettings?.autoDownloadNewChaptersLimit !== undefined
? !downloadSettings.autoDownloadNewChaptersLimit
? t('global.label.none')
: t('download.settings.download_ahead.label.value', {
chapters: downloadSettings.autoDownloadNewChaptersLimit,
count: downloadSettings.autoDownloadNewChaptersLimit,
})
: undefined
!downloadSettings.autoDownloadNewChaptersLimit
? t('global.label.none')
: t('download.settings.download_ahead.label.value', {
chapters: downloadSettings.autoDownloadNewChaptersLimit,
count: downloadSettings.autoDownloadNewChaptersLimit,
})
}
defaultValue={0}
minValue={0}

56
src/screens/settings/ServerSettings.tsx
View File

@@ -89,7 +89,6 @@ export const ServerSettings = () => {
const { data, loading, error, refetch } = requestManager.useGetServerSettings({
notifyOnNetworkStatusChange: true,
});
const serverSettings = data ? extractServerSettings(data.settings) : undefined;
const [mutateSettings] = requestManager.useUpdateServerSettings();
const [serverAddress, setServerAddress] = useLocalStorage<string>('serverBaseURL', window.location.origin);
@@ -121,6 +120,8 @@ export const ServerSettings = () => {
);
}
const serverSettings = extractServerSettings(data!.settings);
return (
<List>
<List
@@ -147,14 +148,14 @@ export const ServerSettings = () => {
<TextSetting
settingName={t('settings.server.address.server.label.ip')}
handleChange={(ip) => updateSetting('ip', ip)}
value={serverSettings?.ip}
value={serverSettings.ip}
placeholder="0.0.0.0"
/>
<NumberSetting
settingTitle={t('settings.server.address.server.label.port')}
settingValue={serverSettings?.port.toString()}
settingValue={serverSettings.port.toString()}
handleUpdate={(port) => updateSetting('port', port)}
value={serverSettings?.port ?? 4567}
value={serverSettings.port}
defaultValue={4567}
valueUnit={t('settings.server.address.server.label.port')}
/>
@@ -170,14 +171,13 @@ export const ServerSettings = () => {
<ListItemText primary={t('settings.server.socks_proxy.label.enable')} />
<Switch
edge="end"
checked={!!serverSettings?.socksProxyEnabled}
checked={serverSettings.socksProxyEnabled}
onChange={(e) => updateSetting('socksProxyEnabled', e.target.checked)}
/>
</ListItem>
<SelectSetting<number>
settingName={t('settings.server.socks_proxy.label.version')}
value={serverSettings?.socksProxyVersion}
defaultValue={5}
value={serverSettings.socksProxyVersion}
values={[
[4, { text: '4' }],
[5, { text: '5' }],
@@ -186,22 +186,22 @@ export const ServerSettings = () => {
/>
<TextSetting
settingName={t('settings.server.socks_proxy.label.host')}
value={serverSettings?.socksProxyHost}
value={serverSettings.socksProxyHost}
handleChange={(proxyHost) => updateSetting('socksProxyHost', proxyHost)}
/>
<TextSetting
settingName={t('settings.server.socks_proxy.label.port')}
value={serverSettings?.socksProxyPort}
value={serverSettings.socksProxyPort}
handleChange={(proxyPort) => updateSetting('socksProxyPort', proxyPort)}
/>
<TextSetting
settingName={t('settings.server.socks_proxy.label.username')}
value={serverSettings?.socksProxyUsername}
value={serverSettings.socksProxyUsername}
handleChange={(proxyUsername) => updateSetting('socksProxyUsername', proxyUsername)}
/>
<TextSetting
settingName={t('settings.server.socks_proxy.label.password')}
value={serverSettings?.socksProxyPassword}
value={serverSettings.socksProxyPassword}
handleChange={(proxyPassword) => updateSetting('socksProxyPassword', proxyPassword)}
isPassword
/>
@@ -217,18 +217,18 @@ export const ServerSettings = () => {
<ListItemText primary={t('settings.server.auth.basic.label.enable')} />
<Switch
edge="end"
checked={!!serverSettings?.basicAuthEnabled}
checked={serverSettings.basicAuthEnabled}
onChange={(e) => updateSetting('basicAuthEnabled', e.target.checked)}
/>
</ListItem>
<TextSetting
settingName={t('settings.server.auth.basic.label.username')}
value={serverSettings?.basicAuthUsername}
value={serverSettings.basicAuthUsername}
handleChange={(authUsername) => updateSetting('basicAuthUsername', authUsername)}
/>
<TextSetting
settingName={t('settings.server.auth.basic.label.password')}
value={serverSettings?.basicAuthPassword}
value={serverSettings.basicAuthPassword}
isPassword
handleChange={(authPassword) => updateSetting('basicAuthPassword', authPassword)}
/>
@@ -259,25 +259,21 @@ export const ServerSettings = () => {
/>
<Switch
edge="end"
checked={!!serverSettings?.flareSolverrEnabled}
checked={serverSettings.flareSolverrEnabled}
onChange={(e) => updateSetting('flareSolverrEnabled', e.target.checked)}
/>
</ListItem>
<TextSetting
settingName={t('settings.server.cloudflare.flaresolverr.url.label.title')}
dialogDescription={t('settings.server.cloudflare.flaresolverr.url.label.description')}
value={serverSettings?.flareSolverrUrl}
value={serverSettings.flareSolverrUrl}
handleChange={(url) => updateSetting('flareSolverrUrl', url)}
/>
<NumberSetting
settingTitle={t('settings.server.cloudflare.flaresolverr.timeout.label.title')}
settingValue={
serverSettings?.flareSolverrTimeout !== undefined
? t('global.time.seconds.value', { count: serverSettings.flareSolverrTimeout })
: undefined
}
settingValue={t('global.time.seconds.value', { count: serverSettings.flareSolverrTimeout })}
dialogDescription={t('settings.server.cloudflare.flaresolverr.timeout.label.description')}
value={serverSettings?.flareSolverrTimeout ?? 60}
value={serverSettings.flareSolverrTimeout}
defaultValue={60}
minValue={20}
maxValue={60 * 5}
@@ -288,18 +284,14 @@ export const ServerSettings = () => {
/>
<TextSetting
settingName={t('settings.server.cloudflare.flaresolverr.session.name.label.title')}
value={serverSettings?.flareSolverrSessionName}
value={serverSettings.flareSolverrSessionName}
handleChange={(sessionName) => updateSetting('flareSolverrSessionName', sessionName)}
/>
<NumberSetting
settingTitle={t('settings.server.cloudflare.flaresolverr.session.ttl.label.title')}
settingValue={
serverSettings?.flareSolverrTimeout !== undefined
? t('global.time.minutes.value', { count: serverSettings.flareSolverrSessionTtl })
: undefined
}
settingValue={t('global.time.minutes.value', { count: serverSettings.flareSolverrSessionTtl })}
dialogDescription={t('settings.server.cloudflare.flaresolverr.session.ttl.label.description')}
value={serverSettings?.flareSolverrSessionTtl ?? 15}
value={serverSettings.flareSolverrSessionTtl}
defaultValue={15}
minValue={1}
maxValue={60}
@@ -320,7 +312,7 @@ export const ServerSettings = () => {
<ListItemText primary={t('settings.server.misc.log_level.label.server')} />
<Switch
edge="end"
checked={!!serverSettings?.debugLogsEnabled}
checked={serverSettings.debugLogsEnabled}
onChange={(e) => updateSetting('debugLogsEnabled', e.target.checked)}
/>
</ListItem>
@@ -331,7 +323,7 @@ export const ServerSettings = () => {
/>
<Switch
edge="end"
checked={!!serverSettings?.gqlDebugLogsEnabled}
checked={serverSettings.gqlDebugLogsEnabled}
onChange={(e) => updateSetting('gqlDebugLogsEnabled', e.target.checked)}
/>
</ListItem>
@@ -342,7 +334,7 @@ export const ServerSettings = () => {
/>
<Switch
edge="end"
checked={!!serverSettings?.systemTrayEnabled}
checked={serverSettings.systemTrayEnabled}
onChange={(e) => updateSetting('systemTrayEnabled', e.target.checked)}
/>
</ListItem>

24
src/screens/settings/WebUISettings.tsx
View File

@@ -130,11 +130,8 @@ export const WebUISettings = () => {
const { data, loading, error, refetch } = requestManager.useGetServerSettings({
notifyOnNetworkStatusChange: true,
});
const webUISettings = data ? extractWebUISettings(data.settings) : undefined;
const [mutateSettings] = requestManager.useUpdateServerSettings();
const isDefaultWebUI = webUISettings?.webUIFlavor === WebUiFlavor.Webui;
const updateSetting = <Setting extends keyof WebUISettingsType>(
setting: Setting,
value: WebUISettingsType[Setting],
@@ -160,12 +157,14 @@ export const WebUISettings = () => {
);
}
const webUISettings = extractWebUISettings(data!.settings);
const isDefaultWebUI = webUISettings.webUIFlavor === WebUiFlavor.Webui;
return (
<List>
<SelectSetting<WebUiFlavor>
settingName={t('settings.webui.flavor.label.title')}
value={webUISettings?.webUIFlavor}
defaultValue={WebUiFlavor.Webui}
value={webUISettings.webUIFlavor}
values={FLAVOR_SELECT_VALUES}
handleChange={(flavor) => updateSetting('webUIFlavor', flavor)}
/>
@@ -173,32 +172,33 @@ export const WebUISettings = () => {
<ListItemText primary={t('settings.webui.label.initial_open_browser')} />
<Switch
edge="end"
checked={!!webUISettings?.initialOpenInBrowserEnabled}
checked={webUISettings.initialOpenInBrowserEnabled}
onChange={(e) => updateSetting('initialOpenInBrowserEnabled', e.target.checked)}
/>
</ListItem>
<SelectSetting<WebUiInterface>
settingName={t('settings.webui.interface.label.title')}
value={webUISettings?.webUIInterface}
defaultValue={WebUiInterface.Browser}
value={webUISettings.webUIInterface}
values={INTERFACE_SELECT_VALUES}
handleChange={(webUIInterface) => updateSetting('webUIInterface', webUIInterface)}
/>
<TextSetting
settingName={t('settings.webui.electron_path.label.title')}
dialogDescription={t('settings.webui.electron_path.label.description')}
value={webUISettings?.electronPath}
value={webUISettings.electronPath}
handleChange={(path) => updateSetting('electronPath', path)}
/>
<SelectSetting<WebUiChannel>
settingName={t('settings.webui.channel.label.title')}
value={webUISettings?.webUIChannel}
defaultValue={WebUiChannel.Stable}
value={webUISettings.webUIChannel}
values={CHANNEL_SELECT_VALUES}
handleChange={(channel) => updateSetting('webUIChannel', channel)}
disabled={!isDefaultWebUI}
/>
<WebUIUpdateIntervalSetting disabled={!isDefaultWebUI} />
<WebUIUpdateIntervalSetting
disabled={!isDefaultWebUI}
updateCheckInterval={data!.settings.webUIUpdateCheckInterval}
/>
</List>
);
};