Type useClickOutsideField in wizardHooks.ts

Lastly the type the last function in the class while we're at it.
opencast · Mar 18, 2024 · 0c2cf60 · 0c2cf60
1 parent a6a5dfc
commit 0c2cf60
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 9 deletions.
diff --git a/app/src/components/shared/wizard/RenderField.tsx b/app/src/components/shared/wizard/RenderField.tsx
@@ -29,7 +29,7 @@ const RenderField = ({
 	const { t } = useTranslation();
 
 	// Indicator if currently edit mode is activated
-	const [editMode, setEditMode] = useClickOutsideField(childRef, isFirstField);
+	const {editMode, setEditMode} = useClickOutsideField(childRef, isFirstField);
 
 	// Handle key down event and check if pressed key leads to leaving edit mode
 // @ts-expect-error TS(7006): Parameter 'event' implicitly has an 'any' type.

diff --git a/app/src/components/shared/wizard/RenderMultiField.tsx b/app/src/components/shared/wizard/RenderMultiField.tsx
@@ -19,8 +19,7 @@ const RenderMultiField = ({
 	showCheck = false,
 }) => {
 	// Indicator if currently edit mode is activated
-// @ts-expect-error TS(2554): Expected 2 arguments, but got 1.
-	const [editMode, setEditMode] = useClickOutsideField(childRef);
+	const {editMode, setEditMode} = useClickOutsideField(childRef);
 	// Temporary storage for value user currently types in
 	const [inputValue, setInputValue] = useState("");
 

diff --git a/app/src/hooks/wizardHooks.ts b/app/src/hooks/wizardHooks.ts
@@ -97,16 +97,17 @@ export const useSelectionChanges = <T extends RequiredFormProps>(
 	};
 };
 
-// @ts-expect-error TS(7006): Parameter 'childRef' implicitly has an 'any' type.
-export const useClickOutsideField = (childRef, isFirstField) => {
+export const useClickOutsideField = (
+	childRef: React.RefObject<HTMLDivElement>,
+	isFirstField?: boolean,
+) => {
 	// Indicator if currently edit mode is activated
 	const [editMode, setEditMode] = useState(isFirstField);
 
 	useEffect(() => {
 		// Handle click outside the field and leave edit mode
-// @ts-expect-error TS(7006): Parameter 'e' implicitly has an 'any' type.
-		const handleClickOutside = (e) => {
-			if (childRef.current && !childRef.current.contains(e.target)) {
+		const handleClickOutside = (e: MouseEvent) => {
+			if (childRef.current && !childRef.current.contains(e.target as Node)) {
 				setEditMode(false);
 			}
 		};
@@ -125,5 +126,5 @@ export const useClickOutsideField = (childRef, isFirstField) => {
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [editMode]);
 
-	return [editMode, setEditMode];
+	return {editMode, setEditMode};
 };