@jbrowse/plugin-wiggle
Version:
JBrowse 2 wiggle adapters, tracks, etc.
85 lines (84 loc) • 5.37 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = SetColorDialogBulkEditPanel;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const ui_1 = require("@jbrowse/core/ui");
const material_1 = require("@mui/material");
const mui_1 = require("tss-react/mui");
const useStyles = (0, mui_1.makeStyles)()({
textAreaFont: {
fontFamily: 'Courier New',
},
});
function SetColorDialogBulkEditPanel({ onClose, currLayout, }) {
const { classes } = useStyles();
const [val, setVal] = (0, react_1.useState)('');
const [error, setError] = (0, react_1.useState)();
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: "Paste CSV or TSV. If a header column is present. First line is a header. If a column called \"name\" is present, it uses that to connect to IDs in the table, otherwise it uses the first column no." }), error ? (0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error }) : null, (0, jsx_runtime_1.jsx)(material_1.TextField, { variant: "outlined", multiline: true, minRows: 5, placeholder: 'name,population\nHG00098,GBR\nHG00101,GBR\nHG00459,CHS\n...', maxRows: 10, fullWidth: true, value: val, onChange: event => {
setVal(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: "secondary", onClick: () => {
const lines = val
.split('\n')
.map(f => f.trim())
.filter(f => !!f);
const fields = lines[0].split(/[,\t]/gm);
if (fields.includes('name')) {
setError('');
const oldLayout = Object.fromEntries(currLayout.map(record => [record.name, record]));
const newData = Object.fromEntries(lines.slice(1).map(line => {
const cols = line.split(/[,\t]/gm);
const newRecord = Object.fromEntries(cols.map((col, idx) => [fields[idx], col]));
return [
newRecord.name,
{
...newRecord,
...oldLayout[newRecord.name],
},
];
}));
onClose(currLayout.map(record => ({
...record,
...newData[record.name],
})));
}
else {
setError(new Error('No "name" column found on line 1'));
}
}, children: "Update rows" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "primary", onClick: () => {
const lines = val
.split('\n')
.map(f => f.trim())
.filter(f => !!f);
const fields = lines[0].split(/[,\t]/gm);
if (fields.includes('name')) {
setError('');
const oldLayout = Object.fromEntries(currLayout.map(record => [record.name, record]));
const newData = Object.fromEntries(lines.slice(1).map(line => {
const cols = line.split(/[,\t]/gm);
const newRecord = Object.fromEntries(cols.map((col, idx) => [fields[idx], col]));
return [
newRecord.name,
{
...newRecord,
...oldLayout[newRecord.name],
},
];
}));
onClose(currLayout.map(record => ({
...newData[record.name],
})));
}
else {
setError(new Error('No "name" column found on line 1'));
}
}, children: "Replace rows" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "inherit", onClick: () => {
onClose();
}, children: "Cancel" })] })] }));
}