diff --git a/public/locales/en.json b/public/locales/en.json index b2abb1c7..334c2832 100644 --- a/public/locales/en.json +++ b/public/locales/en.json @@ -940,6 +940,7 @@ "ltr": "Left to right", "rtl": "Right to left" }, + "source_series": "Series settings", "tap_zones": { "edge": "Edge", "invert": "Invert tap zones", diff --git a/src/modules/reader/components/settings/ReaderSettingsTabs.tsx b/src/modules/reader/components/settings/ReaderSettingsTabs.tsx index 945bbf65..d7aa2b1c 100644 --- a/src/modules/reader/components/settings/ReaderSettingsTabs.tsx +++ b/src/modules/reader/components/settings/ReaderSettingsTabs.tsx @@ -87,7 +87,6 @@ const BaseReaderSettingsTabs = ({ return ( updateSetting(...args)} /> @@ -102,6 +101,7 @@ const BaseReaderSettingsTabs = ({ setShowPreview={setShowPreview!} isDefaultable={!areDefaultSettings} onDefault={(...args) => deleteSetting?.(...args)} + isSeriesMode /> ); diff --git a/src/modules/reader/components/settings/layout/ReaderDefaultLayoutSettings.tsx b/src/modules/reader/components/settings/layout/ReaderDefaultLayoutSettings.tsx index dcfda334..5b73666d 100644 --- a/src/modules/reader/components/settings/layout/ReaderDefaultLayoutSettings.tsx +++ b/src/modules/reader/components/settings/layout/ReaderDefaultLayoutSettings.tsx @@ -16,27 +16,35 @@ import { READING_MODE_VALUES, } from '@/modules/reader/constants/ReaderSettings.constants.tsx'; import { ReaderSettingReadingMode } from '@/modules/reader/components/settings/layout/ReaderSettingReadingMode.tsx'; +import { IReaderSettingsWithDefaultFlag, ReadingMode } from '@/modules/reader/types/Reader.types.ts'; -export const ReaderDefaultLayoutSettings = ( - props: Omit, 'setShowPreview'>, -) => { - const { settings, updateSetting } = props; +export const ReaderDefaultLayoutSettings = ({ + profiles = READING_MODE_VALUES, + readingMode, + ...props +}: Omit, 'setShowPreview' | 'settings'> & { + profiles?: ReadingMode[]; + readingMode?: IReaderSettingsWithDefaultFlag['readingMode']; +}) => { + const { updateSetting, isSeriesMode } = props; const { t } = useTranslation(); return ( - - - updateSetting('readingMode', value)} - /> - - {READING_MODE_VALUES.map((readingMode) => ( + + {readingMode !== undefined && ( + + updateSetting('readingMode', value)} + /> + + )} + {profiles.map((profile) => ( ))} diff --git a/src/modules/reader/components/settings/layout/ReaderLayoutSettings.tsx b/src/modules/reader/components/settings/layout/ReaderLayoutSettings.tsx index 5d4ae94f..519caf1f 100644 --- a/src/modules/reader/components/settings/layout/ReaderLayoutSettings.tsx +++ b/src/modules/reader/components/settings/layout/ReaderLayoutSettings.tsx @@ -7,6 +7,9 @@ */ import Stack from '@mui/material/Stack'; +import Typography from '@mui/material/Typography'; +import Divider from '@mui/material/Divider'; +import { useTranslation } from 'react-i18next'; import { ReaderSettingReadingMode } from '@/modules/reader/components/settings/layout/ReaderSettingReadingMode.tsx'; import { ReaderSettingReadingDirection } from '@/modules/reader/components/settings/layout/ReaderSettingReadingDirection.tsx'; import { ReaderSettingTapZoneLayout } from '@/modules/reader/components/settings/layout/ReaderSettingTapZoneLayout.tsx'; @@ -18,6 +21,7 @@ import { ReaderSettingPageGap } from '@/modules/reader/components/settings/layou import { ReaderSettingWidth } from '@/modules/reader/components/settings/layout/ReaderSettingWidth.tsx'; import { DefaultSettingFootnote } from '@/modules/reader/components/settings/DefaultSettingFootnote.tsx'; import { TReaderTapZoneContext } from '@/modules/reader/types/TapZoneLayout.types.ts'; +import { ReaderDefaultLayoutSettings } from '@/modules/reader/components/settings/layout/ReaderDefaultLayoutSettings.tsx'; export const ReaderLayoutSettings = ({ setShowPreview, @@ -25,73 +29,92 @@ export const ReaderLayoutSettings = ({ updateSetting, isDefaultable, onDefault, + isSeriesMode, }: ReaderSettingsTypeProps & { setShowPreview: TReaderTapZoneContext['setShowPreview']; -}) => ( - - - {isDefaultable && ( - { + const { t } = useTranslation(); + + return ( + + + {isSeriesMode && ( + <> + {t('reader.settings.source_series')} + updateSetting('readingMode', value)} + isDefaultable={isDefaultable} + onDefault={() => onDefault?.('readingMode')} + /> + + )} + updateSetting('readingMode', value)} isDefaultable={isDefaultable} - onDefault={() => onDefault?.('readingMode')} + onDefault={() => onDefault?.('pageGap')} + updateSetting={(...args) => updateSetting('pageGap', ...args)} /> - )} - onDefault?.('pageGap')} - updateSetting={(...args) => updateSetting('pageGap', ...args)} - /> - updateSetting('readingDirection', value)} - isDefaultable={isDefaultable} - onDefault={() => onDefault?.('readingDirection')} - /> - { - setShowPreview(true); - updateSetting('tapZoneLayout', value); - }} - isDefaultable={isDefaultable} - onDefault={() => { - setShowPreview(true); - onDefault?.('tapZoneLayout'); - }} - /> - { - setShowPreview(true); - updateSetting('tapZoneInvertMode', value); - }} - isDefaultable={isDefaultable} - onDefault={() => { - setShowPreview(true); - onDefault?.('tapZoneInvertMode'); - }} - /> - updateSetting('pageScaleMode', value)} - isDefaultable={isDefaultable} - onDefault={() => onDefault?.('pageScaleMode')} - /> - updateSetting('shouldStretchPage', value)} - /> - onDefault?.('readerWidth')} - updateSetting={(...args) => updateSetting(...args)} - /> - -); + updateSetting('readingDirection', value)} + isDefaultable={isDefaultable} + onDefault={() => onDefault?.('readingDirection')} + /> + { + setShowPreview(true); + updateSetting('tapZoneLayout', value); + }} + isDefaultable={isDefaultable} + onDefault={() => { + setShowPreview(true); + onDefault?.('tapZoneLayout'); + }} + /> + { + setShowPreview(true); + updateSetting('tapZoneInvertMode', value); + }} + isDefaultable={isDefaultable} + onDefault={() => { + setShowPreview(true); + onDefault?.('tapZoneInvertMode'); + }} + /> + updateSetting('pageScaleMode', value)} + isDefaultable={isDefaultable} + onDefault={() => onDefault?.('pageScaleMode')} + /> + updateSetting('shouldStretchPage', value)} + /> + onDefault?.('readerWidth')} + updateSetting={(...args) => updateSetting(...args)} + /> + {isSeriesMode && ( + <> + + + + )} + + ); +}; diff --git a/src/modules/reader/components/settings/layout/profiles/ReaderSettingProfileSettings.tsx b/src/modules/reader/components/settings/layout/profiles/ReaderSettingProfileSettings.tsx index bb754962..5e16407c 100644 --- a/src/modules/reader/components/settings/layout/profiles/ReaderSettingProfileSettings.tsx +++ b/src/modules/reader/components/settings/layout/profiles/ReaderSettingProfileSettings.tsx @@ -9,6 +9,7 @@ import Stack from '@mui/material/Stack'; import ListSubheader from '@mui/material/ListSubheader'; import { ComponentProps, useMemo } from 'react'; +import Typography from '@mui/material/Typography'; import { ReaderLayoutSettings } from '@/modules/reader/components/settings/layout/ReaderLayoutSettings.tsx'; import { useDefaultReaderSettingsWithDefaultFlag } from '@/modules/reader/services/ReaderSettingsMetadata.ts'; import { ReadingMode } from '@/modules/reader/types/Reader.types.ts'; @@ -17,8 +18,12 @@ export const ReaderSettingProfileSettings = ({ profile, title, updateSetting, + isSeriesMode, ...props -}: Pick, 'updateSetting'> & { profile: ReadingMode; title: string }) => { +}: Pick, 'updateSetting' | 'isSeriesMode'> & { + profile: ReadingMode; + title: string; +}) => { const { settings } = useDefaultReaderSettingsWithDefaultFlag(profile); const adjustedSettings = useMemo( @@ -34,10 +39,14 @@ export const ReaderSettingProfileSettings = ({ return ( - - {title} - - + {!isSeriesMode ? ( + + {title} + + ) : ( + {title} + )} + {}}