@jbrowse/plugin-linear-genome-view
Version:
JBrowse 2 linear genome view
62 lines (61 loc) • 3.85 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const ui_1 = require("@jbrowse/core/ui");
const jexlStrings_1 = require("@jbrowse/core/util/jexlStrings");
const material_1 = require("@mui/material");
const mobx_react_1 = require("mobx-react");
const mui_1 = require("tss-react/mui");
const useStyles = (0, mui_1.makeStyles)()({
dialogContent: {
width: '80em',
},
textAreaFont: {
fontFamily: 'Courier New',
},
error: {
color: 'red',
fontSize: '0.8em',
},
});
function checkJexl(code) {
(0, jexlStrings_1.stringToJexlExpression)(code);
}
const AddFiltersDialog = (0, mobx_react_1.observer)(function ({ model, handleClose, }) {
const { classes } = useStyles();
const { activeFilters } = model;
const [data, setData] = (0, react_1.useState)(activeFilters.join('\n'));
const [error, setError] = (0, react_1.useState)();
(0, react_1.useEffect)(() => {
try {
data
.split('\n')
.map(line => line.trim())
.filter(line => !!line)
.map(line => {
checkJexl(line.trim());
});
setError(undefined);
}
catch (e) {
console.error(e);
setError(e);
}
}, [data]);
return ((0, jsx_runtime_1.jsxs)(ui_1.Dialog, { maxWidth: "xl", open: true, onClose: handleClose, title: "Add track filters", children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [(0, jsx_runtime_1.jsxs)("div", { children: ["Add filters, in jexl format, one per line, starting with the string jexl:. Examples:", ' ', (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "jexl:get(feature,'name')=='BRCA1'" }), " - show only feature where the name attribute is BRCA1"] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "jexl:get(feature,'type')=='gene'" }), " - show only gene type features in a GFF that has many other feature types"] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "jexl:get(feature,'score') > 400" }), " - show only features that have a score greater than 400"] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "jexl:get(feature,'end') - get(feature,'start') < 1000000" }), ' ', "- show only features with length less than 1Mbp"] })] })] }), error ? (0, jsx_runtime_1.jsx)("p", { className: classes.error, children: `${error}` }) : null, (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", multiline: true, minRows: 5, maxRows: 10, className: classes.dialogContent, fullWidth: true, value: data, onChange: event => {
setData(event.target.value);
}, slotProps: {
input: {
classes: {
input: classes.textAreaFont,
},
},
} })] }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "primary", type: "submit", autoFocus: true, disabled: !!error, onClick: () => {
model.setJexlFilters(data.split('\n'));
handleClose();
}, children: "Submit" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "secondary", onClick: () => {
handleClose();
}, children: "Cancel" })] })] }));
});
exports.default = AddFiltersDialog;