fix: prompt template not being saved on advanced modal (#2488)

* Fixed dbvalue on table node cell renderer

* Added Change Advanced hook

* Added Handle New Value hook

* Added Handle Node Class hook

* Added Node Class handler to TableNodeCellRender

* Removed internal state of EditNode, added internal state for NodeClass and made the rows and columns be updated when NodeClass changes

* Added NodeClass as dependencies on useMemo to update columns when NodeClass changes

* Fixed advanced not changing the node

* feat: updating tests without save btn

* Added Close button on editNode

---------

Co-authored-by: cristhianzl <cristhian.lousa@gmail.com>
Co-authored-by: anovazzi1 <otavio2204@gmail.com>

src/frontend/tests/end-to-end/chatInputOutputUser-shard-0.spec.ts

@@ -54,7 +54,7 @@ test("user must be able to send an image on chat", async ({ page }) => {
   await page.getByText("Chat Input", { exact: true }).click();
   await page.getByTestId("more-options-modal").click();
   await page.getByTestId("edit-button-modal").click();
-  await page.getByText("Save Changes").click();
+  await page.getByText("Close").last().click();
 
   await page.getByText("Playground", { exact: true }).click();
 

src/frontend/tests/end-to-end/chatInputOutputUser-shard-2.spec.ts

@@ -93,12 +93,12 @@ test("user must interact with chat with Input/Output", async ({ page }) => {
   await page.getByText("Chat Input", { exact: true }).click();
   await page.getByTestId("advanced-button-modal").click();
   await page.getByTestId("showsender_name").click();
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   await page.getByText("Chat Output", { exact: true }).click();
   await page.getByTestId("advanced-button-modal").click();
   await page.getByTestId("showsender_name").click();
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   await page
     .getByTestId("popover-anchor-input-sender_name")

src/frontend/tests/end-to-end/decisionFlow.spec.ts

@@ -472,7 +472,7 @@ AI:
     .getByTestId("popover-anchor-input-input_message-edit")
     .nth(0)
     .fill("You're Happy! 🤪");
-  await page.getByText("Save Changes").click();
+  await page.getByText("Close").last().click();
 
   await page.getByTitle("zoom in").click();
   await page.getByTitle("zoom in").click();
@@ -495,7 +495,7 @@ AI:
     .getByTestId("popover-anchor-input-input_message-edit")
     .nth(0)
     .fill("You're Sad! 🥲");
-  await page.getByText("Save Changes").click();
+  await page.getByText("Close").last().click();
 
   await page.getByTitle("fit view").click({
     force: true,

src/frontend/tests/end-to-end/dropdownComponent.spec.ts

@@ -144,7 +144,7 @@ test("dropDownComponent", async ({ page }) => {
     expect(false).toBeTruthy();
   }
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   value = await page.getByTestId("dropdown-model_id").innerText();
   if (value !== "cohere.embed-multilingual-v3") {

src/frontend/tests/end-to-end/floatComponent.spec.ts

@@ -99,7 +99,7 @@ test("FloatComponent", async ({ page }) => {
     await page.locator('//*[@id="showmirostat_tau"]').isChecked(),
   ).toBeFalsy();
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   const plusButtonLocator = page.locator('//*[@id="float-input"]');
   const elementCount = await plusButtonLocator?.count();
@@ -115,7 +115,7 @@ test("FloatComponent", async ({ page }) => {
       await page.locator('//*[@id="showtemperature"]').isChecked(),
     ).toBeTruthy();
 
-    await page.getByText("Save Changes", { exact: true }).click();
+    await page.getByText("Close").last().click();
     await page.locator('//*[@id="float-input"]').click();
     await page.locator('//*[@id="float-input"]').fill("3");
 

src/frontend/tests/end-to-end/inputComponent.spec.ts

@@ -135,7 +135,7 @@ test("InputComponent", async ({ page }) => {
     .getByTestId("popover-anchor-input-collection_name-edit")
     .fill("NEW_collection_name_test_123123123!@#$&*(&%$@ÇÇÇÀõe");
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   const plusButtonLocator = page.getByTestId("input-collection_name");
   const elementCount = await plusButtonLocator?.count();
@@ -152,7 +152,7 @@ test("InputComponent", async ({ page }) => {
       await page.locator('//*[@id="showcollection_name"]').isChecked(),
     ).toBeTruthy();
 
-    await page.getByText("Save Changes", { exact: true }).click();
+    await page.getByText("Close").last().click();
 
     let value = await page
       .getByTestId("popover-anchor-input-collection_name")

src/frontend/tests/end-to-end/inputListComponent.spec.ts

@@ -87,7 +87,7 @@ test("InputListComponent", async ({ page }) => {
     expect(false).toBeTruthy();
   }
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   await page.getByTestId("input-list-minus-btn_urls-2").isHidden();
 

src/frontend/tests/end-to-end/intComponent.spec.ts

@@ -51,7 +51,7 @@ test("IntComponent", async ({ page }) => {
   await page.getByTestId("edit-button-modal").click();
   await page.getByTestId("showmax_tokens").click();
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
   await page.getByTestId("int-input-max_tokens").click();
   await page
     .getByTestId("int-input-max_tokens")
@@ -172,7 +172,7 @@ test("IntComponent", async ({ page }) => {
     await page.locator('//*[@id="showtemperature"]').isChecked(),
   ).toBeFalsy();
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   const plusButtonLocator = page.getByTestId("int-input-max_tokens");
   const elementCount = await plusButtonLocator?.count();
@@ -195,7 +195,7 @@ test("IntComponent", async ({ page }) => {
       expect(false).toBeTruthy();
     }
 
-    await page.getByText("Save Changes", { exact: true }).click();
+    await page.getByText("Close").last().click();
     await page.getByTestId("int-input-max_tokens").click();
     await page.getByTestId("int-input-max_tokens").fill("3");
 

src/frontend/tests/end-to-end/keyPairListComponent.spec.ts

@@ -47,7 +47,7 @@ test("KeypairListComponent", async ({ page }) => {
 
   await page.getByTestId("showmodel_kwargs").click();
   expect(await page.getByTestId("showmodel_kwargs").isChecked()).toBeTruthy();
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   await page.locator('//*[@id="keypair0"]').click();
   await page.locator('//*[@id="keypair0"]').fill("testtesttesttest");
@@ -92,7 +92,7 @@ test("KeypairListComponent", async ({ page }) => {
   expect(
     await page.locator('//*[@id="showcredentials_profile_name"]').isChecked(),
   ).toBeFalsy();
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   const plusButtonLocator = page.locator('//*[@id="plusbtn0"]');
   const elementCount = await plusButtonLocator?.count();
@@ -115,7 +115,7 @@ test("KeypairListComponent", async ({ page }) => {
     const elementKeyCount = await keyPairVerification?.count();
 
     if (elementKeyCount === 1) {
-      await page.getByText("Save Changes", { exact: true }).click();
+      await page.getByText("Close").last().click();
 
       await page.getByTestId("div-generic-node").click();
 

src/frontend/tests/end-to-end/langflowShortcuts.spec.ts

@@ -60,7 +60,7 @@ test("LangflowShortcuts", async ({ page }) => {
   await page.getByTitle("zoom out").click();
   await page.getByTestId("generic-node-title-arrangement").click();
   await page.keyboard.press(`${control}+Shift+A`);
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   await page.getByTestId("generic-node-title-arrangement").click();
   await page.keyboard.press(`${control}+d`);

src/frontend/tests/end-to-end/nestedComponent.spec.ts

@@ -174,5 +174,5 @@ test("NestedComponent", async ({ page }) => {
     await page.locator('//*[@id="showtext_key"]').isChecked(),
   ).toBeTruthy();
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 });

src/frontend/tests/end-to-end/promptModalComponent.spec.ts

@@ -182,7 +182,7 @@ test("PromptTemplateComponent", async ({ page }) => {
   await page.locator('//*[@id="showprompt"]').click();
   expect(await page.locator('//*[@id="showprompt"]').isChecked()).toBeTruthy();
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   await page.getByTestId("more-options-modal").click();
   await page.getByTestId("edit-button-modal").click();

src/frontend/tests/end-to-end/toggleComponent.spec.ts

@@ -62,7 +62,7 @@ test("ToggleComponent", async ({ page }) => {
     await page.locator('//*[@id="showload_hidden"]').isChecked(),
   ).toBeTruthy();
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   await page.waitForSelector('[title="fit view"]', {
     timeout: 100000,
@@ -152,7 +152,7 @@ test("ToggleComponent", async ({ page }) => {
     await page.locator('//*[@id="showuse_multithreading"]').isChecked(),
   ).toBeFalsy();
 
-  await page.getByText("Save Changes", { exact: true }).click();
+  await page.getByText("Close").last().click();
 
   const plusButtonLocator = page.getByTestId("toggle-load_hidden");
   const elementCount = await plusButtonLocator?.count();
@@ -173,7 +173,7 @@ test("ToggleComponent", async ({ page }) => {
       await page.getByTestId("toggle-edit-load_hidden").isChecked(),
     ).toBeTruthy();
 
-    await page.getByText("Save Changes", { exact: true }).click();
+    await page.getByText("Close").last().click();
 
     await page.getByTestId("toggle-load_hidden").click();
     expect(