hand sketched logo of electrons orbiting a nucleus

TIL: React.FC has displayName

type One = (props: any) => React.ReactNode;
type Two = React.FC<any>;

const one: One = () => <div />;
// @ts-expect-error: displayName does not exist on type One
one.displayName = 'One';

const two: Two = () => <div />;
two.displayName = 'Two';

This difference between ReactNode and the return type of React.FC is related to why you are going along, never writing displayName's, and then suddenly you wrap a component in forwardRef, and you get an error that says you need to add a displayName.

This error is because forwardRef returns a React.FC and React.FC has a displayName property.