react-msaview 5.0.6 → 5.0.13

package/dist/model.js

@@ -1,19 +1,18 @@
-import { clamp, fetchAndMaybeUnzipText, groupBy, localStorageGetBoolean, localStorageSetBoolean, notEmpty, sum, } from '@jbrowse/core/util';
+import { clamp, fetchAndMaybeUnzipText, groupBy, notEmpty, sum, } from '@jbrowse/core/util';
 import { openLocation } from '@jbrowse/core/util/io';
 import { ElementId, FileLocation } from '@jbrowse/core/util/types/mst';
 import { addDisposer, cast, types } from '@jbrowse/mobx-state-tree';
 import { colord } from 'colord';
-import { ascending } from 'd3-array';
-import { cluster, hierarchy } from 'd3-hierarchy';
 import { autorun, transaction } from 'mobx';
-import { A3mMSA, ClustalMSA, EmfMSA, FastaMSA, StockholmMSA, generateNodeIds, gffToInterProResults, parseEmfTree, parseGFF, parseNewick, stockholmSniff, } from 'msa-parsers';
+import { generateNodeIds, gffToInterProResults, parseEmfTree, parseGFF, parseMSA, parseNewick, } from 'msa-parsers';
 import { blocksX, blocksY } from "./calculateBlocks.js";
 import colorSchemes from "./colorSchemes.js";
 import ConservationTrack from "./components/ConservationTrack.js";
 import TextTrack from "./components/TextTrack.js";
-import { defaultAllowedGappyness, defaultBgColor, defaultColWidth, defaultColorSchemeName, defaultContrastLettering, defaultCurrentAlignment, defaultDrawLabels, defaultDrawMsaLetters, defaultDrawNodeBubbles, defaultDrawTree, defaultHeight, defaultHideGaps, defaultLabelsAlignRight, defaultRowHeight, defaultScrollX, defaultScrollY, defaultShowBranchLen, defaultShowDomains, defaultSubFeatureRows, defaultTreeAreaWidth, defaultTreeWidth, defaultTreeWidthMatchesArea, } from "./constants.js";
+import { defaultAllowedGappyness, defaultBgColor, defaultColWidth, defaultColorSchemeName, defaultCurrentAlignment, defaultDrawLabels, defaultDrawMsaLetters, defaultDrawNodeBubbles, defaultDrawTree, defaultHeight, defaultHideGaps, defaultLabelsAlignRight, defaultRowHeight, defaultScrollX, defaultScrollY, defaultShowBranchLen, defaultShowDomains, defaultSubFeatureRows, defaultTreeAreaWidth, defaultTreeWidth, } from "./constants.js";
 import { createPaletteMap } from "./createPaletteMap.js";
 import { flatToTree } from "./flatToTree.js";
+import { clusterLayout, collapse, find, hierarchy, leaves, links, maxLength, setBrLength, sort, sum as hierarchySum, } from "./hierarchy.js";
 import { measureTextCanvas } from "./measureTextCanvas.js";
 import { DataModelF } from "./model/DataModel.js";
 import { DialogQueueSessionMixin } from "./model/DialogQueue.js";
@@ -21,12 +20,10 @@ import { MSAModelF } from "./model/msaModel.js";
 import { TreeModelF } from "./model/treeModel.js";
 import { calculateNeighborJoiningTree } from "./neighborJoining.js";
 import { parseAsn1 } from "./parseAsn1.js";
-import { reparseTree } from "./reparseTree.js";
 import { globalColToVisibleCol, visibleColToGlobalCol, visibleColToSeqPosForRow, } from "./rowCoordinateCalculations.js";
 import { seqPosToGlobalCol } from "./seqPosToGlobalCol.js";
-import { collapse, len, maxLength, setBrLength, skipBlanks } from "./util.js";
+import { len, skipBlanks } from "./util.js";
 import { saveAs } from "./vendor/fileSaver.js";
-const showZoomStarKey = 'msa-showZoomStar';
 /**
  * #stateModel MsaView
  * extends
@@ -54,10 +51,6 @@ function stateModelFactory() {
          * #property
          */
         allowedGappyness: defaultAllowedGappyness,
-        /**
-         * #property
-         */
-        contrastLettering: defaultContrastLettering,
         /**
          * #property
          */
