3 ms·

Wow. More impressive work by the Typescript team! AFAICT this will have the most impact on folks using Typescript with Redux stores and similar dispatchers.I k

Wow. More impressive work by the Typescript team! AFAICT this will have the most impact on folks using Typescript with Redux stores and similar dispatchers.I know I would have liked having this feature back when I was doing that work.

NaughtyShiba 5y ago
Definitely a help. It should make it easier to use with payloads in postMessage too.
tshaddox 5y ago
I believe this will also obviate a common recommendation to not destructure when using React Query: https://tkdodo.eu/blog/react-query-and-type-script#type-narrowing https://tkdodo.eu/blog/react-query-and-type-script#type-narr...
- dragosmocrii 5y ago
  Thanks for sharing this. I literally ran into the same issue yesterday, and was wondering why TS can't understand that I am discriminating on the isSucces property.
- tkdodo 5y ago
  I’ll definitely update that article once the new TS version is released :)
the_duke 5y ago
Note that this already worked fine by just operating on the field. Like `if (action.kind === 'x')` / `switch (action.kind)`. This "only" extends support to destructured discriminators. Definitely nice to have, but of limited impact.
acemarke 5y ago
FWIW, our standard recommended Redux usage patterns for the last couple years have specifically _not_ needed switch statements to determine how to handle an action, because our official Redux Toolkit package has a `createSlice` API that lets you define case reducers as simple functions in an object. `createSlice` then generates all the action types internally, generates corresponding action creator functions, and handles calling the right case reducer when that action is dispatched. Additionally, RTK has been designed to work great with TypeScript. Typically all you need to declare is the type of the state for that slice, and the payload for each reducer's action, and everything else is inferred. See our Redux docs tutorials for details: https://redux.js.org/tutorials/essentials/part-2-app-structure#creating-slice-reducers-and-actions https://redux.js.org/tutorials/essentials/part-2-app-structu... https://redux.js.org/tutorials/fundamentals/part-8-modern-redux#writing-slices https://redux.js.org/tutorials/fundamentals/part-8-modern-re... https://redux.js.org/tutorials/typescript-quick-start https://redux.js.org/tutorials/typescript-quick-start

NaughtyShiba 5y ago

Definitely a help. It should make it easier to use with payloads in postMessage too.

tshaddox 5y ago

I believe this will also obviate a common recommendation to not destructure when using React Query: https://tkdodo.eu/blog/react-query-and-type-script#type-narrowing https://tkdodo.eu/blog/react-query-and-type-script#type-narr...

dragosmocrii 5y ago
Thanks for sharing this. I literally ran into the same issue yesterday, and was wondering why TS can't understand that I am discriminating on the isSucces property.
tkdodo 5y ago
I’ll definitely update that article once the new TS version is released :)

the_duke 5y ago

Note that this already worked fine by just operating on the field. Like `if (action.kind === 'x')` / `switch (action.kind)`. This "only" extends support to destructured discriminators. Definitely nice to have, but of limited impact.

acemarke 5y ago

FWIW, our standard recommended Redux usage patterns for the last couple years have specifically _not_ needed switch statements to determine how to handle an action, because our official Redux Toolkit package has a `createSlice` API that lets you define case reducers as simple functions in an object. `createSlice` then generates all the action types internally, generates corresponding action creator functions, and handles calling the right case reducer when that action is dispatched. Additionally, RTK has been designed to work great with TypeScript. Typically all you need to declare is the type of the state for that slice, and the payload for each reducer's action, and everything else is inferred. See our Redux docs tutorials for details: https://redux.js.org/tutorials/essentials/part-2-app-structure#creating-slice-reducers-and-actions https://redux.js.org/tutorials/essentials/part-2-app-structu... https://redux.js.org/tutorials/fundamentals/part-8-modern-redux#writing-slices https://redux.js.org/tutorials/fundamentals/part-8-modern-re... https://redux.js.org/tutorials/typescript-quick-start https://redux.js.org/tutorials/typescript-quick-start