How to use discriminated unions.
Impossible states, unrepresentable.

// ─── The discriminated union ─────────────────
interface User { id: string; name: string }

type ApiResult =
| { status: 'idle' }
| { status: 'loading'; startedAt: Date }
| { status: 'success'; data: T }
| { status: 'error'; message: string; retryable: boolean };

// ─── Render function with full narrowing ─────
function render(r: ApiResult): string {
switch (r.status) {
case 'idle':
return 'Ready';
case 'loading':
return Loading since ${r.startedAt.toISOString()}Data: ${JSON.stringify(r.data)}; // ✅ r.data
case 'error':
return Error: ${r.message}`; // ✅ r.message
}
}

// ─── The compiler prevents impossible states ─
// Can't construct loading with data:
// const bad: ApiResult = {
// status: 'loading',
// data: { id: '1', name: 'Alice' }
// // ❌ 'data' not in loading member
// };
//
// Can't read data on loading:
// function f(r: ApiResult) {
// if (r.status === 'loading') return r.data;
// // ❌ Property 'data' does not exist on type '{ status: "loading"; ... }'
// }

// ─── Type guards for reuse ───────────────────
function isSuccess(r: ApiResult): r is { status: 'success'; data: T } {
return r.status === 'success';
}

const result: ApiResult = { status: 'success', data: { id: '1', name: 'Alice' } };

if (isSuccess(result)) {
console.log(result.data.name); // ✅ narrowed to success member
}

console.log(render(result));

// ─── The pattern ─────────────────────────────
type Shape =
| { kind: 'circle'; radius: number }
| { kind: 'square'; side: number }
| { kind: 'triangle'; base: number; height: number };

function area(s: Shape): number {
switch (s.kind) {
case 'circle':
return Math.PI * s.radius ** 2;
case 'square':
return s.side ** 2;
case 'triangle':
return (s.base * s.height) / 2;
default:
// s is never here — all cases handled
const _exhaustive: never = s;
return _exhaustive;
}
}

// ─── Add a new member → compile error ────────
type Shape2 =
| { kind: 'circle'; radius: number }
| { kind: 'square'; side: number }
| { kind: 'triangle'; base: number; height: number }
| { kind: 'rectangle'; width: number; height: number };

function area2(s: Shape2): number {
switch (s.kind) {
case 'circle': return Math.PI * s.radius ** 2;
case 'square': return s.side ** 2;
case 'triangle': return (s.base * s.height) / 2;
// forgot rectangle!
default:
// ❌ Type 'Shape2' is not assignable to type 'never'.
// Type '{ kind: "rectangle"; ... }' is not assignable
const _exhaustive: never = s;
return _exhaustive;
}
}

// ─── The helper version ──────────────────────
function assertNever(x: never): never {
throw new Error(Unexpected value: ${JSON.stringify(x)}`);
}

function area3(s: Shape): number {
switch (s.kind) {
case 'circle': return Math.PI * s.radius ** 2;
case 'square': return s.side ** 2;
case 'triangle': return (s.base * s.height) / 2;
default:
return assertNever(s); // cleaner
}
}

console.log(area({ kind: 'circle', radius: 2 }));
console.log(area({ kind: 'square', side: 3 }));

// ─── State and actions ───────────────────────
interface State {
count: number;
history: number[];
}

type Action =
| { type: 'increment' }
| { type: 'decrement' }
| { type: 'add'; by: number }
| { type: 'reset' }
| { type: 'undo' };

// ─── The reducer ─────────────────────────────
function reducer(state: State, action: Action): State {
switch (action.type) {
case 'increment':
return { count: state.count + 1, history: [...state.history, state.count + 1] };
case 'decrement':
return { count: state.count - 1, history: [...state.history, state.count - 1] };
case 'add':
return { count: state.count + action.by, history: [...state.history, state.count + action.by] };
// ↑ action.by exists only here
case 'reset':
return { count: 0, history: [] };
case 'undo':
const prev = state.history[state.history.length - 2] ?? 0;
return { count: prev, history: state.history.slice(0, -1) };
default:
const _exhaustive: never = action;
return _exhaustive;
}
}

// ─── Dispatch type-safety ────────────────────
function dispatch(action: Action): void {
console.log('dispatch', action);
}

dispatch({ type: 'increment' }); // ✅ no payload
dispatch({ type: 'add', by: 5 }); // ✅ by: number required
dispatch({ type: 'reset' }); // ✅

// ─── Type errors caught at dispatch ──────────
// dispatch({ type: 'add' });
// ❌ Property 'by' is missing
// dispatch({ type: 'reset', by: 5 });
// ❌ Object literal may only specify known properties
// dispatch({ type: 'multiply' });
// ❌ Type '"multiply"' is not assignable to type 'Action["type"]'

// ─── Same shape for Redux ────────────────────
// Redux Toolkit uses exactly this pattern:
//
// const slice = createSlice({
// name: 'counter',
// initialState: { count: 0 } as State,
// reducers: {
// increment: (s) => { s.count++ },
// add: (s, action: PayloadAction) => { s.count += action.payload }
// }
// });
//
// Every action is a discriminated union member —
// action.type narrows to the exact shape.

// ─── useReducer in React ─────────────────────
// The same pattern applies directly:
//
// const [state, dispatch] = useReducer(reducer, { count: 0, history: [] });
// dispatch({ type: 'add', by: 10 });
//
// dispatch is fully typed from the Action union.
// Try dispatching a wrong shape — compile error.

const initial: State = { count: 0, history: [] };
const after1 = reducer(initial, { type: 'increment' });
const after2 = reducer(after1, { type: 'add', by: 10 });
console.log(after2);