Bugfix/t UI 323 default item create archive modal (#435)

* fix Advanced Settings and Can Exec settings. Now canExec renders and executes as intended. * fix value attributes * run prettier
tapis-project · Jan 9, 2025 · 6886506 · 6886506
1 parent 5d89080
commit 6886506
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 56 deletions.
diff --git a/src/app/Systems/_components/SystemToolbar/CreateSystemModal/CreateSystemModal.tsx b/src/app/Systems/_components/SystemToolbar/CreateSystemModal/CreateSystemModal.tsx
@@ -39,12 +39,6 @@ const CreateSystemModal: React.FC<ToolbarModalProps> = ({ toggle }) => {
     reset();
   }, [reset]);
 
-  //used for the advanced checkbox
-  const [simplified, setSimplified] = useState(false);
-  const onChange = useCallback(() => {
-    setSimplified(!simplified);
-  }, [setSimplified, simplified]);
-
   // used for the canExec checkbox
   const [exec, setExec] = useState(true);
 
@@ -367,7 +361,7 @@ const CreateSystemModal: React.FC<ToolbarModalProps> = ({ toggle }) => {
                     setExec(newValue); // Update local state `exec`
                   }}
                 />
-                <AdvancedSettings simplified={simplified} canExec={exec} />
+                <AdvancedSettings canExec={exec} />
               </Form>
             )}
           </Formik>

diff --git a/src/app/Systems/_components/SystemToolbar/CreateSystemModal/Settings/AdvancedSettings.tsx b/src/app/Systems/_components/SystemToolbar/CreateSystemModal/Settings/AdvancedSettings.tsx
@@ -16,14 +16,10 @@ import JobSettings from './Job/JobSettings';
 const runtimeTypes = Object.values(RuntimeTypeEnum);
 
 type AdvancedSettingsProp = {
-  simplified: boolean;
   canExec: boolean;
 };
 
-const AdvancedSettings: React.FC<AdvancedSettingsProp> = ({
-  simplified,
-  canExec,
-}) => {
+const AdvancedSettings: React.FC<AdvancedSettingsProp> = ({ canExec }) => {
   //used when trying to read the current value of a parameter
   const { values } = useFormikContext();
 
@@ -38,49 +34,47 @@ const AdvancedSettings: React.FC<AdvancedSettingsProp> = ({
   //reading the runtimeType at its current state
   const runtimeType = (values as Partial<Systems.ReqPostSystem>).jobRuntimes;
 
-  if (simplified) {
-    if (canExec) {
-      return (
-        <>
-          <FormikSelect
-            name="jobRuntimes"
-            description="The job runtime type for the system"
-            label="Runtime Type"
-            required={false}
-            data-testid="jobRuntimes"
-          >
-            <option disabled value="">
-              Select a job runtime
-            </option>
-            {runtimeTypes.map((values) => {
-              return <option>{values}</option>;
-            })}
-          </FormikSelect>
+  if (canExec) {
+    return (
+      <div>
+        <FormikSelect
+          name="jobRuntimes"
+          description="The job runtime type for the system"
+          label="Runtime Type"
+          required={false}
+          data-testid="jobRuntimes"
+        >
+          <option disabled value="">
+            Select a job runtime
+          </option>
+          {runtimeTypes.map((values) => {
+            return <option>{values}</option>;
+          })}
+        </FormikSelect>
+        <FormikInput
+          name="version"
+          label={`${runtimeType} Version`}
+          required={false}
+          description={`Version of ${runtimeType}`}
+          aria-label="Input"
+          disabled={true}
+        />
+        {isS3 ? (
           <FormikInput
-            name="version"
-            label={`${runtimeType} Version`}
+            name="bucketName"
+            label="Bucket Name"
             required={false}
-            description={`Version of ${runtimeType}`}
+            description={`Bucket name`}
             aria-label="Input"
-            disabled={true}
           />
-          {isS3 ? (
-            <FormikInput
-              name="bucketName"
-              label="Bucket Name"
-              required={false}
-              description={`Bucket name`}
-              aria-label="Input"
-            />
-          ) : null}
-          <JobSettings />
-          <BatchSettings />
-          <ProxySettings />
-          <CmdSettings />
-          <TagsSettings />
-        </>
-      );
-    }
+        ) : null}
+        <JobSettings />
+        <BatchSettings />
+        <ProxySettings />
+        <CmdSettings />
+        <TagsSettings />
+      </div>
+    );
   } else {
     return null;
   }

diff --git a/src/app/Workflows/_components/Toolbar/CreateArchiveModal/CreateArchiveModal.tsx b/src/app/Workflows/_components/Toolbar/CreateArchiveModal/CreateArchiveModal.tsx
@@ -156,13 +156,12 @@ const TapisSystemArchiveForm: React.FC<FormProps> = ({ onSubmit }) => {
             required={true}
             description={'A Tapis system'}
           >
-            <option disabled selected>
+            <option value="" disabled selected>
               -- select a system --
             </option>
-            ;
-            {Object.values(systems).map((system) => {
-              return <option value={system.id}>{system.id}</option>;
-            })}
+            {Object.values(systems).map((system) => (
+              <option value={system.id}>{system.id}</option>
+            ))}
           </FormikSelect>
           <FormikInput
             name="archive_dir"