From 50cafd6b252991f50bac338422e447a12370228a Mon Sep 17 00:00:00 2001
From: George Sproston
 <103250539+gsproston-scottlogic@users.noreply.github.com>
Date: Fri, 11 Aug 2023 14:22:08 +0100
Subject: [PATCH] Fixed config bug (#121)

---
 .../src/components/DefenceBox/DefenceBox.tsx  |  5 ----
 .../DefenceBox/DefenceConfiguration.tsx       |  5 ++--
 .../DefenceBox/DefenceMechanism.tsx           | 24 ++++++++++---------
 .../ModelSelectionBox/ModelSelectionBox.tsx   |  4 +++-
 4 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/frontend/src/components/DefenceBox/DefenceBox.tsx b/frontend/src/components/DefenceBox/DefenceBox.tsx
index 6881d19bf..fd3543f0e 100644
--- a/frontend/src/components/DefenceBox/DefenceBox.tsx
+++ b/frontend/src/components/DefenceBox/DefenceBox.tsx
@@ -53,7 +53,6 @@ function DefenceBox({
 
   // update triggered defences
   useEffect(() => {
-    console.log("updating triggered defences: ", triggeredDefences);
     // update state
     const newDefences = defenceDetails.map((defenceDetail) => {
       defenceDetail.isTriggered = triggeredDefences.includes(defenceDetail.id);
@@ -109,10 +108,6 @@ function DefenceBox({
     });
   };
 
-  useEffect(() => {
-    console.log("defenceDetails: ", defenceDetails);
-  }, [defenceDetails]);
-
   return (
     <div id="strategy-box">
       {defenceDetails.map((defenceDetail, index) => {
diff --git a/frontend/src/components/DefenceBox/DefenceConfiguration.tsx b/frontend/src/components/DefenceBox/DefenceConfiguration.tsx
index cd1b7761d..0600e97c6 100644
--- a/frontend/src/components/DefenceBox/DefenceConfiguration.tsx
+++ b/frontend/src/components/DefenceBox/DefenceConfiguration.tsx
@@ -12,9 +12,10 @@ function DefenceConfiguration(
     setConfigurationValue: (configId: string, value: string) => void;
   }
 ) {
-  const setConfiguration = (event: React.KeyboardEvent<HTMLInputElement>) => {
+  const setConfiguration = (event: React.KeyboardEvent<HTMLDivElement>) => {
     if (event.key === "Enter") {
-      setConfigurationValue(config.id, event.currentTarget.value);
+      const value = event.currentTarget.innerText.trim();
+      setConfigurationValue(config.id, value);
     }
   };
 
diff --git a/frontend/src/components/DefenceBox/DefenceMechanism.tsx b/frontend/src/components/DefenceBox/DefenceMechanism.tsx
index dcea78c50..b23e45d50 100644
--- a/frontend/src/components/DefenceBox/DefenceMechanism.tsx
+++ b/frontend/src/components/DefenceBox/DefenceMechanism.tsx
@@ -77,17 +77,19 @@ function DefenceMechanism({
         {isInfoBoxVisible ? (
           <div className="strategy-mechanism-info-box">
             <div>{defenceDetail.info}</div>
-            <div className="defence-mechanism-config">
-              {defenceDetail.config?.map((config, index) => {
-                return (
-                  <DefenceConfiguration
-                    key={config.id}
-                    config={config}
-                    setConfigurationValue={setConfigurationValue}
-                  />
-                );
-              })}
-            </div>
+            {defenceDetail.config ? (
+              <div className="defence-mechanism-config">
+                {defenceDetail.config.map((config, index) => {
+                  return (
+                    <DefenceConfiguration
+                      key={config.id}
+                      config={config}
+                      setConfigurationValue={setConfigurationValue}
+                    />
+                  );
+                })}
+              </div>
+            ) : null}
           </div>
         ) : null}
       </div>
diff --git a/frontend/src/components/ModelSelectionBox/ModelSelectionBox.tsx b/frontend/src/components/ModelSelectionBox/ModelSelectionBox.tsx
index ca1b57f5e..9fbbf6084 100644
--- a/frontend/src/components/ModelSelectionBox/ModelSelectionBox.tsx
+++ b/frontend/src/components/ModelSelectionBox/ModelSelectionBox.tsx
@@ -49,7 +49,9 @@ function ModelSelectionBox() {
           placeholder={modelInUse}
         >
           {chatModelOptions.map((model) => (
-            <option value={model}>{model}</option>
+            <option key={model} value={model}>
+              {model}
+            </option>
           ))}
           ;
         </select>