@trypattern/sdk 0.0.0-stage → 0.1.0

package/dist/app.js

@@ -0,0 +1,224 @@
+import { z } from 'zod';
+import { viewerOf } from "./access.js";
+import { SessionStore } from "./auth/sessionStore.js";
+import { ActionsStore } from "./actions.js";
+import { Account } from "./builtins/Account.js";
+import { BUILT_IN_GROUPS, builtInActions } from "./builtins/actions.js";
+import { Palette } from "./builtins/Palette.js";
+import { SignIn } from "./builtins/SignIn.js";
+import { Toasts } from "./builtins/Toasts.js";
+import { PageStore } from "./page.js";
+import { assertNotBuilding, snapshotsOf } from "./store.js";
+import { ModelBase, command, createModels, modelSnapshotsOf, parseMessage, sendMessage } from "./model.js";
+import { isRoutedPath, pageIds, registerRoutes } from "./routes.js";
+import { PublicTableStore, TableStore, publicStoreName } from "./tables.js";
+function dataStores(tables, api, cache, viewer) {
+    const stores = { tables: {}, publicViews: {} };
+    for (const [key, table] of Object.entries(tables)) {
+        const found = Reflect.get(api, key);
+        const tableApi = found;
+        const publicView = table.public.length > 0
+            ? new PublicTableStore(table, { api: tableApi, cache })
+            : undefined;
+        if (publicView !== undefined) {
+            stores.publicViews[publicStoreName(key)] = publicView;
+        }
+        if (table.access.read !== 'server') {
+            stores.tables[key] = new TableStore(table, {
+                api: tableApi,
+                cache,
+                viewer,
+                ...(publicView === undefined ? {} : { publicView })
+            });
+        }
+    }
+    return stores;
+}
+function clashOf(groups) {
+    const seen = new Set();
+    for (const name of groups.flat()) {
+        if (seen.has(name))
+            return name;
+        seen.add(name);
+    }
+    return undefined;
+}
+const builtInModels = { account: Account, palette: Palette, signIn: SignIn };
+const appPathInput = z.custom((value) => typeof value === 'string' && isRoutedPath(value), { error: 'Not a page in src/routes.tsx' });
+export function defineApp(definition) {
+    const pages = new Set(pageIds(definition.routes));
+    registerRoutes(definition.routes);
+    if (Object.hasOwn(definition.models, 'app')) {
+        throw new Error('A model can\'t be called "app": app.navigate is the built-in command that changes the page');
+    }
+    for (const name of Object.keys(builtInModels)) {
+        if (Object.hasOwn(definition.models, name)) {
+            throw new Error(`${name} is a built-in model of @trypattern/sdk: its state, answers and commands come from Pattern. Name yours for what it holds.`);
+        }
+    }
+    return class App {
+        static definition = definition;
+        name = definition.name;
+        router;
+        models;
+        stores;
+        #commandGroups;
+        #page = new PageStore();
+        #cache;
+        #gate;
+        #session;
+        #data;
+        #navigations = new Set();
+        #failures = [];
+        #path;
+        #user;
+        constructor(router, { api, cache, gate }) {
+            this.router = router;
+            this.#cache = cache;
+            this.#gate = gate;
+            const session = new SessionStore({ api: api.session });
+            const data = dataStores(definition.tables, api.tables, cache, () => viewerOf(session.state.user));
+            const custom = Object.fromEntries(Object.entries(definition.stores ?? {}).map(([key, Store]) => [
+                key,
+                new Store(cache.persisted(`stores.${key}`))
+            ]));
+            const toasts = new Toasts(cache.persisted('stores.toasts'));
+            const clash = clashOf([
+                ['session', 'actions', 'toasts', 'page'],
+                Object.keys(data.tables),
+                Object.keys(data.publicViews),
+                Object.keys(custom)
+            ]);
+            if (clash !== undefined) {
+                throw new Error(`Two stores are called "${clash}". The built-in session, actions, toasts and page stores, each table, each table's public view and each store in src/stores/index.ts need their own name.`);
+            }
+            const actions = new ActionsStore(this.#page, [...(definition.actions ?? []), ...builtInActions], [
+                ...(definition.actionGroups ?? []),
+                ...BUILT_IN_GROUPS.filter((group) => !(definition.actionGroups ?? []).includes(group))
+            ], (message) => this.#runAction(message));
+            this.stores = {
+                session,
+                actions,
+                toasts,
+                page: this.#page,
+                ...data.tables,
+                ...data.publicViews,
+                ...custom
+            };
+            this.#session = session;
+            this.#data = data;
+            const services = {
+                navigate: (to) => {
+                    assertNotBuilding('navigate');
+                    return this.#navigate(to);
+                }
+            };
+            this.models = createModels({ ...builtInModels, ...definition.models }, this.stores, services, (model) => cache.persisted(model));
+            this.#commandGroups = {
+                ...this.models,
+                app: {
+                    navigate: command({ input: { to: appPathInput } }, ({ to }) => this.#navigate(to)),
+                    pressKey: command({ input: { key: z.string() } }, ({ key }) => this.pressKey(key))
+                }
+            };
+            this.#path = router.state.location.pathname;
+            this.#page.moved(this.#currentPage(), this.#currentParams());
+            actions.watch(this.models);
+            this.#user = session.state.user?.id ?? null;
+            router.subscribe(() => this.#routeChanged());
+            session.subscribe(() => this.#sessionChanged());
+            void session.confirm();
+            for (const view of Object.values(data.publicViews))
+                void view.load();
+            this.#loadReadableTables();
+        }
+        send(command) {
+            return this.#send(command);
+        }
+        pressKey(key) {
+            return this.stores.actions.pressKey(key);
+        }
+        parse(raw) {
+            return parseMessage(raw, this.#commandGroups);
+        }
+        getSnapshot() {
+            return {
+                page: this.#currentPage(),
+                path: this.router.state.location.pathname,
+                models: modelSnapshotsOf(this.models),
+                stores: snapshotsOf(this.stores)
+            };
+        }
+        async whenIdle() {
+            do {
+                await Promise.allSettled(this.#navigations);
+                await this.#gate.whenIdle();
+            } while (this.#navigations.size > 0);
+            const failure = this.#failures.shift();
+            if (failure !== undefined)
+                throw failure;
+        }
+        #runAction(message) {
+            const parsed = this.parse(message);
+            if ('error' in parsed) {
+                return Promise.reject(new Error(String(parsed.error)));
+            }
+            return this.#send(parsed);
+        }
+        #send(command) {
+            return sendMessage(this.#commandGroups, command).catch((failure) => {
+                this.#failures.push(failure);
+            });
+        }
+        #currentPage() {
+            const id = this.router.state.matches.at(-1)?.route.id;
+            return id !== undefined && pages.has(id) ? id : null;
+        }
+        #currentParams() {
+            return this.router.state.matches.at(-1)?.params ?? {};
+        }
+        #navigate(to) {
+            const navigation = this.router.navigate(to).finally(() => {
+                this.#navigations.delete(navigation);
+            });
+            this.#navigations.add(navigation);
+            return navigation;
+        }
+        #routeChanged() {
+            const path = this.router.state.location.pathname;
+            if (path === this.#path)
+                return;
+            this.#path = path;
+            this.#page.moved(this.#currentPage(), this.#currentParams());
+            this.#openCurrentModel();
+        }
+        #sessionChanged() {
+            const user = this.#session.state.user?.id ?? null;
+            if (user === this.#user)
+                return;
+            this.#user = user;
+            this.#cache.clear();
+            for (const store of Object.values(this.#data.tables))
+                store.forget();
+            this.#loadReadableTables();
+        }
+        #loadReadableTables() {
+            for (const store of Object.values(this.#data.tables))
+                void store.load();
+            this.#openCurrentModel();
+        }
+        #openCurrentModel() {
+            const match = this.router.state.matches.at(-1);
+            if (match === undefined)
+                return;
+            const model = Object.hasOwn(this.models, match.route.id)
+                ? Reflect.get(this.models, match.route.id)
+                : undefined;
+            if (!(model instanceof ModelBase))
+                return;
+            void Promise.resolve(model.onPageOpen(match.params)).catch((failure) => {
+                this.#failures.push(failure);
+            });
+        }
+    };
+}

package/dist/appearance.d.ts

@@ -0,0 +1,7 @@
+import { z } from 'zod';
+export declare const appearance: z.ZodEnum<{
+    system: "system";
+    light: "light";
+    dark: "dark";
+}>;
+export type Appearance = z.infer<typeof appearance>;

package/dist/appearance.js

@@ -0,0 +1,2 @@
+import { z } from 'zod';
+export const appearance = z.enum(['system', 'light', 'dark']);

package/dist/auth/sessionApi.d.ts

@@ -0,0 +1,41 @@
+import type { Gate } from '../gate.ts';
+import type { MemoryApiOptions } from '../memoryApi.ts';
+import type { User } from './user.ts';
+export type SessionApi = {
+    rememberedUser: () => User | undefined;
+    me: () => Promise<User | undefined>;
+    devSignIn: (email: string) => Promise<User>;
+    sendEmailCode: (email: string) => Promise<EmailCodeOutcome>;
+    verifyEmailCode: (code: string) => Promise<User | undefined>;
+    signOut: () => Promise<void>;
+    startGoogleSignIn: () => void;
+    onSignedOut: (listener: () => void) => void;
+};
+export type EmailCodeOutcome = 'sent' | 'refused';
+export type SessionCall = 'me' | 'devSignIn' | 'sendEmailCode' | 'verifyEmailCode' | 'signOut';
+export declare const sessionCalls: readonly SessionCall[];
+export declare class HttpSessionApi implements SessionApi {
+    #private;
+    constructor(gate: Gate);
+    rememberedUser(): User | undefined;
+    me(): Promise<User | undefined>;
+    devSignIn(email: string): Promise<User>;
+    sendEmailCode(email: string): Promise<EmailCodeOutcome>;
+    verifyEmailCode(code: string): Promise<User | undefined>;
+    signOut(): Promise<void>;
+    startGoogleSignIn(): void;
+    onSignedOut(listener: () => void): void;
+    reportSignedOut(): void;
+}
+export declare class MemorySessionApi implements SessionApi {
+    #private;
+    constructor(signedInAs: string | null, admins: readonly string[], options: MemoryApiOptions);
+    rememberedUser(): User | undefined;
+    me(): Promise<User | undefined>;
+    devSignIn(email: string): Promise<User>;
+    sendEmailCode(email: string): Promise<EmailCodeOutcome>;
+    verifyEmailCode(code: string): Promise<User | undefined>;
+    signOut(): Promise<void>;
+    startGoogleSignIn(): void;
+    onSignedOut(): void;
+}

package/dist/auth/sessionApi.js

@@ -0,0 +1,158 @@
+import { adminEmails } from "../access.js";
+import { MemoryServer } from "../memoryApi.js";
+import { ownerIdOf } from "../table.js";
+import { USER_COOKIE, userSchema } from "./user.js";
+export const sessionCalls = [
+    'me',
+    'devSignIn',
+    'sendEmailCode',
+    'verifyEmailCode',
+    'signOut'
+];
+const MEMORY_EMAIL_CODE = '123456';
+const JSON_HEADERS = { 'content-type': 'application/json' };
+export class HttpSessionApi {
+    #gate;
+    #signedOutListeners = new Set();
+    constructor(gate) {
+        this.#gate = gate;
+    }
+    rememberedUser() {
+        const prefix = `${USER_COOKIE}=`;
+        const cookie = document.cookie
+            .split('; ')
+            .find((part) => part.startsWith(prefix));
+        if (cookie === undefined)
+            return undefined;
+        try {
+            const json = JSON.parse(decodeURIComponent(cookie.slice(prefix.length)));
+            const parsed = userSchema.safeParse(json);
+            return parsed.success ? parsed.data : undefined;
+        }
+        catch {
+            return undefined;
+        }
+    }
+    me() {
+        return this.#gate.pass('session.me', async () => {
+            const response = await fetch('/api/me');
+            if (response.status === 401)
+                return undefined;
+            if (!response.ok)
+                throw new Error('session.me failed');
+            return userSchema.parse(await response.json());
+        });
+    }
+    devSignIn(email) {
+        return this.#gate.pass('session.devSignIn', async () => {
+            const response = await fetch('/api/auth/dev-sign-in', {
+                method: 'POST',
+                headers: JSON_HEADERS,
+                body: JSON.stringify({ email })
+            });
+            if (!response.ok)
+                throw new Error('session.devSignIn failed');
+            return userSchema.parse(await response.json());
+        });
+    }
+    sendEmailCode(email) {
+        return this.#gate.pass('session.sendEmailCode', async () => {
+            const response = await fetch('/api/auth/email', {
+                method: 'POST',
+                headers: JSON_HEADERS,
+                body: JSON.stringify({ email })
+            });
+            return response.ok ? 'sent' : 'refused';
+        });
+    }
+    verifyEmailCode(code) {
+        return this.#gate.pass('session.verifyEmailCode', async () => {
+            const response = await fetch('/api/auth/email/verify', {
+                method: 'POST',
+                headers: JSON_HEADERS,
+                body: JSON.stringify({ code })
+            });
+            if (response.status === 401)
+                return undefined;
+            if (!response.ok)
+                throw new Error('session.verifyEmailCode failed');
+            return userSchema.parse(await response.json());
+        });
+    }
+    signOut() {
+        return this.#gate.pass('session.signOut', async () => {
+            await fetch('/api/auth/sign-out', { method: 'POST' });
+        });
+    }
+    startGoogleSignIn() {
+        location.assign('/api/auth/google');
+    }
+    onSignedOut(listener) {
+        this.#signedOutListeners.add(listener);
+    }
+    reportSignedOut() {
+        for (const listener of this.#signedOutListeners)
+            listener();
+    }
+}
+function devUser(email, admins) {
+    const name = email.split('@')[0] ?? email;
+    return {
+        id: ownerIdOf(email),
+        email,
+        name,
+        avatarUrl: null,
+        isAdmin: admins.has(email.toLowerCase())
+    };
+}
+export class MemorySessionApi {
+    #server;
+    #admins;
+    #user;
+    #emailCodeFor;
+    constructor(signedInAs, admins, options) {
+        this.#server = new MemoryServer('session', options);
+        this.#admins = adminEmails(admins);
+        this.#user =
+            signedInAs === null ? undefined : devUser(signedInAs, this.#admins);
+    }
+    rememberedUser() {
+        return this.#user;
+    }
+    me() {
+        return this.#server.reply('me', () => this.#user);
+    }
+    devSignIn(email) {
+        return this.#server.reply('devSignIn', () => {
+            this.#user = devUser(email, this.#admins);
+            return this.#user;
+        });
+    }
+    sendEmailCode(email) {
+        return this.#server.reply('sendEmailCode', () => {
+            this.#emailCodeFor = email;
+            return 'sent';
+        });
+    }
+    verifyEmailCode(code) {
+        return this.#server.reply('verifyEmailCode', () => {
+            if (this.#emailCodeFor === undefined || code !== MEMORY_EMAIL_CODE) {
+                return undefined;
+            }
+            this.#user = devUser(this.#emailCodeFor, this.#admins);
+            this.#emailCodeFor = undefined;
+            return this.#user;
+        });
+    }
+    signOut() {
+        return this.#server.reply('signOut', () => {
+            this.#user = undefined;
+        });
+    }
+    startGoogleSignIn() {
+        return undefined;
+    }
+    onSignedOut() {
+        return undefined;
+    }
+}

