@jbrowse/core/esm/ui/ErrorMessage.js

JBrowse 2 core libraries used by plugins

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Suspense, lazy, useState } from 'react';
import RefreshIcon from '@mui/icons-material/Refresh';
import ReportIcon from '@mui/icons-material/Report';
import { IconButton, Tooltip } from '@mui/material';
import RedErrorMessageBox from "./RedErrorMessageBox.js";
import { makeStyles } from "../util/tss-react/index.js";
const ErrorMessageStackTraceDialog = lazy(() => import("./ErrorMessageStackTraceDialog.js"));
const useStyles = makeStyles()(theme => ({
    bg: {
        background: theme.palette.divider,
        border: '1px solid black',
        margin: 20,
    },
    iconFloat: {
        float: 'right',
        marginLeft: 100,
    },
}));
function parseError(str) {
    let snapshotError = '';
    const findStr = 'is not assignable';
    const idx = str.indexOf(findStr);
    if (idx !== -1) {
        const trim = str.slice(0, idx + findStr.length);
        const match = /.*at path "(.*)" snapshot `(.*)` is not assignable/m.exec(trim);
        if (match) {
            str = `Failed to load element at ${match[1]}...Failed element had snapshot`;
            snapshotError = match[2];
        }
        const match2 = /.*snapshot `(.*)` is not assignable/.exec(trim);
        if (match2) {
            str = 'Failed to load element...Failed element had snapshot';
            snapshotError = match2[1];
        }
    }
    return snapshotError;
}
function ErrorButtons({ error, onReset, }) {
    const { classes } = useStyles();
    const [showStack, setShowStack] = useState(false);
    return (_jsxs("div", { className: classes.iconFloat, children: [typeof error === 'object' && error && 'stack' in error ? (_jsx(Tooltip, { title: "Get stack trace", children: _jsx(IconButton, { onClick: () => {
                        setShowStack(true);
                    }, color: "primary", children: _jsx(ReportIcon, {}) }) })) : null, onReset ? (_jsx(Tooltip, { title: "Retry", children: _jsx(IconButton, { onClick: onReset, color: "primary", children: _jsx(RefreshIcon, {}) }) })) : null, showStack ? (_jsx(Suspense, { fallback: null, children: _jsx(ErrorMessageStackTraceDialog, { error: error, onClose: () => {
                        setShowStack(false);
                    } }) })) : null] }));
}
function ErrorMessage({ error, onReset, }) {
    const { classes } = useStyles();
    const str = `${error}`;
    const str2 = str.indexOf('expected an instance of');
    const str3 = str2 !== -1 ? str.slice(0, str2) : str;
    const snapshotError = parseError(str);
    return (_jsxs(RedErrorMessageBox, { children: [str3.slice(0, 10000), _jsx(ErrorButtons, { error: error, onReset: onReset }), snapshotError ? (_jsx("pre", { className: classes.bg, children: JSON.stringify(JSON.parse(snapshotError), null, 2) })) : null] }));
}
export default ErrorMessage;