Convert Form Components to TypeScript

frontend/src/Helpers/Hooks/useDebouncedCallback.tsx

@@ -0,0 +1,16 @@
+import { debounce, DebouncedFunc, DebounceSettings } from 'lodash';
+import { useCallback } from 'react';
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export default function useDebouncedCallback<T extends (...args: any) => any>(
+  callback: T,
+  delay: number,
+  options?: DebounceSettings
+): DebouncedFunc<T> {
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  return useCallback(debounce(callback, delay, options), [
+    callback,
+    delay,
+    options,
+  ]);
+}

frontend/src/Helpers/Props/inputTypes.ts

@@ -2,7 +2,6 @@ export const AUTO_COMPLETE = 'autoComplete';
 export const CAPTCHA = 'captcha';
 export const CHECK = 'check';
 export const DEVICE = 'device';
-export const KEY_VALUE_LIST = 'keyValueList';
 export const MONITOR_EPISODES_SELECT = 'monitorEpisodesSelect';
 export const MONITOR_NEW_ITEMS_SELECT = 'monitorNewItemsSelect';
 export const FLOAT = 'float';
@@ -32,7 +31,6 @@ export const all = [
   CAPTCHA,
   CHECK,
   DEVICE,
-  KEY_VALUE_LIST,
   MONITOR_EPISODES_SELECT,
   MONITOR_NEW_ITEMS_SELECT,
   FLOAT,
@@ -54,5 +52,36 @@ export const all = [
   TEXT_AREA,
   TEXT_TAG,
   TAG_SELECT,
-  UMASK
+  UMASK,
 ];
+
+export type InputType =
+  | 'autoComplete'
+  | 'captcha'
+  | 'check'
+  | 'device'
+  | 'keyValueList'
+  | 'monitorEpisodesSelect'
+  | 'monitorNewItemsSelect'
+  | 'file'
+  | 'float'
+  | 'number'
+  | 'oauth'
+  | 'password'
+  | 'path'
+  | 'qualityProfileSelect'
+  | 'indexerSelect'
+  | 'indexerFlagsSelect'
+  | 'languageSelect'
+  | 'downloadClientSelect'
+  | 'rootFolderSelect'
+  | 'select'
+  | 'seriesTag'
+  | 'dynamicSelect'
+  | 'seriesTypeSelect'
+  | 'tag'
+  | 'text'
+  | 'textArea'
+  | 'textTag'
+  | 'tagSelect'
+  | 'umask';