Update prod from main

website/.prettierignore

@@ -0,0 +1,2 @@
+# Ignore maps, they should be as compact as possible. Pretty-printing increases the size by a factor of ~3.
+public/mapData/

website/package.json

@@ -8,7 +8,7 @@
         "build": "astro build",
         "preview": "astro preview",
         "astro": "astro",
-        "format": "eslint . --fix && prettier --ignore-path \"../.gitignore\" --write \"./**/*.{ts,tsx,json,astro,md,mdx,mjs,cjs}\"",
+        "format": "eslint . --fix && prettier --write \"./**/*.{ts,tsx,json,astro,md,mdx,mjs,cjs}\"",
         "check": "npm run check-format && npm run check-types && npm run check-astro && npm run check-lint",
         "check-format": "prettier --check \"**/*.{ts,tsx,json,astro,md,mdx,mjs,cjs}\"",
         "check-types": "astro sync && tsc --noEmit",
@@ -21,9 +21,9 @@
     "dependencies": {
         "@astrojs/node": "^9.0.0",
         "@auth/core": "^0.37.4",
-        "@genspectrum/dashboard-components": "^0.11.0",
+        "@genspectrum/dashboard-components": "^0.11.2",
         "@tanstack/react-query": "^5.62.7",
-        "astro": "^5.0.5",
+        "astro": "^5.0.8",
         "auth-astro": "^4.2.0",
         "axios": "^1.7.9",
         "dayjs": "^1.11.13",
@@ -38,33 +38,34 @@
     },
     "devDependencies": {
         "@astrojs/check": "^0.9.4",
-        "@astrojs/react": "^4.1.0",
+        "@astrojs/react": "^4.1.1",
         "@astrojs/tailwind": "^5.1.3",
-        "@eslint/js": "^9.16.0",
-        "@iconify-json/mdi": "^1.2.1",
-        "@iconify-json/mdi-light": "^1.2.1",
+        "@eslint/js": "^9.17.0",
+        "@iconify-json/mdi": "^1.2.2",
+        "@iconify-json/mdi-light": "^1.2.2",
         "@iconify/tailwind": "^1.2.0",
         "@playwright/test": "^1.49.1",
         "@tanstack/eslint-plugin-query": "^5.62.1",
         "@types/node": "^22.10.2",
         "@types/react": "^18.3.12",
         "@types/react-dom": "^18.3.1",
-        "@typescript-eslint/eslint-plugin": "^8.18.0",
-        "@typescript-eslint/parser": "^8.18.0",
+        "@types/topojson-specification": "^1.0.5",
+        "@typescript-eslint/eslint-plugin": "^8.18.1",
+        "@typescript-eslint/parser": "^8.18.1",
         "astro-eslint-parser": "^1.1.0",
-        "daisyui": "^4.12.20",
-        "eslint": "^9.16.0",
+        "daisyui": "^4.12.22",
+        "eslint": "^9.17.0",
         "eslint-plugin-astro": "^1.3.1",
         "eslint-plugin-import": "^2.31.0",
         "eslint-plugin-react": "^7.37.2",
         "eslint-plugin-react-hooks": "^5.1.0",
-        "msw": "^2.6.8",
+        "msw": "^2.6.9",
         "prettier": "^3.4.2",
         "prettier-plugin-astro": "^0.14.1",
         "prettier-plugin-tailwindcss": "^0.6.9",
         "tailwindcss": "^3.4.16",
         "typescript": "^5.7.2",
-        "typescript-eslint": "^8.18.0",
+        "typescript-eslint": "^8.18.1",
         "vitest": "^2.1.8",
         "zod": "^3.24.1"
     }

website/src/components/genspectrum/GsSequencesByLocation.astro

