@jbrowse/core/esm/BaseFeatureWidget/SequenceFeatureDetails/dialogs/SequenceDialog.js

JBrowse 2 core libraries used by plugins

import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { Suspense, useRef, useState } from 'react';
import { Button, DialogActions, DialogContent, Typography } from '@mui/material';
import { observer } from 'mobx-react';
import SequenceFeatureMenu from "./SequenceFeatureMenu.js";
import SequenceTypeSelector from "./SequenceTypeSelector.js";
import { Dialog, ErrorMessage, LoadingEllipses } from "../../../ui/index.js";
import { SimpleFeature, getSession, } from "../../../util/index.js";
import { makeStyles } from "../../../util/tss-react/index.js";
import { useFeatureSequence } from "../../../util/useFeatureSequence.js";
import SequencePanel from "../SequencePanel.js";
const useStyles = makeStyles()({
    dialogContent: {
        width: '80em',
    },
});
const SequenceDialog = observer(function SequenceDialog({ handleClose, model, sequenceFeatureDetails, feature, }) {
    const { upDownBp } = sequenceFeatureDetails;
    const { classes } = useStyles();
    const seqPanelRef = useRef(null);
    const [forceLoad, setForceLoad] = useState(false);
    const session = getSession(model);
    const assemblyName = model.view?.assemblyNames?.[0];
    const { sequence, error } = useFeatureSequence({
        assemblyName,
        session,
        feature: new SimpleFeature(feature),
        upDownBp,
        forceLoad,
    });
    return (_jsxs(Dialog, { maxWidth: "xl", open: true, title: "Sequence view", onClose: () => {
            handleClose();
        }, children: [_jsxs(DialogContent, { className: classes.dialogContent, children: [_jsxs("div", { children: [_jsx(SequenceTypeSelector, { model: sequenceFeatureDetails }), _jsx(SequenceFeatureMenu, { ref: seqPanelRef, model: sequenceFeatureDetails })] }), _jsxs("div", { children: [feature.type === 'gene' ? (_jsx(Typography, { children: "Note: inspect subfeature sequences for protein/CDS computations" })) : null, error ? (_jsx(ErrorMessage, { error: error })) : !sequence ? (_jsx(LoadingEllipses, {})) : 'error' in sequence ? (_jsxs(_Fragment, { children: [_jsx(Typography, { color: "error", children: sequence.error }), _jsx(Button, { variant: "contained", color: "inherit", onClick: () => {
                                            setForceLoad(true);
                                        }, children: "Force load" })] })) : (_jsx(Suspense, { fallback: _jsx(LoadingEllipses, {}), children: _jsx(SequencePanel, { ref: seqPanelRef, feature: feature, sequence: sequence, model: sequenceFeatureDetails }) }))] })] }), _jsx(DialogActions, { children: _jsx(Button, { onClick: () => {
                        handleClose();
                    }, variant: "contained", children: "Close" }) })] }));
});
export default SequenceDialog;