From 330f18fa4a876917654bdef98cb77192a524cef9 Mon Sep 17 00:00:00 2001
From: jbirddog <100367399+jbirddog@users.noreply.github.com>
Date: Thu, 15 Feb 2024 08:33:57 -0500
Subject: [PATCH] Fix two issues related to the data store type selection
 (#1033)

---
 .../src/components/DataStoreForm.tsx          | 70 ++++++++++++-------
 1 file changed, 46 insertions(+), 24 deletions(-)

diff --git a/spiffworkflow-frontend/src/components/DataStoreForm.tsx b/spiffworkflow-frontend/src/components/DataStoreForm.tsx
index fde106f5..18585c69 100644
--- a/spiffworkflow-frontend/src/components/DataStoreForm.tsx
+++ b/spiffworkflow-frontend/src/components/DataStoreForm.tsx
@@ -155,8 +155,14 @@ export default function DataStoreForm({
   const onTypeChanged = (newType: any) => {
     setTypeInvalid(false);
     const newTypeSelection = newType.selectedItem;
-    const updateDict = { type: newTypeSelection.type };
-    updateDataStore(updateDict);
+    if (
+      newTypeSelection &&
+      typeof newTypeSelection === 'object' &&
+      'type' in newTypeSelection
+    ) {
+      const updateDict = { type: newTypeSelection.type };
+      updateDataStore(updateDict);
+    }
     setSelectedDataStoreType(newTypeSelection);
   };
 
@@ -166,6 +172,18 @@ export default function DataStoreForm({
     updateDataStore(updateDict);
   };
 
+  const dataStoreTypeDisplayString = (
+    dataStoreType: DataStoreType | null
+  ): string => {
+    if (dataStoreType) {
+      return `${dataStoreType.name} (${truncateString(
+        dataStoreType.description,
+        75
+      )})`;
+    }
+    return '';
+  };
+
   const formElements = () => {
     const textInputs = [
       <TextInput
@@ -200,28 +218,32 @@ export default function DataStoreForm({
       />
     );
 
-    textInputs.push(
-      <ComboBox
-        onChange={onTypeChanged}
-        id="data-store-type-select"
-        data-qa="data-store-type-selection"
-        items={dataStoreTypes}
-        itemToString={(dataStoreType: DataStoreType) => {
-          if (dataStoreType) {
-            return `${dataStoreType.name} (${truncateString(
-              dataStoreType.description,
-              75
-            )})`;
-          }
-          return null;
-        }}
-        titleText="Type*"
-        invalidText="Type is required."
-        invalid={typeInvalid}
-        placeholder="Choose the data store type"
-        selectedItem={selectedDataStoreType}
-      />
-    );
+    if (mode === 'edit') {
+      textInputs.push(
+        <TextInput
+          id="data-store-type"
+          name="data-store-type"
+          readonly
+          labelText="Type*"
+          value={dataStoreTypeDisplayString(selectedDataStoreType)}
+        />
+      );
+    } else {
+      textInputs.push(
+        <ComboBox
+          onChange={onTypeChanged}
+          id="data-store-type-select"
+          data-qa="data-store-type-selection"
+          items={dataStoreTypes}
+          itemToString={dataStoreTypeDisplayString}
+          titleText="Type*"
+          invalidText="Type is required."
+          invalid={typeInvalid}
+          placeholder="Choose the data store type"
+          selectedItem={selectedDataStoreType}
+        />
+      );
+    }
 
     textInputs.push(
       <TextArea