Add make-api package

packages/frontend/package.json

@@ -11,8 +11,10 @@
 	},
 	"dependencies": {
 		"@effect/schema": "catalog:",
+		"common": "workspace:^",
 		"effect": "catalog:",
 		"fast-check": "catalog:",
+		"make-api": "workspace:^",
 		"preact": "catalog:",
 		"preact-iso": "catalog:"
 	}

packages/frontend/src/routes/Login.tsx

@@ -1,9 +1,9 @@
 import { Schema as S } from "@effect/schema";
-import { LoginRequest, LoginResponse } from "common/api";
+import { Login } from "common/api";
 import { useId, useMemo, useRef } from "preact/hooks";
 import { useStore } from "../store";
 import * as style from "./Login.css";
-import { Effect, Fiber, pipe } from "effect";
+import { Effect, Fiber, Option as O, pipe } from "effect";
 
 export default () => {
 
@@ -13,16 +13,18 @@ export default () => {
 	const setLoginUsername = useStore(state => state.setLoginUsername);
 	const setLoginPassword = useStore(state => state.setLoginPassword);
 
+	const setUser = useStore(state => state.setUser);
+
 	const usernameId = useId();
 	const passwordId = useId();
 
 	const requestFiber = useRef<Fiber.RuntimeFiber<void> | null>(null);
 	const requestEffect = useMemo(() => Effect.gen(function* () {
-		const requestData = LoginRequest.make(LoginRequest.make({ username: loginUsername, password: loginPassword }));
+		const requestData = Login.props.request.schema.make({ username: loginUsername, password: loginPassword });
 
 		const requestJson = yield* pipe(
 			requestData,
-			S.encode(LoginRequest),
+			S.encode(Login.props.request.schema),
 			Effect.map(JSON.stringify),
 			Effect.orDie,
 		);
@@ -40,12 +42,13 @@ export default () => {
 
 		const responseData = yield* pipe(
 			Effect.promise(() => res.json()),
-			Effect.flatMap(S.decodeUnknown(LoginResponse)),
+			Effect.flatMap(S.decodeUnknown(Login.props.response[200].schema)),
 			Effect.orDie,
 		);
 
 		setLoginUsername("");
 		setLoginPassword("");
+		setUser(O.some(responseData));
 
 		const a = document.createElement("a");
 		a.href = "/";

packages/frontend/src/store.ts

@@ -1,23 +1,44 @@
-import { identity } from "effect";
+import { UserId } from "common";
+import { identity, Option as O } from "effect";
 import { useLayoutEffect, useState } from "preact/hooks";
 
 export type Update<T> = T | ((prev: T) => T);
 export type Updater<T> = (action: Update<T>) => void;
 
+export const mapProp = <const K extends string, T>(prop: K, action: T) => <O extends { readonly [_ in K]: T }>(object: O): O => {
+	return Object.freeze({ ...object, [prop]: typeof action === "function" ? action(object[prop]) : action });
+};
+
+export namespace Store {
+	export interface User {
+		readonly username: string;
+		readonly userId: UserId;
+		readonly admin: boolean;
+	}
+}
+
 export interface Store {
 	readonly loginUsername: string;
 	readonly loginPassword: string;
 
+	readonly user: O.Option<Store.User>;
+
 	readonly setLoginUsername: Updater<string>;
 	readonly setLoginPassword: Updater<string>;
+
+	readonly setUser: Updater<O.Option<Store.User>>;
 }
 
 let store: Store = Object.freeze<Store>({
 	loginUsername: "",
 	loginPassword: "",
 
-	setLoginUsername: (action) => set(({ loginUsername }) => ({ loginUsername: typeof action === "function" ? action(loginUsername) : loginUsername })),
-	setLoginPassword: (action) => set(({ loginPassword }) => ({ loginPassword: typeof action === "function" ? action(loginPassword) : loginPassword })),
+	user: O.none(),
+
+	setLoginUsername: (action) => set(mapProp("loginUsername", action)),
+	setLoginPassword: (action) => set(mapProp("loginPassword", action)),
+
+	setUser: (action) => set(mapProp("user", action)),
 });
 
 // --- STORE IMPLEMENTATION ----------------------------------------------------

packages/frontend/tsconfig.json

@@ -2,5 +2,5 @@
 	"extends": "../../tsconfig.base.json",
 	"references": [
 		{ "path": "../common" },
-	]
+	],
 }