Merge pull request #1112 from porter-dev/0.9.0-remove-defaults-from-forms

[0.9.0] [Frontend, Forms] Remove defaults

dashboard/src/components/porter-form/field-components/ArrayInput.tsx

@@ -6,13 +6,14 @@ import {
   GetFinalVariablesFunction,
 } from "../types";
 import useFormField from "../hooks/useFormField";
+import { hasSetValue } from "../utils";
 
 const ArrayInput: React.FC<ArrayInputField> = (props) => {
   const { state, variables, setVars } = useFormField<ArrayInputFieldState>(
     props.id,
     {
       initVars: {
-        [props.variable]: props.value && props.value[0] ? props.value[0] : [],
+        [props.variable]: hasSetValue(props) ? props.value[0] : [],
       },
     }
   );
@@ -100,10 +101,10 @@ export const getFinalVariablesForArrayInput: GetFinalVariablesFunction = (
   vars,
   props: ArrayInputField
 ) => {
-  return vars[props.variable]
+  return vars[props.variable] != undefined && vars[props.variable] != null
     ? {}
     : {
-        [props.variable]: props.value ? props.value[0] : [],
+        [props.variable]: hasSetValue(props) ? props.value[0] : [],
       };
 };
 

dashboard/src/components/porter-form/field-components/Checkbox.tsx

@@ -26,7 +26,7 @@ const Checkbox: React.FC<Props> = ({
       validated: !required,
     },
     initVars: {
-      [variable]: value ? value[0] : !!settings?.default,
+      [variable]: value ? value[0] : false,
     },
   });
 
@@ -75,6 +75,6 @@ export const getFinalVariablesForCheckbox: GetFinalVariablesFunction = (
   }
 
   return {
-    [props.variable]: props.value ? props.value[0] : !!props.settings?.default,
+    [props.variable]: props.value ? props.value[0] : false,
   };
 };

dashboard/src/components/porter-form/field-components/Input.tsx

@@ -6,6 +6,7 @@ import {
   InputField,
   StringInputFieldState,
 } from "../types";
+import { hasSetValue } from "../utils";
 
 const clipOffUnit = (unit: string, x: string) => {
   if (typeof x === "string" && unit) {
@@ -16,17 +17,19 @@ const clipOffUnit = (unit: string, x: string) => {
   return x;
 };
 
-const Input: React.FC<InputField> = ({
-  id,
-  variable,
-  label,
-  required,
-  placeholder,
-  info,
-  settings,
-  isReadOnly,
-  value,
-}) => {
+const Input: React.FC<InputField> = (props) => {
+  const {
+    id,
+    variable,
+    label,
+    required,
+    placeholder,
+    info,
+    settings,
+    isReadOnly,
+    value,
+  } = props;
+
   const {
     state,
     variables,
@@ -34,14 +37,12 @@ const Input: React.FC<InputField> = ({
     setValidation,
   } = useFormField<StringInputFieldState>(id, {
     initValidation: {
-      validated: value
-        ? value[0] !== undefined && value[0] !== "" && value[0] != null
-        : settings?.default != undefined,
+      validated: hasSetValue(props),
     },
     initVars: {
-      [variable]: value
+      [variable]: hasSetValue(props)
         ? clipOffUnit(settings?.unit, value[0])
-        : settings?.default,
+        : undefined,
     },
   });
 
@@ -93,10 +94,12 @@ export const getFinalVariablesForStringInput: GetFinalVariablesFunction = (
   props: InputField
 ) => {
   const val =
-    vars[props.variable] ||
-    (props.value
+    vars[props.variable] != undefined && vars[props.variable] != null
+      ? vars[props.variable]
+      : hasSetValue(props)
       ? clipOffUnit(props.settings?.unit, props.value[0])
-      : props.settings?.default);
+      : undefined;
+
   return {
     [props.variable]:
       props.settings?.unit && !props.settings.omitUnitFromValue

dashboard/src/components/porter-form/field-components/KeyValueArray.tsx

@@ -11,6 +11,7 @@ import useFormField from "../hooks/useFormField";
 import Modal from "../../../main/home/modals/Modal";
 import LoadEnvGroupModal from "../../../main/home/modals/LoadEnvGroupModal";
 import EnvEditorModal from "../../../main/home/modals/EnvEditorModal";
+import { hasSetValue } from "../utils";
 
 interface Props extends KeyValueArrayField {
   id: string;
@@ -21,12 +22,11 @@ const KeyValueArray: React.FC<Props> = (props) => {
     props.id,
     {
       initState: {
-        values:
-          props.value && props.value[0]
-            ? (Object.entries(props.value[0])?.map(([k, v]) => {
-                return { key: k, value: v };
-              }) as any[])
-            : [],
+        values: hasSetValue(props)
+          ? (Object.entries(props.value[0])?.map(([k, v]) => {
+              return { key: k, value: v };
+            }) as any[])
+          : [],
         showEnvModal: false,
         showEditorModal: false,
       },
@@ -349,12 +349,9 @@ export const getFinalVariablesForKeyValueArray: GetFinalVariablesFunction = (
   props: KeyValueArrayField,
   state: KeyValueArrayFieldState
 ) => {
-  console.log(vars);
-  console.log(props);
-  console.log(state);
   if (!state) {
     return {
-      [props.variable]: props.value ? props.value[0] : [],
+      [props.variable]: hasSetValue(props) ? props.value[0] : [],
     };
   }
 

dashboard/src/components/porter-form/field-components/Select.tsx

@@ -8,15 +8,14 @@ import Selector from "../../Selector";
 import styled from "styled-components";
 import useFormField from "../hooks/useFormField";
 import { Context } from "../../../shared/Context";
+import { hasSetValue } from "../utils";
 
 const Select: React.FC<SelectField> = (props) => {
   const { currentCluster } = useContext(Context);
   const { variables, setVars } = useFormField<SelectFieldState>(props.id, {
     initVars: {
-      [props.variable]: props.value
+      [props.variable]: hasSetValue(props)
         ? props.value[0]
-        : props.settings.default
-        ? props.settings.default
         : props.settings.type == "provider"
         ? ({
             gke: "gcp",
@@ -72,10 +71,8 @@ export const getFinalVariablesForSelect: GetFinalVariablesFunction = (
   return vars[props.variable]
     ? {}
     : {
-        [props.variable]: props.value
+        [props.variable]: hasSetValue(props)
           ? props.value[0]
-          : props.settings.default
-          ? props.settings.default
           : props.settings.type == "provider"
           ? ({
               gke: "gcp",

dashboard/src/components/porter-form/types.ts

@@ -18,7 +18,7 @@ export interface GenericInputField extends GenericField {
   settings?: any;
 
   // Read in value from Helm for existing revisions
-  value?: any[];
+  value?: [any]|[];
 }
 
 export interface HeadingField extends GenericField {
@@ -62,7 +62,6 @@ export interface CheckboxField extends GenericInputField {
   type: "checkbox";
   label?: string;
   settings?: {
-    default: boolean;
   };
 }
 
@@ -88,11 +87,9 @@ export interface SelectField extends GenericInputField {
     | {
         type: "normal";
         options: { value: string; label: string }[];
-        default?: string;
       }
     | {
         type: "provider";
-        default?: string;
       };
   width: string;
   label?: string;

dashboard/src/components/porter-form/utils.ts

@@ -0,0 +1,6 @@
+import { GenericInputField } from "./types";
+
+
+export const hasSetValue = (field: GenericInputField) => {
+    return field.value && field.value.length != 0 && field.value[0] != null
+}