Convert Form Components to TypeScript

Co-authored-by: Mark McDowall <mark@mcdowall.ca>

Remove defaultProps from TypeScript components

(cherry picked from commit a90c13e86f798841cb6db038bb6b6d1408a00585)

Fix multi-select checkboxes not appearing

(cherry picked from commit e199710c15fbfa643a9f71c7a20f70b1722d0df6)

frontend/src/Components/Form/Select/MonitorMoviesSelectInput.tsx

@@ -0,0 +1,50 @@
+import React from 'react';
+import monitorOptions from 'Utilities/Movie/monitorOptions';
+import translate from 'Utilities/String/translate';
+import EnhancedSelectInput, {
+  EnhancedSelectInputProps,
+  EnhancedSelectInputValue,
+} from './EnhancedSelectInput';
+
+interface MonitorMoviesSelectInputProps
+  extends Omit<
+    EnhancedSelectInputProps<EnhancedSelectInputValue<string>, string>,
+    'values'
+  > {
+  includeNoChange?: boolean;
+  includeMixed?: boolean;
+}
+
+function MonitorMoviesSelectInput(props: MonitorMoviesSelectInputProps) {
+  const {
+    includeNoChange = false,
+    includeMixed = false,
+    ...otherProps
+  } = props;
+
+  const values: EnhancedSelectInputValue<string>[] = [...monitorOptions];
+
+  if (includeNoChange) {
+    values.unshift({
+      key: 'noChange',
+      get value() {
+        return translate('NoChange');
+      },
+      isDisabled: true,
+    });
+  }
+
+  if (includeMixed) {
+    values.unshift({
+      key: 'mixed',
+      get value() {
+        return `(${translate('Mixed')})`;
+      },
+      isDisabled: true,
+    });
+  }
+
+  return <EnhancedSelectInput {...otherProps} values={values} />;
+}
+
+export default MonitorMoviesSelectInput;