All files / app/ui/form FormProvider.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
117x
117x
 
 
 
 
 
 
 
 
 
 
 
 
 
117x
 
 
 
 
117x
568x
568x
 
568x
568x
 
568x
 
 
 
 
 
 
 
 
117x
 
import { isFunction, noop } from 'lodash';
import React, { createContext, memo, useMemo, useState, FunctionComponent, ReactNode } from 'react';
 
export interface FormContextType {
    isSubmitted: boolean;
    setSubmitted(isSubmitted: boolean): void;
}
 
type FormContextFunction = (props: FormContextType) => ReactNode;
 
export interface FormProviderProps {
    initialIsSubmitted?: boolean;
    children: ReactNode | FormContextFunction;
}
 
export const FormContext = createContext<FormContextType>({
    isSubmitted: false,
    setSubmitted: noop,
});
 
const FormProvider: FunctionComponent<FormProviderProps> = ({
    children,
    initialIsSubmitted = false,
}) => {
    const [ isSubmitted, setSubmitted ] = useState(initialIsSubmitted);
    const contextValue = useMemo(() => ({ isSubmitted, setSubmitted }), [isSubmitted]);
 
    return (
        <FormContext.Provider value={ contextValue }>
            { isFunction(children) ?
                children({ isSubmitted, setSubmitted }) :
                children }
        </FormContext.Provider>
    );
};
 
export default memo(FormProvider);