Fix setting invalid value for reader settings

When changing a setting from DEFAULT to another value, the value was incorrectly wrapped in an array which lead to an invalid value to get set.
This then caused an error to be thrown, making the reader unusable

fixes #1099

CHANGELOG.md

@@ -10,6 +10,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 
 - (**Navigation**) Fix obsolete extensions being included in the updatable extensions info
 - (**Extensions**) Fix showing the uninstall button twice in the extension info page in case the extensions is obsolete and has a update at the same time
+- (**Reader**) Fix changing reader layout settings from their default value to another causing the reader to break
 
 ## [20260508.01] (r3136) - 2026-05-08
 

src/base/components/buttons/ButtonSelect.tsx

@@ -38,7 +38,7 @@ export const ButtonSelect = <Value extends string | number, MultiValue extends V
 
                 const newValue = (() => {
                     if (value === undefined) {
-                        return [displayValue];
+                        return isMultiSelect ? [displayValue] : displayValue;
                     }
 
                     if (isMultiSelect) {

src/features/metadata/Metadata.constants.ts

@@ -31,6 +31,9 @@ import { detectLocale, getISOLanguage } from '@/lib/ISOLanguageUtil.ts';
 import type { I18nResourceCode } from '@/i18n';
 import { i18nResources } from '@/i18n';
 import { toUniqueLanguageCodes } from '@/base/utils/Languages.ts';
+import { assertIsDefined } from '@/base/Asserts.ts';
+
+const MATCH_ARRAY_NUMBERS = /^\[\d+(?:,\d+)*]$/g;
 
 export const APP_METADATA_KEY_PREFIX = 'webUI';
 
@@ -701,6 +704,22 @@ export const METADATA_MIGRATIONS: IMetadataMigration[] = [
         keys: [{ oldKey: 'sourceLanguages', newKey: 'browseLanguages' }],
         deleteKeys: ['sourceLanguages', 'extensionLanguages'],
     },
+    {
+        values: [
+            ...(() =>
+                ['pageScaleMode', 'readingDirection', 'readingMode', 'tapZoneLayout'].map((key) => ({
+                    key,
+                    oldValue: MATCH_ARRAY_NUMBERS,
+                    newValue: (value) => {
+                        const array = jsonSaveParse<number[]>(value);
+
+                        assertIsDefined(array);
+
+                        return JSON.stringify(array[0]);
+                    },
+                })) satisfies IMetadataMigration['values'])(),
+        ],
+    },
 ];
 
 export const ALL_APP_METADATA_KEY_PREFIXES: string[] = [