Fix download conversion change detection

The setting was considered to have always been modified. This resulted in the save button never being disabled.

src/modules/downloads/components/DownloadConversionSetting.tsx

@@ -74,6 +74,7 @@ const maybeAddDefault = (conversions: SettingsDownloadConversion[]) => {
                   {
                       mimeType: DEFAULT_MIME_TYPE,
                       target: '',
+                      compressionLevel: null,
                   },
               ]),
         ...conversions,
@@ -247,7 +248,7 @@ export const DownloadConversionSetting = ({
     updateSetting,
 }: {
     conversions: SettingsDownloadConversion[];
-    updateSetting: (conversions: SettingsDownloadConversion[]) => void;
+    updateSetting: (conversions: SettingsDownloadConversion[]) => Promise<void>;
 }) => {
     const { t } = useTranslation();
 
@@ -257,13 +258,17 @@ export const DownloadConversionSetting = ({
 
     const hasInvalidConversion = containsInvalidConversion(tmpConversions);
 
-    const hasChanged = didUpdateConversions(conversions, tmpConversions);
+    const hasChanged = didUpdateConversions(normalizeConversions(maybeAddDefault(conversions)), tmpConversions);
 
-    const onClose = () => {
-        setTmpConversions(normalizeConversions(maybeAddDefault(conversions)));
+    const onClose = (newConversions: SettingsDownloadConversion[] = conversions) => {
+        setTmpConversions(normalizeConversions(maybeAddDefault(newConversions)));
         setIsDialogOpen(false);
     };
 
+    const onCancel = () => {
+        onClose(conversions);
+    };
+
     return (
         <>
             <ListItemButton disabled={false} onClick={() => setIsDialogOpen(true)}>
@@ -275,7 +280,7 @@ export const DownloadConversionSetting = ({
                     secondaryTypographyProps={{ style: { display: 'flex', flexDirection: 'column' } }}
                 />
             </ListItemButton>
-            <Dialog open={isDialogOpen} onClose={onClose}>
+            <Dialog open={isDialogOpen} onClose={onCancel}>
                 <DialogTitle>{t('download.settings.conversion.title')}</DialogTitle>
                 <DialogContent>
                     <DialogContentText sx={{ mb: 2 }}>
@@ -322,16 +327,23 @@ export const DownloadConversionSetting = ({
                         <Button
                             variant="outlined"
                             onClick={() => {
-                                setTmpConversions((prev) => [...prev, { mimeType: '', target: '' }]);
+                                setTmpConversions((prev) => [
+                                    ...prev,
+                                    { mimeType: '', target: '', compressionLevel: null },
+                                ]);
                             }}
                         >
                             {t('global.button.add')}
                         </Button>
                         <Stack direction="row">
-                            <Button onClick={onClose}>{t('global.button.cancel')}</Button>
+                            <Button onClick={onCancel}>{t('global.button.cancel')}</Button>
                             <Button
                                 disabled={hasInvalidConversion || !hasChanged}
-                                onClick={() => updateSetting(toValidServerConversions(tmpConversions))}
+                                onClick={() =>
+                                    updateSetting(toValidServerConversions(tmpConversions)).then(() =>
+                                        onClose(toValidServerConversions(tmpConversions)),
+                                    )
+                                }
                             >
                                 {t('global.button.ok')}
                             </Button>

src/modules/downloads/screens/DownloadSettings.tsx

@@ -108,10 +108,11 @@ export const DownloadSettings = () => {
     const updateSetting = <Setting extends keyof DownloadSettingsType>(
         setting: Setting,
         value: DownloadSettingsType[Setting],
-    ) => {
-        mutateSettings({ variables: { input: { settings: { [setting]: value } } } }).catch((e) =>
-            makeToast(t('global.error.label.failed_to_save_changes'), 'error', getErrorMessage(e)),
-        );
+    ): Promise<any> => {
+        const mutation = mutateSettings({ variables: { input: { settings: { [setting]: value } } } });
+        mutation.catch((e) => makeToast(t('global.error.label.failed_to_save_changes'), 'error', getErrorMessage(e)));
+
+        return mutation;
     };
 
     const updateMetadataSetting = createUpdateMetadataServerSettings<keyof MetadataDownloadSettings>((e) =>