fix(striker-ui): organize types in useFormUtils hook

main
Tsu-ba-me 2 years ago
parent 37972bb557
commit 92f2c3626c
  1. 47
      striker-ui/hooks/useFormUtils.ts
  2. 27
      striker-ui/types/FormUtils.d.ts

@ -1,20 +1,9 @@
import {
Dispatch,
MutableRefObject,
SetStateAction,
useCallback,
useMemo,
useState,
} from 'react';
import { MutableRefObject, useCallback, useMemo, useState } from 'react';
import buildMapToMessageSetter from '../lib/buildMapToMessageSetter';
import buildObjectStateSetterCallback from '../lib/buildObjectStateSetterCallback';
import { MessageGroupForwardedRefContent } from '../components/MessageGroup';
type FormValidity<T> = {
[K in keyof T]?: boolean;
};
const useFormUtils = <
U extends string,
I extends InputIds<U>,
@ -22,37 +11,28 @@ const useFormUtils = <
>(
ids: I,
messageGroupRef: MutableRefObject<MessageGroupForwardedRefContent>,
): {
buildFinishInputTestBatchFunction: (
key: keyof M,
) => (result: boolean) => void;
buildInputFirstRenderFunction: (
key: keyof M,
) => ({ isRequired }: { isRequired: boolean }) => void;
formValidity: FormValidity<M>;
isFormInvalid: boolean;
msgSetters: MapToMessageSetter<M>;
setFormValidity: Dispatch<SetStateAction<FormValidity<M>>>;
} => {
): FormUtils<M> => {
const [formValidity, setFormValidity] = useState<FormValidity<M>>({});
const buildFinishInputTestBatchFunction = useCallback(
(key: keyof M) => (result: boolean) => {
const setValidity = useCallback((key: keyof M, value: boolean) => {
setFormValidity(
buildObjectStateSetterCallback<FormValidity<M>>(key, result),
buildObjectStateSetterCallback<FormValidity<M>>(key, value),
);
}, []);
const buildFinishInputTestBatchFunction = useCallback(
(key: keyof M) => (result: boolean) => {
setValidity(key, result);
},
[],
[setValidity],
);
const buildInputFirstRenderFunction = useCallback(
(key: keyof M) =>
({ isRequired }: { isRequired: boolean }) => {
setFormValidity(
buildObjectStateSetterCallback<FormValidity<M>>(key, !isRequired),
);
({ isValid }: InputFirstRenderFunctionArgs) => {
setValidity(key, isValid);
},
[],
[setValidity],
);
const isFormInvalid = useMemo(
@ -72,6 +52,7 @@ const useFormUtils = <
isFormInvalid,
msgSetters,
setFormValidity,
setValidity,
};
};

@ -0,0 +1,27 @@
type FormValidity<T> = {
[K in keyof T]?: boolean;
};
type InputTestBatchFinishCallbackBuilder<M extends MapToInputTestID> = (
key: keyof M,
) => InputTestBatchFinishCallback;
type InputFirstRenderFunctionArgs = { isValid: boolean };
type InputFirstRenderFunction = (args: InputFirstRenderFunctionArgs) => void;
type InputFirstRenderFunctionBuilder<M extends MapToInputTestID> = (
key: keyof M,
) => InputFirstRenderFunction;
type FormUtils<M extends MapToInputTestID> = {
buildFinishInputTestBatchFunction: InputTestBatchFinishCallbackBuilder<M>;
buildInputFirstRenderFunction: InputFirstRenderFunctionBuilder<M>;
formValidity: FormValidity<M>;
isFormInvalid: boolean;
msgSetters: MapToMessageSetter<M>;
setFormValidity: import('react').Dispatch<
import('react').SetStateAction<FormValidity<M>>
>;
setValidity: (key: keyof M, value: boolean) => void;
};
Loading…
Cancel
Save