@jbrowse/plugin-wiggle
Version:
JBrowse 2 wiggle adapters, tracks, etc.
52 lines (51 loc) • 4.12 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = SetColorDialog;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const DraggableDialog_1 = __importDefault(require("@jbrowse/core/ui/DraggableDialog"));
const util_1 = require("@jbrowse/core/util");
const material_1 = require("@mui/material");
const mui_1 = require("tss-react/mui");
const SetColorDialogBulkEditPanel_1 = __importDefault(require("./SetColorDialogBulkEditPanel"));
const SetColorDialogHelpfulTips_1 = __importDefault(require("./SetColorDialogHelpfulTips"));
const SetColorDialogRowPalettizer_1 = __importDefault(require("./SetColorDialogRowPalettizer"));
const useStyles = (0, mui_1.makeStyles)()({
content: {
minWidth: 800,
},
fr: {
float: 'right',
display: 'flex',
gap: 8,
},
});
function SetColorDialog({ model, handleClose, title = 'Color/arrangement editor', enableBulkEdit = false, enableRowPalettizer = false, showTipsStorageKey = 'setColorDialog-showTips', SourcesGridComponent, }) {
const { classes } = useStyles();
const { sources } = model;
const [showBulkEditor, setShowBulkEditor] = (0, react_1.useState)(false);
const [currLayout, setCurrLayout] = (0, react_1.useState)(structuredClone(sources || []));
const [showTips, setShowTips] = (0, util_1.useLocalStorage)(showTipsStorageKey, false);
return ((0, jsx_runtime_1.jsx)(DraggableDialog_1.default, { open: true, onClose: handleClose, maxWidth: "xl", title: title, children: showBulkEditor && enableBulkEdit ? ((0, jsx_runtime_1.jsx)(SetColorDialogBulkEditPanel_1.default, { currLayout: currLayout, onClose: arg => {
if (arg) {
setCurrLayout(arg);
}
setShowBulkEditor(false);
} })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { className: classes.content, children: [(0, jsx_runtime_1.jsxs)("div", { className: classes.fr, children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => {
setShowTips(!showTips);
}, children: showTips ? 'Hide tips' : 'Show tips' }), enableBulkEdit ? ((0, jsx_runtime_1.jsx)(material_1.Button, { color: "secondary", variant: "contained", onClick: () => {
setShowBulkEditor(!showBulkEditor);
}, children: "Show Bulk row editor" })) : null] }), showTips ? (0, jsx_runtime_1.jsx)(SetColorDialogHelpfulTips_1.default, {}) : null, enableRowPalettizer ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)(SetColorDialogRowPalettizer_1.default, { currLayout: currLayout, setCurrLayout: setCurrLayout })] })) : null, (0, jsx_runtime_1.jsx)(SourcesGridComponent, { rows: currLayout, onChange: setCurrLayout, showTips: showTips })] }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", type: "submit", color: "inherit", onClick: () => {
model.clearLayout();
setCurrLayout(model.sources || []);
}, children: "Clear custom settings" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "secondary", onClick: () => {
handleClose();
setCurrLayout([...(model.sources || [])]);
}, children: "Cancel" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "primary", type: "submit", onClick: () => {
model.setLayout(currLayout);
handleClose();
}, children: "Submit" })] })] })) }));
}