All files / app/common/form connectFormik.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
112x
112x
112x
 
 
 
112x
 
 
 
 
 
435x
869x
462x
 
 
 
 
435x
 
435x
 
435x
 
 
import { connect } from 'formik';
import React, { memo, ComponentType, FunctionComponent } from 'react';
import shallowEqual from 'shallowequal';
 
import ConnectFormikProps from './ConnectFormikProps';
 
export default function connectFormik<
    TProps extends ConnectFormikProps<TValues>,
    TValues = any
>(
    OriginalComponent: ComponentType<TProps>
): ComponentType<Omit<TProps, keyof ConnectFormikProps<TValues>>> {
    const InnerComponent: FunctionComponent<TProps> = memo(
        props => <OriginalComponent { ...props } />,
        ({ formik: prevFormik, ...prevProps }, { formik: nextFormik, ...nextProps }) => (
            shallowEqual(prevFormik, nextFormik) && shallowEqual(prevProps, nextProps)
        )
    );
 
    const DecoratedComponent = connect<TProps, TValues>(InnerComponent) as ComponentType<Omit<TProps, keyof ConnectFormikProps<TValues>>>;
 
    DecoratedComponent.displayName = `ConnectFormik(${OriginalComponent.displayName || OriginalComponent.name})`;
 
    return DecoratedComponent;
}