diff --git a/.eslintrc.js b/.eslintrc.js
index a05f3aef6f..2c9a567404 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -17,21 +17,42 @@ module.exports = {
     'react-hooks',
   ],
   rules: {
-    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
+    "react/jsx-filename-extension": [
+      1,
+      {
+        "extensions": [
+          ".js",
+          ".jsx"
+        ]
+      }
+    ],
     "no-console": 0,
     "camelcase": 0,
     "arrow-body-style": 0,
-    "jsx-a11y/anchor-is-valid": ["error", {
-      "aspects": ["invalidHref", "preferButton"]
-    }],
+    "jsx-a11y/anchor-is-valid": [
+      "error",
+      {
+        "aspects": [
+          "invalidHref",
+          "preferButton"
+        ]
+      }
+    ],
     "jsx-a11y/click-events-have-key-events": 0,
-    "jsx-a11y/label-has-for": [2, {
-      "components": ["Label"],
-      "required": {
-        "every": ["id"]
-      },
-      "allowChildren": false
-    }],
+    "jsx-a11y/label-has-for": [
+      2,
+      {
+        "components": [
+          "Label"
+        ],
+        "required": {
+          "every": [
+            "id"
+          ]
+        },
+        "allowChildren": false
+      }
+    ],
     "react-hooks/rules-of-hooks": "error",
     "react-hooks/exhaustive-deps": "warn",
     "react/no-array-index-key": 0,
@@ -40,6 +61,11 @@ module.exports = {
     "react/no-did-update-set-state": 0,
     "import/prefer-default-export": 0,
     "no-throw-literal": 0,
-    "react/jsx-max-props-per-line": [1, { "maximum": 1 }]
+    "react/jsx-max-props-per-line": [
+      1,
+      {
+        "maximum": 1
+      }
+    ]
   },
 };
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000000..4718ffd990
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "eslint.enable": true
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index f7e0e21568..cd959f2849 100644
--- a/package.json
+++ b/package.json
@@ -85,7 +85,7 @@
     "babel-loader": "^8.0.6",
     "circular-dependency-plugin": "^5.2.0",
     "css-loader": "^1.0.0",
-    "eslint": "^5.16.0",
+    "eslint": "^6.8.0",
     "eslint-config-airbnb": "^17.1.0",
     "eslint-plugin-import": "^2.17.2",
     "eslint-plugin-jsx-a11y": "^6.2.1",
diff --git a/src/client/components/forms/field-types/Email/index.js b/src/client/components/forms/field-types/Email/index.js
index ffbec5c964..512f9c2c1d 100644
--- a/src/client/components/forms/field-types/Email/index.js
+++ b/src/client/components/forms/field-types/Email/index.js
@@ -27,7 +27,7 @@ const Email = (props) => {
     value,
     showError,
     processing,
-    onFieldChange
+    onFieldChange,
   } = useFieldType({
     name,
     required,
@@ -36,13 +36,25 @@ const Email = (props) => {
     validate,
   });
 
+  const fieldWidth = width ? `${width}%` : undefined;
+
   return (
-    <div className="field-type email" style={{
-      ...style,
-      width: width ? `${width}%` : null
-    }}>
-      <Error showError={showError} message={errorMessage} />
-      <Label htmlFor={name} label={label} required={required} />
+    <div
+      className="field-type email"
+      style={{
+        ...style,
+        width: fieldWidth,
+      }}
+    >
+      <Error
+        showError={showError}
+        message={errorMessage}
+      />
+      <Label
+        htmlFor={name}
+        label={label}
+        required={required}
+      />
       <input
         value={value || ''}
         onChange={onFieldChange}
@@ -50,31 +62,35 @@ const Email = (props) => {
         placeholder={placeholder}
         type="email"
         id={name}
-        name={name} />
+        name={name}
+      />
     </div>
   );
-}
+};
 
 Email.defaultProps = {
+  label: null,
   required: false,
-  processing: false,
   defaultValue: null,
+  valueOverride: null,
+  placeholder: undefined,
   validate: defaultValidate,
   errorMessage: defaultError,
   width: 100,
   style: {},
-}
+};
 
 Email.propTypes = {
   name: PropTypes.string.isRequired,
   required: PropTypes.bool,
+  placeholder: PropTypes.string,
   defaultValue: PropTypes.string,
-  defaultValidate: PropTypes.func,
+  valueOverride: PropTypes.string,
+  validate: PropTypes.func,
   errorMessage: PropTypes.string,
   width: PropTypes.number,
   style: PropTypes.shape({}),
-  processing: PropTypes.bool,
-  label: PropTypes.string.isRequired,
-}
+  label: PropTypes.string,
+};
 
 export default Email;
diff --git a/src/client/components/forms/field-types/Input/index.js b/src/client/components/forms/field-types/Input/index.js
index 7734226e8b..075e423d97 100644
--- a/src/client/components/forms/field-types/Input/index.js
+++ b/src/client/components/forms/field-types/Input/index.js
@@ -42,13 +42,25 @@ const Input = (props) => {
     showError && 'error',
   ].filter(Boolean).join(' ');
 