package/dist/auth/sessionStore.d.ts

@@ -0,0 +1,20 @@
+import { StoreBase } from '../store.ts';
+import type { EmailCodeOutcome, SessionApi } from './sessionApi.ts';
+import type { User } from './user.ts';
+export type SessionState = {
+    user: User | null;
+};
+export declare class SessionStore extends StoreBase<SessionState, {
+    api: SessionApi;
+}> {
+    constructor(deps: {
+        api: SessionApi;
+    });
+    protected initialState(): SessionState;
+    confirm(): Promise<void>;
+    devSignIn(email: string): Promise<void>;
+    sendEmailCode(email: string): Promise<EmailCodeOutcome>;
+    verifyEmailCode(code: string): Promise<boolean>;
+    continueWithGoogle(): void;
+    signOut(): Promise<void>;
+}

package/dist/auth/sessionStore.js

@@ -0,0 +1,40 @@
+import { StoreBase } from "../store.js";
+export class SessionStore extends StoreBase {
+    constructor(deps) {
+        super(deps);
+        deps.api.onSignedOut(() => void this.confirm());
+    }
+    initialState() {
+        return { user: this.deps.api.rememberedUser() ?? null };
+    }
+    async confirm() {
+        if (this.state.user === null)
+            return;
+        try {
+            this.set({ user: (await this.deps.api.me()) ?? null });
+        }
+        catch {
+            return;
+        }
+    }
+    async devSignIn(email) {
+        this.set({ user: await this.deps.api.devSignIn(email) });
+    }
+    sendEmailCode(email) {
+        return this.deps.api.sendEmailCode(email);
+    }
+    async verifyEmailCode(code) {
+        const user = await this.deps.api.verifyEmailCode(code);
+        if (user === undefined)
+            return false;
+        this.set({ user });
+        return true;
+    }
+    continueWithGoogle() {
+        this.deps.api.startGoogleSignIn();
+    }
+    async signOut() {
+        this.set({ user: null });
+        await this.deps.api.signOut();
+    }
+}

