Перейти к содержимому

Stop Using isLoading Booleans in TypeScript

The Coding Ant

0:00 / 0:00

Stop Using isLoading Booleans in TypeScript

39 просмотров · 8 дн. назад
The Coding Ant
5 подписчиков
39 просмотров · 8 дн. назад
Four booleans and one optional field give you 32 possible states. Your app has 4. The other 28 are bugs TypeScript will happily let you write. In this one I refactor a classic isLoading / isError / data type into a discriminated union, and show how narrowing, exhaustive never checks, and satisfies make impossible states impossible to write. Then the same pattern for Result types, reducers, and order state machines, plus the gotchas that quietly break narrowing. Chapters 0:00 32 states, 4 real ones 1:30 The fix: discriminated unions 2:50 Exhaustiveness with never 4:30 Beyond UI state: Result, reducers, state machines 5:35 Gotchas that break narrowing 6:40 The rule Code shown in the video type RequestState = | { status: "idle" } | { status: "loading" } | { status: "success"; data: User } | { status: "error"; error: Error }; Links to resources: TypeScript Handbook, Narrowing: https://www.typescriptlang.org/docs/h... typescript-eslint switch-exhaustiveness-check: https://typescript-eslint.io/rules/sw... #typescript #webdev #react