Svelte Elm like state management using built in Svelte stores

Store.ts

import { writable, Writable, get } from "svelte/store";

type Dispatch<A> = (action: A) => void;

type CmdEff<A> = () => Promise<A | undefined>;
type CmdNone = "CmdNone";

type Cmd<A> = CmdEff<A> | CmdNone;

export const cmdNone: CmdNone = "CmdNone";

export type Update<S, A> = (action: A, state: S) => [S, Cmd<A>];

type Store<S, A> = {
	state: Writable<S>;
	dispatch: Dispatch<A>;
};

export const initStore = <S, A>(
	init: S,
	reducer: Update<S, A>,
	debug?: boolean
): Store<S, A> => {
	const _state = writable(init);

	const dispatch = (action: A) => {
		_state.update((s) => {
			const [state, cmd] = reducer(action, s);
			if (cmd !== "CmdNone") {
				cmd().then((x) => {
					if (x) {
						dispatch(x);
					}
				});
			}
			return state;
		});
		if (debug) {
			console.log(action, get(_state));
		}
	};

	return { state: _state, dispatch };
};

Basic usage example

type Inc = { type: "INC" };
type Dec = { type: "DEC" };
type Res = { type: "RES" };
type HTTP = { type: "HTTP" };
type HTTPErr = { type: "HTTPErr" };
type HTTPOk = { type: "HTTPOk" };

type State = {
	count: number;
};

type Action = Inc | Dec | Res | HTTP | HTTPErr | HTTPOk;

const update: Update<State, Action> = (action: Action, state: State) => {
	switch (action.type) {
		case "DEC":
			return [{ count: state.count - 1 }, cmdNone];
		case "INC":
			return [{ count: state.count + 1 }, cmdNone];
		case "RES":
			return [{ count: 0 }, cmdNone];
		case "HTTP":
			return [
				state,
				async () => {
					const req = await fetch("https://httpbin.org/get");
					if (req.ok) {
						return { type: "HTTPOk" };
					} else {
						return { type: "HTTPErr" };
					}
				},
			];
		case "HTTPOk":
			return [{ count: state.count + 1 }, cmdNone];
		case "HTTPErr":
			return [state, cmdNone];
		default: {
			return [state, cmdNone];
		}
	}
};

const initState: State = {
	count: 0,
};

export const { state, dispatch } = initStore(initState, update, true);```