package/dist/auth/user.d.ts

@@ -0,0 +1,11 @@
+import { z } from 'zod';
+export declare const userSchema: z.ZodObject<{
+    id: z.ZodString;
+    email: z.ZodString;
+    name: z.ZodString;
+    avatarUrl: z.ZodNullable<z.ZodString>;
+    isAdmin: z.ZodDefault<z.ZodBoolean>;
+}, z.core.$strip>;
+export type User = z.output<typeof userSchema>;
+export type StoredUser = Omit<User, 'isAdmin'>;
+export declare const USER_COOKIE = "pattern_user";

package/dist/auth/user.js

@@ -0,0 +1,9 @@
+import { z } from 'zod';
+export const userSchema = z.object({
+    id: z.string(),
+    email: z.string(),
+    name: z.string(),
+    avatarUrl: z.string().nullable(),
+    isAdmin: z.boolean().default(false)
+});
+export const USER_COOKIE = 'pattern_user';

package/dist/builtins/Account.d.ts

@@ -0,0 +1,25 @@
+declare const Account_base: import("../model.ts").ModelClass<import("../registered.ts").AppStores, import("../registered.ts").ModelServices, {
+    appearance: import("zod").ZodDefault<import("zod").ZodEnum<{
+        system: "system";
+        light: "light";
+        dark: "dark";
+    }>>;
+}, readonly ["appearance"]>;
+export declare class Account extends Account_base {
+    get user(): {
+        id: string;
+        email: string;
+        name: string;
+        avatarUrl: string | null;
+        isAdmin: boolean;
+    } | null;
+    setAppearance: import("../model.ts").Command<{
+        appearance: import("zod").ZodEnum<{
+            system: "system";
+            light: "light";
+            dark: "dark";
+        }>;
+    }, void>;
+    signOut: import("../model.ts").Command<{}, Promise<void>>;
+}
+export {};

