jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Refactor: Make Reset Column button reset columns order

Browse source
This commit is contained in:
igorrCarvalho 2024-06-04 15:53:51 -03:00
commit 83b837966d
2 changed files with 12 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/frontend/src/components/tableComponent/index.tsx
View file

@ -1,7 +1,7 @@
import "ag-grid-community/styles/ag-grid.css"; // Mandatory CSS required by the grid import "ag-grid-community/styles/ag-grid.css"; // Mandatory CSS required by the grid
import "ag-grid-community/styles/ag-theme-quartz.css"; // Optional Theme applied to the grid import "ag-grid-community/styles/ag-theme-quartz.css"; // Optional Theme applied to the grid
import { AgGridReact, AgGridReactProps } from "ag-grid-react"; import { AgGridReact, AgGridReactProps } from "ag-grid-react";
import { ElementRef, forwardRef, useRef } from "react"; import { ElementRef, forwardRef, useEffect, useRef } from "react";
import { import {
DEFAULT_TABLE_ALERT_MSG, DEFAULT_TABLE_ALERT_MSG,
DEFAULT_TABLE_ALERT_TITLE, DEFAULT_TABLE_ALERT_TITLE,
@ -40,6 +40,7 @@ const TableComponent = forwardRef<
// @ts-ignore // @ts-ignore
const realRef = ref?.current ? ref : gridRef; const realRef = ref?.current ? ref : gridRef;
const dark = useDarkStore((state) => state.dark); const dark = useDarkStore((state) => state.dark);
const initialColumnDefs = useRef(props.columnDefs);
const makeLastColumnNonResizable = (columnDefs) => { const makeLastColumnNonResizable = (columnDefs) => {
columnDefs.forEach((colDef, index) => { columnDefs.forEach((colDef, index) => {
@ -55,6 +56,7 @@ const TableComponent = forwardRef<
...props.columnDefs, ...props.columnDefs,
]); ]);
params.api.setColumnDefs(updatedColumnDefs); params.api.setColumnDefs(updatedColumnDefs);
initialColumnDefs.current = params.api.getColumnDefs();
if (props.onGridReady) props.onGridReady(params); if (props.onGridReady) props.onGridReady(params);
}; };
@ -134,7 +136,7 @@ const TableComponent = forwardRef<
onGridReady={onGridReady} onGridReady={onGridReady}
onColumnMoved={onColumnMoved} onColumnMoved={onColumnMoved}
/> />
<ResetColumns resetGrid={() => resetGrid(realRef)} /> <ResetColumns resetGrid={() => resetGrid(realRef, initialColumnDefs)} />
</div> </div>
); );
}, },

9
src/frontend/src/components/tableComponent/utils/reset-grid-columns.tsx
View file

@ -1,5 +1,12 @@
export default function resetGrid(ref) { export default function resetGrid(ref, initialColumnDefs) {
if (ref?.current && ref?.current.api) { if (ref?.current && ref?.current.api) {
ref.current.api.resetColumnState(); ref.current.api.resetColumnState();
if (initialColumnDefs.current) {
const resetColumns = ref.current.api.applyColumnState({
state: initialColumnDefs.current,
applyOrder: true,
});
return resetColumns;
}
} }
} }