shutro-erp 0.3.4 → 0.3.6

package/dist/approvals/index.js

@@ -0,0 +1,302 @@
+/**
+ * @packageDocumentation
+ * `shutro-erp/approvals` (RFC 0025): the **Approvals** app on the engine of `shutro-erp/permissions`. Everyone who decides or
+ * asks has it: the inbox (cards with the record, who asked, how long it waits, every level as a step; decided one by
+ * one or many at once, from the keyboard too), my requests (withdrawn while they wait), what I decided, and *Away*
+ * (who decides for me while I am away); for Approvals managers, the policies — levels, who decides each and how many,
+ * the deadline and who it escalates to — edited on screen. Approvers get each request by email with a link of their
+ * own that opens a confirmation page; reminders at half a deadline and escalations once late, hourly.
+ *
+ * - `GET  /api/v1/public/approvals/:token`   the confirmation page of an email link
+ * - `POST /api/v1/public/approvals/:token`   `{ decision: approve | reject | send_back, comment? }`, once
+ * - `POST /api/v1/approvals/deadlines/run`   reminders and escalations now (Approvals managers; hourly too)
+ */
+import { randomBytes } from 'node:crypto';
+import { mailerFromEnv } from '../mail/index.js';
+import { defineModule } from '../modules-sdk/index.js';
+import { decide, groupsOf, linkOf, permissions, sweepDeadlines, useLink, } from '../permissions/index.js';
+import { digest, HttpProblem } from '../server/index.js';
+import { form, list, search } from '../views/index.js';
+import { configureMails, mailDeciders, mailTurn } from './mails.js';
+import { approvalsShutro } from './module.js';
+export { mailDeciders, mailTurn } from './mails.js';
+export { approvalsShutro } from './module.js';
+const escapeHtml = (s) => s.replace(/[&<>"']/g, (c) => `&#${c.charCodeAt(0)};`);
+const DECISIONS = new Set(['approve', 'reject', 'send_back']);
+/** The subscribers that email a record's approvers when its approvals are asked and when a level is approved. */
+export function approvalMailWorkers(context) {
+    const turn = (name, topic) => context.shutro.subscribe(name, topic, async (event, env) => {
+        const p = (event.payload ?? {});
+        const model = String(p['model'] ?? '');
+        const id = Number(p['id']);
+        if (model === '' || !Number.isSafeInteger(id))
+            return;
+        if (topic === 'approval.decided' && (p['final'] === true || p['state'] !== 'approved'))
+            return;
+        await env.asSuperuser({ reason: 'approval emails' }, (su) => mailTurn(su, model, id));
+    }, { pollMs: 5000 });
+    return [
+        turn('approvals.asked', 'approval.requested'),
+        turn('approvals.next', 'approval.decided'),
+    ];
+}
+/** Reminders and escalations, then their emails (as the system). */
+async function runDeadlines(su) {
+    const done = await sweepDeadlines(su);
+    const reminded = done.filter((d) => d.kind === 'reminded').map((d) => d.request);
+    const escalated = done.filter((d) => d.kind === 'escalated').map((d) => d.request);
+    await mailDeciders(su, reminded, 'reminded');
+    await mailDeciders(su, escalated, 'escalated');
+    return { reminded: reminded.length, escalated: escalated.length };
+}
+function registerApprovalAppRoutes(context) {
+    const { app, shutro } = context;
+    const tokenOf = (params) => String(params['token'] ?? '');
+    const linkFor = (token) => shutro.bootstrap({ reason: 'approval link' }, (raw) => raw.asSuperuser({ reason: 'approval link' }, async (su) => {
+        const link = await linkOf(su.withFlags({ checkCompany: false }), digest(token));
+        if (link === null)
+            return null;
+        const [record] = await (await su
+            .withFlags({ checkCompany: false })
+            .model(link.request.targetModel).search({ where: { id: link.request.targetId }, limit: 1 }))
+            .load(['displayName'])
+            .then((r) => r.read(['displayName']))
+            .catch(() => []);
+        return { ...link, name: String(record?.['displayName'] ?? `#${link.request.targetId}`) };
+    }));
+    app.post('/api/v1/approvals/deadlines/run', async (request) => request.env(async (raw) => {
+        const env = raw;
+        if (!env.administrator && !env.groups.has('approvals.manager'))
+            throw new HttpProblem(403, 'access', 'Approvals managers', 'This needs the Approvals manager role.');
+        return env.asSuperuser({ reason: 'approval deadlines' }, (su) => runDeadlines(su));
+    }, { write: true }));
+    // The confirmation page: the request, a comment, the three answers; its script (allowed by a nonce) posts.
+    app.get('/api/v1/public/approvals/:token', { config: { auth: false } }, async (request, reply) => {
+        const link = await linkFor(tokenOf(request.params));
+        if (link === null)
+            throw new HttpProblem(404, 'not-found', 'Not found', 'This link is used or has expired.');
+        const nonce = randomBytes(16).toString('base64');
+        return reply
+            .type('text/html; charset=utf-8')
+            .header('content-security-policy', `default-src 'none'; style-src 'unsafe-inline'; script-src 'nonce-${nonce}'; connect-src 'self'`)
+            .header('cache-control', 'no-store')
+            .send(`<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>${escapeHtml(link.name)}</title><style>body{font:16px system-ui,sans-serif;max-width:32rem;margin:3rem auto;padding:0 1rem;color:#111;background:#fff}
+@media (prefers-color-scheme:dark){body{color:#eee;background:#111}}textarea{width:100%;min-height:5rem;font:inherit}
+button{font:inherit;padding:.6rem 1rem;border-radius:.5rem;border:1px solid #888;cursor:pointer;margin:.5rem .5rem 0 0}.go{background:#16a34a;color:#fff;border-color:#16a34a}.no{background:#dc2626;color:#fff;border-color:#dc2626}</style></head>
+<body><h1>${escapeHtml(link.name)}</h1><p>${escapeHtml(link.request.levelName)}${link.request.required > 1 ? ` — ${link.request.approvals} of ${link.request.required} approvals so far` : ''}</p>
+<label for="c">Comment (needed to reject or send back)</label><textarea id="c" maxlength="2000"></textarea>
+<div><button class="go" data-d="approve">Approve</button><button data-d="send_back">Send back for changes</button><button class="no" data-d="reject">Reject</button></div>
+<p id="out" role="status"></p>
+<script nonce="${nonce}">for(const b of document.querySelectorAll('button[data-d]')){b.addEventListener('click',async()=>{const out=document.getElementById('out');out.textContent='Sending…';
+const r=await fetch(location.pathname,{method:'POST',headers:{'content-type':'application/json'},body:JSON.stringify({decision:b.dataset.d,comment:document.getElementById('c').value})});
+let j={};try{j=await r.json()}catch{}out.textContent=r.ok?'Done — thank you.':(j.detail||'It could not be done.');if(r.ok)for(const x of document.querySelectorAll('button'))x.disabled=true;})}</script></body></html>`);
+    });
+    // The decision, as the link's person (their rights and the engine's checks), once; audited with the address.
+    app.post('/api/v1/public/approvals/:token', { config: { auth: false }, bodyLimit: 8 * 1024 }, async (request) => {
+        const token = tokenOf(request.params);
+        const body = (request.body ?? {});
+        const decision = String(body['decision'] ?? '');
+        if (!DECISIONS.has(decision))
+            throw new HttpProblem(400, 'invalid-decision', 'Invalid decision', 'approve, reject or send_back.');
+        const comment = typeof body['comment'] === 'string' ? body['comment'].slice(0, 2000) : undefined;
+        const link = await linkFor(token);
+        if (link === null)
+            throw new HttpProblem(404, 'not-found', 'Not found', 'This link is used or has expired.');
+        const company = link.request.company ??
+            (await shutro.bootstrap({ reason: 'approval link: company' }, async (raw) => {
+                const [u] = (await raw
+                    .model('res.users')
+                    .browse([link.user])
+                    .load(['company'])).read(['company']);
+                return u?.['company'] ?? null;
+            }));
+        const groups = await shutro.bootstrap({ reason: 'approval link: groups' }, (raw) => groupsOf(raw, link.user, company));
+        const decided = await shutro.run({
+            user: link.user,
+            ...(company === null ? {} : { company, companies: [company] }),
+            groups,
+            reason: 'approval decided from an email link',
+        }, (env) => decide(env, link.request.id, decision, comment, { ip: request.ip }));
+        await shutro.bootstrap({ reason: 'approval link used' }, (raw) => raw.asSuperuser({ reason: 'approval link used' }, (su) => useLink(su, link.id)));
+        return { state: decided.state };
+    });
+    if (process.env['KOSH_SCHEDULES'] === 'off')
+        return;
+    const workers = approvalMailWorkers(context);
+    for (const w of workers)
+        w.start();
+    const run = async () => {
+        try {
+            const companies = await shutro.bootstrap({ reason: 'approval deadlines' }, async (env) => (await env.model('res.company').search({}))
+                .ids);
+            for (const company of companies)
+                await shutro.bootstrap({ reason: 'approval deadlines', company }, (env) => env.asSuperuser({ reason: 'approval deadlines' }, (su) => runDeadlines(su)));
+        }
+        catch (error) {
+            app.log.error({ err: error }, 'approval deadlines');
+        }
+    };
+    const timer = setInterval(() => void run(), 3_600_000);
+    timer.unref();
+    app.addHook('onClose', async () => {
+        clearInterval(timer);
+        for (const w of workers)
+            await w.stop();
+    });
+}
+/** The Approvals app with explicit options (tests: a memory mailer). */
+export function approvalsModule(options = {}) {
+    configureMails({
+        mailer: 'mailer' in options ? options.mailer : mailerFromEnv(),
+        apiUrl: (options.apiUrl ?? process.env['KOSH_API_URL'] ?? 'http://localhost:3000').replace(/\/$/, ''),
+    });
+    return defineModule({
+        shutro: approvalsShutro,
+        kosh: '^0.1.0',
+        depends: [permissions],
+        app: {
+            code: 'approvals',
+            label: 'Approvals',
+            icon: 'approvals',
+            sequence: 2,
+            category: 'Productivity',
+            summary: 'Everything waiting for your decision, in one place — and what you asked for',
+        },
+        accessLevels: {
+            user: { label: 'Everyone (decide and ask)', groups: ['base.user'] },
+            manager: {
+                label: 'Manager (policies)',
+                groups: ['approvals.manager'],
+                implies: ['user'],
+            },
+        },
+        routes: (context) => {
+            configureMails({ log: (message, error) => context.app.log.warn({ err: error }, message) });
+            registerApprovalAppRoutes(context);
+        },
+        actions: {
+            'approvals.action_inbox': { type: 'client', page: 'approvals.Inbox', label: 'To approve' },
+            'approvals.action_mine': { type: 'client', page: 'approvals.Mine', label: 'My requests' },
+            'approvals.action_history': {
+                type: 'client',
+                page: 'approvals.History',
+                label: 'What I decided',
+            },
+            'approvals.action_away': {
+                model: 'approval.delegation',
+                label: 'Away',
+                views: ['list', 'form'],
+            },
+            'approvals.action_policies': {
+                model: 'approval.policy',
+                label: 'Policies',
+                views: ['list', 'form'],
+                visibleTo: ['approvals.manager'],
+            },
+        },
+        menus: [
+            { id: 'approvals.root', label: 'Approvals', app: 'approvals' },
+            {
+                id: 'approvals.inbox',
+                parent: 'approvals.root',
+                label: 'To approve',
+                action: 'approvals.action_inbox',
+                sequence: 1,
+            },
+            {
+                id: 'approvals.mine',
+                parent: 'approvals.root',
+                label: 'My requests',
+                action: 'approvals.action_mine',
+                sequence: 2,
+            },
+            {
+                id: 'approvals.history',
+                parent: 'approvals.root',
+                label: 'What I decided',
+                action: 'approvals.action_history',
+                sequence: 3,
+            },
+            {
+                id: 'approvals.away',
+                parent: 'approvals.root',
+                label: 'Away',
+                action: 'approvals.action_away',
+                sequence: 4,
+            },
+            {
+                id: 'approvals.configuration',
+                parent: 'approvals.root',
+                label: 'Configuration',
+                sequence: 9,
+                visibleTo: ['approvals.manager'],
+            },
+            {
+                id: 'approvals.policies',
+                parent: 'approvals.configuration',
+                label: 'Policies',
+                action: 'approvals.action_policies',
+                sequence: 1,
+                visibleTo: ['approvals.manager'],
+            },
+        ],
+        views: {
+            'approval.delegation.list': list('approval.delegation', {
+                columns: ['user', 'delegate', 'dateFrom', 'dateTo', 'note'],
+            }),
+            'approval.delegation.form': form('approval.delegation', (k) => ({
+                sheet: [
+                    k.group('main', ['user', 'delegate', 'dateFrom', 'dateTo', 'note'], {
+                        description: 'While you are away, the person you choose decides your approvals — in their own name, for you. They never approve their own requests.',
+                    }),
+                ],
+            })),
+            'approval.policy.list': list('approval.policy', {
+                columns: [
+                    'name',
+                    'targetModel',
+                    'company',
+                    'onApproved',
+                    'reasonRequired',
+                    'active',
+                ],
+            }),
+            'approval.policy.form': form('approval.policy', (k) => ({
+                sheet: [
+                    k.group('main', ['name', 'targetModel', 'company', 'sequence'], {
+                        description: 'A record of the model gets one approval per level whose condition it meets; levels with a lower sequence are decided first, those with the same side by side.',
+                    }),
+                    k.group('outcomes', ['onApproved', 'onRejected', 'onSentBack', 'onWithdrawn', 'reasonRequired'], {
+                        label: 'What happens',
+                        description: 'The transitions of the record run when it is approved, rejected, sent back or withdrawn.',
+                    }),
+                    k.lines('levels', [
+                        { field: 'sequence', id: 'level_sequence' },
+                        { field: 'name', id: 'level_name' },
+                        { field: 'approverKind', id: 'level_kind' },
+                        { field: 'approverRole', id: 'level_role' },
+                        { field: 'approverUsers', id: 'level_users', widget: 'tags' },
+                        { field: 'approverField', id: 'level_field' },
+                        { field: 'quorum', id: 'level_quorum' },
+                        { field: 'quorumCount', id: 'level_count' },
+                        { field: 'deadlineHours', id: 'level_deadline' },
+                        { field: 'escalateRole', id: 'level_escalate' },
+                    ]),
+                ],
+            })),
+        },
+        search: {
+            'approval.delegation': search('approval.delegation', {
+                fields: ['user.name', 'delegate.name'],
+                groupBy: ['user', 'delegate'],
+            }),
+            'approval.policy': search('approval.policy', {
+                fields: ['name', 'targetModel'],
+                groupBy: ['targetModel'],
+            }),
+        },
+    });
+}
+/** The Approvals app (mail from the environment). */
+export const approvals = approvalsModule();

package/dist/approvals/mails.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Approvals by email (RFC 0025 §3.4): whoever may decide a request now — when it is asked, when its turn comes after
+ * a lower level, when it is reminded at half its deadline or escalated once late — gets an email with a link of their
+ * own (single use, seven days; only its digest kept) to a page that confirms the decision. A link decides nothing by
+ * being opened: mail scanners follow links. Sent after the commit; a failed send is logged.
+ */
+import { type Mailer } from '../mail/index.js';
+import { type ApprovalRequestInfo } from '../permissions/index.js';
+import type { Env } from '../server/orm.js';
+declare let config: {
+    mailer: Mailer | undefined;
+    apiUrl: string;
+    log: (m: string, e: unknown) => void;
+};
+export declare function configureMails(next: Partial<typeof config>): void;
+declare const WHY: {
+    readonly asked: (who: string, record: string) => string;
+    readonly reminded: (_who: string, record: string) => string;
+    readonly escalated: (_who: string, record: string) => string;
+};
+/** Emails each person who may decide `requests` now a link of their own; skips those already sent one. */
+export declare function mailDeciders(su: Env, requests: readonly ApprovalRequestInfo[], why: keyof typeof WHY): Promise<number>;
+/** After a record's approvals were asked, or one of its levels approved: the requests whose turn it is now. */
+export declare function mailTurn(su: Env, model: string, id: number): Promise<number>;
+export {};

package/dist/approvals/mails.js

@@ -0,0 +1,82 @@
+/**
+ * Approvals by email (RFC 0025 §3.4): whoever may decide a request now — when it is asked, when its turn comes after
+ * a lower level, when it is reminded at half its deadline or escalated once late — gets an email with a link of their
+ * own (single use, seven days; only its digest kept) to a page that confirms the decision. A link decides nothing by
+ * being opened: mail scanners follow links. Sent after the commit; a failed send is logged.
+ */
+import { layout } from '../mail/index.js';
+import { issueLinks, turnOf } from '../permissions/index.js';
+import { digest, randomToken } from '../server/index.js';
+const ref = (env, name) => env.model(name);
+const read = async (rows, keys) => rows.length === 0 ? [] : (await rows.load(keys)).read(keys);
+let config = {
+    mailer: undefined,
+    apiUrl: 'http://localhost:3000',
+    log: () => undefined,
+};
+export function configureMails(next) {
+    config = { ...config, ...next };
+}
+const WHY = {
+    asked: (who, record) => `${who} asks you to approve ${record}`,
+    reminded: (_who, record) => `Reminder: ${record} waits for your approval`,
+    escalated: (_who, record) => `${record} is late: you may decide it now`,
+};
+/** Emails each person who may decide `requests` now a link of their own; skips those already sent one. */
+export async function mailDeciders(su, requests, why) {
+    const mailer = config.mailer;
+    let sent = 0;
+    for (const request of requests) {
+        if (why === 'asked') {
+            const existing = await ref(su, 'approval.link').search({
+                where: { request: request.id },
+                limit: 1,
+            });
+            if (existing.length > 0)
+                continue;
+        }
+        const links = await issueLinks(su, request, su.today(), () => randomToken(24), digest);
+        if (links.length === 0)
+            continue;
+        const [record] = await read(await ref(su, request.targetModel)
+            .search({ where: { id: request.targetId }, limit: 1 })
+            .catch(() => ({ length: 0 })), ['displayName']);
+        const name = String(record?.['displayName'] ?? `#${request.targetId}`);
+        const [asker] = request.requestedBy === null
+            ? []
+            : await read(ref(su, 'res.users').browse([request.requestedBy]), ['name']);
+        const who = String(asker?.['name'] ?? 'Someone');
+        const users = new Map((await read(ref(su, 'res.users').browse(links.map((l) => l.user)), ['email', 'login'])).map((u) => [
+            u['id'],
+            String(u['email'] ?? (String(u['login'] ?? '').includes('@') ? u['login'] : '')),
+        ]));
+        for (const link of links) {
+            const to = users.get(link.user) ?? '';
+            if (to === '' || mailer === undefined)
+                continue;
+            const subject = WHY[why](who, name);
+            const body = layout({
+                title: subject,
+                paragraphs: [
+                    `${request.levelName}${request.required > 1 ? ` (${request.approvals} of ${request.required} approvals so far)` : ''}.`,
+                    'The link is yours alone and works once; it opens a page where you approve, reject or send it back.',
+                ],
+                action: {
+                    label: 'Review and decide',
+                    url: `${config.apiUrl}/api/v1/public/approvals/${link.token}`,
+                },
+            });
+            su.afterCommit(async () => {
+                await mailer
+                    .send({ to, subject, html: body.html, text: body.text })
+                    .catch((error) => config.log('approval email not sent', error));
+            });
+            sent += 1;
+        }
+    }
+    return sent;
+}
+/** After a record's approvals were asked, or one of its levels approved: the requests whose turn it is now. */
+export async function mailTurn(su, model, id) {
+    return mailDeciders(su, await turnOf(su, model, id), 'asked');
+}

package/dist/approvals/module.d.ts

@@ -0,0 +1 @@
+export declare const approvalsShutro: import("shutro").Module<readonly [], readonly [import("shutro").Module<readonly import("shutro").AnyModel[], readonly import("shutro").ModuleBase[], readonly import("shutro").AnyExtension[]>], readonly []>;

package/dist/approvals/module.js

@@ -0,0 +1,12 @@
+/**
+ * The data layer of the Approvals app (RFC 0025): the models are the engine's (`approval.policy`, `approval.level`,
+ * `approval.request`, `approval.vote` in `shutro-erp/permissions`); this module adds the app around them.
+ */
+import { permissionsShutro } from '../permissions/index.js';
+import { defineModule } from './.kosh/bindings.js';
+export const approvalsShutro = defineModule({
+    name: 'approvals',
+    version: '0.1.0',
+    depends: [permissionsShutro],
+    models: [],
+});

package/dist/approvals/web/History.d.ts

@@ -0,0 +1,4 @@
+/** What I decided (RFC 0025 §3.1): each decision with the record, my answer, my comment and when. */
+import { type PageProps } from '../../ui/index.js';
+import type { ReactElement } from 'react';
+export declare function History({ api }: PageProps): ReactElement;

package/dist/approvals/web/History.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/** What I decided (RFC 0025 §3.1): each decision with the record, my answer, my comment and when. */
+import { Badge, EmptyState, useKosh } from '../../ui/index.js';
+import { useQuery } from '@tanstack/react-query';
+import { useTranslation } from 'react-i18next';
+import { cardsQuery, TONE } from './shared.js';
+export function History({ api }) {
+    const { t } = useTranslation('approvals');
+    const { format } = useKosh();
+    const cards = useQuery(cardsQuery(api, 'history'));
+    const rows = cards.data ?? [];
+    return (_jsxs("div", { className: "grid gap-4 p-4", children: [_jsx("h1", { className: "text-xl font-semibold", children: t('history.title') }), rows.length === 0 ? (_jsx(EmptyState, { title: cards.isLoading ? t('loading') : t('history.empty') })) : (_jsx("div", { className: "overflow-x-auto", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "bg-muted", children: _jsxs("tr", { children: [_jsx("th", { className: "px-2 py-1 text-start", children: t('history.record') }), _jsx("th", { className: "px-2 py-1 text-start", children: t('history.level') }), _jsx("th", { className: "px-2 py-1 text-start", children: t('history.answer') }), _jsx("th", { className: "px-2 py-1 text-start", children: t('history.comment') }), _jsx("th", { className: "px-2 py-1 text-start", children: t('history.when') })] }) }), _jsx("tbody", { children: rows.map((c) => (_jsxs("tr", { className: "border-b", children: [_jsxs("td", { className: "px-2 py-1", children: [_jsx("span", { className: "font-medium", children: c.record.name }), ' ', _jsx("span", { className: "text-muted-foreground", children: c.record.label })] }), _jsx("td", { className: "px-2 py-1", children: c.levelName }), _jsx("td", { className: "px-2 py-1", children: _jsx(Badge, { tone: TONE[c.state], children: t(`state.${c.state}`) }) }), _jsx("td", { className: "px-2 py-1", children: c.comment ?? '' }), _jsx("td", { className: "px-2 py-1", children: c.decidedAt === null ? '' : format.datetime(c.decidedAt) })] }, c.id))) })] }) }))] }));
+}