@@ -0,0 +1,48 @@
+---
+import { type LapisFilter } from '@genspectrum/dashboard-components/util';
+
+import { getSequencesByLocationMapData } from '../../util/getSequencesByLocationMapData';
+import { defaultTablePageSize } from '../../views/View';
+import ComponentWrapper from '../ComponentWrapper.astro';
+
+interface Props {
+    title: string;
+    height?: string;
+    lapisLocationField: string;
+    lapisFilter: LapisFilter;
+    mapName?: string;
+}
+
+const { title, height, lapisLocationField, lapisFilter, mapName } = Astro.props;
+
+const mapData = getSequencesByLocationMapData(mapName, Astro.url);
+---
+
+<ComponentWrapper title={title} height={height}>
+    {
+        mapData === undefined ? (
+            <gs-sequences-by-location
+                lapisLocationField={lapisLocationField}
+                lapisFilter={JSON.stringify(lapisFilter)}
+                pageSize={defaultTablePageSize}
+                views={JSON.stringify(['table'])}
+                width='100%'
+                height='100%'
+            />
+        ) : (
+            <gs-sequences-by-location
+                lapisLocationField={lapisLocationField}
+                lapisFilter={JSON.stringify(lapisFilter)}
+                pageSize={defaultTablePageSize}
+                views={JSON.stringify(['map', 'table'])}
+                mapSource={JSON.stringify(mapData.mapSource)}
+                width='100%'
+                height='100%'
+                zoom={mapData.zoom}
+                offsetX={mapData.offsetX}
+                offsetY={mapData.offsetY}
+                enableMapNavigation
+            />
+        )
+    }
+</ComponentWrapper>

website/src/components/pageStateSelectors/SequencingEffortsPageStateSelector.tsx

@@ -4,6 +4,8 @@ import { useMemo, useState } from 'react';
 import { ApplyFilterButton } from './ApplyFilterButton.tsx';
 import { BaselineSelector, type DateRangeFilterConfig, type LocationFilterConfig } from './BaselineSelector.tsx';
 import { SelectorHeadline } from './SelectorHeadline.tsx';
+import { toVariantFilter, type VariantFilterConfig } from './VariantFilterConfig.ts';
+import { VariantSelector } from './VariantSelector.tsx';
 import type { OrganismsConfig } from '../../config.ts';
 import type { LapisLocation } from '../../views/helpers.ts';
 import { type OrganismViewKey, Routing } from '../../views/routing.ts';
@@ -12,15 +14,18 @@ import type { sequencingEffortsViewKey } from '../../views/viewKeys.ts';
 export function SequencingEffortsPageStateSelector({
     locationFilterConfig,
     dateRangeFilterConfig,
+    variantFilterConfig,
     organismViewKey,
     organismsConfig,
 }: {
     locationFilterConfig: LocationFilterConfig;
     dateRangeFilterConfig: DateRangeFilterConfig;
+    variantFilterConfig: VariantFilterConfig;
     organismViewKey: OrganismViewKey & `${string}.${typeof sequencingEffortsViewKey}`;
     organismsConfig: OrganismsConfig;
 }) {
     const [location, setLocation] = useState<LapisLocation>(locationFilterConfig.initialLocation);
+    const [variantFilterConfigState, setVariantFilterConfigState] = useState<VariantFilterConfig>(variantFilterConfig);
     const [dateRange, setDateRange] = useState<DateRangeOption>(dateRangeFilterConfig.initialDateRange);
     const view = useMemo(() => new Routing(organismsConfig), [organismsConfig]).getOrganismView(organismViewKey);
 
@@ -30,8 +35,9 @@ export function SequencingEffortsPageStateSelector({
                 location,
                 dateRange,
             },
+            variantFilter: toVariantFilter(variantFilterConfigState),
         }),
