@genspectrum/dashboard-components 1.2.0 → 1.3.1

package/dist/util.d.ts

@@ -917,7 +917,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
+        'gs-genome-data-viewer': GenomeDataViewerComponent;
     }
 }
 
@@ -925,7 +925,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-wastewater-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-genome-data-viewer': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -933,7 +933,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-genome-data-viewer': GenomeDataViewerComponent;
+        'gs-mutation-comparison-component': MutationComparisonComponent;
     }
 }
 
@@ -941,7 +941,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-genome-data-viewer': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutation-comparison-component': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -965,7 +965,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-relative-growth-advantage': RelativeGrowthAdvantageComponent;
+        'gs-prevalence-over-time': PrevalenceOverTimeComponent;
     }
 }
 
@@ -973,7 +973,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-relative-growth-advantage': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-prevalence-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -981,7 +981,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutation-comparison-component': MutationComparisonComponent;
+        'gs-relative-growth-advantage': RelativeGrowthAdvantageComponent;
     }
 }
 
@@ -989,7 +989,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-mutation-comparison-component': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-relative-growth-advantage': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1013,7 +1013,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-prevalence-over-time': PrevalenceOverTimeComponent;
+        'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
     }
 }
 
@@ -1021,7 +1021,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-prevalence-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1029,7 +1029,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
+        'gs-mutations-over-time': MutationsOverTimeComponent;
     }
 }
 
@@ -1037,7 +1037,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1045,7 +1045,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutations-over-time': MutationsOverTimeComponent;
+        'gs-statistics': StatisticsComponent;
     }
 }
 
@@ -1053,7 +1053,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-statistics': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1077,7 +1077,11 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-statistics': StatisticsComponent;
+        'gs-date-range-filter': DateRangeFilterComponent;
+    }
+    interface HTMLElementEventMap {
+        [gsEventNames.dateRangeFilterChanged]: CustomEvent<Record<string, string>>;
+        [gsEventNames.dateRangeOptionChanged]: DateRangeOptionChangedEvent;
     }
 }
 
@@ -1085,7 +1089,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-statistics': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-date-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1093,11 +1097,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-date-range-filter': DateRangeFilterComponent;
-    }
-    interface HTMLElementEventMap {
-        [gsEventNames.dateRangeFilterChanged]: CustomEvent<Record<string, string>>;
-        [gsEventNames.dateRangeOptionChanged]: DateRangeOptionChangedEvent;
+        'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
     }
 }
 
@@ -1105,7 +1105,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-date-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-wastewater-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1132,10 +1132,10 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-text-filter': TextFilterComponent;
+        'gs-mutation-filter': MutationFilterComponent;
     }
     interface HTMLElementEventMap {
-        [gsEventNames.textFilterChanged]: TextFilterChangedEvent;
+        [gsEventNames.mutationFilterChanged]: CustomEvent<MutationsFilter>;
     }
 }
 
@@ -1143,7 +1143,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-text-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutation-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1151,10 +1151,10 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutation-filter': MutationFilterComponent;
+        'gs-text-filter': TextFilterComponent;
     }
     interface HTMLElementEventMap {
-        [gsEventNames.mutationFilterChanged]: CustomEvent<MutationsFilter>;
+        [gsEventNames.textFilterChanged]: TextFilterChangedEvent;
     }
 }
 
@@ -1162,7 +1162,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-mutation-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-text-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@genspectrum/dashboard-components",
-    "version": "1.2.0",
+    "version": "1.3.1",
     "description": "GenSpectrum web components for building dashboards",
     "type": "module",
     "license": "AGPL-3.0-only",

package/src/lapisApi/lapisApi.ts

@@ -9,6 +9,8 @@ import {
     mutationsResponse,
     problemDetail,
     type ProblemDetail,
+    type MutationsOverTimeRequest,
+    mutationsOverTimeResponse,
 } from './lapisTypes';
 import { type SequenceType } from '../types';
 import { lineageDefinitionResponseSchema } from './LineageDefinition';
@@ -112,6 +114,28 @@ export async function fetchSubstitutionsOrDeletions(
     return mutationsResponse.parse(await response.json());
 }
 