package/dist/approvals/web/Inbox.d.ts

@@ -0,0 +1,9 @@
+/**
+ * The Approvals inbox (RFC 0025 §3.1): what waits for me, as cards — the record and its app, who asked and how long
+ * ago, every level of the round as a step with its votes —, decided one by one (approve, reject or send back, with a
+ * comment; a reason is needed for the last two) or many at once. Keyboard: J / K move, A approves, R rejects, X
+ * selects. The server decides who may decide what; this page shows and sends.
+ */
+import { type PageProps } from '../../ui/index.js';
+import { type ReactElement } from 'react';
+export declare function Inbox({ api }: PageProps): ReactElement;

package/dist/approvals/web/Inbox.js

@@ -0,0 +1,114 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The Approvals inbox (RFC 0025 §3.1): what waits for me, as cards — the record and its app, who asked and how long
+ * ago, every level of the round as a step with its votes —, decided one by one (approve, reject or send back, with a
+ * comment; a reason is needed for the last two) or many at once. Keyboard: J / K move, A approves, R rejects, X
+ * selects. The server decides who may decide what; this page shows and sends.
+ */
+import { Alert, Badge, Button, Checkbox, EmptyState, Textarea, useKosh, } from '../../ui/index.js';
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { useEffect, useId, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { ago, cardsQuery, Steps, waitedTone } from './shared.js';
+export function Inbox({ api }) {
+    const { t } = useTranslation('approvals');
+    const { format } = useKosh();
+    const id = useId();
+    const client = useQueryClient();
+    const cards = useQuery(cardsQuery(api, 'inbox'));
+    const stats = useQuery({
+        queryKey: ['approvals', 'stats'],
+        queryFn: () => api.call('GET', '/api/v1/approvals/stats'),
+    });
+    const routes = useQuery({ queryKey: ['routes'], queryFn: () => api.routes() });
+    const [selected, setSelected] = useState(new Set());
+    const [focus, setFocus] = useState(0);
+    const [comments, setComments] = useState({});
+    const [message, setMessage] = useState(null);
+    const rows = cards.data ?? [];
+    const refresh = async () => {
+        await client.invalidateQueries({ queryKey: ['approvals'] });
+        await client.invalidateQueries({ queryKey: ['home', 'approvals'] });
+    };
+    const decide = useMutation({
+        mutationFn: ({ request, decision }) => api.call('POST', `/api/v1/approvals/requests/${request}/${decision}`, {
+            comment: comments[request] ?? '',
+        }),
+        onSuccess: async (_r, v) => {
+            setMessage(t(`done.${v.decision}`));
+            await refresh();
+        },
+        onError: (e) => setMessage(e.message),
+    });
+    const bulk = useMutation({
+        mutationFn: () => api.call('POST', '/api/v1/approvals/bulk', { requests: [...selected], decision: 'approve' }),
+        onSuccess: async (r) => {
+            setMessage(t('bulkDone', { count: r.approved, failed: r.failed.length }));
+            setSelected(new Set());
+            await refresh();
+        },
+        onError: (e) => setMessage(e.message),
+    });
+    // Keyboard: J / K move, A approves, R rejects (with the comment typed), X selects.
+    useEffect(() => {
+        const onKey = (e) => {
+            const target = e.target;
+            if (target !== null && ['INPUT', 'TEXTAREA'].includes(target.tagName))
+                return;
+            const card = rows[focus];
+            if (e.key === 'j')
+                setFocus((f) => Math.min(f + 1, rows.length - 1));
+            else if (e.key === 'k')
+                setFocus((f) => Math.max(f - 1, 0));
+            else if (card === undefined)
+                return;
+            else if (e.key === 'a')
+                decide.mutate({ request: card.id, decision: 'approve' });
+            else if (e.key === 'r' && (comments[card.id] ?? '').trim() !== '')
+                decide.mutate({ request: card.id, decision: 'reject' });
+            else if (e.key === 'x')
+                setSelected((s) => {
+                    const next = new Set(s);
+                    if (next.has(card.id))
+                        next.delete(card.id);
+                    else
+                        next.add(card.id);
+                    return next;
+                });
+            else
+                return;
+            e.preventDefault();
+        };
+        window.addEventListener('keydown', onKey);
+        return () => window.removeEventListener('keydown', onKey);
+    }, [rows, focus, comments, decide]);
+    const link = (c) => {
+        const route = routes.data?.[c.record.model];
+        return route?.app === undefined ? null : `/${route.app}/a/${route.action}/${c.record.id}`;
+    };
+    return (_jsxs("div", { className: "grid gap-4 p-4", children: [_jsxs("header", { className: "flex flex-wrap items-center gap-3", children: [_jsx("h1", { className: "text-xl font-semibold", children: t('inbox.title') }), _jsx(Badge, { tone: "neutral", children: rows.length }), _jsx("p", { className: "w-full text-sm text-muted-foreground", children: t('inbox.hint') })] }), stats.data === undefined ? null : (_jsx("dl", { className: "grid grid-cols-2 gap-3 md:grid-cols-4", children: [
+                    ['waiting', String(stats.data.waiting), 'neutral'],
+                    [
+                        'overdue',
+                        String(stats.data.overdue),
+                        stats.data.overdue > 0 ? 'danger' : 'neutral',
+                    ],
+                    ['decided', String(stats.data.decidedThisMonth), 'neutral'],
+                    [
+                        'median',
+                        stats.data.medianHours === null ? '—' : t('hours', { n: stats.data.medianHours }),
+                        'neutral',
+                    ],
+                ].map(([key, value, tone]) => (_jsxs("div", { className: "rounded-lg border bg-surface p-3", children: [_jsx("dt", { className: "text-xs text-muted-foreground", children: t(`stats.${key}`) }), _jsx("dd", { className: `text-2xl font-semibold tabular-nums ${tone === 'danger' ? 'text-danger' : ''}`, children: value })] }, key))) })), rows.length === 0 ? null : (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Checkbox, { id: `${id}-all`, checked: selected.size === rows.length && rows.length > 0, onCheckedChange: (c) => setSelected(c === true ? new Set(rows.map((r) => r.id)) : new Set()) }), _jsx("label", { htmlFor: `${id}-all`, className: "text-sm", children: t('inbox.selectAll') }), _jsx(Button, { variant: "primary", disabled: selected.size === 0 || bulk.isPending, onClick: () => bulk.mutate(), children: t('inbox.approveSelected', { count: selected.size }) })] })), message === null ? null : _jsx(Alert, { tone: "info", children: message }), cards.isLoading ? (_jsx("p", { className: "text-sm text-muted-foreground", children: t('loading') })) : rows.length === 0 ? (_jsx(EmptyState, { title: t('inbox.empty'), description: t('inbox.emptyHint') })) : (_jsx("ul", { className: "grid gap-3", children: rows.map((c, i) => {
+                    const href = link(c);
+                    const comment = comments[c.id] ?? '';
+                    return (_jsxs("li", { "aria-current": i === focus ? 'true' : undefined, className: `grid gap-3 rounded-lg border bg-surface p-4 ${i === focus ? 'ring-2 ring-accent' : ''}`, children: [_jsxs("div", { className: "flex flex-wrap items-start gap-3", children: [_jsx(Checkbox, { "aria-label": t('inbox.select', { name: c.record.name }), checked: selected.has(c.id), onCheckedChange: (v) => setSelected((s) => {
+                                            const next = new Set(s);
+                                            if (v === true)
+                                                next.add(c.id);
+                                            else
+                                                next.delete(c.id);
+                                            return next;
+                                        }) }), _jsxs("div", { className: "grid min-w-0 flex-1 gap-1", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [href === null ? (_jsx("span", { className: "font-semibold", children: c.record.name })) : (_jsx("a", { href: href, className: "font-semibold underline-offset-2 hover:underline", children: c.record.name })), _jsx(Badge, { tone: "neutral", children: c.record.label }), _jsx(Badge, { tone: waitedTone(c), children: t('waiting', { since: ago(format.locale, c.waitingSince) }) }), c.dueAt === null ? null : (_jsx(Badge, { tone: Date.parse(c.dueAt) < Date.now() ? 'danger' : 'info', children: t('due', { when: ago(format.locale, c.dueAt) }) })), c.escalatedTo === null ? null : (_jsx(Badge, { tone: "danger", children: t('escalated') }))] }), _jsxs("p", { className: "text-sm text-muted-foreground", children: [t('askedBy', { name: c.requester?.name ?? '—' }), " \u00B7 ", c.levelName, c.required > 1 ? ` · ${t('votes', { n: c.approvals, of: c.required })}` : '', c.round > 1 ? ` · ${t('round', { n: c.round })}` : ''] })] })] }), _jsx(Steps, { steps: c.steps }), _jsx(Textarea, { "aria-label": t('comment', { name: c.record.name }), placeholder: t('commentHint'), value: comment, onChange: (e) => setComments((m) => ({ ...m, [c.id]: e.target.value })) }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx(Button, { variant: "primary", disabled: decide.isPending, onClick: () => decide.mutate({ request: c.id, decision: 'approve' }), children: t('approve') }), _jsx(Button, { disabled: decide.isPending || comment.trim() === '', onClick: () => decide.mutate({ request: c.id, decision: 'send-back' }), children: t('sendBack') }), _jsx(Button, { variant: "danger", disabled: decide.isPending || comment.trim() === '', onClick: () => decide.mutate({ request: c.id, decision: 'reject' }), children: t('reject') })] })] }, c.id));
+                }) }))] }));
+}

