Dynalon / reactive-state

Redux-clone build with strict typing and RxJS down to its core. Wrist-friendly, no boilerplate or endless switch statements
MIT License
138 stars 7 forks source link

Improve connected component props typing #37

Closed cmocanu closed 3 years ago

cmocanu commented 3 years ago

I had an issue with an app crashing because of a missing prop, and tracked it down to the Partial<TOriginalProps> in reactive-state. This improves the typing so that the props that are not provided by connectCallback are still mandatory, and doesn't allow props that are being provided by the callback.

With the addition of TConnectedProps, the original component still has props TOriginalProps, what is being passed in the connectCallback has the type TConnectedProps, and the resulting component only requires the props not already provided by the callback, so Omit<TOriginalProps, keyof TConnectedProps> (& TInputProps of course).

I added a test for this case as well, that uses Expect and Equal from type-challenge. I hope that's ok, if not, I can remove it.

Also, on the following line I think I actually I uncovered a "bug" in the tests: const wrapper = mountInsideStoreProvider(<ConnectedTestComponent onClick={() => {}} />);

onClick should be (and now is) mandatory, so I passed an empty callback.

Dynalon commented 3 years ago

Thanks for your contribution, didn't know about type-challenges and will give it a try! I like the way you tested the typing in the unit tests, if you feel like contributing more, we could use more of those typing assertions in the tests!

Dynalon commented 3 years ago

Sorry had to undo this MR; locally I got into some error when executing "yarn test" on a fresh checkout :/