Improve backup install missing extension routing

Only opened the "browse" page instead of routing to the "extension" tab of the "browse" page

src/modules/backup/screens/Backup.tsx

@@ -38,6 +38,7 @@ import { ServerSettings } from '@/modules/settings/Settings.types.ts';
 import { AppRoutes } from '@/modules/core/AppRoute.constants.ts';
 import { getErrorMessage } from '@/lib/HelperFunctions.ts';
 import { useAppTitle } from '@/modules/navigation-bar/hooks/useAppTitle.ts';
+import { BrowseTab } from '@/modules/browse/Browse.types.ts';
 
 type BackupSettingsType = Pick<ServerSettings, 'backupPath' | 'backupTime' | 'backupInterval' | 'backupTTL'>;
 
@@ -337,7 +338,7 @@ export function Backup() {
                             <Button
                                 onClick={closeInvalidBackupDialog}
                                 component={Link}
-                                to={AppRoutes.browse.path}
+                                to={AppRoutes.browse.path(BrowseTab.EXTENSIONS)}
                                 autoFocus={!!validationResult?.missingSources.length}
                                 variant={validationResult?.missingSources.length ? 'contained' : 'text'}
                             >

src/modules/browse/Browse.types.ts

@@ -16,3 +16,9 @@ export type MetadataBrowseSettings = {
     lastUsedSourceId: SourceIdInfo['id'] | null;
     shouldShowOnlySourcesWithResults: boolean;
 };
+
+export enum BrowseTab {
+    SOURCE = 'source',
+    EXTENSIONS = 'extensions',
+    MIGRATE = 'migrate',
+}

src/modules/browse/screens/Browse.tsx

@@ -19,12 +19,7 @@ import { Migration } from '@/modules/migration/screens/Migration.tsx';
 import { useResizeObserver } from '@/modules/core/hooks/useResizeObserver.tsx';
 import { GROUPED_VIRTUOSO_Z_INDEX } from '@/modules/core/AppRoute.constants.ts';
 import { useAppTitle } from '@/modules/navigation-bar/hooks/useAppTitle.ts';
-
-enum Tabs {
-    SOURCE = 'source',
-    EXTENSIONS = 'extensions',
-    MIGRATE = 'migrate',
-}
+import { BrowseTab } from '@/modules/browse/Browse.types.ts';
 
 export function Browse() {
     const { t } = useTranslation();
@@ -38,7 +33,7 @@ export function Browse() {
     );
 
     const [tabSearchParam, setTabSearchParam] = useQueryParam('tab', StringParam, {});
-    const tabName = (tabSearchParam as Tabs) ?? Tabs.SOURCE;
+    const tabName = (tabSearchParam as BrowseTab) ?? BrowseTab.SOURCE;
 
     if (!tabSearchParam) {
         setTabSearchParam(tabName, 'replaceIn');
@@ -53,17 +48,17 @@ export function Browse() {
                 value={tabName}
                 onChange={(_, newTab) => setTabSearchParam(newTab, 'replaceIn')}
             >
-                <Tab value={Tabs.SOURCE} sx={{ textTransform: 'none' }} label={t('source.title_one')} />
-                <Tab value={Tabs.EXTENSIONS} sx={{ textTransform: 'none' }} label={t('extension.title_other')} />
-                <Tab value={Tabs.MIGRATE} sx={{ textTransform: 'none' }} label={t('migrate.title')} />
+                <Tab value={BrowseTab.SOURCE} sx={{ textTransform: 'none' }} label={t('source.title_other')} />
+                <Tab value={BrowseTab.EXTENSIONS} sx={{ textTransform: 'none' }} label={t('extension.title_other')} />
+                <Tab value={BrowseTab.MIGRATE} sx={{ textTransform: 'none' }} label={t('migrate.title')} />
             </TabsMenu>
-            <TabPanel index={Tabs.SOURCE} currentIndex={tabName}>
+            <TabPanel index={BrowseTab.SOURCE} currentIndex={tabName}>
                 <Sources tabsMenuHeight={tabsMenuHeight} />
             </TabPanel>
-            <TabPanel index={Tabs.EXTENSIONS} currentIndex={tabName}>
+            <TabPanel index={BrowseTab.EXTENSIONS} currentIndex={tabName}>
                 <Extensions tabsMenuHeight={tabsMenuHeight} />
             </TabPanel>
-            <TabPanel index={Tabs.MIGRATE} currentIndex={tabName}>
+            <TabPanel index={BrowseTab.MIGRATE} currentIndex={tabName}>
                 <Migration tabsMenuHeight={tabsMenuHeight} />
             </TabPanel>
         </TabsWrapper>

src/modules/core/AppRoute.constants.ts

@@ -10,6 +10,7 @@ import { SourceType } from '@/lib/graphql/generated/graphql.ts';
 import { MangaIdInfo } from '@/modules/manga/Manga.types.ts';
 
 import { ChapterSourceOrderInfo } from '@/modules/chapter/Chapter.types.ts';
+import { BrowseTab } from '@/modules/browse/Browse.types.ts';
 
 type AppRouteInfo = {
     match: string;
@@ -166,7 +167,7 @@ export const AppRoutes = {
     },
     browse: {
         match: 'browse',
-        path: '/browse',
+        path: (tab?: BrowseTab) => addParams('/browse', createParam('tab', tab)),
     },
     migrate: {
         match: 'migrate/source/:sourceId',

src/modules/navigation-bar/NavigationBar.constants.ts

@@ -53,7 +53,7 @@ const NAVIGATION_BAR_BASE_ITEMS = [
         moreGroup: NavBarItemMoreGroup.GENERAL,
     },
     {
-        path: AppRoutes.browse.path,
+        path: AppRoutes.browse.path() as RestrictedNavBarItem<'both'>['path'],
         title: 'global.label.browse',
         SelectedIconComponent: ExploreIcon,
         IconComponent: ExploreOutlinedIcon,