PropTypes in chain of arrow functions

user_3193620 0
Viewed 387

I'm trying to improve the quality of my app with PropTypes and I've stuck in this scenario:

const withLayout = (customProps) => (PageComponent) => (props) => {
    const { locale } = props.pageContext;
    const {
        localeKey, hideLangs, headerTitle, headerSubtitle, headerImages,
    } = customProps;
    ....
}

And this probably will not make any sense.

withLayout.propTypes = {
  pageContext: PropTypes.string.isRequired,
};

How can I assign PropTypes to this? Do I have to deconstruct it into three named functions?

react-proptypes reactjs
1 Answers

Maybe this example will be helpful for you.

const withLayout = (customProps) => {
  const innerFunction = ( WrappedComponent ) => {
       const InnerComponent = ( props ) => <WrappedComponent { ...props } { ...customProps } />

       InnerComponent.propTypes = { /* ... */ }

       return InnerComponent
  }

  innerFunction.propTypes = { /* ... */ }

  return innerFunction
} 

withLayout.propTypes = { /* ... */ }
user_61257790
Related