Globals in TypeScript?!
declare global
is a super useful tool for when you want to allow types to cross module boundaries. Here, we create a GlobalReducer
type, where you can add new event types as you create new reducers.
types.ts:
declare global {
interface GlobalReducerEvent {}
}
export type GlobalReducer<TState> = (
state: TState,
event: {
[EventType in keyof GlobalReducerEvent]: {
type: EventType;
} & GlobalReducerEvent[EventType];
}[keyof GlobalReducerEvent]
) => TState;
todosReducer.ts
import { GlobalReducer } from "./types";
declare global {
interface GlobalReducerEvent {
ADD_TODO: {
text: string;
};
}
}
export const todosReducers: GlobalReducer<{ todos: { id: string }[] }> = (
state,
event
) => {
return state;
};
usersReducer.ts
import { GlobalReducer } from "./types";
declare global {
interface GlobalReducerEvent {
LOG_IN: {};
}
}
export const userReducer: GlobalReducer<{ id: string }> = (state, event) => {
return state;
};