diff --git a/src/frontend/src/components/tableComponent/index.tsx b/src/frontend/src/components/tableComponent/index.tsx index 42211b3a8..3a037e32e 100644 --- a/src/frontend/src/components/tableComponent/index.tsx +++ b/src/frontend/src/components/tableComponent/index.tsx @@ -61,8 +61,6 @@ const TableComponent = forwardRef< }} ref={ref} getRowId={(params) => { - console.log(params); - return params.data.id; }} /> diff --git a/src/frontend/src/modals/editNodeModal/hooks/use-row-data.tsx b/src/frontend/src/modals/editNodeModal/hooks/use-row-data.tsx index 0cc515dc3..d2ff622a6 100644 --- a/src/frontend/src/modals/editNodeModal/hooks/use-row-data.tsx +++ b/src/frontend/src/modals/editNodeModal/hooks/use-row-data.tsx @@ -2,7 +2,7 @@ import { useMemo } from "react"; import { LANGFLOW_SUPPORTED_TYPES } from "../../../constants/constants"; import { TemplateVariableType } from "../../../types/api"; -const useRowData = (myData) => { +const useRowData = (myData, open) => { const rowData = useMemo(() => { return Object.keys(myData.current.node!.template) .filter((key: string) => { @@ -29,7 +29,7 @@ const useRowData = (myData) => { id: key, }; }); - }, [myData.current.node!.template]); + }, [open]); return rowData; }; diff --git a/src/frontend/src/modals/editNodeModal/index.tsx b/src/frontend/src/modals/editNodeModal/index.tsx index 9de14977f..3e60a39d7 100644 --- a/src/frontend/src/modals/editNodeModal/index.tsx +++ b/src/frontend/src/modals/editNodeModal/index.tsx @@ -1,4 +1,5 @@ import { ColDef } from "ag-grid-community"; +import { cloneDeep } from "lodash"; import { forwardRef, useEffect, useRef } from "react"; import IconComponent from "../../components/genericIconComponent"; import TableComponent from "../../components/tableComponent"; @@ -22,7 +23,7 @@ const EditNodeModal = forwardRef( setOpen: (open: boolean) => void; data: NodeDataType; }, - ref + ref, ) => { const nodes = useFlowStore((state) => state.nodes); @@ -43,16 +44,17 @@ const EditNodeModal = forwardRef( useEffect(() => { if (open) { - myData.current = data; + const cloneData = cloneDeep(dataFromStore ?? data); + myData.current = cloneData; } }, [open]); - const rowData = useRowData(myData); + const rowData = useRowData(myData, open); const columnDefs: ColDef[] = useColumnDefs( myData, handleOnNewValue, - changeAdvanced + changeAdvanced, ); return ( @@ -110,7 +112,7 @@ const EditNodeModal = forwardRef( ); - } + }, ); export default EditNodeModal; diff --git a/src/frontend/tests/end-to-end/dropdownComponent.spec.ts b/src/frontend/tests/end-to-end/dropdownComponent.spec.ts index b5ff9ef00..f402bead2 100644 --- a/src/frontend/tests/end-to-end/dropdownComponent.spec.ts +++ b/src/frontend/tests/end-to-end/dropdownComponent.spec.ts @@ -62,6 +62,8 @@ test("dropDownComponent", async ({ page }) => { expect(false).toBeTruthy(); } + await page.waitForTimeout(1000); + await page.getByTestId("more-options-modal").click(); await page.getByTestId("edit-button-modal").click();