Fix input event handler types

shoonia · Dec 9, 2023 · b6050ea · b6050ea
1 parent d3ebaee
commit b6050ea
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 14 deletions.
diff --git a/src/components/Jobs/FunctionInfo.tsx b/src/components/Jobs/FunctionInfo.tsx
@@ -1,12 +1,14 @@
+import type { JSX } from 'preact';
+
 import s from './styles.css';
 import { KEYS } from '../../constants';
 import { Label } from './Label';
 import { useFormScope } from '../../hooks/formScope';
 import { type TValidator, isValidFunctionLocation, isValidFunctionName } from '../../util/validator';
 
-const validatorListener = (validator: TValidator): EventListener => {
+const validatorListener = (validator: TValidator): JSX.InputEventHandler<HTMLInputElement> => {
   return (event) => {
-    const el = event.target as HTMLInputElement;
+    const el = event.currentTarget;
     const value = el.value.trim();
 
     if (el.value !== value) {

diff --git a/src/components/TextBox/index.tsx b/src/components/TextBox/index.tsx
@@ -1,7 +1,9 @@
+import type { JSX } from 'preact';
+
 import s from './styles.css';
 
 interface Props {
-  onInput: EventListener
+  onInput: JSX.InputEventHandler<HTMLTextAreaElement>;
   value?: string;
 }
 

diff --git a/src/components/UploadModal/UploadModal.tsx b/src/components/UploadModal/UploadModal.tsx
@@ -1,3 +1,4 @@
+import type { JSX } from 'preact';
 import { useRef } from 'preact/hooks';
 
 import s from './styles.css';
@@ -43,10 +44,8 @@ export const UploadModal: FC = () => {
     location.hash = ROUTER.VALIDATOR;
   };
 
-  const onInput: EventListener = (event) => {
-    const el = event.target as HTMLTextAreaElement;
-
-    ref.current = el.value;
+  const onInput: JSX.InputEventHandler<HTMLTextAreaElement> = (event) => {
+    ref.current = event.currentTarget.value;
   };
 
   const onSubmit: EventListener = (event) => {

diff --git a/src/components/Validator/index.tsx b/src/components/Validator/index.tsx
@@ -1,3 +1,5 @@
+import type { JSX } from 'preact';
+
 import s from './styles.css';
 import { useStoreon } from '../../store';
 import { preventDefault } from '../../util/component';
@@ -9,15 +11,11 @@ import { TextBox } from '../TextBox';
 export const Validator: FC = () => {
   const { validatorValue, dispatch } = useStoreon('validatorValue');
 
-  const onInput: EventListener = (event) => {
-    const el = event.target as HTMLTextAreaElement;
-
-    dispatch('validator/input', el.value);
-  };
+  const onInput: JSX.InputEventHandler<HTMLTextAreaElement> = (event) =>
+    dispatch('validator/input', event.currentTarget.value);
 
-  const onLoad = (value: string): void => {
+  const onLoad = (value: string): void =>
     dispatch('validator/input', value);
-  };
 
   return (
     <section className={s.page}>