@jbrowse/plugin-alignments 2.17.0 → 2.18.0

package/esm/LinearPileupDisplay/SharedLinearPileupDisplayMixin.d.ts

@@ -1,13 +1,8 @@
-import { AnyConfigurationModel, AnyConfigurationSchemaType } from '@jbrowse/core/configuration';
 import SerializableFilterChain from '@jbrowse/core/pluggableElementTypes/renderers/util/serializableFilterChain';
-import { Feature } from '@jbrowse/core/util';
 import { ContentCopy as ContentCopyIcon } from '@jbrowse/core/ui/Icons';
-import { ColorBy, FilterBy } from '../shared/types';
-/**
- * #stateModel SharedLinearPileupDisplayMixin
- * #category display
- * extends `BaseLinearDisplay`
- */
+import type { ColorBy, FilterBy } from '../shared/types';
+import type { AnyConfigurationModel, AnyConfigurationSchemaType } from '@jbrowse/core/configuration';
+import type { Feature } from '@jbrowse/core/util';
 export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigurationSchemaType): import("mobx-state-tree").IModelType<{
     id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
     type: import("mobx-state-tree").ISimpleType<string>;
@@ -20,21 +15,12 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
 } & {
     blockState: import("mobx-state-tree").IMapType<import("mobx-state-tree").IModelType<{
         key: import("mobx-state-tree").ISimpleType<string>;
-        region: import("mobx-state-tree").IModelType<{
-            refName: import("mobx-state-tree").ISimpleType<string>;
-            start: import("mobx-state-tree").ISimpleType<number>;
-            end: import("mobx-state-tree").ISimpleType<number>;
-            reversed: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
-        } & {
-            assemblyName: import("mobx-state-tree").ISimpleType<string>;
-        }, {
-            setRefName(newRefName: string): void;
-        }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;
+        region: import("mobx-state-tree").IType<import("@jbrowse/core/util").Region, import("@jbrowse/core/util").Region, import("@jbrowse/core/util").Region>;
         reloadFlag: import("mobx-state-tree").IType<number | undefined, number, number>;
         isLeftEndOfDisplayedRegion: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
         isRightEndOfDisplayedRegion: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
     }, {
-        renderInProgress: AbortController | undefined;
+        stopToken: string | undefined;
         filled: boolean;
         reactElement: React.ReactElement | undefined;
         features: Map<string, Feature> | undefined;
@@ -58,15 +44,9 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
         doReload(): void;
         afterAttach(): void;
         setStatus(message: string): void;
-        setLoading(abortController: AbortController): void;
+        setLoading(newStopToken: string): void;
         setMessage(messageText: string): void;
-        setRendered(props: {
-            reactElement: React.ReactElement;
-            features: Map<string, Feature>;
-            layout: any;
-            maxHeightReached: boolean;
-            renderProps: any;
-        } | undefined): void;
+        setRendered(props: import("@jbrowse/plugin-linear-genome-view/src/BaseLinearDisplay/models/serverSideRenderedBlock").RenderedProps | undefined): void;
         setError(error: unknown): void;
         reload(): void;
         beforeDestroy(): void;
@@ -100,37 +80,13 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
         };
     }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 } & {
-    /**
-     * #property
-     */
     configuration: AnyConfigurationSchemaType;
-    /**
-     * #property
-     */
     featureHeight: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
-    /**
-     * #property
-     */
     noSpacing: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<boolean>>;
-    /**
-     * #property
-     */
     fadeLikelihood: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<boolean>>;
-    /**
-     * #property
-     */
     trackMaxHeight: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
-    /**
-     * #property
-     */
-    colorBy: import("mobx-state-tree").IType<ColorBy | undefined, ColorBy | undefined, ColorBy | undefined>;
-    /**
-     * #property
-     */
-    filterBy: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IType<FilterBy, FilterBy, FilterBy>, [undefined]>;
-    /**
-     * #property
-     */
+    colorBySetting: import("mobx-state-tree").IType<ColorBy | undefined, ColorBy | undefined, ColorBy | undefined>;
+    filterBySetting: import("mobx-state-tree").IType<FilterBy | undefined, FilterBy | undefined, FilterBy | undefined>;
     jexlFilters: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").ISimpleType<string>>, [undefined]>;
 }, {
     rendererTypeName: string;
@@ -221,6 +177,7 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
     readonly regionTooLarge: boolean;
     readonly regionTooLargeReason: string;
 } & {
+    readonly statsReadyAndRegionNotTooLarge: boolean;
     regionCannotBeRenderedText(_region: import("@jbrowse/core/util").Region): "" | "Force load to see features";
     regionCannotBeRendered(_region: import("@jbrowse/core/util").Region): import("react").JSX.Element | null;
 } & {
@@ -261,62 +218,25 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
     colorTagMap: import("mobx").ObservableMap<string, string>;
     featureUnderMouseVolatile: undefined | Feature;
     tagsReady: boolean;
+} & {
+    readonly colorBy: any;
+    readonly filterBy: any;
 } & {
     readonly autorunReady: boolean;
 } & {
-    /**
-     * #action
-     */
     setTagsReady(flag: boolean): void;
-    /**
-     * #action
-     */
     setMaxHeight(n?: number): void;
-    /**
-     * #action
-     */
     setFeatureHeight(n?: number): void;
-    /**
-     * #action
-     */
     setNoSpacing(flag?: boolean): void;
-    /**
-     * #action
-     */
     setColorScheme(colorScheme: ColorBy): void;
-    /**
-     * #action
-     */
     updateColorTagMap(uniqueTag: string[]): void;
-    /**
-     * #action
-     */
     setFeatureUnderMouse(feat?: Feature): void;
-    /**
-     * #action
-     */
     selectFeature(feature: Feature): void;
-    /**
-     * #action
-     * uses copy-to-clipboard and generates notification
-     */
     copyFeatureToClipboard(feature: Feature): void;
-    /**
-     * #action
-     */
     setConfig(conf: AnyConfigurationModel): void;
-    /**
-     * #action
-     */
     setFilterBy(filter: FilterBy): void;
-    /**
-     * #action
-     */
     setJexlFilters(filters: string[]): void;
 } & {
-    /**
-     * #getter
-     */
     readonly rendererConfig: {
         [x: string]: any;
     } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
@@ -329,34 +249,13 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
         } & import("mobx-state-tree").IStateTreeNode<AnyConfigurationSchemaType>);
     } & import("mobx-state-tree").IStateTreeNode<AnyConfigurationSchemaType>;
 } & {
-    /**
-     * #getter
-     */
     readonly maxHeight: any;
-    /**
-     * #getter
-     */
     readonly featureHeightSetting: any;
-    /**
-     * #getter
-     */
     readonly featureUnderMouse: Feature | undefined;
-    /**
-     * #getter
-     */
     renderReady(): boolean;
-    /**
-     * #getter
-     */
     readonly filters: SerializableFilterChain;
 } & {
-    /**
-     * #getter
-     */
     readonly rendererTypeName: string;
-    /**
-     * #method
-     */
     contextMenuItems(): ({
         label: string;
         icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
@@ -368,33 +267,16 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
         icon: typeof ContentCopyIcon;
         onClick: () => void;
     })[];
-    /**
-     * #getter
-     */
     readonly DisplayBlurb: ({ model, }: {
         model: {
-            sortedBy?: {
-                pos: number;
-                refName: number;
-                type: string;
-                tag?: string;
-            };
+            sortedBy?: import("../shared/types").SortedBy;
         };
     }) => import("react").JSX.Element | null;
-    /**
-     * #method
-     */
     renderPropsPre(): any;
-    /**
-     * #method
-     */
     colorSchemeSubMenuItems(): {
         label: string;
         onClick: () => void;
     }[];
-    /**
-     * #method
-     */
     trackMenuItems(): (import("@jbrowse/core/ui").MenuDivider | import("@jbrowse/core/ui").MenuSubHeader | import("@jbrowse/core/ui").NormalMenuItem | import("@jbrowse/core/ui").CheckboxMenuItem | import("@jbrowse/core/ui").RadioMenuItem | import("@jbrowse/core/ui").SubMenuItem | {
         label: string;
         icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
@@ -406,9 +288,7 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
     renderProps(): any;
 } & {
     afterAttach(): void;
-}, {
-    type: string;
-} & Partial<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
+}, import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
     id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
     type: import("mobx-state-tree").ISimpleType<string>;
     rpcDriverName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
@@ -420,21 +300,12 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
 } & {
     blockState: import("mobx-state-tree").IMapType<import("mobx-state-tree").IModelType<{
         key: import("mobx-state-tree").ISimpleType<string>;
-        region: import("mobx-state-tree").IModelType<{
-            refName: import("mobx-state-tree").ISimpleType<string>;
-            start: import("mobx-state-tree").ISimpleType<number>;
-            end: import("mobx-state-tree").ISimpleType<number>;
-            reversed: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
-        } & {
-            assemblyName: import("mobx-state-tree").ISimpleType<string>;
-        }, {
-            setRefName(newRefName: string): void;
-        }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;
+        region: import("mobx-state-tree").IType<import("@jbrowse/core/util").Region, import("@jbrowse/core/util").Region, import("@jbrowse/core/util").Region>;
         reloadFlag: import("mobx-state-tree").IType<number | undefined, number, number>;
         isLeftEndOfDisplayedRegion: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
         isRightEndOfDisplayedRegion: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
     }, {
-        renderInProgress: AbortController | undefined;
+        stopToken: string | undefined;
         filled: boolean;
         reactElement: React.ReactElement | undefined;
         features: Map<string, Feature> | undefined;
@@ -458,15 +329,9 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
         doReload(): void;
         afterAttach(): void;
         setStatus(message: string): void;
-        setLoading(abortController: AbortController): void;
+        setLoading(newStopToken: string): void;
         setMessage(messageText: string): void;
-        setRendered(props: {
-            reactElement: React.ReactElement;
-            features: Map<string, Feature>;
-            layout: any;
-            maxHeightReached: boolean;
-            renderProps: any;
-        } | undefined): void;
+        setRendered(props: import("@jbrowse/plugin-linear-genome-view/src/BaseLinearDisplay/models/serverSideRenderedBlock").RenderedProps | undefined): void;
         setError(error: unknown): void;
         reload(): void;
         beforeDestroy(): void;
@@ -499,12 +364,21 @@ export declare function SharedLinearPileupDisplayMixin(configSchema: AnyConfigur
             defaultValue: never[];
         };
     }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
-}>> & import("mobx-state-tree/dist/internal").NonEmptyObject & import("mobx-state-tree")._NotCustomized, {
-    type: string;
+} & {
+    configuration: AnyConfigurationSchemaType;
+    featureHeight: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
+    noSpacing: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<boolean>>;
+    fadeLikelihood: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<boolean>>;
+    trackMaxHeight: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
+    colorBySetting: import("mobx-state-tree").IType<ColorBy | undefined, ColorBy | undefined, ColorBy | undefined>;
+    filterBySetting: import("mobx-state-tree").IType<FilterBy | undefined, FilterBy | undefined, FilterBy | undefined>;
+    jexlFilters: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").ISimpleType<string>>, [undefined]>;
+}>>, {
     id: string;
+    type: string;
     configuration: import("mobx-state-tree").ModelSnapshotType<Record<string, any>>;
-    heightPreConfig: number | undefined;
     rpcDriverName: string | undefined;
+    heightPreConfig: number | undefined;
     userBpPerPxLimit: number | undefined;
     userByteSizeLimit: number | undefined;
 } & import("mobx-state-tree")._NotCustomized>;

