Improving HOC section in ADVANCED cheatsheet, including forwardRef

[OliverJAsh]

https://gist.github.com/OliverJAsh/d2f462b03b3e6c24f5588ca7915d010e

This is quite a bit more difficult than standard forwardRef, since the component and component props are generic.

[ferdaber]

Does this work using the standard InstanceType<typeof ComposedComponent>? Instead of declaring ComposedComponentInstance = Component<ComposedComponentProps>?

[OliverJAsh]

Yes, thanks! Just updated: https://gist.github.com/OliverJAsh/d2f462b03b3e6c24f5588ca7915d010e#file-foo-tsx-L7

[swyxio]

really appreciate the input, @OliverJAsh

the HOC section is a bit messy right now and i think it could be better.

by presenting so much functionality upfront we risk accidentally giving the impression that HOCs are always this complicated in typescript.

i think the better approach is to progressively build up from a "basic" HOC, then show how to deal with prop conflicts with Omit/Optionalize, then add displayName, then add ref forwarding and other stuff.

We should also try to show usage example at each step so it helps users quickly scan for the kind of HOC they need to make, and then expand to see the recommended typing strategy.

a lot of work, i know. dont have time now but i'll get to it if someone doesnt beat me to it

[ferdaber]

We may need a section just on how to write HOCs, to not completely blow up the advanced section?

[swyxio]

i'm open to this. either way we gotta write some stuff haha

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions!