Put bottom navigation items into own file (#1361)

* put bottom navigation items into own file

* Automated code formatting

* update

* a

* fix circular dependencies

* Automated code formatting

* update

* update

* Automated code formatting

* address code review

* fixup

* update

* fix format after merge

---------

Co-authored-by: Loculus bot <bot@loculus.org>

website/src/components/DatasetCitations/DatasetList.tsx

@@ -11,7 +11,7 @@ import TableSortLabel from '@mui/material/TableSortLabel';
 import { visuallyHidden } from '@mui/utils';
 import { type FC, type MouseEvent, type ChangeEvent, useState, useMemo } from 'react';
 
-import { routes } from '../../routes';
+import { routes } from '../../routes/routes';
 import type { Dataset } from '../../types/datasetCitation';
 
 type Order = 'asc' | 'desc';

website/src/components/Edit/EditPage.tsx

@@ -4,7 +4,7 @@ import { type Dispatch, type FC, Fragment, type SetStateAction, useMemo, useRef,
 import { EditableDataRow, ProcessedDataRow } from './DataRow.tsx';
 import type { Row } from './InputField.tsx';
 import { getClientLogger } from '../../clientLogger.ts';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import { backendClientHooks } from '../../services/serviceHooks.ts';
 import { ACCESSION_FIELD } from '../../settings.ts';
 import type { MetadataRecord, ProcessingAnnotationSourceType, SequenceEntryToEdit } from '../../types/backend.ts';

website/src/components/MySequencesPage/MySequencesGroupSelector.tsx

@@ -1,6 +1,6 @@
 import { type FC } from 'react';
 
-import { routes } from '../../routes';
+import { routes } from '../../routes/routes';
 
 type GroupSelectorProps = {
     groupNames: string[];

website/src/components/Navigation/Navigation.astro

@@ -1,7 +1,7 @@
 ---
 import { SandwichMenu } from './SandwichMenu.tsx';
 import { cleanOrganism } from './cleanOrganism';
-import { navigationItems } from '../../routes';
+import { navigationItems } from '../../routes/navigationItems';
 import { getAuthUrl } from '../../utils/getAuthUrl';
 
 const { organism } = cleanOrganism(Astro.params.organism);

website/src/components/Navigation/OrganismSelector.astro

@@ -1,7 +1,7 @@
 ---
 import { cleanOrganism } from './cleanOrganism';
 import { type Organism } from '../../config';
-import { routes } from '../../routes';
+import { routes } from '../../routes/routes';
 import IwwaArrowDown from '~icons/iwwa/arrow-down';
 
 const { knownOrganisms, organism: originalOrganism } = cleanOrganism(Astro.params.organism);

website/src/components/Navigation/SandwichMenu.tsx

@@ -2,7 +2,7 @@ import type { FC } from 'react';
 
 import type { Organism } from '../../config.ts';
 import { useOffCanvas } from '../../hooks/useOffCanvas';
-import { navigationItems } from '../../routes.ts';
+import { navigationItems } from '../../routes/navigationItems';
 import { OffCanvasOverlay } from '../OffCanvasOverlay';
 import { SandwichIcon } from '../SandwichIcon';
 

website/src/components/ReviewPage/ReviewPage.tsx

@@ -4,7 +4,7 @@ import { type ChangeEvent, type FC, useState } from 'react';
 
 import { ReviewCard } from './ReviewCard.tsx';
 import { useSubmissionOperations } from '../../hooks/useSubmissionOperations.ts';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import {
     approveAllDataScope,
     awaitingApprovalStatus,

website/src/components/SearchPage/SearchForm.spec.tsx

@@ -5,7 +5,7 @@ import { beforeEach, describe, expect, test, vi } from 'vitest';
 
 import { SearchForm } from './SearchForm';
 import { testConfig, testOrganism } from '../../../vitest.setup.ts';
-import { routes, SEARCH } from '../../routes.ts';
+import { routes, SEARCH } from '../../routes/routes.ts';
 import type { MetadataFilter } from '../../types/config.ts';
 import type { ReferenceGenomesSequenceNames } from '../../types/referencesGenomes.ts';
 import type { ClientConfig } from '../../types/runtimeConfig.ts';

website/src/components/SearchPage/SearchForm.tsx

@@ -14,7 +14,7 @@ import { PangoLineageField } from './fields/PangoLineageField';
 import { getClientLogger } from '../../clientLogger.ts';
 import { getLapisUrl } from '../../config.ts';
 import { useOffCanvas } from '../../hooks/useOffCanvas';
-import { routes, navigateToSearchLikePage, type ClassOfSearchPageType } from '../../routes.ts';
+import { routes, navigateToSearchLikePage, type ClassOfSearchPageType } from '../../routes/routes.ts';
 import type { AccessionFilter, MetadataFilter, MutationFilter } from '../../types/config.ts';
 import type { ReferenceGenomesSequenceNames } from '../../types/referencesGenomes.ts';
 import type { ClientConfig } from '../../types/runtimeConfig.ts';

website/src/components/SearchPage/SearchPagination.tsx

@@ -1,7 +1,7 @@
 import { Pagination as MUIPagination } from '@mui/material';
 import type { FC } from 'react';
 
-import { navigateToSearchLikePage, type ClassOfSearchPageType } from '../../routes';
+import { navigateToSearchLikePage, type ClassOfSearchPageType } from '../../routes/routes';
 import type { AccessionFilter, MetadataFilter, MutationFilter } from '../../types/config.ts';
 import type { OrderBy } from '../../types/lapis.ts';
 

website/src/components/SearchPage/Table.tsx

@@ -1,7 +1,7 @@
 import { capitalCase } from 'change-case';
 import type { FC, ReactElement } from 'react';
 
-import { routes, navigateToSearchLikePage, type ClassOfSearchPageType } from '../../routes.ts';
+import { routes, navigateToSearchLikePage, type ClassOfSearchPageType } from '../../routes/routes.ts';
 import type { AccessionFilter, MetadataFilter, MutationFilter, Schema } from '../../types/config.ts';
 import type { OrderBy } from '../../types/lapis.ts';
 import MdiTriangle from '~icons/mdi/triangle';

website/src/components/SequenceDetailsPage/RevokeButton.tsx

@@ -1,7 +1,7 @@
 import { type FC } from 'react';
 import { toast } from 'react-toastify';
 
-import { routes } from '../../routes';
+import { routes } from '../../routes/routes';
 import { backendClientHooks } from '../../services/serviceHooks';
 import type { ClientConfig } from '../../types/runtimeConfig';
 import { createAuthorizationHeader } from '../../utils/createAuthorizationHeader';

website/src/components/SequenceDetailsPage/SequencesBanner.astro

@@ -1,6 +1,6 @@
 ---
 import { getLatestAccessionVersion } from './getTableData';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import { type SequenceEntryHistory, siloVersionStatuses } from '../../types/lapis';
 import { getAccessionVersionString } from '../../utils/extractAccessionVersion';
 

website/src/components/SequenceDetailsPage/SequencesDataTableTitle.astro

@@ -1,7 +1,7 @@
 ---
 import { sentenceCase } from 'change-case';
 
-import { routes } from '../../routes';
+import { routes } from '../../routes/routes';
 import { type SequenceEntryHistory } from '../../types/lapis';
 import { getAccessionVersionString } from '../../utils/extractAccessionVersion';
 import { getVersionStatusColor } from '../../utils/getVersionStatusColor';

website/src/components/SequenceDetailsPage/SequencesDetailsPage.astro

@@ -4,7 +4,7 @@ import { RevokeButton } from './RevokeButton';
 import { SequencesContainer } from './SequencesContainer';
 import { type TableDataEntry } from './getTableData';
 import { getReferenceGenomes, getRuntimeConfig } from '../../config';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import { GroupManagementClient } from '../../services/groupManagementClient';
 import { type DataUseTermsHistoryEntry } from '../../types/backend';
 import { type Group } from '../../types/backend.ts';

website/src/components/Submission/DataUploadForm.tsx

@@ -6,7 +6,7 @@ import { type FormEvent, useState, useRef, useEffect, useCallback, type ElementT
 
 import { DateChangeModal } from './DateChangeModal';
 import { getClientLogger } from '../../clientLogger.ts';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import { backendApi } from '../../services/backendApi.ts';
 import { backendClientHooks } from '../../services/serviceHooks.ts';
 import {

website/src/components/Submission/RevisionForm.tsx

@@ -1,7 +1,7 @@
 import { type FC } from 'react';
 
 import { DataUploadForm } from './DataUploadForm.tsx';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import { type Group } from '../../types/backend.ts';
 import type { ClientConfig } from '../../types/runtimeConfig.ts';
 import { ManagedErrorFeedback, useErrorFeedbackState } from '../common/ManagedErrorFeedback';

website/src/components/Submission/SubmissionForm.tsx

@@ -1,7 +1,7 @@
 import { type FC } from 'react';
 
 import { DataUploadForm } from './DataUploadForm.tsx';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import { type Group } from '../../types/backend.ts';
 import type { ClientConfig } from '../../types/runtimeConfig.ts';
 import { ManagedErrorFeedback, useErrorFeedbackState } from '../common/ManagedErrorFeedback';

website/src/components/User/GroupCreationForm.tsx

@@ -2,7 +2,7 @@ import { type ComponentProps, type FC, type FormEvent, type PropsWithChildren, u
 
 import { listOfCountries } from './listOfCountries.ts';
 import { useGroupCreation } from '../../hooks/useGroupOperations.ts';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import { type ClientConfig } from '../../types/runtimeConfig.ts';
 import { ErrorFeedback } from '../ErrorFeedback.tsx';
 import { withQueryProvider } from '../common/withQueryProvider.tsx';

website/src/components/User/GroupPage.tsx

@@ -1,7 +1,7 @@
 import { type FC, type FormEvent, useRef, useState } from 'react';
 
 import { useGroupPageHooks } from '../../hooks/useGroupOperations.ts';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import type { Address, GroupDetails } from '../../types/backend.ts';
 import { type ClientConfig } from '../../types/runtimeConfig.ts';
 import { ConfirmationDialog } from '../DeprecatedConfirmationDialog.tsx';

website/src/components/User/ListOfGroupsOfUser.tsx

@@ -1,7 +1,7 @@
 import { type FC, useState } from 'react';
 
 import { useRemoveFromGroup } from '../../hooks/useGroupOperations.ts';
-import { routes } from '../../routes.ts';
+import { routes } from '../../routes/routes.ts';
 import type { Group } from '../../types/backend.ts';
 import type { ClientConfig } from '../../types/runtimeConfig.ts';
 import { displayConfirmationDialog } from '../ConfirmationDialog.tsx';

website/src/components/User/UserPage.astro

@@ -2,7 +2,7 @@
 import { ListOfGroupsOfUser } from './ListOfGroupsOfUser.tsx';
 import { getRuntimeConfig } from '../../config';
 import BaseLayout from '../../layouts/BaseLayout.astro';
-import { routes } from '../../routes';
+import { routes } from '../../routes/routes';
 import { GroupManagementClient } from '../../services/groupManagementClient';
 import { KeycloakClientManager } from '../../utils/KeycloakClientManager';
 import { getAccessToken } from '../../utils/getAccessToken';

website/src/layouts/BaseLayout.astro

@@ -6,7 +6,7 @@ import Navigation from '../components/Navigation/Navigation.astro';
 import OrganismSelector from '../components/Navigation/OrganismSelector.astro';
 import { getWebsiteConfig } from '../config';
 import 'react-toastify/dist/ReactToastify.css';
-import { navigationItems } from '../routes';
+import { navigationItems } from '../routes/navigationItems';
 
 const websiteConfig = getWebsiteConfig();
 const { name: websiteName, logo } = websiteConfig;

website/src/pages/[organism]/my_sequences.astro

@@ -1,6 +1,6 @@
 ---
 import BaseLayout from '../../layouts/BaseLayout.astro';
-import { routes } from '../../routes';
+import { routes } from '../../routes/routes';
 import { GroupManagementClient } from '../../services/groupManagementClient';
 import { getAccessToken } from '../../utils/getAccessToken';
 

website/src/pages/[organism]/my_sequences/[group].astro

@@ -5,7 +5,7 @@ import { SearchPagination } from '../../../components/SearchPage/SearchPaginatio
 import { Table } from '../../../components/SearchPage/Table';
 import ErrorBox from '../../../components/common/ErrorBox.astro';
 import BaseLayout from '../../../layouts/BaseLayout.astro';
-import { MY_SEQUENCES } from '../../../routes';
+import { MY_SEQUENCES } from '../../../routes/routes';
 import { GroupManagementClient } from '../../../services/groupManagementClient';
 import { pageSize } from '../../../settings';
 import { getAccessToken } from '../../../utils/getAccessToken';

website/src/pages/[organism]/search/index.astro

@@ -5,7 +5,7 @@ import { SearchPagination } from '../../../components/SearchPage/SearchPaginatio
 import { Table } from '../../../components/SearchPage/Table';
 import ErrorBox from '../../../components/common/ErrorBox.astro';
 import BaseLayout from '../../../layouts/BaseLayout.astro';
-import { SEARCH } from '../../../routes';
+import { SEARCH } from '../../../routes/routes';
 import { pageSize } from '../../../settings';
 import { processParametersAndFetchSearch } from '../../../utils/processParametersAndFetchSearch';
 const {

website/src/pages/[organism]/submission/index.astro

@@ -1,7 +1,7 @@
 ---
 import { cleanOrganism } from '../../../components/Navigation/cleanOrganism';
 import BaseLayout from '../../../layouts/BaseLayout.astro';
-import { routes } from '../../../routes';
+import { routes } from '../../../routes/routes';
 
 const { organism } = cleanOrganism(Astro.params.organism);
 ---

website/src/pages/index.astro

@@ -1,7 +1,7 @@
 ---
 import { getConfiguredOrganisms, getWebsiteConfig } from '../config';
 import BaseLayout from '../layouts/BaseLayout.astro';
-import { routes } from '../routes';
+import { routes } from '../routes/routes';
 const websiteConfig = getWebsiteConfig();
 const { name: websiteName } = websiteConfig;
 ---

website/src/pages/organism-selector/[redirectTo].astro

@@ -1,7 +1,7 @@
 ---
 import { getConfiguredOrganisms } from '../../config';
 import BaseLayout from '../../layouts/BaseLayout.astro';
-import { routes } from '../../routes';
+import { routes } from '../../routes/routes';
 const redirectTo = Astro.params.redirectTo;
 
 const purposes: { [key: string]: string } = {

website/src/pages/seq/[accessionVersion].fa/index.ts

@@ -3,7 +3,7 @@ import { err, type Result } from 'neverthrow';
 
 import { getConfiguredOrganisms } from '../../../config';
 import { getReferenceGenomes } from '../../../config.ts';
-import { routes } from '../../../routes.ts';
+import { routes } from '../../../routes/routes.ts';
 import { LapisClient } from '../../../services/lapisClient.ts';
 import { type ProblemDetail } from '../../../types/backend.ts';
 import { parseAccessionVersionFromString } from '../../../utils/extractAccessionVersion.ts';

website/src/pages/seq/[accessionVersion]/getSequenceDetailsTableData.ts

@@ -2,7 +2,7 @@ import { Result } from 'neverthrow';
 
 import { getTableData, type TableDataEntry } from '../../../components/SequenceDetailsPage/getTableData.ts';
 import { getSchema } from '../../../config.ts';
-import { routes } from '../../../routes.ts';
+import { routes } from '../../../routes/routes.ts';
 import { BackendClient } from '../../../services/backendClient.ts';
 import { LapisClient } from '../../../services/lapisClient.ts';
 import type { DataUseTermsHistoryEntry, ProblemDetail } from '../../../types/backend.ts';

website/src/pages/seq/[accessionVersion]/versions.astro

@@ -4,7 +4,7 @@ import { sentenceCase } from 'change-case';
 import ErrorBox from '../../../components/common/ErrorBox.astro';
 import { getConfiguredOrganisms } from '../../../config';
 import BaseLayout from '../../../layouts/BaseLayout.astro';
-import { routes } from '../../../routes';
+import { routes } from '../../../routes/routes';
 import { LapisClient } from '../../../services/lapisClient';
 import {
     extractAccessionVersion,

website/src/routes/bottomNavigationItems.ts

@@ -0,0 +1,23 @@
+import { routes } from './routes.ts';
+export const bottomNavigationItems = [
+    {
+        text: 'About',
+        path: routes.aboutPage(),
+    },
+    {
+        text: 'Docs',
+        path: 'https://loculus-project.github.io/loculus/',
+    },
+    {
+        text: 'API docs',
+        path: routes.apiDocumentationPage(),
+    },
+    {
+        text: 'Governance',
+        path: routes.governancePage(),
+    },
+    {
+        text: 'Status',
+        path: routes.statusPage(),
+    },
+];

website/src/routes/navigationItems.ts

@@ -0,0 +1,46 @@
+import { bottomNavigationItems } from './bottomNavigationItems.ts';
+import { routes } from './routes.ts';
+export const navigationItems = {
+    top: topNavigationItems,
+    bottom: bottomNavigationItems,
+};
+
+function topNavigationItems(organism: string | undefined, isLoggedIn: boolean, loginUrl: string | undefined) {
+    if (organism === undefined) {
+        return [
+            {
+                text: 'Browse',
+                path: routes.organismSelectorPage('search'),
+            },
+            {
+                text: 'Submit',
+                path: routes.organismSelectorPage('submit'),
+            },
+            ...(isLoggedIn
+                ? [{ text: 'My account', path: routes.userOverviewPage() }]
+                : [{ text: 'Login', path: loginUrl! }]),
+            {
+                text: 'Datasets',
+                path: routes.datasetsPage(),
+            },
+        ];
+    }
+
+    return [
+        {
+            text: 'Browse',
+            path: routes.searchPage(organism),
+        },
+        {
+            text: 'Submit',
+            path: routes.submissionPage(organism),
+        },
+        ...(isLoggedIn
+            ? [{ text: 'My account', path: routes.userOverviewPage(organism) }]
+            : [{ text: 'Login', path: loginUrl! }]),
+        {
+            text: 'Datasets',
+            path: routes.datasetsPage(),
+        },
+    ];
+}