package/esm/LinearPileupDisplay/SharedLinearPileupDisplayMixin.js

@@ -1,129 +1,82 @@
 import { lazy } from 'react';
-import { autorun, observable } from 'mobx';
-import { cast, types, addDisposer, isAlive } from 'mobx-state-tree';
-import copy from 'copy-to-clipboard';
-import { ConfigurationReference, readConfObject, getConf, } from '@jbrowse/core/configuration';
+import { ConfigurationReference, getConf, readConfObject, } from '@jbrowse/core/configuration';
 import SerializableFilterChain from '@jbrowse/core/pluggableElementTypes/renderers/util/serializableFilterChain';
-import { getRpcSessionId } from '@jbrowse/core/util/tracks';
-import { getEnv, getSession, getContainingView, getContainingTrack, isSessionModelWithWidgets, SimpleFeature, } from '@jbrowse/core/util';
-import { BaseLinearDisplay, } from '@jbrowse/plugin-linear-genome-view';
-// icons
 import { ContentCopy as ContentCopyIcon } from '@jbrowse/core/ui/Icons';
-import MenuOpenIcon from '@mui/icons-material/MenuOpen';
+import { SimpleFeature, getContainingTrack, getContainingView, getEnv, getSession, isSessionModelWithWidgets, } from '@jbrowse/core/util';
+import { getRpcSessionId } from '@jbrowse/core/util/tracks';
+import { BaseLinearDisplay } from '@jbrowse/plugin-linear-genome-view';
 import FilterListIcon from '@mui/icons-material/ClearAll';
