Display active profile for default value

In case the profile was not set and the default value got used, there was no indication of the active profile.
This commit is contained in:
schroda
2024-12-12 02:09:19 +01:00
parent 7307a3350d
commit 858c3b4bcf
7 changed files with 39 additions and 10 deletions

View File

@@ -901,6 +901,7 @@
"width": "Fit width"
},
"profiles": {
"default_value": "$t(global.label.default) ({{profile}})",
"description": "Profiles are used to define the default reader settings which then can be used for series and reading modes",
"placeholder": "Comics | length: 16, chars: letters, numbers, -, _"
},

View File

@@ -33,6 +33,7 @@ export type ValueToDisplayData<Value extends string | number> = Record<Value, Di
export interface MultiValueButtonBaseProps<Value extends string | number> {
tooltip?: string;
defaultText?: string;
value: Value;
values: Value[];
setValue: (value: Value) => void;

View File

@@ -15,6 +15,7 @@ import { getNextRotationValue } from '@/modules/core/utils/ValueRotationButton.u
export const ValueRotationButton = <Value extends string | number>({
tooltip,
defaultText,
value,
values,
setValue,
@@ -44,7 +45,7 @@ export const ValueRotationButton = <Value extends string | number>({
startIcon={defaultIcon}
size="large"
>
{t('global.label.default')}
{defaultText ?? t('global.label.default')}
</Button>
) : (
<Button

View File

@@ -13,24 +13,33 @@ import { MultiValueButtonDefaultableProps } from '@/modules/core/Core.types.ts';
import { ValueRotationButton } from '@/modules/core/components/buttons/ValueRotationButton.tsx';
import {
createProfileValueToDisplayData,
getReaderProfile,
getValidReaderProfile,
} from '@/modules/reader/utils/ReaderSettings.utils.tsx';
import { DEFAULT_READER_PROFILE } from '@/modules/reader/constants/ReaderSettings.constants.tsx';
export const ReaderNavBarDesktopProfile = ({
defaultProfile,
profiles,
readingModesDefaultProfile,
readingMode,
updateSetting,
...buttonSelectInputProps
}: Pick<IReaderSettingsWithDefaultFlag, 'defaultProfile' | 'profiles'> &
}: Pick<IReaderSettingsWithDefaultFlag, 'defaultProfile' | 'profiles' | 'readingModesDefaultProfile' | 'readingMode'> &
Pick<MultiValueButtonDefaultableProps<string>, 'isDefaultable' | 'onDefault'> & {
updateSetting: (profile: string) => void;
}) => {
const { t } = useTranslation();
const activeProfile = getReaderProfile(defaultProfile, profiles, readingModesDefaultProfile, readingMode.value);
return (
<ValueRotationButton
{...buttonSelectInputProps}
tooltip={t('global.label.profile_one')}
defaultText={t('reader.settings.profiles.default_value', {
profile: activeProfile === DEFAULT_READER_PROFILE ? t('global.label.standard') : activeProfile,
})}
value={defaultProfile.isDefault ? undefined : getValidReaderProfile(defaultProfile.value, profiles)}
values={profiles}
setValue={updateSetting}

View File

@@ -22,6 +22,7 @@ export const ReaderNavBarDesktopQuickSettings = ({
settings: {
defaultProfile,
profiles,
readingModesDefaultProfile,
readingMode,
shouldOffsetDoubleSpreads,
pageScaleMode,
@@ -40,6 +41,8 @@ export const ReaderNavBarDesktopQuickSettings = ({
<ReaderNavBarDesktopProfile
defaultProfile={defaultProfile}
profiles={profiles}
readingModesDefaultProfile={readingModesDefaultProfile}
readingMode={readingMode}
updateSetting={(value) => updateSetting('defaultProfile', value)}
isDefaultable={isDefaultable}
onDefault={() => onDefault?.('defaultProfile')}

View File

@@ -37,7 +37,7 @@ import { ReaderViewer } from '@/modules/reader/components/viewer/ReaderViewer.ts
import { ReaderService } from '@/modules/reader/services/ReaderService.ts';
import { READER_BACKGROUND_TO_COLOR } from '@/modules/reader/constants/ReaderSettings.constants.tsx';
import { createPageData, createPagesData } from '@/modules/reader/utils/ReaderPager.utils.tsx';
import { getValidReaderProfile } from '@/modules/reader/utils/ReaderSettings.utils.tsx';
import { getReaderProfile } from '@/modules/reader/utils/ReaderSettings.utils.tsx';
import { ReaderHotkeys } from '@/modules/reader/components/ReaderHotkeys.tsx';
import { ReaderResumeMode, ReaderTransitionPageMode } from '@/modules/reader/types/Reader.types.ts';
import { getInitialReaderPageIndex } from '@/modules/reader/utils/Reader.utils.ts';
@@ -194,13 +194,11 @@ export const Reader = () => {
defaultSettings,
);
const profile = getValidReaderProfile(
settingsWithDefaultProfileFallback.defaultProfile.isDefault
? settingsWithDefaultProfileFallback.readingModesDefaultProfile[
settingsWithDefaultProfileFallback.readingMode.value
]
: settingsWithDefaultProfileFallback.defaultProfile.value,
const profile = getReaderProfile(
settingsWithDefaultProfileFallback.defaultProfile,
settingsWithDefaultProfileFallback.profiles,
settingsWithDefaultProfileFallback.readingModesDefaultProfile,
settingsWithDefaultProfileFallback.readingMode.value,
);
const profileSettings = getReaderSettings(

View File

@@ -7,7 +7,12 @@
*/
import ManageAccountsIcon from '@mui/icons-material/ManageAccounts';
import { IReaderSettings, ReaderPageScaleMode, ReadingMode } from '@/modules/reader/types/Reader.types.ts';
import {
IReaderSettings,
IReaderSettingsWithDefaultFlag,
ReaderPageScaleMode,
ReadingMode,
} from '@/modules/reader/types/Reader.types.ts';
import { DEFAULT_READER_PROFILE } from '@/modules/reader/constants/ReaderSettings.constants.tsx';
import { ValueToDisplayData } from '@/modules/core/Core.types.ts';
@@ -37,3 +42,14 @@ export const isReaderWidthEditable = (pageScaleMode: IReaderSettings['pageScaleM
export const isContinuousReadingMode = (readingMode: IReaderSettings['readingMode']): boolean =>
[ReadingMode.CONTINUOUS_VERTICAL, ReadingMode.CONTINUOUS_HORIZONTAL].includes(readingMode);
export const getReaderProfile = (
defaultProfile: IReaderSettingsWithDefaultFlag['defaultProfile'],
profiles: IReaderSettings['profiles'],
readingModesDefaultProfile: IReaderSettings['readingModesDefaultProfile'],
readingMode: IReaderSettings['readingMode'],
): string =>
getValidReaderProfile(
defaultProfile.isDefault ? readingModesDefaultProfile[readingMode] : defaultProfile.value,
profiles,
);