package/dist/builtins/Account.js

@@ -0,0 +1,15 @@
+import { appearance } from "../appearance.js";
+import { command } from "../model.js";
+import { Model } from "../registered.js";
+export class Account extends Model({
+    state: { appearance: appearance.default('system') },
+    persist: ['appearance']
+}) {
+    get user() {
+        return this.stores.session.state.user;
+    }
+    setAppearance = command({ input: { appearance } }, ({ appearance }) => {
+        this.set({ appearance });
+    });
+    signOut = command(() => this.stores.session.signOut());
+}

package/dist/builtins/Palette.d.ts

@@ -0,0 +1,29 @@
+import { z } from 'zod';
+import type { AppAction } from '../registered.ts';
+declare const Palette_base: import("../model.ts").ModelClass<import("../registered.ts").AppStores, import("../registered.ts").ModelServices, {
+    isOpen: z.ZodDefault<z.ZodBoolean>;
+    query: z.ZodDefault<z.ZodString>;
+    highlightedId: z.ZodDefault<z.ZodNullable<z.ZodString>>;
+}, []>;
+export declare class Palette extends Palette_base {
+    get results(): AppAction[];
+    get highlighted(): string | null;
+    open: import("../model.ts").Command<{}, void>;
+    close: import("../model.ts").Command<{}, void>;
+    toggle: import("../model.ts").Command<{}, void>;
+    setQuery: import("../model.ts").Command<{
+        query: z.ZodString;
+    }, void>;
+    highlight: import("../model.ts").Command<{
+        id: z.ZodString;
+    }, void>;
+    moveHighlight: import("../model.ts").Command<{
+        by: z.ZodNumber;
+    }, void>;
+    submit: import("../model.ts").Command<{}, Promise<void> | undefined>;
+    run: import("../model.ts").Command<{
+        id: z.ZodString;
+    }, Promise<void> | undefined>;
+    private runAction;
+}
+export {};

