rename things, organize

dashboard/src/components/form-refactor/PorterFormContextProvider.tsx

@@ -52,10 +52,7 @@ export const PorterFormContextProvider: React.FC<Props> = (props) => {
                 state: action.initValue,
                 validation: {
                   ...{
-                    error: false,
-                    loading: false,
                     validated: false,
-                    touched: false,
                   },
                   ...action.initValidation,
                 },

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

@@ -14,7 +14,7 @@ const Checkbox: React.FC<Props> = ({
   variable,
   isReadOnly,
 }) => {
-  const { state, variables, mutateVars } = useFormField<CheckboxFieldState>(
+  const { state, variables, setVars } = useFormField<CheckboxFieldState>(
     id,
     {
       initValue: {},
@@ -34,7 +34,7 @@ const Checkbox: React.FC<Props> = ({
       isRequired={required}
       checked={variables[variable]}
       toggle={() => {
-        mutateVars((vars) => {
+        setVars((vars) => {
           return {
             ...vars,
             [variable]: !vars[variable],

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

@@ -25,10 +25,9 @@ const Input: React.FC<Props> = ({
   const {
     state,
     variables,
-    mutateVars,
-    updateValidation,
+    setVars,
+    setValidation,
   } = useFormField<StringInputFieldState>(id, {
-    initValue: {},
     initValidation: {
       validated: settings?.default != undefined,
     },
@@ -37,7 +36,6 @@ const Input: React.FC<Props> = ({
     },
   });
 
-  // TODO: needs a loading wrapper
   if (state == undefined) {
     return <></>;
   }
@@ -56,13 +54,13 @@ const Input: React.FC<Props> = ({
       value={curValue}
       unit={settings?.unit}
       setValue={(x: string | number) => {
-        mutateVars((vars) => {
+        setVars((vars) => {
           return {
             ...vars,
             [variable]: x,
           };
         });
-        updateValidation((prev) => {
+        setValidation((prev) => {
           return {
             ...prev,
             validated:

dashboard/src/components/form-refactor/hooks/useFormField.tsx

@@ -9,19 +9,19 @@ import {
 interface FormFieldData<T> {
   state: T;
   variables: PorterFormVariableList;
-  updateState: (updateFunc: (prev: T) => T) => void;
-  mutateVars: (
-    mutateFunc: (vars: PorterFormVariableList) => PorterFormVariableList
+  setState: (setFunc: (prev: T) => T) => void;
+  setVars: (
+    setFunc: (vars: PorterFormVariableList) => PorterFormVariableList
   ) => void;
-  updateValidation: (
-    updateFunc: (
+  setValidation: (
+    setFunc: (
       state: PorterFormFieldValidationState
     ) => PorterFormFieldValidationState
   ) => void;
 }
 
 interface Options<T> {
-  initValue: T;
+  initValue?: T;
   initValidation?: Partial<PorterFormFieldValidationState>;
   initVars?: PorterFormVariableList;
 }
@@ -36,13 +36,15 @@ const useFormField = <T extends PorterFormFieldFieldState>(
     dispatchAction({
       type: "init-field",
       id: fieldId,
-      initValue,
-      initValidation,
-      initVars,
+      initValue: initValue || {},
+      initValidation: initValidation || {
+        validated: false,
+      },
+      initVars: initVars || {},
     });
   }, []);
 
-  const updateState = (updateFunc: (prev: T) => T) => {
+  const setState = (updateFunc: (prev: T) => T) => {
     dispatchAction({
       type: "update-field",
       id: fieldId,
@@ -50,7 +52,7 @@ const useFormField = <T extends PorterFormFieldFieldState>(
     });
   };
 
-  const mutateVars = (
+  const setVars = (
     mutateFunc: (vars: PorterFormVariableList) => PorterFormVariableList
   ) => {
     dispatchAction({
@@ -59,7 +61,7 @@ const useFormField = <T extends PorterFormFieldFieldState>(
     });
   };
 
-  const updateValidation = (
+  const setValidation = (
     updateFunc: (
       state: PorterFormFieldValidationState
     ) => PorterFormFieldValidationState
@@ -74,9 +76,9 @@ const useFormField = <T extends PorterFormFieldFieldState>(
   return {
     state: formState.components[fieldId]?.state as T,
     variables: formState.variables,
-    updateState,
-    mutateVars,
-    updateValidation,
+    setState,
+    setVars,
+    setValidation,
   };
 };
 

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

@@ -94,10 +94,7 @@ export type PorterFormFieldFieldState = StringInputFieldState|CheckboxFieldState
 // reducer interfaces
 
 export interface PorterFormFieldValidationState {
-  loading: boolean;
-  error: boolean;
   validated: boolean;
-  touched: boolean;
 }
 
 export interface PorterFormVariableList {