Fix native language codes usage in "browse languages"

The native language code returned by the browser could be a code that is not included in the defined ISOLanguages object. E.g. "en-GB" while the object only has "en".

This caused the "English" browse language to not be able to get selected as an allowed language.

CHANGELOG.md

@@ -72,6 +72,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 - (**Reader**) Fix preserving scroll position
 - (**Reader**) Fix missing gap between chapters in continuous vertical and horizontal reading modes with disabled transition page
 - (**Browse**) Fix showing only nsfw sources in the browse source page when the "show nsfw" setting is disabled
+- (**Browse**) Fix not being able to select some languages as an "allowed language" in some situations (e.g., browser native language "en-GB" prevented "English" from getting visually shown as enabled)
 - (**Manga/Library**) Fix mark as read/unread option not being disabled for manga without any chapters
 - (**Manga/Library**) Fix delete/download option not being disabled for manga without any chapters
 - (**Source**) Fix changing configuration settings with multi option selection where a selected option does not exist anymore. (E.g. Komgas "Default libraries" setting, still having a library selected that has been deleted)

src/features/metadata/Metadata.constants.ts

@@ -726,6 +726,23 @@ export const METADATA_MIGRATIONS: IMetadataMigration[] = [
                 })) satisfies IMetadataMigration['values'])(),
         ],
     },
+    {
+        values: [
+            {
+                key: 'browseLanguages',
+                oldValue: /^\[.*]$/g,
+                newValue: (browseLanguagesValue) => {
+                    const convertedBrowseLanguages = convertToObject<string[]>(browseLanguagesValue, []);
+
+                    const convertedToValidIsoCodes = convertedBrowseLanguages.map(
+                        (language) => getISOLanguage(language)?.isoCode ?? language,
+                    );
+
+                    return JSON.stringify(convertedToValidIsoCodes);
+                },
+            },
+        ],
+    },
 ];
 
 export const ALL_APP_METADATA_KEY_PREFIXES: string[] = [

src/lib/ISOLanguageUtil.ts

@@ -116,7 +116,9 @@ const toUniqueISOLanguageCodes = (codes: string[]): string[] => {
 };
 
 export function getPreferredISOLanguageCodes(): readonly string[] {
-    const preferredLanguages = toUniqueISOLanguageCodes([...navigator.languages]);
+    const preferredLanguages = toUniqueISOLanguageCodes([...navigator.languages]).map(
+        (language) => getISOLanguage(language)?.isoCode ?? language,
+    );
 
     if (!preferredLanguages.length) {
         return [DEFAULT_LANGUAGE];