diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index 80e5ad0f7..bfc277c08 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -146,7 +146,9 @@ export default function GenericNode({ } }, [validationStatus, validationStatus?.params]); - const showNode = data.showNode ?? true; + // const showNode = data.showNode ?? true; + + const [showNode, setShowNode] = useState(data.showNode ?? true); const nameEditable = true; @@ -285,6 +287,7 @@ export default function GenericNode({ data: { ...old.data, showNode: show }, })); }} + setShowState={setShowNode} numberOfHandles={handles} showNode={showNode} openAdvancedModal={false} diff --git a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx index e21c13ba4..146824f80 100644 --- a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx +++ b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx @@ -110,13 +110,13 @@ export const MenuBar = ({ Undo {navigator.userAgent.toUpperCase().includes("MAC") ? ( - - ) : ( - Ctrl + - )} + + ) : ( + Ctrl + + )} Z Redo {navigator.userAgent.toUpperCase().includes("MAC") ? ( - - ) : ( - Ctrl + - )} + + ) : ( + Ctrl + + )} Y diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx index 3d7d6610c..b9a07f84d 100644 --- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx @@ -37,6 +37,7 @@ export default function NodeToolbarComponent({ showNode, name = "code", selected, + setShowState, onCloseAdvancedModal, }: nodeToolbarPropsType): JSX.Element { const nodeLength = Object.keys(data.node!.template).filter( @@ -58,6 +59,7 @@ export default function NodeToolbarComponent({ const hasStore = useStoreStore((state) => state.hasStore); const hasApiKey = useStoreStore((state) => state.hasApiKey); const validApiKey = useStoreStore((state) => state.validApiKey); + const [updateMinimize, setUpdateMinimize] = useState(showNode); const isMinimal = numberOfHandles <= 1; const isGroup = data.node?.flow ? true : false; @@ -243,8 +245,8 @@ export default function NodeToolbarComponent({ event.key === "q" ) { event.preventDefault(); - setShowNode(data.showNode ?? true ? false : true); - unselectAll(); + setShowState(show => !show) + setShowNode(showNode); } if ( selected && @@ -590,7 +592,7 @@ export default function NodeToolbarComponent({ className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2" > ) : ( - Ctrl + + Ctrl + )} U diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts index b0245e1ff..87e9a4592 100644 --- a/src/frontend/src/types/components/index.ts +++ b/src/frontend/src/types/components/index.ts @@ -1,4 +1,4 @@ -import { ReactElement, ReactNode } from "react"; +import { ReactElement, ReactNode, SetStateAction } from "react"; import { ReactFlowJsonObject, XYPosition } from "reactflow"; import { APIClassType, APITemplateType, TemplateVariableType } from "../api"; import { ChatMessageType } from "../chat"; @@ -489,6 +489,7 @@ export type nodeToolbarPropsType = { openAdvancedModal?: boolean; onCloseAdvancedModal?: (close: boolean) => void; selected: boolean; + setShowState: (show: boolean | SetStateAction) => void; }; export type parsedDataType = {