package/dist/builtins/Palette.js

@@ -0,0 +1,63 @@
+import { z } from 'zod';
+import { rankActions } from "../actions.js";
+import { command } from "../model.js";
+import { Model } from "../registered.js";
+export class Palette extends Model({
+    state: {
+        isOpen: z.boolean().default(false),
+        query: z.string().default(''),
+        highlightedId: z.string().nullable().default(null)
+    }
+}) {
+    get results() {
+        return rankActions(this.stores.actions.state.items, this.state.query);
+    }
+    get highlighted() {
+        const { highlightedId } = this.state;
+        const { results } = this;
+        if (results.some((result) => result.id === highlightedId)) {
+            return highlightedId;
+        }
+        return results[0]?.id ?? null;
+    }
+    open = command(() => {
+        this.set({ isOpen: true, query: '', highlightedId: null });
+    });
+    close = command(() => {
+        this.set({ isOpen: false });
+    });
+    toggle = command(() => {
+        if (this.state.isOpen)
+            this.close();
+        else
+            this.open();
+    });
+    setQuery = command({ input: { query: z.string() } }, ({ query }) => {
+        this.set({ query, highlightedId: null });
+    });
+    highlight = command({ input: { id: z.string() } }, ({ id }) => {
+        if (this.results.some((result) => result.id === id)) {
+            this.set({ highlightedId: id });
+        }
+    });
+    moveHighlight = command({ input: { by: z.number().int() } }, ({ by }) => {
+        const { results } = this;
+        if (results.length === 0)
+            return;
+        const index = results.findIndex((result) => result.id === this.highlighted);
+        const next = (((index + by) % results.length) + results.length) % results.length;
+        this.set({ highlightedId: results[next]?.id ?? null });
+    });
+    submit = command(() => {
+        const chosen = this.results.find((result) => result.id === this.highlighted);
+        return chosen === undefined ? undefined : this.runAction(chosen);
+    });
+    run = command({ input: { id: z.string() } }, ({ id }) => {
+        const chosen = this.results.find((result) => result.id === id);
+        return chosen === undefined ? undefined : this.runAction(chosen);
+    });
+    async runAction(chosen) {
+        this.close();
+        await this.stores.actions.run(chosen);
+    }
+}

