fix(website): fix sequence versions page and display submission dates (…

…#1462) Previously, the version page did not show the versions in some cases.
loculus-project · Mar 24, 2024 · 1d2d5e0 · 1d2d5e0
1 parent 23a6319
commit 1d2d5e0
Show file tree

Hide file tree

Showing 7 changed files with 76 additions and 49 deletions.
diff --git a/website/src/components/SequenceDetailsPage/getTableData.ts b/website/src/components/SequenceDetailsPage/getTableData.ts
@@ -1,5 +1,4 @@
 import { sentenceCase } from 'change-case';
-import { DateTime, FixedOffsetZone } from 'luxon';
 import { err, Result } from 'neverthrow';
 
 import { type LapisClient } from '../../services/lapisClient.ts';
@@ -13,6 +12,7 @@ import {
     type SequenceEntryHistory,
     type SequenceEntryHistoryEntry,
 } from '../../types/lapis.ts';
+import { parseUnixTimestamp } from '../../utils/parseUnixTimestamp.ts';
 
 export type TableDataEntry = { label: string; name: string; value: string | number; customDisplay?: CustomDisplay };
 
@@ -145,7 +145,7 @@ function mapValueToDisplayedValue(value: undefined | null | string | number, met
     }
 
     if (metadata.type === 'timestamp' && typeof value === 'number') {
-        return DateTime.fromSeconds(value, { zone: FixedOffsetZone.utcInstance }).toFormat('yyyy-MM-dd TTT');
+        return parseUnixTimestamp(value);
     }
 
     return value;

diff --git a/website/src/env.d.ts b/website/src/env.d.ts
@@ -1,3 +1,4 @@
+/// <reference path="../.astro/types.d.ts" />
 /// <reference types="astro/client" />
 
 type TokenCookie = {

diff --git a/website/src/pages/seq/[accessionVersion]/getVersionsData.ts b/website/src/pages/seq/[accessionVersion]/getVersionsData.ts
@@ -0,0 +1,33 @@
+import { err, ok } from 'neverthrow';
+
+import { getConfiguredOrganisms } from '../../../config.ts';
+import { LapisClient } from '../../../services/lapisClient.ts';
+
+export const getVersionsData = async (accession: string) => {
+    const organisms = getConfiguredOrganisms();
+    const promises = organisms.map(async ({ key }) => {
+        const lapisClient = LapisClient.createForOrganism(key);
+
+        const versionListResult = (await lapisClient.getAllSequenceEntryHistoryForAccession(accession))
+            .mapErr((error) => error.detail)
+            .andThen((result) => (result.length > 0 ? ok(result) : err('Sequence not found')));
+        return {
+            organism: key,
+            result: versionListResult,
+        };
+    });
+
+    const queries = await Promise.all(promises);
+    let versionListResult = queries[0].result;
+    let organism: string | undefined;
+
+    for (const query of queries) {
+        if (query.result.isOk()) {
+            versionListResult = query.result!;
+            organism = query.organism!;
+            break;
+        }
+    }
+
+    return { versionListResult, organism };
+};
diff --git a/website/src/pages/seq/[accessionVersion]/versions.astro b/website/src/pages/seq/[accessionVersion]/versions.astro
@@ -1,11 +1,10 @@
 ---
 import { sentenceCase } from 'change-case';
 
+import { getVersionsData } from './getVersionsData';
 import ErrorBox from '../../../components/common/ErrorBox.astro';
-import { getConfiguredOrganisms } from '../../../config';
 import BaseLayout from '../../../layouts/BaseLayout.astro';
 import { routes } from '../../../routes/routes';
-import { LapisClient } from '../../../services/lapisClient';
 import {
     extractAccessionVersion,
     getAccessionVersionString,
@@ -14,31 +13,8 @@ import {
 import { getVersionStatusColor } from '../../../utils/getVersionStatusColor';
 
 const accessionVersion = Astro.params.accessionVersion!;
-
 const { accession } = parseAccessionVersionFromString(accessionVersion);
-
-const organisms = getConfiguredOrganisms();
-const promises = organisms.map(async ({ key }) => {
-    const lapisClient = LapisClient.createForOrganism(key);
-
-    const versionListResult = await lapisClient.getAllSequenceEntryHistoryForAccession(accession);
-    return {
-        organism: key,
-        result: versionListResult,
-    };
-});
-
-const queries = await Promise.all(promises);
-let versionListResult = queries[0].result;
-let organism: string | undefined;
-
-for (const query of queries) {
-    if (query.result.isOk()) {
-        versionListResult = query.result!;
-        organism = query.organism!;
-        break;
-    }
-}
+const { organism, versionListResult } = await getVersionsData(accession);
 ---
 
 <BaseLayout title={accession + ' versions'} implicitOrganism={organism}>
@@ -52,24 +28,28 @@ for (const query of queries) {
                 (list) => {
                     return list.map((version) => (
                         <li class='mb-4'>
-                            <div class='flex flex-row gap-3 justify-start'>
-                                <a
-                                    href={routes.sequencesDetailsPage(
-                                        getAccessionVersionString(extractAccessionVersion(version)),
-                                    )}
-                                >
-                                    {getAccessionVersionString(extractAccessionVersion(version))}
-                                </a>
-
-                                <p class={`font-bold ${getVersionStatusColor(version.versionStatus)}`}>
-                                    ({sentenceCase(version.versionStatus)})
-                                </p>
+                            <div class='mb-2'>
+                                <div class='font-semibold'>{version.submittedAt}</div>
+                                <div class='flex flex-row gap-3 justify-start'>
+                                    <a
+                                        href={routes.sequencesDetailsPage(
+                                            getAccessionVersionString(extractAccessionVersion(version)),
+                                        )}
+                                        class='underline'
+                                    >
+                                        {getAccessionVersionString(extractAccessionVersion(version))}
+                                    </a>
+
+                                    <p class={`font-bold ${getVersionStatusColor(version.versionStatus)}`}>
+                                        ({sentenceCase(version.versionStatus)})
+                                    </p>
+                                </div>
                             </div>
                         </li>
                     ));
                 },
                 (error) => {
-                    return <ErrorBox title='Request for sequence history failed'>{error.detail}</ErrorBox>;
+                    return <ErrorBox title='Request for sequence history failed'>{error}</ErrorBox>;
                 },
             )
         }

diff --git a/website/src/services/lapisClient.ts b/website/src/services/lapisClient.ts
@@ -9,6 +9,7 @@ import {
     ACCESSION_FIELD,
     ACCESSION_VERSION_FIELD,
     IS_REVOCATION_FIELD,
+    SUBMITTED_AT_FIELD,
     VERSION_FIELD,
     VERSION_STATUS_FIELD,
 } from '../settings.ts';
@@ -96,11 +97,11 @@ export class LapisClient extends ZodiosWrapperClient<typeof lapisApi> {
                 VERSION_FIELD,
                 VERSION_STATUS_FIELD,
                 IS_REVOCATION_FIELD,
+                SUBMITTED_AT_FIELD,
             ],
             orderBy: [{ field: VERSION_FIELD, type: 'ascending' }],
         };
         const result = await this.call('details', request);
-
         const createSequenceHistoryProblemDetail = (detail: string): ProblemDetail => ({
             type: 'about:blank',
             title: 'Could not get sequence entry history',

diff --git a/website/src/types/lapis.ts b/website/src/types/lapis.ts
@@ -1,6 +1,7 @@
 import z, { type ZodTypeAny } from 'zod';
 
 import { accessionVersion, type ProblemDetail } from './backend.ts';
+import { parseUnixTimestamp } from '../utils/parseUnixTimestamp.ts';
 
 export const orderByType = z.enum(['ascending', 'descending']);
 export type OrderByType = z.infer<typeof orderByType>;
@@ -77,13 +78,19 @@ export type SiloVersionStatus = z.infer<typeof siloVersionStatusSchema>;
 
 export const siloBooleanWorkaround = z.enum(['true', 'false']).transform((value) => value === 'true');
 
-export const sequenceEntryHistoryEntry = accessionVersion.merge(
-    z.object({
-        accessionVersion: z.string(),
-        versionStatus: siloVersionStatusSchema,
-        isRevocation: siloBooleanWorkaround,
-    }),
-);
+export const sequenceEntryHistoryEntry = accessionVersion
+    .merge(
+        z.object({
+            accessionVersion: z.string(),
+            versionStatus: siloVersionStatusSchema,
+            isRevocation: siloBooleanWorkaround,
+            submittedAt: z.number(),
+        }),
+    )
+    .transform((raw) => ({
+        ...raw,
+        submittedAt: parseUnixTimestamp(raw.submittedAt),
+    }));
 
 export type SequenceEntryHistoryEntry = z.infer<typeof sequenceEntryHistoryEntry>;
 

diff --git a/website/src/utils/parseUnixTimestamp.ts b/website/src/utils/parseUnixTimestamp.ts
@@ -0,0 +1,5 @@
+import { DateTime, FixedOffsetZone } from 'luxon';
+
+export function parseUnixTimestamp(value: number) {
+    return DateTime.fromSeconds(value, { zone: FixedOffsetZone.utcInstance }).toFormat('yyyy-MM-dd TTT');
+}