From de2ae6636a8d6f38295522332ae7c7b6a7adabeb Mon Sep 17 00:00:00 2001
From: RCKT <3314891+orangecoloured@users.noreply.github.com>
Date: Fri, 18 Oct 2024 07:54:28 +0200
Subject: [PATCH] fix: reset playground i/o data on namespace change (#1543)

To test this this toolkit version could be used for cloud
`0.107.0-rc.15`

Because

- changing namespace on model playground did not reset the i/o forms
data

This commit

- now it do reset it


https://github.com/user-attachments/assets/f058e1ed-804f-4d53-bcf9-03286eea226a
---
 .../view/model/view-model/ModelPlayground.tsx | 29 ++++++++++++++-----
 1 file changed, 22 insertions(+), 7 deletions(-)

diff --git a/packages/toolkit/src/view/model/view-model/ModelPlayground.tsx b/packages/toolkit/src/view/model/view-model/ModelPlayground.tsx
index 56fd377f49..a4fa546751 100644
--- a/packages/toolkit/src/view/model/view-model/ModelPlayground.tsx
+++ b/packages/toolkit/src/view/model/view-model/ModelPlayground.tsx
@@ -77,6 +77,7 @@ const defaultCurrentOperationIdPollingData = {
   timeoutRunning: false,
   isRendered: false,
   modelVersion: null,
+  targetNamespace: null,
 };
 
 export const ModelPlayground = ({
@@ -96,6 +97,7 @@ export const ModelPlayground = ({
     timeoutRunning: boolean;
     isRendered: boolean;
     modelVersion: Nullable<string>;
+    targetNamespace: Nullable<string>;
   }>(defaultCurrentOperationIdPollingData);
   const { toast } = useToast();
   const { amplitudeIsInit } = useAmplitudeCtx();
@@ -210,15 +212,22 @@ export const ModelPlayground = ({
     }, OPERATION_POLL_TIMEOUT);
   }, [model?.name, queryClient, existingModelTriggerResult]);
 
+  const resetStatesAndCurrentOperationIdPollingData = () => {
+    currentOperationIdPollingData.current =
+      defaultCurrentOperationIdPollingData;
+    setExistingTriggerState(null);
+    setInputFromExistingResult(null);
+    setModelRunResult(null);
+  };
+
   useEffect(() => {
-    if (activeVersion !== currentOperationIdPollingData.current.modelVersion) {
-      currentOperationIdPollingData.current =
-        defaultCurrentOperationIdPollingData;
-      setExistingTriggerState(null);
-      setInputFromExistingResult(null);
-      setModelRunResult(null);
+    if (
+      activeVersion !== currentOperationIdPollingData.current.modelVersion ||
+      targetNamespace !== currentOperationIdPollingData.current.targetNamespace
+    ) {
+      resetStatesAndCurrentOperationIdPollingData();
     }
-  }, [activeVersion]);
+  }, [activeVersion, targetNamespace]);
 
   useEffect(() => {
     if (
@@ -273,6 +282,10 @@ export const ModelPlayground = ({
         setExistingTriggerState(existingModelTriggerResult.data.operation);
       }
     }
+    // "toast" update doesn't matter here
+    // and the "pollForResponse" mainly uses ref and a couple of methods that
+    // don't depend on the state of the data
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [
     existingTriggerState,
     existingModelTriggerResult.isSuccess,
@@ -316,8 +329,10 @@ export const ModelPlayground = ({
         isRendered: existingTriggerState.done,
         name: existingTriggerState.name,
         modelVersion: existingTriggerState.response?.request.version || null,
+        targetNamespace: targetNamespace?.id || null,
       };
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [existingTriggerState, model]);
 
   const triggerModel = useTriggerUserModelVersionAsync();