+export async function fetchMutationsOverTime(
+    lapisUrl: string,
+    body: MutationsOverTimeRequest,
+    sequenceType: SequenceType,
+    signal?: AbortSignal,
+) {
+    const response = await callLapis(
+        mutationsOverTimeEndpoint(lapisUrl, sequenceType),
+        {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(body),
+            signal,
+        },
+        `${sequenceType} mutations over time`,
+    );
+
+    return mutationsOverTimeResponse.parse(await response.json());
+}
+
 export async function fetchReferenceGenome(lapisUrl: string, signal?: AbortSignal) {
     const response = await callLapis(
         referenceGenomeEndpoint(lapisUrl),
@@ -215,6 +239,11 @@ export const substitutionsOrDeletionsEndpoint = (lapisUrl: string, sequenceType:
         ? `${lapisUrl}/sample/aminoAcidMutations`
         : `${lapisUrl}/sample/nucleotideMutations`;
 };
+export const mutationsOverTimeEndpoint = (lapisUrl: string, sequenceType: SequenceType) => {
+    return sequenceType === 'amino acid'
+        ? `${lapisUrl}/component/aminoAcidMutationsOverTime`
+        : `${lapisUrl}/component/nucleotideMutationsOverTime`;
+};
 export const referenceGenomeEndpoint = (lapisUrl: string) => `${lapisUrl}/sample/referenceGenome`;
 export const lineageDefinitionEndpoint = (lapisUrl: string, lapisField: string) =>
     `${lapisUrl}/sample/lineageDefinition/${lapisField}`;

package/src/lapisApi/lapisTypes.ts

@@ -7,6 +7,13 @@ export const orderBy = z.object({
     type: orderByType,
 });
 
+const filterValue = z.union([z.string(), z.number(), z.boolean(), z.null(), z.undefined(), z.array(z.string())]);
+
+const dateRange = z.object({
+    dateFrom: z.string(),
+    dateTo: z.string(),
+});
+
 export const lapisBaseRequest = z
     .object({
         limit: z.number().optional(),
@@ -14,7 +21,7 @@ export const lapisBaseRequest = z
         fields: z.array(z.string()).optional(),
         orderBy: z.array(orderBy).optional(),
     })
-    .catchall(z.union([z.boolean(), z.undefined(), z.string(), z.number(), z.null(), z.array(z.string())]));
+    .catchall(filterValue);
 export type LapisBaseRequest = z.infer<typeof lapisBaseRequest>;
 
 export const mutationsRequest = lapisBaseRequest.extend({ minProportion: z.number().optional() });
@@ -32,6 +39,33 @@ const mutationProportionCount = z.object({
 export const mutationsResponse = makeLapisResponse(z.array(mutationProportionCount));
 export type MutationsResponse = z.infer<typeof mutationsResponse>;
 
+export const mutationsOverTimeRequest = z.object({
+    filters: z.record(filterValue),
+    downloadAsFile: z.boolean().optional(),
+    downloadFileBasename: z.string().optional(),
+    compression: z.enum(['gzip', 'none']).optional(),
+    includeMutations: z.array(z.string()).optional(),
+    dateRanges: z.array(dateRange).optional(),
+    dateField: z.string().optional(),
+});
+export type MutationsOverTimeRequest = z.infer<typeof mutationsOverTimeRequest>;
+
+export const mutationsOverTimeResponse = makeLapisResponse(
+    z.object({
+        mutations: z.array(z.string()),
+        dateRanges: z.array(dateRange),
+        data: z.array(
+            z.array(
+                z.object({
+                    count: z.number(),
+                    coverage: z.number(),
+                }),
+            ),
+        ),
+    }),
+);
+export type MutationsOverTimeResponse = z.infer<typeof mutationsOverTimeResponse>;
+
 const insertionCount = z.object({
     insertion: z.string(),
     count: z.number(),

package/src/preact/mutationsOverTime/__mockData__/aminoAcidMutationsByDay.ts

@@ -11,6 +11,7 @@ export const aminoAcidMutationsByDay: MutationOverTimeMockData = {
         granularity: 'day',
         lapisDateField: 'date',
         lapis: 'https://lapis.cov-spectrum.org/open/v2',
+        useNewEndpoint: false,
     },
     response: {
         overallMutationData: [

package/src/preact/mutationsOverTime/__mockData__/byWeek.ts

@@ -11,6 +11,7 @@ export const byWeek: MutationOverTimeMockData = {
         granularity: 'week',
         lapisDateField: 'date',
         lapis: 'https://lapis.cov-spectrum.org/open/v2',
+        useNewEndpoint: false,
     },
     response: {
         overallMutationData: [

package/src/preact/mutationsOverTime/__mockData__/defaultMockData.ts

@@ -11,6 +11,7 @@ export const defaultMockData: MutationOverTimeMockData = {
         granularity: 'month',
         lapisDateField: 'date',
         lapis: 'https://lapis.cov-spectrum.org/open/v2',
+        useNewEndpoint: false,
     },
     response: {
         overallMutationData: [

package/src/preact/mutationsOverTime/__mockData__/noDataWhenNoMutationsAreInFilter.ts

@@ -10,6 +10,7 @@ export const noDataWhenNoMutationsAreInFilter: MutationOverTimeMockData = {
         granularity: 'year',
         lapisDateField: 'date',
         lapis: 'https://lapis.cov-spectrum.org/open/v2',
+        useNewEndpoint: false,
     },
     response: {
         overallMutationData: [],

package/src/preact/mutationsOverTime/__mockData__/noDataWhenThereAreNoDatesInFilter.ts

@@ -10,6 +10,7 @@ export const noDataWhenNoMutationsAreInFilter: MutationOverTimeMockData = {
         granularity: 'year',
         lapisDateField: 'date',
         lapis: 'https://lapis.cov-spectrum.org/open/v2',
+        useNewEndpoint: false,
     },
     response: {
         overallMutationData: [],

package/src/preact/mutationsOverTime/__mockData__/showsMessageWhenTooManyMutations.ts

@@ -10,6 +10,7 @@ export const showsMessageWhenTooManyMutations: MutationOverTimeMockData = {
         granularity: 'year',
         lapisDateField: 'date',
         lapis: 'https://lapis.cov-spectrum.org/open/v2',
+        useNewEndpoint: false,
     },
     response: {
         overallMutationData: [