-        [location, dateRange],
+        [location, dateRange, variantFilterConfigState],
     );
 
     return (
@@ -45,6 +51,13 @@ export function SequencingEffortsPageStateSelector({
                     dateRangeFilterConfig={dateRangeFilterConfig}
                 />
             </div>
+            <div>
+                <VariantSelector
+                    onVariantFilterChange={setVariantFilterConfigState}
+                    variantFilterConfig={variantFilterConfigState}
+                    hideMutationFilter={true}
+                />
+            </div>
             <ApplyFilterButton pageStateHandler={view.pageStateHandler} newPageState={newPageState} />
         </div>
     );

website/src/components/pageStateSelectors/VariantSelector.tsx

@@ -6,9 +6,11 @@ import { GsMutationFilter } from '../genspectrum/GsMutationFilter.tsx';
 export function VariantSelector({
     onVariantFilterChange,
     variantFilterConfig,
+    hideMutationFilter,
 }: {
     variantFilterConfig: VariantFilterConfig;
     onVariantFilterChange: (variantFilter: VariantFilterConfig) => void;
+    hideMutationFilter?: boolean | undefined;
 }) {
     return (
         <div className='flex flex-col gap-2'>
@@ -29,19 +31,21 @@ export function VariantSelector({
                     key={lineageFilterConfig.lapisField}
                 />
             ))}
-            <GsMutationFilter
-                initialValue={getMutationFilter(variantFilterConfig.mutationFilterConfig)}
-                onMutationChange={(mutation) => {
-                    if (mutation === undefined) {
-                        return;
-                    }
-                    const newVariantFilterConfig = {
-                        ...variantFilterConfig,
-                        mutationFilterConfig: mutation,
-                    };
-                    onVariantFilterChange(newVariantFilterConfig);
-                }}
-            />
+            {!hideMutationFilter && (
+                <GsMutationFilter
+                    initialValue={getMutationFilter(variantFilterConfig.mutationFilterConfig)}
+                    onMutationChange={(mutation) => {
+                        if (mutation === undefined) {
+                            return;
+                        }
+                        const newVariantFilterConfig = {
+                            ...variantFilterConfig,
+                            mutationFilterConfig: mutation,
+                        };
+                        onVariantFilterChange(newVariantFilterConfig);
+                    }}
+                />
+            )}
         </div>
     );
 }

website/src/components/views/analyzeSingleVariant/CollectionsList.tsx

@@ -3,7 +3,7 @@ import { useMemo, useState } from 'react';
 import { z } from 'zod';
 
 import type { OrganismsConfig } from '../../../config.ts';
-import { type CovidAnalyzeSingleVariantData } from '../../../views/covid.ts';
+import { type CovidVariantData } from '../../../views/covid.ts';
 import { Routing } from '../../../views/routing.ts';
 import { withQueryProvider } from '../../subscriptions/backendApi/withQueryProvider.tsx';
 
@@ -104,7 +104,7 @@ function CollectionVariantList({ collection, organismsConfig }: CollectionVarian
         const currentPageState = routing
             .getOrganismView('covid.singleVariantView')
             .pageStateHandler.parsePageStateFromUrl(new URL(window.location.href));
-        let newPageState: CovidAnalyzeSingleVariantData;
+        let newPageState: CovidVariantData;
         const query = querySchema.parse(JSON.parse(variant.query));
         if (query.variantQuery !== undefined) {
             newPageState = {

website/src/components/views/analyzeSingleVariant/GenericAnalyzeSingleVariantPage.astro

@@ -5,7 +5,7 @@ import SingleVariantOrganismPageLayout from '../../../layouts/OrganismPage/Singl
 import { chooseGranularityBasedOnDateRange } from '../../../util/chooseGranularityBasedOnDateRange';
 import { hasOnlyUndefinedValues } from '../../../util/hasOnlyUndefinedValues';
 import { getLineageFilterConfigs, getLineageFilterFields } from '../../../views/View';
-import { getLocationSubdivision } from '../../../views/helpers';
+import { getLocationSubdivision } from '../../../views/locationHelpers';
 import { type OrganismViewKey, type OrganismWithViewKey } from '../../../views/routing';
 import { ServerSide } from '../../../views/serverSideRouting';
 import { singleVariantViewKey } from '../../../views/viewKeys';

website/src/components/views/compareSideBySide/GenericCompareSideBySidePage.astro

@@ -15,9 +15,10 @@ import { CompareSideBySideSelectorFallback } from '../../pageStateSelectors/Fall
 type OrganismViewCompareVariant = OrganismWithViewKey<typeof compareSideBySideViewKey>;
 interface Props {
     organism: OrganismViewCompareVariant;
+    hideMutationFilter?: boolean;
 }
 
-const { organism } = Astro.props;
+const { organism, hideMutationFilter } = Astro.props;
 const organismViewKey = `${organism}.${compareSideBySideViewKey}` satisfies OrganismViewKey;
 const view = ServerSide.routing.getOrganismView(organismViewKey);
 
@@ -97,8 +98,12 @@ const pageState = view.pageStateHandler.parsePageStateFromUrl(Astro.url);
                                 lapisDateField={view.organismConstants.mainDateField}
                                 granularity={timeGranularity}
                             />
-                            <GsMutations lapisFilter={numeratorFilter} sequenceType='nucleotide' />
-                            <GsMutations lapisFilter={numeratorFilter} sequenceType='amino acid' />
+                            {!hideMutationFilter && (
+                                <>
+                                    <GsMutations lapisFilter={numeratorFilter} sequenceType='nucleotide' />
+                                    <GsMutations lapisFilter={numeratorFilter} sequenceType='amino acid' />
+                                </>
+                            )}
                             <GsAggregate
                                 title='Sub-lineages'
                                 fields={getLineageFilterFields(view.organismConstants.lineageFilters)}

website/src/components/views/sequencingEfforts/GenericSequencingEffortsPage.astro

@@ -3,13 +3,15 @@ import { getDashboardsConfig } from '../../../config';
 import SingleVariantOrganismPageLayout from '../../../layouts/OrganismPage/SingleVariantOrganismPageLayout.astro';
 import { chooseGranularityBasedOnDateRange } from '../../../util/chooseGranularityBasedOnDateRange';
 import { ComponentHeight } from '../../../views/OrganismConstants';
-import { getLocationSubdivision } from '../../../views/helpers';
+import { getLineageFilterConfigs, getLineageFilterFields } from '../../../views/View';
+import { getLocationDisplayConfig } from '../../../views/locationHelpers';
 import { type OrganismViewKey, type OrganismWithViewKey } from '../../../views/routing';
 import { ServerSide } from '../../../views/serverSideRouting';
 import { sequencingEffortsViewKey } from '../../../views/viewKeys';
 import ComponentsGrid from '../../ComponentsGrid.astro';
 import GsAggregate from '../../genspectrum/GsAggregate.astro';
 import GsNumberSequencesOverTime from '../../genspectrum/GsNumberSequencesOverTime.astro';
+import GsSequencesByLocation from '../../genspectrum/GsSequencesByLocation.astro';
 import { SequencingEffortsSelectorFallback } from '../../pageStateSelectors/FallbackElement';
 import { SequencingEffortsPageStateSelector } from '../../pageStateSelectors/SequencingEffortsPageStateSelector';
 
@@ -21,17 +23,22 @@ interface Props {
 const { organism } = Astro.props;
 const organismViewKey: OrganismViewKey = `${organism}.${sequencingEffortsViewKey}` satisfies OrganismViewKey;
 const view = ServerSide.routing.getOrganismView(organismViewKey);
-const pageState = view.pageStateHandler.parsePageStateFromUrl(Astro.url);
 
-const datasetLapisFilter = view.pageStateHandler.toLapisFilter(pageState);
+const pageState = view.pageStateHandler.parsePageStateFromUrl(Astro.url);
 
+const variantLapisFilter = view.pageStateHandler.toLapisFilter(pageState);
 const timeGranularity = chooseGranularityBasedOnDateRange(
     pageState.datasetFilter.dateRange,
     new Date(view.organismConstants.earliestDate),
 );
-const { label: subdivisionLabel, field: subdivisionField } = getLocationSubdivision(
-    view.organismConstants.locationFields,
-    pageState.datasetFilter.location,
+const {
+    label: locationLabel,
+    locationField,
+    mapName,
+} = getLocationDisplayConfig(view.organismConstants.locationFields, pageState.datasetFilter.location);
+const lineageFilterConfigs = getLineageFilterConfigs(
+    view.organismConstants.lineageFilters,
+    pageState.variantFilter.lineages,
 );
 ---
 
@@ -52,6 +59,7 @@ const { label: subdivisionLabel, field: subdivisionField } = getLocationSubdivis
         organismViewKey={organismViewKey}
         organismsConfig={getDashboardsConfig().dashboards.organisms}
         client:only='react'
+        variantFilterConfig={{ mutationFilterConfig: pageState.variantFilter.mutations, lineageFilterConfigs }}
     >
         <SequencingEffortsSelectorFallback slot='fallback' />
     </SequencingEffortsPageStateSelector>
@@ -61,31 +69,37 @@ const { label: subdivisionLabel, field: subdivisionField } = getLocationSubdivis
             lapisFilters={[
                 {
                     displayName: '',
-                    lapisFilter: datasetLapisFilter,
+                    lapisFilter: variantLapisFilter,
                 },
             ]}
             lapisDateField={view.organismConstants.mainDateField}
             granularity={timeGranularity}
         />
         {
-            subdivisionField !== undefined && (
-                <GsAggregate
-                    title={subdivisionLabel}
+            locationField !== undefined && (
+                <GsSequencesByLocation
+                    title={locationLabel}
                     height={ComponentHeight.large}
-                    fields={[subdivisionField]}
-                    lapisFilter={datasetLapisFilter}
+                    lapisLocationField={locationField}
+                    lapisFilter={variantLapisFilter}
+                    mapName={mapName}
                 />
             )
         }
         <GsAggregate
             title='Hosts'
             height={ComponentHeight.large}
             fields={[view.organismConstants.hostField]}
-            lapisFilter={datasetLapisFilter}
+            lapisFilter={variantLapisFilter}
+        />
+        <GsAggregate
+            title='Sub-lineages'
+            fields={getLineageFilterFields(view.organismConstants.lineageFilters)}
+            lapisFilter={variantLapisFilter}
         />
         {
             view.organismConstants.additionalSequencingEffortsFields.map(({ label, fields, height }) => (
-                <GsAggregate title={label} height={height} fields={fields} lapisFilter={datasetLapisFilter} />
+                <GsAggregate title={label} height={height} fields={fields} lapisFilter={variantLapisFilter} />
             ))
         }
     </ComponentsGrid>

website/src/layouts/base/header/Header.astro

@@ -10,11 +10,11 @@ interface Props {
 }
 const { forceLoggedOutState = false } = Astro.props;
 
-const zIndexHigherThanMutationFilterInfoButton = 'z-20';
+const zIndexHigherThanLeafletButtons = 'z-[1100]';
 const commonHeaderCss = `${headerHeight} gap-4 items-center justify-between`;
 ---
 
-<header class={`sticky top-0 ${zIndexHigherThanMutationFilterInfoButton} border-b bg-white`}>
+<header class={`sticky top-0 ${zIndexHigherThanLeafletButtons} border-b bg-white`}>
     <div class={`${commonHeaderCss} hidden sm:flex `}>
         <Brand />
         <Navigation />

website/src/pages/covid/single-variant.astro

@@ -15,7 +15,7 @@ import SingleVariantOrganismPageLayout from '../../layouts/OrganismPage/SingleVa
 import { chooseGranularityBasedOnDateRange } from '../../util/chooseGranularityBasedOnDateRange';
 import { hasOnlyUndefinedValues } from '../../util/hasOnlyUndefinedValues';
 import { getLineageFilterConfigs, getLineageFilterFields } from '../../views/View';
-import { getLocationSubdivision } from '../../views/helpers';
+import { getLocationSubdivision } from '../../views/locationHelpers';
 import { type OrganismViewKey } from '../../views/routing';
 import { ServerSide } from '../../views/serverSideRouting';