+
{!showNode && (
<>
{renderInputParameters()}
diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
index 84cbc4298..4b7af3c23 100644
--- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
@@ -341,83 +341,104 @@ const NodeToolbarComponent = memo(
const [selectedValue, setSelectedValue] = useState(null);
- const handleSelectChange = useCallback((event) => {
- setSelectedValue(event);
+ const handleSelectChange = useCallback(
+ (event) => {
+ setSelectedValue(event);
- switch (event) {
- case "save":
- saveComponent();
- break;
- case "freeze":
- freezeFunction();
- break;
- case "freezeAll":
- FreezeAllVertices({ flowId: currentFlowId, stopNodeId: data.id });
- break;
- case "code":
- setOpenModal(!openModal);
- break;
- case "advanced":
- setShowModalAdvanced(true);
- break;
- case "show":
- takeSnapshot();
- handleMinimize();
- break;
- case "Share":
- shareComponent();
- break;
- case "Download":
- downloadNode(flowComponent!);
- break;
- case "SaveAll":
- addFlow({
- flow: flowComponent,
- override: false,
- });
- break;
- case "documentation":
- openDocs();
- break;
- case "disabled":
- break;
- case "ungroup":
- handleungroup();
- break;
- case "override":
- setShowOverrideModal(true);
- break;
- case "delete":
- deleteNode(data.id);
- break;
- case "update":
- updateNode();
- break;
- case "copy":
- const node = nodes.filter((node) => node.id === data.id);
- setLastCopiedSelection({ nodes: _.cloneDeep(node), edges: [] });
- break;
- case "duplicate":
- paste(
- {
- nodes: [nodes.find((node) => node.id === data.id)!],
- edges: [],
- },
- {
- x: 50,
- y: 10,
- paneX: nodes.find((node) => node.id === data.id)?.position.x,
- paneY: nodes.find((node) => node.id === data.id)?.position.y,
- },
- );
- break;
- case "toolMode":
- handleActivateToolMode();
- break;
- }
+ switch (event) {
+ case "save":
+ saveComponent();
+ break;
+ case "freeze":
+ freezeFunction();
+ break;
+ case "freezeAll":
+ FreezeAllVertices({ flowId: currentFlowId, stopNodeId: data.id });
+ break;
+ case "code":
+ setOpenModal(!openModal);
+ break;
+ case "advanced":
+ setShowModalAdvanced(true);
+ break;
+ case "show":
+ takeSnapshot();
+ handleMinimize();
+ break;
+ case "Share":
+ shareComponent();
+ break;
+ case "Download":
+ downloadNode(flowComponent!);
+ break;
+ case "SaveAll":
+ addFlow({
+ flow: flowComponent,
+ override: false,
+ });
+ break;
+ case "documentation":
+ openDocs();
+ break;
+ case "disabled":
+ break;
+ case "ungroup":
+ handleungroup();
+ break;
+ case "override":
+ setShowOverrideModal(true);
+ break;
+ case "delete":
+ deleteNode(data.id);
+ break;
+ case "update":
+ updateNode();
+ break;
+ case "copy":
+ const node = nodes.filter((node) => node.id === data.id);
+ setLastCopiedSelection({ nodes: _.cloneDeep(node), edges: [] });
+ break;
+ case "duplicate":
+ paste(
+ {
+ nodes: [nodes.find((node) => node.id === data.id)!],
+ edges: [],
+ },
+ {
+ x: 50,
+ y: 10,
+ paneX: nodes.find((node) => node.id === data.id)?.position.x,
+ paneY: nodes.find((node) => node.id === data.id)?.position.y,
+ },
+ );
+ break;
+ case "toolMode":
+ handleActivateToolMode();
+ break;
+ }
- setSelectedValue(null);
- }, []);
+ setSelectedValue(null);
+ },
+ [
+ saveComponent,
+ freezeFunction,
+ FreezeAllVertices,
+ setOpenModal,
+ setShowModalAdvanced,
+ handleMinimize,
+ shareComponent,
+ downloadNode,
+ addFlow,
+ openDocs,
+ handleungroup,
+ setShowOverrideModal,
+ deleteNode,
+ updateNode,
+ setLastCopiedSelection,
+ paste,
+ handleActivateToolMode,
+ ],
+ );
const { handleOnNewValue: handleOnNewValueHook } = useHandleOnNewValue({
node: data.node!,
@@ -692,7 +713,6 @@ const NodeToolbarComponent = memo(
}
value={showNode ? "Minimize" : "Expand"}
icon={showNode ? "Minimize2" : "Maximize2"}
- dataTestId="minimize-button-modal"
/>
)}
diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts
index 9da2cf7c1..d32bd1af9 100644
--- a/src/frontend/src/types/components/index.ts
+++ b/src/frontend/src/types/components/index.ts
@@ -784,7 +784,7 @@ export type toolbarSelectItemProps = {
value: string;
icon: string;
style?: string;
- dataTestId: string;
+ dataTestId?: string;
ping?: boolean;
shortcut: string;
};
diff --git a/src/frontend/tests/extended/regression/general-bugs-minimize-state-error.spec.ts b/src/frontend/tests/extended/regression/general-bugs-minimize-state-error.spec.ts
new file mode 100644
index 000000000..970595a8d
--- /dev/null
+++ b/src/frontend/tests/extended/regression/general-bugs-minimize-state-error.spec.ts
@@ -0,0 +1,46 @@
+import { expect, Page, test } from "@playwright/test";
+import { awaitBootstrapTest } from "../../utils/await-bootstrap-test";
+
+async function toggleNodeState(page: Page, action: "minimize" | "expand") {
+ const expectedCount = action === "minimize" ? 0 : 1;
+ await page.getByTestId("more-options-modal").click();
+ await page.getByTestId(`${action}-button-modal`).click();
+ expect(await page.getByTestId("show-node-content").count()).toBe(
+ expectedCount,
+ );
+}
+
+test(
+ "user must be able to minimize and expand a node how many times as they want",
+ { tag: ["@release", "@components"] },
+ async ({ page }) => {
+ await awaitBootstrapTest(page);
+ await page.getByTestId("blank-flow").click();
+
+ await page.waitForSelector('[data-testid="fit_view"]', {
+ timeout: 100000,
+ });
+ await page.getByTestId("sidebar-search-input").click();
+ await page.getByTestId("sidebar-search-input").fill("text output");
+
+ await page
+ .getByTestId("outputsText Output")
+ .hover()
+ .then(async () => {
+ await page.getByTestId("add-component-button-text-output").click();
+ });
+
+ await page.waitForSelector('[data-testid="title-Text Output"]', {
+ timeout: 3000,
+ });
+
+ expect(await page.getByText("Toolset", { exact: true }).count()).toBe(0);
+ await page.getByTestId("title-Text Output").click();
+ expect(await page.getByTestId("show-node-content").count()).toBe(1);
+
+ for (let i = 0; i < 5; i++) {
+ await toggleNodeState(page, "minimize");
+ await toggleNodeState(page, "expand");
+ }
+ },
+);