+  const fieldWidth = width ? `${width}%` : undefined;
+
   return (
-    <div className={classes} style={{
-      ...style,
-      width: width ? `${width}%` : null
-    }}>
-      <Error showError={showError} message={errorMessage} />
-      <Label htmlFor={name} label={label} required={required} />
+    <article
+      className={classes}
+      style={{
+        ...style,
+        width: fieldWidth,
+      }}
+    >
+      <Error
+        showError={showError}
+        message={errorMessage}
+      />
+      <Label
+        htmlFor={name}
+        label={label}
+        required={required}
+      />
       <input
         value={value || ''}
         onChange={onFieldChange}
@@ -56,32 +68,35 @@ const Input = (props) => {
         placeholder={placeholder}
         type="text"
         id={name}
-        name={name} />
-    </div>
+        name={name}
+      />
+    </article>
   );
-}
+};
 
 Input.defaultProps = {
   label: null,
   required: false,
-  processing: false,
   defaultValue: null,
+  valueOverride: null,
+  placeholder: undefined,
   validate: defaultValidate,
   errorMessage: defaultError,
   width: 100,
   style: {},
-}
+};
 
 Input.propTypes = {
   name: PropTypes.string.isRequired,
   required: PropTypes.bool,
+  placeholder: PropTypes.string,
   defaultValue: PropTypes.string,
-  defaultValidate: PropTypes.func,
+  valueOverride: PropTypes.string,
+  validate: PropTypes.func,
   errorMessage: PropTypes.string,
   width: PropTypes.number,
   style: PropTypes.shape({}),
-  processing: PropTypes.bool,
   label: PropTypes.string,
-}
+};
 
 export default Input;
diff --git a/src/client/components/forms/field-types/Select/index.js b/src/client/components/forms/field-types/Select/index.js
index 86e6507491..f5c6fee61c 100644
--- a/src/client/components/forms/field-types/Select/index.js
+++ b/src/client/components/forms/field-types/Select/index.js
@@ -45,19 +45,39 @@ const Select = (props) => {
     showError && 'error',
   ].filter(Boolean).join(' ');
 
+  const fieldWidth = width ? `${width}%` : undefined;
+
   return (
     <div
       className={classes}
       style={{
         ...style,
-        width: width ? `${width}%` : null,
+        width: fieldWidth,
       }}
     >
-      <Error showError={showError} message={errorMessage} />
-      <Label htmlFor={name} label={label} required={required} />
+      <Error
+        showError={showError}
+        message={errorMessage}
+      />
+      <Label
+        htmlFor={name}
+        label={label}
+        required={required}
+      />
       <ReactSelect
         value={options.find(option => option.value === value)}
-        onChange={selected => onFieldChange(hasMany ? selected : selected.value)}
+        onChange={(selected) => {
+          if (hasMany) {
+            if (selected) {
+              onFieldChange(selected.map(selectedOption => selectedOption.value));
+            } else {
+              onFieldChange(null);
+            }
+          }
+          if (selected) {
+            onFieldChange(selected.value);
+          }
+        }}
         disabled={formProcessing ? 'disabled' : undefined}
         components={{ DropdownIndicator: Arrow }}
         className="react-select"
@@ -65,7 +85,7 @@ const Select = (props) => {
         isMulti={hasMany}
         id={name}
         name={name}
-        options={options.map((option, i) => {
+        options={options.map((option) => {
           let optionValue = option;
           let optionLabel = option;
 
@@ -85,39 +105,27 @@ const Select = (props) => {
 };
 
 Select.defaultProps = {
-  className: null,
   style: {},
+  required: false,
   errorMessage: defaultError,
   validate: defaultValidate,
-  value: {},
-  onChange: null,
-  disabled: null,
-  placeholder: null,
-  id: null,
+  valueOverride: null,
   name: 'select',
   defaultValue: null,
   hasMany: false,
+  width: 100,
 };
 
 Select.propTypes = {
-  className: PropTypes.string,
+  required: PropTypes.bool,
   style: PropTypes.shape({}),
   errorMessage: PropTypes.string,
+  valueOverride: PropTypes.string,
   label: PropTypes.string.isRequired,
-  value: PropTypes.oneOfType([
-    PropTypes.shape({
-      value: PropTypes.string,
-      label: PropTypes.string,
-    }),
-    PropTypes.string,
-  ]),
   defaultValue: PropTypes.string,
-  defaultValidate: PropTypes.func,
-  onChange: PropTypes.func,
-  disabled: PropTypes.string,
-  placeholder: PropTypes.string,
-  id: PropTypes.string,
+  validate: PropTypes.func,
   name: PropTypes.string,
+  width: PropTypes.number,
   options: PropTypes.oneOfType([
     PropTypes.arrayOf(
       PropTypes.string,
diff --git a/src/client/components/forms/field-types/shared.scss b/src/client/components/forms/field-types/shared.scss
index 07a649d4e9..b5af45dbae 100644
--- a/src/client/components/forms/field-types/shared.scss
+++ b/src/client/components/forms/field-types/shared.scss
@@ -31,10 +31,6 @@
       font-weight: normal;
     }
 
-    &:hover {
-
-    }
-
     &:focus,
     &:active {
         outline: 0;