Fix outdated selected languages in selection dialog

When directly opening the source/extension browse page as the initial page, the metadata server settings weren't loaded yet, and thus, the default values were being used.
Thus, when opening the dialog the first time, it was showing the default selected languages.

CHANGELOG.md

@@ -32,6 +32,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 - (**Library**) Fix total library size chip color in light mode
 - (**Browse**) Fix missing pinned sources in the source language filter
 - (**Browse**) Fix incorrectly showing "local source" source in the source language filter (the local source can't be disabled)
+- (**Browse**) Fix language selection showing the default selected languages when the source/extension page was the first opened page
 - (**Reader**) Fix page shift when toggling the "offset double spreads" setting (currently: enable: shift to the right; disable: shift to the left – now: inverted)
 - (**Reader**) Fix "auto webtoon mode" detection for manga source languages other than english and the current selected language
 - (**Reader**) Fix the reader transition page previous chapter scanlator name showing the chapter name instead of the scanlator name

src/base/components/inputs/LanguageSelect.tsx

@@ -22,6 +22,7 @@ import { useLingui } from '@lingui/react/macro';
 import { CustomTooltip } from '@/base/components/CustomTooltip.tsx';
 import { translateExtensionLanguage } from '@/features/extension/Extensions.utils.ts';
 import { languageSortComparator, toUniqueLanguageCodes } from '@/base/utils/Languages.ts';
+import { usePrevious } from '@mantine/hooks';
 
 interface IProps {
     selectedLanguages: string[];
@@ -35,6 +36,12 @@ export function LanguageSelect({ selectedLanguages, setSelectedLanguages, langua
     const [tmpSelectedLanguages, setTmpSelectedLanguages] = useState(toUniqueLanguageCodes(selectedLanguages));
     const [open, setOpen] = useState<boolean>(false);
 
+    const previousSelectedLanguages = usePrevious(selectedLanguages);
+
+    if (previousSelectedLanguages && previousSelectedLanguages !== selectedLanguages) {
+        setTmpSelectedLanguages(toUniqueLanguageCodes(selectedLanguages));
+    }
+
     const languagesSortedBySelectState = useMemo(
         () =>
             toUniqueLanguageCodes([

src/features/source/components/SourceLanguageSelect.tsx

@@ -40,6 +40,7 @@ import { ListCardAvatar } from '@/base/components/lists/cards/ListCardAvatar.tsx
 import { makeToast } from '@/base/utils/Toast.ts';
 import { getErrorMessage } from '@/lib/HelperFunctions.ts';
 import { VirtuosoUtil } from '@/lib/virtuoso/Virtuoso.util.tsx';
+import { usePrevious } from '@mantine/hooks';
 
 export const SourceLanguageSelect = ({
     selectedLanguages,
@@ -64,6 +65,11 @@ export const SourceLanguageSelect = ({
     const [tmpSelectedLanguages, setTmpSelectedLanguages] = useState(toUniqueLanguageCodes(selectedLanguages));
     const [open, setOpen] = useState<boolean>(false);
 
+    const previousSelectedLanguages = usePrevious(selectedLanguages);
+    if (previousSelectedLanguages && previousSelectedLanguages !== selectedLanguages) {
+        setTmpSelectedLanguages(toUniqueLanguageCodes(selectedLanguages));
+    }
+
     const sourcesByLanguage = useMemo(() => Sources.groupByLanguage(sources), [sources]);
 
     const languagesSortedBySelectState = useMemo(