package/dist/approvals/web/Mine.d.ts

@@ -0,0 +1,7 @@
+/**
+ * My requests (RFC 0025 §3.1): what I asked to be approved, where each stands — every level as a step, since when —,
+ * withdrawn while it waits.
+ */
+import { type PageProps } from '../../ui/index.js';
+import { type ReactElement } from 'react';
+export declare function Mine({ api }: PageProps): ReactElement;

package/dist/approvals/web/Mine.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * My requests (RFC 0025 §3.1): what I asked to be approved, where each stands — every level as a step, since when —,
+ * withdrawn while it waits.
+ */
+import { Alert, Badge, Button, EmptyState, useKosh } from '../../ui/index.js';
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { ago, cardsQuery, Steps, TONE } from './shared.js';
+export function Mine({ api }) {
+    const { t } = useTranslation('approvals');
+    const { format } = useKosh();
+    const client = useQueryClient();
+    const cards = useQuery(cardsQuery(api, 'mine'));
+    const [message, setMessage] = useState(null);
+    const withdraw = useMutation({
+        mutationFn: ({ model, id }) => api.call('POST', `/api/v1/approvals/${model}/${id}/withdraw`),
+        onSuccess: async () => {
+            setMessage(t('done.withdrawn'));
+            await client.invalidateQueries({ queryKey: ['approvals'] });
+        },
+        onError: (e) => setMessage(e.message),
+    });
+    const rows = cards.data ?? [];
+    return (_jsxs("div", { className: "grid gap-4 p-4", children: [_jsx("h1", { className: "text-xl font-semibold", children: t('mine.title') }), message === null ? null : _jsx(Alert, { tone: "info", children: message }), rows.length === 0 ? (_jsx(EmptyState, { title: cards.isLoading ? t('loading') : t('mine.empty') })) : (_jsx("ul", { className: "grid gap-3", children: rows.map((c) => (_jsxs("li", { className: "grid gap-2 rounded-lg border bg-surface p-4", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("span", { className: "font-semibold", children: c.record.name }), _jsx(Badge, { tone: "neutral", children: c.record.label }), _jsx(Badge, { tone: TONE[c.state], children: t(`state.${c.state}`) }), _jsx("span", { className: "text-sm text-muted-foreground", children: t('asked', { since: ago(format.locale, c.waitingSince) }) })] }), _jsx(Steps, { steps: c.steps }), c.comment === null ? null : (_jsxs("p", { className: "text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: t('saidWhy') }), " \u201C", c.comment, "\u201D"] })), c.state !== 'pending' ? null : (_jsx("div", { children: _jsx(Button, { disabled: withdraw.isPending, onClick: () => withdraw.mutate({ model: c.record.model, id: c.record.id }), children: t('withdraw') }) }))] }, `${c.record.model}:${c.record.id}`))) }))] }));
+}

package/dist/approvals/web/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @packageDocumentation
+ * The web contribution of `shutro-erp/approvals`: the inbox, my requests and what I decided.
+ */
+import { type Registry } from '../../ui/index.js';
+import type { i18n } from 'i18next';
+import { messages } from './messages.js';
+export { History } from './History.js';
+export { Inbox } from './Inbox.js';
+export { Mine } from './Mine.js';
+/** Registers the pages (and the messages in `i18n`, when given). */
+export declare function registerApprovalsWeb(registry: Registry, i18n?: i18n): Registry;
+export { messages as approvalsMessages };