@jbrowse/core 2.1.4 → 2.1.5

package/ui/App.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { NotificationLevel, SessionWithDrawerWidgets, SnackAction } from '../util';
 import { MenuItem as JBMenuItem } from './index';
 declare type SnackbarMessage = [string, NotificationLevel, SnackAction];
-declare const App: ({ session, HeaderButtons, }: {
+declare const App: (props: {
     HeaderButtons?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
     session: SessionWithDrawerWidgets & {
         savedSessionNames: string[];

package/ui/App.js

@@ -30,12 +30,14 @@ const react_1 = __importStar(require("react"));
 const material_1 = require("@mui/material");
 const mui_1 = require("tss-react/mui");
 const Launch_1 = __importDefault(require("@mui/icons-material/Launch"));
+const react_error_boundary_1 = require("react-error-boundary");
 const mobx_react_1 = require("mobx-react");
 const mobx_state_tree_1 = require("mobx-state-tree");
 // locals
 const configuration_1 = require("../configuration");
 const DrawerWidget_1 = __importDefault(require("./DrawerWidget"));
 const DropDownMenu_1 = __importDefault(require("./DropDownMenu"));
+const ErrorMessage_1 = __importDefault(require("./ErrorMessage"));
 const EditableTypography_1 = __importDefault(require("./EditableTypography"));
 const Logo_1 = require("./Logo");
 const Snackbar_1 = __importDefault(require("./Snackbar"));
@@ -104,13 +106,9 @@ const Logo = (0, mobx_react_1.observer)(({ session }) => {
         return react_1.default.createElement("img", { src: logoPath.uri, alt: "Custom logo" });
     }
 });
-const App = (0, mobx_react_1.observer)(({ session, HeaderButtons = react_1.default.createElement("div", null), }) => {
-    var _a;
+const AppToolbar = ({ session, HeaderButtons = react_1.default.createElement("div", null), }) => {
     const { classes } = useStyles();
-    const { pluginManager } = (0, mobx_state_tree_1.getEnv)(session);
-    const viewTypes = pluginManager.getElementTypeRecord('view').all();
-    const [value, setValue] = (0, react_1.useState)((_a = viewTypes[0]) === null || _a === void 0 ? void 0 : _a.name);
-    const { visibleWidget, drawerWidth, minimized, activeWidgets, savedSessionNames, name, menus, views, drawerPosition, } = session;
+    const { savedSessionNames, name, menus } = session;
     function handleNameChange(newName) {
         if (savedSessionNames === null || savedSessionNames === void 0 ? void 0 : savedSessionNames.includes(newName)) {
             session.notify(`Cannot rename session to "${newName}", a saved session with that name already exists`, 'warning');
@@ -119,6 +117,48 @@ const App = (0, mobx_react_1.observer)(({ session, HeaderButtons = react_1.defau
             session.renameCurrentSession(newName);
         }
     }
+    return (react_1.default.createElement(material_1.Toolbar, null,
+        menus.map(menu => (react_1.default.createElement(DropDownMenu_1.default, { key: menu.label, menuTitle: menu.label, menuItems: menu.menuItems, session: session }))),
+        react_1.default.createElement("div", { className: classes.grow }),
+        react_1.default.createElement(material_1.Tooltip, { title: "Rename Session", arrow: true },
+            react_1.default.createElement(EditableTypography_1.default, { value: name, setValue: handleNameChange, variant: "body1", classes: {
+                    inputBase: classes.inputBase,
+                    inputRoot: classes.inputRoot,
+                    inputFocused: classes.inputFocused,
+                } })),
+        HeaderButtons,
+        react_1.default.createElement("div", { className: classes.grow }),
+        react_1.default.createElement("div", { style: { width: 150, maxHeight: 48 } },
+            react_1.default.createElement(Logo, { session: session }))));
+};
+const ViewLauncher = (0, mobx_react_1.observer)(({ session }) => {
+    var _a;
+    const { classes } = useStyles();
+    const { pluginManager } = (0, mobx_state_tree_1.getEnv)(session);
+    const viewTypes = pluginManager.getElementTypeRecord('view').all();
+    const [value, setValue] = (0, react_1.useState)((_a = viewTypes[0]) === null || _a === void 0 ? void 0 : _a.name);
+    return (react_1.default.createElement(material_1.Paper, { className: classes.selectPaper },
+        react_1.default.createElement(material_1.Typography, null, "Select a view to launch"),
+        react_1.default.createElement(material_1.Select, { value: value, onChange: event => setValue(event.target.value) }, viewTypes.map(({ name }) => (react_1.default.createElement(material_1.MenuItem, { key: name, value: name }, name)))),
+        react_1.default.createElement(material_1.Button, { onClick: () => {
+                session.addView(value, {});
+            }, variant: "contained", color: "primary" }, "Launch view")));
+});
+const ViewPanel = (0, mobx_react_1.observer)(({ view, session }) => {
+    const { pluginManager } = (0, mobx_state_tree_1.getEnv)(session);
+    const viewType = pluginManager.getViewType(view.type);
+    if (!viewType) {
+        throw new Error(`unknown view type ${view.type}`);
+    }
+    const { ReactComponent } = viewType;
+    return (react_1.default.createElement(ViewContainer_1.default, { view: view, onClose: () => session.removeView(view) },
+        react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement("div", null, "Loading...") },
+            react_1.default.createElement(ReactComponent, { model: view, session: session, getTrackType: pluginManager.getTrackType }))));
+});
+const App = (0, mobx_react_1.observer)((props) => {
+    const { session } = props;
+    const { classes } = useStyles();
+    const { minimized, visibleWidget, drawerWidth, activeWidgets, views, drawerPosition, } = session;
     const drawerVisible = visibleWidget && !minimized;
     let grid;
     if (drawerPosition === 'right') {
@@ -142,43 +182,10 @@ const App = (0, mobx_react_1.observer)(({ session, HeaderButtons = react_1.defau
         react_1.default.createElement("div", { className: classes.menuBarAndComponents },
             react_1.default.createElement("div", { className: classes.menuBar },
                 react_1.default.createElement(material_1.AppBar, { className: classes.appBar, position: "static" },
-                    react_1.default.createElement(material_1.Toolbar, null,
-                        menus.map(menu => (react_1.default.createElement(DropDownMenu_1.default, { key: menu.label, menuTitle: menu.label, menuItems: menu.menuItems, session: session }))),
-                        react_1.default.createElement("div", { className: classes.grow }),
-                        react_1.default.createElement(material_1.Tooltip, { title: "Rename Session", arrow: true },
-                            react_1.default.createElement(EditableTypography_1.default, { value: name, setValue: handleNameChange, variant: "body1", classes: {
-                                    inputBase: classes.inputBase,
-                                    inputRoot: classes.inputRoot,
-                                    inputFocused: classes.inputFocused,
-                                } })),
-                        HeaderButtons,
-                        react_1.default.createElement("div", { className: classes.grow }),
-                        react_1.default.createElement("div", { style: { width: 150, maxHeight: 48 } },
-                            react_1.default.createElement(Logo, { session: session }))))),
+                    react_1.default.createElement(AppToolbar, { ...props }))),
             react_1.default.createElement("div", { className: classes.components },
-                views.length ? (views.map(view => {
-                    const viewType = pluginManager.getViewType(view.type);
-                    if (!viewType) {
-                        throw new Error(`unknown view type ${view.type}`);
-                    }
-                    const { ReactComponent } = viewType;
-                    return (react_1.default.createElement(ViewContainer_1.default, { key: `view-${view.id}`, view: view, onClose: () => {
-                            session.removeView(view);
-                            session.notify(`A view has been closed`, 'info', {
-                                name: 'undo',
-                                onClick: () => {
-                                    pluginManager.rootModel.history.undo();
-                                },
-                            });
-                        } },
-                        react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement("div", null, "Loading...") },
-                            react_1.default.createElement(ReactComponent, { model: view, session: session, getTrackType: pluginManager.getTrackType }))));
-                })) : (react_1.default.createElement(material_1.Paper, { className: classes.selectPaper },
-                    react_1.default.createElement(material_1.Typography, null, "Select a view to launch"),
-                    react_1.default.createElement(material_1.Select, { value: value, onChange: event => setValue(event.target.value) }, viewTypes.map(({ name }) => (react_1.default.createElement(material_1.MenuItem, { key: name, value: name }, name)))),
-                    react_1.default.createElement(material_1.Button, { onClick: () => {
-                            session.addView(value, {});
-                        }, variant: "contained", color: "primary" }, "Launch view"))),
+                views.length ? (views.map(view => (react_1.default.createElement(react_error_boundary_1.ErrorBoundary, { key: `view-${view.id}`, FallbackComponent: ({ error }) => (react_1.default.createElement(ErrorMessage_1.default, { error: error })) },
+                    react_1.default.createElement(ViewPanel, { view: view, session: session }))))) : (react_1.default.createElement(ViewLauncher, { ...props })),
                 react_1.default.createElement("div", { style: { height: 300 } }))),
         activeWidgets.size > 0 && minimized ? (react_1.default.createElement(material_1.Tooltip, { title: "Open drawer widget" },
             react_1.default.createElement(material_1.Fab, { className: drawerPosition === 'right' ? classes.fabRight : classes.fabLeft, color: "primary", "data-testid": "drawer-maximize", onClick: () => session.showWidgetDrawer() },

package/ui/DrawerWidget.js

@@ -27,6 +27,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
+const react_error_boundary_1 = require("react-error-boundary");
 const material_1 = require("@mui/material");
 const mui_1 = require("tss-react/mui");
 const mobx_react_1 = require("mobx-react");
@@ -38,6 +39,7 @@ const Minimize_1 = __importDefault(require("@mui/icons-material/Minimize"));
 const MoreVert_1 = __importDefault(require("@mui/icons-material/MoreVert"));
 // locals
 const Drawer_1 = __importDefault(require("./Drawer"));
+const ErrorMessage_1 = __importDefault(require("./ErrorMessage"));
 const useStyles = (0, mui_1.makeStyles)()(theme => ({
     formControl: {
         margin: 0,
@@ -119,6 +121,7 @@ const DrawerWidget = (0, mobx_react_1.observer)(({ session }) => {
     return (react_1.default.createElement(Drawer_1.default, { session: session },
         react_1.default.createElement(DrawerHeader, { session: session, setToolbarHeight: setToolbarHeight }),
         react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement("div", null, "Loading...") },
-            react_1.default.createElement(DrawerComponent, { model: visibleWidget, session: session, toolbarHeight: toolbarHeight }))));
+            react_1.default.createElement(react_error_boundary_1.ErrorBoundary, { FallbackComponent: ({ error }) => react_1.default.createElement(ErrorMessage_1.default, { error: error }) },
+                react_1.default.createElement(DrawerComponent, { model: visibleWidget, session: session, toolbarHeight: toolbarHeight })))));
 });
 exports.default = DrawerWidget;

package/ui/theme.d.ts

@@ -1,3 +1,4 @@
+import { ThemeOptions } from '@mui/material/styles';
 import type { PaletteOptions } from '@mui/material/styles/createPalette';
 declare module '@mui/material/styles/createPalette' {
     interface Palette {
@@ -43,7 +44,7 @@ export declare function createJBrowseDefaultProps(): {
     components: {
         MuiButton: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiAccordion: {
@@ -56,43 +57,43 @@ export declare function createJBrowseDefaultProps(): {
         };
         MuiFilledInput: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiFormControl: {
             defaultProps: {
-                margin: string;
-                size: string;
+                margin: "dense";
+                size: "small";
             };
         };
         MuiFormHelperText: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiIconButton: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiInputBase: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiAutocomplete: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiInputLabel: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiToolbar: {
             defaultProps: {
-                variant: string;
+                variant: "dense";
             };
         };
         MuiListItem: {
@@ -102,17 +103,17 @@ export declare function createJBrowseDefaultProps(): {
         };
         MuiOutlinedInput: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiFab: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiTable: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiMenuList: {
@@ -127,8 +128,8 @@ export declare function createJBrowseDefaultProps(): {
         };
         MuiTextField: {
             defaultProps: {
-                margin: string;
-                variant: string;
+                margin: "dense";
+                variant: "standard";
             };
         };
     };
@@ -175,159 +176,5 @@ export declare function createJBrowseDefaultOverrides(palette?: PaletteOptions):
         };
     };
 };
-export declare const jbrowseBaseTheme: {
-    components: {
-        MuiButton: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiAccordion: {
-            defaultProps: {
-                disableGutters: boolean;
-                TransitionProps: {
-                    timeout: number;
-                };
-            };
-        };
-        MuiFilledInput: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiFormControl: {
-            defaultProps: {
-                margin: string;
-                size: string;
-            };
-        };
-        MuiFormHelperText: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiIconButton: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiInputBase: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiAutocomplete: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiInputLabel: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiToolbar: {
-            defaultProps: {
-                variant: string;
-            };
-        };
-        MuiListItem: {
-            defaultProps: {
-                dense: boolean;
-            };
-        };
-        MuiOutlinedInput: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiFab: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiTable: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiMenuList: {
-            defaultProps: {
-                dense: boolean;
-            };
-        };
-        MuiMenuItem: {
-            defaultProps: {
-                dense: boolean;
-            };
-        };
-        MuiTextField: {
-            defaultProps: {
-                margin: string;
-                variant: string;
-            };
-        };
-    } & {
-        MuiIconButton: {
-            styleOverrides: {
-                colorSecondary: {
-                    color: string;
-                };
-            };
-        };
-        MuiButton: {
-            styleOverrides: {
-                textSecondary: {
-                    color: string;
-                };
-            };
-        };
-        MuiFab: {
-            styleOverrides: {
-                secondary: {
-                    backgroundColor: string;
-                };
-            };
-        };
-        MuiLink: {
-            styleOverrides: {
-                root: {
-                    color: string;
-                };
-            };
-        };
-        MuiAccordionSummary: {
-            styleOverrides: {
-                root: {
-                    backgroundColor: string;
-                };
-                content: {
-                    color: string;
-                };
-            };
-        };
-    };
-    palette: {
-        primary: {
-            main: string;
-        };
-        secondary: {
-            main: string;
-        };
-        tertiary: import("@mui/material/styles").PaletteColor;
-        quaternary: import("@mui/material/styles").PaletteColor;
-        stopCodon: string;
-        startCodon: string;
-        bases: {
-            A: import("@mui/material/styles").PaletteColor;
-            C: import("@mui/material/styles").PaletteColor;
-            G: import("@mui/material/styles").PaletteColor;
-            T: import("@mui/material/styles").PaletteColor;
-        };
-    };
-    typography: {
-        fontSize: number;
-    };
-    spacing: number;
-};
-export declare function createJBrowseTheme(theme?: any): import("@mui/material/styles").Theme;
+export declare function createJBrowseBaseTheme(palette?: PaletteOptions): ThemeOptions;
+export declare function createJBrowseTheme(theme?: ThemeOptions): import("@mui/material/styles").Theme;

package/ui/theme.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createJBrowseTheme = exports.jbrowseBaseTheme = exports.createJBrowseDefaultOverrides = exports.createJBrowseDefaultProps = exports.jbrowseDefaultPalette = void 0;
+exports.createJBrowseTheme = exports.createJBrowseBaseTheme = exports.createJBrowseDefaultOverrides = exports.createJBrowseDefaultProps = exports.jbrowseDefaultPalette = void 0;
 const colors_1 = require("@mui/material/colors");
 const styles_1 = require("@mui/material/styles");
 const deepmerge_1 = __importDefault(require("deepmerge"));
@@ -168,38 +168,35 @@ function createJBrowseDefaultOverrides(palette = {}) {
     };
 }
 exports.createJBrowseDefaultOverrides = createJBrowseDefaultOverrides;
-exports.jbrowseBaseTheme = {
-    palette: exports.jbrowseDefaultPalette,
-    typography: { fontSize: 12 },
-    spacing: 4,
-    ...(0, deepmerge_1.default)(createJBrowseDefaultProps(), createJBrowseDefaultOverrides()),
-};
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function createJBrowseBaseTheme(palette) {
+    return {
+        palette: exports.jbrowseDefaultPalette,
+        typography: { fontSize: 12 },
+        spacing: 4,
+        ...(0, deepmerge_1.default)(createJBrowseDefaultProps(), createJBrowseDefaultOverrides(palette)),
+    };
+}
+exports.createJBrowseBaseTheme = createJBrowseBaseTheme;
 function createJBrowseTheme(theme) {
-    var _a, _b, _c, _d;
+    var _a, _b;
     if ((_a = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _a === void 0 ? void 0 : _a.tertiary) {
         theme = (0, deepmerge_1.default)(theme, {
             palette: {
-                tertiary: refTheme.palette.augmentColor(((_b = theme.palette.tertiary) === null || _b === void 0 ? void 0 : _b.color)
+                tertiary: refTheme.palette.augmentColor('color' in theme.palette.tertiary
                     ? theme.palette.tertiary
-                    : {
-                        color: theme.palette.tertiary,
-                    }),
+                    : { color: theme.palette.tertiary }),
             },
         });
     }
-    if ((_c = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _c === void 0 ? void 0 : _c.quaternary) {
+    if ((_b = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _b === void 0 ? void 0 : _b.quaternary) {
         theme = (0, deepmerge_1.default)(theme, {
             palette: {
-                quaternary: refTheme.palette.augmentColor(((_d = theme.palette.quaternary) === null || _d === void 0 ? void 0 : _d.color)
+                quaternary: refTheme.palette.augmentColor('color' in theme.palette.quaternary
                     ? theme.palette.quaternary
-                    : {
-                        color: theme.palette.quaternary,
-                    }),
+                    : { color: theme.palette.quaternary }),
             },
         });
     }
-    // @ts-ignore
-    return (0, styles_1.createTheme)((0, deepmerge_1.default)(exports.jbrowseBaseTheme, theme || {}));
+    return (0, styles_1.createTheme)((0, deepmerge_1.default)(createJBrowseBaseTheme(theme === null || theme === void 0 ? void 0 : theme.palette), theme || {}));
 }
 exports.createJBrowseTheme = createJBrowseTheme;

package/util/calculateStaticBlocks.js

@@ -3,15 +3,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const mobx_state_tree_1 = require("mobx-state-tree");
 const _1 = require(".");
 const blockTypes_1 = require("./blockTypes");
-function calculateStaticBlocks(model, padding = true, elision = true, extra = 0, 
-// on the main thread, window.innerWidth is used because this reduces
-// recalculating the blocks, otherwise, model.width for cases such as
-// off-main-thread. also this is not a ternary because our window.innerWidth
-// might be undefined on off-main-thread, so instead use || model.width
-width = (typeof window !== 'undefined' && window.innerWidth) || model.width) {
-    const { offsetPx, displayedRegions, bpPerPx, minimumBlockWidth, interRegionPaddingWidth, } = model;
+function calculateStaticBlocks(model, padding = true, elision = true, extra = 0, width = 800) {
+    const { offsetPx, displayedRegions, bpPerPx, minimumBlockWidth, interRegionPaddingWidth, width: modelWidth, } = model;
     const windowLeftBp = offsetPx * bpPerPx;
-    const windowRightBp = (offsetPx + width) * bpPerPx;
+    const windowRightBp = (offsetPx + modelWidth) * bpPerPx;
     const blockSizePx = width;
     const blockSizeBp = Math.ceil(blockSizePx * bpPerPx);
     // for each displayed region

package/util/index.d.ts

@@ -327,7 +327,7 @@ export declare function getLayoutId({ sessionId, layoutId, }: {
     sessionId: string;
     layoutId: string;
 }): string;
-export declare const useLocalStorage: (key: string, defaultValue?: string) => [string, (arg: string) => void];
+export declare function useLocalStorage<T>(key: string, initialValue: T): readonly [T, (value: T | ((val: T) => T)) => void];
 export declare function getUriLink(value: {
     uri: string;
     baseUri?: string;

package/util/index.js

@@ -941,16 +941,35 @@ function getLayoutId({ sessionId, layoutId, }) {
     return sessionId + '-' + layoutId;
 }
 exports.getLayoutId = getLayoutId;
-// similar to https://blog.logrocket.com/using-localstorage-react-hooks/
-const useLocalStorage = (key, defaultValue = '') => {
-    const [value, setValue] = (0, react_1.useState)(() => localStorage.getItem(key) || defaultValue);
-    (0, react_1.useEffect)(() => {
-        localStorage.setItem(key, value);
-    }, [key, value]);
-    // without this cast, tsc complained that the type of setValue could be a
-    // string or a callback
-    return [value, setValue];
-};
+// Hook from https://usehooks.com/useLocalStorage/
+function useLocalStorage(key, initialValue) {
+    const [storedValue, setStoredValue] = (0, react_1.useState)(() => {
+        if (typeof window === 'undefined') {
+            return initialValue;
+        }
+        try {
+            const item = window.localStorage.getItem(key);
+            return item ? JSON.parse(item) : initialValue;
+        }
+        catch (error) {
+            console.error(error);
+            return initialValue;
+        }
+    });
+    const setValue = (value) => {
+        try {
+            const valueToStore = value instanceof Function ? value(storedValue) : value;
+            setStoredValue(valueToStore);
+            if (typeof window !== 'undefined') {
+                window.localStorage.setItem(key, JSON.stringify(valueToStore));
+            }
+        }
+        catch (error) {
+            console.error(error);
+        }
+    };
+    return [storedValue, setValue];
+}
 exports.useLocalStorage = useLocalStorage;
 function getUriLink(value) {
     const { uri, baseUri = '' } = value;

package/util/simpleFeature.d.ts

@@ -42,7 +42,7 @@ export interface SimpleFeatureArgs {
     /** unique identifier. can also be in data.uniqueId */
     id: string | number;
 }
-interface SimpleFeatureSerializedNoId {
+export interface SimpleFeatureSerializedNoId {
     [key: string]: unknown;
     parentId?: string;
     subfeatures?: SimpleFeatureSerializedNoId[];
@@ -94,4 +94,3 @@ export default class SimpleFeature implements Feature {
     toJSON(): SimpleFeatureSerialized;
     static fromJSON(json: SimpleFeatureSerialized): SimpleFeature;
 }
-export {};

package/util/types/index.d.ts

@@ -73,7 +73,7 @@ export interface AbstractSessionModel extends AbstractViewContainer {
     addWidget?: Function;
     DialogComponent?: DialogComponentType;
     DialogProps: any;
-    queueDialog: (callback: (doneCallback: Function) => [DialogComponentType, any]) => void;
+    queueDialog<T extends DialogComponentType>(callback: (doneCallback: () => void) => [T, React.ComponentProps<T>]): void;
     name: string;
     id?: string;
     tracks: AnyConfigurationModel[];

package/util/types/index.js

@@ -36,7 +36,9 @@ function isSessionModelWithConfigEditing(thing) {
 }
 exports.isSessionModelWithConfigEditing = isSessionModelWithConfigEditing;
 function isSessionWithAddTracks(thing) {
-    return isSessionModel(thing) && 'addTrackConf' in thing;
+    return (
+    // @ts-ignore
+    isSessionModel(thing) && 'addTrackConf' in thing && !thing.disableAddTracks);
 }
 exports.isSessionWithAddTracks = isSessionWithAddTracks;
 function isSessionModelWithWidgets(thing) {