-// locals
-import LinearPileupDisplayBlurb from './components/LinearPileupDisplayBlurb';
+import MenuOpenIcon from '@mui/icons-material/MenuOpen';
+import copy from 'copy-to-clipboard';
+import { autorun, observable } from 'mobx';
+import { addDisposer, cast, isAlive, types } from 'mobx-state-tree';
 import { createAutorun } from '../util';
+import LinearPileupDisplayBlurb from './components/LinearPileupDisplayBlurb';
 import { getUniqueTags } from '../shared/getUniqueTags';
-import { defaultFilterFlags } from '../shared/util';
-// lazies
 const FilterByTagDialog = lazy(() => import('../shared/components/FilterByTagDialog'));
 const ColorByTagDialog = lazy(() => import('./components/ColorByTagDialog'));
 const SetFeatureHeightDialog = lazy(() => import('./components/SetFeatureHeightDialog'));
 const SetMaxHeightDialog = lazy(() => import('./components/SetMaxHeightDialog'));
-// using a map because it preserves order
 const rendererTypes = new Map([
     ['pileup', 'PileupRenderer'],
     ['svg', 'SvgFeatureRenderer'],
 ]);
-/**
- * #stateModel SharedLinearPileupDisplayMixin
- * #category display
- * extends `BaseLinearDisplay`
- */
 export function SharedLinearPileupDisplayMixin(configSchema) {
     return types
         .compose(BaseLinearDisplay, types.model({
-        /**
-         * #property
-         */
         configuration: ConfigurationReference(configSchema),
-        /**
-         * #property
-         */
         featureHeight: types.maybe(types.number),
-        /**
-         * #property
-         */
         noSpacing: types.maybe(types.boolean),
-        /**
-         * #property
-         */
         fadeLikelihood: types.maybe(types.boolean),
-        /**
-         * #property
-         */
         trackMaxHeight: types.maybe(types.number),
-        /**
-         * #property
-         */
-        colorBy: types.frozen(),
-        /**
-         * #property
-         */
-        filterBy: types.optional(types.frozen(), defaultFilterFlags),
-        /**
-         * #property
-         */
+        colorBySetting: types.frozen(),
+        filterBySetting: types.frozen(),
         jexlFilters: types.optional(types.array(types.string), []),
     }))
         .volatile(() => ({
         colorTagMap: observable.map({}),
         featureUnderMouseVolatile: undefined,
         tagsReady: false,
+    }))
+        .views(self => ({
+        get colorBy() {
+            var _a;
+            return (_a = self.colorBySetting) !== null && _a !== void 0 ? _a : getConf(self, 'colorBy');
+        },
+        get filterBy() {
+            var _a;
+            return (_a = self.filterBySetting) !== null && _a !== void 0 ? _a : getConf(self, 'filterBy');
+        },
     }))
         .views(self => ({
         get autorunReady() {
             const view = getContainingView(self);
-            return (view.initialized &&
-                self.featureDensityStatsReady &&
-                !self.regionTooLarge);
+            return view.initialized && self.statsReadyAndRegionNotTooLarge;
         },
     }))
         .actions(self => ({
-        /**
-         * #action
-         */
         setTagsReady(flag) {
             self.tagsReady = flag;
         },
-        /**
-         * #action
-         */
         setMaxHeight(n) {
             self.trackMaxHeight = n;
         },
-        /**
-         * #action
-         */
         setFeatureHeight(n) {
             self.featureHeight = n;
         },
-        /**
-         * #action
-         */
         setNoSpacing(flag) {
             self.noSpacing = flag;
         },
-        /**
-         * #action
-         */
         setColorScheme(colorScheme) {
             self.colorTagMap = observable.map({});
-            self.colorBy = {
+            self.colorBySetting = {
                 ...colorScheme,
             };
             if (colorScheme.tag) {
                 self.tagsReady = false;
             }
         },
-        /**
-         * #action
-         */
         updateColorTagMap(uniqueTag) {
-            // pale color scheme
-            // https://cran.r-project.org/web/packages/khroma/vignettes/tol.html
-            // e.g. "tol_light"
             const colorPalette = [
                 '#BBCCEE',
                 'pink',
@@ -143,15 +96,9 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
                 }
             });
         },
-        /**
-         * #action
-         */
         setFeatureUnderMouse(feat) {
             self.featureUnderMouseVolatile = feat;
         },
-        /**
-         * #action
-         */
         selectFeature(feature) {
             const session = getSession(self);
             if (isSessionModelWithWidgets(session)) {
@@ -164,41 +111,25 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
             }
             session.setSelection(feature);
         },
-        /**
-         * #action
-         * uses copy-to-clipboard and generates notification
-         */
         copyFeatureToClipboard(feature) {
             const { uniqueId, ...rest } = feature.toJSON();
             const session = getSession(self);
             copy(JSON.stringify(rest, null, 4));
             session.notify('Copied to clipboard', 'success');
         },
-        /**
-         * #action
-         */
         setConfig(conf) {
             self.configuration = conf;
         },
-        /**
-         * #action
-         */
         setFilterBy(filter) {
-            self.filterBy = {
+            self.filterBySetting = {
                 ...filter,
             };
         },
-        /**
-         * #action
-         */
         setJexlFilters(filters) {
             self.jexlFilters = cast(filters);
         },
     }))
         .views(self => ({
-        /**
-         * #getter
-         */
         get rendererConfig() {
             const { featureHeight, noSpacing, trackMaxHeight, rendererTypeName } = self;
             const configBlob = getConf(self, ['renderers', rendererTypeName]) || {};
@@ -213,33 +144,18 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
         },
     }))
         .views(self => ({
-        /**
-         * #getter
-         */
         get maxHeight() {
             return readConfObject(self.rendererConfig, 'maxHeight');
         },
-        /**
-         * #getter
-         */
         get featureHeightSetting() {
             return readConfObject(self.rendererConfig, 'height');
         },
-        /**
-         * #getter
-         */
         get featureUnderMouse() {
             return self.featureUnderMouseVolatile;
         },
-        /**
-         * #getter
-         */
         renderReady() {
             return self.tagsReady;
         },
-        /**
-         * #getter
-         */
         get filters() {
             return new SerializableFilterChain({ filters: self.jexlFilters });
         },
@@ -247,9 +163,6 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
         .views(self => {
         const { trackMenuItems: superTrackMenuItems, renderProps: superRenderProps, } = self;
         return {
-            /**
-             * #getter
-             */
             get rendererTypeName() {
                 const viewName = getConf(self, 'defaultRendering');
                 const rendererType = rendererTypes.get(viewName);
@@ -258,9 +171,6 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
                 }
                 return rendererType;
             },
-            /**
-             * #method
-             */
             contextMenuItems() {
                 const feat = self.contextMenuFeature;
                 return feat
@@ -283,15 +193,9 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
                     ]
                     : [];
             },
-            /**
-             * #getter
-             */
             get DisplayBlurb() {
                 return LinearPileupDisplayBlurb;
             },
-            /**
-             * #method
-             */
             renderPropsPre() {
                 const { colorTagMap, colorBy, filterBy, rpcDriverName } = self;
                 const superProps = superRenderProps();
@@ -334,7 +238,6 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
                     onClick() {
                         self.clearFeatureSelection();
                     },
-                    // similar to click but opens a menu with further options
                     async onFeatureContextMenu(_, featureId) {
                         const session = getSession(self);
                         const { rpcManager } = session;
@@ -363,9 +266,6 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
                     },
                 };
             },
-            /**
-             * #method
-             */
             colorSchemeSubMenuItems() {
                 return [
                     {
@@ -430,9 +330,6 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
                     },
                 ];
             },
-            /**
-             * #method
-             */
             trackMenuItems() {
                 return [
                     ...superTrackMenuItems(),
@@ -527,9 +424,6 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
                     self.setTagsReady(true);
                 }
             }, { delay: 1000 });
-            // autorun synchronizes featureUnderMouse with featureIdUnderMouse
-            // asynchronously. this is needed due to how we do not serialize all
-            // features from the BAM/CRAM over the rpc
             addDisposer(self, autorun(async () => {
                 var _a;
                 const session = getSession(self);
@@ -548,10 +442,6 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
                                 layoutId: view.id,
                                 rendererType: 'PileupRenderer',
                             }));
-                            // check featureIdUnderMouse is still the same as the
-                            // feature.id that was returned e.g. that the user hasn't
-                            // moused over to a new position during the async operation
-                            // above
                             if (isAlive(self) &&
                                 feature &&
                                 self.featureIdUnderMouse === feature.uniqueId) {
@@ -566,5 +456,16 @@ export function SharedLinearPileupDisplayMixin(configSchema) {
                 }
             }));
         },
