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

Simplify disabling image processing for mime-type

Browse Source
This commit is contained in:
schroda
2025-12-23 02:31:25 +01:00
parent 5def0ea818
commit 8da12f7a6e
6 changed files with 128 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
public/locales/en.json
View File

@@ -217,7 +217,7 @@
"call_timeout": "Call timeout",
"compression_level": "Compression level",
"connect_timeout": "Connect timeout",
"description": "In case no MIME-Type is defined, the \"default\" one will be used for the processing.\nSet \"{{value}}\" as the target type to disable processing for a MIME-Type",
"description": "In case no MIME-Type is defined, the \"default\" one will be used for the processing.\nSet the target mode to disabled to prevent processing for a MIME-Type",
"headers": {
"button": "Headers ({{count}})",
"name": "Name",

11
src/features/settings/ImageProcessing.utils.ts
View File

@@ -18,6 +18,7 @@ import {
IMAGE_PROCESSING_COMPRESSION,
IMAGE_PROCESSING_CONNECT_TIMEOUT,
MIME_TYPE_PREFIX,
TARGET_DISABLED,
} from '@/features/settings/Settings.constants.ts';
import {
SettingsDownloadConversion,
@@ -92,7 +93,13 @@ export const containsInvalidConversion = (conversions: TSettingsDownloadConversi
);
export const getTargetMode = (target: string): ImageProcessingTargetMode => {
if (isUrlTargetMode(target)) {
const normalizedTargetMode = normalizeMimeType(target);
if (normalizedTargetMode === TARGET_DISABLED) {
return ImageProcessingTargetMode.DISABLED;
}
if (isUrlTargetMode(normalizedTargetMode)) {
return ImageProcessingTargetMode.URL;
}
@@ -115,7 +122,7 @@ export const addStableIdToConversions = (
// eslint-disable-next-line no-plusplus
id: (conversion as TSettingsDownloadConversion).id ?? COUNTER++,
...conversion,
mode: getTargetMode(conversion.target),
mode: getTargetMode(normalizeMimeType(conversion.target)),
headers: conversion.headers ? addStableIdToHeaders(conversion.headers) : null,
}));

4
src/features/settings/Settings.constants.ts
View File

@@ -283,6 +283,9 @@ const IMAGE_PROCESSING_TARGET_MODES = Object.values(ImageProcessingTargetMode);
const IMAGE_PROCESSING_TARGET_MODES_TO_TRANSLATION_KEY: {
[flavor in ImageProcessingTargetMode]: SelectSettingValueDisplayInfo;
} = {
[ImageProcessingTargetMode.DISABLED]: {
text: 'global.label.disabled',
},
[ImageProcessingTargetMode.IMAGE]: {
text: 'download.settings.conversion.target_modes.image.title',
description: 'download.settings.conversion.target_modes.image.description',
@@ -298,6 +301,7 @@ export const IMAGE_PROCESSING_TARGET_MODES_SELECT_VALUES: SelectSettingValue<Ima
export const IMAGE_PROCESSING_INPUT_WIDTH = 250;
export const DEFAULT_MIME_TYPE = 'default';
export const MIME_TYPE_PREFIX = 'image/';
export const TARGET_DISABLED = 'none';
export const IMAGE_PROCESSING_TYPE_TO_TRANSLATION: Record<ImageProcessingType, TranslationKey> = {
[ImageProcessingType.DOWNLOAD]: 'download.settings.conversion.title',

1
src/features/settings/Settings.types.ts
View File

@@ -60,6 +60,7 @@ export type GlobalUpdateSkipEntriesSettings = Pick<
export type LibrarySettingsType = Pick<ServerSettings, 'updateMangas'>;
export enum ImageProcessingTargetMode {
DISABLED = 'disabled',
IMAGE = 'image',
URL = 'url',
}

22
src/features/settings/components/images/Processing.tsx
View File

@@ -29,6 +29,7 @@ import {
IMAGE_PROCESSING_CONNECT_TIMEOUT,
IMAGE_PROCESSING_INPUT_WIDTH,
IMAGE_PROCESSING_TARGET_MODES_SELECT_VALUES,
TARGET_DISABLED,
} from '@/features/settings/Settings.constants.ts';
import { Select } from '@/base/components/inputs/Select.tsx';
import { TypographyMaxLines } from '@/base/components/texts/TypographyMaxLines.tsx';
@@ -58,6 +59,7 @@ export const Processing = ({
const [areHeadersCollapsed, setAreHeadersCollapsed] = useState(true);
const isDisabledMode = mode === ImageProcessingTargetMode.DISABLED;
const isImageMode = mode === ImageProcessingTargetMode.IMAGE;
const isCallTimeoutValid = isValidCallTimeoutSetting(callTimeout);
@@ -124,6 +126,8 @@ export const Processing = ({
onChange({
...conversion,
mode: e.target.value,
target:
e.target.value === ImageProcessingTargetMode.DISABLED ? TARGET_DISABLED : '',
})
}
>
@@ -134,6 +138,7 @@ export const Processing = ({
))}
</Select>
</FormControl>
{!isDisabledMode && (
<MimeTypeTextField
mode={mode}
shouldAutoFocus={false}
@@ -148,7 +153,14 @@ export const Processing = ({
})
}
/>
{isImageMode ? (
)}
{(() => {
if (isDisabledMode) {
return null;
}
if (isImageMode) {
return (
<TextField
sx={{ width: IMAGE_PROCESSING_INPUT_WIDTH }}
label={t('download.settings.conversion.compression_level')}
@@ -168,7 +180,10 @@ export const Processing = ({
});
}}
/>
) : (
);
}
return (
<>
<TextField
sx={{ width: IMAGE_PROCESSING_INPUT_WIDTH }}
@@ -232,7 +247,8 @@ export const Processing = ({
})}
</Button>
</>
)}
);
})()}
</Stack>
<CustomTooltip disabled={isDisabled} title={t('chapter.action.download.delete.label.action')}>
<IconButton

3
src/features/settings/screens/ImageProcessingSetting.tsx
View File

@@ -14,6 +14,7 @@ import Button from '@mui/material/Button';
import {
IMAGE_PROCESSING_TYPE_TO_SETTING,
IMAGE_PROCESSING_TYPE_TO_TRANSLATION,
TARGET_DISABLED,
} from '@/features/settings/Settings.constants.ts';
import { requestManager } from '@/lib/requests/RequestManager.ts';
import { ImageProcessingType, ServerSettings } from '@/features/settings/Settings.types.ts';
@@ -92,7 +93,7 @@ export const ImageProcessingSetting = ({ type }: { type: ImageProcessingType })
return (
<Stack sx={{ p: 2, gap: 3 }}>
<Typography>{t('download.settings.conversion.description', { value: 'none' })}</Typography>
<Typography>{t('download.settings.conversion.description', { value: TARGET_DISABLED })}</Typography>
<Stack sx={{ flexDirection: 'column', gap: 5 }}>
{tmpConversions.map((conversion, index) => {
const { mimeType } = conversion;