ANL-CEEESA/UnitCommitment.jl
1
0
Fork 0
mirror of https://github.com/ANL-CEEESA/UnitCommitment.jl.git synced 2025-12-06 08:18:51 -06:00
Code Issues Packages Projects Releases Wiki Activity

web: Preserve active cell state during table updates

Browse Source
This commit is contained in:
Alinson S. Xavier
2025-09-09 10:56:08 -05:00
parent 771eb5fa6d
commit 872cb7a66e
1 changed files with 26 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
web/src/components/Common/Forms/DataTable.tsx
View File

@@ -14,6 +14,7 @@ import { ValidationError } from "../../../core/Data/validate";
import Papa from "papaparse"; import Papa from "papaparse";
import { parseBool, parseNumber } from "../../../core/Operations/commonOps"; import { parseBool, parseNumber } from "../../../core/Operations/commonOps";
import { UnitCommitmentScenario } from "../../../core/Data/types"; import { UnitCommitmentScenario } from "../../../core/Data/types";
import { tab } from "@testing-library/user-event/dist/tab";
export interface ColumnSpec { export interface ColumnSpec {
title: string; title: string;
@@ -359,6 +360,7 @@ const DataTable = (props: DataTableProps) => {
const tableContainerRef = useRef<HTMLDivElement | null>(null); const tableContainerRef = useRef<HTMLDivElement | null>(null);
const tableRef = useRef<Tabulator | null>(null); const tableRef = useRef<Tabulator | null>(null);
const [isTableBuilt, setTableBuilt] = useState<Boolean>(false); const [isTableBuilt, setTableBuilt] = useState<Boolean>(false);
const [activeCell, setActiveCell] = useState<CellComponent | null>(null);
useEffect(() => { useEffect(() => {
const onCellEdited = (cell: CellComponent) => { const onCellEdited = (cell: CellComponent) => {
@@ -412,10 +414,20 @@ const DataTable = (props: DataTableProps) => {
const newColumns = columns; const newColumns = columns;
const newData = data; const newData = data;
const oldRows = tableRef.current.getRows(); const oldRows = tableRef.current.getRows();
const activeRowPosition = activeCell?.getRow().getPosition() as number;
const activeField = activeCell?.getField();
// Update data // Update data
tableRef.current.replaceData(newData).then(() => {}); tableRef.current.replaceData(newData).then(() => {});
// Restore active cell selection
if (activeCell) {
const cell = tableRef.current
.getRowFromPosition(activeRowPosition!!)
.getCell(activeField!!);
cell.edit();
}
// Update columns // Update columns
let newColCount = 0; let newColCount = 0;
newColumns.forEach((col) => { newColumns.forEach((col) => {
@@ -444,8 +456,21 @@ const DataTable = (props: DataTableProps) => {
}, 10); }, 10);
} }
// Update callbacks // Remove old callbacks
tableRef.current.off("cellEdited"); tableRef.current.off("cellEdited");
tableRef.current.off("cellEditing");
tableRef.current.off("cellEditCancelled");
// Set new callbacks
tableRef.current.on("cellEditing", (cell) => {
console.log("cellEditing", cell);
setActiveCell(cell);
});
tableRef.current.on("cellEditCancelled", (cell) => {
setActiveCell(null);
});
tableRef.current.on("cellEdited", (cell) => { tableRef.current.on("cellEdited", (cell) => {
onCellEdited(cell); onCellEdited(cell);
}); });