@@ -119,7 +112,6 @@ function stateModelFactory() {
         gffFilehandle: types.maybe(FileLocation),
         /**
          * #property
-         *
          */
         currentAlignment: defaultCurrentAlignment,
         /**
@@ -128,12 +120,6 @@ function stateModelFactory() {
          * hidden)
          */
         collapsed: types.array(types.string),
-        /**
-         * #property
-         * array of tree leaf nodes that are 'collapsed' (just that leaf node
-         * is hidden)
-         */
-        collapsedLeaves: types.array(types.string),
         /**
          * #property
          * focus on particular subtree
@@ -178,11 +164,6 @@ function stateModelFactory() {
          * screens
          */
         highResScaleFactor: 2,
-        /**
-         * #volatile
-         * obtained from localStorage
-         */
-        showZoomStar: localStorageGetBoolean(showZoomStarKey, false),
         /**
          * #volatile
          */
@@ -257,10 +238,6 @@ function stateModelFactory() {
          * #volatile
          */
         error: undefined,
-        /**
-         * #volatile
-         */
-        annotPos: undefined,
         /**
          * #volatile
          */
@@ -285,24 +262,12 @@ function stateModelFactory() {
         setAllowedGappyness(arg) {
             self.allowedGappyness = arg;
         },
-        /**
-         * #action
-         */
-        setContrastLettering(arg) {
-            self.contrastLettering = arg;
-        },
         /**
          * #action
          */
         setLoadingMSA(arg) {
             self.loadingMSA = arg;
         },
-        /**
-         * #action
-         */
-        setShowZoomStar(arg) {
-            self.showZoomStar = arg;
-        },
         /**
          * #action
          */
@@ -346,14 +311,12 @@ function stateModelFactory() {
                 self.hoveredTreeNode = undefined;
                 return;
             }
-            // Find the node in the hierarchy
-            const node = self.hierarchy.find(n => n.data.id === nodeId);
+            const node = find(self.hierarchy, n => n.data.id === nodeId);
             if (!node) {
                 self.hoveredTreeNode = undefined;
                 return;
             }
-            // Get all descendant leaf names
-            const descendantNames = node.leaves().map(leaf => leaf.data.name);
+            const descendantNames = leaves(node).map(leaf => leaf.data.name);
             self.hoveredTreeNode = { nodeId, descendantNames };
         },
         /**
@@ -422,17 +385,6 @@ function stateModelFactory() {
                 self.collapsed.push(node);
             }
         },
-        /**
-         * #action
-         */
-        toggleCollapsedLeaf(node) {
-            if (self.collapsedLeaves.includes(node)) {
-                self.collapsedLeaves.remove(node);
-            }
-            else {
-                self.collapsedLeaves.push(node);
-            }
-        },
         /**
          * #action
          */
@@ -489,9 +441,7 @@ function stateModelFactory() {
          */
         get hideGapsEffective() {
             return (self.hideGaps &&
-                (self.collapsed.length > 0 ||
-                    self.collapsedLeaves.length > 0 ||
-                    self.allowedGappyness < 100));
+                (self.collapsed.length > 0 || self.allowedGappyness < 100));
         },
         /**
          * #getter
@@ -505,9 +455,6 @@ function stateModelFactory() {
         get actuallyShowDomains() {
             return self.showDomains && !!self.interProAnnotations;
         },
-        /**
-         * #getter
-         */
         get viewInitialized() {
             return self.volatileWidth !== undefined;
         },
@@ -539,7 +486,7 @@ function stateModelFactory() {
          * #getter
          */
         get header() {
-            return this.MSA?.getHeader() || {};
+            return (this.MSA?.getHeader() || {});
         },
         /**
          * #getter
@@ -553,15 +500,9 @@ function stateModelFactory() {
         get noTree() {
             return !!this.tree.noTree;
         },
-        /**
-         * #getter
-         */
         get noDomains() {
             return !self.interProAnnotations;
         },
-        /**
-         * #getter
-         */
         menuItems() {
             return [];
         },
@@ -576,24 +517,9 @@ function stateModelFactory() {
          */
         get MSA() {
             const text = self.data.msa;
-            if (text) {
-                if (stockholmSniff(text)) {
-                    return new StockholmMSA(text, self.currentAlignment);
-                }
-                else if (A3mMSA.sniff(text)) {
-                    return new A3mMSA(text);
-                }
-                else if (text.startsWith('>')) {
-                    return new FastaMSA(text);
-                }
-                else if (text.startsWith('SEQ')) {
-                    return new EmfMSA(text);
-                }
-                else {
-                    return new ClustalMSA(text);
-                }
-            }
-            return null;
+            // uses parseMSA so the named MSAParserType return type is portable
+            // to downstream consumers (avoids TS2883 with default exports)
+            return text ? parseMSA(text, self.currentAlignment) : null;
         },
         /**
          * #getter
@@ -606,7 +532,7 @@ function stateModelFactory() {
          */
         get tree() {
             const text = self.data.tree;
-            return reparseTree(text
+            return text
                 ? generateNodeIds(text.startsWith('BioTreeContainer')
                     ? flatToTree(parseAsn1(text))
                     : parseNewick(text.startsWith('SEQ') ? parseEmfTree(text).tree : text))
@@ -615,7 +541,7 @@ function stateModelFactory() {
                     children: [],
                     id: 'empty',
                     name: 'empty',
-                });
+                };
         },
         /**
          * #getter
@@ -661,25 +587,27 @@ function stateModelFactory() {
          * #getter
          */
         get root() {
-            let hier = hierarchy(this.tree, d => d.children)
-                // todo: investigate whether needed, typescript says children always true
-                // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-                .sum(d => (d.children ? 0 : 1))
-                // eslint-disable-next-line unicorn/no-array-sort
-                .sort((a, b) => ascending(a.data.length || 1, b.data.length || 1));
+            let hier = hierarchy(this.tree, d => d.children);
+            hierarchySum(hier, d => (d.children.length > 0 ? 0 : 1));
+            sort(hier, (a, b) => (a.data.length ?? 1) - (b.data.length ?? 1));
             if (self.showOnly) {
-                const res = hier.find(n => n.data.id === self.showOnly);
+                const res = find(hier, n => n.data.id === self.showOnly);
                 if (res) {
                     hier = res;
                 }
             }
-            ;
-            [...self.collapsed, ...self.collapsedLeaves]
-                .map(collapsedId => hier.find(node => node.data.id === collapsedId))
-                .filter(notEmpty)
-                .forEach(node => {
-                collapse(node);
-            });
+            for (const collapsedId of self.collapsed) {
+                const node = find(hier, n => n.data.id === collapsedId);
+                if (!node) {
+                    continue;
+                }
+                if (node.children) {
+                    collapse(node);
+                }
+                else if (node.parent?.children) {
+                    node.parent.children = node.parent.children.filter(c => c.data.id !== collapsedId);
+                }
+            }
             return hier;
         },
         /**
@@ -1072,30 +1000,28 @@ function stateModelFactory() {
          */
         get hierarchy() {
             const r = this.root;
-            const clust = cluster()
-                .size([this.totalHeight, self.treeWidth])
-                .separation(() => 1);
-            clust(r);
-            setBrLength(r, (r.data.length = 0), self.treeWidth / maxLength(r));
+            clusterLayout(r, this.totalHeight, self.treeWidth);
+            r.data.length = 0;
+            setBrLength(r, 0, self.treeWidth / maxLength(r));
             return r;
         },
         /**
          * #getter
          */
         get totalHeight() {
-            return this.root.leaves().length * self.rowHeight;
+            return leaves(this.root).length * self.rowHeight;
         },
         /**
          * #getter
          */
         get leaves() {
-            return this.hierarchy.leaves();
+            return leaves(this.hierarchy);
         },
         /**
          * #getter
          */
         get allBranchesLength0() {
-            return this.hierarchy.links().every(s => !s.source.data.length);
+            return links(this.hierarchy).every(s => !s.source.data.length);
         },
         /**
          * #getter
@@ -1148,13 +1074,7 @@ function stateModelFactory() {
          * #getter
          */
         get blocks2d() {
-            const ret = [];
-            for (const by of self.blocksY) {
-                for (const bx of self.blocksX) {
-                    ret.push([bx, by]);
-                }
-            }
-            return ret;
+            return self.blocksY.flatMap(by => self.blocksX.map(bx => [bx, by]));
         },
         /**
          * #getter
@@ -1257,14 +1177,17 @@ function stateModelFactory() {
         /**
          * #action
          */
+        doScrollY(deltaY) {
+            self.scrollY = clamp(self.scrollY + deltaY, -self.totalHeight + 10, 0);
+        },
         setInterProAnnotations(data) {
             self.interProAnnotations = data;
         },
-        /**
-         * #action
-         */
-        doScrollY(deltaY) {
-            self.scrollY = clamp(self.scrollY + deltaY, -self.totalHeight + 10, 0);
+        applyGFFText(gffText) {
+            const gffRecords = parseGFF(gffText);
+            const interProResults = gffToInterProResults(gffRecords);
+            self.interProAnnotations = interProResults;
+            self.setShowDomains(true);
         },
         /**
          * #action
@@ -1301,14 +1224,11 @@ function stateModelFactory() {
          * #getter
          */
         get labelsWidth() {
-            let x = 0;
             const { rowHeight, leaves, treeMetadata, fontSize } = self;
-            if (rowHeight > 5) {
-                for (const node of leaves) {
-                    x = Math.max(measureTextCanvas(treeMetadata[node.data.name]?.genome || node.data.name, fontSize), x);
-                }
+            if (rowHeight <= 5) {
+                return 0;
             }
-            return x;
+            return leaves.reduce((max, node) => Math.max(max, measureTextCanvas(treeMetadata[node.data.name]?.genome || node.data.name, fontSize)), 0);
         },
         /**
          * #getter
@@ -1327,16 +1247,19 @@ function stateModelFactory() {
          */
         get adapterTrackModels() {
             const { rowHeight, MSA, hideGapsEffective, blanks } = self;
-            return (MSA?.tracks
-                .filter(t => t.data)
+            const tracks = (MSA?.tracks ?? []);
+            return tracks
+                .filter(t => !!t.data)
                 .map(t => ({
                 model: {
                     ...t,
-                    data: hideGapsEffective ? skipBlanks(blanks, t.data) : t.data,
+                    data: hideGapsEffective && t.data
+                        ? skipBlanks(blanks, t.data)
+                        : t.data,
                     height: rowHeight,
                 },
                 ReactComponent: TextTrack,
-            })) || []);
+            }));
         },
         /**
          * #getter
@@ -1461,6 +1384,29 @@ function stateModelFactory() {
         },
     }))
         .views(self => ({
+        /**
+         * #getter
+         * Returns information about the currently hovered cell
+         */
+        get hoveredCell() {
+            const { mouseCol, mouseRow } = self;
+            if (mouseCol === undefined || mouseRow === undefined) {
+                return undefined;
+            }
+            const rowName = self.rowNames[mouseRow];
+            if (!rowName) {
+                return undefined;
+            }
+            const seq = self.columns[rowName];
+            const base = seq?.[mouseCol];
+            const seqPos = self.visibleColToSeqPosOneBased(rowName, mouseCol);
+            return {
+                rowName,
+                col: mouseCol,
+                base,
+                seqPos,
+            };
+        },
         /**
          * #getter
          * widget width minus the tree area gives the space for the MSA
@@ -1477,53 +1423,30 @@ function stateModelFactory() {
         get totalTrackAreaHeight() {
             return sum(self.turnedOnTracks.map(r => r.model.height));
         },
-        /**
-         * #getter
-         */
         get tidyInterProAnnotationTypes() {
-            const types = new Map();
-            for (const annot of this.tidyInterProAnnotations) {
-                types.set(annot.accession, annot);
-            }
-            return types;
+            return new Map(this.tidyInterProAnnotations.map(annot => [annot.accession, annot]));
         },
-        /**
-         * #getter
-         */
         get tidyInterProAnnotations() {
-            const ret = [];
             const { interProAnnotations } = self;
-            if (interProAnnotations) {
-                for (const [id, val] of Object.entries(interProAnnotations)) {
-                    for (const { signature, locations } of val.matches) {
-                        const { entry } = signature;
-                        if (entry) {
-                            const { name, accession, description } = entry;
-                            for (const { start, end } of locations) {
-                                ret.push({
-                                    id,
-                                    name,
-                                    accession,
-                                    description,
-                                    start,
-                                    end,
-                                });
-                            }
-                        }
-                    }
-                }
+            if (!interProAnnotations) {
+                return [];
             }
-            return ret.toSorted((a, b) => len(b) - len(a));
+            return Object.entries(interProAnnotations)
+                .flatMap(([id, val]) => val.matches.flatMap(({ signature, locations }) => signature.entry
+                ? locations.map(({ start, end }) => ({
+                    id,
+                    name: signature.entry.name,
+                    accession: signature.entry.accession,
+                    description: signature.entry.description,
+                    start,
+                    end,
+                }))
+                : []))
+                .toSorted((a, b) => len(b) - len(a));
         },
-        /**
-         * #getter
-         */
         get tidyFilteredInterProAnnotations() {
             return this.tidyInterProAnnotations.filter(r => self.featureFilters.get(r.accession));
         },
-        /**
-         * #getter
-         */
         get tidyFilteredGatheredInterProAnnotations() {
             return groupBy(this.tidyFilteredInterProAnnotations, r => r.id);
         },
@@ -1543,15 +1466,9 @@ function stateModelFactory() {
         get verticalScrollbarWidth() {
             return self.showVerticalScrollbar ? 20 : 0;
         },
-        /**
-         * #getter
-         */
         get fillPalette() {
             return createPaletteMap([...self.tidyInterProAnnotationTypes.keys()]);
         },
-        /**
-         * #getter
-         */
         get strokePalette() {
             return Object.fromEntries(Object.entries(this.fillPalette).map(([key, val]) => [
                 key,
@@ -1596,6 +1513,9 @@ function stateModelFactory() {
             self.setCurrentAlignment(0);
             self.setTreeFilehandle(undefined);
             self.setMSAFilehandle(undefined);
+            self.setGFFFilehandle(undefined);
+            self.setInterProAnnotations({});
+            self.setShowDomains(false);
         },
         /**
          * #action
@@ -1613,18 +1533,12 @@ function stateModelFactory() {
         incrementRef() {
             self.nref++;
         },
-        /**
-         * #action
-         */
         initFilter(arg) {
             const ret = self.featureFilters.get(arg);
             if (ret === undefined) {
                 self.featureFilters.set(arg, true);
             }
         },
-        /**
-         * #action
-         */
         setFilter(arg, flag) {
             self.featureFilters.set(arg, flag);
         },
@@ -1657,10 +1571,6 @@ function stateModelFactory() {
                     this.initFilter(key);
                 }
             }));
-            // autorun saves local settings
-            addDisposer(self, autorun(() => {
-                localStorageSetBoolean(showZoomStarKey, self.showZoomStar);
-            }));
             // autorun opens treeFilehandle
             addDisposer(self, autorun(async () => {
                 const { treeFilehandle } = self;
@@ -1695,16 +1605,26 @@ function stateModelFactory() {
                     }
                 }
             }));
+            // autorun parses inline gff text from data.gff
+            addDisposer(self, autorun(() => {
+                const gffText = self.data.gff;
+                if (gffText) {
+                    try {
+                        self.applyGFFText(gffText);
+                    }
+                    catch (e) {
+                        console.error(e);
+                        self.setError(e);
+                    }
+                }
+            }));
             // autorun opens gffFilehandle for InterProScan domains
             addDisposer(self, autorun(async () => {
                 const { gffFilehandle } = self;
                 if (gffFilehandle) {
                     try {
                         const gffText = await fetchAndMaybeUnzipText(openLocation(gffFilehandle));
-                        const gffRecords = parseGFF(gffText);
-                        const interProResults = gffToInterProResults(gffRecords);
-                        self.setInterProAnnotations(interProResults);
-                        self.setShowDomains(true);
+                        self.applyGFFText(gffText);
                         if (gffFilehandle.locationType === 'BlobLocation') {
                             self.setGFFFilehandle(undefined);
                         }
@@ -1754,10 +1674,8 @@ function stateModelFactory() {
                 self.columns;
             }));
             // autorun synchronizes treeWidth with treeAreaWidth
-            addDisposer(self, autorun(async () => {
-                if (self.treeWidthMatchesArea) {
-                    self.setTreeWidth(Math.max(50, self.treeAreaWidth - self.labelsWidth - 10 - self.marginLeft));
-                }
+            addDisposer(self, autorun(() => {
+                self.setTreeWidth(Math.max(50, self.treeAreaWidth - self.labelsWidth - 10 - self.marginLeft));
             }));
         },
     }))
@@ -1765,15 +1683,38 @@ function stateModelFactory() {
         const snap = result;
         const { data: { tree, msa, treeMetadata }, 
         // Main model properties
-        showDomains, hideGaps, allowedGappyness, contrastLettering, subFeatureRows, drawMsaLetters, height, rowHeight, scrollY, scrollX, colWidth, currentAlignment, collapsed, collapsedLeaves, showOnly, turnedOffTracks, featureFilters, relativeTo, 
+        showDomains, hideGaps, allowedGappyness, subFeatureRows, drawMsaLetters, height, rowHeight, scrollY, scrollX, colWidth, currentAlignment, collapsed, showOnly, turnedOffTracks, featureFilters, relativeTo, 
         // MSA model properties
         bgColor, colorSchemeName, 
         // Tree model properties
-        drawLabels, labelsAlignRight, treeAreaWidth, treeWidth, treeWidthMatchesArea, showBranchLen, drawTree, drawNodeBubbles, 
+        drawLabels, labelsAlignRight, treeAreaWidth, treeWidth, showBranchLen, drawTree, drawNodeBubbles, 
         // Always include
         ...rest } = snap;
-        // remove the MSA/tree data from the tree if the filehandle available in
-        // which case it can be reloaded on refresh
+        const defaults = {
+            showDomains: defaultShowDomains,
+            hideGaps: defaultHideGaps,
+            allowedGappyness: defaultAllowedGappyness,
+            subFeatureRows: defaultSubFeatureRows,
+            drawMsaLetters: defaultDrawMsaLetters,
+            height: defaultHeight,
+            rowHeight: defaultRowHeight,
+            scrollY: defaultScrollY,
+            scrollX: defaultScrollX,
+            colWidth: defaultColWidth,
+            currentAlignment: defaultCurrentAlignment,
+            bgColor: defaultBgColor,
+            colorSchemeName: defaultColorSchemeName,
+            drawLabels: defaultDrawLabels,
+            labelsAlignRight: defaultLabelsAlignRight,
+            treeAreaWidth: defaultTreeAreaWidth,
+            treeWidth: defaultTreeWidth,
+            showBranchLen: defaultShowBranchLen,
+            drawTree: defaultDrawTree,
+            drawNodeBubbles: defaultDrawNodeBubbles,
+        };
+        const nonDefaults = Object.fromEntries(Object.entries(defaults)
+            .filter(([key, def]) => snap[key] !== def)
+            .map(([key]) => [key, snap[key]]));
         return {
             ...rest,
             data: {
@@ -1781,29 +1722,9 @@ function stateModelFactory() {
                 ...(result.msaFilehandle ? {} : { msa }),
                 ...(result.treeMetadataFilehandle ? {} : { treeMetadata }),
             },
-            // Main model - only include non-default values
-            ...(showDomains !== defaultShowDomains ? { showDomains } : {}),
-            ...(hideGaps !== defaultHideGaps ? { hideGaps } : {}),
-            ...(allowedGappyness !== defaultAllowedGappyness
-                ? { allowedGappyness }
-                : {}),
-            ...(contrastLettering !== defaultContrastLettering
-                ? { contrastLettering }
-                : {}),
-            ...(subFeatureRows !== defaultSubFeatureRows ? { subFeatureRows } : {}),
-            ...(drawMsaLetters !== defaultDrawMsaLetters ? { drawMsaLetters } : {}),
-            ...(height !== defaultHeight ? { height } : {}),
-            ...(rowHeight !== defaultRowHeight ? { rowHeight } : {}),
-            ...(scrollY !== defaultScrollY ? { scrollY } : {}),
-            ...(scrollX !== defaultScrollX ? { scrollX } : {}),
-            ...(colWidth !== defaultColWidth ? { colWidth } : {}),
-            ...(currentAlignment !== defaultCurrentAlignment
-                ? { currentAlignment }
-                : {}),
+            ...nonDefaults,
             // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
             ...(collapsed?.length ? { collapsed } : {}),
-            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-            ...(collapsedLeaves?.length ? { collapsedLeaves } : {}),
             ...(showOnly !== undefined ? { showOnly } : {}),
             // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
             ...(turnedOffTracks && Object.keys(turnedOffTracks).length > 0
@@ -1814,26 +1735,6 @@ function stateModelFactory() {
                 ? { featureFilters }
                 : {}),
             ...(relativeTo !== undefined ? { relativeTo } : {}),
-            // MSA model - only include non-default values
-            ...(bgColor !== defaultBgColor ? { bgColor } : {}),
-            ...(colorSchemeName !== defaultColorSchemeName
-                ? { colorSchemeName }
-                : {}),
-            // Tree model - only include non-default values
-            ...(drawLabels !== defaultDrawLabels ? { drawLabels } : {}),
-            ...(labelsAlignRight !== defaultLabelsAlignRight
-                ? { labelsAlignRight }
-                : {}),
-            ...(treeAreaWidth !== defaultTreeAreaWidth ? { treeAreaWidth } : {}),
-            ...(treeWidth !== defaultTreeWidth ? { treeWidth } : {}),
-            ...(treeWidthMatchesArea !== defaultTreeWidthMatchesArea
-                ? { treeWidthMatchesArea }
-                : {}),
-            ...(showBranchLen !== defaultShowBranchLen ? { showBranchLen } : {}),
-            ...(drawTree !== defaultDrawTree ? { drawTree } : {}),
-            ...(drawNodeBubbles !== defaultDrawNodeBubbles
-                ? { drawNodeBubbles }
-                : {}),
         };
     });
 }