Save selected extension languages on the server

src/modules/browse/Browse.types.ts

@@ -8,4 +8,5 @@
 
 export type MetadataBrowseSettings = {
     hideLibraryEntries: boolean;
+    extensionLanguages: string[];
 };

src/modules/extension/screens/Extensions.tsx

@@ -18,7 +18,6 @@ import { useTranslation } from 'react-i18next';
 import { Link, useLocation, useNavigate } from 'react-router-dom';
 import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
 import { requestManager } from '@/lib/requests/RequestManager.ts';
-import { extensionDefaultLangs } from '@/modules/core/utils/Languages.ts';
 import { useLocalStorage } from '@/modules/core/hooks/useStorage.tsx';
 import { AppbarSearch } from '@/modules/core/components/AppbarSearch.tsx';
 import { LoadingPlaceholder } from '@/modules/core/components/placeholder/LoadingPlaceholder.tsx';
@@ -48,6 +47,11 @@ import { AppRoutes } from '@/modules/core/AppRoute.constants.ts';
 import { getErrorMessage } from '@/lib/HelperFunctions.ts';
 import { useNavBarContext } from '@/modules/navigation-bar/contexts/NavbarContext.tsx';
 import { ExtensionOptions } from '@/modules/extension/components/ExtensionOptions';
+import {
+    createUpdateMetadataServerSettings,
+    useMetadataServerSettings,
+} from '@/modules/settings/services/ServerSettingsMetadata.ts';
+import { MetadataBrowseSettings } from '@/modules/browse/Browse.types.ts';
 
 const LANGUAGE = 0;
 const EXTENSIONS = 1;
@@ -125,7 +129,13 @@ export function Extensions({ tabsMenuHeight }: { tabsMenuHeight: number }) {
     const [fetchExtensions, { data, loading: areExtensionsLoading, error: extensionsError }] =
         requestManager.useExtensionListFetch();
 
-    const [shownLangs, setShownLangs] = useLocalStorage<string[]>('shownExtensionLangs', extensionDefaultLangs());
+    const {
+        settings: { extensionLanguages: shownLangs },
+    } = useMetadataServerSettings();
+    const updateMetadataServerSettings = createUpdateMetadataServerSettings<
+        keyof Pick<MetadataBrowseSettings, 'extensionLanguages'>
+    >((e) => makeToast(t('global.error.label.failed_to_save_changes'), 'error', getErrorMessage(e)));
+
     const [showNsfw] = useLocalStorage<boolean>('showNsfw', true);
     const [query] = useQueryParam('query', StringParam);
 
@@ -219,7 +229,13 @@ export function Extensions({ tabsMenuHeight }: { tabsMenuHeight: number }) {
                     </IconButton>
                 </CustomTooltip>
 
-                <LangSelect shownLangs={shownLangs} setShownLangs={setShownLangs} allLangs={allLangs} />
+                <LangSelect
+                    shownLangs={shownLangs}
+                    setShownLangs={(languages: string[]) =>
+                        updateMetadataServerSettings('extensionLanguages', languages)
+                    }
+                    allLangs={allLangs}
+                />
             </>,
         );
 

src/modules/metadata/Metadata.constants.ts

@@ -85,6 +85,7 @@ const APP_METADATA_OBJECT: Record<AppMetadataKeys, undefined> = {
     downloaded: undefined,
     unread: undefined,
     showChapterNumber: undefined,
+    extensionLanguages: undefined,
 };
 
 export const VALID_APP_METADATA_KEYS = Object.keys(APP_METADATA_OBJECT);
@@ -134,6 +135,7 @@ export const GLOBAL_METADATA_KEYS: AppMetadataKeys[] = [
 
     // browse
     'hideLibraryEntries',
+    'extensionLanguages',
 
     // history
     'hideHistory',

src/modules/settings/Settings.constants.ts

@@ -10,6 +10,7 @@ import { DEFAULT_DEVICE } from '@/modules/device/services/Device.ts';
 import { DEFAULT_SORT_SETTINGS } from '@/modules/migration/Migration.constants.ts';
 import { MetadataServerSettings } from '@/modules/settings/Settings.types.ts';
 import { GridLayout } from '@/modules/core/Core.types.ts';
+import { extensionDefaultLangs } from '@/modules/core/utils/Languages.ts';
 
 export const SERVER_SETTINGS_METADATA_DEFAULT: MetadataServerSettings = {
     // downloads
@@ -40,6 +41,7 @@ export const SERVER_SETTINGS_METADATA_DEFAULT: MetadataServerSettings = {
 
     // browse
     hideLibraryEntries: false,
+    extensionLanguages: extensionDefaultLangs(),
 
     // history
     hideHistory: false,

src/modules/settings/services/ServerSettingsMetadata.ts

@@ -26,6 +26,7 @@ export const convertSettingsToMetadata = (
     devices: JSON.stringify(settings.devices),
     customThemes: JSON.stringify(settings.customThemes),
     migrateSortSettings: JSON.stringify(settings.migrateSortSettings),
+    extensionLanguages: JSON.stringify(settings.extensionLanguages),
 });
 
 export const convertMetadataToSettings = (
@@ -43,6 +44,9 @@ export const convertMetadataToSettings = (
             jsonSaveParse<MetadataMigrationSettings['migrateSortSettings']>(
                 (metadata.migrateSortSettings as string) ?? '',
             ) ?? SERVER_SETTINGS_METADATA_DEFAULT.migrateSortSettings,
+        extensionLanguages:
+            jsonSaveParse<string[]>((metadata.extensionLanguages as string) ?? '') ??
+            SERVER_SETTINGS_METADATA_DEFAULT.extensionLanguages,
     }) satisfies MetadataServerSettings;
 
 const getMetadataServerSettingsWithDefaultFallback = (