jbrowse-plugin-msaview 3.8.0 → 3.9.0

package/dist/AddHighlightModel/MsaToGenomeHighlight.js

@@ -1,41 +1,25 @@
 import React from 'react';
 import { getSession } from '@jbrowse/core/util';
 import { observer } from 'mobx-react';
-import { isMsaView } from '../MsaViewPanel/model';
+import { connectedHighlights } from './connectedHighlights';
 import { hasHoverPosition, useStyles } from './util';
 const MsaToGenomeHighlight = observer(function MsaToGenomeHighlight2({ model, }) {
     const { views, hovered } = getSession(model);
-    const msaView = views
-        .filter(isMsaView)
-        .find(v => v.connectedViewId === model.id);
-    // The persistent click selection always shows. The hover codon is suppressed
-    // while hovering the LGV — GenomeMouseoverHighlight handles the single-bp
-    // display in that case, so we don't stack a wider codon band on top of it.
-    const highlights = [
-        ...(msaView?.connectedClickHighlights ?? []),
-        ...(hasHoverPosition(hovered)
-            ? []
-            : (msaView?.connectedHoverHighlights ?? [])),
-    ];
+    const highlights = connectedHighlights(views, model.id, hasHoverPosition(hovered));
     return highlights.length ? (React.createElement(MsaToGenomeHighlightRenderer, { model: model, highlights: highlights })) : null;
 });
