From b6e1e4038979ca2efe4dfd8d613e38c4661d1ae9 Mon Sep 17 00:00:00 2001
From: james-union <105876962+james-union@users.noreply.github.com>
Date: Mon, 22 Aug 2022 12:39:20 -0400
Subject: [PATCH] fix: Dict value loses 1 trailing character on UI Launch.
 (#561)

fix: dict lose trailing issue

Signed-off-by: James <james@union.ai>

Signed-off-by: James <james@union.ai>
---
 .../components/Launch/LaunchForm/MapInput.tsx | 37 +++++++++----------
 1 file changed, 17 insertions(+), 20 deletions(-)

diff --git a/packages/zapp/console/src/components/Launch/LaunchForm/MapInput.tsx b/packages/zapp/console/src/components/Launch/LaunchForm/MapInput.tsx
index ae03a5b77..6b9818754 100644
--- a/packages/zapp/console/src/components/Launch/LaunchForm/MapInput.tsx
+++ b/packages/zapp/console/src/components/Launch/LaunchForm/MapInput.tsx
@@ -127,8 +127,8 @@ export const MapInput = (props: InputProps) => {
     setData((data) => [...data, getNewMapItem(data.length)]);
   };
 
-  const updateUpperStream = () => {
-    const newPairs = data
+  const updateUpperStream = (newData: MapInputItem[]) => {
+    const newPairs = newData
       .filter((item) => {
         // we filter out delted values and items with errors or empty keys/values
         return item.id !== null && !!item.key && !!item.value;
@@ -145,32 +145,29 @@ export const MapInput = (props: InputProps) => {
 
   const onSetKey = (id: number | null, key: string) => {
     if (id === null) return;
-    setData((data) => {
-      data[id].key = key;
-      return [...data];
-    });
-    updateUpperStream();
+    const newData = [...data];
+    newData[id].key = key;
+    setData([...newData]);
+    updateUpperStream([...newData]);
   };
 
   const onSetValue = (id: number | null, value: string) => {
     if (id === null) return;
-    setData((data) => {
-      data[id].value = value;
-      return [...data];
-    });
-    updateUpperStream();
+    const newData = [...data];
+    newData[id].value = value;
+    setData([...newData]);
+    updateUpperStream([...newData]);
   };
 
   const onDeleteItem = (id: number | null) => {
     if (id === null) return;
-    setData((data) => {
-      const dataIndex = data.findIndex((item) => item.id === id);
-      if (dataIndex >= 0 && dataIndex < data.length) {
-        data[dataIndex].id = null;
-      }
-      return [...data];
-    });
-    updateUpperStream();
+    const newData = [...data];
+    const dataIndex = newData.findIndex((item) => item.id === id);
+    if (dataIndex >= 0 && dataIndex < newData.length) {
+      newData[dataIndex].id = null;
+    }
+    setData([...newData]);
+    updateUpperStream([...newData]);
   };
 
   const isValid = (id: number | null, value: string) => {