Extract extensions language extraction into own function

src/modules/extension/Extensions.utils.ts

@@ -51,10 +51,7 @@ export const translateExtensionLanguage = (languageCode: string): string =>
         ? t(extensionLanguageToTranslationKey[languageCode as ExtensionGroupState | DefaultLanguage])
         : langCodeToName(languageCode);
 
-export function getExtensionsInfo(extensions: TExtension[]): {
+export function groupExtensionsByLanguage(extensions: TExtension[]): GroupedExtensionsResult {
-    allLangs: string[];
-    groupedExtensions: GroupedExtensionsResult;
-} {
     const allLangs: string[] = [];
     const sortedExtensions: GroupedExtensions = {
         [ExtensionGroupState.OBSOLETE]: [],
@@ -96,8 +93,8 @@ export function getExtensionsInfo(extensions: TExtension[]): {
         groupedExtensionList.sort((a, b) => a.name.localeCompare(b.name)),
     );
 
-    return {
+    return groupedExtensions;
-        allLangs,
-        groupedExtensions,
-    };
 }
+
+export const getLanguagesFromExtensions = (extensions: TExtension[]): string[] =>
+    [...new Set(extensions.map((extension) => extension.lang))].toSorted(langSortCmp);

src/modules/extension/screens/Extensions.tsx

@@ -32,9 +32,10 @@ import { EmptyViewAbsoluteCentered } from '@/modules/core/components/placeholder
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
 import { VirtuosoUtil } from '@/lib/virtuoso/Virtuoso.util.tsx';
 import {
-    getExtensionsInfo,
+    groupExtensionsByLanguage,
-    isExtensionState,
+    getLanguagesFromExtensions,
     translateExtensionLanguage,
+    isExtensionState,
 } from '@/modules/extension/Extensions.utils.ts';
 import {
     ExtensionAction,
@@ -94,6 +95,8 @@ export function Extensions({ tabsMenuHeight }: { tabsMenuHeight: number }) {
         fetchExtensions();
     }, [refetchExtensions]);
 
+    const allLangs = useMemo(() => getLanguagesFromExtensions(allExtensions ?? []), [allExtensions]);
+
     const filteredExtensions = useMemo(
         () =>
             (allExtensions ?? []).filter((ext) => {
@@ -104,7 +107,7 @@ export function Extensions({ tabsMenuHeight }: { tabsMenuHeight: number }) {
         [allExtensions, showNsfw, query],
     );
 
-    const { allLangs, groupedExtensions } = useMemo(() => getExtensionsInfo(filteredExtensions), [filteredExtensions]);
+    const groupedExtensions = useMemo(() => groupExtensionsByLanguage(filteredExtensions), [filteredExtensions]);
 
     const filteredGroupedExtensions = useMemo(
         () =>