-    }));
+    }))
+        .preProcessSnapshot(snap => {
+        if (snap) {
+            const { colorBy, filterBy, ...rest } = snap;
+            return {
+                ...rest,
+                filterBySetting: filterBy,
+                colorBySetting: colorBy,
+            };
+        }
+        return snap;
+    });
 }

package/esm/LinearPileupDisplay/components/ColorByTagDialog.js

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
-import { observer } from 'mobx-react';
-import { Button, DialogContent, DialogActions, TextField, Typography, } from '@mui/material';
 import { Dialog } from '@jbrowse/core/ui';
+import { Button, DialogActions, DialogContent, TextField, Typography, } from '@mui/material';
+import { observer } from 'mobx-react';
 const ColorByTagDialog = observer(function ({ model, handleClose, }) {
     const [tag, setTag] = useState('');
     const validTag = /^[A-Za-z][A-Za-z0-9]$/.exec(tag);

package/esm/LinearPileupDisplay/components/GroupByDialog.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { IAnyStateTreeNode } from 'mobx-state-tree';
-import { AnyConfigurationModel } from '@jbrowse/core/configuration';
+import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
+import type { IAnyStateTreeNode } from 'mobx-state-tree';
 declare const GroupByTagDialog: (props: {
     model: {
         adapterConfig: AnyConfigurationModel;