René's URL Explorer Experiment

{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"Better typings for `connect`","articleBody":"Hey,\r\nusing the current `connect` in typescript seems to give not as much type safety as possible. I came ob with these types/changes to make it more safe for us, as we had it more than once that we actually broke things without these types.\r\n\r\n```javascript\r\nexport const safeConnect = \u003cT, S, K, I\u003e(\r\n  pickFromState: (keyof K) \u0026 (keyof I) \u0026 string | Array\u003c(keyof K) \u0026 (keyof I) \u0026 string\u003e | StateMapper\u003cT, K, I\u003e,\r\n  actions?: PropsActions\u003cI, K\u003e | Array\u003cPropsActions\u003cI, K\u003e\u003e | SafeActionCreator\u003cK, I\u003e,\r\n): ((Child: ComponentConstructor\u003cT \u0026 I, S\u003e | AnyComponent\u003cT \u0026 I, S\u003e) =\u003e ComponentConstructor\u003cT, S\u003e) =\u003e\r\n  connect\u003cT, S, K, I\u003e(\r\n    pickFromState,\r\n    Array.isArray(actions) ? actions.reduce((prev, current) =\u003e ({ ...prev, ...current }), {}) : actions,\r\n  );\r\n\r\nexport type SafeActionCreator\u003cK, I\u003e = (store: Store\u003cK\u003e) =\u003e PropsActions\u003cI, K\u003e;\r\n\r\ntype PropsActions\u003cI extends Record\u003cstring, any\u003e, K\u003e = {\r\n  [P in keyof Partial\u003cI\u003e]: I[P] extends ((...args: any[]) =\u003e void)\r\n    ? (s: State, ...a: Parameters\u003cI[P]\u003e) =\u003e Promise\u003cPartial\u003cK\u003e\u003e | Partial\u003cK\u003e | void\r\n    : never\r\n};\r\n```\r\n\r\nThis ensures a few things, maybe an example shows that better:\r\n\r\n```javascript\r\nexport interface Store {\r\n  counter: number,\r\n}\r\n\r\nexport const counterAction = {\r\n  setCounter: (_: State, n: number) =\u003e ({ counter: n }),\r\n};\r\n\r\nexport interface ComponentConnectedProps {\r\n  counter: number;\r\n  setCounter: (count: number) =\u003e void\r\n}\r\n\r\n// usage\r\nexport const ConnectedComponent = safeConnect\u003c{}, {}, Store, ComponentConnectedProps\u003e(\r\n  ['counter'], // or 'counter'\r\n  [counterAction], // or counterAction\r\n)(Component);\r\n```\r\n\r\n1. `pickFromState` parameter from `safeConnect`\r\n  * needs to be a key of the `Store` and the `ComponentConnectedProps`\r\n2. `actions` parameter from `safeConnect`\r\n  * key of the action object needs to be in the `ComponentConnectedProps`\r\n  * function parameter (without the `State`) needs to match the one in `ComponentConnectedProps`\r\n  * return type of the action function needs to be `Partial` of the state\r\n\r\nThe one thing it can not ensure, is that **all** of the items from `ComponentConnectedProps` are there.\r\n\r\nIs there interest to get some version of this upstream? ","author":{"url":"https://github.com/yannick-cw","@type":"Person","name":"yannick-cw"},"datePublished":"2019-06-28T11:24:44.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":2},"url":"https://github.com/160/unistore/issues/160"}