-// Inner component: handles the scroll-dependent rendering
 const MsaToGenomeHighlightRenderer = observer(function ({ model, highlights, }) {
     const { classes } = useStyles();
     const { offsetPx } = model;
-    return (React.createElement(React.Fragment, null, highlights.map((r, idx) => {
-        // Use the highlight's own refName, which is already in the connected
-        // view's coordinate space (it comes from the connectedFeature the
-        // launcher set on this LGV). Do NOT canonicalize: bpToPx matches
-        // displayed regions by exact refName with no alias resolution, so
-        // rewriting e.g. "chr17" to the assembly-canonical "17" misses a view
-        // whose regions are "chr17". (GenomeMouseoverHighlight does the same.)
+    return (React.createElement(React.Fragment, null, highlights.map(r => {
+        // bpToPx matches refNames exactly, so canonicalizing "chr17" to "17"
+        // would miss a view whose regions say "chr17"
         const s = model.bpToPx({ refName: r.refName, coord: r.start });
         const e = model.bpToPx({ refName: r.refName, coord: r.end });
         if (s && e) {
             const width = Math.max(Math.abs(e.offsetPx - s.offsetPx), 4);
             const left = Math.min(s.offsetPx, e.offsetPx) - offsetPx;
-            return (React.createElement("div", { key: `${r.refName}-${r.start}-${r.end}-${idx}`, className: classes.highlight, style: { left, width } }));
+            return (React.createElement("div", { key: `${r.refName}-${r.start}-${r.end}`, className: classes.highlight, style: { left, width } }));
         }
         return null;
     })));

package/dist/AddHighlightModel/connectedHighlights.d.ts

@@ -0,0 +1,9 @@
+interface Region {
+    refName: string;
+    start: number;
+    end: number;
+}
+export declare function connectedHighlights(views: readonly {
+    type: string;
+}[], genomeViewId: string, genomeHovered: boolean): Region[];
+export {};

package/dist/AddHighlightModel/connectedHighlights.js

@@ -0,0 +1,15 @@
+export function connectedHighlights(views, genomeViewId, genomeHovered) {
+    const regions = views
+        .filter(isLinkedMsaView)
+        .filter(v => v.connectedViewId === genomeViewId)
+        .flatMap(v => [
+        ...v.connectedClickHighlights,
+        ...(genomeHovered ? [] : v.connectedHoverHighlights),
+    ]);
+    return [
+        ...new Map(regions.map(r => [`${r.refName}:${r.start}-${r.end}`, r])).values(),
+    ];
+}
+function isLinkedMsaView(view) {
+    return view.type === 'MsaView';
+}

package/dist/AddHighlightModel/connectedHighlights.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/AddHighlightModel/connectedHighlights.test.js

@@ -0,0 +1,36 @@
+import { describe, expect, it } from 'vitest';
+import { connectedHighlights } from './connectedHighlights';
+const region = (start) => ({ refName: 'chr17', start, end: start + 3 });
+function msaView(id, click, hover) {
+    return {
+        type: 'MsaView',
+        connectedViewId: id,
+        connectedClickHighlights: [region(click)],
+        connectedHoverHighlights: [region(hover)],
+    };
+}
+describe('connectedHighlights', () => {
+    const views = [
+        { type: 'LinearGenomeView' },
+        msaView('lgv1', 100, 200),
+        msaView('lgv2', 300, 400),
+        msaView('lgv1', 500, 600),
+    ];
+    it('collects every MSA view linked to the genome view', () => {
+        expect(connectedHighlights(views, 'lgv1', false).map(r => r.start)).toEqual([100, 200, 500, 600]);
+    });
+    it('drops hover codons while the genome view is hovered', () => {
+        expect(connectedHighlights(views, 'lgv1', true).map(r => r.start)).toEqual([
+            100, 500,
+        ]);
+    });
+    it('draws a codon two views both highlight once', () => {
+        const both = [msaView('lgv1', 100, 200), msaView('lgv1', 100, 200)];
+        expect(connectedHighlights(both, 'lgv1', false).map(r => r.start)).toEqual([
+            100, 200,
+        ]);
+    });
+    it('returns nothing for an unlinked genome view', () => {
+        expect(connectedHighlights(views, 'lgv3', false)).toEqual([]);
+    });
+});

package/dist/AddHighlightModel/index.js

@@ -6,7 +6,6 @@ export default function AddHighlightComponentsModelF(pluginManager) {
     pluginManager.addToExtensionPoint(
     // @ts-expect-error v4 hosts have no contributeToExtensionPoint
     'LinearGenomeView-TracksContainerComponent', (rest, { model }) => {
-        // Quick check: don't add any components if no MSA view exists
         const { views } = getSession(model);
         const hasMsaView = views.some(v => isMsaView(v) && v.connectedViewId === model.id);
         if (!hasMsaView) {

package/dist/LaunchMsaView/components/BlastQuery/consts.d.ts

@@ -13,8 +13,10 @@ export type EbiMsaAlgorithm = (typeof ebiMsaAlgorithms)[number];
  * page and the rows merged on the query (utils/browserAlign.ts), with the tree
  * built by react-msaview's neighbour joining. It is the aligner for a launch
  * that must not depend on EBI, and for one that wants to be quick -- a
- * hundred rows take a second or two against a Job Dispatcher queue that has
- * been measured at anything from ten seconds to fifteen minutes.
+ * hundred 400-residue rows take under a second, and a hundred 1400-residue
+ * rows eight, against a Job Dispatcher queue that has been measured at
+ * anything from ten seconds to fifteen minutes. Past the per-sequence limit in
+ * browserAlign.ts it refuses and names an EBI aligner instead.
  */
 export declare const msaAlgorithms: readonly ["clustalo", "muscle", "kalign", "mafft", "browser"];
 export type MsaAlgorithm = (typeof msaAlgorithms)[number];
@@ -28,7 +30,6 @@ export declare const msaAlgorithmLabels: Record<MsaAlgorithm, string>;
  */
 export declare const blastDatabaseOptions: readonly ["uniprotkb_swissprot", "uniprotkb", "pan_proteomes", "uniprotkb_trembl"];
 export type BlastDatabase = (typeof blastDatabaseOptions)[number];
-export declare const defaultBlastDatabase: BlastDatabase;
 export declare const searchPrograms: readonly ["blastp", "phmmer"];
 export type SearchProgram = (typeof searchPrograms)[number];
 export declare const searchProgramLabels: Record<SearchProgram, string>;
@@ -46,7 +47,6 @@ export declare const searchProgramLabels: Record<SearchProgram, string>;
  */
 export declare const phmmerDatabaseOptions: readonly ["swissprot", "uniprotkb", "uniprotrefprot", "rp75", "rp55", "rp35", "rp15"];
 export type PhmmerDatabase = (typeof phmmerDatabaseOptions)[number];
-export declare const defaultPhmmerDatabase: PhmmerDatabase;
 export declare const defaultMaxHits = 100;
 export declare function snapBlastHitCount(maxHits: number): number;
 /**

package/dist/LaunchMsaView/components/BlastQuery/consts.js

@@ -17,8 +17,10 @@ export const ebiMsaAlgorithms = [
  * page and the rows merged on the query (utils/browserAlign.ts), with the tree
  * built by react-msaview's neighbour joining. It is the aligner for a launch
  * that must not depend on EBI, and for one that wants to be quick -- a
- * hundred rows take a second or two against a Job Dispatcher queue that has
- * been measured at anything from ten seconds to fifteen minutes.
+ * hundred 400-residue rows take under a second, and a hundred 1400-residue
+ * rows eight, against a Job Dispatcher queue that has been measured at
+ * anything from ten seconds to fifteen minutes. Past the per-sequence limit in
+ * browserAlign.ts it refuses and names an EBI aligner instead.
  */
 export const msaAlgorithms = [...ebiMsaAlgorithms, 'browser'];
 export const msaAlgorithmLabels = {
@@ -43,7 +45,7 @@ export const blastDatabaseOptions = [
 ];
 // curated, so it returns roughly one good sequence per species rather than the
 // many near-identical TrEMBL entries an alignment reads poorly
-export const defaultBlastDatabase = 'uniprotkb_swissprot';
+const defaultBlastDatabase = 'uniprotkb_swissprot';
 export const searchPrograms = ['blastp', 'phmmer'];
 export const searchProgramLabels = {
     blastp: 'blastp (sequence search)',
@@ -70,7 +72,7 @@ export const phmmerDatabaseOptions = [
     'rp35',
     'rp15',
 ];
-export const defaultPhmmerDatabase = 'swissprot';
+const defaultPhmmerDatabase = 'swissprot';
 /**
  * The hit counts EBI's ncbiblast accepts for `alignments` and `scores`. A value
  * off this list is a 400 at submit time, so a request is rounded up to the next

package/dist/LaunchMsaView/components/BlastQuery/searchChoiceStorage.d.ts

@@ -1,6 +1,4 @@
 import type { MsaAlgorithm, SearchChoice } from './consts';
-export declare const SEARCH_CHOICE_STORAGE_KEY = "msaView-blastSearch";
-export declare const MSA_ALGORITHM_STORAGE_KEY = "msaView-msaAlgorithm";
 export declare function validSearchChoice(stored: unknown): SearchChoice;
 export declare function validMsaAlgorithm(stored: unknown): MsaAlgorithm;
 export declare function useStoredSearchChoice(): readonly [SearchChoice, (choice: SearchChoice) => void];

package/dist/LaunchMsaView/components/BlastQuery/searchChoiceStorage.js

@@ -8,8 +8,8 @@ import { databaseOptionsFor, defaultSearchFor, msaAlgorithms, searchPrograms, }
 // comes back is checked against the current options before it is used — an
 // option this plugin has since dropped would otherwise reach EBI and come back
 // a 400, minutes after the user pressed Submit.
-export const SEARCH_CHOICE_STORAGE_KEY = 'msaView-blastSearch';
-export const MSA_ALGORITHM_STORAGE_KEY = 'msaView-msaAlgorithm';
+const SEARCH_CHOICE_STORAGE_KEY = 'msaView-blastSearch';
+const MSA_ALGORITHM_STORAGE_KEY = 'msaView-msaAlgorithm';
 const defaultSearch = defaultSearchFor('blastp');
 const defaultMsaAlgorithm = 'clustalo';
 export function validSearchChoice(stored) {

package/dist/LaunchMsaView/components/OrthologQuery/OrthologSourceSelect.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
 import type { OrthologSource } from '../../../MsaViewPanel/model';
-export declare const orthologSourceLabels: Record<OrthologSource, string>;
 export declare function validOrthologSource(stored: unknown): OrthologSource;
 export declare function useStoredOrthologSource(): readonly ["ncbi" | "panther" | "uniref", (source: OrthologSource) => void];
 export default function OrthologSourceSelect({ value, onChange, className, }: {

package/dist/LaunchMsaView/components/OrthologQuery/OrthologSourceSelect.js

@@ -3,7 +3,7 @@ import { MenuItem } from '@mui/material';
 import TextField2 from '../../../components/TextField2';
 import { useLocalStorage } from '../../../utils/useLocalStorage';
 const ORTHOLOG_SOURCE_STORAGE_KEY = 'msaview-ortholog-source';
-export const orthologSourceLabels = {
+const orthologSourceLabels = {
     ncbi: 'NCBI orthologs',
     panther: 'PANTHER',
     uniref: 'UniRef cluster',

package/dist/LaunchMsaView/components/OrthologQuery/QuerySpeciesSelect.js

@@ -3,12 +3,12 @@ import TextField2 from '../../../components/TextField2';
 import { resolveAssemblySpecies, resolveTaxId, } from '../../../utils/ncbiTaxonomy';
 import { fetchTaxonomyInfo } from '../../../utils/taxonomyNames';
 import { useDebounced, useFetch } from '../../../utils/useFetch';
-async function describeTaxon(query) {
-    const taxId = await resolveTaxId(query);
+async function describeTaxon(query, signal) {
+    const taxId = await resolveTaxId(query, signal);
     if (!taxId) {
         throw new Error(`No NCBI taxon matches "${query}"`);
     }
-    const info = (await fetchTaxonomyInfo([taxId])).get(taxId);
+    const info = (await fetchTaxonomyInfo([taxId], signal)).get(taxId);
     const label = [info?.sciname, info?.commonName && `(${info.commonName})`]
         .filter(Boolean)
         .join(' ');
@@ -40,14 +40,14 @@ export default function QuerySpeciesSelect({ value, assemblyName, onChange, clas
     // reported the throttle as "blocked by CORS policy" in the helper text.
     const { data: fromAssembly } = useFetch(assemblyName && typed === undefined
         ? [assemblyName, 'assembly-species']
-        : null, () => resolveAssemblySpecies(assemblyName), {
+        : null, signal => resolveAssemblySpecies(assemblyName, signal), {
         onSuccess: found => {
             if (found) {
                 onChange(found.taxId);
             }
         },
     });
-    const { data: fromText, error } = useFetch(debounced?.trim() ? [debounced.trim(), 'taxon'] : null, () => describeTaxon(debounced), {
+    const { data: fromText, error } = useFetch(debounced?.trim() ? [debounced.trim(), 'taxon'] : null, signal => describeTaxon(debounced, signal), {
         onSuccess: ({ taxId }) => {
             onChange(taxId);
         },

package/dist/LaunchMsaView/components/calculateProteinSequence.d.ts

@@ -7,12 +7,6 @@ export declare function calculateProteinSequence({ cds, sequence, geneticCodeId,
     geneticCodeId?: number;
     translExcept?: TranslExcept[];
 }): string;
-export declare function revlist(list: Feat[], seqlen: number): {
-    start: number;
-    end: number;
-    type?: string;
-    phase?: number;
-}[];
 /**
  * The translation core's own feature panel shows: the contig's or the
  * feature's genetic code, its alternative initiators, and any `transl_except`

package/dist/LaunchMsaView/components/calculateProteinSequence.js

@@ -24,7 +24,7 @@ function cdsId(feat) {
 function dedupe(list) {
     return list.filter((item, pos, ary) => !pos || cdsId(item) !== cdsId(ary[pos - 1]));
 }
-export function revlist(list, seqlen) {
+function revlist(list, seqlen) {
     return list
         .map(sub => ({
         ...sub,

package/dist/LaunchMsaView/components/types.d.ts

@@ -4,6 +4,3 @@ export interface Feat {
     type?: string;
     phase?: number;
 }
-export interface SeqState {
-    seq: string;
-}

package/dist/LaunchMsaView/util.d.ts

@@ -7,7 +7,6 @@ export declare function getTranscriptLength(feature: Feature): {
     mod: number;
 };
 export declare function getId(val?: Feature): string;
-export declare function getMatchableIds(val?: Feature): string[];
 export declare function featureMatchesId(feature: Feature, id: string): boolean;
 export declare function getTranscriptDisplayName(val?: Feature): string;
 export declare function getGeneDisplayName(val?: Feature): string;

package/dist/LaunchMsaView/util.js

@@ -39,7 +39,7 @@ export function getTranscriptLength(feature) {
 export function getId(val) {
     return val?.id() ?? '';
 }
-export function getMatchableIds(val) {
+function getMatchableIds(val) {
     return val
         ? uniqueDefined([
             val.id(),

package/dist/MsaViewPanel/afterCreateAutoruns.d.ts

@@ -1,20 +1,11 @@
 import type { JBrowsePluginMsaViewModel } from './model';
 export declare function loadStoredData(self: JBrowsePluginMsaViewModel): void;
 /**
- * Keep IndexedDB holding what the view holds. The first run writes a new row and
- * records its id in the session snapshot; later runs update that row, because
- * the alignment keeps changing after it arrives — react-msaview's
- * "calculate neighbor-joining tree" replaces `data.tree` — and a session
- * reopened against a stale row restores the wrong picture.
- *
- * `lastStoredData` is what makes that safe to run on every data change: it is
- * the only thing separating "this is new" from "this is what we just wrote", and
- * it is recorded whether or not the write succeeded, so a browser refusing
- * IndexedDB (private mode) fails once rather than in a loop.
- *
- * A view whose data comes from a filehandle -- or from the indexed block its
- * kept `init` names -- stores nothing at all: the file is the source of truth
- * and it is refetched at startup.
+ * Keep IndexedDB holding `unsavedDocuments`. A view writes in place only to a
+ * row it created (`ownsDataStoreRow`), and never deletes one, since other
+ * views may name it: an emptied set drops the id and cleanupOldData ages the
+ * row out. `lastStoredData` is recorded even when a write fails, so a browser
+ * refusing IndexedDB fails once rather than in a loop.
  */
 export declare function storeDataToIndexedDB(self: JBrowsePluginMsaViewModel): void;
 /**

package/dist/MsaViewPanel/afterCreateAutoruns.js

@@ -8,68 +8,70 @@ import { loadProteinDomains } from './loadProteinDomains';
 import { cleanupOldData, generateDataStoreId, retrieveMsaData, storeMsaData, } from './msaDataStore';
 import { runLaunch } from './runLaunch';
 import { getProteinViews } from './structureConnection';
+import { proteinPositionsInRange } from './transcriptMap';
 import { getUniprotIdFromAlphaFoldUrl, hasQueryRow, transcriptPosToVisibleCol, } from './util';
 const EXPIRED_MESSAGE = "This view's alignment is no longer in browser storage. Stored alignments are kept for 7 days after they were last used, and are lost when site data is cleared.";
 const RELAUNCHABLE = ' Retry runs the original search again and rebuilds it.';
 const START_OVER = ' Relaunch it from the gene to rebuild it.';
+const EXPIRED_EXTRAS_WARNING = 'Part of this view is no longer in browser storage: annotations, a tree or row metadata too large for the session. Stored documents are kept for 7 days after they were last used, and are lost when site data is cleared.';
 export function loadStoredData(self) {
-    const { dataStoreId, rows } = self;
-    if (dataStoreId && rows.length === 0) {
-        void (async () => {
-            try {
-                self.setLoadingStoredData(true);
-                const storedData = await retrieveMsaData(dataStoreId);
-                if (storedData) {
-                    // one transaction, so storeDataToIndexedDB sees the restored data and
-                    // the record of it together and does not write it straight back
-                    transaction(() => {
-                        if (storedData.msa) {
-                            self.setMSA(storedData.msa);
-                        }
-                        if (storedData.tree) {
-                            self.setTree(storedData.tree);
-                        }
-                        if (storedData.treeMetadata) {
-                            self.setTreeMetadata(storedData.treeMetadata);
-                        }
-                        if (storedData.gff) {
-                            self.setGFF(storedData.gff);
-                        }
-                        self.setLastStoredData(currentData(self));
-                    });
+    const { dataStoreId } = self;
+    if (!dataStoreId) {
+        return;
+    }
+    void (async () => {
+        try {
+            self.setLoadingStoredData(true);
+            const stored = await retrieveMsaData(dataStoreId);
+            if (self.dataStoreId !== dataStoreId) {
+                return;
+            }
+            transaction(() => {
+                if (stored) {
+                    const { data } = self;
+                    if (stored.msa && !data.msa) {
+                        self.setMSA(stored.msa);
+                    }
+                    if (stored.tree && !data.tree) {
+                        self.setTree(stored.tree);
+                    }
+                    if (stored.treeMetadata && !data.treeMetadata) {
+                        self.setTreeMetadata(stored.treeMetadata);
+                    }
+                    if (stored.gff && !data.gff) {
+                        self.setGFF(stored.gff);
+                    }
+                    self.setLastStoredData(stored);
                 }
                 else {
-                    // the id names nothing, so clearing it is what lets react-msaview's
-                    // "Return to import form" actually return instead of landing back
-                    // here. The request that built the alignment is kept, though: it is
-                    // the whole of a retry, and dropping it left the user reading an
-                    // apology with nothing to press.
-                    transaction(() => {
-                        self.setDataStoreId(undefined);
+                    self.setDataStoreId(undefined);
+                    if (hasAlignmentSource(self)) {
+                        self.addWarning(EXPIRED_EXTRAS_WARNING);
+                    }
+                    else {
                         self.setError(new Error(EXPIRED_MESSAGE +
                             ((self.blastParams ?? self.orthologParams)
                                 ? RELAUNCHABLE
                                 : START_OVER)));
-                    });
+                    }
                 }
-            }
-            catch (e) {
-                console.error('Failed to load MSA data from IndexedDB:', e);
-            }
-            finally {
-                self.setLoadingStoredData(false);
-            }
-        })();
-    }
+            });
+        }
+        catch (e) {
+            console.error('Failed to load MSA data from IndexedDB:', e);
+        }
+        finally {
+            self.setLoadingStoredData(false);
+        }
+    })();
 }
-/**
- * Everything react-msaview drops from the snapshot once it passes 50kB. The
- * GFF is among them: a local one's filehandle is cleared once it loads, so
- * this row is the only copy.
- */
-function currentData(self) {
-    const { msa, tree, treeMetadata, gff } = self.data;
-    return { msa, tree, treeMetadata, gff };
+function hasAlignmentSource(self) {
+    return !!(self.data.msa ||
+        self.msaFilehandle ||
+        self.init?.msaIndexedLocation);
+}
+function isEmpty(data) {
+    return !(data.msa || data.tree || data.treeMetadata || data.gff);
 }
 function sameData(a, b) {
     return (!!a &&
@@ -79,44 +81,37 @@ function sameData(a, b) {
         a.gff === b.gff);
 }
 /**
- * Keep IndexedDB holding what the view holds. The first run writes a new row and
- * records its id in the session snapshot; later runs update that row, because
- * the alignment keeps changing after it arrives — react-msaview's
- * "calculate neighbor-joining tree" replaces `data.tree` — and a session
- * reopened against a stale row restores the wrong picture.
- *
- * `lastStoredData` is what makes that safe to run on every data change: it is
- * the only thing separating "this is new" from "this is what we just wrote", and
- * it is recorded whether or not the write succeeded, so a browser refusing
- * IndexedDB (private mode) fails once rather than in a loop.
- *
- * A view whose data comes from a filehandle -- or from the indexed block its
- * kept `init` names -- stores nothing at all: the file is the source of truth
- * and it is refetched at startup.
+ * Keep IndexedDB holding `unsavedDocuments`. A view writes in place only to a
+ * row it created (`ownsDataStoreRow`), and never deletes one, since other
+ * views may name it: an emptied set drops the id and cleanupOldData ages the
+ * row out. `lastStoredData` is recorded even when a write fails, so a browser
+ * refusing IndexedDB fails once rather than in a loop.
  */
 export function storeDataToIndexedDB(self) {
-    const { rows, dataStoreId, isStoringData, lastStoredData, init } = self;
-    const data = currentData(self);
-    if (rows.length === 0 ||
-        isStoringData ||
-        self.msaFilehandle ||
-        self.treeFilehandle ||
-        // an indexed view keeps its init and refetches the block, so a row here
-        // would be one nothing ever reads
-        !!init?.msaIndexedLocation ||
-        !(data.msa || data.tree) ||
-        sameData(lastStoredData, data)) {
+    const { dataStoreId, ownsDataStoreRow, isStoringData, loadingStoredData, lastStoredData, } = self;
+    const data = self.unsavedDocuments;
+    if (isStoringData || loadingStoredData || sameData(lastStoredData, data)) {
+        return;
+    }
+    if (isEmpty(data)) {
+        if (lastStoredData) {
+            transaction(() => {
+                self.setDataStoreId(undefined);
+                self.setOwnsDataStoreRow(false);
+                self.setLastStoredData(data);
+            });
+        }
         return;
     }
-    // mark as storing synchronously so re-runs of this autorun (e.g. when data
-    // observables change while the write is pending) don't kick off a duplicate
-    // write and leave an orphan IndexedDB entry
     self.setIsStoringData(true);
     void (async () => {
         try {
-            const id = dataStoreId ?? generateDataStoreId();
+            const id = dataStoreId && ownsDataStoreRow ? dataStoreId : generateDataStoreId();
             if (await storeMsaData(id, data)) {
-                self.setDataStoreId(id);
+                transaction(() => {
+                    self.setDataStoreId(id);
+                    self.setOwnsDataStoreRow(true);
+                });
             }
         }
         catch (e) {
@@ -297,19 +292,15 @@ function genomeHighlightsToVisibleColumns(self, field) {
     if (!transcriptToMsaMap || !hasQueryRow(self)) {
         return [];
     }
-    const { g2p } = transcriptToMsaMap;
     const columns = new Set();
     for (const view of getProteinViews(getSession(self).views)) {
         for (const structure of view.structures) {
             if (structure.connectedViewId !== connectedViewId) {
                 continue;
             }
-            for (const highlight of structure[field] ?? []) {
-                for (let coord = highlight.start; coord < highlight.end; coord++) {
-                    const proteinPos = g2p[coord];
-                    const col = proteinPos === undefined
-                        ? undefined
-                        : transcriptPosToVisibleCol(self, proteinPos);
+            for (const { start, end } of structure[field] ?? []) {
+                for (const proteinPos of proteinPositionsInRange(transcriptToMsaMap, start, end)) {
+                    const col = transcriptPosToVisibleCol(self, proteinPos);
                     if (col !== undefined) {
                         columns.add(col);
                     }

package/dist/MsaViewPanel/components/MsaViewPanel.js

@@ -25,7 +25,7 @@ const MsaViewPanel = observer(function MsaViewPanel2({ model, }) {
     const expired = !!request && !!model.error && !model.dataInitialized;
     const launching = pending || expired || (!!init && !model.dataInitialized);
     return (React.createElement(ErrorBoundary, null,
-        React.createElement("div", null, launching ? (React.createElement(LaunchProgress, { model: model })) : loadingStoredData ? (React.createElement("div", { className: classes.loadingContainer },
+        React.createElement("div", null, launching ? (React.createElement(LaunchProgress, { model: model })) : loadingStoredData && !model.dataInitialized ? (React.createElement("div", { className: classes.loadingContainer },
             React.createElement(LoadingEllipses, { message: "Loading MSA data", variant: "h6" }))) : (React.createElement(MSAView, { model: model })))));
 });
 export default MsaViewPanel;