fix: lock transcoding options (#29076)

This commit is contained in:
Timon 2026-06-15 16:50:00 +02:00 committed by GitHub
parent b633cc4f04
commit 5e8744a568
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 9 additions and 5 deletions

View file

@ -88,6 +88,7 @@
desc={$t('admin.transcoding_accepted_video_codecs_description')} desc={$t('admin.transcoding_accepted_video_codecs_description')}
bind:value={configToEdit.ffmpeg.acceptedVideoCodecs} bind:value={configToEdit.ffmpeg.acceptedVideoCodecs}
name="videoCodecs" name="videoCodecs"
lockedOptions={[configToEdit.ffmpeg.targetVideoCodec]}
options={[ options={[
{ value: VideoCodec.H264, text: 'H.264' }, { value: VideoCodec.H264, text: 'H.264' },
{ value: VideoCodec.Hevc, text: 'HEVC' }, { value: VideoCodec.Hevc, text: 'HEVC' },
@ -106,6 +107,7 @@
desc={$t('admin.transcoding_accepted_audio_codecs_description')} desc={$t('admin.transcoding_accepted_audio_codecs_description')}
bind:value={configToEdit.ffmpeg.acceptedAudioCodecs} bind:value={configToEdit.ffmpeg.acceptedAudioCodecs}
name="audioCodecs" name="audioCodecs"
lockedOptions={[configToEdit.ffmpeg.targetAudioCodec]}
options={[ options={[
{ value: AudioCodec.Aac, text: 'AAC' }, { value: AudioCodec.Aac, text: 'AAC' },
{ value: AudioCodec.Mp3, text: 'MP3' }, { value: AudioCodec.Mp3, text: 'MP3' },

View file

@ -1,17 +1,18 @@
<script lang="ts"> <script lang="ts" generics="T extends string">
import { Checkbox, Label } from '@immich/ui'; import { Checkbox, Label } from '@immich/ui';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
import { quintOut } from 'svelte/easing'; import { quintOut } from 'svelte/easing';
import { fly } from 'svelte/transition'; import { fly } from 'svelte/transition';
interface Props { interface Props {
value: string[]; value: T[];
options: { value: string; text: string }[]; options: { value: T; text: string }[];
label?: string; label?: string;
desc?: string; desc?: string;
name?: string; name?: string;
isEdited?: boolean; isEdited?: boolean;
disabled?: boolean; disabled?: boolean;
lockedOptions?: T[];
} }
let { let {
@ -22,9 +23,10 @@
name = '', name = '',
isEdited = false, isEdited = false,
disabled = false, disabled = false,
lockedOptions = [],
}: Props = $props(); }: Props = $props();
function handleCheckboxChange(option: string) { function handleCheckboxChange(option: T) {
value = value.includes(option) ? value.filter((item) => item !== option) : [...value, option]; value = value.includes(option) ? value.filter((item) => item !== option) : [...value, option];
} }
</script> </script>
@ -57,7 +59,7 @@
size="tiny" size="tiny"
id="{option.value}-checkbox" id="{option.value}-checkbox"
checked={value.includes(option.value)} checked={value.includes(option.value)}
{disabled} disabled={disabled || lockedOptions.includes(option.value)}
onCheckedChange={() => handleCheckboxChange(option.value)} onCheckedChange={() => handleCheckboxChange(option.value)}
/> />
<Label label={option.text} for="{option.value}-checkbox" size="small" /> <Label label={option.text} for="{option.value}-checkbox" size="small" />