Some TS Issues

index.md

Hi! I'm trying to create this HOC-like function in a React Native + TS project. Now, although the CompA goes all good, CompB just doesn't work. It just says Type 'FunctionComponent<ICompBProps>' is not assigname to type 'FunctionComponent<IProps>'.

Any suggestion about how to fix this?

interface IProps {
  //...
}

interface ThemedProps extends IProps {
  Icon: React.ComponentType<ICompProps & any>;
}

const Themed = ({ Comp, ...props }: ThemedProps) => {
  const theme = useTheme();

  return <Comp theme={theme} {...props} />;
};

// ---

const CompA:React.Component<ICompProps> = (props: IProps) => (//...);

const ThemedCompA = (props: IProps) => <Themed Comp={CompA} {...props} />

// ---

interface ICompBProps extends IProps {}

const CompB:React.Component<ICompBProps> = (props: ICompBProps) => (//...);

const ThemedCompB = (props: ICompBProps) => <Themed Comp={CompB} {...props} />

So, for now I did a workaround with the & any...