I have the following HOC:
export default (keys: Array<string>) =>
(WrappedComponent: React.Component<*, *, *>) => (props: Object): React.Element<*> => {
if (hasNotYetLoadedProps(keys, props)) {
return (
<div
style={{
textAlign: 'center',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
height: '100%',
}}
>
<div>Loading</div>
</div>
)
}
return <WrappedComponent {... props} />
}
that either render the original component or a loading indicator. With the actual flow type declaration I get this error:
React element `WrappedComponent`. Expected React component instead of React$Component
in the last line. What would be the correct type of the incoming component?
The type needs to ReactClass<any>
export default (keys: Array<string>) =>
(WrappedComponent: ReactClass<any>) => (props: Object): React.Element<*> => {
if (hasNotYetLoadedProps(keys, props)) {
return (
<div
style={{
textAlign: 'center',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
height: '100%',
}}
>
<div>Loading</div>
</div>
)
}
return <WrappedComponent {... props} />
}