From dee3ad7c94b57faa3410a2f4f776bb1644a0c3ad Mon Sep 17 00:00:00 2001
From: Martin <mmckenna@linode.com>
Date: Tue, 19 Mar 2019 08:45:02 -0400
Subject: [PATCH] Cloud Apps - Bug Fixes (#4677)

* bug fixes

* Copy fixes
---
 .../UserDefinedFieldsPanel.tsx                | 91 +++++++++++--------
 .../LinodesCreate/LinodeCreateContainer.tsx   |  2 +
 2 files changed, 55 insertions(+), 38 deletions(-)

diff --git a/src/features/StackScripts/UserDefinedFieldsPanel/UserDefinedFieldsPanel.tsx b/src/features/StackScripts/UserDefinedFieldsPanel/UserDefinedFieldsPanel.tsx
index 9b79a1c2f86..fb2cda5a3ae 100644
--- a/src/features/StackScripts/UserDefinedFieldsPanel/UserDefinedFieldsPanel.tsx
+++ b/src/features/StackScripts/UserDefinedFieldsPanel/UserDefinedFieldsPanel.tsx
@@ -121,12 +121,9 @@ class UserDefinedFieldsPanel extends React.PureComponent<CombinedProps> {
   render() {
     const { userDefinedFields, classes } = this.props;
 
-    /** [true, false, true, false] */
-    const hasOnlyOptionalFields = userDefinedFields!
-      .map(eachUDF => {
-        return Object.keys(eachUDF).some(eachKey => eachKey === 'default');
-      })
-      .every(eachValue => eachValue === true);
+    const [requiredUDFs, optionalUDFs] = seperateUDFsByRequiredStatus(
+      userDefinedFields!
+    );
 
     return (
       <Paper className={classes.root}>
@@ -139,41 +136,36 @@ class UserDefinedFieldsPanel extends React.PureComponent<CombinedProps> {
         </Typography>
 
         {/* Required Fields */}
-        {userDefinedFields!
-          .filter(
-            (field: Linode.StackScript.UserDefinedField) =>
-              field.hasOwnProperty('default') !== true
-          )
-          .map((field: Linode.StackScript.UserDefinedField) => {
-            const error = getError(field, this.props.errors);
-            return this.renderField(field, error);
-          })}
+        {requiredUDFs.map((field: Linode.StackScript.UserDefinedField) => {
+          const error = getError(field, this.props.errors);
+          return this.renderField(field, error);
+        })}
 
         {/* Optional Fields */}
-        <ShowMoreExpansion
-          name="Show Advanced Options"
-          defaultExpanded={hasOnlyOptionalFields}
-        >
-          <Typography variant="body1" className={classes.advDescription}>
-            These fields are additional configuration options and are not
-            required for creation.
-          </Typography>
-          <div
-            className={`${classes.optionalFieldWrapper} optionalFieldWrapper`}
+        {optionalUDFs.length !== 0 && (
+          <ShowMoreExpansion
+            name="Show Advanced Options"
+            /** expand the panel by default if there are no required UDFs */
+            defaultExpanded={requiredUDFs.length === 0}
           >
-            <Grid container alignItems="center">
-              {userDefinedFields!
-                .filter(
-                  (field: Linode.StackScript.UserDefinedField) =>
-                    field.hasOwnProperty('default') === true
-                )
-                .map((field: Linode.StackScript.UserDefinedField) => {
-                  const error = getError(field, this.props.errors);
-                  return this.renderField(field, error);
-                })}
-            </Grid>
-          </div>
-        </ShowMoreExpansion>
+            <Typography variant="body1" className={classes.advDescription}>
+              These fields are additional configuration options and are not
+              required for creation.
+            </Typography>
+            <div
+              className={`${classes.optionalFieldWrapper} optionalFieldWrapper`}
+            >
+              <Grid container alignItems="center">
+                {optionalUDFs.map(
+                  (field: Linode.StackScript.UserDefinedField) => {
+                    const error = getError(field, this.props.errors);
+                    return this.renderField(field, error);
+                  }
+                )}
+              </Grid>
+            </div>
+          </ShowMoreExpansion>
+        )}
       </Paper>
     );
   }
@@ -202,6 +194,29 @@ const isMultiSelect = (udf: Linode.StackScript.UserDefinedField) => {
   return !!udf.manyof; // if we have a manyof prop, it's a checkbox
 };
 
+/**
+ * Used to separate required UDFs from non-required ones
+ *
+ * @return nested array [[...requiredUDFs], [...nonRequiredUDFs]]
+ */
+const seperateUDFsByRequiredStatus = (
+  udfs: Linode.StackScript.UserDefinedField[]
+) => {
+  return udfs.reduce(
+    (accum, eachUDF) => {
+      /**
+       * if the "default" key exists, it's optional
+       */
+      if (eachUDF.hasOwnProperty('default')) {
+        return [[...accum[0]], [...accum[1], eachUDF]];
+      } else {
+        return [[...accum[0], eachUDF], [...accum[1]]];
+      }
+    },
+    [[], []]
+  );
+};
+
 const styled = withStyles(styles);
 
 export default styled(RenderGuard<CombinedProps>(UserDefinedFieldsPanel));
diff --git a/src/features/linodes/LinodesCreate/LinodeCreateContainer.tsx b/src/features/linodes/LinodesCreate/LinodeCreateContainer.tsx
index 6f1a661f1ee..902c89e9ece 100644
--- a/src/features/linodes/LinodesCreate/LinodeCreateContainer.tsx
+++ b/src/features/linodes/LinodesCreate/LinodeCreateContainer.tsx
@@ -101,6 +101,8 @@ const defaultState: State = {
   selectedDiskSize: undefined,
   selectedLinodeID: undefined,
   selectedStackScriptID: undefined,
+  selectedStackScriptLabel: '',
+  selectedStackScriptUsername: '',
   selectedRegionID: undefined,
   selectedTypeID: undefined,
   tags: [],