package/dist/builtins/SignIn.d.ts

@@ -0,0 +1,28 @@
+import { z } from 'zod';
+declare const SignIn_base: import("../model.ts").ModelClass<import("../registered.ts").AppStores, import("../registered.ts").ModelServices, {
+    step: z.ZodDefault<z.ZodEnum<{
+        code: "code";
+        choose: "choose";
+    }>>;
+    email: z.ZodDefault<z.ZodString>;
+    signingIn: z.ZodDefault<z.ZodNullable<z.ZodEnum<{
+        email: "email";
+        google: "google";
+        dev: "dev";
+    }>>>;
+    notice: z.ZodDefault<z.ZodNullable<z.ZodString>>;
+}, []>;
+export declare class SignIn extends SignIn_base {
+    continueWithGoogle: import("../model.ts").Command<{}, void>;
+    sendEmailCode: import("../model.ts").Command<{
+        email: z.ZodEmail;
+    }, Promise<void>>;
+    verifyEmailCode: import("../model.ts").Command<{
+        code: z.ZodString;
+    }, Promise<void>>;
+    startOver: import("../model.ts").Command<{}, void>;
+    signInAsDevUser: import("../model.ts").Command<{
+        email: z.ZodEmail;
+    }, Promise<void>>;
+}
+export {};