fix: frozen status is lost after run (#3158)

* fix: frozen status is lost after run

* [autofix.ci] apply automated fixes

* add FE tests to freeze feature

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: cristhianzl <cristhian.lousa@gmail.com>
Co-authored-by: Cristhian Zanforlin Lousa <72977554+Cristhianzl@users.noreply.github.com>

src/frontend/src/CustomNodes/GenericNode/index.tsx

@@ -217,7 +217,9 @@ export default function GenericNode({
 
   useEffect(() => {
     if (buildStatus === BuildStatus.BUILT && !isBuilding) {
-      setNode(data.id, (old) => {
+      setNode(
+        data.id,
+        (old) => {
           return {
             ...old,
             data: {
@@ -228,7 +230,9 @@ export default function GenericNode({
               },
             },
           };
-      });
+        },
+        false,
+      );
     }
   }, [buildStatus, isBuilding]);
 

src/frontend/src/stores/flowStore.ts

@@ -245,7 +245,11 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
       );
     }
   },
-  setNode: (id: string, change: Node | ((oldState: Node) => Node)) => {
+  setNode: (
+    id: string,
+    change: Node | ((oldState: Node) => Node),
+    isUserChange: boolean = true,
+  ) => {
     let newChange =
       typeof change === "function"
         ? change(get().nodes.find((node) => node.id === id)!)
@@ -253,9 +257,11 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
     get().setNodes((oldNodes) =>
       oldNodes.map((node) => {
         if (node.id === id) {
+          if (isUserChange) {
             if ((node.data as NodeDataType).node?.frozen) {
               (newChange.data as NodeDataType).node!.frozen = false;
             }
+          }
           return newChange;
         }
         return node;

src/frontend/src/types/zustand/flow/index.ts

@@ -109,7 +109,11 @@ export type FlowStoreType = {
     update: Edge[] | ((oldState: Edge[]) => Edge[]),
     skipSave?: boolean,
   ) => void;
-  setNode: (id: string, update: Node | ((oldState: Node) => Node)) => void;
+  setNode: (
+    id: string,
+    update: Node | ((oldState: Node) => Node),
+    isUserChange: boolean,
+  ) => void;
   getNode: (id: string) => Node | undefined;
   deleteNode: (nodeId: string | Array<string>) => void;
   deleteEdge: (edgeId: string | Array<string>) => void;

src/frontend/tests/end-to-end/generalBugs-shard-10.spec.ts

@@ -0,0 +1,140 @@
+import { expect, test } from "@playwright/test";
+import * as dotenv from "dotenv";
+import path from "path";
+
+test("freeze must work correctly", async ({ page }) => {
+  test.skip(
+    !process?.env?.OPENAI_API_KEY,
+    "OPENAI_API_KEY required to run this test",
+  );
+
+  if (!process.env.CI) {
+    dotenv.config({ path: path.resolve(__dirname, "../../.env") });
+  }
+
+  await page.goto("/");
+  await page.waitForTimeout(1000);
+
+  const promptText = "THIS IS A TEST PROMPT";
+  const newPromptText = "TEST TEST TEST TEST TEST";
+
+  let modalCount = 0;
+  try {
+    const modalTitleElement = await page?.getByTestId("modal-title");
+    if (modalTitleElement) {
+      modalCount = await modalTitleElement.count();
+    }
+  } catch (error) {
+    modalCount = 0;
+  }
+
+  while (modalCount === 0) {
+    await page.getByText("New Project", { exact: true }).click();
+    await page.waitForTimeout(5000);
+    modalCount = await page.getByTestId("modal-title")?.count();
+  }
+
+  await page.getByRole("heading", { name: "Basic Prompting" }).click();
+  await page.waitForTimeout(1000);
+
+  await page.getByTitle("fit view").click();
+
+  await page.getByText("openai").first().click();
+  await page.keyboard.press("Delete");
+
+  //connection 1
+
+  const elementPrompt = await page
+    .getByTestId("handle-prompt-shownode-prompt message-right")
+    .first();
+  await elementPrompt.hover();
+  await page.mouse.down();
+
+  await page.locator('//*[@id="react-flow-id"]').hover();
+
+  const elementChatOutput = await page
+    .getByTestId("handle-chatoutput-shownode-text-left")
+    .first();
+  await elementChatOutput.hover();
+  await page.mouse.up();
+
+  await page.locator('//*[@id="react-flow-id"]').hover();
+
+  await page.getByTestId("promptarea_prompt_template-ExternalLink").click();
+
+  await page.getByTestId("modal-promptarea_prompt_template").fill(promptText);
+
+  let promptValue = await page
+    .getByTestId("modal-promptarea_prompt_template")
+    .inputValue();
+
+  await page.getByText("Check & Save").click();
+
+  await page.waitForTimeout(3000);
+
+  await page.getByTestId("button_run_chat output").click();
+
+  await page.waitForTimeout(3000);
+
+  await page.getByTestId("button_run_chat output").click();
+
+  await page.waitForTimeout(3000);
+
+  await page.getByTestId("playground-btn-flow-io").click();
+
+  const textContents = await page
+    .getByTestId("div-chat-message")
+    .allTextContents();
+
+  const concatAllText = textContents.join(" ");
+
+  expect(concatAllText).toContain(promptValue);
+
+  await page.waitForTimeout(1000);
+  await page.getByText("Close").last().click();
+
+  await page.getByText("Prompt", { exact: true }).click();
+  await page.getByTestId("more-options-modal").click();
+
+  await page.getByText("Freeze", { exact: true }).last().click();
+
+  await page.waitForTimeout(1000);
+  await page.locator('//*[@id="react-flow-id"]').click();
+
+  expect(page.getByTestId("icon-Snowflake").first()).toBeVisible();
+
+  await page.locator('//*[@id="react-flow-id"]').click();
+
+  await page.getByTestId("promptarea_prompt_template-ExternalLink").click();
+
+  await page.getByTestId("edit-prompt-sanitized").first().click();
+
+  await page
+    .getByTestId("modal-promptarea_prompt_template")
+    .fill(newPromptText);
+
+  promptValue = await page
+    .getByTestId("modal-promptarea_prompt_template")
+    .inputValue();
+
+  await page.getByText("Check & Save").click();
+
+  await page.getByTestId("button_run_chat output").click();
+
+  await page.waitForTimeout(3000);
+
+  await page.getByTestId("button_run_chat output").click();
+
+  await page.waitForTimeout(3000);
+
+  await page.getByTestId("playground-btn-flow-io").click();
+
+  const textContents2 = await page
+    .getByTestId("div-chat-message")
+    .allTextContents();
+
+  const concatAllText2 = textContents2.join(" ");
+
+  expect(concatAllText2).toContain(promptText);
+  expect(concatAllText2).not.toContain(newPromptText);
+});