Skip to content

Instantly share code, notes, and snippets.

@sagarpanda
Last active February 8, 2020 18:06
Show Gist options
  • Select an option

  • Save sagarpanda/327b3f77fd318109b4856e15e4cb3a18 to your computer and use it in GitHub Desktop.

Select an option

Save sagarpanda/327b3f77fd318109b4856e15e4cb3a18 to your computer and use it in GitHub Desktop.
react final form HOC
import React from 'react';
import { Field } from 'react-final-form';
const withFinal = Component => {
const { finalProps: fnlProps } = Component;
// eslint-disable-next-line react/prop-types
const fieldRenderer = ({ input, ...rest }) => {
let extented = {};
if (fnlProps) {
const keys = Object.keys(fnlProps);
const finalProps = keys.reduce((prev, curr) => {
const extPrev = { ...prev };
const item = fnlProps[curr];
extPrev[curr] =
item && typeof item === 'function' ? item(input, rest) : item;
return extPrev;
}, {});
extented = { ...extented, ...finalProps };
}
return <Component {...input} {...rest} {...extented} />;
};
// eslint-disable-next-line react/prop-types
const finalField = ({ component, ...extra }) => (
<Field {...extra} render={fieldRenderer} />
);
return finalField;
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment