diff --git a/.claude/skills/feature-walkthrough/SKILL.md b/.claude/skills/feature-walkthrough/SKILL.md new file mode 100644 index 0000000000..f2a4bfdc8b --- /dev/null +++ b/.claude/skills/feature-walkthrough/SKILL.md @@ -0,0 +1,97 @@ +--- +name: feature-walkthrough +description: >- + Explain the full logic and process of the current branch end-to-end so someone + with no prior knowledge of the task can understand, review, and reproduce it. + Scopes the change from the branch diff, traces the flow across every layer it + touches (frontend tool/hook/component, Java controller/service/endpoint, Python + engine, config, i18n, tests), and produces a self-contained walkthrough document + with Mermaid diagrams (sequence/flow/architecture), annotated file map with + clickable references, before/after behavior, screenshots where a UI is involved, + a "try it locally" section, and edge cases/risks. Use when asked for a feature or + branch walkthrough, "explain what this branch does", a design/logic writeup, PR + reviewer onboarding, or a hand-off doc. Pass --html to also emit a rendered HTML + version; --no-screens to skip screenshots. +argument-hint: "[branch-or-area] [--html] [--no-screens]" +allowed-tools: Read, Write, Edit, Glob, Grep, Bash +--- + +# Feature / Branch Walkthrough + +Turn the current branch into a walkthrough a newcomer can follow. Audience: +**someone who has never seen this task**. Explain the *why*, the *flow*, and *how to +try it* - not just a diff summary. + +`$ARGUMENTS` may name a branch or area to focus on; default is the current branch +vs `main`. Flags: `--html` (also emit a rendered HTML twin), `--no-screens`. + +## Process + +### 1. Scope the change +- `git log --oneline main..HEAD` and `git diff --stat main...HEAD` for the shape. +- Read the PR description / commit messages for stated intent. Do **not** invent + history or motivation that isn't evidenced (state current behavior in present tense). +- Classify touched files by layer: + - **Frontend**: tools (`frontend/editor/src/core/components/tools/*` or `.../core/tools/*`), + hooks (`core/hooks/tools/*`, `useToolOperation`), contexts, routes, i18n + (`public/locales/en-US`). + - **Java backend**: controllers (`.../controller/api/...`), services, models, config. + - **Engine**: `engine/src/stirling/{agents,contracts,api,services}`. + - **Config / build / docker / tests.** + +### 2. Trace the flow end-to-end +Follow one real path from user action to result. For a typical PDF tool that's: +UI control → `useToolOperation` hook → `POST /api/v1/...` → Spring controller → +service (PDFBox / LibreOffice / engine call) → response → review panel → download. +Read the actual files so the narrative is true to the code, and collect the exact +file:line anchors you'll cite. + +### 3. Draw the diagrams (Mermaid) +Pick what fits; usually 2-3 of: +- **Sequence diagram** - request/response across frontend → backend → engine. +- **Flowchart** - the core decision/branching logic of the feature. +- **Architecture/component** - new pieces and how they wire to existing ones. +- **State** - if the feature has modes/steps. +Keep nodes labeled in plain language. Validate the Mermaid parses before shipping. + +### 4. Screenshots (unless --no-screens) +If a UI is involved, capture key states with the stubbed Playwright harness +(see the **ui-walkthrough** skill and `files-page-screenshots.spec.ts` for the +pattern) or, for before/after, capture `main` then the branch. Drop PNGs in +`walkthrough//` and reference them from the doc. For backend-only +changes, show request/response examples (curl + JSON) instead. + +### 5. Write the walkthrough +Create `walkthrough//FEATURE-WALKTHROUGH.md` with: +1. **TL;DR** - what the branch does and who it's for, in 3-4 sentences. +2. **Problem & approach** - what wasn't possible before; the chosen solution. +3. **Architecture diagram** + 1-paragraph orientation. +4. **End-to-end flow** - the sequence diagram + a numbered walk of each step, + each citing the real file (clickable `path:line`). +5. **Key files** - annotated map (path → one line on its role). +6. **Logic deep-dive** - the flowchart + prose for the non-obvious decisions. +7. **Behavior** - before vs after; screenshots or request/response examples. +8. **Try it locally** - exact steps (`task dev` / `task dev:all`, the route to + open or the curl to run, any env like `DOCKER_ENABLE_SECURITY` or a test + license key). Make it copy-pasteable. +9. **Edge cases, risks, follow-ups** - what's untested, known limits, gotchas. + +Markdown is the primary deliverable - it renders with diagrams in GitHub PRs and +IDEs, no build step, ideal for review. + +### 6. If `--html` +Also emit `walkthrough//walkthrough.html`: the same content with Mermaid +rendered via `mermaid.initialize({startOnLoad:true})` (script from CDN; note in +the file that rendering diagrams needs network, the `.md` is the offline copy) and +screenshots inline. Keep it self-contained otherwise. + +### 7. Deliver +Give the doc path and a short chat summary. Offer to `SendUserFile` it. + +## Principles +- **True to the code.** Every claim traces to a file you read; cite `path:line`. + No fabricated migration/version history. +- **Newcomer-first.** Define repo-specific terms (FileContext, `useToolOperation`, + the `@app/*` layer cascade, stubbed vs live tests) on first use. +- **Show, don't assert.** Prefer a diagram + a real example over adjectives. +- Don't commit the `walkthrough/` output unless asked. diff --git a/.claude/skills/ui-before-after/SKILL.md b/.claude/skills/ui-before-after/SKILL.md new file mode 100644 index 0000000000..07a8561baa --- /dev/null +++ b/.claude/skills/ui-before-after/SKILL.md @@ -0,0 +1,122 @@ +--- +name: ui-before-after +description: >- + Analyse a branch or PR and automatically capture before/after screenshots of + every UI surface its changes touch, then pixel-diff the pairs to surface what + actually changed and assemble PR-ready before/after montage images. Generic and + diff-driven: it derives the capture targets from the diff (changed tools/routes → + URLs) instead of hand-listing screens, captures "before" from the base branch and + "after" from the head, then keeps only the views that visually differ. Each + comparison is auto-cropped to the region that actually changed (the bounding box of + differing pixels), falling back to the full page only when the change spans most of + it. Use for before/after shots, a visual diff of a branch/PR, "screenshots for the + PR description", "show what changed in the UI", or a side-by-side of UI changes. + Takes a PR number/URL (resolved via gh) or a branch; defaults to the current branch + vs its base. Flags: --scope , --base , --theme + light|dark|both, --all (capture every route, not just changed), --no-autocrop, + --pagewide , --threshold . +argument-hint: "[PR# | PR-url | branch] [--scope ] [--base ] [--theme both] [--all] [--no-autocrop]" +allowed-tools: Read, Write, Edit, Glob, Grep, Bash +--- + +# UI Before / After (generic visual diff) + +Point it at a branch or PR; it figures out which UI changed, screenshots every +affected surface **before** (base) and **after** (head), pixel-diffs the pairs, and +montages the ones that actually changed into images for the PR description. + +`$ARGUMENTS`: a PR number/URL, a branch, or nothing (current branch vs base). +By default it captures the full viewport and auto-crops each comparison to the region +that changed. Flags: `--scope ` (narrow the *capture* to a container, e.g. +`[data-sidebar="tool-panel"]`, when you already know where the change is), +`--no-autocrop` (keep full frames), `--pagewide ` (above this share of the +page, skip cropping; default 0.6), `--base `, +`--theme light|dark|both`, `--all` (walk every route, not just changed), +`--threshold ` (diff sensitivity, default 0.001). + +Shares the capture harness with **ui-walkthrough** - read its SKILL.md for the +stubbed-Playwright setup, worktree node_modules + `generate-icons`, the +stale-`:5173` gotcha, and the dark-mode init-script. Bundled helpers: +[capture-spec.template.ts](capture-spec.template.ts), [diff-shots.mjs](diff-shots.mjs), +[montage-template.html](montage-template.html), [shoot-sections.mjs](shoot-sections.mjs). + +## Process + +### 1. Resolve target + base +``` +gh pr view --json number,title,headRefName,baseRefName,url,files # PR +# or branch: base = merge-base(main, HEAD); head = HEAD +gh pr diff --name-only # or: git diff --name-only ...HEAD +``` + +### 2. Derive capture targets from the diff (the "analyse" step - no hand-listing) +Map changed frontend files to URLs generically: +- **Tools**: a changed `components/tools//…` or `hooks/tools//…` → + toolId → URL via the repo's own rule `getToolUrlPath` in + [toolsTaxonomy.ts:200](frontend/editor/src/core/data/toolsTaxonomy.ts): `/` + the + id kebab-cased (`addPageNumbers` → `/add-page-numbers`). +- **Pages/routes**: changed `filesPage/*` → `/files`, etc. +- `--all`: enumerate every tool in the registry instead of just changed ones. +Write `frontend/editor/screenshots/ui-diff/targets.json` = +`[{ "id":"compress", "url":"/compress", "name":"Compress" }]`. This is what makes +it generic - the spec never names a tool. + +### 3. Capture AFTER (head) then BEFORE (base) +Copy [capture-spec.template.ts](capture-spec.template.ts) → +`src/core/tests/stubbed/ui-before-after.spec.ts` (it loops `targets.json`, seeds a +sample PDF so file-dependent panels render, navigates to each URL, and screenshots +the full viewport - or the `--scope` container if given). Ensure the harness is ready +(node_modules + icons). +``` +# after = current head +cd frontend/editor && PR_SHOT_SIDE=after PR_SHOT_THEME=light \ + npx playwright test --project=stubbed ui-before-after.spec.ts +# before = base, in an isolated worktree (copy the spec + targets.json in) +git worktree add ../ba-base origin/ # or the merge-base +# set up its frontend, copy spec + screenshots/ui-diff/targets.json across, then: +cd ../ba-base/frontend/editor && PR_SHOT_SIDE=before PR_SHOT_THEME=light \ + npx playwright test --project=stubbed ui-before-after.spec.ts +# copy its screenshots/ui-diff/before/ back next to after/. Repeat with +# PR_SHOT_THEME=dark if --theme includes dark. Remove worktree when done. +``` + +### 4. Auto-diff (surface what changed) +``` +cd frontend/editor && node /diff-shots.mjs \ + screenshots/ui-diff/before screenshots/ui-diff/after screenshots/ui-diff +``` +Produces `diff-report.json` classifying each view `unchanged | changed | added | +removed`. For each changed view it computes the bounding box of differing pixels and +writes cropped `__before_crop.png` / `__after_crop.png` / `__diff.png` to that region +(+ padding) - **unless** the change covers more than `--pagewide` of the frame, where +it keeps the full frame (`pageWide:true`). Drop `unchanged` - that's the noise the +user doesn't want. + +### 5. Montage the changes +Build the manifest from the non-unchanged entries (group by tab/tool; each becomes a +state row with before/after). For changed views use the cropped `cropBefore` / +`cropAfter` from `diff-report.json` (tight on the affected region; full frame when +`pageWide`); `added`/`removed` render the "not present" placeholder. Fill +[montage-template.html](montage-template.html) (replace the `window.__BA__` data +block; base64-inline the PNGs for portability), then render one PNG per section with +[shoot-sections.mjs](shoot-sections.mjs). Optionally include the `__diff.png` overlay +as a third column. + +### 6. Deliver +Output the `montage_.png` files + a short summary (N changed / added / removed, +M unchanged skipped) and a paste-ready Markdown block. GitHub has no PR-body image +API, so tell the user to drag the PNGs into the description. Do **not** post to the +PR. + +## Gotchas +- Two installs (base worktree + head); junction main's node_modules only if its deps + match that ref, else `npm ci` (see ui-walkthrough's stale-dep note). +- A view that errors on one side (refactored/removed) → that side is missing; the + diff marks it added/removed rather than failing the run. +- Pixel diff needs equal dimensions, so capture at a fixed viewport (the template + does); a view whose size changed is reported as "changed (dimensions differ)", + uncropped. +- Auto-crop uses a single bounding box, so two far-apart changes give one large crop + (or trip `--pagewide`); narrow with `--scope` if that happens. +- `getToolUrlPath` is the source of truth for tool URLs - use it, don't guess slugs. +- Don't commit `screenshots/`, the throwaway spec, or the base worktree. diff --git a/.claude/skills/ui-before-after/capture-spec.template.ts b/.claude/skills/ui-before-after/capture-spec.template.ts new file mode 100644 index 0000000000..fd8882915b --- /dev/null +++ b/.claude/skills/ui-before-after/capture-spec.template.ts @@ -0,0 +1,67 @@ +// Generic before/after capturer. NOT app-specific: it walks a targets.json that +// the ui-before-after skill generates from the branch/PR diff, so nothing here is +// hand-listed. Copy to src/core/tests/stubbed/ui-before-after.spec.ts, then run +// once per (side, theme): +// PR_SHOT_SIDE=after PR_SHOT_THEME=light \ +// npx playwright test --project=stubbed ui-before-after.spec.ts +// +// targets.json shape: [{ "id":"compress", "url":"/compress", "name":"Compress", +// "needsFile": true }] +import { test } from "@app/tests/helpers/stub-test-base"; +import type { Page } from "@playwright/test"; +import fs from "node:fs"; +import path from "node:path"; + +const SIDE = process.env.PR_SHOT_SIDE ?? "after"; +const THEME = process.env.PR_SHOT_THEME ?? "light"; +// Capture the full viewport by default so the affected region is in frame +// wherever it is; diff-shots.mjs crops each comparison to what actually changed. +// Set PR_SHOT_SCOPE to a selector to narrow the capture to one container. +const SCOPE = process.env.PR_SHOT_SCOPE ?? ""; +const ROOT = path.resolve(process.cwd(), "screenshots", "ui-diff"); +const OUT = path.join(ROOT, SIDE); +// A tiny sample PDF so file-dependent tool panels render. Point at a real fixture. +const SAMPLE_PDF = process.env.PR_SHOT_SAMPLE ?? "src/core/tests/test-fixtures/sample.pdf"; + +type Target = { id: string; url: string; name?: string; needsFile?: boolean }; +const targets: Target[] = JSON.parse(fs.readFileSync(path.join(ROOT, "targets.json"), "utf-8")); + +test.use({ autoGoto: false, viewport: { width: 1600, height: 900 }, seedJwt: true }); + +async function applyTheme(page: Page): Promise { + if (THEME !== "dark") return; + await page.addInitScript(() => { + localStorage.setItem("mantine-color-scheme", "dark"); + localStorage.setItem("mantine-color-scheme-value", "dark"); + }); + await page.emulateMedia({ colorScheme: "dark" }); +} + +async function seedFile(page: Page): Promise { + if (!fs.existsSync(SAMPLE_PDF)) return; + await page.goto("/", { waitUntil: "domcontentloaded" }); + await page.getByTestId("files-button").click().catch(() => {}); + await page.locator('[data-testid="file-input"]').setInputFiles(SAMPLE_PDF).catch(() => {}); + await page.locator(".file-sidebar-file-item").first().isVisible({ timeout: 8_000 }).catch(() => {}); +} + +for (const t of targets) { + // One test per target so a single failure doesn't drop the rest. + test(`${SIDE}/${THEME} ${t.id}`, async ({ page }) => { + fs.mkdirSync(OUT, { recursive: true }); + await applyTheme(page); + if (t.needsFile !== false) await seedFile(page); + await page.goto(t.url, { waitUntil: "domcontentloaded" }); + await page.waitForTimeout(400); // settle Mantine portals/transitions + const shot = path.join(OUT, `${t.id}__${THEME}.png`); + if (SCOPE) { + const scope = page.locator(SCOPE).first(); + if (await scope.isVisible({ timeout: 8_000 }).catch(() => false)) { + await scope.screenshot({ path: shot }); + return; + } + } + // Full viewport (fixed size → stable dimensions for pixel diffing). + await page.screenshot({ path: shot }); + }); +} diff --git a/.claude/skills/ui-before-after/diff-shots.mjs b/.claude/skills/ui-before-after/diff-shots.mjs new file mode 100644 index 0000000000..94ff5e2aad --- /dev/null +++ b/.claude/skills/ui-before-after/diff-shots.mjs @@ -0,0 +1,106 @@ +// Auto-diff before/ vs after/ screenshots, classify each as +// unchanged | changed | added | removed, and CROP each changed pair to the +// affected region (bounding box of differing pixels + padding) - unless the +// change spans most of the page, in which case the full frame is kept. +// Run from frontend/editor (so deps resolve): +// node /diff-shots.mjs [outDir] +// Env: +// DIFF_THRESHOLD min fraction of differing pixels to count as changed (default 0.001) +// DIFF_PAD padding px around the affected region (default 24) +// DIFF_PAGEWIDE if affected bbox area / image area exceeds this, keep full frame (default 0.6) +import fs from "node:fs"; +import path from "node:path"; +import { createRequire } from "node:module"; + +const require = createRequire(path.join(process.cwd(), "noop.js")); +const pm = require("pixelmatch"); +const pixelmatch = pm.default || pm; +const { PNG } = require("pngjs"); + +const beforeDir = path.resolve(process.argv[2]); +const afterDir = path.resolve(process.argv[3]); +const outDir = path.resolve(process.argv[4] || afterDir); +const THRESHOLD = Number(process.env.DIFF_THRESHOLD ?? "0.001"); +const PAD = Number(process.env.DIFF_PAD ?? "24"); +const PAGEWIDE = Number(process.env.DIFF_PAGEWIDE ?? "0.6"); + +const read = (p) => PNG.sync.read(fs.readFileSync(p)); +const isShot = (f) => f.endsWith(".png") && !/__(diff|before_crop|after_crop)\.png$/.test(f); +const list = (d) => (fs.existsSync(d) ? fs.readdirSync(d).filter(isShot) : []); +const names = [...new Set([...list(beforeDir), ...list(afterDir)])].sort(); +fs.mkdirSync(outDir, { recursive: true }); + +function cropPNG(src, x, y, w, h) { + const out = new PNG({ width: w, height: h }); + PNG.bitblt(src, out, x, y, w, h, 0, 0); + return out; +} +const writePNG = (p, png) => fs.writeFileSync(p, PNG.sync.write(png)); + +// Bounding box of differing pixels using a diff mask (alpha>0 where changed). +function changedBBox(before, after, w, h) { + const mask = new PNG({ width: w, height: h }); + pixelmatch(before.data, after.data, mask.data, w, h, { threshold: 0.1, diffMask: true }); + let minX = w, minY = h, maxX = -1, maxY = -1, count = 0; + for (let y = 0; y < h; y++) { + for (let x = 0; x < w; x++) { + if (mask.data[(y * w + x) * 4 + 3] > 0) { + count++; + if (x < minX) minX = x; if (x > maxX) maxX = x; + if (y < minY) minY = y; if (y > maxY) maxY = y; + } + } + } + return maxX < 0 ? null : { minX, minY, maxX, maxY, count }; +} + +const report = []; +for (const name of names) { + const id = name.replace(/\.png$/, ""); + const bp = path.join(beforeDir, name), ap = path.join(afterDir, name); + const hasB = fs.existsSync(bp), hasA = fs.existsSync(ap); + if (hasB && !hasA) { report.push({ id, status: "removed", before: bp }); continue; } + if (!hasB && hasA) { report.push({ id, status: "added", after: ap }); continue; } + + const before = read(bp), after = read(ap); + if (before.width !== after.width || before.height !== after.height) { + report.push({ id, status: "changed", note: "dimensions differ", before: bp, after: ap }); + continue; + } + const w = after.width, h = after.height; + const overlay = new PNG({ width: w, height: h }); + const px = pixelmatch(before.data, after.data, overlay.data, w, h, { threshold: 0.1 }); + const ratio = px / (w * h); + if (ratio <= THRESHOLD) { report.push({ id, status: "unchanged", ratio: Number(ratio.toFixed(5)), before: bp, after: ap }); continue; } + + const box = changedBBox(before, after, w, h); + // Pad + clamp the affected region. + const x = Math.max(0, box.minX - PAD), y = Math.max(0, box.minY - PAD); + const x2 = Math.min(w, box.maxX + 1 + PAD), y2 = Math.min(h, box.maxY + 1 + PAD); + const bw = x2 - x, bh = y2 - y; + const pageWide = (bw * bh) / (w * h) > PAGEWIDE; + + const entry = { id, status: "changed", ratio: Number(ratio.toFixed(5)), before: bp, after: ap, pageWide }; + if (pageWide) { + // Change spans most of the page - keep the full frame, full overlay. + const dp = path.join(outDir, `${id}__diff.png`); writePNG(dp, overlay); + entry.diff = dp; + } else { + entry.bbox = { x, y, w: bw, h: bh }; + const cb = path.join(outDir, `${id}__before_crop.png`); writePNG(cb, cropPNG(before, x, y, bw, bh)); + const ca = path.join(outDir, `${id}__after_crop.png`); writePNG(ca, cropPNG(after, x, y, bw, bh)); + const dp = path.join(outDir, `${id}__diff.png`); writePNG(dp, cropPNG(overlay, x, y, bw, bh)); + entry.cropBefore = cb; entry.cropAfter = ca; entry.diff = dp; + } + report.push(entry); +} + +fs.writeFileSync(path.join(outDir, "diff-report.json"), JSON.stringify(report, null, 2)); +const changed = report.filter((r) => r.status !== "unchanged"); +console.log(`diffed ${report.length} view(s): ${changed.length} changed/added/removed, ${report.length - changed.length} unchanged`); +for (const r of changed) { + const tail = r.status !== "changed" ? "" + : r.pageWide ? " (page-wide → full frame)" + : ` (${(r.ratio * 100).toFixed(2)}%, cropped to ${r.bbox.w}×${r.bbox.h})`; + console.log(` ${r.status.padEnd(9)} ${r.id}${tail}${r.note ? " - " + r.note : ""}`); +} diff --git a/.claude/skills/ui-before-after/make_example.py b/.claude/skills/ui-before-after/make_example.py new file mode 100644 index 0000000000..ec5eeee029 --- /dev/null +++ b/.claude/skills/ui-before-after/make_example.py @@ -0,0 +1,48 @@ +"""Build EXAMPLE.html from montage-template.html using REAL files-page shots as +stand-in before/after pairs (layout demo, not an actual PR diff). Inlines PNGs as +data URIs so the HTML is portable. Run: python make_example.py""" +import base64 +import json +import pathlib +import re + +HERE = pathlib.Path(__file__).parent +SHOTS = pathlib.Path( + r"C:\Users\systo\git\Stirling-PDFNew\.claude\worktrees\kind-faraday-522a30" + r"\frontend\editor\screenshots\files-page" +) + + +def uri(fname): + p = SHOTS / fname + return "data:image/png;base64," + base64.b64encode(p.read_bytes()).decode() if p.exists() else None + + +data = { + "pr": "DEMO", + "title": "EXAMPLE — before/after montage (layout demo, real Files-page shots; not a real PR diff)", + "base": "main", "head": "demo-branch", + "cropSelector": "[data-sidebar=\"tool-panel\"] (real runs crop to the side; these demo shots are full-page)", + "tabs": [ + {"id": "files", "title": "Files page", "ctx": "Each row = one flow state; left = base branch, right = this PR.", + "states": [ + {"name": "Empty folder", "before": uri("01_empty_state_ctas.png"), "after": uri("02_empty_state_storage_off.png")}, + {"name": "Files + details panel", "before": uri("03_subtoolbar_with_files.png"), "after": uri("06_details_panel_save_to_server.png")}, + {"name": "Delete folder confirm", "before": None, "after": uri("19_delete_folder_dialog.png"), "note": "New in this PR"}, + ]}, + {"id": "move", "title": "Move-to-folder dialog", + "states": [ + {"name": "Dialog opened", "before": uri("07_move_dialog_collapsed.png"), "after": uri("08_move_dialog_create_folder_expanded.png")}, + {"name": "After folder created", "before": None, "after": uri("08b_move_dialog_after_create_folder.png"), "note": "New flow"}, + ]}, + ], +} + +tpl = (HERE / "montage-template.html").read_text(encoding="utf-8") +out = re.sub( + r"/\*__DATA__\*/.*?/\*__END__\*/", + lambda _m: "/*__DATA__*/" + json.dumps(data) + "/*__END__*/", + tpl, count=1, flags=re.S, +) +(HERE / "EXAMPLE.html").write_text(out, encoding="utf-8") +print("wrote", HERE / "EXAMPLE.html", "(", (HERE / "EXAMPLE.html").stat().st_size // 1024, "KB )") diff --git a/.claude/skills/ui-before-after/montage-template.html b/.claude/skills/ui-before-after/montage-template.html new file mode 100644 index 0000000000..ca0f69d4cf --- /dev/null +++ b/.claude/skills/ui-before-after/montage-template.html @@ -0,0 +1,106 @@ + + + + + +Before / After + + + +
+ + + + + diff --git a/.claude/skills/ui-before-after/shoot-sections.mjs b/.claude/skills/ui-before-after/shoot-sections.mjs new file mode 100644 index 0000000000..504e531998 --- /dev/null +++ b/.claude/skills/ui-before-after/shoot-sections.mjs @@ -0,0 +1,25 @@ +// Render each .tab-section of a montage HTML into its own PNG (the PR-ready image). +// Run from frontend/editor (so @playwright/test resolves): +// node /shoot-sections.mjs +import path from "node:path"; +import { pathToFileURL } from "node:url"; +import { createRequire } from "node:module"; + +const require = createRequire(path.join(process.cwd(), "noop.js")); +const { chromium } = require("@playwright/test"); + +const htmlPath = path.resolve(process.argv[2]); +const outDir = path.resolve(process.argv[3] || path.dirname(htmlPath)); + +const browser = await chromium.launch(); +const page = await browser.newPage({ viewport: { width: 1200, height: 1200 }, deviceScaleFactor: 2 }); +await page.goto(pathToFileURL(htmlPath).href, { waitUntil: "load" }); +await page.waitForTimeout(250); // let images/fonts paint +const ids = await page.$$eval(".tab-section", (els) => els.map((e) => e.id)); +if (!ids.length) { console.error("no .tab-section found"); process.exit(1); } +for (const id of ids) { + const name = id.replace(/^section-/, ""); + await page.locator("#" + id).screenshot({ path: path.join(outDir, `montage_${name}.png`) }); + console.log("wrote montage_" + name + ".png"); +} +await browser.close(); diff --git a/.claude/skills/ui-walkthrough/SKILL.md b/.claude/skills/ui-walkthrough/SKILL.md new file mode 100644 index 0000000000..ef6d4b9dec --- /dev/null +++ b/.claude/skills/ui-walkthrough/SKILL.md @@ -0,0 +1,120 @@ +--- +name: ui-walkthrough +description: >- + Full UI investigation of the current branch's feature. Enumerates every view + and state (empty, populated, loading, error, each dialog/menu/panel, responsive + breakpoints, light + dark + RTL), captures them with the stubbed Playwright + harness, assembles a single-image HTML walkthrough with a global light/dark + toggle slider, then runs two review passes: visual/consistency (alignment, + spacing, professionalism, dark/light parity, contrast, truncation) and + UX/ease-of-use (flow, discoverability, affordances, empty/error states, + expectations). Use when asked for a UI walkthrough, screenshot review, design + or QA pass, "find anywhere to make it easier/better for users", or before + merging frontend work. Pass --fix to auto-apply safe frontend fixes and + re-capture; --theme to limit themes; --no-rtl to skip RTL. +argument-hint: "[feature/area] [--fix] [--theme light|dark|both] [--no-rtl] [--breakpoints]" +allowed-tools: Read, Write, Edit, Glob, Grep, Bash +--- + +# UI Walkthrough + +Produce a reviewable HTML walkthrough of a feature's UI in every state and theme, +then critique it. Optionally auto-fix and re-capture. + +`$ARGUMENTS` may name the feature/area to focus on. If empty, scope from the +current branch diff. Flags: `--fix`, `--theme light|dark|both` (default both), +`--no-rtl`, `--breakpoints` (also capture phone/narrow widths). + +## What this repo gives you (use it, don't reinvent) + +- **Stubbed Playwright project** = backend-free screenshots via `page.route()` mocks. + Reference implementation: `frontend/editor/src/core/tests/stubbed/files-page-screenshots.spec.ts`. + It already shows the light / **dark** / **RTL** passes, JWT seeding, IndexedDB + seeding, and dumping PNGs to a `screenshots//` folder. Copy its shape. +- Helpers: `frontend/editor/src/core/tests/helpers/ui-helpers.ts` + (`uploadFiles`, `openSettings`, `waitForModalOpen`, `dismissTourTooltip`, …) + and the `stub-test-base` fixtures (`autoGoto`, `seedJwt`, `viewport`). +- Config: `frontend/editor/playwright.config.ts` (run from `frontend/editor/`). +- Report template: [report-template.html](report-template.html) - self-contained, + one big image at a time, a global light/dark slider that flips every shot, + thumbnail rail, prev/next + arrow keys, and a Findings tab. + +## Process + +### 1. Scope the feature +- If `$ARGUMENTS` is empty: `git diff --name-only main...HEAD` and read the PR/commits. + Identify changed pages, tools (`core/components/tools/` or `core/tools/`), + dialogs, panels, and routes. +- Enumerate **every view and state** to capture, e.g.: + empty / populated / loading / error / disabled; each dialog, menu, popover, tooltip; + each tab or step; selection + multi-select; success/result panel; and (if relevant) + permission/role variants. Write the list down before capturing - it's the report's spine. + +### 2. Prepare the harness (worktree-safe) +Worktrees have no `node_modules` and no generated icons. From repo root: +``` +cd frontend && npm ci # or junction main's node_modules (see memory) +cd frontend/editor && node scripts/generate-icons.js +``` +Kill any stale dev server first (it serves old modules): +`Get-NetTCPConnection -LocalPort 5173 -State Listen | %{ Stop-Process -Id $_.OwningProcess -Force }` + +### 3. Write the capture spec +Create `frontend/editor/src/core/tests/stubbed/-walkthrough.spec.ts`, +modeled on `files-page-screenshots.spec.ts`. For each enumerated view: +- stub the APIs it needs, drive the UI to that state, wait on a real locator + (not a fixed sleep), `await settle(page)` for Mantine portals, then + `page.screenshot({ path: shotPath("NN_name_") })`. +- Capture each view in **light and dark** (and RTL unless `--no-rtl`). Reuse the + `enableDarkMode` / `enableRtl` init-script pattern from the reference spec + (`localStorage["mantine-color-scheme"]="dark"` + `emulateMedia({colorScheme:"dark"})`). +- Name shots `NN__.png` so light/dark pair up by suffix. +- Prefer **stable test-ids** over translated accessible names (RTL/i18n breaks text locators). + +Run it: `cd frontend/editor && npx playwright test --project=stubbed -walkthrough.spec.ts`. +Add `--project=stubbed-firefox`/`-webkit` only if cross-browser layout matters. + +### 4. Build the report +- Copy `report-template.html` to `screenshots//walkthrough.html` (so the + relative `screenshots/...` image paths resolve, or rewrite paths to sit beside it). +- Build the manifest and inject it: replace the JSON between the + `/*__DATA__*/` … `/*__END__*/` markers with one `views[]` entry per view + (`{id,title,light,dark,viewport,notes}`) and an empty `findings` object you'll + fill in step 5. Keep `light`/`dark` as relative paths. +- The toggle slider answers the "one big image + flip light/dark for all" request: + it shows a single large screenshot, and switching the slider re-themes every view. + +### 5. Review pass 1 - visual & consistency +Open each screenshot (Read the PNG) and judge against the others: +alignment & spacing rhythm, control placement, button hierarchy, typography, +**light/dark parity** (contrast, invisible borders, washed-out text, wrong tokens), +truncation/overflow, RTL mirroring, focus states, icon consistency, professional polish. +Record each issue as a finding `{severity:high|med|low, view, title, detail, fix}`. + +### 6. Review pass 2 - UX & ease of use +Walk the flow as a first-time user: discoverability, number of steps, affordance +clarity, empty-state guidance, error recovery, destructive-action confirmation, +defaults, loading feedback, mobile reachability, accessible names, and whether the +UI matches user expectations for this kind of tool. Record findings the same way. + +Write both finding lists into the report's `findings.visual` / `findings.ux`, +and add short per-view `notes`. Re-inject the manifest. + +### 7. If `--fix` +Only safe, self-contained frontend fixes (spacing, alignment, tokens, missing +dark-mode colors, labels, aria, obvious copy). For each: edit the component/CSS, +mark the finding `fixed:true` with what changed, then **re-run the spec** to +re-capture the affected shots and regenerate the report. Run `task frontend:check`. +Leave anything risky or ambiguous as a finding, not a change. + +### 8. Deliver +Tell the user the report path and give a tight chat summary: N views × +themes captured, top findings by severity, and (if `--fix`) what changed. +Optionally `SendUserFile` the `walkthrough.html`. + +## Gotchas +- Stale `:5173` server serves old bundles - kill it before capturing (see step 2). +- Missing `material-symbols-icons.json` → blank app → every shot times out. Run + `generate-icons.js` first. +- `await settle(page)` before shots or portals/transitions tear mid-capture. +- Don't commit the generated `screenshots/` or the throwaway spec unless asked. diff --git a/.claude/skills/ui-walkthrough/make_example.py b/.claude/skills/ui-walkthrough/make_example.py new file mode 100644 index 0000000000..b65c2a010a --- /dev/null +++ b/.claude/skills/ui-walkthrough/make_example.py @@ -0,0 +1,116 @@ +"""Build a self-contained EXAMPLE.html from report-template.html with mock +light/dark screenshots, so the viewer + global theme slider can be demoed +without a real capture run. Run: python make_example.py""" +import base64 +import json +import pathlib +import re + +HERE = pathlib.Path(__file__).parent + + +def svg(bg, fg, panel, accent, muted, label, kind): + """A simple fake 'screen' SVG: title bar, sidebar, content varies by kind.""" + parts = [ + f'', + f'', + # top bar + f'', + f'', + f'', + f'', + # left sidebar + f'', + ] + for i in range(6): + y = 100 + i * 56 + parts.append(f'') + if kind == "empty": + parts += [ + f'', + f'', + f'{label}', + ] + elif kind == "form": + for i in range(4): + y = 140 + i * 90 + parts.append(f'') + parts.append(f'') + parts.append(f'') + parts.append(f'{label}') + else: # dialog + parts += [ + f'', + f'', + f'', + f'', + f'', + f'', + f'', + f'{label}', + ] + parts.append("") + return "".join(parts) + + +def data_uri(s): + return "data:image/svg+xml;base64," + base64.b64encode(s.encode()).decode() + + +LIGHT = dict(bg="#ffffff", fg="#111418", panel="#f1f3f6", accent="#2f6fed", muted="#c2c8d0") +DARK = dict(bg="#16181c", fg="#000000", panel="#1f232a", accent="#5b8cff", muted="#3a414b") + + +def pair(kind, label): + return ( + data_uri(svg(LIGHT["bg"], LIGHT["fg"], LIGHT["panel"], LIGHT["accent"], LIGHT["muted"], label, kind)), + data_uri(svg(DARK["bg"], DARK["fg"], DARK["panel"], DARK["accent"], DARK["muted"], label, kind)), + ) + + +views = [] +for idx, (kind, title, label) in enumerate([ + ("empty", "Empty state", "Drop a PDF to start"), + ("form", "Tool options panel", "Compress options"), + ("dialog", "Confirm dialog", "Replace original file?"), +], start=1): + light, dark = pair(kind, label) + views.append({ + "id": f"{idx:02d}_{kind}", + "title": title, + "light": light, + "dark": dark, + "viewport": "1600x900", + "notes": ["This is mock data to demo the viewer."], + }) + +data = { + "feature": "EXAMPLE - Compress PDF (mock data)", + "branch": "demo", + "generated": "example", + "views": views, + "findings": { + "visual": [ + {"severity": "high", "view": "03_dialog", "title": "Dialog buttons too close", + "detail": "Cancel/Confirm have only 8px gap; easy to misclick.", + "fix": "Increase gap to var(--mantine-spacing-md)."}, + {"severity": "low", "view": "02_form", "title": "Field labels low contrast in dark mode", + "detail": "Muted token fails WCAG AA on the dark panel.", + "fix": "Use --mantine-color-dimmed instead of a hard-coded grey."}, + ], + "ux": [ + {"severity": "med", "view": "01_empty", "title": "Primary CTA below the dropzone", + "detail": "Users expect the action button adjacent to the dropzone.", + "fix": "Move the button directly under the dashed zone."}, + ], + }, +} + +tpl = (HERE / "report-template.html").read_text(encoding="utf-8") +out = re.sub( + r"/\*__DATA__\*/.*?/\*__END__\*/", + lambda _m: "/*__DATA__*/" + json.dumps(data) + "/*__END__*/", + tpl, count=1, flags=re.S, +) +(HERE / "EXAMPLE.html").write_text(out, encoding="utf-8") +print("wrote", (HERE / "EXAMPLE.html")) diff --git a/.claude/skills/ui-walkthrough/report-template.html b/.claude/skills/ui-walkthrough/report-template.html new file mode 100644 index 0000000000..3e96216a3b --- /dev/null +++ b/.claude/skills/ui-walkthrough/report-template.html @@ -0,0 +1,298 @@ + + + + + + +UI Walkthrough + + + +
+
+

UI Walkthrough

+
+
+
+
+ + +
+
+ +
+ +
+ +
+
+ + +
+ +
+
+

+
+
    +
    +
    +
    + +
    + + + + + diff --git a/.github/aur/stirling-pdf-desktop/PKGBUILD b/.github/aur/stirling-pdf-desktop/PKGBUILD index c02bde345e..5d92425b19 100644 --- a/.github/aur/stirling-pdf-desktop/PKGBUILD +++ b/.github/aur/stirling-pdf-desktop/PKGBUILD @@ -1,6 +1,6 @@ # Maintainer: Stirling PDF Inc pkgname=stirling-pdf-desktop -pkgver=2.14.0 +pkgver=2.14.1 pkgrel=1 pkgdesc="Locally hosted, web-based PDF manipulation tool (Tauri desktop app, official Stirling PDF Inc build)" arch=('x86_64') diff --git a/.github/aur/stirling-pdf-server-bin/PKGBUILD b/.github/aur/stirling-pdf-server-bin/PKGBUILD index c73b1c5087..f5a2bf3c6c 100644 --- a/.github/aur/stirling-pdf-server-bin/PKGBUILD +++ b/.github/aur/stirling-pdf-server-bin/PKGBUILD @@ -1,6 +1,6 @@ # Maintainer: Stirling PDF Inc pkgname=stirling-pdf-server-bin -pkgver=2.14.0 +pkgver=2.14.1 pkgrel=1 pkgdesc="Locally hosted, web-based PDF manipulation tool (server JAR, prebuilt)" arch=('any') diff --git a/.github/config/.files.yaml b/.github/config/.files.yaml index 2d617f8f20..5e85976937 100644 --- a/.github/config/.files.yaml +++ b/.github/config/.files.yaml @@ -87,6 +87,21 @@ engine: &engine - Taskfile.yml - .taskfiles/engine.yml +# Files that can make the committed generated API models (frontend tool API +# types + engine tool models) go stale: the Java tool surfaces they derive from, +# the generators, the generated files themselves (to catch a hand-edit), and the +# tasks that drive generation. Deliberately excludes the broad frontend/docker/ +# testing globs, so a CSS-only PR does not boot the backend to rebuild the spec. +generated-models: &generated-models + - *openapi + - frontend/editor/scripts/generate-tool-api-types.mts + - frontend/editor/src/core/types/toolApiTypes.ts + - engine/scripts/generate_tool_models.py + - engine/src/stirling/models/tool_models.py + - .taskfiles/frontend.yml + - .taskfiles/engine.yml + - .github/workflows/check-generated-models.yml + licenses-frontend: &licenses-frontend - ".github/workflows/frontend-backend-licenses-update.yml" - "frontend/package.json" diff --git a/.github/workflows/PR-Auto-Deploy-V2.yml b/.github/workflows/PR-Auto-Deploy-V2.yml index b6ab8d34c8..31135cfb4b 100644 --- a/.github/workflows/PR-Auto-Deploy-V2.yml +++ b/.github/workflows/PR-Auto-Deploy-V2.yml @@ -116,6 +116,9 @@ jobs: env: USE_DEPOT: ${{ needs.pick.outputs.is_fork != 'true' }} DEPOT_TOKEN: ${{ secrets.DEPOT_TOKEN }} + # Single source of truth for whether this preview embeds the admin portal: + # drives the image build-arg and the deployment comment. + BUILD_PORTAL: "true" steps: - name: Harden Runner @@ -246,7 +249,9 @@ jobs: file: ./docker/embedded/Dockerfile push: true tags: ${{ secrets.DOCKER_HUB_USERNAME }}/test:v2-${{ steps.commit-hash.outputs.app_short }} - build-args: VERSION_TAG=v2-alpha + build-args: | + VERSION_TAG=v2-alpha + BUILD_PORTAL=${{ env.BUILD_PORTAL }} platforms: linux/amd64 - name: Build and push V2 image (Docker fork fallback) @@ -259,7 +264,9 @@ jobs: cache-from: type=gha,scope=stirling-pdf-latest cache-to: type=gha,mode=max,scope=stirling-pdf-latest tags: ${{ secrets.DOCKER_HUB_USERNAME }}/test:v2-${{ steps.commit-hash.outputs.app_short }} - build-args: VERSION_TAG=v2-alpha + build-args: | + VERSION_TAG=v2-alpha + BUILD_PORTAL=${{ env.BUILD_PORTAL }} platforms: linux/amd64 - name: Set up SSH @@ -290,6 +297,8 @@ jobs: - /stirling/V2-PR-${{ needs.check-pr.outputs.pr_number }}/storage:/storage:rw environment: DISABLE_ADDITIONAL_FEATURES: "false" + POLICIES_ENABLED: "true" + STIRLING_BILLING_ACCOUNT_LINK_ENABLED: "true" SECURITY_ENABLELOGIN: "true" SECURITY_INITIALLOGIN_USERNAME: "${{ secrets.TEST_LOGIN_USERNAME }}" SECURITY_INITIALLOGIN_PASSWORD: "${{ secrets.TEST_LOGIN_PASSWORD }}" @@ -359,12 +368,19 @@ jobs: } const deploymentUrl = `http://${{ secrets.NEW_VPS_HOST }}:${v2Port}`; - const httpsUrl = `https://${v2Port}.ssl.stirlingpdf.cloud`; + + // Only mention the portal when this image actually embeds it. + // Use the direct IP URL - the SSL hostname isn't supported yet. + const withPortal = "${{ env.BUILD_PORTAL }}" === "true"; + const portalNote = withPortal + ? `🧩 **Admin portal** included - try it at [${deploymentUrl}/portal](${deploymentUrl}/portal).\n\n` + : ``; const commentBody = `## 🚀 V2 Auto-Deployment Complete!\n\n` + `Your V2 PR with embedded architecture has been deployed!\n\n` + `🔗 **Direct Test URL (non-SSL)** [${deploymentUrl}](${deploymentUrl})\n\n` + - `🔐 **Secure HTTPS URL**: [${httpsUrl}](${httpsUrl})\n\n` + + `🔐 **Secure HTTPS URL**: unsupported currently\n\n` + + portalNote + `_This deployment will be automatically cleaned up when the PR is closed._\n\n` + `🔄 **Auto-deployed** for approved V2 contributors.`; diff --git a/.github/workflows/ai-engine.yml b/.github/workflows/ai-engine.yml index e95cbf20e3..554100f535 100644 --- a/.github/workflows/ai-engine.yml +++ b/.github/workflows/ai-engine.yml @@ -1,9 +1,9 @@ name: AI Engine CI -# Validates the Python AI engine: regenerates tool models and runs the -# engine quality gate (lint, type-check, format-check, tests). Called from -# build.yml on PRs and merge_group; also runs directly on push to main as -# a post-merge safety net. +# Runs the engine quality gate (lint, type-check, format-check, tests). Called +# from build.yml on PRs and merge_group; also runs directly on push to main as +# a post-merge safety net. Freshness of the generated tool_models.py is checked +# by the shared check-generated-models workflow. on: workflow_call: push: @@ -34,104 +34,9 @@ jobs: with: enable-cache: true - - name: Set up JDK 25 - uses: actions/setup-java@be666c2fcd27ec809703dec50e508c2fdc7f6654 # v5.2.0 - with: - java-version: "25" - distribution: "temurin" - - - name: Setup Gradle - uses: gradle/actions/setup-gradle@50e97c2cd7a37755bbfafc9c5b7cafaece252f6e # v6.1.0 - with: - gradle-version: 9.6.1 - - name: Install Task uses: go-task/setup-task@01a4adf9db2d14c1de7a560f09170b6e0df736aa # v2.1.0 - - name: Regenerate tool models - run: task engine:tool-models - - - name: Verify tool models are up to date - id: tool-models-check - continue-on-error: true - run: git diff --exit-code engine/src/stirling/models/tool_models.py - - - name: Comment on tool models check failure - # Only post a comment on PRs. github-script's PR helpers need an - # issue/PR number, which doesn't exist on merge_group runs. - if: steps.tool-models-check.outcome == 'failure' && github.event_name == 'pull_request' - continue-on-error: true - uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0 - with: - script: | - const marker = ''; - const body = [ - marker, - '### Tool Models Check Failed', - '', - 'The generated `engine/src/stirling/models/tool_models.py` is out of date with the Java OpenAPI spec and will need to be regenerated before it can be merged in.', - '', - 'Run `task engine:tool-models` to regenerate, then commit the updated file.', - ].join('\n'); - const { data: comments } = await github.rest.issues.listComments({ - owner: context.repo.owner, - repo: context.repo.repo, - issue_number: context.issue.number, - }); - const existing = comments.find(c => c.body.includes(marker)); - if (existing) { - await github.rest.issues.updateComment({ - owner: context.repo.owner, - repo: context.repo.repo, - comment_id: existing.id, - body, - }); - } else { - await github.rest.issues.createComment({ - owner: context.repo.owner, - repo: context.repo.repo, - issue_number: context.issue.number, - body, - }); - } - - - name: Fail if tool models check failed - if: steps.tool-models-check.outcome == 'failure' - run: | - echo "============================================" - echo " Tool Models Check Failed" - echo "============================================" - echo "" - echo "The generated engine/src/stirling/models/tool_models.py" - echo "is out of date with the Java OpenAPI spec and will" - echo "need to be regenerated before it can be merged in." - echo "" - echo "Run 'task engine:tool-models' to regenerate, then" - echo "commit the updated file." - echo "============================================" - exit 1 - - - name: Remove tool models check comment on success - if: steps.tool-models-check.outcome == 'success' && github.event_name == 'pull_request' - continue-on-error: true - uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0 - with: - script: | - const marker = ''; - const { data: comments } = await github.rest.issues.listComments({ - owner: context.repo.owner, - repo: context.repo.repo, - issue_number: context.issue.number, - }); - const existing = comments.find(c => c.body.includes(marker)); - if (existing) { - await github.rest.issues.deleteComment({ - owner: context.repo.owner, - repo: context.repo.repo, - comment_id: existing.id, - }); - } - - name: Quality-check engine id: engine-check run: task engine:check diff --git a/.github/workflows/build-enterprise.yml b/.github/workflows/build-enterprise.yml index 99b3b127a4..9e1a4efb83 100644 --- a/.github/workflows/build-enterprise.yml +++ b/.github/workflows/build-enterprise.yml @@ -167,6 +167,8 @@ jobs: wait_for_backend - name: Run enterprise OAuth Playwright tests id: oauth-tests + env: + PLAYWRIGHT_JSON_OUTPUT_FILE: ${{ github.workspace }}/frontend/playwright-report/results-oauth.json run: task e2e:enterprise -- --grep "OAuth" - name: Stop backend + tear down OAuth Keycloak if: always() @@ -240,6 +242,8 @@ jobs: wait_for_backend - name: Run enterprise SAML Playwright tests id: saml-tests + env: + PLAYWRIGHT_JSON_OUTPUT_FILE: ${{ github.workspace }}/frontend/playwright-report/results-saml.json run: task e2e:enterprise -- --grep "SAML" - name: Stop backend + tear down SAML Keycloak if: always() @@ -270,6 +274,8 @@ jobs: wait_for_backend - name: Run enterprise feature Playwright tests id: feature-tests + env: + PLAYWRIGHT_JSON_OUTPUT_FILE: ${{ github.workspace }}/frontend/playwright-report/results-feature.json run: task e2e:enterprise -- --grep "Enterprise license" - name: Print backend log on failure if: failure() @@ -282,6 +288,19 @@ jobs: run: | source /tmp/helpers.sh stop_backend + - name: Flag flaky tests + # Runs regardless of the test outcomes: a flaky test (passed on retry) + # leaves its step green, so this is the only place it surfaces. Merges + # all three phase reports (some may be absent if an earlier phase hard- + # failed and skipped the rest). Emits ::warning:: annotations + a job + # summary; never fails the job. + if: always() + working-directory: frontend + run: > + npx tsx editor/scripts/report-flaky-tests.mts + "${{ github.workspace }}/frontend/playwright-report/results-oauth.json" + "${{ github.workspace }}/frontend/playwright-report/results-saml.json" + "${{ github.workspace }}/frontend/playwright-report/results-feature.json" - name: Upload Playwright report if: always() uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1 diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index 0e0a702cc2..8142c37fca 100644 --- a/.github/workflows/build.yml +++ b/.github/workflows/build.yml @@ -43,6 +43,7 @@ jobs: docker-base: ${{ steps.changes.outputs.docker-base }} tauri: ${{ steps.changes.outputs.tauri }} engine: ${{ steps.changes.outputs.engine }} + generated-models: ${{ steps.changes.outputs.generated-models }} proprietary: ${{ steps.changes.outputs.proprietary }} steps: - name: Harden the runner (Audit all outbound calls) @@ -171,6 +172,20 @@ jobs: uses: ./.github/workflows/ai-engine.yml secrets: inherit + # The generated frontend types and engine tool models are both derived from + # the Java OpenAPI spec. This job regenerates and diffs them; it boots the + # backend, so it is gated on the narrow generated-models filter (spec source, + # generators, generated files, generation tasks) rather than the broad + # frontend filter, so a CSS-only PR does not pay for a backend build. + generated-models: + if: needs.files-changed.outputs.generated-models == 'true' + needs: [files-changed] + permissions: + contents: read + pull-requests: write + uses: ./.github/workflows/check-generated-models.yml + secrets: inherit + pre-commit: needs: [files-changed] permissions: @@ -228,6 +243,7 @@ jobs: - test-build-docker-images - tauri-build - ai-engine + - generated-models - pre-commit - dependency-review runs-on: ubuntu-latest @@ -253,6 +269,7 @@ jobs: test-build-docker-images=${{ needs.test-build-docker-images.result }} tauri-build=${{ needs.tauri-build.result }} ai-engine=${{ needs.ai-engine.result }} + generated-models=${{ needs.generated-models.result }} pre-commit=${{ needs.pre-commit.result }} dependency-review=${{ needs.dependency-review.result }} run: | diff --git a/.github/workflows/check-generated-models.yml b/.github/workflows/check-generated-models.yml new file mode 100644 index 0000000000..db9c49fba2 --- /dev/null +++ b/.github/workflows/check-generated-models.yml @@ -0,0 +1,148 @@ +name: Check generated models + +# Verifies the committed generated API models are still in sync with the Java +# OpenAPI spec: the frontend tool API types +# (frontend/editor/src/core/types/toolApiTypes.ts) and the engine tool +# models (engine/src/stirling/models/tool_models.py). Regenerates both with the +# single top-level `task tool-models` and fails if either committed file is +# out of date. Called from build.yml when the backend Java, frontend, or engine +# changes; also runs on push to main as a post-merge safety net. +on: + workflow_call: + push: + branches: [main] + +permissions: + contents: read + +jobs: + generated-models: + runs-on: ubuntu-latest + permissions: + contents: read + pull-requests: write + env: + DEPOT_TOKEN: ${{ secrets.DEPOT_TOKEN }} + steps: + - name: Harden the runner (Audit all outbound calls) + uses: step-security/harden-runner@ab7a9404c0f3da075243ca237b5fac12c98deaa5 # v2.19.3 + with: + egress-policy: audit + + - name: Checkout code + uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2 + + - name: Install uv + uses: astral-sh/setup-uv@fac544c07dec837d0ccb6301d7b5580bf5edae39 # v8.2.0 + with: + enable-cache: true + + - name: Set up JDK 25 + uses: actions/setup-java@be666c2fcd27ec809703dec50e508c2fdc7f6654 # v5.2.0 + with: + java-version: "25" + distribution: "temurin" + + - name: Setup Gradle + uses: gradle/actions/setup-gradle@50e97c2cd7a37755bbfafc9c5b7cafaece252f6e # v6.1.0 + with: + gradle-version: 9.6.0 + + - name: Set up Node + uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0 + with: + node-version: "22" + cache: "npm" + cache-dependency-path: frontend/package-lock.json + + - name: Install Task + uses: go-task/setup-task@01a4adf9db2d14c1de7a560f09170b6e0df736aa # v2.1.0 + + # Rebuilds the OpenAPI spec from the current Java and regenerates both the + # frontend types and the engine tool models from it. + - name: Regenerate generated models + run: task tool-models + + - name: Verify generated models are up to date + id: models-check + continue-on-error: true + run: | + git diff --exit-code \ + frontend/editor/src/core/types/toolApiTypes.ts \ + engine/src/stirling/models/tool_models.py + + - name: Comment on generated models check failure + # Only post a comment on PRs. github-script's PR helpers need an + # issue/PR number, which doesn't exist on merge_group runs. + if: steps.models-check.outcome == 'failure' && github.event_name == 'pull_request' + continue-on-error: true + uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0 + with: + script: | + const marker = ''; + const body = [ + marker, + '### Generated Models Check Failed', + '', + 'The generated `frontend/editor/src/core/types/toolApiTypes.ts` and/or `engine/src/stirling/models/tool_models.py` are out of date with the Java OpenAPI spec and will need to be regenerated before they can be merged in.', + '', + 'Run `task tool-models` to regenerate both, then commit the updated files.', + ].join('\n'); + const { data: comments } = await github.rest.issues.listComments({ + owner: context.repo.owner, + repo: context.repo.repo, + issue_number: context.issue.number, + }); + const existing = comments.find(c => c.body.includes(marker)); + if (existing) { + await github.rest.issues.updateComment({ + owner: context.repo.owner, + repo: context.repo.repo, + comment_id: existing.id, + body, + }); + } else { + await github.rest.issues.createComment({ + owner: context.repo.owner, + repo: context.repo.repo, + issue_number: context.issue.number, + body, + }); + } + + - name: Fail if generated models check failed + if: steps.models-check.outcome == 'failure' + run: | + echo "============================================" + echo " Generated Models Check Failed" + echo "============================================" + echo "" + echo "The generated frontend API types and/or engine tool" + echo "models are out of date with the Java OpenAPI spec and" + echo "will need to be regenerated before they can be merged in." + echo "" + echo "Run 'task tool-models' to regenerate both, then" + echo "commit the updated files." + echo "============================================" + exit 1 + + - name: Remove generated models check comment on success + if: steps.models-check.outcome == 'success' && github.event_name == 'pull_request' + continue-on-error: true + uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0 + with: + script: | + const marker = ''; + const { data: comments } = await github.rest.issues.listComments({ + owner: context.repo.owner, + repo: context.repo.repo, + issue_number: context.issue.number, + }); + const existing = comments.find(c => c.body.includes(marker)); + if (existing) { + await github.rest.issues.deleteComment({ + owner: context.repo.owner, + repo: context.repo.repo, + comment_id: existing.id, + }); + } diff --git a/.github/workflows/e2e-live.yml b/.github/workflows/e2e-live.yml index 44d5443a73..57a4357dad 100644 --- a/.github/workflows/e2e-live.yml +++ b/.github/workflows/e2e-live.yml @@ -62,7 +62,17 @@ jobs: # .test-state/playwright/coverage-pw/ for the post-process step # to aggregate. Chromium-only - other engines silently skip. PW_COVERAGE: "1" + PLAYWRIGHT_JSON_OUTPUT_FILE: ${{ github.workspace }}/frontend/playwright-report/results.json run: task e2e:live + - name: Flag flaky tests + # Runs regardless of the test outcome: a flaky test (passed on retry) + # leaves the step green, so this is the only place it surfaces. Emits + # ::warning:: annotations + a job summary; never fails the job. + if: always() + working-directory: frontend + run: npx tsx editor/scripts/report-flaky-tests.mts "$PLAYWRIGHT_JSON_OUTPUT_FILE" + env: + PLAYWRIGHT_JSON_OUTPUT_FILE: ${{ github.workspace }}/frontend/playwright-report/results.json - name: Generate JaCoCo report from e2e:live .exec if: always() id: live-coverage diff --git a/.github/workflows/e2e-stubbed.yml b/.github/workflows/e2e-stubbed.yml index 33bb24ee4c..ccfdf0052f 100644 --- a/.github/workflows/e2e-stubbed.yml +++ b/.github/workflows/e2e-stubbed.yml @@ -44,7 +44,18 @@ jobs: VITE_BUILD_FOR_PREVIEW: "1" run: task frontend:build - name: Run stubbed E2E tests (chromium) + env: + PLAYWRIGHT_JSON_OUTPUT_FILE: ${{ github.workspace }}/frontend/playwright-report/results.json run: task e2e:stubbed -- --workers=3 + - name: Flag flaky tests + # Runs regardless of the test outcome: a flaky test (passed on retry) + # leaves the step green, so this is the only place it surfaces. Emits + # ::warning:: annotations + a job summary; never fails the job. + if: always() + working-directory: frontend + run: npx tsx editor/scripts/report-flaky-tests.mts "$PLAYWRIGHT_JSON_OUTPUT_FILE" + env: + PLAYWRIGHT_JSON_OUTPUT_FILE: ${{ github.workspace }}/frontend/playwright-report/results.json - name: Upload Playwright report if: always() uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1 diff --git a/.taskfiles/frontend.yml b/.taskfiles/frontend.yml index 52277b5b04..4f87226f93 100644 --- a/.taskfiles/frontend.yml +++ b/.taskfiles/frontend.yml @@ -396,6 +396,23 @@ tasks: # Code Generation # ============================================================ + tool-models: + desc: "Generate tool API types from the Java OpenAPI spec" + deps: [install, ":backend:swagger"] + cmds: + - npx tsx editor/scripts/generate-tool-api-types.mts --spec ../SwaggerDoc.json --output editor/src/core/types/toolApiTypes.ts + sources: + - editor/scripts/generate-tool-api-types.mts + - ../SwaggerDoc.json + generates: + - editor/src/core/types/toolApiTypes.ts + + tool-models:check: + desc: "Fail if committed tool API types are out of date" + deps: [install, ":backend:swagger"] + cmds: + - npx tsx editor/scripts/generate-tool-api-types.mts --spec ../SwaggerDoc.json --output editor/src/core/types/toolApiTypes.ts --check + licenses:generate: desc: "Generate frontend license report" deps: [install] diff --git a/Taskfile.yml b/Taskfile.yml index 26895723d0..705ad4a1db 100644 --- a/Taskfile.yml +++ b/Taskfile.yml @@ -185,6 +185,16 @@ tasks: - task: frontend:format:check - task: engine:format:check + # ============================================================ + # Code generation + # ============================================================ + + tool-models: + desc: "Generate all API models from the Java OpenAPI spec" + cmds: + - task: frontend:tool-models + - task: engine:tool-models + # ============================================================ # Quality Gate # ============================================================ diff --git a/app/common/src/main/java/stirling/software/common/util/RequestUriUtils.java b/app/common/src/main/java/stirling/software/common/util/RequestUriUtils.java index 74c713b6db..faf71c2f97 100644 --- a/app/common/src/main/java/stirling/software/common/util/RequestUriUtils.java +++ b/app/common/src/main/java/stirling/software/common/util/RequestUriUtils.java @@ -57,6 +57,15 @@ public class RequestUriUtils { return true; } + // Admin portal SPA shell. Served publicly like the editor root so a direct + // nav / refresh to /portal loads the app (the JWT lives in localStorage, not + // a cookie, so the server can't authenticate the navigation itself). The + // portal gates access via its own auth gate + RequirePortalAccess, and its + // data APIs stay protected, so serving the shell pre-auth is safe. + if (normalizedUri.equals("/portal") || normalizedUri.startsWith("/portal/")) { + return true; + } + // Treat common static file extensions as static resources return normalizedUri.endsWith(".svg") || normalizedUri.endsWith(".png") diff --git a/app/common/src/test/java/stirling/software/common/util/RequestUriUtilsTest.java b/app/common/src/test/java/stirling/software/common/util/RequestUriUtilsTest.java index 4f0f3e372a..a13aeac82b 100644 --- a/app/common/src/test/java/stirling/software/common/util/RequestUriUtilsTest.java +++ b/app/common/src/test/java/stirling/software/common/util/RequestUriUtilsTest.java @@ -73,6 +73,14 @@ class RequestUriUtilsTest { assertTrue(RequestUriUtils.isStaticResource("/mobile-scanner")); } + @Test + void testIsStaticResource_portalShell() { + // The admin portal SPA shell is served pre-auth so it's directly navigable. + assertTrue(RequestUriUtils.isStaticResource("/portal")); + assertTrue(RequestUriUtils.isStaticResource("/portal/users")); + assertTrue(RequestUriUtils.isStaticResource("/app", "/app/portal")); + } + // --- isFrontendRoute tests --- @Test diff --git a/app/core/build.gradle b/app/core/build.gradle index d77fbdd438..6a55d89304 100644 --- a/app/core/build.gradle +++ b/app/core/build.gradle @@ -175,6 +175,14 @@ springBoot { // Frontend build tasks - only enabled with -PbuildWithFrontend=true def buildWithFrontend = project.hasProperty('buildWithFrontend') && project.property('buildWithFrontend') == 'true' def buildPrototypes = project.hasProperty('prototypesMode') && project.property('prototypesMode') == 'true' +// The admin portal ships as a lazy route inside the editor bundle (see +// proprietary/routes/adminRouteExtensions). -PbuildWithPortal=true includes that +// chunk via VITE_INCLUDE_PORTAL on the editor build; the deploy GHA sets it when +// the portal or AI layers change. Building the portal implies building the editor. +def buildWithPortal = project.hasProperty('buildWithPortal') && project.property('buildWithPortal') == 'true' +if (buildWithPortal) { + buildWithFrontend = true +} // Workspace root holds package.json and node_modules (shared across editor / // future portal). Editor-specific paths (src, public, dist, tauri) live one // level deeper under frontend/editor/. @@ -297,9 +305,11 @@ tasks.register('npmBuild', Exec) { // Override VITE_API_BASE_URL to use relative paths for production builds // This ensures JARs work regardless of how they're deployed (direct, proxied, etc.) environment 'VITE_API_BASE_URL', '/' + // Include the admin portal's lazy route/chunk in the editor build when requested. + environment 'VITE_INCLUDE_PORTAL', (buildWithPortal ? 'true' : 'false') doFirst { - println "Building editor frontend application for production (mode=${frontendMode}, VITE_API_BASE_URL=/)" + println "Building editor frontend application for production (mode=${frontendMode}, VITE_API_BASE_URL=/, portal=${buildWithPortal})" } } diff --git a/app/core/src/main/java/stirling/software/SPDF/model/api/general/PosterPdfRequest.java b/app/core/src/main/java/stirling/software/SPDF/model/api/general/PosterPdfRequest.java index 20d7eaf70b..222b89022a 100644 --- a/app/core/src/main/java/stirling/software/SPDF/model/api/general/PosterPdfRequest.java +++ b/app/core/src/main/java/stirling/software/SPDF/model/api/general/PosterPdfRequest.java @@ -1,5 +1,7 @@ package stirling.software.SPDF.model.api.general; +import com.fasterxml.jackson.annotation.JsonProperty; + import io.swagger.v3.oas.annotations.media.Schema; import lombok.Data; @@ -17,20 +19,8 @@ public class PosterPdfRequest extends PDFFile { allowableValues = {"A4", "Letter", "A3", "A5", "Legal", "Tabloid"}) private String pageSize = "A4"; - @Schema( - description = "Horizontal decimation factor (how many columns to split into)", - requiredMode = Schema.RequiredMode.NOT_REQUIRED, - defaultValue = "2", - minimum = "1", - maximum = "10") private int xFactor = 2; - @Schema( - description = "Vertical decimation factor (how many rows to split into)", - requiredMode = Schema.RequiredMode.NOT_REQUIRED, - defaultValue = "2", - minimum = "1", - maximum = "10") private int yFactor = 2; @Schema( @@ -38,4 +28,36 @@ public class PosterPdfRequest extends PDFFile { requiredMode = Schema.RequiredMode.NOT_REQUIRED, defaultValue = "false") private boolean rightToLeft = false; + + @JsonProperty("xFactor") + @Schema( + description = "Horizontal decimation factor (how many columns to split into)", + requiredMode = Schema.RequiredMode.NOT_REQUIRED, + defaultValue = "2", + minimum = "1", + maximum = "10") + public int getXFactor() { + return xFactor; + } + + @JsonProperty("xFactor") + public void setXFactor(int xFactor) { + this.xFactor = xFactor; + } + + @JsonProperty("yFactor") + @Schema( + description = "Vertical decimation factor (how many rows to split into)", + requiredMode = Schema.RequiredMode.NOT_REQUIRED, + defaultValue = "2", + minimum = "1", + maximum = "10") + public int getYFactor() { + return yFactor; + } + + @JsonProperty("yFactor") + public void setYFactor(int yFactor) { + this.yFactor = yFactor; + } } diff --git a/app/core/src/main/java/stirling/software/SPDF/model/api/security/AddPasswordRequest.java b/app/core/src/main/java/stirling/software/SPDF/model/api/security/AddPasswordRequest.java index 541a8717f3..2227803372 100644 --- a/app/core/src/main/java/stirling/software/SPDF/model/api/security/AddPasswordRequest.java +++ b/app/core/src/main/java/stirling/software/SPDF/model/api/security/AddPasswordRequest.java @@ -29,7 +29,8 @@ public class AddPasswordRequest extends PDFFile { description = "The length of the encryption key", type = "integer", allowableValues = {"40", "128", "256"}, - requiredMode = Schema.RequiredMode.REQUIRED) + requiredMode = Schema.RequiredMode.NOT_REQUIRED, + defaultValue = "256") private int keyLength = 256; @Schema(description = "Whether document assembly is prevented", defaultValue = "false") diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/audit/ControllerAuditAspect.java b/app/proprietary/src/main/java/stirling/software/proprietary/audit/ControllerAuditAspect.java index 0d777d9481..c59c6f3721 100644 --- a/app/proprietary/src/main/java/stirling/software/proprietary/audit/ControllerAuditAspect.java +++ b/app/proprietary/src/main/java/stirling/software/proprietary/audit/ControllerAuditAspect.java @@ -130,6 +130,7 @@ public class ControllerAuditAspect { String previousPrincipal = MDC.get("auditPrincipal"); String previousOrigin = MDC.get("auditOrigin"); + String previousSource = MDC.get("auditSource"); String previousIp = MDC.get("auditIp"); // EARLY CAPTURE: Capture from SecurityContext on request thread, store in MDC for async @@ -161,6 +162,14 @@ public class ControllerAuditAspect { return joinPoint.proceed(); } + // Stamp the free-UI source only for non-@Audited controller traffic — an actual + // tool / UI action. @Audited events (login, settings) return above without a source, + // so they never count as an "active editor" or a free UI run. The finally block + // restores auditSource, so a pooled thread can't leak a stale "WEB" into them. + if (previousSource == null) { + MDC.put("auditSource", auditService.captureCurrentSource()); + } + long start = System.currentTimeMillis(); // Use auditService to create the base audit data @@ -247,6 +256,7 @@ public class ControllerAuditAspect { } finally { restoreMdcValue("auditPrincipal", previousPrincipal); restoreMdcValue("auditOrigin", previousOrigin); + restoreMdcValue("auditSource", previousSource); restoreMdcValue("auditIp", previousIp); } } diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/audit/DefaultPortalAuditScopeResolver.java b/app/proprietary/src/main/java/stirling/software/proprietary/audit/DefaultPortalAuditScopeResolver.java new file mode 100644 index 0000000000..3eb476c4df --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/audit/DefaultPortalAuditScopeResolver.java @@ -0,0 +1,15 @@ +package stirling.software.proprietary.audit; + +import org.springframework.stereotype.Component; + +/** Self-hosted default: admins see the whole-server audit log, everyone else is denied. */ +@Component +public class DefaultPortalAuditScopeResolver implements PortalAuditScopeResolver { + + @Override + public PortalAuditScope resolve() { + return PortalAuditScopeResolver.hasAdminAuthority() + ? PortalAuditScope.server() + : PortalAuditScope.denied(); + } +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/audit/PortalAuditEventRow.java b/app/proprietary/src/main/java/stirling/software/proprietary/audit/PortalAuditEventRow.java new file mode 100644 index 0000000000..622d17c354 --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/audit/PortalAuditEventRow.java @@ -0,0 +1,7 @@ +package stirling.software.proprietary.audit; + +import java.time.Instant; + +/** Immutable, cacheable projection of an {@code audit_events} row, shared across portal views. */ +public record PortalAuditEventRow( + long id, String principal, String type, String data, Instant timestamp) {} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/audit/PortalAuditScope.java b/app/proprietary/src/main/java/stirling/software/proprietary/audit/PortalAuditScope.java new file mode 100644 index 0000000000..078dc2a332 --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/audit/PortalAuditScope.java @@ -0,0 +1,21 @@ +package stirling.software.proprietary.audit; + +import java.util.List; + +/** Resolved audit visibility: fullServer (admin), principals-scoped (team lead), or !allowed. */ +public record PortalAuditScope( + boolean allowed, boolean fullServer, List principals, String cacheKey) { + + public static PortalAuditScope denied() { + return new PortalAuditScope(false, false, List.of(), "denied"); + } + + // Named server()/team() to avoid colliding with the record's fullServer() accessor. + public static PortalAuditScope server() { + return new PortalAuditScope(true, true, List.of(), "server"); + } + + public static PortalAuditScope team(String cacheKey, List principals) { + return new PortalAuditScope(true, false, List.copyOf(principals), cacheKey); + } +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/audit/PortalAuditScopeResolver.java b/app/proprietary/src/main/java/stirling/software/proprietary/audit/PortalAuditScopeResolver.java new file mode 100644 index 0000000000..59b68d720e --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/audit/PortalAuditScopeResolver.java @@ -0,0 +1,18 @@ +package stirling.software.proprietary.audit; + +import org.springframework.security.core.Authentication; +import org.springframework.security.core.context.SecurityContextHolder; + +/** Resolves which slice of the audit log the caller may see. */ +public interface PortalAuditScopeResolver { + + PortalAuditScope resolve(); + + /** True when the current authentication carries {@code ROLE_ADMIN}. */ + static boolean hasAdminAuthority() { + Authentication auth = SecurityContextHolder.getContext().getAuthentication(); + return auth != null + && auth.getAuthorities().stream() + .anyMatch(a -> "ROLE_ADMIN".equals(a.getAuthority())); + } +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/config/CustomAuditEventRepository.java b/app/proprietary/src/main/java/stirling/software/proprietary/config/CustomAuditEventRepository.java index bcb98aa04b..f83bf0afdc 100644 --- a/app/proprietary/src/main/java/stirling/software/proprietary/config/CustomAuditEventRepository.java +++ b/app/proprietary/src/main/java/stirling/software/proprietary/config/CustomAuditEventRepository.java @@ -60,6 +60,8 @@ public class CustomAuditEventRepository implements AuditEventRepository { clean.put("requestId", rid); } + String source = MDC.get("auditSource"); + String auditEventData = mapper.writeValueAsString(clean); log.debug("AuditEvent data (JSON): {}", auditEventData); @@ -67,6 +69,7 @@ public class CustomAuditEventRepository implements AuditEventRepository { PersistentAuditEvent.builder() .principal(safePrincipal(ev.getPrincipal())) .type(ev.getType()) + .source(source) .data(auditEventData) .timestamp(ev.getTimestamp()) .build(); diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/FleetUsageController.java b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/FleetUsageController.java new file mode 100644 index 0000000000..57b74362ec --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/FleetUsageController.java @@ -0,0 +1,71 @@ +package stirling.software.proprietary.controller.api; + +import java.time.Instant; +import java.time.temporal.ChronoUnit; +import java.util.List; + +import org.springframework.security.access.prepost.PreAuthorize; +import org.springframework.web.bind.annotation.GetMapping; +import org.springframework.web.bind.annotation.RequestMapping; +import org.springframework.web.bind.annotation.RestController; + +import lombok.RequiredArgsConstructor; +import lombok.extern.slf4j.Slf4j; + +import stirling.software.common.model.enumeration.Role; +import stirling.software.proprietary.audit.AuditLevel; +import stirling.software.proprietary.config.AuditConfigurationProperties; +import stirling.software.proprietary.model.api.usage.FleetUsageStats; +import stirling.software.proprietary.repository.PersistentAuditEventRepository; +import stirling.software.proprietary.security.config.EnterpriseEndpoint; +import stirling.software.proprietary.security.database.repository.UserRepository; + +/** + * Admin endpoint exposing free-editor fleet usage for the portal Usage card. Audit-derived figures + * (active editors, PDFs processed) are null (rendered as "N/A") rather than a misleading 0 whenever + * the data can't exist: the events they count (PDF_PROCESS, FILE_OPERATION, HTTP_REQUEST) are all + * STANDARD level, so a gate on {@code isEnabled()} alone would still return 0 at level=OFF/BASIC — + * we gate on {@code isLevelEnabled(STANDARD)} instead. + * + *

    Known limitation: on a login-disabled self-hosted instance every request is anonymous, so its + * audit origin is SYSTEM (not WEB) and it is excluded from these WEB-only counts — active/PDFs then + * read 0 despite real usage. Historical audit rows written before the {@code source} column existed + * carry {@code source=null}, so the cumulative "PDFs edited" figure effectively starts at deploy. + */ +@Slf4j +@RestController +@RequestMapping("/api/v1/usage") +@PreAuthorize("hasRole('ADMIN')") +@RequiredArgsConstructor +@EnterpriseEndpoint +public class FleetUsageController { + + private final PersistentAuditEventRepository auditRepository; + private final UserRepository userRepository; + private final AuditConfigurationProperties auditConfig; + + @GetMapping("/fleet-stats") + public FleetUsageStats fleetStats() { + // Exclude the reserved INTERNAL_API_USER row that InitialSecuritySetup creates on every + // install, so a fresh single-admin instance reads 1 editor, not 2. + Long deployed = userRepository.countByUsernameNot(Role.INTERNAL_API_USER.getRoleId()); + // STANDARD is the level at which the counted events are recorded; below it the data + // can't exist, so report N/A instead of a 0 that would misrepresent an empty table. + boolean auditOn = auditConfig.isLevelEnabled(AuditLevel.STANDARD); + Instant since = Instant.now().minus(30, ChronoUnit.DAYS); + Long active = + auditOn + ? auditRepository.countDistinctPrincipalsBySourceExcludingTypeAfter( + "WEB", "UI_DATA", since) + : null; + Long pdfs = + auditOn + ? auditRepository.countByTypeInAndSourceAndTimestampAfter( + List.of("PDF_PROCESS", "FILE_OPERATION"), "WEB", Instant.EPOCH) + : null; + if (active != null && deployed != null && active > deployed) { + active = deployed; // active editors are a subset of those deployed + } + return new FleetUsageStats(deployed, active, pdfs); + } +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/PortalDocumentsController.java b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/PortalDocumentsController.java new file mode 100644 index 0000000000..14146eacb4 --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/PortalDocumentsController.java @@ -0,0 +1,46 @@ +package stirling.software.proprietary.controller.api; + +import org.springframework.http.HttpStatus; +import org.springframework.http.ResponseEntity; +import org.springframework.web.bind.annotation.GetMapping; +import org.springframework.web.bind.annotation.RequestParam; + +import io.swagger.v3.oas.annotations.Operation; + +import lombok.RequiredArgsConstructor; + +import stirling.software.common.annotations.api.ProprietaryUiDataApi; +import stirling.software.proprietary.audit.PortalAuditScope; +import stirling.software.proprietary.audit.PortalAuditScopeResolver; +import stirling.software.proprietary.model.api.documents.PortalDocumentsResponseDto; +import stirling.software.proprietary.security.config.EnterpriseEndpoint; +import stirling.software.proprietary.service.PortalDocumentsService; + +/** Serves the portal Documents review queue, derived from real audit data and scoped per caller. */ +@ProprietaryUiDataApi +@RequiredArgsConstructor +@EnterpriseEndpoint +public class PortalDocumentsController { + + private final PortalDocumentsService portalDocumentsService; + private final PortalAuditScopeResolver auditScopeResolver; + + // tier accepted for mock-seam symmetry; ignored (queue isn't tier-scoped). + @GetMapping("/documents") + @Operation( + summary = "Documents review queue", + description = "Files processed through the org, derived from the audit trail.") + public ResponseEntity getDocuments( + @RequestParam(value = "tier", required = false) String tier) { + PortalAuditScope scope = auditScopeResolver.resolve(); + if (!scope.allowed()) { + return ResponseEntity.status(HttpStatus.FORBIDDEN).build(); + } + PortalDocumentsResponseDto body = + scope.fullServer() + ? portalDocumentsService.serverDocuments() + : portalDocumentsService.scopedDocuments( + scope.cacheKey(), scope.principals()); + return ResponseEntity.ok(body); + } +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/PortalInfraAuditController.java b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/PortalInfraAuditController.java new file mode 100644 index 0000000000..866c295b8d --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/PortalInfraAuditController.java @@ -0,0 +1,47 @@ +package stirling.software.proprietary.controller.api; + +import org.springframework.http.HttpStatus; +import org.springframework.http.ResponseEntity; +import org.springframework.web.bind.annotation.GetMapping; +import org.springframework.web.bind.annotation.RequestParam; + +import io.swagger.v3.oas.annotations.Operation; + +import lombok.RequiredArgsConstructor; + +import stirling.software.common.annotations.api.ProprietaryUiDataApi; +import stirling.software.proprietary.audit.PortalAuditScope; +import stirling.software.proprietary.audit.PortalAuditScopeResolver; +import stirling.software.proprietary.model.api.audit.InfraAuditLogResponse; +import stirling.software.proprietary.security.config.EnterpriseEndpoint; +import stirling.software.proprietary.service.PortalInfraAuditService; + +/** Serves the Infrastructure → Audit tab from real audit data, scoped and cached per caller. */ +@ProprietaryUiDataApi +@RequiredArgsConstructor +@EnterpriseEndpoint +public class PortalInfraAuditController { + + private final PortalInfraAuditService portalInfraAuditService; + private final PortalAuditScopeResolver auditScopeResolver; + + // tier accepted for endpoint symmetry; ignored (audit log isn't tier-scoped). + @GetMapping("/infrastructure/audit-log") + @Operation( + summary = "Infrastructure audit log", + description = "Recent audit events shaped for the portal Infrastructure → Audit tab.") + public ResponseEntity getInfrastructureAuditLog( + @RequestParam(value = "tier", required = false) String tier) { + PortalAuditScope scope = auditScopeResolver.resolve(); + if (!scope.allowed()) { + // Return 403 (not throw) so the tab shows its access message, not a generic 500. + return ResponseEntity.status(HttpStatus.FORBIDDEN).build(); + } + InfraAuditLogResponse body = + scope.fullServer() + ? portalInfraAuditService.serverAuditLog() + : portalInfraAuditService.scopedAuditLog( + scope.cacheKey(), scope.principals()); + return ResponseEntity.ok(body); + } +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowOutcome.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowOutcome.java index 2bed56f0f0..a7239e8f90 100644 --- a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowOutcome.java +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowOutcome.java @@ -21,8 +21,7 @@ public enum AiWorkflowOutcome { COMPLETED("completed"), UNSUPPORTED_CAPABILITY("unsupported_capability"), CANNOT_CONTINUE("cannot_continue"), - GENERATE_FILE("generate_file"), - CONVERT_MARKDOWN("convert_markdown"); + GENERATE_FILE("generate_file"); private final String value; diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/audit/InfraAuditEventDto.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/audit/InfraAuditEventDto.java new file mode 100644 index 0000000000..86c27e2c6e --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/audit/InfraAuditEventDto.java @@ -0,0 +1,44 @@ +package stirling.software.proprietary.model.api.audit; + +import io.swagger.v3.oas.annotations.media.Schema; + +import lombok.AllArgsConstructor; +import lombok.Builder; +import lombok.Data; +import lombok.NoArgsConstructor; + +/** + * A single infrastructure audit-log row, shaped for the portal Infrastructure → Audit tab. Derived + * from a {@code audit_events} row: the real {@link + * stirling.software.proprietary.audit.AuditEventType} is mapped to a display category/action. + */ +@Data +@Builder +@NoArgsConstructor +@AllArgsConstructor +public class InfraAuditEventDto { + + @Schema(description = "Audit event id", example = "8841") + private String id; + + @Schema(description = "Display timestamp (UTC)", example = "2026-07-07 18:59:31") + private String timestamp; + + @Schema(description = "Category: auth | config | elevation | processing | security") + private String category; + + @Schema(description = "Human-readable action", example = "Compress PDF") + private String action; + + @Schema(description = "Actor principal", example = "alice.chen@acme.com") + private String actor; + + @Schema(description = "Affected target (file, endpoint, or session)") + private String target; + + @Schema(description = "Status: success | warning | danger | info") + private String status; + + @Schema(description = "Operation latency in milliseconds", example = "412") + private long latencyMs; +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/audit/InfraAuditLogResponse.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/audit/InfraAuditLogResponse.java new file mode 100644 index 0000000000..9b1b9d31c8 --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/audit/InfraAuditLogResponse.java @@ -0,0 +1,30 @@ +package stirling.software.proprietary.model.api.audit; + +import java.util.List; + +import io.swagger.v3.oas.annotations.media.Schema; + +import lombok.AllArgsConstructor; +import lombok.Builder; +import lombok.Data; +import lombok.NoArgsConstructor; + +/** Response for the portal Infrastructure → Audit tab: summary strip + recent event rows. */ +@Data +@Builder +@NoArgsConstructor +@AllArgsConstructor +public class InfraAuditLogResponse { + + @Schema(description = "Headline counts") + private InfraAuditSummary summary; + + @Schema(description = "Most-recent audit events, newest first") + private List events; + + @Schema( + description = + "True when this is the whole-server (admin) view. Team-scoped views are false; " + + "drives whether the admin-only, whole-server CSV export is offered.") + private boolean fullServer; +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/audit/InfraAuditSummary.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/audit/InfraAuditSummary.java new file mode 100644 index 0000000000..c924218e3a --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/audit/InfraAuditSummary.java @@ -0,0 +1,28 @@ +package stirling.software.proprietary.model.api.audit; + +import io.swagger.v3.oas.annotations.media.Schema; + +import lombok.AllArgsConstructor; +import lombok.Builder; +import lombok.Data; +import lombok.NoArgsConstructor; + +/** Headline counts for the infrastructure audit-log tab, derived from the returned events. */ +@Data +@Builder +@NoArgsConstructor +@AllArgsConstructor +public class InfraAuditSummary { + + @Schema(description = "Total events in the returned window", example = "40") + private int totalEvents; + + @Schema(description = "Processing-category events", example = "24") + private int processing; + + @Schema(description = "Elevation-category events", example = "0") + private int elevation; + + @Schema(description = "Config-category events", example = "6") + private int config; +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalDocAuditEventDto.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalDocAuditEventDto.java new file mode 100644 index 0000000000..c3e4ac3d7e --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalDocAuditEventDto.java @@ -0,0 +1,24 @@ +package stirling.software.proprietary.model.api.documents; + +import lombok.AllArgsConstructor; +import lombok.Builder; +import lombok.Data; +import lombok.NoArgsConstructor; + +/** One event in a document's lifecycle timeline. */ +@Data +@Builder +@NoArgsConstructor +@AllArgsConstructor +public class PortalDocAuditEventDto { + private String id; + + /** ingested | extracted | flagged | reviewed | approved | archived | elevation */ + private String kind; + + /** Relative-time string, e.g. "2m ago". */ + private String time; + + private String actor; + private String detail; +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalDocumentsResponseDto.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalDocumentsResponseDto.java new file mode 100644 index 0000000000..f9b1f28009 --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalDocumentsResponseDto.java @@ -0,0 +1,18 @@ +package stirling.software.proprietary.model.api.documents; + +import java.util.List; + +import lombok.AllArgsConstructor; +import lombok.Builder; +import lombok.Data; +import lombok.NoArgsConstructor; + +/** Response for the portal Documents review queue. */ +@Data +@Builder +@NoArgsConstructor +@AllArgsConstructor +public class PortalDocumentsResponseDto { + private PortalDocumentsSummaryDto summary; + private List documents; +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalDocumentsSummaryDto.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalDocumentsSummaryDto.java new file mode 100644 index 0000000000..1222afdc03 --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalDocumentsSummaryDto.java @@ -0,0 +1,18 @@ +package stirling.software.proprietary.model.api.documents; + +import lombok.AllArgsConstructor; +import lombok.Builder; +import lombok.Data; +import lombok.NoArgsConstructor; + +/** KPI strip for the documents queue. */ +@Data +@Builder +@NoArgsConstructor +@AllArgsConstructor +public class PortalDocumentsSummaryDto { + private int totalInQueue; + private int processed; + private int errors; + private int processedToday; +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalExtractionDto.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalExtractionDto.java new file mode 100644 index 0000000000..e332530dbc --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalExtractionDto.java @@ -0,0 +1,17 @@ +package stirling.software.proprietary.model.api.documents; + +import lombok.AllArgsConstructor; +import lombok.Builder; +import lombok.Data; +import lombok.NoArgsConstructor; + +/** A single extracted field. Empty for audit-derived documents (no extraction data yet). */ +@Data +@Builder +@NoArgsConstructor +@AllArgsConstructor +public class PortalExtractionDto { + private String field; + private String value; + private double confidence; +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalReviewDocumentDto.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalReviewDocumentDto.java new file mode 100644 index 0000000000..658b1c991d --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/documents/PortalReviewDocumentDto.java @@ -0,0 +1,48 @@ +package stirling.software.proprietary.model.api.documents; + +import java.util.List; + +import lombok.AllArgsConstructor; +import lombok.Builder; +import lombok.Data; +import lombok.NoArgsConstructor; + +/** + * A document in the review queue, derived from the audit trail of a processed file. Extraction + * fields ({@code confidence}, {@code extractions}) are absent/empty - that data doesn't exist yet. + */ +@Data +@Builder +@NoArgsConstructor +@AllArgsConstructor +public class PortalReviewDocumentDto { + private String id; + private String name; + private String type; + + /** Where it was processed: "API" or "Editor". */ + private String product; + + /** The operation / pipeline, e.g. "Compress PDF" (or "Editor"). */ + private String action; + + /** The user who ran it. */ + private String user; + + /** processed | error */ + private String status; + + private String source; + + /** Overall confidence 0..1, or null when there's no extraction data. */ + private Double confidence; + + private int fieldsExtracted; + + /** Relative-time string, e.g. "4m ago". */ + private String time; + + private boolean sensitive; + private List extractions; + private List audit; +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/usage/FleetUsageStats.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/usage/FleetUsageStats.java new file mode 100644 index 0000000000..0e554fb884 --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/usage/FleetUsageStats.java @@ -0,0 +1,6 @@ +package stirling.software.proprietary.model.api.usage; + +/** + * Free-editor fleet usage for the portal Usage card. Null fields render as "N/A" (uncomputable). + */ +public record FleetUsageStats(Long editorsDeployed, Long activeThisMonth, Long pdfsProcessed) {} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/security/PersistentAuditEvent.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/security/PersistentAuditEvent.java index 5d90926076..ccaf337c0b 100644 --- a/app/proprietary/src/main/java/stirling/software/proprietary/model/security/PersistentAuditEvent.java +++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/security/PersistentAuditEvent.java @@ -18,7 +18,15 @@ import lombok.*; columnList = "principal,type"), @jakarta.persistence.Index( name = "idx_audit_type_timestamp", - columnList = "type,timestamp") + columnList = "type,timestamp"), + @jakarta.persistence.Index( + name = "idx_audit_type_source_timestamp", + columnList = "type,source,timestamp"), + // Leads with source (equality) for the active-editors query, which filters on + // source then a timestamp range and counts distinct principal. + @jakarta.persistence.Index( + name = "idx_audit_source_timestamp_principal", + columnList = "source,timestamp,principal") }) @Data @Builder @@ -32,6 +40,7 @@ public class PersistentAuditEvent { private String principal; private String type; + private String source; @Column(columnDefinition = "text") private String data; // JSON blob diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/repository/PersistentAuditEventRepository.java b/app/proprietary/src/main/java/stirling/software/proprietary/repository/PersistentAuditEventRepository.java index 27bca098b3..7c0081dd7c 100644 --- a/app/proprietary/src/main/java/stirling/software/proprietary/repository/PersistentAuditEventRepository.java +++ b/app/proprietary/src/main/java/stirling/software/proprietary/repository/PersistentAuditEventRepository.java @@ -259,4 +259,21 @@ public interface PersistentAuditEventRepository extends JpaRepository :startDate") List findAllExceptTypeAndTimestampAfterForExport( @Param("excludeType") String excludeType, @Param("startDate") Instant startDate); + + // Free-editor fleet usage: count genuine free-UI operations (source = "WEB") by type. + @Query( + "SELECT COUNT(e) FROM PersistentAuditEvent e " + + "WHERE e.type IN :types AND e.source = :source AND e.timestamp > :since") + long countByTypeInAndSourceAndTimestampAfter( + @Param("types") List types, + @Param("source") String source, + @Param("since") Instant since); + + @Query( + "SELECT COUNT(DISTINCT e.principal) FROM PersistentAuditEvent e " + + "WHERE e.source = :source AND e.type <> :excludeType AND e.timestamp > :since") + long countDistinctPrincipalsBySourceExcludingTypeAfter( + @Param("source") String source, + @Param("excludeType") String excludeType, + @Param("since") Instant since); } diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/security/configuration/CacheConfig.java b/app/proprietary/src/main/java/stirling/software/proprietary/security/configuration/CacheConfig.java index 501826a084..eef27703f2 100644 --- a/app/proprietary/src/main/java/stirling/software/proprietary/security/configuration/CacheConfig.java +++ b/app/proprietary/src/main/java/stirling/software/proprietary/security/configuration/CacheConfig.java @@ -24,6 +24,9 @@ public class CacheConfig { this.applicationProperties = applicationProperties; } + /** Short-TTL cache of recent audit rows, shared by every audit-derived portal view. */ + private static final String PORTAL_AUDIT_EVENTS_CACHE = "portalAuditEvents"; + @Bean public CacheManager cacheManager() { int keyRetentionDays = applicationProperties.getSecurity().getJwt().getKeyRetentionDays(); @@ -33,6 +36,14 @@ public class CacheConfig { .maximumSize(1000) // Make configurable? .expireAfterWrite(Duration.ofDays(keyRetentionDays)) .recordStats()); + // 30s TTL keeps audit views near-live without re-scanning the DB; one entry per scope. + cacheManager.registerCustomCache( + PORTAL_AUDIT_EVENTS_CACHE, + Caffeine.newBuilder() + .maximumSize(256) + .expireAfterWrite(Duration.ofSeconds(30)) + .recordStats() + .build()); return cacheManager; } } diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/security/database/repository/UserRepository.java b/app/proprietary/src/main/java/stirling/software/proprietary/security/database/repository/UserRepository.java index 4e592e427a..acae6044de 100644 --- a/app/proprietary/src/main/java/stirling/software/proprietary/security/database/repository/UserRepository.java +++ b/app/proprietary/src/main/java/stirling/software/proprietary/security/database/repository/UserRepository.java @@ -49,6 +49,9 @@ public interface UserRepository extends JpaRepository { long countByTeam(Team team); + /** Count real users, excluding a reserved username such as the internal API user. */ + long countByUsernameNot(String username); + List findAllByTeam(Team team); // OAuth grandfathering queries diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/service/AiWorkflowService.java b/app/proprietary/src/main/java/stirling/software/proprietary/service/AiWorkflowService.java index 4e6c515318..d3b2d21a00 100644 --- a/app/proprietary/src/main/java/stirling/software/proprietary/service/AiWorkflowService.java +++ b/app/proprietary/src/main/java/stirling/software/proprietary/service/AiWorkflowService.java @@ -68,7 +68,6 @@ import tools.jackson.databind.ObjectMapper; public class AiWorkflowService { private static final String DOCUMENTS_ENDPOINT = "/api/v1/documents"; - private static final String PDF_TO_MARKDOWN_ENDPOINT = "/api/v1/convert/pdf/markdown"; private final CustomPDFDocumentFactory pdfDocumentFactory; private final AiEngineClient aiEngineClient; @@ -196,7 +195,6 @@ public class AiWorkflowService { return switch (response.getOutcome()) { case NEED_CONTENT -> onNeedContent(response, filesById, request, listener); case NEED_INGEST -> onNeedIngest(response, filesById, request, listener); - case CONVERT_MARKDOWN -> onConvertMarkdown(response, filesById, listener); case TOOL_CALL -> onToolCall(response, filesById, listener); case PLAN -> onPlan(response, filesById, request, listener); case ANSWER -> onAnswer(response, filesById, request, listener); @@ -333,72 +331,6 @@ public class AiWorkflowService { return new WorkflowState.Pending(nextRequest); } - /** - * Deterministically convert each requested PDF to Markdown via the {@code - * /convert/pdf/markdown} endpoint (backed by {@code PdfMarkdownConverter}) and return the - * {@code .md} file(s) as a completed result. No AI resume — the conversion output is the final - * answer. - */ - private WorkflowState onConvertMarkdown( - AiWorkflowResponse response, - Map filesById, - ProgressListener listener) { - List filesToConvert = response.getFilesToIngest(); - if (filesToConvert == null || filesToConvert.isEmpty()) { - return new WorkflowState.Terminal( - cannotContinue( - "AI engine requested markdown conversion without listing any files.")); - } - - try { - List resultFiles = new ArrayList<>(); - List inputNames = new ArrayList<>(); - for (int i = 0; i < filesToConvert.size(); i++) { - AiFile file = filesToConvert.get(i); - MultipartFile multipartFile = filesById.get(file.getId()); - if (multipartFile == null) { - return new WorkflowState.Terminal( - cannotContinue( - "AI engine requested markdown conversion for unknown file: " - + file.getName())); - } - listener.onProgress( - AiWorkflowProgressEvent.executingTool( - PDF_TO_MARKDOWN_ENDPOINT, i + 1, filesToConvert.size())); - Resource input = toResource(multipartFile); - PipelineDefinition definition = - new PipelineDefinition( - "convert-markdown", - List.of(new PipelineStep(PDF_TO_MARKDOWN_ENDPOINT, Map.of())), - null); - PolicyExecutionResult result = - policyExecutor.execute( - definition, - PolicyInputs.of(List.of(input)), - PolicyProgressListener.NOOP); - resultFiles.addAll(result.files()); - inputNames.add(multipartFile.getOriginalFilename()); - } - return new WorkflowState.Terminal( - buildCompletedResponse(null, resultFiles, inputNames, null)); - } catch (InternalApiTimeoutException e) { - log.error("PDF to Markdown conversion timed out: {}", e.getMessage()); - return new WorkflowState.Terminal( - cannotContinue(toolTimeoutMessage(PDF_TO_MARKDOWN_ENDPOINT, e))); - } catch (Exception e) { - AiWorkflowResponse limit = paygLimitResponseOrNull(e); - if (limit != null) { - log.info( - "AI markdown conversion blocked by downstream entitlement gate ({})", - limit.getErrorCode()); - return new WorkflowState.Terminal(limit); - } - log.error("Failed to convert PDF to Markdown: {}", e.getMessage(), e); - return new WorkflowState.Terminal( - cannotContinue(toolFailureMessage(PDF_TO_MARKDOWN_ENDPOINT, e))); - } - } - private Resource toResource(MultipartFile file) throws IOException { TempFile tempFile = tempFileManager.createManagedTempFile("ai-workflow"); file.transferTo(tempFile.getPath()); diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/service/AuditService.java b/app/proprietary/src/main/java/stirling/software/proprietary/service/AuditService.java index d86ae644e1..a56ece5285 100644 --- a/app/proprietary/src/main/java/stirling/software/proprietary/service/AuditService.java +++ b/app/proprietary/src/main/java/stirling/software/proprietary/service/AuditService.java @@ -39,6 +39,7 @@ import stirling.software.common.model.api.PDFFile; import stirling.software.common.service.CustomPDFDocumentFactory; import stirling.software.common.util.RegexPatternUtils; import stirling.software.common.util.RequestUriUtils; +import stirling.software.proprietary.accountlink.BillableOperationClassifier; import stirling.software.proprietary.audit.AuditEventType; import stirling.software.proprietary.audit.AuditLevel; import stirling.software.proprietary.audit.Audited; @@ -847,6 +848,39 @@ public class AuditService { return origin; } + /** + * Refines {@link #determineOrigin()} into an audit {@code source} that isolates genuine + * free-editor UI runs from automation/AI traffic that also arrives over the web channel. + * + *

    API and SYSTEM origins pass through unchanged. A WEB origin is demoted to "AUTOMATION" or + * "AI" when the request carries the automation marker or targets an AI surface; only a manual + * interactive tool call ({@code BYPASSED}) stays "WEB". A "WEB" source therefore counts as a + * free/BYPASSED UI run. The automation/AI resolution is delegated to {@link + * BillableOperationClassifier} so it can't drift from the billing gate's own signal. + * + *

    IMPORTANT: like {@link #captureCurrentOrigin()} this must be called on the request thread + * before async execution, because it reads the current {@link HttpServletRequest}. + * + * @return "API", "SYSTEM", "AUTOMATION", "AI", or "WEB" + */ + public String captureCurrentSource() { + String origin = determineOrigin(); + if (!"WEB".equals(origin)) { + return origin; + } + + HttpServletRequest req = getCurrentRequest(); + if (req == null) { + return "WEB"; + } + // apiKey=false: a WEB origin already means the request is not API-key authenticated. + return switch (BillableOperationClassifier.categorize(req, false)) { + case AUTOMATION -> "AUTOMATION"; + case AI -> "AI"; + default -> "WEB"; + }; + } + /** * Determines the origin of the request: API (X-API-KEY), WEB (JWT), or SYSTEM (no auth). * IMPORTANT: This must be called in the request thread before async execution. diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/service/PortalAuditReadService.java b/app/proprietary/src/main/java/stirling/software/proprietary/service/PortalAuditReadService.java new file mode 100644 index 0000000000..1678cd095f --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/service/PortalAuditReadService.java @@ -0,0 +1,60 @@ +package stirling.software.proprietary.service; + +import java.util.List; + +import org.springframework.cache.annotation.Cacheable; +import org.springframework.data.domain.PageRequest; +import org.springframework.data.domain.Sort; +import org.springframework.stereotype.Service; + +import lombok.RequiredArgsConstructor; + +import stirling.software.proprietary.audit.PortalAuditEventRow; +import stirling.software.proprietary.model.security.PersistentAuditEvent; +import stirling.software.proprietary.repository.PersistentAuditEventRepository; + +/** One cached read of recent {@code audit_events} per scope, shared by all audit-derived views. */ +@Service +@RequiredArgsConstructor +public class PortalAuditReadService { + + /** Cache name - registered with a short TTL in CacheConfig. */ + public static final String CACHE_NAME = "portalAuditEvents"; + + /** Newest rows to scan; each surface filters this down to what it shows. */ + private static final int SCAN_LIMIT = 400; + + private final PersistentAuditEventRepository auditRepository; + + /** Recent whole-server events (admins). */ + @Cacheable(value = CACHE_NAME, key = "'server'") + public List serverEvents() { + return toRows(auditRepository.findAll(recentPage()).getContent()); + } + + /** Recent events by the given principals (team scope). Empty principals yield an empty list. */ + @Cacheable(value = CACHE_NAME, key = "#cacheKey") + public List scopedEvents(String cacheKey, List principals) { + if (principals.isEmpty()) { + return List.of(); + } + return toRows(auditRepository.findByPrincipalIn(principals, recentPage()).getContent()); + } + + private static PageRequest recentPage() { + return PageRequest.of(0, SCAN_LIMIT, Sort.by(Sort.Direction.DESC, "timestamp")); + } + + private static List toRows(List events) { + return events.stream() + .map( + e -> + new PortalAuditEventRow( + e.getId() == null ? 0L : e.getId(), + e.getPrincipal(), + e.getType(), + e.getData(), + e.getTimestamp())) + .toList(); + } +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/service/PortalDocumentsService.java b/app/proprietary/src/main/java/stirling/software/proprietary/service/PortalDocumentsService.java new file mode 100644 index 0000000000..8784d5c5b6 --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/service/PortalDocumentsService.java @@ -0,0 +1,268 @@ +package stirling.software.proprietary.service; + +import java.time.Duration; +import java.time.Instant; +import java.util.ArrayList; +import java.util.List; +import java.util.Locale; +import java.util.Map; + +import org.springframework.stereotype.Service; + +import lombok.RequiredArgsConstructor; +import lombok.extern.slf4j.Slf4j; + +import stirling.software.proprietary.audit.AuditEventType; +import stirling.software.proprietary.audit.PortalAuditEventRow; +import stirling.software.proprietary.model.api.documents.PortalDocAuditEventDto; +import stirling.software.proprietary.model.api.documents.PortalDocumentsResponseDto; +import stirling.software.proprietary.model.api.documents.PortalDocumentsSummaryDto; +import stirling.software.proprietary.model.api.documents.PortalReviewDocumentDto; + +import tools.jackson.core.JacksonException; +import tools.jackson.databind.ObjectMapper; + +/** Builds the Documents feed from audit_events: one row per file; extraction fields stay null. */ +@Slf4j +@Service +@RequiredArgsConstructor +public class PortalDocumentsService { + + private static final int RETURN_LIMIT = 40; + + private final PortalAuditReadService auditReadService; + private final ObjectMapper objectMapper; + + /** Whole-server view (admins). */ + public PortalDocumentsResponseDto serverDocuments() { + return build(auditReadService.serverEvents()); + } + + /** Team-scoped view: only files touched by {@code principals}. */ + public PortalDocumentsResponseDto scopedDocuments(String cacheKey, List principals) { + return build(auditReadService.scopedEvents(cacheKey, principals)); + } + + private PortalDocumentsResponseDto build(List events) { + // Events arrive newest-first; each file in a processing event is one activity row. + Instant dayAgo = Instant.now().minus(Duration.ofDays(1)); + List documents = new ArrayList<>(); + int processedToday = 0; + for (PortalAuditEventRow event : events) { + if (documents.size() >= RETURN_LIMIT) { + break; + } + if (!isFileBearing(event.type())) { + continue; + } + Map data = parseData(event); + Object files = data.get("files"); + if (!(files instanceof List fileList)) { + continue; + } + String path = asString(data.get("path")); + String source = sourceLabel(asString(data.get("__origin"))); + String product = "API integration".equals(source) ? "API" : "Editor"; + String action = prettyTool(path); + boolean failed = isFailure(data); + Instant ts = event.timestamp(); + long eventId = event.id(); + int idx = 0; + for (Object f : fileList) { + if (documents.size() >= RETURN_LIMIT) { + break; + } + if (!(f instanceof Map fileMap)) { + continue; + } + String name = asString(fileMap.get("name")); + if (name == null || name.isBlank()) { + continue; + } + documents.add( + toDocument( + eventId + "-" + idx++, + name, + asString(fileMap.get("type")), + product, + action, + event.principal(), + failed, + source, + ts)); + if (!failed && ts != null && ts.isAfter(dayAgo)) { + processedToday++; + } + } + } + + int processed = + (int) documents.stream().filter(d -> "processed".equals(d.getStatus())).count(); + int errors = documents.size() - processed; + + PortalDocumentsSummaryDto summary = + PortalDocumentsSummaryDto.builder() + .totalInQueue(documents.size()) + .processed(processed) + .errors(errors) + .processedToday(processedToday) + .build(); + + return PortalDocumentsResponseDto.builder().summary(summary).documents(documents).build(); + } + + /** Build one activity row from a single file inside one processing event. */ + private PortalReviewDocumentDto toDocument( + String rowId, + String name, + String contentType, + String product, + String action, + String user, + boolean failed, + String source, + Instant timestamp) { + PortalDocAuditEventDto op = + PortalDocAuditEventDto.builder() + .id(rowId + "-op") + .kind(failed ? "flagged" : "extracted") + .time(relativeTime(timestamp)) + .actor(user) + .detail(failed ? action + " failed" : action + " via " + source) + .build(); + + return PortalReviewDocumentDto.builder() + .id("doc-" + rowId) + .name(name) + .type(docType(contentType, name)) + .product(product) + .action(action) + .user(user) + .status(failed ? "error" : "processed") + .source(source) + .confidence(null) + .fieldsExtracted(0) + .time(relativeTime(timestamp)) + // Audit events don't reveal content sensitivity, so never guess it. + .sensitive(false) + .extractions(List.of()) + .audit(List.of(op)) + .build(); + } + + private static boolean isFileBearing(String type) { + return AuditEventType.PDF_PROCESS.name().equals(type) + || AuditEventType.FILE_OPERATION.name().equals(type); + } + + private static boolean isFailure(Map data) { + Object status = data.get("status"); + if (status instanceof String s && "failure".equalsIgnoreCase(s)) { + return true; + } + Object code = data.get("statusCode"); + return code instanceof Number n && n.intValue() >= 400; + } + + private static String sourceLabel(String origin) { + if ("API".equals(origin)) { + return "API integration"; + } + if ("SYSTEM".equals(origin)) { + return "System"; + } + return "Web upload"; + } + + private static String docType(String contentType, String name) { + String ct = contentType == null ? "" : contentType.toLowerCase(Locale.ROOT); + if (ct.contains("pdf") || name.toLowerCase(Locale.ROOT).endsWith(".pdf")) { + return "PDF"; + } + if (ct.startsWith("image/") || name.matches("(?i).*\\.(png|jpe?g|gif|webp|tiff?)$")) { + return "Image"; + } + if (ct.contains("word") || name.matches("(?i).*\\.docx?$")) { + return "Word"; + } + return "Document"; + } + + private static String prettyTool(String path) { + if (path == null || path.isBlank()) { + return "Processed"; + } + String[] parts = path.split("/"); + // Convert endpoints are /convert/{from}/{to}; label them as a conversion. + for (int i = 0; i + 2 < parts.length; i++) { + if ("convert".equals(parts[i]) && !parts[i + 1].isEmpty() && !parts[i + 2].isEmpty()) { + return "Convert " + prettyWords(parts[i + 1]) + " to " + prettyWords(parts[i + 2]); + } + } + String last = parts.length > 0 ? parts[parts.length - 1] : path; + String pretty = prettyWords(last); + return pretty.isEmpty() ? "Processed" : pretty; + } + + /** Title-case a hyphenated path segment, upper-casing known acronyms. */ + private static String prettyWords(String segment) { + StringBuilder sb = new StringBuilder(); + for (String word : segment.split("-")) { + if (word.isEmpty()) { + continue; + } + if (sb.length() > 0) { + sb.append(' '); + } + String lower = word.toLowerCase(Locale.ROOT); + sb.append( + switch (lower) { + case "pdf" -> "PDF"; + case "pdfs" -> "PDFs"; + case "ocr" -> "OCR"; + case "img" -> "Image"; + case "csv" -> "CSV"; + default -> Character.toUpperCase(word.charAt(0)) + word.substring(1); + }); + } + return sb.toString(); + } + + private static String relativeTime(Instant ts) { + if (ts == null) { + return ""; + } + long seconds = Duration.between(ts, Instant.now()).getSeconds(); + if (seconds < 60) { + return "just now"; + } + long minutes = seconds / 60; + if (minutes < 60) { + return minutes + "m ago"; + } + long hours = minutes / 60; + if (hours < 24) { + return hours + "h ago"; + } + return (hours / 24) + "d ago"; + } + + private Map parseData(PortalAuditEventRow event) { + if (event.data() == null || event.data().isEmpty()) { + return Map.of(); + } + try { + @SuppressWarnings("unchecked") + Map parsed = objectMapper.readValue(event.data(), Map.class); + // A literal "null" payload parses to null; treat it as empty, not an NPE. + return parsed == null ? Map.of() : parsed; + } catch (JacksonException e) { + log.warn("Failed to parse audit event {} data as JSON", event.id()); + return Map.of(); + } + } + + private static String asString(Object o) { + return o == null ? null : String.valueOf(o); + } +} diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/service/PortalInfraAuditService.java b/app/proprietary/src/main/java/stirling/software/proprietary/service/PortalInfraAuditService.java new file mode 100644 index 0000000000..73d45800a8 --- /dev/null +++ b/app/proprietary/src/main/java/stirling/software/proprietary/service/PortalInfraAuditService.java @@ -0,0 +1,251 @@ +package stirling.software.proprietary.service; + +import java.time.ZoneOffset; +import java.time.format.DateTimeFormatter; +import java.util.List; +import java.util.Locale; +import java.util.Map; + +import org.springframework.stereotype.Service; + +import lombok.RequiredArgsConstructor; +import lombok.extern.slf4j.Slf4j; + +import stirling.software.proprietary.audit.AuditEventType; +import stirling.software.proprietary.audit.PortalAuditEventRow; +import stirling.software.proprietary.model.api.audit.InfraAuditEventDto; +import stirling.software.proprietary.model.api.audit.InfraAuditLogResponse; +import stirling.software.proprietary.model.api.audit.InfraAuditSummary; + +import tools.jackson.core.JacksonException; +import tools.jackson.databind.ObjectMapper; + +/** Maps cached audit_events to the Infrastructure → Audit tab, dropping read-noise types. */ +@Slf4j +@Service +@RequiredArgsConstructor +public class PortalInfraAuditService { + + /** Rows returned to the tab after filtering. */ + private static final int RETURN_LIMIT = 40; + + private static final DateTimeFormatter TS_FORMAT = + DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss").withZone(ZoneOffset.UTC); + + private final PortalAuditReadService auditReadService; + private final ObjectMapper objectMapper; + + /** Whole-server view (admins). */ + public InfraAuditLogResponse serverAuditLog() { + return buildFromEvents(auditReadService.serverEvents(), true); + } + + /** Team-scoped view: only events by the given principals; empty yields an empty log. */ + public InfraAuditLogResponse scopedAuditLog(String cacheKey, List principals) { + return buildFromEvents(auditReadService.scopedEvents(cacheKey, principals), false); + } + + private InfraAuditLogResponse buildFromEvents( + List recent, boolean fullServer) { + List events = + recent.stream() + .filter(e -> isInfraRelevant(e.type())) + .map(this::toDto) + .limit(RETURN_LIMIT) + .toList(); + + int processing = + (int) events.stream().filter(e -> "processing".equals(e.getCategory())).count(); + int elevation = + (int) events.stream().filter(e -> "elevation".equals(e.getCategory())).count(); + int config = (int) events.stream().filter(e -> "config".equals(e.getCategory())).count(); + + InfraAuditSummary summary = + InfraAuditSummary.builder() + .totalEvents(events.size()) + .processing(processing) + .elevation(elevation) + .config(config) + .build(); + + return InfraAuditLogResponse.builder() + .summary(summary) + .events(events) + .fullServer(fullServer) + .build(); + } + + /** UI_DATA and HTTP_REQUEST are read/polling noise - excluded from the infrastructure view. */ + private static boolean isInfraRelevant(String type) { + return !AuditEventType.UI_DATA.name().equals(type) + && !AuditEventType.HTTP_REQUEST.name().equals(type); + } + + private InfraAuditEventDto toDto(PortalAuditEventRow event) { + Map data = parseData(event); + String path = asString(data.get("path")); + String category = categoryFor(event.type(), path); + + return InfraAuditEventDto.builder() + .id(String.valueOf(event.id())) + .timestamp(event.timestamp() == null ? "" : TS_FORMAT.format(event.timestamp())) + .category(category) + .action(actionFor(event.type(), path)) + .actor(event.principal()) + .target(targetFor(category, path, data)) + .status(statusFor(event.type(), category, data)) + .latencyMs(asLong(data.get("latencyMs"))) + .build(); + } + + private Map parseData(PortalAuditEventRow event) { + if (event.data() == null || event.data().isEmpty()) { + return Map.of(); + } + try { + @SuppressWarnings("unchecked") + Map parsed = objectMapper.readValue(event.data(), Map.class); + // A literal "null" payload parses to null; treat it as empty, not an NPE. + return parsed == null ? Map.of() : parsed; + } catch (JacksonException e) { + log.warn("Failed to parse audit event {} data as JSON", event.id()); + return Map.of(); + } + } + + private static String categoryFor(String type, String path) { + AuditEventType t = AuditEventType.fromString(type); + if (t == null) { + return "processing"; + } + return switch (t) { + case USER_LOGIN, USER_LOGOUT, USER_FAILED_LOGIN -> "auth"; + case SETTINGS_CHANGED, USER_PROFILE_UPDATE -> "config"; + case PDF_PROCESS, FILE_OPERATION -> isSecurityPath(path) ? "security" : "processing"; + // UI_DATA / HTTP_REQUEST are filtered out before mapping. + default -> "processing"; + }; + } + + private static boolean isSecurityPath(String path) { + if (path == null) { + return false; + } + String p = path.toLowerCase(Locale.ROOT); + return p.contains("/security/") + || p.contains("password") + || p.contains("watermark") + || p.contains("sign") + || p.contains("cert") + || p.contains("redact"); + } + + private static String actionFor(String type, String path) { + AuditEventType t = AuditEventType.fromString(type); + if (t == null) { + return prettyTool(path); + } + return switch (t) { + case USER_LOGIN -> "User signed in"; + case USER_LOGOUT -> "User signed out"; + case USER_FAILED_LOGIN -> "Failed sign-in attempt"; + case USER_PROFILE_UPDATE -> "Profile settings updated"; + case SETTINGS_CHANGED -> "Admin settings changed"; + case PDF_PROCESS, FILE_OPERATION -> prettyTool(path); + default -> prettyTool(path); + }; + } + + /** Acronyms/tokens that get special casing when title-casing a tool path. */ + private static final Map WORD_FIXUPS = + Map.of( + "pdf", "PDF", + "pdfs", "PDFs", + "ocr", "OCR", + "img", "Image", + "csv", "CSV", + "html", "HTML", + "url", "URL", + "xml", "XML"); + + /** "/api/v1/misc/compress-pdf" → "Compress PDF"; "merge-pdfs" → "Merge PDFs". */ + private static String prettyTool(String path) { + if (path == null || path.isBlank()) { + return "PDF operation"; + } + String[] parts = path.split("/"); + String last = parts.length > 0 ? parts[parts.length - 1] : path; + StringBuilder sb = new StringBuilder(); + for (String word : last.split("-")) { + if (word.isEmpty()) { + continue; + } + if (sb.length() > 0) { + sb.append(' '); + } + String lower = word.toLowerCase(Locale.ROOT); + sb.append( + WORD_FIXUPS.getOrDefault( + lower, Character.toUpperCase(word.charAt(0)) + word.substring(1))); + } + return sb.isEmpty() ? "PDF operation" : sb.toString(); + } + + private static String targetFor(String category, String path, Map data) { + if ("auth".equals(category)) { + // Auth events don't act on a resource; the session is the closest thing. + return "Web session"; + } + if ("config".equals(category)) { + return path != null && !path.isBlank() ? path : "System settings"; + } + // processing / security: prefer the first affected file name. + String file = firstFileName(data); + if (file != null) { + return file; + } + return path != null && !path.isBlank() ? prettyTool(path) : "Document"; + } + + private static String statusFor(String type, String category, Map data) { + if (AuditEventType.USER_FAILED_LOGIN.name().equals(type)) { + return "danger"; + } + String status = asString(data.get("status")); + Integer code = asInteger(data.get("statusCode")); + if ("failure".equalsIgnoreCase(status) || (code != null && code >= 500)) { + return "danger"; + } + if (code != null && code >= 400) { + return "warning"; + } + if ("config".equals(category)) { + return "info"; + } + return "success"; + } + + @SuppressWarnings("unchecked") + private static String firstFileName(Map data) { + Object files = data.get("files"); + if (files instanceof List list + && !list.isEmpty() + && list.get(0) instanceof Map f) { + Object name = ((Map) f).get("name"); + return name != null ? String.valueOf(name) : null; + } + return null; + } + + private static String asString(Object o) { + return o == null ? null : String.valueOf(o); + } + + private static long asLong(Object o) { + return o instanceof Number n ? n.longValue() : 0L; + } + + private static Integer asInteger(Object o) { + return o instanceof Number n ? n.intValue() : null; + } +} diff --git a/app/proprietary/src/test/java/stirling/software/proprietary/config/CustomAuditEventRepositoryTest.java b/app/proprietary/src/test/java/stirling/software/proprietary/config/CustomAuditEventRepositoryTest.java index 3bdde8ecab..6ba15b24aa 100644 --- a/app/proprietary/src/test/java/stirling/software/proprietary/config/CustomAuditEventRepositoryTest.java +++ b/app/proprietary/src/test/java/stirling/software/proprietary/config/CustomAuditEventRepositoryTest.java @@ -3,12 +3,61 @@ package stirling.software.proprietary.config; import static org.junit.jupiter.api.Assertions.assertEquals; import static org.junit.jupiter.api.Assertions.assertFalse; import static org.junit.jupiter.api.Assertions.assertNotEquals; +import static org.junit.jupiter.api.Assertions.assertNull; import static org.junit.jupiter.api.Assertions.assertTrue; +import static org.mockito.Mockito.mock; +import static org.mockito.Mockito.verify; +import java.time.Instant; +import java.util.Map; + +import org.junit.jupiter.api.AfterEach; import org.junit.jupiter.api.Test; +import org.mockito.ArgumentCaptor; +import org.slf4j.MDC; +import org.springframework.boot.actuate.audit.AuditEvent; + +import stirling.software.proprietary.model.security.PersistentAuditEvent; +import stirling.software.proprietary.repository.PersistentAuditEventRepository; + +import tools.jackson.databind.json.JsonMapper; class CustomAuditEventRepositoryTest { + @AfterEach + void clearMdc() { + MDC.clear(); + } + + @Test + void sourceIsPopulatedFromMdcAuditSource() { + PersistentAuditEventRepository repo = mock(PersistentAuditEventRepository.class); + CustomAuditEventRepository writer = + new CustomAuditEventRepository(repo, JsonMapper.builder().build()); + + MDC.put("auditSource", "WEB"); + writer.add(new AuditEvent(Instant.now(), "admin", "PDF_PROCESS", Map.of("k", "v"))); + + ArgumentCaptor captor = + ArgumentCaptor.forClass(PersistentAuditEvent.class); + verify(repo).save(captor.capture()); + assertEquals("WEB", captor.getValue().getSource()); + } + + @Test + void sourceIsNullWhenMdcAbsent() { + PersistentAuditEventRepository repo = mock(PersistentAuditEventRepository.class); + CustomAuditEventRepository writer = + new CustomAuditEventRepository(repo, JsonMapper.builder().build()); + + writer.add(new AuditEvent(Instant.now(), "admin", "PDF_PROCESS", Map.of("k", "v"))); + + ArgumentCaptor captor = + ArgumentCaptor.forClass(PersistentAuditEvent.class); + verify(repo).save(captor.capture()); + assertNull(captor.getValue().getSource()); + } + @Test void shortPrincipalPassesThroughUnchanged() { assertEquals( diff --git a/app/proprietary/src/test/java/stirling/software/proprietary/controller/api/FleetUsageControllerTest.java b/app/proprietary/src/test/java/stirling/software/proprietary/controller/api/FleetUsageControllerTest.java new file mode 100644 index 0000000000..11e168b8d1 --- /dev/null +++ b/app/proprietary/src/test/java/stirling/software/proprietary/controller/api/FleetUsageControllerTest.java @@ -0,0 +1,108 @@ +package stirling.software.proprietary.controller.api; + +import static org.assertj.core.api.Assertions.assertThat; +import static org.mockito.ArgumentMatchers.any; +import static org.mockito.ArgumentMatchers.anyList; +import static org.mockito.ArgumentMatchers.anyString; +import static org.mockito.ArgumentMatchers.eq; +import static org.mockito.Mockito.never; +import static org.mockito.Mockito.verify; +import static org.mockito.Mockito.when; + +import java.time.Instant; + +import org.junit.jupiter.api.BeforeEach; +import org.junit.jupiter.api.DisplayName; +import org.junit.jupiter.api.Test; +import org.junit.jupiter.api.extension.ExtendWith; +import org.mockito.Mock; +import org.mockito.junit.jupiter.MockitoExtension; + +import stirling.software.common.model.enumeration.Role; +import stirling.software.proprietary.audit.AuditLevel; +import stirling.software.proprietary.config.AuditConfigurationProperties; +import stirling.software.proprietary.model.api.usage.FleetUsageStats; +import stirling.software.proprietary.repository.PersistentAuditEventRepository; +import stirling.software.proprietary.security.database.repository.UserRepository; + +@ExtendWith(MockitoExtension.class) +class FleetUsageControllerTest { + + @Mock private PersistentAuditEventRepository auditRepository; + @Mock private UserRepository userRepository; + @Mock private AuditConfigurationProperties auditConfig; + + private FleetUsageController controller; + + @BeforeEach + void setUp() { + controller = new FleetUsageController(auditRepository, userRepository, auditConfig); + } + + @Test + @DisplayName("deployed reflects the user count, excluding the internal API user") + void deployedFromUserCount() { + when(userRepository.countByUsernameNot(anyString())).thenReturn(7L); + when(auditConfig.isLevelEnabled(AuditLevel.STANDARD)).thenReturn(false); + + FleetUsageStats stats = controller.fleetStats(); + + assertThat(stats.editorsDeployed()).isEqualTo(7L); + verify(userRepository).countByUsernameNot(Role.INTERNAL_API_USER.getRoleId()); + } + + @Test + @DisplayName("audit-derived figures are null when auditing is below STANDARD") + void auditOffYieldsNulls() { + when(userRepository.countByUsernameNot(anyString())).thenReturn(3L); + // Covers both disabled and the enabled-but-level=OFF/BASIC misconfig: isLevelEnabled + // is false, so no events can exist and we must report N/A, not a 0 from an empty table. + when(auditConfig.isLevelEnabled(AuditLevel.STANDARD)).thenReturn(false); + + FleetUsageStats stats = controller.fleetStats(); + + assertThat(stats.activeThisMonth()).isNull(); + assertThat(stats.pdfsProcessed()).isNull(); + verify(auditRepository, never()) + .countDistinctPrincipalsBySourceExcludingTypeAfter( + any(), any(), any(Instant.class)); + verify(auditRepository, never()) + .countByTypeInAndSourceAndTimestampAfter(anyList(), any(), any(Instant.class)); + } + + @Test + @DisplayName("audit-derived figures come from the repository when auditing is enabled") + void auditOnReadsRepository() { + when(userRepository.countByUsernameNot(anyString())).thenReturn(10L); + when(auditConfig.isLevelEnabled(AuditLevel.STANDARD)).thenReturn(true); + when(auditRepository.countDistinctPrincipalsBySourceExcludingTypeAfter( + eq("WEB"), eq("UI_DATA"), any(Instant.class))) + .thenReturn(4L); + when(auditRepository.countByTypeInAndSourceAndTimestampAfter( + anyList(), eq("WEB"), any(Instant.class))) + .thenReturn(1234L); + + FleetUsageStats stats = controller.fleetStats(); + + assertThat(stats.editorsDeployed()).isEqualTo(10L); + assertThat(stats.activeThisMonth()).isEqualTo(4L); + assertThat(stats.pdfsProcessed()).isEqualTo(1234L); + } + + @Test + @DisplayName("active editors are clamped to deployed (active is a subset)") + void activeClampedToDeployed() { + when(userRepository.countByUsernameNot(anyString())).thenReturn(2L); + when(auditConfig.isLevelEnabled(AuditLevel.STANDARD)).thenReturn(true); + when(auditRepository.countDistinctPrincipalsBySourceExcludingTypeAfter( + eq("WEB"), eq("UI_DATA"), any(Instant.class))) + .thenReturn(9L); + when(auditRepository.countByTypeInAndSourceAndTimestampAfter( + anyList(), eq("WEB"), any(Instant.class))) + .thenReturn(50L); + + FleetUsageStats stats = controller.fleetStats(); + + assertThat(stats.activeThisMonth()).isEqualTo(2L); + } +} diff --git a/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceMoreTest.java b/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceMoreTest.java index cc8388b8c2..7c44a40a5d 100644 --- a/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceMoreTest.java +++ b/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceMoreTest.java @@ -221,34 +221,6 @@ class AiWorkflowServiceMoreTest { } } - @Nested - @DisplayName("convert_markdown guards") - class ConvertMarkdownGuards { - - @Test - @DisplayName("no files listed yields CANNOT_CONTINUE") - void noFiles() throws IOException { - stubOrchestrator("{\"outcome\":\"convert_markdown\",\"filesToIngest\":[]}"); - AiWorkflowResponse result = service.orchestrate(requestFor(pdf("a.pdf", "x"), "to md")); - assertThat(result.getOutcome()).isEqualTo(AiWorkflowOutcome.CANNOT_CONTINUE); - } - - @Test - @DisplayName("unknown file id yields CANNOT_CONTINUE") - void unknownFile() throws IOException { - when(fileIdStrategy.idFor(any())).thenReturn("real-id"); - stubOrchestrator( - """ - {"outcome":"convert_markdown", - "filesToIngest":[{"id":"other-id","name":"other.pdf"}]} - """); - AiWorkflowResponse result = - service.orchestrate(requestFor(pdf("real.pdf", "x"), "to md")); - assertThat(result.getOutcome()).isEqualTo(AiWorkflowOutcome.CANNOT_CONTINUE); - assertThat(result.getReason()).contains("other.pdf"); - } - } - @Nested @DisplayName("plan guards and errors") class PlanGuardsAndErrors { diff --git a/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceTest.java b/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceTest.java index 9e611cf32e..7dc174c041 100644 --- a/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceTest.java +++ b/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceTest.java @@ -78,6 +78,7 @@ class AiWorkflowServiceTest { private static final String SPLIT_ENDPOINT = "/api/v1/general/split-pages"; private static final String MERGE_ENDPOINT = "/api/v1/general/merge-pdfs"; private static final String COMPRESS_ENDPOINT = "/api/v1/misc/compress-pdf"; + private static final String MARKDOWN_ENDPOINT = "/api/v1/convert/pdf/markdown"; @Mock private CustomPDFDocumentFactory pdfDocumentFactory; @Mock private AiEngineClient aiEngineClient; @@ -440,23 +441,23 @@ class AiWorkflowServiceTest { } @Test - void convertMarkdownRunsDeterministicConversionAndReturnsMdFile() throws IOException { + void planWithMarkdownStepReturnsMdFile() throws IOException { + // PDF→Markdown is a normal tool the edit agent emits as a plan step (no bespoke + // outcome); the plan executor runs the converter and returns the .md file. MockMultipartFile input = pdf("multi-column-test_lorem.pdf", "pdf-bytes"); - when(fileIdStrategy.idFor(any())).thenReturn("doc-1"); stubOrchestrator( """ { - "outcome":"convert_markdown", - "reason":"PDF to Markdown requested.", - "filesToIngest":[{"id":"doc-1","name":"multi-column-test_lorem.pdf"}] + "outcome":"plan", + "summary":"Convert to Markdown", + "steps":[{"tool":"%s","parameters":{}}] } - """); - when(toolMetadataService.shouldUnpackZipResponse("/api/v1/convert/pdf/markdown")) - .thenReturn(false); - stubEndpoint( - "/api/v1/convert/pdf/markdown", - pdfResource("# Title", "multi-column-test_lorem.md")); - AtomicInteger ids = stubFileStorage(); + """ + .formatted(MARKDOWN_ENDPOINT)); + when(toolMetadataService.isMultiInput(anyString())).thenReturn(false); + when(toolMetadataService.shouldUnpackZipResponse(anyString())).thenReturn(false); + stubEndpoint(MARKDOWN_ENDPOINT, pdfResource("# Title", "multi-column-test_lorem.md")); + stubFileStorage(); AiWorkflowResponse result = service.orchestrate(requestFor(input, "convert to markdown")); @@ -464,8 +465,7 @@ class AiWorkflowServiceTest { assertEquals(1, result.getResultFiles().size()); // Extension changes (pdf -> md), so the converter's response filename wins. assertEquals("multi-column-test_lorem.md", result.getResultFiles().get(0).getFileName()); - assertEquals(1, ids.get()); - verify(internalApiClient, times(1)).post(eq("/api/v1/convert/pdf/markdown"), any()); + verify(internalApiClient, times(1)).post(eq(MARKDOWN_ENDPOINT), any()); } @Test diff --git a/app/proprietary/src/test/java/stirling/software/proprietary/service/AuditServiceTest.java b/app/proprietary/src/test/java/stirling/software/proprietary/service/AuditServiceTest.java index 321d0975d4..a90fde6b85 100644 --- a/app/proprietary/src/test/java/stirling/software/proprietary/service/AuditServiceTest.java +++ b/app/proprietary/src/test/java/stirling/software/proprietary/service/AuditServiceTest.java @@ -35,6 +35,7 @@ import jakarta.servlet.http.HttpServletResponse; import stirling.software.common.model.ApplicationProperties; import stirling.software.common.service.CustomPDFDocumentFactory; +import stirling.software.common.service.InternalApiClient; import stirling.software.proprietary.audit.AuditEventType; import stirling.software.proprietary.audit.AuditLevel; import stirling.software.proprietary.audit.Audited; @@ -83,6 +84,61 @@ class AuditServiceTest { RequestContextHolder.setRequestAttributes(new ServletRequestAttributes(request)); } + @Nested + @DisplayName("captureCurrentSource()") + class CaptureSource { + + @Test + @DisplayName("a plain authenticated web tool call is WEB") + void plainWebIsWeb() { + authenticateAs("alice"); + bindRequest(new MockHttpServletRequest("POST", "/api/v1/general/merge-pdfs")); + + assertThat(service.captureCurrentSource()).isEqualTo("WEB"); + } + + @Test + @DisplayName("the automation marker header demotes WEB to AUTOMATION") + void automationHeaderIsAutomation() { + authenticateAs("alice"); + MockHttpServletRequest req = + new MockHttpServletRequest("POST", "/api/v1/general/merge"); + req.addHeader(InternalApiClient.AUTOMATION_HEADER, "true"); + bindRequest(req); + + assertThat(service.captureCurrentSource()).isEqualTo("AUTOMATION"); + } + + @Test + @DisplayName("the AI surface demotes WEB to AI") + void aiSurfaceIsAi() { + authenticateAs("alice"); + bindRequest(new MockHttpServletRequest("POST", "/api/v1/ai/tools/ask")); + + assertThat(service.captureCurrentSource()).isEqualTo("AI"); + } + + @Test + @DisplayName("the AI surface is matched after stripping the deployment context path") + void aiSurfaceWithContextPathIsAi() { + authenticateAs("alice"); + MockHttpServletRequest req = new MockHttpServletRequest("POST", "/api/v1/ai/tools/ask"); + req.setContextPath("/stirling"); + req.setRequestURI("/stirling/api/v1/ai/tools/ask"); + bindRequest(req); + + assertThat(service.captureCurrentSource()).isEqualTo("AI"); + } + + @Test + @DisplayName("an unauthenticated request is SYSTEM, not WEB") + void anonymousIsSystem() { + bindRequest(new MockHttpServletRequest("POST", "/api/v1/general/merge-pdfs")); + + assertThat(service.captureCurrentSource()).isEqualTo("SYSTEM"); + } + } + @Nested @DisplayName("audit() gating") class AuditGating { diff --git a/app/saas/src/main/java/stirling/software/saas/config/SaasJpaConfig.java b/app/saas/src/main/java/stirling/software/saas/config/SaasJpaConfig.java index 5e90df6bf5..53a5f34c15 100644 --- a/app/saas/src/main/java/stirling/software/saas/config/SaasJpaConfig.java +++ b/app/saas/src/main/java/stirling/software/saas/config/SaasJpaConfig.java @@ -18,13 +18,15 @@ import org.springframework.data.jpa.repository.config.EnableJpaRepositories; "stirling.software.saas.repository", "stirling.software.saas.billing.repository", "stirling.software.saas.ai.repository", - "stirling.software.saas.payg.repository" + "stirling.software.saas.payg.repository", + "stirling.software.saas.procurement.repository" }) @EntityScan({ "stirling.software.saas.accountlink", "stirling.software.saas.model", "stirling.software.saas.billing.model", "stirling.software.saas.ai.model", - "stirling.software.saas.payg" + "stirling.software.saas.payg", + "stirling.software.saas.procurement.model" }) public class SaasJpaConfig {} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/api/ProcurementController.java b/app/saas/src/main/java/stirling/software/saas/procurement/api/ProcurementController.java new file mode 100644 index 0000000000..f92267da33 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/api/ProcurementController.java @@ -0,0 +1,378 @@ +package stirling.software.saas.procurement.api; + +import java.util.List; +import java.util.Objects; +import java.util.Optional; + +import org.springframework.context.annotation.Profile; +import org.springframework.http.HttpHeaders; +import org.springframework.http.HttpStatus; +import org.springframework.http.MediaType; +import org.springframework.http.ResponseEntity; +import org.springframework.security.access.prepost.PreAuthorize; +import org.springframework.security.core.Authentication; +import org.springframework.web.bind.annotation.GetMapping; +import org.springframework.web.bind.annotation.PostMapping; +import org.springframework.web.bind.annotation.RequestBody; +import org.springframework.web.bind.annotation.RequestMapping; +import org.springframework.web.bind.annotation.RequestParam; +import org.springframework.web.bind.annotation.RestController; + +import com.fasterxml.jackson.databind.ObjectMapper; + +import io.swagger.v3.oas.annotations.Hidden; + +import lombok.extern.slf4j.Slf4j; + +import stirling.software.common.model.enumeration.TeamRole; +import stirling.software.proprietary.security.database.repository.UserRepository; +import stirling.software.proprietary.security.model.User; +import stirling.software.saas.model.TeamMembership; +import stirling.software.saas.procurement.config.ProcurementConfigurationProperties; +import stirling.software.saas.procurement.model.ProcurementDeal; +import stirling.software.saas.procurement.model.ProcurementQuote; +import stirling.software.saas.procurement.pricing.QuoteConfig; +import stirling.software.saas.procurement.pricing.QuoteLineItem; +import stirling.software.saas.procurement.service.ProcurementService; +import stirling.software.saas.repository.TeamMembershipRepository; +import stirling.software.saas.util.AuthenticationUtils; + +/** + * The enterprise procurement journey for a linked team: read the deal snapshot, start/extend a + * (mock-licensed) trial, build a server-priced quote, and accept it. Stripe checkout itself is a + * Supabase edge function the portal calls with the accepted quote — this controller never touches + * Stripe. The caller's team is resolved from the authenticated principal; a team id is never + * trusted from the request. Mutations require the team leader. + */ +@Slf4j +@Hidden +@RestController +@RequestMapping("/api/v1/procurement") +@Profile("saas") +public class ProcurementController { + + // Local mapper to parse the stored line-items JSON; the saas context exposes no injectable + // ObjectMapper bean. + private static final ObjectMapper OBJECT_MAPPER = new ObjectMapper(); + + private final ProcurementService procurement; + private final TeamMembershipRepository memberRepo; + private final UserRepository userRepository; + private final ProcurementConfigurationProperties config; + + public ProcurementController( + ProcurementService procurement, + TeamMembershipRepository memberRepo, + UserRepository userRepository, + ProcurementConfigurationProperties config) { + this.procurement = Objects.requireNonNull(procurement); + this.memberRepo = Objects.requireNonNull(memberRepo); + this.userRepository = Objects.requireNonNull(userRepository); + this.config = Objects.requireNonNull(config); + } + + // ---- request / response DTOs ------------------------------------------- + + public record QuoteRequest( + long volume, + int users, + int intensity, // policy posture (runs/PDF): 2 / 4 / 7; 0 → default Governed + String deployment, + int termYears, + String serviceLevel, + boolean indemnification, + boolean training, + boolean qbr, + boolean offlineLicense, + String currency, + String businessName) { + QuoteConfig toConfig() { + return new QuoteConfig( + volume, + users, + intensity, + deployment, + termYears, + serviceLevel, + indemnification, + training, + qbr, + offlineLicense, + currency); + } + } + + public record QuoteResponse( + Long quoteId, + String quoteNumber, + String status, + String currency, + long annualNetMinor, + long tcvMinor, + List lineItems, + String validUntil, + String stripeQuoteId, + String invoiceUrl, + QuoteConfigEcho config) {} + + /** + * The inputs the quote was priced from, echoed back so the builder can seed itself when the + * buyer re-edits an existing quote. {@code users} is not persisted (only the resulting volume + * is), so it is always 0 here; the builder treats the seeded volume as manually set. + */ + public record QuoteConfigEcho( + long volume, + int users, + int intensity, + String deployment, + int termYears, + String serviceLevel, + boolean indemnification, + boolean training, + boolean qbr, + boolean offlineLicense, + String currency, + String businessName) {} + + public record SnapshotResponse( + Long dealId, + String stage, + String trialStartedAt, + String trialEndsAt, + int trialExtensionsUsed, + boolean licensed, + String licenseKey, + QuoteResponse latestQuote) {} + + // ---- endpoints ---------------------------------------------------------- + + /** + * The team's deal snapshot. Always 200 with a single shape; an unstarted procurement returns an + * empty snapshot ({@code dealId == null}) so the portal can render the "start" state without + * special-casing an empty body. + */ + @GetMapping + @PreAuthorize("isAuthenticated()") + public ResponseEntity snapshot(Authentication auth) { + Optional membership = primaryMembership(auth); + if (membership.isEmpty()) return ResponseEntity.status(HttpStatus.UNAUTHORIZED).build(); + Long teamId = membership.get().getTeam().getId(); + // The licence key is the team's secret entitlement — leader-only. Members still see the + // journey (stage, trial, quote) but the key is withheld; the .lic file is likewise gated. + boolean leader = membership.get().getRole() == TeamRole.LEADER; + return ResponseEntity.ok( + procurement.getDeal(teamId).map(d -> toSnapshot(d, leader)).orElse(EMPTY_SNAPSHOT)); + } + + private static final SnapshotResponse EMPTY_SNAPSHOT = + new SnapshotResponse(null, null, null, null, 0, false, null, null); + + /** + * Download the offline / air-gapped licence file (.lic) for the team, when the paid offline + * add-on was purchased. 404 when there's no licence or the add-on wasn't taken — we don't leak + * that a licence exists to a team without the add-on. + */ + @GetMapping("/license/file") + @PreAuthorize("isAuthenticated()") + public ResponseEntity licenseFile(Authentication auth) { + // Leader-only: the offline .lic is the team's portable entitlement, not a member artefact. + Long teamId = requireLeader(auth); + if (teamId == null) return ResponseEntity.status(HttpStatus.FORBIDDEN).build(); + return procurement + .offlineLicenseFile(teamId) + .>map( + cert -> + ResponseEntity.ok() + .header( + HttpHeaders.CONTENT_DISPOSITION, + "attachment; filename=\"stirling-enterprise.lic\"") + .contentType(MediaType.TEXT_PLAIN) + .body(cert)) + .orElseGet(() -> ResponseEntity.notFound().build()); + } + + @PostMapping("/trial/start") + @PreAuthorize("isAuthenticated()") + public ResponseEntity startTrial(Authentication auth) { + Long teamId = requireLeader(auth); + if (teamId == null) return ResponseEntity.status(HttpStatus.FORBIDDEN).build(); + return ResponseEntity.ok(toSnapshot(procurement.startTrial(teamId), true)); + } + + @PostMapping("/trial/extend") + @PreAuthorize("isAuthenticated()") + public ResponseEntity extendTrial(Authentication auth) { + Long teamId = requireLeader(auth); + if (teamId == null) return ResponseEntity.status(HttpStatus.FORBIDDEN).build(); + try { + return ResponseEntity.ok(toSnapshot(procurement.extendTrial(teamId), true)); + } catch (IllegalStateException e) { + return ResponseEntity.status(HttpStatus.CONFLICT).build(); + } + } + + @PostMapping("/quote") + @PreAuthorize("isAuthenticated()") + public ResponseEntity buildQuote( + @RequestBody QuoteRequest request, Authentication auth) { + Long teamId = requireLeader(auth); + if (teamId == null) return ResponseEntity.status(HttpStatus.FORBIDDEN).build(); + return ResponseEntity.ok( + toQuote( + procurement.buildQuote( + teamId, request.toConfig(), request.businessName()))); + } + + // Issue + accept are Supabase edge functions (they own Stripe): issue-procurement-quote turns a + // draft into a finalized Stripe Quote; accept-procurement-quote accepts it into a subscription. + // Both persist their results via SECURITY DEFINER RPCs; the snapshot above reflects them. + + /** + * Advance an issued quote to the agreement (security) stage, where the buyer reviews + agrees. + */ + @PostMapping("/agreement") + @PreAuthorize("isAuthenticated()") + public ResponseEntity startAgreement(Authentication auth) { + Long teamId = requireLeader(auth); + if (teamId == null) return ResponseEntity.status(HttpStatus.FORBIDDEN).build(); + try { + return ResponseEntity.ok(toSnapshot(procurement.startAgreement(teamId), true)); + } catch (IllegalStateException e) { + return ResponseEntity.status(HttpStatus.CONFLICT).build(); + } + } + + /** + * Provision on accept: upgrade the team's licence to the committed annual term, valid + * immediately. Called server-side by the accept edge function (ROLE_ADMIN via X-API-Key) once + * the subscription + invoice exist, so the buyer is licensed the moment they accept — the deal + * stays in the payment step until the invoice settles. Idempotent. + */ + @PostMapping("/provision") + @PreAuthorize("hasRole('ADMIN')") + public ResponseEntity provision(@RequestParam("teamId") long teamId) { + try { + procurement.provisionLicense(teamId); + return ResponseEntity.ok().build(); + } catch (IllegalStateException e) { + log.warn("[procurement] provision rejected team={}: {}", teamId, e.getMessage()); + return ResponseEntity.status(HttpStatus.CONFLICT).build(); + } + } + + /** + * Demo/manual stand-in for the {@code invoice.paid} webhook: mark the deal live (issue the + * annual licence, advance to active). The real go-live is webhook-driven once payment settles. + */ + @PostMapping("/go-live") + @PreAuthorize("isAuthenticated()") + public ResponseEntity goLive(Authentication auth) { + if (!config.isDemoControlsEnabled()) return ResponseEntity.notFound().build(); + Long teamId = requireLeader(auth); + if (teamId == null) return ResponseEntity.status(HttpStatus.FORBIDDEN).build(); + try { + return ResponseEntity.ok(toSnapshot(procurement.markLive(teamId), true)); + } catch (IllegalStateException e) { + return ResponseEntity.status(HttpStatus.CONFLICT).build(); + } + } + + /** Reset the team's procurement (delete the deal + quotes); returns the empty snapshot. */ + @PostMapping("/reset") + @PreAuthorize("isAuthenticated()") + public ResponseEntity reset(Authentication auth) { + if (!config.isDemoControlsEnabled()) return ResponseEntity.notFound().build(); + Long teamId = requireLeader(auth); + if (teamId == null) return ResponseEntity.status(HttpStatus.FORBIDDEN).build(); + procurement.resetDeal(teamId); + return ResponseEntity.ok(EMPTY_SNAPSHOT); + } + + // ---- helpers ------------------------------------------------------------ + + /** The caller's primary team membership; empty when unauthenticated/teamless. */ + private Optional primaryMembership(Authentication auth) { + User user; + try { + user = AuthenticationUtils.getCurrentUser(auth, userRepository); + } catch (SecurityException e) { + return Optional.empty(); + } + return memberRepo.findPrimaryMembership(user.getId()).stream().findFirst(); + } + + /** Team id only when the caller is the team leader; null otherwise (commercial actions). */ + private Long requireLeader(Authentication auth) { + return primaryMembership(auth) + .filter(m -> m.getRole() == TeamRole.LEADER) + .map(m -> m.getTeam().getId()) + .orElse(null); + } + + /** + * Build the snapshot for a deal. {@code includeLicenseKey} is true only for the team leader; a + * member sees {@code licensed} but not the key itself (see {@link #snapshot}). Mutation + * endpoints are leader-gated, so they always pass true. + */ + private SnapshotResponse toSnapshot(ProcurementDeal deal, boolean includeLicenseKey) { + QuoteResponse latest = + procurement.quotesForDeal(deal.getDealId()).stream() + .findFirst() + .map(this::toQuote) + .orElse(null); + return new SnapshotResponse( + deal.getDealId(), + deal.getStage(), + str(deal.getTrialStartedAt()), + str(deal.getTrialEndsAt()), + deal.getTrialExtensionsUsed(), + deal.getLicenseRef() != null, + includeLicenseKey ? deal.getLicenseRef() : null, + latest); + } + + private QuoteResponse toQuote(ProcurementQuote q) { + return new QuoteResponse( + q.getQuoteId(), + q.getQuoteNumber(), + q.getStatus(), + q.getCurrency(), + q.getAnnualNetMinor(), + q.getTcvMinor(), + parseLineItems(q.getLineItemsJson()), + q.getValidUntil() == null ? null : q.getValidUntil().toString(), + q.getStripeQuoteId(), + q.getStripeInvoiceUrl(), + new QuoteConfigEcho( + q.getVolume(), + 0, + q.getIntensity(), + q.getDeployment(), + q.getTermYears(), + q.getServiceLevel(), + q.isIndemnification(), + q.isTraining(), + q.isQbr(), + q.isOfflineLicense(), + q.getCurrency(), + q.getBusinessName())); + } + + private List parseLineItems(String json) { + if (json == null || json.isBlank()) return List.of(); + try { + return OBJECT_MAPPER.readValue( + json, + OBJECT_MAPPER + .getTypeFactory() + .constructCollectionType(List.class, QuoteLineItem.class)); + } catch (Exception e) { + log.warn("[procurement] failed to parse line items", e); + return List.of(); + } + } + + private static String str(Object o) { + return o == null ? null : o.toString(); + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/config/KeygenConfigurationProperties.java b/app/saas/src/main/java/stirling/software/saas/procurement/config/KeygenConfigurationProperties.java new file mode 100644 index 0000000000..40ee2ba2c3 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/config/KeygenConfigurationProperties.java @@ -0,0 +1,55 @@ +package stirling.software.saas.procurement.config; + +import org.springframework.boot.context.properties.ConfigurationProperties; +import org.springframework.context.annotation.Profile; +import org.springframework.stereotype.Component; + +import lombok.Getter; +import lombok.Setter; + +/** + * Keygen credentials + policy for issuing enterprise procurement licences directly from Java. + * Prefix {@code stirling.keygen}. All secrets come from the environment (relaxed binding: {@code + * STIRLING_KEYGEN_ACCOUNT_ID}, {@code STIRLING_KEYGEN_API_TOKEN}, …) — never committed. + * + *

    {@code enabled} is the switch between {@code MockEnterpriseLicenseService} (default) and the + * real {@code KeygenEnterpriseLicenseService}; the mock stays in place until the env vars are + * wired. + */ +@Getter +@Setter +@Component +@Profile("saas") +@ConfigurationProperties(prefix = "stirling.keygen") +public class KeygenConfigurationProperties { + + /** Master switch: when true, the real Keygen client replaces the mock licence service. */ + private boolean enabled = false; + + /** Keygen account id (UUID or slug). From {@code STIRLING_KEYGEN_ACCOUNT_ID}. */ + private String accountId; + + /** Keygen admin API token. From {@code STIRLING_KEYGEN_API_TOKEN}. Never log this. */ + private String apiToken; + + /** Policy the committed-enterprise licences are created under. From {@code ..._POLICY_ID}. */ + private String policyId; + + /** API base; overridable for self-hosted Keygen, defaults to the hosted service. */ + private String apiBase = "https://api.keygen.sh/v1"; + + /** + * License-file check-out algorithm. Must stay {@code base64+ed25519} — the self-hosted {@code + * KeygenLicenseVerifier} only verifies that scheme (signed, unencrypted) offline. + */ + private String licenseFileAlgorithm = "base64+ed25519"; + + /** True when the credentials needed to talk to Keygen are all present. */ + public boolean isConfigured() { + return notBlank(accountId) && notBlank(apiToken) && notBlank(policyId); + } + + private static boolean notBlank(String s) { + return s != null && !s.isBlank(); + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/config/ProcurementConfigurationProperties.java b/app/saas/src/main/java/stirling/software/saas/procurement/config/ProcurementConfigurationProperties.java new file mode 100644 index 0000000000..98ec0cd573 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/config/ProcurementConfigurationProperties.java @@ -0,0 +1,33 @@ +package stirling.software.saas.procurement.config; + +import org.springframework.boot.context.properties.ConfigurationProperties; +import org.springframework.context.annotation.Profile; +import org.springframework.stereotype.Component; + +import lombok.Getter; +import lombok.Setter; + +/** Tunables for the enterprise procurement flow. Prefix {@code stirling.procurement}. */ +@Getter +@Setter +@Component +@Profile("saas") +@ConfigurationProperties(prefix = "stirling.procurement") +public class ProcurementConfigurationProperties { + + /** Free trial length, in days (no card). */ + private int trialDurationDays = 14; + + /** Days added per trial extension. */ + private int trialExtensionDays = 7; + + /** Maximum number of trial extensions a buyer may take. */ + private int maxTrialExtensions = 2; + + /** + * Enables the demo-only endpoints (POST /reset, POST /go-live) that reset a team's procurement + * or mark it live without payment. Off by default; turn on ONLY in demo/dev environments — + * /go-live is a stand-in for the invoice.paid webhook and would let a leader activate unpaid. + */ + private boolean demoControlsEnabled = false; +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/license/EnterpriseLicenseService.java b/app/saas/src/main/java/stirling/software/saas/procurement/license/EnterpriseLicenseService.java new file mode 100644 index 0000000000..0c3d547d4c --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/license/EnterpriseLicenseService.java @@ -0,0 +1,47 @@ +package stirling.software.saas.procurement.license; + +import java.time.LocalDateTime; + +/** + * Issues and modifies the customer-facing entitlement that actually unlocks the product for an + * enterprise deal — a Keygen licence (trial or annual, connected or air-gapped). This is the seam + * the real Keygen management client plugs into; today {@link MockEnterpriseLicenseService} records + * intent without calling Keygen. Distinct from the EE {@code KeygenLicenseVerifier}, which only + * verifies this instance's own licence. + */ +public interface EnterpriseLicenseService { + + /** + * Issue a time-boxed trial licence for the team, owned by {@code ownerEmail} (the team leader); + * returns the licence reference (the Keygen key, stored on the deal). + */ + String issueTrialLicense(Long teamId, String ownerEmail, LocalDateTime expiresAt); + + /** Move a licence's expiry out (trial extension). */ + void extendLicense(String licenseRef, LocalDateTime newExpiry); + + /** + * Issue/upgrade to a committed annual licence carrying the deal's {@link LicenseEntitlements} + * ({@code seats} = 0 means unlimited). When {@code existingRef} is non-null (the team already + * has a trial licence), that licence is upgraded in place so the key the buyer already holds + * keeps working; otherwise a new licence is created. Owned by {@code ownerEmail}; returns the + * licence reference. + */ + String issueAnnualLicense( + Long teamId, + String ownerEmail, + LocalDateTime expiresAt, + String existingRef, + LicenseEntitlements entitlements); + + /** Suspend a licence (e.g. payment failed, deal lost). */ + void suspendLicense(String licenseRef); + + /** + * Check out a signed, offline-verifiable licence file (a {@code -----BEGIN LICENSE FILE-----} + * certificate) for the given licence, for an air-gapped self-hosted instance. The paid offline + * add-on gates whether this is offered; the certificate itself is generated on demand and never + * stored. + */ + String checkOutLicenseFile(String licenseRef); +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/license/KeygenEnterpriseLicenseService.java b/app/saas/src/main/java/stirling/software/saas/procurement/license/KeygenEnterpriseLicenseService.java new file mode 100644 index 0000000000..a11ad05755 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/license/KeygenEnterpriseLicenseService.java @@ -0,0 +1,304 @@ +package stirling.software.saas.procurement.license; + +import java.net.URI; +import java.net.URLEncoder; +import java.net.http.HttpClient; +import java.net.http.HttpRequest; +import java.net.http.HttpResponse; +import java.nio.charset.StandardCharsets; +import java.time.Duration; +import java.time.LocalDateTime; +import java.time.ZoneOffset; +import java.util.LinkedHashMap; +import java.util.Map; + +import org.springframework.boot.autoconfigure.condition.ConditionalOnProperty; +import org.springframework.context.annotation.Profile; +import org.springframework.stereotype.Service; + +import com.fasterxml.jackson.databind.JsonNode; +import com.fasterxml.jackson.databind.ObjectMapper; + +import lombok.extern.slf4j.Slf4j; + +import stirling.software.saas.procurement.config.KeygenConfigurationProperties; + +/** + * Real {@link EnterpriseLicenseService}: manages the team's enterprise licence directly against the + * Keygen API (the "call Keygen from Java" direction), rather than via the Supabase edge functions + * the self-hosted checkout uses. Active only when {@code stirling.keygen.enabled=true}; otherwise + * {@link MockEnterpriseLicenseService} is the bean. + * + *

    Licences are owned by the team leader (a Keygen user, found or created by email) and created + * under the committed-enterprise policy. Metadata carries {@code isEnterprise} + {@code users} so a + * checked-out offline licence file satisfies the self-hosted {@code KeygenLicenseVerifier}. The + * licence key returned is stored on the deal as its {@code license_ref}. + */ +@Slf4j +@Service +@Profile("saas") +@ConditionalOnProperty(name = "stirling.keygen.enabled", havingValue = "true") +public class KeygenEnterpriseLicenseService implements EnterpriseLicenseService { + + private static final String VND_JSON = "application/vnd.api+json"; + + private final ObjectMapper mapper = new ObjectMapper(); + private final HttpClient http = + HttpClient.newBuilder().connectTimeout(Duration.ofSeconds(10)).build(); + private final KeygenConfigurationProperties config; + + public KeygenEnterpriseLicenseService(KeygenConfigurationProperties config) { + this.config = config; + // Fail fast: if the flag is on but creds are missing, a misconfigured prod deploy should be + // caught at startup, not at the first trial/provision. (Flag off → Mock bean, never here.) + if (!config.isConfigured()) { + throw new IllegalStateException( + "stirling.keygen.enabled=true but Keygen is not fully configured — set " + + "STIRLING_KEYGEN_ACCOUNT_ID / _API_TOKEN / _POLICY_ID, or turn the flag off"); + } + } + + @Override + public String issueTrialLicense(Long teamId, String ownerEmail, LocalDateTime expiresAt) { + String ownerId = findOrCreateUser(ownerEmail); + // Trial: enterprise entitlement, unlimited users, expiring at the trial end. No committed + // volume/add-ons yet — those are stamped on the annual licence at provision. + return createLicense(ownerId, expiresAt, trialMetadata(teamId)); + } + + @Override + public void extendLicense(String licenseRef, LocalDateTime newExpiry) { + Map attrs = new LinkedHashMap<>(); + attrs.put("expiry", iso(newExpiry)); + patchLicense(licenseRef, attrs); + } + + @Override + public String issueAnnualLicense( + Long teamId, + String ownerEmail, + LocalDateTime expiresAt, + String existingRef, + LicenseEntitlements ent) { + Map metadata = annualMetadata(teamId, ent); + // Upgrade the trial licence in place so the key the buyer already holds keeps working. + if (existingRef != null && !existingRef.isBlank()) { + Map attrs = new LinkedHashMap<>(); + attrs.put("expiry", iso(expiresAt)); + attrs.put("suspended", false); + attrs.put("metadata", metadata); + patchLicense(existingRef, attrs); + return existingRef; + } + String ownerId = findOrCreateUser(ownerEmail); + return createLicense(ownerId, expiresAt, metadata); + } + + @Override + public void suspendLicense(String licenseRef) { + HttpResponse res = + send( + authed(licenseUrl(licenseRef) + "/actions/suspend") + .POST(HttpRequest.BodyPublishers.noBody()) + .build()); + expect(res, 200, "suspend licence"); + } + + @Override + public String checkOutLicenseFile(String licenseRef) { + // Signed, unencrypted (base64+ed25519) so the self-hosted verifier can validate it offline; + // include entitlements in the snapshot. Never encrypt — the verifier only reads + // base64+ed25519. + String url = + licenseUrl(licenseRef) + + "/actions/check-out?include=entitlements&algorithm=" + + enc(config.getLicenseFileAlgorithm()); + HttpResponse res = + send(authed(url).POST(HttpRequest.BodyPublishers.noBody()).build()); + expect(res, 200, "check-out licence file"); + JsonNode cert = readJson(res).at("/data/attributes/certificate"); + if (cert.isMissingNode() || cert.asText().isBlank()) { + throw new IllegalStateException("Keygen check-out returned no certificate"); + } + return cert.asText(); + } + + // ---- Keygen primitives -------------------------------------------------- + + /** Find the Keygen user by email, creating it if absent; returns the user id. */ + private String findOrCreateUser(String email) { + if (email == null || email.isBlank()) { + throw new IllegalArgumentException("Cannot own a licence without an owner email"); + } + HttpResponse find = + send(authed(accountUrl() + "/users/" + enc(email)).GET().build()); + if (find.statusCode() == 200) { + return readJson(find).at("/data/id").asText(); + } + if (find.statusCode() != 404) { + expect(find, 200, "find Keygen user"); // throws with the real status + } + Map body = + jsonApi("users", Map.of("email", email), null); // no relationships + HttpResponse create = + send( + authed(accountUrl() + "/users") + .POST(HttpRequest.BodyPublishers.ofString(write(body))) + .build()); + expect(create, 201, "create Keygen user"); + return readJson(create).at("/data/id").asText(); + } + + private String createLicense( + String ownerId, LocalDateTime expiresAt, Map metadata) { + Map attributes = new LinkedHashMap<>(); + attributes.put("expiry", iso(expiresAt)); + attributes.put("metadata", metadata); + Map relationships = + Map.of( + "policy", + Map.of("data", Map.of("type", "policies", "id", config.getPolicyId())), + "owner", + Map.of("data", Map.of("type", "users", "id", ownerId))); + Map body = jsonApi("licenses", attributes, relationships); + HttpResponse res = + send( + authed(accountUrl() + "/licenses") + .POST(HttpRequest.BodyPublishers.ofString(write(body))) + .build()); + expect(res, 201, "create licence"); + return readJson(res).at("/data/attributes/key").asText(); + } + + private void patchLicense(String licenseRef, Map attributes) { + Map body = jsonApi("licenses", attributes, null); + HttpResponse res = + send( + authed(licenseUrl(licenseRef)) + .method("PATCH", HttpRequest.BodyPublishers.ofString(write(body))) + .build()); + expect(res, 200, "update licence"); + } + + // ---- helpers ------------------------------------------------------------ + + // The self-hosted verifier only reads isEnterprise + users; everything else is informational + // (dashboard / reconciliation) but kept so the licence is a self-describing record of the deal. + + /** Trial licence: enterprise, unlimited users, no committed volume/add-ons yet. */ + private Map trialMetadata(Long teamId) { + Map m = baseMetadata(teamId, true); + m.put("users", 0); // 0 = unlimited during the trial + m.put("seat_count", 0); + return m; + } + + /** Committed annual licence: the full entitlement snapshot from the accepted quote + deal. */ + private Map annualMetadata(Long teamId, LicenseEntitlements ent) { + Map m = baseMetadata(teamId, false); + int seats = Math.max(0, ent.seats()); + m.put("users", seats); // 0 = unlimited + m.put("seat_count", seats); // parity with the self-hosted edge's metadata + m.put("volume", ent.volume()); // committed PDFs / year + m.put("term_years", ent.termYears()); + if (ent.serviceLevel() != null && !ent.serviceLevel().isBlank()) { + m.put("service_level", ent.serviceLevel()); + } + m.put("indemnification", ent.indemnification()); + m.put("training", ent.training()); + m.put("qbr", ent.qbr()); + m.put("offline_license", ent.offlineLicense()); + if (ent.deployment() != null && !ent.deployment().isBlank()) { + m.put("deployment", ent.deployment()); + } + if (ent.dealId() != null) m.put("deal_id", ent.dealId()); + if (ent.subscriptionId() != null && !ent.subscriptionId().isBlank()) { + m.put("subscription_id", ent.subscriptionId()); + } + return m; + } + + private Map baseMetadata(Long teamId, boolean trial) { + Map m = new LinkedHashMap<>(); + m.put("team_id", teamId); + m.put("plan_type", "enterprise"); + m.put("isEnterprise", true); + m.put("trial", trial); + return m; + } + + private Map jsonApi( + String type, Map attributes, Map relationships) { + Map data = new LinkedHashMap<>(); + data.put("type", type); + data.put("attributes", attributes); + if (relationships != null) data.put("relationships", relationships); + return Map.of("data", data); + } + + private HttpRequest.Builder authed(String url) { + return HttpRequest.newBuilder() + .uri(URI.create(url)) + .header("Authorization", "Bearer " + config.getApiToken()) + .header("Content-Type", VND_JSON) + .header("Accept", VND_JSON) + .timeout(Duration.ofSeconds(30)); + } + + private HttpResponse send(HttpRequest request) { + try { + return http.send(request, HttpResponse.BodyHandlers.ofString()); + } catch (java.io.IOException e) { + throw new IllegalStateException("Keygen request failed: " + e.getMessage(), e); + } catch (InterruptedException e) { + Thread.currentThread().interrupt(); + throw new IllegalStateException("Keygen request interrupted", e); + } + } + + private void expect(HttpResponse res, int status, String action) { + if (res.statusCode() != status) { + // Keep the response body out of the thrown message: it never carries the token, but can + // echo owner emails / metadata, and the message reaches warn-level logs. Body at debug. + log.debug( + "[procurement][keygen] {} failed: HTTP {} body={}", + action, + res.statusCode(), + res.body()); + throw new IllegalStateException( + "Keygen " + action + " failed: HTTP " + res.statusCode()); + } + } + + private JsonNode readJson(HttpResponse res) { + try { + return mapper.readTree(res.body()); + } catch (Exception e) { + throw new IllegalStateException("Keygen returned unparseable JSON", e); + } + } + + private String write(Map body) { + try { + return mapper.writeValueAsString(body); + } catch (Exception e) { + throw new IllegalStateException("Failed to serialise Keygen request", e); + } + } + + private String accountUrl() { + return config.getApiBase() + "/accounts/" + config.getAccountId(); + } + + private String licenseUrl(String licenseRef) { + return accountUrl() + "/licenses/" + enc(licenseRef); + } + + private static String enc(String s) { + return URLEncoder.encode(s, StandardCharsets.UTF_8); + } + + private static String iso(LocalDateTime dt) { + return dt.toInstant(ZoneOffset.UTC).toString(); + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/license/LicenseEntitlements.java b/app/saas/src/main/java/stirling/software/saas/procurement/license/LicenseEntitlements.java new file mode 100644 index 0000000000..0b7a0be6c9 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/license/LicenseEntitlements.java @@ -0,0 +1,21 @@ +package stirling.software.saas.procurement.license; + +/** + * The committed deal's entitlements, stamped onto the annual Keygen licence's metadata so the + * licence is a self-describing record of what was bought. Only {@code seats} (as {@code users}) and + * the enterprise flag are read by the self-hosted verifier; the rest is informational — kept "for + * good measure" so the Keygen dashboard and any downstream reconciliation can see the full picture. + * Built by {@code ProcurementService} from the accepted quote + deal. + */ +public record LicenseEntitlements( + long volume, // committed PDFs / year + int seats, // 0 = unlimited + String deployment, // cloud | selfhost | airgap + int termYears, + String serviceLevel, // standard | priority | dedicated + boolean indemnification, + boolean training, + boolean qbr, + boolean offlineLicense, + Long dealId, + String subscriptionId) {} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/license/MockEnterpriseLicenseService.java b/app/saas/src/main/java/stirling/software/saas/procurement/license/MockEnterpriseLicenseService.java new file mode 100644 index 0000000000..511d67cd08 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/license/MockEnterpriseLicenseService.java @@ -0,0 +1,83 @@ +package stirling.software.saas.procurement.license; + +import java.time.LocalDateTime; +import java.util.UUID; + +import org.springframework.boot.autoconfigure.condition.ConditionalOnProperty; +import org.springframework.context.annotation.Profile; +import org.springframework.stereotype.Service; + +import lombok.extern.slf4j.Slf4j; + +/** + * Mock implementation of {@link EnterpriseLicenseService}: records the intended licence action and + * returns a synthetic reference, without calling Keygen. Lets the whole procurement journey run + * end-to-end while the real Keygen management client is a later drop-in — the seam and the stored + * {@code license_ref} on the deal stay identical. + * + *

    This is the default; it steps aside for {@code KeygenEnterpriseLicenseService} when {@code + * stirling.keygen.enabled=true} (real Keygen secrets are wired). + */ +@Slf4j +@Service +@Profile("saas") +@ConditionalOnProperty( + name = "stirling.keygen.enabled", + havingValue = "false", + matchIfMissing = true) +public class MockEnterpriseLicenseService implements EnterpriseLicenseService { + + @Override + public String issueTrialLicense(Long teamId, String ownerEmail, LocalDateTime expiresAt) { + String ref = "mock-trial-" + UUID.randomUUID(); + // Owner email is deliberately not logged — it's PII and adds nothing to the mock trace. + log.info( + "[procurement][mock-license] issue trial team={} expires={} ref={}", + teamId, + expiresAt, + ref); + return ref; + } + + @Override + public void extendLicense(String licenseRef, LocalDateTime newExpiry) { + log.info("[procurement][mock-license] extend ref={} newExpiry={}", licenseRef, newExpiry); + } + + @Override + public String issueAnnualLicense( + Long teamId, + String ownerEmail, + LocalDateTime expiresAt, + String existingRef, + LicenseEntitlements ent) { + // Upgrade in place when a trial licence already exists, so the key stays stable. + String ref = existingRef != null ? existingRef : "mock-annual-" + UUID.randomUUID(); + // Owner email is deliberately not logged — it's PII and adds nothing to the mock trace. + log.info( + "[procurement][mock-license] issue annual team={} seats={} volume={} deployment={} expires={} ref={} upgrade={}", + teamId, + ent.seats(), + ent.volume(), + ent.deployment(), + expiresAt, + ref, + existingRef != null); + return ref; + } + + @Override + public void suspendLicense(String licenseRef) { + log.info("[procurement][mock-license] suspend ref={}", licenseRef); + } + + @Override + public String checkOutLicenseFile(String licenseRef) { + log.info("[procurement][mock-license] check-out licence file ref={}", licenseRef); + // A syntactically shaped stand-in so the portal download path is exercisable without + // Keygen; not a valid certificate. + return "-----BEGIN LICENSE FILE-----\nmock-offline-license-for-" + + licenseRef + + "\n-----END LICENSE FILE-----\n"; + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/model/ProcurementDeal.java b/app/saas/src/main/java/stirling/software/saas/procurement/model/ProcurementDeal.java new file mode 100644 index 0000000000..f97d66f365 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/model/ProcurementDeal.java @@ -0,0 +1,87 @@ +package stirling.software.saas.procurement.model; + +import java.io.Serializable; +import java.time.LocalDateTime; + +import org.hibernate.annotations.CreationTimestamp; +import org.hibernate.annotations.UpdateTimestamp; + +import jakarta.persistence.Column; +import jakarta.persistence.Entity; +import jakarta.persistence.GeneratedValue; +import jakarta.persistence.GenerationType; +import jakarta.persistence.Id; +import jakarta.persistence.Table; +import jakarta.persistence.Version; + +import lombok.Getter; +import lombok.NoArgsConstructor; +import lombok.Setter; + +/** + * A linked team's enterprise commercial journey (one per team). Stage mirrors the buyer journey the + * portal renders (trial -> quote -> agreement -> payment -> live). The entitlement that + * actually unlocks the product is the Keygen licence in {@code licenseRef}; the paid subscription, + * once commercial, is mirrored in {@code billing_subscriptions} and referenced by {@code + * subscriptionId}. + */ +@Entity +@Table(name = "procurement_deal") +@NoArgsConstructor +@Getter +@Setter +public class ProcurementDeal implements Serializable { + + private static final long serialVersionUID = 1L; + + public static final String STAGE_TRIAL = "trial"; + public static final String STAGE_QUOTE = "quote"; + public static final String STAGE_AGREEMENT = "security"; + public static final String STAGE_PAYMENT = "procurement"; + public static final String STAGE_LIVE = "active"; + + @Id + @GeneratedValue(strategy = GenerationType.IDENTITY) + @Column(name = "deal_id") + private Long dealId; + + @Column(name = "team_id", nullable = false, unique = true) + private Long teamId; + + @Column(name = "stage", nullable = false, length = 32) + private String stage = STAGE_TRIAL; + + @Column(name = "trial_started_at") + private LocalDateTime trialStartedAt; + + @Column(name = "trial_ends_at") + private LocalDateTime trialEndsAt; + + @Column(name = "trial_extensions_used", nullable = false) + private int trialExtensionsUsed; + + @Column(name = "license_ref", length = 128) + private String licenseRef; + + @Column(name = "subscription_id", length = 255) + private String subscriptionId; + + @Column(name = "accepted_quote_id") + private Long acceptedQuoteId; + + @CreationTimestamp + @Column(name = "created_at", nullable = false, updatable = false) + private LocalDateTime createdAt; + + @UpdateTimestamp + @Column(name = "updated_at", nullable = false) + private LocalDateTime updatedAt; + + @Version + @Column(name = "version", nullable = false) + private Long version; + + public ProcurementDeal(Long teamId) { + this.teamId = teamId; + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/model/ProcurementQuote.java b/app/saas/src/main/java/stirling/software/saas/procurement/model/ProcurementQuote.java new file mode 100644 index 0000000000..dd635a2cf6 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/model/ProcurementQuote.java @@ -0,0 +1,126 @@ +package stirling.software.saas.procurement.model; + +import java.io.Serializable; +import java.time.LocalDate; +import java.time.LocalDateTime; + +import org.hibernate.annotations.CreationTimestamp; +import org.hibernate.annotations.UpdateTimestamp; + +import jakarta.persistence.Column; +import jakarta.persistence.Entity; +import jakarta.persistence.GeneratedValue; +import jakarta.persistence.GenerationType; +import jakarta.persistence.Id; +import jakarta.persistence.Table; +import jakarta.persistence.Version; + +import lombok.Getter; +import lombok.NoArgsConstructor; +import lombok.Setter; + +/** + * A priced, itemised offer built against a {@link ProcurementDeal}. The config columns are the + * buyer's choices; {@code annualNetMinor}/{@code tcvMinor} and {@code lineItemsJson} are the + * server-computed result (never trusted from the client). Stripe fields are populated when the + * accepted quote is turned into a checkout. + */ +@Entity +@Table(name = "procurement_quote") +@NoArgsConstructor +@Getter +@Setter +public class ProcurementQuote implements Serializable { + + private static final long serialVersionUID = 1L; + + public static final String STATUS_DRAFT = "draft"; + public static final String STATUS_SENT = "sent"; + public static final String STATUS_ACCEPTED = "accepted"; + public static final String STATUS_EXPIRED = "expired"; + + @Id + @GeneratedValue(strategy = GenerationType.IDENTITY) + @Column(name = "quote_id") + private Long quoteId; + + @Column(name = "deal_id", nullable = false) + private Long dealId; + + @Column(name = "quote_number", nullable = false, length = 64) + private String quoteNumber; + + @Column(name = "status", nullable = false, length = 24) + private String status = STATUS_DRAFT; + + @Column(name = "currency", nullable = false, length = 8) + private String currency = "USD"; + + @Column(name = "volume", nullable = false) + private long volume; + + @Column(name = "seats") + private Integer seats; + + /** Policy posture as runs-per-PDF: Essentials 2, Governed 4, Regulated 7. Defaults Governed. */ + @Column(name = "intensity", nullable = false) + private int intensity = 4; + + @Column(name = "deployment", length = 24) + private String deployment; + + @Column(name = "term_years", nullable = false) + private int termYears; + + @Column(name = "service_level", nullable = false, length = 24) + private String serviceLevel; + + @Column(name = "indemnification", nullable = false) + private boolean indemnification; + + @Column(name = "training", nullable = false) + private boolean training; + + @Column(name = "qbr", nullable = false) + private boolean qbr; + + @Column(name = "offline_license", nullable = false) + private boolean offlineLicense; + + @Column(name = "annual_net_minor", nullable = false) + private long annualNetMinor; + + @Column(name = "tcv_minor", nullable = false) + private long tcvMinor; + + @Column(name = "line_items", columnDefinition = "text") + private String lineItemsJson; + + // The Stripe Quote this was issued as (finalized → has a number + PDF). Set by the edge fn. + @Column(name = "stripe_quote_id", length = 128) + private String stripeQuoteId; + + // Hosted Stripe invoice URL for the subscription's first invoice, set once the quote is + // accepted. + @Column(name = "stripe_invoice_url", columnDefinition = "text") + private String stripeInvoiceUrl; + + // Buyer's company name (shown on the quote/agreement); echoed back so an edit remembers it. + @Column(name = "business_name", length = 255) + private String businessName; + + @Column(name = "valid_until") + private LocalDate validUntil; + + @CreationTimestamp + @Column(name = "created_at", nullable = false, updatable = false) + private LocalDateTime createdAt; + + @UpdateTimestamp + @Column(name = "updated_at", nullable = false) + private LocalDateTime updatedAt; + + @Version + @Column(name = "version", nullable = false) + private Long version; +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/pricing/PricingRates.java b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/PricingRates.java new file mode 100644 index 0000000000..d10f216e8a --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/PricingRates.java @@ -0,0 +1,44 @@ +package stirling.software.saas.procurement.pricing; + +/** + * The enterprise rate card (D71): the inputs pricing derives a quote from. In production these are + * read from the Stripe price mirror; {@link #defaults()} is the fallback used when the {@code + * stripe} schema isn't synced (dev / tests) and is the single source of the numbers the marketing + * prototype ({@code quotePricing}) encodes. + * + *

    The meter is denominated in runs (a PDF running N policies is N runs). The per-run rate + * is a fraction of a dollar, so it lives here as a {@code double} in dollars; flat and one-time + * fees are whole-dollar amounts held in minor units (cents). See {@link ProcurementPricingService} + * for how they combine. + */ +public record PricingRates( + double listRatePerRun, // $0.01 list per run + double floorRatePerRun, // $0.005 asymptotic floor (cost + margin) + double discountPerDoubling, // 0.06 = 6% off the per-run rate per doubling past 1M runs/yr + double[] termDiscountByYear, // meter-only discount; index 0 = 1yr … index 4 = 5yr + double indemnificationRate, // fraction of the net meter (legal exposure scales with usage) + long dedicatedSupportMinor, // flat: dedicated SE/CSM (standard + priority are included) + long selfHostDeployMinor, // flat: self-hosted deployment + long airgapDeployMinor, // flat: air-gapped deployment + long qbrAnnualMinor, // flat: quarterly business reviews + long trainingOneTimeMinor) { // one-time: onboarding & training + + public static PricingRates defaults() { + return new PricingRates( + 0.01, // $0.01 / run list + 0.005, // $0.005 / run floor + 0.06, // 6% off per doubling of committed runs past 1M/yr + new double[] {0.0, 0.03, 0.05, 0.06, 0.07}, // 1–5 year term, meter only + 0.05, // IP indemnification = 5% of the net meter + 3_000_000, // dedicated SE/CSM $30,000 / yr + 1_200_000, // self-hosted $12,000 / yr + 3_600_000, // air-gapped $36,000 / yr + 800_000, // QBRs $8,000 / yr + 750_000); // onboarding & training $7,500 one-time + } + + public double termDiscount(int termYears) { + int idx = Math.max(1, Math.min(termYears, 5)) - 1; + return termDiscountByYear[idx]; + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/pricing/ProcurementPricingService.java b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/ProcurementPricingService.java new file mode 100644 index 0000000000..4707c94197 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/ProcurementPricingService.java @@ -0,0 +1,178 @@ +package stirling.software.saas.procurement.pricing; + +import java.util.ArrayList; +import java.util.List; +import java.util.Locale; + +import org.springframework.stereotype.Service; + +/** + * The canonical enterprise pricing engine (D71) — the single server-side definition the quote + * builder, the order form, and Stripe checkout all derive from. A faithful port of the marketing + * prototype's {@code quotePricing}: + * + * 

    + *   runVol    = volume x intensity            // posture: Essentials x2, Governed x4, Regulated x7
+ *   volDisc   = min(0.5, 0.06 x log2(runVol / 1M))   // 6% off the per-run rate per doubling past 1M
+ *   rate      = max($0.005, $0.01 x (1 - volDisc))   // continuous curve, floors at half a cent
+ *   meterNet  = round(runVol x rate x (1 - termDisc))    // whole dollars; term discounts the meter only
+ *   annualNet = meterNet + dedicated + deployment + indemnification + qbr   // needs priced flat
+ *   tcv       = annualNet x termYears + training
+ *
    + * + *

    No volume tiers, no service-level multipliers, no ACV floor — those were the retired model. + * Deployment (self-hosted / air-gapped) and dedicated support are flat line items at cost basis; + * SSO / SCIM / RBAC / audit are always included. Money is USD only; amounts are in minor units + * (cents). Rates come from {@link PricingRates} (Stripe-backed in prod). + */ +@Service +public class ProcurementPricingService { + + private static final double LOG2 = Math.log(2.0); + private static final long RUN_CURVE_KNEE = 1_000_000L; // discount starts past 1M committed runs + + /** + * Estimated annual PDF volume from seat count (~2,012.5 PDFs/user/yr = 5 docs/day x 230 working + * days x 1.75), used to prefill the builder's volume step. Matches the prototype's {@code users + * x 5 x 230 x 1.75}. + */ + public long estimateAnnualVolume(int users) { + return Math.round(Math.max(0, users) * 5.0 * 230.0 * 1.75); + } + + public QuoteBreakdown price(QuoteConfig cfg) { + return price(cfg, PricingRates.defaults()); + } + + public QuoteBreakdown price(QuoteConfig cfg, PricingRates rates) { + // Never trust the client's volume/intensity: clamp so a tampered request can't drive a + // negative amount. The curve and flat fees are server-side, so the browser can only pick a + // smaller legitimate config, never a cheaper rate. + long volume = Math.max(0, cfg.volume()); + int intensity = Math.max(1, cfg.intensity()); + long runVol = volume * (long) intensity; + + // Committed-volume curve: continuous, no cliffs. Floors at the per-run cost + margin. + double volDisc = + runVol > RUN_CURVE_KNEE + ? Math.min( + 0.5, + rates.discountPerDoubling() + * (Math.log(runVol / (double) RUN_CURVE_KNEE) / LOG2)) + : 0.0; + double rate = Math.max(rates.floorRatePerRun(), rates.listRatePerRun() * (1.0 - volDisc)); + double termDisc = rates.termDiscount(cfg.termYears()); + + // The meter is a whole-dollar figure (the quote reads in dollars), then minor units. + long annualBaseMinor = Math.round((double) runVol * rate) * 100L; + long meterNetMinor = Math.round((double) runVol * rate * (1.0 - termDisc)) * 100L; + long termDiscountMinor = meterNetMinor - annualBaseMinor; // <= 0 + + long support = + "dedicated".equalsIgnoreCase(cfg.serviceLevel()) + ? rates.dedicatedSupportMinor() + : 0L; + long deploy = deployFeeMinor(cfg.deployment(), rates); + long indemnity = + cfg.indemnification() + ? Math.round(meterNetMinor * rates.indemnificationRate()) + : 0L; + long qbr = cfg.qbr() ? rates.qbrAnnualMinor() : 0L; + long training = cfg.training() ? rates.trainingOneTimeMinor() : 0L; + + long annualNet = meterNetMinor + support + deploy + indemnity + qbr; + long tcv = annualNet * cfg.termYears() + training; + + double effectivePerPdf = rate * intensity; // quotes speak per-PDF-at-posture, never per-run + + List lines = new ArrayList<>(); + lines.add( + new QuoteLineItem( + "usage", + String.format( + Locale.ROOT, + "PDF processing — %,d PDFs/yr at $%.4f/PDF (%s posture)", + volume, + effectivePerPdf, + postureLabel(intensity)), + QuoteLineItem.Kind.RECURRING, + annualBaseMinor)); + lines.add( + new QuoteLineItem( + "seats", + "Unlimited users + SSO / SCIM / RBAC / audit", + QuoteLineItem.Kind.INCLUDED, + 0L)); + if (termDiscountMinor < 0) { + lines.add( + new QuoteLineItem( + "multi-year", + cfg.termYears() + "-year commitment", + QuoteLineItem.Kind.DISCOUNT, + termDiscountMinor)); + } + if (support > 0) { + lines.add( + new QuoteLineItem( + "support", + "Dedicated SE / CSM", + QuoteLineItem.Kind.RECURRING, + support)); + } + if (deploy > 0) { + lines.add( + new QuoteLineItem( + "deployment", + deploymentLabel(cfg.deployment()) + " deployment", + QuoteLineItem.Kind.RECURRING, + deploy)); + } + if (indemnity > 0) { + lines.add( + new QuoteLineItem( + "indemnification", + "IP indemnification", + QuoteLineItem.Kind.RECURRING, + indemnity)); + } + if (qbr > 0) { + lines.add( + new QuoteLineItem( + "qbr", + "Quarterly business reviews", + QuoteLineItem.Kind.RECURRING, + qbr)); + } + if (training > 0) { + lines.add( + new QuoteLineItem( + "training", + "Onboarding & training", + QuoteLineItem.Kind.ONE_TIME, + training)); + } + return new QuoteBreakdown(lines, annualNet, tcv, cfg.currency()); + } + + private static long deployFeeMinor(String deployment, PricingRates rates) { + if ("airgap".equalsIgnoreCase(deployment)) return rates.airgapDeployMinor(); + if ("selfhost".equalsIgnoreCase(deployment)) return rates.selfHostDeployMinor(); + return 0L; // cloud (managed) has no deployment fee + } + + /** Buyer-facing posture name for the intensity (policy count); the demo's POLICY_POSTURES. */ + private static String postureLabel(int intensity) { + return switch (intensity) { + case 2 -> "Essentials"; + case 4 -> "Governed"; + case 7 -> "Regulated"; + default -> intensity + "-policy"; + }; + } + + private static String deploymentLabel(String deployment) { + if ("airgap".equalsIgnoreCase(deployment)) return "Air-gapped"; + if ("selfhost".equalsIgnoreCase(deployment)) return "Self-hosted"; + return "Stirling Cloud"; + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/pricing/QuoteBreakdown.java b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/QuoteBreakdown.java new file mode 100644 index 0000000000..10ffde5271 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/QuoteBreakdown.java @@ -0,0 +1,12 @@ +package stirling.software.saas.procurement.pricing; + +import java.util.List; + +/** + * The priced result of a {@link QuoteConfig}: the itemised lines plus the two headline figures the + * order form and Stripe checkout are built from. {@code annualNetMinor} is the recurring annual fee + * after the multi-year discount; {@code tcvMinor} is total contract value across the term including + * one-time fees. Minor units (cents). + */ +public record QuoteBreakdown( + List lineItems, long annualNetMinor, long tcvMinor, String currency) {} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/pricing/QuoteConfig.java b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/QuoteConfig.java new file mode 100644 index 0000000000..cc6612c530 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/QuoteConfig.java @@ -0,0 +1,32 @@ +package stirling.software.saas.procurement.pricing; + +/** + * The buyer-configurable inputs to an enterprise quote. Mirrors the quote builder's four steps + * (volume, commitment & service, add-ons) and is the sole input to {@link + * ProcurementPricingService}. Amounts are never carried here — the service derives them from these + * choices and the rate card. + */ +public record QuoteConfig( + long volume, // committed PDFs per year + int users, // seats (drives the volume auto-estimate when the buyer hasn't overridden) + int intensity, // policy posture: runs per PDF — Essentials 2, Governed 4, Regulated 7 + String deployment, // cloud | selfhost | airgap (priced flat; inherited from the trial) + int termYears, // 1..5 + String serviceLevel, // standard | priority (both included) | dedicated (flat SE/CSM fee) + boolean indemnification, + boolean training, + boolean qbr, + boolean offlineLicense, // offline .lic availability (gates download; no longer priced here) + String currency) { // USD only for now + + /** Default posture when none is chosen — Governed (x4), per the pricing alignment decision. */ + public static final int DEFAULT_INTENSITY = 4; + + public QuoteConfig { + if (termYears < 1) termYears = 1; + if (termYears > 5) termYears = 5; + if (intensity < 1) intensity = DEFAULT_INTENSITY; + if (serviceLevel == null || serviceLevel.isBlank()) serviceLevel = "standard"; + if (currency == null || currency.isBlank()) currency = "USD"; + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/pricing/QuoteLineItem.java b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/QuoteLineItem.java new file mode 100644 index 0000000000..a8b0d29352 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/pricing/QuoteLineItem.java @@ -0,0 +1,16 @@ +package stirling.software.saas.procurement.pricing; + +/** + * One line on the itemised quote. {@code amountMinor} is in the currency's minor unit (cents); + * discounts are negative. {@code kind} drives how the portal groups it (recurring annual vs a + * one-time fee vs a discount line). + */ +public record QuoteLineItem(String key, String label, Kind kind, long amountMinor) { + + public enum Kind { + RECURRING, + ONE_TIME, + DISCOUNT, + INCLUDED + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/repository/ProcurementDealRepository.java b/app/saas/src/main/java/stirling/software/saas/procurement/repository/ProcurementDealRepository.java new file mode 100644 index 0000000000..14247ba1ba --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/repository/ProcurementDealRepository.java @@ -0,0 +1,17 @@ +package stirling.software.saas.procurement.repository; + +import java.util.Optional; + +import org.springframework.data.jpa.repository.JpaRepository; + +import stirling.software.saas.procurement.model.ProcurementDeal; + +public interface ProcurementDealRepository extends JpaRepository { + + Optional findByTeamId(Long teamId); + + boolean existsByTeamId(Long teamId); + + /** Reset: drop the team's deal (quotes + activity cascade via FK). */ + void deleteByTeamId(Long teamId); +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/repository/ProcurementQuoteRepository.java b/app/saas/src/main/java/stirling/software/saas/procurement/repository/ProcurementQuoteRepository.java new file mode 100644 index 0000000000..45f7af8225 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/repository/ProcurementQuoteRepository.java @@ -0,0 +1,12 @@ +package stirling.software.saas.procurement.repository; + +import java.util.List; + +import org.springframework.data.jpa.repository.JpaRepository; + +import stirling.software.saas.procurement.model.ProcurementQuote; + +public interface ProcurementQuoteRepository extends JpaRepository { + + List findByDealIdOrderByCreatedAtDesc(Long dealId); +} diff --git a/app/saas/src/main/java/stirling/software/saas/procurement/service/ProcurementService.java b/app/saas/src/main/java/stirling/software/saas/procurement/service/ProcurementService.java new file mode 100644 index 0000000000..57f530cc9a --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/procurement/service/ProcurementService.java @@ -0,0 +1,338 @@ +package stirling.software.saas.procurement.service; + +import java.time.LocalDate; +import java.time.LocalDateTime; +import java.util.List; +import java.util.Locale; +import java.util.Optional; +import java.util.UUID; + +import org.springframework.context.annotation.Profile; +import org.springframework.stereotype.Service; +import org.springframework.transaction.annotation.Transactional; + +import com.fasterxml.jackson.core.JsonProcessingException; +import com.fasterxml.jackson.databind.ObjectMapper; + +import lombok.extern.slf4j.Slf4j; + +import stirling.software.common.model.enumeration.TeamRole; +import stirling.software.saas.model.TeamMembership; +import stirling.software.saas.procurement.config.ProcurementConfigurationProperties; +import stirling.software.saas.procurement.license.EnterpriseLicenseService; +import stirling.software.saas.procurement.license.LicenseEntitlements; +import stirling.software.saas.procurement.model.ProcurementDeal; +import stirling.software.saas.procurement.model.ProcurementQuote; +import stirling.software.saas.procurement.pricing.ProcurementPricingService; +import stirling.software.saas.procurement.pricing.QuoteBreakdown; +import stirling.software.saas.procurement.pricing.QuoteConfig; +import stirling.software.saas.procurement.repository.ProcurementDealRepository; +import stirling.software.saas.procurement.repository.ProcurementQuoteRepository; +import stirling.software.saas.repository.TeamMembershipRepository; + +/** + * Orchestrates a linked team's procurement journey: start a (mock-licensed) trial, build a + * server-priced quote, and accept it. Stripe checkout itself lives in a Supabase edge function the + * portal calls with the accepted quote; on payment the webhook seeds {@code billing_subscriptions} + * and this service issues the annual licence. All amounts are minor units (cents). + */ +@Slf4j +@Service +@Profile("saas") +public class ProcurementService { + + // Local mapper for the line-items JSON snapshot; the saas context exposes no injectable + // ObjectMapper bean, and this (de)serialisation doesn't need Spring's configured one. + private static final ObjectMapper OBJECT_MAPPER = new ObjectMapper(); + + private final ProcurementDealRepository dealRepo; + private final ProcurementQuoteRepository quoteRepo; + private final ProcurementPricingService pricing; + private final EnterpriseLicenseService licenses; + private final ProcurementConfigurationProperties config; + private final TeamMembershipRepository memberRepo; + + public ProcurementService( + ProcurementDealRepository dealRepo, + ProcurementQuoteRepository quoteRepo, + ProcurementPricingService pricing, + EnterpriseLicenseService licenses, + ProcurementConfigurationProperties config, + TeamMembershipRepository memberRepo) { + this.dealRepo = dealRepo; + this.quoteRepo = quoteRepo; + this.pricing = pricing; + this.licenses = licenses; + this.config = config; + this.memberRepo = memberRepo; + } + + /** + * The team leader's email — the natural owner of the team's Keygen licence. Falls back to the + * username when no email is set; null when the team has no leader. + */ + private String leaderEmail(Long teamId) { + return memberRepo.findByTeamIdAndRole(teamId, TeamRole.LEADER).stream() + .findFirst() + .map(TeamMembership::getUser) + .map( + u -> + u.getEmail() != null && !u.getEmail().isBlank() + ? u.getEmail() + : u.getUsername()) + .orElse(null); + } + + @Transactional(readOnly = true) + public Optional getDeal(Long teamId) { + return dealRepo.findByTeamId(teamId); + } + + @Transactional(readOnly = true) + public List quotesForDeal(Long dealId) { + return quoteRepo.findByDealIdOrderByCreatedAtDesc(dealId); + } + + /** + * Start (or restart) the free trial for a team: issue a mock trial licence and stamp the trial + * window on the deal. No Stripe: a no-card trial has no subscription; the entitlement is the + * Keygen licence, and the deal row is the journey state. + */ + @Transactional + public ProcurementDeal startTrial(Long teamId) { + ProcurementDeal deal = + dealRepo.findByTeamId(teamId).orElseGet(() -> new ProcurementDeal(teamId)); + LocalDateTime now = LocalDateTime.now(); + LocalDateTime ends = now.plusDays(config.getTrialDurationDays()); + deal.setStage(ProcurementDeal.STAGE_TRIAL); + deal.setTrialStartedAt(now); + deal.setTrialEndsAt(ends); + deal.setTrialExtensionsUsed(0); + deal.setLicenseRef(licenses.issueTrialLicense(teamId, leaderEmail(teamId), ends)); + deal = dealRepo.save(deal); + log.info( + "[procurement] trial started team={} deal={} ends={}", + teamId, + deal.getDealId(), + ends); + return deal; + } + + /** Extend the current trial by the configured increment, up to the cap. */ + @Transactional + public ProcurementDeal extendTrial(Long teamId) { + ProcurementDeal deal = + dealRepo.findByTeamId(teamId) + .orElseThrow(() -> new IllegalStateException("No deal for team " + teamId)); + // Only extend while still in the trial. Past the trial (e.g. active), licenseRef points at + // the committed annual licence — extending would rewind its expiry. + if (!ProcurementDeal.STAGE_TRIAL.equals(deal.getStage())) { + throw new IllegalStateException("Trial extension only allowed during the trial stage"); + } + if (deal.getTrialExtensionsUsed() >= config.getMaxTrialExtensions()) { + throw new IllegalStateException("Trial extension cap reached"); + } + LocalDateTime base = + deal.getTrialEndsAt() != null ? deal.getTrialEndsAt() : LocalDateTime.now(); + LocalDateTime newEnd = base.plusDays(config.getTrialExtensionDays()); + deal.setTrialEndsAt(newEnd); + deal.setTrialExtensionsUsed(deal.getTrialExtensionsUsed() + 1); + if (deal.getLicenseRef() != null) { + licenses.extendLicense(deal.getLicenseRef(), newEnd); + } + return dealRepo.save(deal); + } + + /** Price a quote config server-side and persist it as a draft against the team's deal. */ + @Transactional + public ProcurementQuote buildQuote(Long teamId, QuoteConfig cfg, String businessName) { + ProcurementDeal deal = + dealRepo.findByTeamId(teamId).orElseGet(() -> new ProcurementDeal(teamId)); + if (ProcurementDeal.STAGE_LIVE.equals(deal.getStage())) { + throw new IllegalStateException("Cannot rebuild a quote on a live deal"); + } + // (Re)building a quote returns the deal to the quote stage and drops any prior acceptance, + // so a rebuild from security/payment can't leave a stale stage or accepted-quote pointer. + deal.setStage(ProcurementDeal.STAGE_QUOTE); + deal.setAcceptedQuoteId(null); + deal = dealRepo.save(deal); + + QuoteBreakdown breakdown = pricing.price(cfg); + + ProcurementQuote quote = new ProcurementQuote(); + quote.setDealId(deal.getDealId()); + quote.setQuoteNumber(nextQuoteNumber(deal.getDealId())); + // Priced but not yet issued: the edge fn creates the Stripe Quote and flips this to SENT. + quote.setStatus(ProcurementQuote.STATUS_DRAFT); + quote.setCurrency(cfg.currency()); + quote.setVolume(cfg.volume()); + quote.setSeats(cfg.users() > 0 ? cfg.users() : null); + quote.setIntensity(cfg.intensity()); + quote.setDeployment(cfg.deployment()); + quote.setTermYears(cfg.termYears()); + quote.setServiceLevel(cfg.serviceLevel()); + quote.setIndemnification(cfg.indemnification()); + quote.setTraining(cfg.training()); + quote.setQbr(cfg.qbr()); + quote.setOfflineLicense(cfg.offlineLicense()); + quote.setBusinessName(businessName); + quote.setAnnualNetMinor(breakdown.annualNetMinor()); + quote.setTcvMinor(breakdown.tcvMinor()); + quote.setLineItemsJson(writeLineItems(breakdown)); + quote.setValidUntil(LocalDate.now().plusDays(30)); + quote = quoteRepo.save(quote); + log.info( + "[procurement] quote built team={} quote={} annualNet={} tcv={}", + teamId, + quote.getQuoteNumber(), + quote.getAnnualNetMinor(), + quote.getTcvMinor()); + return quote; + } + + /** + * Advance the deal to the agreement (security) stage: the buyer has an issued quote and is + * reviewing the enterprise agreement before it's accepted into a subscription. Requires an + * issued quote on the deal. + */ + @Transactional + public ProcurementDeal startAgreement(Long teamId) { + ProcurementDeal deal = + dealRepo.findByTeamId(teamId) + .orElseThrow(() -> new IllegalStateException("No deal for team " + teamId)); + boolean hasIssuedQuote = + quoteRepo.findByDealIdOrderByCreatedAtDesc(deal.getDealId()).stream() + .anyMatch(q -> ProcurementQuote.STATUS_SENT.equals(q.getStatus())); + if (!hasIssuedQuote) { + throw new IllegalStateException("No issued quote for team " + teamId); + } + deal.setStage(ProcurementDeal.STAGE_AGREEMENT); + deal = dealRepo.save(deal); + log.info("[procurement] agreement stage team={} deal={}", teamId, deal.getDealId()); + return deal; + } + + /** + * Provision on accept: upgrade the team's licence to the committed annual term (valid + * immediately), so the buyer can get going the moment they accept — before the invoice is paid. + * Driven by the accept edge function once the subscription + invoice are created. Idempotent + * (upgrades the existing licence in place); deliberately does NOT change the stage — the deal + * stays in the payment step so the outstanding invoice remains visible until it settles. + */ + @Transactional + public ProcurementDeal provisionLicense(Long teamId) { + ProcurementDeal deal = + dealRepo.findByTeamId(teamId) + .orElseThrow(() -> new IllegalStateException("No deal for team " + teamId)); + deal.setLicenseRef(issueOrUpgradeAnnual(deal)); + deal = dealRepo.save(deal); + log.info("[procurement] licence provisioned team={} deal={}", teamId, deal.getDealId()); + return deal; + } + + /** + * Mark the deal fully live (advance to the active stage) once payment settles. In production + * this is the {@code invoice.paid} webhook; here it's the demo/manual stand-in. Re-affirms the + * annual licence in case provisioning didn't run at accept. + */ + @Transactional + public ProcurementDeal markLive(Long teamId) { + ProcurementDeal deal = + dealRepo.findByTeamId(teamId) + .orElseThrow(() -> new IllegalStateException("No deal for team " + teamId)); + deal.setLicenseRef(issueOrUpgradeAnnual(deal)); + deal.setStage(ProcurementDeal.STAGE_LIVE); + deal = dealRepo.save(deal); + log.info("[procurement] deal live team={} deal={}", teamId, deal.getDealId()); + return deal; + } + + /** + * Issue or upgrade the committed annual licence from the deal's accepted (else latest) quote, + * stamping the full entitlement snapshot onto it and upgrading the trial licence in place when + * one exists. + */ + private String issueOrUpgradeAnnual(ProcurementDeal deal) { + ProcurementQuote q = + deal.getAcceptedQuoteId() != null + ? quoteRepo.findById(deal.getAcceptedQuoteId()).orElse(null) + : quoteRepo.findByDealIdOrderByCreatedAtDesc(deal.getDealId()).stream() + .findFirst() + .orElse(null); + int term = q != null ? Math.max(1, q.getTermYears()) : 1; + String deployment = + q != null && q.getDeployment() != null && !q.getDeployment().isBlank() + ? q.getDeployment() + : "cloud"; + int seats = q != null && q.getSeats() != null ? q.getSeats() : 0; // 0 = unlimited + LicenseEntitlements entitlements = + new LicenseEntitlements( + q != null ? q.getVolume() : 0, + seats, + deployment, + term, + q != null ? q.getServiceLevel() : null, + q != null && q.isIndemnification(), + q != null && q.isTraining(), + q != null && q.isQbr(), + q != null && q.isOfflineLicense(), + deal.getDealId(), + deal.getSubscriptionId()); + return licenses.issueAnnualLicense( + deal.getTeamId(), + leaderEmail(deal.getTeamId()), + LocalDateTime.now().plusYears(term), + deal.getLicenseRef(), + entitlements); + } + + /** + * Check out the offline/air-gapped licence file for a team, when the offline add-on was + * purchased. Requires an issued licence on the deal and the accepted quote to carry the offline + * add-on; returns empty otherwise (so the controller can 404 rather than leak that a licence + * exists). The certificate is generated on demand by Keygen and never stored. + */ + @Transactional(readOnly = true) + public Optional offlineLicenseFile(Long teamId) { + ProcurementDeal deal = dealRepo.findByTeamId(teamId).orElse(null); + if (deal == null || deal.getLicenseRef() == null) return Optional.empty(); + if (!hasOfflineAddOn(deal)) return Optional.empty(); + return Optional.of(licenses.checkOutLicenseFile(deal.getLicenseRef())); + } + + /** + * Whether the deal's accepted quote carries the paid offline-licence add-on. Gated on + * the accepted quote (not the latest) so merely toggling the add-on on an unaccepted draft + * can't unlock the offline file — it's only available once the add-on has actually been bought. + */ + private boolean hasOfflineAddOn(ProcurementDeal deal) { + if (deal.getAcceptedQuoteId() == null) return false; + ProcurementQuote quote = quoteRepo.findById(deal.getAcceptedQuoteId()).orElse(null); + return quote != null && quote.isOfflineLicense(); + } + + /** + * Reset a team's procurement: delete the deal (quotes + activity cascade). For + * re-demos/testing. + */ + @Transactional + public void resetDeal(Long teamId) { + dealRepo.deleteByTeamId(teamId); + log.info("[procurement] deal reset team={}", teamId); + } + + private String nextQuoteNumber(Long dealId) { + int seq = quoteRepo.findByDealIdOrderByCreatedAtDesc(dealId).size() + 1; + String token = UUID.randomUUID().toString().substring(0, 4).toUpperCase(Locale.ROOT); + return String.format(Locale.ROOT, "QT-%s-%04d", token, seq); + } + + private String writeLineItems(QuoteBreakdown breakdown) { + try { + return OBJECT_MAPPER.writeValueAsString(breakdown.lineItems()); + } catch (JsonProcessingException e) { + log.warn("[procurement] failed to serialise line items", e); + return "[]"; + } + } +} diff --git a/app/saas/src/main/java/stirling/software/saas/security/SaasPortalAuditScopeResolver.java b/app/saas/src/main/java/stirling/software/saas/security/SaasPortalAuditScopeResolver.java new file mode 100644 index 0000000000..00c7c42757 --- /dev/null +++ b/app/saas/src/main/java/stirling/software/saas/security/SaasPortalAuditScopeResolver.java @@ -0,0 +1,45 @@ +package stirling.software.saas.security; + +import java.util.List; +import java.util.Objects; + +import org.springframework.context.annotation.Primary; +import org.springframework.context.annotation.Profile; +import org.springframework.stereotype.Component; + +import lombok.RequiredArgsConstructor; + +import stirling.software.proprietary.audit.PortalAuditScope; +import stirling.software.proprietary.audit.PortalAuditScopeResolver; +import stirling.software.saas.repository.TeamMembershipRepository; + +/** SaaS audit visibility: admins see the server; team LEADERs see their team (by member email). */ +@Component +@Primary +@Profile("saas") +@RequiredArgsConstructor +public class SaasPortalAuditScopeResolver implements PortalAuditScopeResolver { + + private final TeamSecurityExpressions teamSecurity; + private final TeamMembershipRepository membershipRepository; + + @Override + public PortalAuditScope resolve() { + if (PortalAuditScopeResolver.hasAdminAuthority()) { + return PortalAuditScope.server(); + } + if (!teamSecurity.isCurrentUserTeamLeader()) { + return PortalAuditScope.denied(); + } + Long teamId = teamSecurity.currentUserTeamId(); + if (teamId == null) { + return PortalAuditScope.denied(); + } + List memberEmails = + membershipRepository.findByTeamId(teamId).stream() + .map(m -> m.getUser() == null ? null : m.getUser().getEmail()) + .filter(Objects::nonNull) + .toList(); + return PortalAuditScope.team("team:" + teamId, memberEmails); + } +} diff --git a/app/saas/src/main/resources/application-saas.properties b/app/saas/src/main/resources/application-saas.properties index 1984974fef..49798d64cd 100644 --- a/app/saas/src/main/resources/application-saas.properties +++ b/app/saas/src/main/resources/application-saas.properties @@ -35,6 +35,15 @@ app.supabase.clock-skew-seconds=${app.jwt.clock-skew-seconds:120} app.supabase.edge-function-url=https://${app.supabase.project-ref}.supabase.co/functions/v1 app.supabase.edge-function-secret=${SUPABASE_EDGE_FUNCTION_SECRET:} +# ---------- Enterprise procurement licences (Keygen) ---------- +# Off by default → MockEnterpriseLicenseService (no real Keygen calls). Set enabled=true + the +# three creds to switch to the real KeygenEnterpriseLicenseService. Same account/policy as the +# self-hosted products; env names match the edge functions' KEYGEN_* for consistency. +stirling.keygen.enabled=${STIRLING_KEYGEN_ENABLED:false} +stirling.keygen.account-id=${KEYGEN_ACCOUNT_ID:} +stirling.keygen.api-token=${KEYGEN_API_TOKEN:} +stirling.keygen.policy-id=${KEYGEN_POLICY_ID:} + # ---------- PAYG meter reporting ---------- # Posts billable usage to the Supabase `meter-payg-units` edge function in the JobChargeService # close() afterCommit hook. Defaults to empty so unit tests / local dev are no-ops; set diff --git a/app/saas/src/main/resources/db/migration/saas/V27__procurement.sql b/app/saas/src/main/resources/db/migration/saas/V27__procurement.sql new file mode 100644 index 0000000000..0048f999c1 --- /dev/null +++ b/app/saas/src/main/resources/db/migration/saas/V27__procurement.sql @@ -0,0 +1,72 @@ +-- Enterprise procurement: the tables that track a linked team's journey from trial to live. +-- +-- One deal per team (the commercial journey: trial -> quote -> agreement -> payment -> live), the +-- quotes built against it (the itemised, priced offers), and an append-only activity log for the +-- money/licence-touching actions. The resulting subscription is mirrored in billing_subscriptions +-- (seeded on trial start / payment); the entitlement that unlocks the product is a Keygen licence +-- referenced by procurement_deal.license_ref. Prices are computed server-side (ProcurementPricingService). +-- +-- Additive and idempotent (IF NOT EXISTS) — safe on the shared dev branch. + +CREATE TABLE IF NOT EXISTS stirling_pdf.procurement_deal ( + deal_id BIGSERIAL PRIMARY KEY, + team_id BIGINT NOT NULL UNIQUE REFERENCES stirling_pdf.teams(team_id) ON DELETE CASCADE, + -- one active deal per team; the journey lives on this row. + stage VARCHAR(32) NOT NULL DEFAULT 'trial', + -- trial | quote | security (agreement) | procurement (payment) | active (live) + trial_started_at TIMESTAMP, + trial_ends_at TIMESTAMP, + trial_extensions_used INT NOT NULL DEFAULT 0, + license_ref VARCHAR(128), + -- Keygen licence id issued for this deal (trial or annual). Mocked until Keygen mgmt lands. + subscription_id VARCHAR(255), + -- Stripe subscription id, mirrored into billing_subscriptions once commercial. + accepted_quote_id BIGINT, + created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP, + updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP, + version BIGINT NOT NULL DEFAULT 0 +); + +CREATE TABLE IF NOT EXISTS stirling_pdf.procurement_quote ( + quote_id BIGSERIAL PRIMARY KEY, + deal_id BIGINT NOT NULL REFERENCES stirling_pdf.procurement_deal(deal_id) ON DELETE CASCADE, + quote_number VARCHAR(64) NOT NULL, + status VARCHAR(24) NOT NULL DEFAULT 'draft', + -- draft | sent | accepted | expired + currency VARCHAR(8) NOT NULL DEFAULT 'USD', + volume BIGINT NOT NULL, + seats INT, + deployment VARCHAR(24), + term_years INT NOT NULL, + service_level VARCHAR(24) NOT NULL, + indemnification BOOLEAN NOT NULL DEFAULT FALSE, + training BOOLEAN NOT NULL DEFAULT FALSE, + qbr BOOLEAN NOT NULL DEFAULT FALSE, + annual_net_minor BIGINT NOT NULL, + -- recurring annual fee after the multi-year discount, in minor units (cents). + tcv_minor BIGINT NOT NULL, + -- total contract value across the term incl. one-time fees, minor units. + line_items TEXT, + -- JSON snapshot of the itemised lines the order form renders. + stripe_price_id VARCHAR(128), + checkout_session_id VARCHAR(255), + checkout_url TEXT, + valid_until DATE, + created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP, + updated_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP, + version BIGINT NOT NULL DEFAULT 0 +); + +CREATE TABLE IF NOT EXISTS stirling_pdf.procurement_activity ( + activity_id BIGSERIAL PRIMARY KEY, + deal_id BIGINT NOT NULL REFERENCES stirling_pdf.procurement_deal(deal_id) ON DELETE CASCADE, + actor_user_id BIGINT, + -- the internal/portal user who took the action; informational (no FK). + action VARCHAR(48) NOT NULL, + -- trial_started | trial_extended | quote_built | quote_accepted | checkout_created | went_live ... + detail TEXT, + created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP +); + +CREATE INDEX IF NOT EXISTS idx_procurement_quote_deal ON stirling_pdf.procurement_quote (deal_id); +CREATE INDEX IF NOT EXISTS idx_procurement_activity_deal ON stirling_pdf.procurement_activity (deal_id); diff --git a/app/saas/src/main/resources/db/migration/saas/V28__procurement_stripe_quote.sql b/app/saas/src/main/resources/db/migration/saas/V28__procurement_stripe_quote.sql new file mode 100644 index 0000000000..5d83ee35f8 --- /dev/null +++ b/app/saas/src/main/resources/db/migration/saas/V28__procurement_stripe_quote.sql @@ -0,0 +1,8 @@ +-- Stripe Quote support: a procurement quote is issued as a real Stripe Quote (finalized → PDF + +-- shareable), and on acceptance Stripe creates the committed subscription + first invoice. The +-- Stripe operations live in Supabase edge functions; these columns hold the references they write +-- back. Twin of Supabase migration 20260703000000_procurement_stripe_quote.sql. + +ALTER TABLE stirling_pdf.procurement_quote + ADD COLUMN IF NOT EXISTS stripe_quote_id VARCHAR(128), + ADD COLUMN IF NOT EXISTS stripe_invoice_url TEXT; diff --git a/app/saas/src/main/resources/db/migration/saas/V29__procurement_business_name.sql b/app/saas/src/main/resources/db/migration/saas/V29__procurement_business_name.sql new file mode 100644 index 0000000000..ba9c74dde8 --- /dev/null +++ b/app/saas/src/main/resources/db/migration/saas/V29__procurement_business_name.sql @@ -0,0 +1,5 @@ +-- Persist the buyer's company name on the quote so re-editing remembers it and it can be shown on +-- the quote/agreement. Twin of Supabase migration 20260705000000_procurement_business_name.sql. + +ALTER TABLE stirling_pdf.procurement_quote + ADD COLUMN IF NOT EXISTS business_name VARCHAR(255); diff --git a/app/saas/src/main/resources/db/migration/saas/V30__procurement_offline_license.sql b/app/saas/src/main/resources/db/migration/saas/V30__procurement_offline_license.sql new file mode 100644 index 0000000000..e7ca0233a7 --- /dev/null +++ b/app/saas/src/main/resources/db/migration/saas/V30__procurement_offline_license.sql @@ -0,0 +1,6 @@ +-- Offline / air-gapped licence add-on flag on the quote (a paid add-on; priced like QBR). Written +-- and read by the Java backend via JPA. Twin of Supabase migration +-- 20260710000000_procurement_offline_license.sql. + +ALTER TABLE stirling_pdf.procurement_quote + ADD COLUMN IF NOT EXISTS offline_license BOOLEAN NOT NULL DEFAULT false; diff --git a/app/saas/src/main/resources/db/migration/saas/V31__procurement_intensity.sql b/app/saas/src/main/resources/db/migration/saas/V31__procurement_intensity.sql new file mode 100644 index 0000000000..4920d52d26 --- /dev/null +++ b/app/saas/src/main/resources/db/migration/saas/V31__procurement_intensity.sql @@ -0,0 +1,6 @@ +-- Policy posture (runs per PDF) on the quote: the D71 meter is denominated in runs, so a quote +-- must remember the posture it was priced at (Essentials 2, Governed 4, Regulated 7). Defaults to +-- Governed (4). Written and read by the Java backend via JPA. A Supabase twin migration mirrors it. + +ALTER TABLE stirling_pdf.procurement_quote + ADD COLUMN IF NOT EXISTS intensity INTEGER NOT NULL DEFAULT 4; diff --git a/app/saas/src/test/java/stirling/software/saas/procurement/pricing/ProcurementPricingServiceTest.java b/app/saas/src/test/java/stirling/software/saas/procurement/pricing/ProcurementPricingServiceTest.java new file mode 100644 index 0000000000..1676541db2 --- /dev/null +++ b/app/saas/src/test/java/stirling/software/saas/procurement/pricing/ProcurementPricingServiceTest.java @@ -0,0 +1,153 @@ +package stirling.software.saas.procurement.pricing; + +import static org.assertj.core.api.Assertions.assertThat; + +import org.junit.jupiter.api.Test; + +import stirling.software.saas.procurement.pricing.QuoteLineItem.Kind; + +/** + * Locks the D71 pricing engine to the numbers marketing publishes. The two anchor fixtures are the + * ones the demo memo foots against: acme (90M PDFs · Governed · self-hosted · dedicated · 3-yr = + * $1,752,000/yr, $5,256,000 TCV) and Northwind (6M · Governed · cloud · standard · 3-yr = + * $165,278/yr). If either moves, the engine has drifted from marketing. + */ +class ProcurementPricingServiceTest { + + private final ProcurementPricingService pricing = new ProcurementPricingService(); + + private static QuoteConfig cfg( + long volume, int intensity, String deployment, int term, String sla) { + return new QuoteConfig( + volume, 0, intensity, deployment, term, sla, false, false, false, false, "USD"); + } + + @Test + void acmeFixtureFootsExactly() { + // 90M PDFs × Governed(×4) = 360M runs → curve floors at $0.005/run → $0.0200/PDF effective. + // meter $1.8M − 5% (3-yr) = $1,710,000 + self-hosted $12K + dedicated SE/CSM $30K. + QuoteBreakdown q = pricing.price(cfg(90_000_000, 4, "selfhost", 3, "dedicated")); + + assertThat(q.annualNetMinor()).isEqualTo(175_200_000L); // $1,752,000 + assertThat(q.tcvMinor()).isEqualTo(525_600_000L); // $5,256,000 + assertThat(lineAmount(q, "support")).isEqualTo(3_000_000L); // dedicated SE/CSM $30K + assertThat(lineAmount(q, "deployment")).isEqualTo(1_200_000L); // self-hosted $12K + } + + @Test + void northwindFixtureFootsExactly() { + // 6M × Governed(×4) = 24M runs → $0.0290/PDF effective → $165,278/yr at 3-yr. + QuoteBreakdown q = pricing.price(cfg(6_000_000, 4, "cloud", 3, "standard")); + + assertThat(q.annualNetMinor()).isEqualTo(16_527_800L); // $165,278 + assertThat(q.tcvMinor()).isEqualTo(49_583_400L); // × 3 years + // Cloud + standard: no deployment or support line. + assertThat(q.lineItems()).noneMatch(l -> l.key().equals("deployment")); + assertThat(q.lineItems()).noneMatch(l -> l.key().equals("support")); + } + + @Test + void rateFloorsAtHalfACent() { + // 100M × Regulated(×7) = 700M runs — deep past the knee, so the per-run rate is pinned to + // the $0.005 floor: base meter = 700M × $0.005 = $3,500,000 (1-yr, no term discount). + QuoteBreakdown q = pricing.price(cfg(100_000_000, 7, "cloud", 1, "standard")); + assertThat(lineAmount(q, "usage")).isEqualTo(350_000_000L); // $3,500,000 + assertThat(q.annualNetMinor()).isEqualTo(350_000_000L); + } + + @Test + void postureDrivesThePrice() { + // Same PDFs, three postures — the meter scales with runs, so Regulated > Governed > + // Essentials. (This is what the retired flat-per-PDF model could not express.) + long essentials = pricing.price(cfg(6_000_000, 2, "cloud", 3, "standard")).annualNetMinor(); + long governed = pricing.price(cfg(6_000_000, 4, "cloud", 3, "standard")).annualNetMinor(); + long regulated = pricing.price(cfg(6_000_000, 7, "cloud", 3, "standard")).annualNetMinor(); + + assertThat(essentials).isLessThan(governed); + assertThat(governed).isLessThan(regulated); + assertThat(governed).isEqualTo(16_527_800L); // Governed is the Northwind anchor + } + + @Test + void deploymentIsAFlatFeeNotAMultiplier() { + long cloud = pricing.price(cfg(6_000_000, 4, "cloud", 3, "standard")).annualNetMinor(); + long selfhost = + pricing.price(cfg(6_000_000, 4, "selfhost", 3, "standard")).annualNetMinor(); + long airgap = pricing.price(cfg(6_000_000, 4, "airgap", 3, "standard")).annualNetMinor(); + + assertThat(selfhost - cloud).isEqualTo(1_200_000L); // +$12,000 flat + assertThat(airgap - cloud).isEqualTo(3_600_000L); // +$36,000 flat + } + + @Test + void standardAndPriorityIncludedDedicatedIsFlat() { + long standard = pricing.price(cfg(6_000_000, 4, "cloud", 3, "standard")).annualNetMinor(); + long priority = pricing.price(cfg(6_000_000, 4, "cloud", 3, "priority")).annualNetMinor(); + long dedicated = pricing.price(cfg(6_000_000, 4, "cloud", 3, "dedicated")).annualNetMinor(); + + assertThat(priority).isEqualTo(standard); // both included, no uplift + assertThat(dedicated - standard).isEqualTo(3_000_000L); // dedicated SE/CSM +$30,000 flat + } + + @Test + void termDiscountsTheMeterOnly() { + long oneYear = pricing.price(cfg(6_000_000, 4, "cloud", 1, "standard")).annualNetMinor(); + long twoYear = pricing.price(cfg(6_000_000, 4, "cloud", 2, "standard")).annualNetMinor(); + // 2-yr is 3% off the meter (discounted on the raw meter, then rounded to whole dollars). + assertThat(oneYear).isEqualTo(17_397_700L); // no discount + assertThat(twoYear).isEqualTo(16_875_700L); // −3% on the meter + assertThat(twoYear).isLessThan(oneYear); + } + + @Test + void indemnificationIsFivePercentOfTheMeter() { + long base = pricing.price(cfg(6_000_000, 4, "cloud", 3, "standard")).annualNetMinor(); + QuoteConfig c = + new QuoteConfig( + 6_000_000, 0, 4, "cloud", 3, "standard", true, false, false, false, "USD"); + QuoteBreakdown q = pricing.price(c); + assertThat(lineAmount(q, "indemnification")).isEqualTo(Math.round(base * 0.05)); + } + + @Test + void trainingIsOneTimeOutsideTheAnnual() { + QuoteConfig withTraining = + new QuoteConfig( + 6_000_000, 0, 4, "cloud", 3, "standard", false, true, false, false, "USD"); + QuoteBreakdown q = pricing.price(withTraining); + long baseAnnual = pricing.price(cfg(6_000_000, 4, "cloud", 3, "standard")).annualNetMinor(); + + assertThat(q.annualNetMinor()).isEqualTo(baseAnnual); // one-time never touches the annual + assertThat(q.tcvMinor()).isEqualTo(baseAnnual * 3 + 750_000L); // + $7,500 once + assertThat(q.lineItems()) + .anyMatch(l -> l.key().equals("training") && l.kind() == Kind.ONE_TIME); + } + + @Test + void unsetPostureDefaultsToGoverned() { + long defaulted = pricing.price(cfg(6_000_000, 0, "cloud", 3, "standard")).annualNetMinor(); + long governed = pricing.price(cfg(6_000_000, 4, "cloud", 3, "standard")).annualNetMinor(); + assertThat(defaulted).isEqualTo(governed); + } + + @Test + void ssoIsAlwaysAnIncludedZeroLine() { + QuoteBreakdown q = pricing.price(cfg(6_000_000, 4, "cloud", 3, "standard")); + assertThat(q.lineItems()) + .anyMatch(l -> l.key().equals("seats") && l.kind() == Kind.INCLUDED); + } + + @Test + void volumeEstimateFromSeats() { + assertThat(pricing.estimateAnnualVolume(100)).isEqualTo(201_250L); + assertThat(pricing.estimateAnnualVolume(0)).isZero(); + } + + private static long lineAmount(QuoteBreakdown q, String key) { + return q.lineItems().stream() + .filter(l -> l.key().equals(key)) + .mapToLong(QuoteLineItem::amountMinor) + .findFirst() + .orElseThrow(); + } +} diff --git a/build.gradle b/build.gradle index 3946b32449..5c89fd7af2 100644 --- a/build.gradle +++ b/build.gradle @@ -91,7 +91,7 @@ springBoot { allprojects { group = 'stirling.software' - version = '2.14.0' + version = '2.14.1' configurations.configureEach { exclude group: "org.springframework.boot", module: "spring-boot-starter-tomcat" diff --git a/docker/embedded/Dockerfile b/docker/embedded/Dockerfile index 8f53abb3ac..ab96b66e72 100644 --- a/docker/embedded/Dockerfile +++ b/docker/embedded/Dockerfile @@ -42,6 +42,9 @@ COPY . . ARG PROTOTYPES_BUILD=false ARG STIRLING_FLAVOR=proprietary ENV STIRLING_FLAVOR=${STIRLING_FLAVOR} +# Embed the admin portal app at /portal. Set true by the deploy workflow when the +# portal or AI layers change; defaults false so normal builds skip the extra app. +ARG BUILD_PORTAL=false # Bundle only the JPDFium native for this image's target arch. ARG TARGETARCH @@ -49,6 +52,7 @@ RUN JPDFIUM_PLATFORM="$([ "$TARGETARCH" = arm64 ] && echo linux-arm64 || echo li STIRLING_FLAVOR=${STIRLING_FLAVOR} \ gradle clean build \ -PbuildWithFrontend=true \ + -PbuildWithPortal=${BUILD_PORTAL} \ -PjpdfiumPlatforms="$JPDFIUM_PLATFORM" \ -PprototypesMode=${PROTOTYPES_BUILD} \ -x spotlessApply -x spotlessCheck -x test -x sonarqube \ diff --git a/docker/embedded/Dockerfile.fat b/docker/embedded/Dockerfile.fat index bc3b20349a..7238e2ac15 100644 --- a/docker/embedded/Dockerfile.fat +++ b/docker/embedded/Dockerfile.fat @@ -40,12 +40,15 @@ RUN gradle dependencies --no-daemon || true COPY . . +# Embed the admin portal app at /portal when the deploy workflow flags it. +ARG BUILD_PORTAL=false # Bundle only the JPDFium native for this image's target arch. ARG TARGETARCH RUN JPDFIUM_PLATFORM="$([ "$TARGETARCH" = arm64 ] && echo linux-arm64 || echo linux-x64)" && \ DISABLE_ADDITIONAL_FEATURES=false \ gradle clean build \ -PbuildWithFrontend=true \ + -PbuildWithPortal=${BUILD_PORTAL} \ -PjpdfiumPlatforms="$JPDFIUM_PLATFORM" \ -x spotlessApply -x spotlessCheck -x test -x sonarqube \ --no-daemon diff --git a/docker/embedded/Dockerfile.ultra-lite b/docker/embedded/Dockerfile.ultra-lite index 892009725d..26930b69dc 100644 --- a/docker/embedded/Dockerfile.ultra-lite +++ b/docker/embedded/Dockerfile.ultra-lite @@ -40,12 +40,15 @@ RUN ./gradlew dependencies --no-daemon || true COPY . . # Build ultra-lite JAR with embedded frontend (minimal features). +# Embed the admin portal app at /portal when the deploy workflow flags it. +ARG BUILD_PORTAL=false # Bundle only the JPDFium native for this image's target arch. ARG TARGETARCH RUN JPDFIUM_PLATFORM="$([ "$TARGETARCH" = arm64 ] && echo linux-arm64 || echo linux-x64)" && \ DISABLE_ADDITIONAL_FEATURES=true \ ./gradlew clean build \ -PbuildWithFrontend=true \ + -PbuildWithPortal=${BUILD_PORTAL} \ -PjpdfiumPlatforms="$JPDFIUM_PLATFORM" \ -x spotlessApply -x spotlessCheck -x test -x sonarqube \ --no-daemon diff --git a/engine/scripts/generate_tool_models.py b/engine/scripts/generate_tool_models.py index 9bc1458fea..dfe461fcca 100644 --- a/engine/scripts/generate_tool_models.py +++ b/engine/scripts/generate_tool_models.py @@ -59,6 +59,36 @@ class ToolDiscovery: "/api/v1/convert/", ) + # Endpoints under the allowed prefixes that are NOT edit-agent operations. A listed + # path and everything nested under it is dropped. Several kinds live here: + EXCLUDED_PATHS = ( + # 1. Cert-signing family: needs certificate/key files the agent can't supply, plus + # interactive session and hardware-token management. The whole subtree is dropped. + "/api/v1/security/cert-sign", + # 2. Interactive PDF text-editor endpoints, not one-shot operations. + "/api/v1/convert/pdf/text-editor", + "/api/v1/convert/text-editor/pdf", + # 3. Introspection / query endpoints that return metadata, a listing, or a + # verification verdict rather than a transformed document, so they belong to + # the question path, not the edit agent. (decompress is a dev-only stream op.) + "/api/v1/security/get-info-on-pdf", + "/api/v1/security/verify-pdf", + "/api/v1/security/validate-signature", + "/api/v1/misc/list-attachments", + "/api/v1/misc/show-javascript", + "/api/v1/misc/decompress-pdf", + "/api/v1/general/extract-bookmarks", + # 4. Require a secondary file (image, overlay PDF, attachments) on top of the input + # PDF. The agent only ever supplies the input PDF(s), so these can never run. + # (add-stamp / add-watermark stay: their text mode needs no extra file.) + "/api/v1/misc/add-image", + "/api/v1/misc/add-attachments", + "/api/v1/general/overlay-pdfs", + ) + + def _is_excluded(self, path: str) -> bool: + return any(path == p or path.startswith(p + "/") for p in self.EXCLUDED_PATHS) + def __init__(self, spec: dict[str, Any]): resource = Resource.from_contents(spec, default_specification=DRAFT202012) self.resolver = Registry().with_resource("", resource).resolver() @@ -73,17 +103,15 @@ class ToolDiscovery: for path, path_item in sorted(self.spec.get("paths", {}).items()): if "{" in path or not any(path.startswith(p) for p in self.ALLOWED_PATH_PREFIXES): continue + if self._is_excluded(path): + continue body_schema = self._get_request_body_schema(path_item) or {} query_props = self._get_query_parameters(path_item) body_props = body_schema.get("properties") or {} # Body properties win on name collision — body is the canonical param source # for the existing tools; query params are additive. properties = {**query_props, **body_props} - if not properties: - continue clean_props = self._filter_properties(properties) - if not clean_props: - continue enum_name = _deduplicate(_path_to_enum_name(path), used_enum) class_name = _deduplicate(_path_to_class_name(path), used_class) diff --git a/engine/src/stirling/agents/orchestrator.py b/engine/src/stirling/agents/orchestrator.py index c73d9dab32..e07e771e34 100644 --- a/engine/src/stirling/agents/orchestrator.py +++ b/engine/src/stirling/agents/orchestrator.py @@ -15,7 +15,6 @@ from stirling.agents.pdf_review import PdfReviewAgent from stirling.agents.user_spec import UserSpecAgent from stirling.contracts import ( AgentDraftWorkflowResponse, - ConvertMarkdownResponse, ExtractedTextArtifact, OrchestratorRequest, OrchestratorResponse, @@ -48,7 +47,7 @@ class OrchestratorAgent: ToolOutput( self.delegate_pdf_edit, name="delegate_pdf_edit", - description="Delegate requests for PDF modifications and return the PDF edit result.", + description="Delegate requests to modify or convert PDFs and return the PDF edit result.", ), ToolOutput( self.delegate_pdf_question, @@ -71,13 +70,6 @@ class OrchestratorAgent: " feedback')." ), ), - ToolOutput( - self.delegate_pdf_ingest, - name="delegate_pdf_ingest", - description=( - "Delegate requests to convert a PDF to Markdown or extract its content as readable text." - ), - ), ToolOutput( self.delegate_pdf_create, name="delegate_pdf_create", @@ -98,7 +90,7 @@ class OrchestratorAgent: system_prompt=( "You are the top-level orchestrator. " "Choose exactly one output function that best handles the request. " - "Use delegate_pdf_edit for any requested modification of one or more PDFs. " + "Use delegate_pdf_edit for any request to modify or convert one or more PDFs. " "Use delegate_pdf_question for questions about the contents of the attached PDFs. " "Use delegate_user_spec for requests to create or define an agent spec. " "Use delegate_pdf_review when the user wants the PDF returned with review" @@ -106,8 +98,6 @@ class OrchestratorAgent: " 'leave feedback on the PDF'. " "Use delegate_pdf_create when the user wants to generate a new document from" " scratch with no input file — invoices, reports, letters, contracts, etc. " - "Use delegate_pdf_ingest for any request to convert a PDF to Markdown " - "or extract its content as readable text. " "Use unsupported_capability when the user asks about the assistant itself " "or when none of the other outputs fit; supply a helpful message." ), @@ -177,13 +167,6 @@ class OrchestratorAgent: async def _run_agent_draft(self, request: OrchestratorRequest) -> AgentDraftWorkflowResponse: return await UserSpecAgent(self.runtime).orchestrate(request) - async def delegate_pdf_ingest(self, ctx: RunContext[OrchestratorDeps]) -> ConvertMarkdownResponse: - request = ctx.deps.request - return ConvertMarkdownResponse( - reason="PDF to Markdown requested — Java converts deterministically.", - files_to_ingest=request.files, - ) - async def delegate_pdf_review(self, ctx: RunContext[OrchestratorDeps]) -> PdfReviewOrchestrateResponse: return await self._run_pdf_review(ctx.deps.request) diff --git a/engine/src/stirling/contracts/__init__.py b/engine/src/stirling/contracts/__init__.py index 6c8d99d120..77ce40301e 100644 --- a/engine/src/stirling/contracts/__init__.py +++ b/engine/src/stirling/contracts/__init__.py @@ -13,7 +13,6 @@ from .common import ( AiFile, ArtifactKind, ConversationMessage, - ConvertMarkdownResponse, ExtractedFileText, GenerateFileResponse, MathAuditorToolReportArtifact, @@ -163,7 +162,6 @@ __all__ = [ "NeedContentFileRequest", "NeedContentResponse", "NeedIngestResponse", - "ConvertMarkdownResponse", "NextExecutionAction", "OrchestratorRequest", "OrchestratorResponse", diff --git a/engine/src/stirling/contracts/common.py b/engine/src/stirling/contracts/common.py index 8f35c9ceb4..d9105bad4e 100644 --- a/engine/src/stirling/contracts/common.py +++ b/engine/src/stirling/contracts/common.py @@ -62,7 +62,6 @@ class WorkflowOutcome(StrEnum): CANNOT_CONTINUE = "cannot_continue" UNSUPPORTED_CAPABILITY = "unsupported_capability" GENERATE_FILE = "generate_file" - CONVERT_MARKDOWN = "convert_markdown" class ArtifactKind(StrEnum): @@ -184,19 +183,6 @@ class NeedIngestResponse(ApiModel): content_types: list[PdfContentType] = Field(default_factory=list) -class ConvertMarkdownResponse(ApiModel): - """Terminal signal: convert the listed files to Markdown deterministically. - - This is a deterministic, non-AI conversion. Java runs the PDF→Markdown converter - (``PdfMarkdownConverter``) on each file and returns the resulting ``.md`` file(s) as a - completed result. There is no resume turn — the conversion output is the final answer. - """ - - outcome: Literal[WorkflowOutcome.CONVERT_MARKDOWN] = WorkflowOutcome.CONVERT_MARKDOWN - reason: str - files_to_ingest: list[AiFile] - - class ToolOperationStep(ApiModel): kind: Literal[StepKind.TOOL] = StepKind.TOOL tool: AnyToolId diff --git a/engine/src/stirling/contracts/orchestrator.py b/engine/src/stirling/contracts/orchestrator.py index 8b916ccaff..2d85853c51 100644 --- a/engine/src/stirling/contracts/orchestrator.py +++ b/engine/src/stirling/contracts/orchestrator.py @@ -11,7 +11,6 @@ from .common import ( AiFile, ArtifactKind, ConversationMessage, - ConvertMarkdownResponse, ExtractedFileText, GenerateFileResponse, NeedContentResponse, @@ -61,7 +60,6 @@ type OrchestratorResponse = Annotated[ | GenerateFileResponse | NeedContentResponse | NeedIngestResponse - | ConvertMarkdownResponse | AgentDraftResponse | NextExecutionAction | UnsupportedCapabilityResponse, diff --git a/engine/src/stirling/models/tool_models.py b/engine/src/stirling/models/tool_models.py index 3e179eaf0c..1827730283 100644 --- a/engine/src/stirling/models/tool_models.py +++ b/engine/src/stirling/models/tool_models.py @@ -11,13 +11,6 @@ from pydantic import Field, RootModel, SecretStr from stirling.models.base import ApiModel -class AddAttachmentsParams(ApiModel): - attachments: list[bytes] = Field(..., description="The image file to be overlaid onto the PDF.") - convert_to_pdf_a3b: bool = Field( - False, description="Convert the resulting PDF to PDF/A-3b format after adding attachments" - ) - - class AddCommentsParams(ApiModel): comments: str = Field( ..., @@ -28,12 +21,6 @@ class AddCommentsParams(ApiModel): ) -class AddImageParams(ApiModel): - every_page: bool = Field(False, description="Whether to overlay the image onto every page of the PDF.") - x: float = Field(0, description="The x-coordinate at which to place the top-left corner of the image.") - y: float = Field(0, description="The y-coordinate at which to place the top-left corner of the image.") - - class CustomMargin(StrEnum): """ Custom margin: small/medium/large/x-large @@ -107,7 +94,7 @@ class KeyLength(IntEnum): class AddPasswordParams(ApiModel): - key_length: KeyLength = Field(..., description="The length of the encryption key") + key_length: KeyLength = Field(KeyLength.integer_256, description="The length of the encryption key") owner_password: SecretStr | None = Field( None, description="The owner password to be added to the PDF file (Restricts what can be done with the document once it is opened)", @@ -312,50 +299,6 @@ class CbzToPdfParams(ApiModel): optimize_for_ebook: bool = Field(False, description="Optimize the output PDF for ebook reading using Ghostscript") -class CertType(StrEnum): - """ - The type of the digital certificate. WINDOWS_STORE and PKCS11 are hardware-backed and only available in the desktop app. - """ - - pem = "PEM" - pkcs12 = "PKCS12" - pfx = "PFX" - jks = "JKS" - server = "SERVER" - windows_store = "WINDOWS_STORE" - pkcs11 = "PKCS11" - - -class CertSignParams(ApiModel): - alias: str | None = Field( - None, - description="The alias of the certificate to sign with. Required for WINDOWS_STORE and recommended for PKCS11 tokens holding multiple certificates.", - ) - cert_type: CertType = Field( - ..., - description="The type of the digital certificate. WINDOWS_STORE and PKCS11 are hardware-backed and only available in the desktop app.", - ) - location: str = Field("SPDF", description="The location where the PDF is signed") - name: str = Field("SPDF", description="The name of the signer") - page_number: int = Field( - 1, - description="The page number where the signature should be visible. This is required if showSignature is set to true", - ) - password: SecretStr | None = Field( - None, description="The password for the keystore / private key, or the token PIN for PKCS11" - ) - pkcs11_library_path: str | None = Field( - None, - description="Absolute path to the PKCS#11 driver library (required for PKCS11 type). Must be an allowed driver - a detected one or configured via STIRLING_PKCS11_LIBRARIES.", - ) - pkcs11_slot: int | None = Field( - None, description="Optional PKCS#11 slot index. When omitted the first slot with a token is used." - ) - reason: str = Field("Signed by SPDF", description="The reason for signing the PDF") - show_logo: bool = Field(True, description="Whether to visually show a signature logo along with the signature") - show_signature: bool = Field(False, description="Whether to visually show the signature in the PDF file") - - class LineArtEdgeLevel(IntEnum): """ Edge detection strength to use for line art conversion (1-3). This maps to ImageMagick's -edge radius. @@ -525,6 +468,10 @@ class EmlToPdfParams(ApiModel): ) +class ExtractAttachmentsParams(ApiModel): + pass + + class ExtractImageScansParams(ApiModel): angle_threshold: int = Field(5, description="The angle threshold for the image scan extraction") border_size: int = Field(1, description="The border size for the image scan extraction") @@ -547,6 +494,10 @@ class ExtractImagesParams(ApiModel): format: Format = Field(Format.png, description="The output image format e.g., 'png', 'jpeg', or 'gif'") +class FileToPdfParams(ApiModel): + pass + + class FlattenParams(ApiModel): flatten_only_forms: bool = Field( False, description="True to flatten only the forms, false to flatten full PDF (Convert page to image)" @@ -602,6 +553,10 @@ class ImgToPdfParams(ApiModel): ) +class MarkdownToPdfParams(ApiModel): + pass + + class SortType(StrEnum): """ The type of sorting to be applied on the input files before merging. @@ -750,41 +705,6 @@ class OcrPdfParams(ApiModel): sidecar: bool | None = Field(None, description="Include OCR text in a sidecar text file if set to true") -class OverlayMode(StrEnum): - """ - The mode of overlaying: 'SequentialOverlay' for sequential application, 'InterleavedOverlay' for round-robin application, 'FixedRepeatOverlay' for fixed repetition based on provided counts - """ - - sequential_overlay = "SequentialOverlay" - interleaved_overlay = "InterleavedOverlay" - fixed_repeat_overlay = "FixedRepeatOverlay" - - -class OverlayPosition(Enum): - """ - Overlay position 0 is Foregound, 1 is Background - """ - - number_0 = 0 - number_1 = 1 - - -class OverlayPdfsParams(ApiModel): - counts: list[int] | None = Field( - None, - description="An array of integers specifying the number of times each corresponding overlay file should be applied in the 'FixedRepeatOverlay' mode. This should match the length of the overlayFiles array.", - ) - overlay_files: list[bytes] = Field( - ..., - description="An array of PDF files to be used as overlays on the base PDF. The order in these files is applied based on the selected mode.", - ) - overlay_mode: OverlayMode = Field( - ..., - description="The mode of overlaying: 'SequentialOverlay' for sequential application, 'InterleavedOverlay' for round-robin application, 'FixedRepeatOverlay' for fixed repetition based on provided counts", - ) - overlay_position: OverlayPosition = Field(..., description="Overlay position 0 is Foregound, 1 is Background") - - class PdfToCbrParams(ApiModel): dpi: int = Field(..., description="The DPI (Dots Per Inch) for rendering PDF pages as images", examples=[150]) @@ -841,6 +761,12 @@ class PdfToEpubParams(ApiModel): ) +class PdfToHtmlParams(ApiModel): + """ + Either upload a file or provide a server-side file ID + """ + + class ImageFormat(StrEnum): """ The output image format @@ -877,6 +803,12 @@ class PdfToImgParams(ApiModel): ) +class PdfToMarkdownParams(ApiModel): + """ + Either upload a file or provide a server-side file ID + """ + + class OutputFormat1(StrEnum): """ The output format type (PDF/A or PDF/X) @@ -912,13 +844,11 @@ class PdfToPresentationParams(ApiModel): output_format: OutputFormat2 = Field(..., description="The output Presentation format") -class PdfToTextEditorParams(ApiModel): +class PdfToSinglePageParams(ApiModel): """ Either upload a file or provide a server-side file ID """ - lightweight: bool = False - class OutputFormat3(StrEnum): """ @@ -979,10 +909,10 @@ class PdfToXlsxParams(ApiModel): ) -class Pkcs11CertificatesParams(ApiModel): - library_path: str | None = None - pin: str | None = None - slot: int | None = None +class PdfToXmlParams(ApiModel): + """ + Either upload a file or provide a server-side file ID + """ class CustomMode(StrEnum): @@ -1061,6 +991,18 @@ class RemoveBlanksParams(ApiModel): ) +class RemoveCertSignParams(ApiModel): + """ + Either upload a file or provide a server-side file ID + """ + + +class RemoveImagePdfParams(ApiModel): + """ + Either upload a file or provide a server-side file ID + """ + + class RemovePagesParams(ApiModel): page_numbers: str = Field( "all", @@ -1077,6 +1019,12 @@ class RenameAttachmentParams(ApiModel): new_name: str = Field(..., description="The new name for the attachment") +class RepairParams(ApiModel): + """ + Either upload a file or provide a server-side file ID + """ + + class HighContrastColorCombination(StrEnum): """ If HIGH_CONTRAST_COLOR option selected, then pick the default color option for text and background. @@ -1237,27 +1185,6 @@ class ScannerEffectParams(ApiModel): yellowish: bool | None = Field(None, description="Simulate yellowed paper", examples=[False]) -class WorkflowType(StrEnum): - signing = "SIGNING" - review = "REVIEW" - approval = "APPROVAL" - - -class Request(ApiModel): - document_name: str | None = None - due_date: str | None = None - message: str | None = None - owner_email: str | None = None - participant_emails: list[str] | None = None - participant_user_ids: list[int] | None = None - workflow_metadata: str | None = None - workflow_type: WorkflowType | None = None - - -class SessionsParams(ApiModel): - request: Request | None = None - - class SplitBySizeOrCountParams(ApiModel): split_type: int = Field( 0, description="Determines the type of split: 0 for size, 1 for page count, 2 for document count" @@ -1283,8 +1210,8 @@ class PageSize1(StrEnum): class SplitForPosterPrintParams(ApiModel): page_size: PageSize1 = Field(..., description="Target page size for output chunks (e.g., 'A4', 'Letter', 'A3')") right_to_left: bool = Field(False, description="Split right-to-left instead of left-to-right") - xfactor: int | None = None - yfactor: int | None = None + x_factor: int = Field(2, description="Horizontal decimation factor (how many columns to split into)", ge=1, le=10) + y_factor: int = Field(2, description="Vertical decimation factor (how many rows to split into)", ge=1, le=10) class SplitPagesParams(ApiModel): @@ -1360,6 +1287,12 @@ class TimestampPdfParams(ApiModel): ) +class UnlockPdfFormsParams(ApiModel): + """ + Either upload a file or provide a server-side file ID + """ + + class Trapped(StrEnum): """ The trapped status of the document @@ -1399,11 +1332,6 @@ class UrlToPdfParams(ApiModel): url_input: str = Field(..., description="The input URL to be converted to a PDF file") -class ValidateCertificateParams(ApiModel): - cert_type: str | None = None - password: str | None = None - - class OutputFormat6(StrEnum): """ Target vector format extension @@ -1462,20 +1390,24 @@ class Model( | CbzToPdfParams | EbookToPdfParams | EmlToPdfParams + | FileToPdfParams | HtmlToPdfParams | ImgToPdfParams + | MarkdownToPdfParams | PdfToCbrParams | PdfToCbzParams | PdfToCsvParams | PdfToEpubParams + | PdfToHtmlParams | PdfToImgParams + | PdfToMarkdownParams | PdfToPdfaParams | PdfToPresentationParams | PdfToTextParams - | PdfToTextEditorParams | PdfToVectorParams | PdfToWordParams | PdfToXlsxParams + | PdfToXmlParams | SvgToPdfParams | UrlToPdfParams | VectorToPdfParams @@ -1485,8 +1417,9 @@ class Model( | EditTextParams | MergePdfsParams | MultiPageLayoutParams - | OverlayPdfsParams + | PdfToSinglePageParams | RearrangePagesParams + | RemoveImagePdfParams | RemovePagesParams | RotatePdfParams | ScalePagesParams @@ -1495,33 +1428,31 @@ class Model( | SplitPagesParams | SplitPdfByChaptersParams | SplitPdfBySectionsParams - | AddAttachmentsParams | AddCommentsParams - | AddImageParams | AddPageNumbersParams | AddStampParams | AutoRenameParams | AutoSplitPdfParams | CompressPdfParams | DeleteAttachmentParams + | ExtractAttachmentsParams | ExtractImageScansParams | ExtractImagesParams | FlattenParams | OcrPdfParams | RemoveBlanksParams | RenameAttachmentParams + | RepairParams | ReplaceInvertPdfParams | ScannerEffectParams + | UnlockPdfFormsParams | UpdateMetadataParams | AddPasswordParams | AddWatermarkParams | AutoRedactParams - | CertSignParams - | Pkcs11CertificatesParams - | SessionsParams - | ValidateCertificateParams | RedactParams | RedactExecuteParams + | RemoveCertSignParams | RemovePasswordParams | SanitizePdfParams | TimestampPdfParams @@ -1532,20 +1463,24 @@ class Model( | CbzToPdfParams | EbookToPdfParams | EmlToPdfParams + | FileToPdfParams | HtmlToPdfParams | ImgToPdfParams + | MarkdownToPdfParams | PdfToCbrParams | PdfToCbzParams | PdfToCsvParams | PdfToEpubParams + | PdfToHtmlParams | PdfToImgParams + | PdfToMarkdownParams | PdfToPdfaParams | PdfToPresentationParams | PdfToTextParams - | PdfToTextEditorParams | PdfToVectorParams | PdfToWordParams | PdfToXlsxParams + | PdfToXmlParams | SvgToPdfParams | UrlToPdfParams | VectorToPdfParams @@ -1555,8 +1490,9 @@ class Model( | EditTextParams | MergePdfsParams | MultiPageLayoutParams - | OverlayPdfsParams + | PdfToSinglePageParams | RearrangePagesParams + | RemoveImagePdfParams | RemovePagesParams | RotatePdfParams | ScalePagesParams @@ -1565,33 +1501,31 @@ class Model( | SplitPagesParams | SplitPdfByChaptersParams | SplitPdfBySectionsParams - | AddAttachmentsParams | AddCommentsParams - | AddImageParams | AddPageNumbersParams | AddStampParams | AutoRenameParams | AutoSplitPdfParams | CompressPdfParams | DeleteAttachmentParams + | ExtractAttachmentsParams | ExtractImageScansParams | ExtractImagesParams | FlattenParams | OcrPdfParams | RemoveBlanksParams | RenameAttachmentParams + | RepairParams | ReplaceInvertPdfParams | ScannerEffectParams + | UnlockPdfFormsParams | UpdateMetadataParams | AddPasswordParams | AddWatermarkParams | AutoRedactParams - | CertSignParams - | Pkcs11CertificatesParams - | SessionsParams - | ValidateCertificateParams | RedactParams | RedactExecuteParams + | RemoveCertSignParams | RemovePasswordParams | SanitizePdfParams | TimestampPdfParams @@ -1603,20 +1537,24 @@ type ParamToolModel = ( | CbzToPdfParams | EbookToPdfParams | EmlToPdfParams + | FileToPdfParams | HtmlToPdfParams | ImgToPdfParams + | MarkdownToPdfParams | PdfToCbrParams | PdfToCbzParams | PdfToCsvParams | PdfToEpubParams + | PdfToHtmlParams | PdfToImgParams + | PdfToMarkdownParams | PdfToPdfaParams | PdfToPresentationParams | PdfToTextParams - | PdfToTextEditorParams | PdfToVectorParams | PdfToWordParams | PdfToXlsxParams + | PdfToXmlParams | SvgToPdfParams | UrlToPdfParams | VectorToPdfParams @@ -1626,8 +1564,9 @@ type ParamToolModel = ( | EditTextParams | MergePdfsParams | MultiPageLayoutParams - | OverlayPdfsParams + | PdfToSinglePageParams | RearrangePagesParams + | RemoveImagePdfParams | RemovePagesParams | RotatePdfParams | ScalePagesParams @@ -1636,33 +1575,31 @@ type ParamToolModel = ( | SplitPagesParams | SplitPdfByChaptersParams | SplitPdfBySectionsParams - | AddAttachmentsParams | AddCommentsParams - | AddImageParams | AddPageNumbersParams | AddStampParams | AutoRenameParams | AutoSplitPdfParams | CompressPdfParams | DeleteAttachmentParams + | ExtractAttachmentsParams | ExtractImageScansParams | ExtractImagesParams | FlattenParams | OcrPdfParams | RemoveBlanksParams | RenameAttachmentParams + | RepairParams | ReplaceInvertPdfParams | ScannerEffectParams + | UnlockPdfFormsParams | UpdateMetadataParams | AddPasswordParams | AddWatermarkParams | AutoRedactParams - | CertSignParams - | Pkcs11CertificatesParams - | SessionsParams - | ValidateCertificateParams | RedactParams | RedactExecuteParams + | RemoveCertSignParams | RemovePasswordParams | SanitizePdfParams | TimestampPdfParams @@ -1675,20 +1612,24 @@ class ToolEndpoint(StrEnum): CBZ_TO_PDF = "/api/v1/convert/cbz/pdf" EBOOK_TO_PDF = "/api/v1/convert/ebook/pdf" EML_TO_PDF = "/api/v1/convert/eml/pdf" + FILE_TO_PDF = "/api/v1/convert/file/pdf" HTML_TO_PDF = "/api/v1/convert/html/pdf" IMG_TO_PDF = "/api/v1/convert/img/pdf" + MARKDOWN_TO_PDF = "/api/v1/convert/markdown/pdf" PDF_TO_CBR = "/api/v1/convert/pdf/cbr" PDF_TO_CBZ = "/api/v1/convert/pdf/cbz" PDF_TO_CSV = "/api/v1/convert/pdf/csv" PDF_TO_EPUB = "/api/v1/convert/pdf/epub" + PDF_TO_HTML = "/api/v1/convert/pdf/html" PDF_TO_IMG = "/api/v1/convert/pdf/img" + PDF_TO_MARKDOWN = "/api/v1/convert/pdf/markdown" PDF_TO_PDFA = "/api/v1/convert/pdf/pdfa" PDF_TO_PRESENTATION = "/api/v1/convert/pdf/presentation" PDF_TO_TEXT = "/api/v1/convert/pdf/text" - PDF_TO_TEXT_EDITOR = "/api/v1/convert/pdf/text-editor" PDF_TO_VECTOR = "/api/v1/convert/pdf/vector" PDF_TO_WORD = "/api/v1/convert/pdf/word" PDF_TO_XLSX = "/api/v1/convert/pdf/xlsx" + PDF_TO_XML = "/api/v1/convert/pdf/xml" SVG_TO_PDF = "/api/v1/convert/svg/pdf" URL_TO_PDF = "/api/v1/convert/url/pdf" VECTOR_TO_PDF = "/api/v1/convert/vector/pdf" @@ -1698,8 +1639,9 @@ class ToolEndpoint(StrEnum): EDIT_TEXT = "/api/v1/general/edit-text" MERGE_PDFS = "/api/v1/general/merge-pdfs" MULTI_PAGE_LAYOUT = "/api/v1/general/multi-page-layout" - OVERLAY_PDFS = "/api/v1/general/overlay-pdfs" + PDF_TO_SINGLE_PAGE = "/api/v1/general/pdf-to-single-page" REARRANGE_PAGES = "/api/v1/general/rearrange-pages" + REMOVE_IMAGE_PDF = "/api/v1/general/remove-image-pdf" REMOVE_PAGES = "/api/v1/general/remove-pages" ROTATE_PDF = "/api/v1/general/rotate-pdf" SCALE_PAGES = "/api/v1/general/scale-pages" @@ -1708,33 +1650,31 @@ class ToolEndpoint(StrEnum): SPLIT_PAGES = "/api/v1/general/split-pages" SPLIT_PDF_BY_CHAPTERS = "/api/v1/general/split-pdf-by-chapters" SPLIT_PDF_BY_SECTIONS = "/api/v1/general/split-pdf-by-sections" - ADD_ATTACHMENTS = "/api/v1/misc/add-attachments" ADD_COMMENTS = "/api/v1/misc/add-comments" - ADD_IMAGE = "/api/v1/misc/add-image" ADD_PAGE_NUMBERS = "/api/v1/misc/add-page-numbers" ADD_STAMP = "/api/v1/misc/add-stamp" AUTO_RENAME = "/api/v1/misc/auto-rename" AUTO_SPLIT_PDF = "/api/v1/misc/auto-split-pdf" COMPRESS_PDF = "/api/v1/misc/compress-pdf" DELETE_ATTACHMENT = "/api/v1/misc/delete-attachment" + EXTRACT_ATTACHMENTS = "/api/v1/misc/extract-attachments" EXTRACT_IMAGE_SCANS = "/api/v1/misc/extract-image-scans" EXTRACT_IMAGES = "/api/v1/misc/extract-images" FLATTEN = "/api/v1/misc/flatten" OCR_PDF = "/api/v1/misc/ocr-pdf" REMOVE_BLANKS = "/api/v1/misc/remove-blanks" RENAME_ATTACHMENT = "/api/v1/misc/rename-attachment" + REPAIR = "/api/v1/misc/repair" REPLACE_INVERT_PDF = "/api/v1/misc/replace-invert-pdf" SCANNER_EFFECT = "/api/v1/misc/scanner-effect" + UNLOCK_PDF_FORMS = "/api/v1/misc/unlock-pdf-forms" UPDATE_METADATA = "/api/v1/misc/update-metadata" ADD_PASSWORD = "/api/v1/security/add-password" ADD_WATERMARK = "/api/v1/security/add-watermark" AUTO_REDACT = "/api/v1/security/auto-redact" - CERT_SIGN = "/api/v1/security/cert-sign" - PKCS11_CERTIFICATES = "/api/v1/security/cert-sign/hardware/pkcs11-certificates" - SESSIONS = "/api/v1/security/cert-sign/sessions" - VALIDATE_CERTIFICATE = "/api/v1/security/cert-sign/validate-certificate" REDACT = "/api/v1/security/redact" REDACT_EXECUTE = "/api/v1/security/redact-execute" + REMOVE_CERT_SIGN = "/api/v1/security/remove-cert-sign" REMOVE_PASSWORD = "/api/v1/security/remove-password" SANITIZE_PDF = "/api/v1/security/sanitize-pdf" TIMESTAMP_PDF = "/api/v1/security/timestamp-pdf" @@ -1745,20 +1685,24 @@ OPERATIONS: dict[ToolEndpoint, ParamToolModelType] = { ToolEndpoint.CBZ_TO_PDF: CbzToPdfParams, ToolEndpoint.EBOOK_TO_PDF: EbookToPdfParams, ToolEndpoint.EML_TO_PDF: EmlToPdfParams, + ToolEndpoint.FILE_TO_PDF: FileToPdfParams, ToolEndpoint.HTML_TO_PDF: HtmlToPdfParams, ToolEndpoint.IMG_TO_PDF: ImgToPdfParams, + ToolEndpoint.MARKDOWN_TO_PDF: MarkdownToPdfParams, ToolEndpoint.PDF_TO_CBR: PdfToCbrParams, ToolEndpoint.PDF_TO_CBZ: PdfToCbzParams, ToolEndpoint.PDF_TO_CSV: PdfToCsvParams, ToolEndpoint.PDF_TO_EPUB: PdfToEpubParams, + ToolEndpoint.PDF_TO_HTML: PdfToHtmlParams, ToolEndpoint.PDF_TO_IMG: PdfToImgParams, + ToolEndpoint.PDF_TO_MARKDOWN: PdfToMarkdownParams, ToolEndpoint.PDF_TO_PDFA: PdfToPdfaParams, ToolEndpoint.PDF_TO_PRESENTATION: PdfToPresentationParams, ToolEndpoint.PDF_TO_TEXT: PdfToTextParams, - ToolEndpoint.PDF_TO_TEXT_EDITOR: PdfToTextEditorParams, ToolEndpoint.PDF_TO_VECTOR: PdfToVectorParams, ToolEndpoint.PDF_TO_WORD: PdfToWordParams, ToolEndpoint.PDF_TO_XLSX: PdfToXlsxParams, + ToolEndpoint.PDF_TO_XML: PdfToXmlParams, ToolEndpoint.SVG_TO_PDF: SvgToPdfParams, ToolEndpoint.URL_TO_PDF: UrlToPdfParams, ToolEndpoint.VECTOR_TO_PDF: VectorToPdfParams, @@ -1768,8 +1712,9 @@ OPERATIONS: dict[ToolEndpoint, ParamToolModelType] = { ToolEndpoint.EDIT_TEXT: EditTextParams, ToolEndpoint.MERGE_PDFS: MergePdfsParams, ToolEndpoint.MULTI_PAGE_LAYOUT: MultiPageLayoutParams, - ToolEndpoint.OVERLAY_PDFS: OverlayPdfsParams, + ToolEndpoint.PDF_TO_SINGLE_PAGE: PdfToSinglePageParams, ToolEndpoint.REARRANGE_PAGES: RearrangePagesParams, + ToolEndpoint.REMOVE_IMAGE_PDF: RemoveImagePdfParams, ToolEndpoint.REMOVE_PAGES: RemovePagesParams, ToolEndpoint.ROTATE_PDF: RotatePdfParams, ToolEndpoint.SCALE_PAGES: ScalePagesParams, @@ -1778,33 +1723,31 @@ OPERATIONS: dict[ToolEndpoint, ParamToolModelType] = { ToolEndpoint.SPLIT_PAGES: SplitPagesParams, ToolEndpoint.SPLIT_PDF_BY_CHAPTERS: SplitPdfByChaptersParams, ToolEndpoint.SPLIT_PDF_BY_SECTIONS: SplitPdfBySectionsParams, - ToolEndpoint.ADD_ATTACHMENTS: AddAttachmentsParams, ToolEndpoint.ADD_COMMENTS: AddCommentsParams, - ToolEndpoint.ADD_IMAGE: AddImageParams, ToolEndpoint.ADD_PAGE_NUMBERS: AddPageNumbersParams, ToolEndpoint.ADD_STAMP: AddStampParams, ToolEndpoint.AUTO_RENAME: AutoRenameParams, ToolEndpoint.AUTO_SPLIT_PDF: AutoSplitPdfParams, ToolEndpoint.COMPRESS_PDF: CompressPdfParams, ToolEndpoint.DELETE_ATTACHMENT: DeleteAttachmentParams, + ToolEndpoint.EXTRACT_ATTACHMENTS: ExtractAttachmentsParams, ToolEndpoint.EXTRACT_IMAGE_SCANS: ExtractImageScansParams, ToolEndpoint.EXTRACT_IMAGES: ExtractImagesParams, ToolEndpoint.FLATTEN: FlattenParams, ToolEndpoint.OCR_PDF: OcrPdfParams, ToolEndpoint.REMOVE_BLANKS: RemoveBlanksParams, ToolEndpoint.RENAME_ATTACHMENT: RenameAttachmentParams, + ToolEndpoint.REPAIR: RepairParams, ToolEndpoint.REPLACE_INVERT_PDF: ReplaceInvertPdfParams, ToolEndpoint.SCANNER_EFFECT: ScannerEffectParams, + ToolEndpoint.UNLOCK_PDF_FORMS: UnlockPdfFormsParams, ToolEndpoint.UPDATE_METADATA: UpdateMetadataParams, ToolEndpoint.ADD_PASSWORD: AddPasswordParams, ToolEndpoint.ADD_WATERMARK: AddWatermarkParams, ToolEndpoint.AUTO_REDACT: AutoRedactParams, - ToolEndpoint.CERT_SIGN: CertSignParams, - ToolEndpoint.PKCS11_CERTIFICATES: Pkcs11CertificatesParams, - ToolEndpoint.SESSIONS: SessionsParams, - ToolEndpoint.VALIDATE_CERTIFICATE: ValidateCertificateParams, ToolEndpoint.REDACT: RedactParams, ToolEndpoint.REDACT_EXECUTE: RedactExecuteParams, + ToolEndpoint.REMOVE_CERT_SIGN: RemoveCertSignParams, ToolEndpoint.REMOVE_PASSWORD: RemovePasswordParams, ToolEndpoint.SANITIZE_PDF: SanitizePdfParams, ToolEndpoint.TIMESTAMP_PDF: TimestampPdfParams, diff --git a/frontend/.gitignore b/frontend/.gitignore index e07dce196a..0605e6e79f 100644 --- a/frontend/.gitignore +++ b/frontend/.gitignore @@ -11,6 +11,7 @@ # production /build /dist +/dist-portal /storybook-static /editor/build diff --git a/frontend/.storybook/declarations.d.ts b/frontend/.storybook/declarations.d.ts new file mode 100644 index 0000000000..ef6d741f62 --- /dev/null +++ b/frontend/.storybook/declarations.d.ts @@ -0,0 +1 @@ +declare module "*.css" {} diff --git a/frontend/.storybook/main.ts b/frontend/.storybook/main.ts index 4d4aadc8f8..8547e9092a 100644 --- a/frontend/.storybook/main.ts +++ b/frontend/.storybook/main.ts @@ -61,6 +61,11 @@ const config: StorybookConfig = { config.define = { ...(config.define ?? {}), "import.meta.env.VITE_SAAS_API_URL": JSON.stringify("http://saas.mock"), + // Keep the Supabase auth env empty so ensureSaasSupabase() is a no-op and + // never replaces the mock SaaS client stubbed in preview.tsx. + "import.meta.env.VITE_SUPABASE_URL": JSON.stringify(""), + "import.meta.env.VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY": + JSON.stringify(""), }; return config; }, diff --git a/frontend/.storybook/preview.tsx b/frontend/.storybook/preview.tsx index d086613f44..76463001fe 100644 --- a/frontend/.storybook/preview.tsx +++ b/frontend/.storybook/preview.tsx @@ -2,12 +2,11 @@ // the decorators below transpiles to React.createElement and needs React in // scope. (The app + story files use the automatic runtime via the portal vite // config; this import is specifically for the preview config file.) -import React, { useEffect } from "react"; +import React, { Suspense, useEffect } from "react"; import type { Decorator, Preview } from "@storybook/react-vite"; import { initialize, mswLoader } from "msw-storybook-addon"; import { MemoryRouter } from "react-router-dom"; import { withThemeByDataAttribute } from "@storybook/addon-themes"; -import { MantineProvider } from "@mantine/core"; // Reference React so the import isn't dropped as unused by the bundler — the // classic runtime needs it present even though it's not named in the JSX. @@ -15,9 +14,9 @@ void React; import { TierProvider, type Tier } from "@portal/contexts/TierContext"; import { LinkProvider, type LinkState } from "@portal/contexts/LinkContext"; -import { ThemeProvider } from "@portal/contexts/ThemeContext"; +import { ThemeProvider, useTheme } from "@portal/contexts/ThemeContext"; import { UIProvider } from "@portal/contexts/UIContext"; -import { mantineTheme } from "@portal/theme/mantineTheme"; +import { SuiProvider } from "@portal/theme/SuiProvider"; import { handlers } from "@portal/mocks/handlers"; import { configureSupabase } from "@proprietary/auth/supabase/supabaseClient"; @@ -30,10 +29,10 @@ initialize({ onUnhandledRequest: "bypass" }, handlers); // Storybook-only: stub a SaaS session so apiClient.saas reads (invoices, payment // method, wallet) clear the session check and reach the MSW handlers instead of -// failing with "No SaaS session". VITE_SAAS_SUPABASE_URL/KEY are intentionally -// unset, so ensureSaasSupabase() is a no-op and never replaces this client; only -// VITE_SAAS_API_URL (a mock origin MSW matches) is configured — injected via -// .storybook/main.ts's viteFinal define, not a frontend/.env file. +// failing with "No SaaS session". VITE_SUPABASE_URL/KEY are defined empty (see +// .storybook/main.ts), so ensureSaasSupabase() is a no-op and never replaces this +// client; only VITE_SAAS_API_URL (a mock origin MSW matches) is configured — +// injected via .storybook/main.ts's viteFinal define, not a frontend/.env file. const saasStub = configureSupabase({ url: "http://saas.mock", key: "storybook-anon-key", @@ -79,13 +78,21 @@ function TierKey({ ); } -/** Keeps useTheme() and the data-theme attribute in sync. */ -function ThemeWatcher() { +/** + * Makes the Storybook toolbar the SINGLE source of truth for the theme. + */ +function ThemeBridge({ + theme, + children, +}: { + theme: "light" | "dark"; + children: React.ReactNode; +}) { + const { setTheme } = useTheme(); useEffect(() => { - // The addon-themes decorator already sets data-theme on . - // We just read it on mount so ThemeProvider picks it up. - }, []); - return null; + setTheme(theme); + }, [theme, setTheme]); + return <>{children}; } const withProviders: Decorator = (Story, context) => { @@ -102,18 +109,21 @@ const withProviders: Decorator = (Story, context) => { return ( - - {/* LinkProvider must wrap TierProvider: TierContext derives its tier - from useLink() (matches App.tsx's nesting). */} - - - - - - - - - + + + {/* LinkProvider must wrap TierProvider: TierContext derives its tier + from useLink() (matches App.tsx's nesting). */} + + + + + + + + + + + ); diff --git a/frontend/.storybook/tsconfig.json b/frontend/.storybook/tsconfig.json new file mode 100644 index 0000000000..9615d34a22 --- /dev/null +++ b/frontend/.storybook/tsconfig.json @@ -0,0 +1,24 @@ +{ + "compilerOptions": { + "target": "es2022", + "jsx": "react-jsx", + "module": "esnext", + "moduleResolution": "bundler", + "paths": { + "@app/*": [ + "../editor/src/desktop/*", + "../editor/src/proprietary/*", + "../editor/src/core/*" + ], + "@core/*": ["../editor/src/core/*"], + "@proprietary/*": ["../editor/src/proprietary/*"], + "@portal/*": ["../editor/src/portal/*"] + }, + "resolveJsonModule": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "skipLibCheck": true + }, + "include": ["./**/*"] +} diff --git a/frontend/editor/.env b/frontend/editor/.env index f8f3c2e308..264a01e952 100644 --- a/frontend/editor/.env +++ b/frontend/editor/.env @@ -7,6 +7,10 @@ # API base URL — use / for same-origin (default for web builds) VITE_API_BASE_URL=/ +# Include the admin portal's lazy route/chunk in the build (set true by +# -PbuildWithPortal in the JAR). Off by default; always on in dev. +VITE_INCLUDE_PORTAL=false + # Google Drive integration VITE_GOOGLE_DRIVE_CLIENT_ID= VITE_GOOGLE_DRIVE_API_KEY= @@ -22,3 +26,6 @@ VITE_STRIPE_PUBLISHABLE_KEY=pk_live_51Q56W2P9mY5IAnSnp3kcxG50uyFMLuhM4fFs774DAP3 # PostHog analytics VITE_PUBLIC_POSTHOG_KEY=phc_VOdeYnlevc2T63m3myFGjeBlRcIusRgmhfx6XL5a1iz VITE_PUBLIC_POSTHOG_HOST=https://eu.i.posthog.com + +# Calendly scheduling link (portal "Schedule a call") +VITE_CALENDLY_URL=https://calendly.com/d/cm4p-zz5-yy8/stirling-pdf-15-minute-group-discussion diff --git a/frontend/editor/.env.proprietary b/frontend/editor/.env.proprietary index ed5498ba3a..0ee7e66bc9 100644 --- a/frontend/editor/.env.proprietary +++ b/frontend/editor/.env.proprietary @@ -18,13 +18,6 @@ VITE_EDITOR_URL=/ # backend. VITE_PORTAL_MOCKS= -# Hosted SaaS Supabase project for the self-hosted portal's IN-APP account -# linking (both values are public). Set per deploy; absent -> the account-link -# UI shows a "configure" state. For local e2e, point these at the SaaS Supabase -# project the local backend links against. -VITE_SAAS_SUPABASE_URL= -VITE_SAAS_SUPABASE_ANON_KEY= - # Hosted SaaS Java backend base URL (e.g. https://api.stirlingpdf.com). Used for # ATTENDED portal -> SaaS reads (wallet, billing, plans, checkout) with the # admin's Supabase JWT. Distinct from the local backend (reached same-origin via diff --git a/frontend/editor/playwright.config.ts b/frontend/editor/playwright.config.ts index 7a049e2632..93e6572392 100644 --- a/frontend/editor/playwright.config.ts +++ b/frontend/editor/playwright.config.ts @@ -30,7 +30,18 @@ export default defineConfig({ forbidOnly: !!process.env.CI, retries: process.env.CI ? 2 : 0, workers: process.env.CI ? 1 : "50%", - reporter: [["html", { open: "never" }], ["list"]], + // In CI, add a JSON report alongside the HTML/list output so the workflow + // can flag flaky tests (passed only on retry) as warnings without failing + // the job. Path is pinned via PLAYWRIGHT_JSON_OUTPUT_FILE in the workflow; + // the outputFile here is just a sane default. Omitted locally to keep dev + // runs' terminal output clean. + reporter: process.env.CI + ? [ + ["html", { open: "never" }], + ["list"], + ["json", { outputFile: "playwright-report/results.json" }], + ] + : [["html", { open: "never" }], ["list"]], timeout: 60_000, expect: { timeout: 10_000 }, diff --git a/frontend/editor/postcss.config.js b/frontend/editor/postcss.config.js index 7b8895cce8..5bb7b5d6ef 100644 --- a/frontend/editor/postcss.config.js +++ b/frontend/editor/postcss.config.js @@ -1,3 +1,6 @@ -module.exports = { - plugins: [require("@tailwindcss/postcss"), require("autoprefixer")], +import tailwindcssPostcss from "@tailwindcss/postcss"; +import autoprefixer from "autoprefixer"; + +export default { + plugins: [tailwindcssPostcss, autoprefixer], }; diff --git a/frontend/editor/public/locales/en-US/translation.toml b/frontend/editor/public/locales/en-US/translation.toml index 346ece1523..e81f5eaebb 100644 --- a/frontend/editor/public/locales/en-US/translation.toml +++ b/frontend/editor/public/locales/en-US/translation.toml @@ -7,6 +7,7 @@ black = "Black" blue = "Blue" cancel = "Cancel" chooseFile = "Choose File" +clear = "Clear" close = "Close" comingSoon = "Coming soon" confirm = "Confirm" @@ -87,6 +88,7 @@ processingCompleteMultiple = "{{count}} files are ready." property = "Property" quickPosition = "Quick Position" red = "Red" +remove = "Remove" reset = "Reset" review = "Review" save = "Save" @@ -180,6 +182,7 @@ addMoreFiles = "Add more files..." attachments = "Select Attachments" info = "Select files to attach to your PDF. These files will be embedded and accessible through the PDF's attachment panel." placeholder = "Choose files..." +removeFile = "Remove file" selectedFiles = "Selected Files" submit = "Add Attachments" @@ -1628,6 +1631,9 @@ title = "Do you want to help make Stirling PDF better?" tags = "annotate,highlight,draw,markup,comment,notes,review,redline,feedback,markup tools,sticky notes,shapes,arrows,text box,freehand" [annotation] +alignCenter = "Align center" +alignLeft = "Align left" +alignRight = "Align right" annotationStyle = "Annotation style" backgroundColor = "Background color" borderOff = "Border: Off" @@ -2531,6 +2537,7 @@ title = "Rule of thumb" [certSign.source] device = "This device" +noOtherSources = "No other certificate sources are available." server = "Server" stepTitle = "Certificate source" upload = "Upload" @@ -3595,7 +3602,9 @@ makeCopy = "Make a copy" mobileShort = "Mobile" mobileUpload = "Mobile Upload" mobileUploadNotAvailable = "Mobile upload not enabled" +moreOptions = "More options" myFiles = "My Files" +nextFile = "Next file" noFiles = "No files available" noFilesFound = "No files found matching your search" noRecentFiles = "No recent files found" @@ -3605,6 +3614,7 @@ openInFileEditor = "Open in File Editor" openInPageEditor = "Open in Page Editor" owner = "Owner" ownerUnknown = "Unknown" +previousFile = "Previous file" recent = "Recent" removeBoth = "Remove from both" removeFilePrompt = "This file is saved on this device and on your server. Where would you like to remove it from?" @@ -4614,10 +4624,10 @@ welcomeTitle = "You've been invited!" [landing] addFiles = "Add Files" heroSubtitle = "Drop in or add an existing PDF to get started." -heroTitle = "Stirling PDF" mobileUpload = "Upload from Mobile" openFromComputer = "Open from computer" uploadFromComputer = "Upload from computer" +workbenchEmptyStateHero = "Drop a PDF anywhere" [language] direction = "ltr" @@ -4930,6 +4940,7 @@ title = "Output" [onboarding] activeFiles = "The Active Files view shows all of the PDFs you have loaded into the tool, and allows you to select which ones to process." allTools = "This is the Tools panel, where you can browse and select from all available PDF tools." +close = "Close" cropSettings = "Now that we've selected the file we want crop, we can configure the Crop tool to choose the area that we want to crop the PDF to." fileCheckbox = "Clicking one of the files selects it for processing. You can select multiple files for batch operations." fileReplacement = "The modified file will replace the original file in the Workbench automatically, allowing you to easily run it through more tools." @@ -4955,6 +4966,7 @@ skipTheTour = "Skip the tour" [onboarding.desktopInstall] body = "Stirling works best as a desktop app. You can use it offline, access documents faster, and make edits locally on your computer." +selectOs = "Select operating system" title = "Download" titleWithOs = "Download for {{osLabel}}" @@ -5566,7 +5578,9 @@ viewLabel = "PDF Editor" [pdfTextEditor.actions] applyChanges = "Apply Changes" +clearText = "Clear text" downloadCopy = "Download Copy" +moreOptions = "More options" reset = "Reset Changes" [pdfTextEditor.badges] @@ -6048,6 +6062,17 @@ stepOf = "Step {{step}} of {{total}}" toolChainDesc = "Configure the tools this policy runs on each document." typesSelected = "{{count}} types selected" +[policy] +badgeEnforcing = "{{name}} enforcing..." +badgeRan = "{{name}} policy ran on this file" +blockingAction = "{{action}} blocked while enforcing policy, please wait..." +dismiss = "Dismiss overlay" +enforcingTitle = "Enforcing policy..." +viewAnyway = "View file (policy still enforcing)" + +[portal] +comingSoon = "Coming soon" + [portal.accountLink.card] billingNote = "Unattended processing bills against your org wallet." eyebrow = "Account link" @@ -6259,7 +6284,6 @@ cost = "Cost" editorsDeployed = "Editors deployed" inviteTeammates = "Invite teammates" pdfsEdited = "PDFs edited" -previewBadge = "Preview · sample data" subtitle = "Deploy anywhere, for your whole team." title = "Free PDF Editors" @@ -6555,7 +6579,9 @@ beforeHelper = "header against your signing secret before trusting a payload. SD beforeSignature = "Verify the" [portal.documents] -subtitle = "Review and approve documents moving through your pipelines." +exportCsv = "Export CSV" +search = "Search by filename, ID..." +subtitle = "Every document your org has processed, with its full processing record. Content access is request-gated." title = "Documents" [portal.documents.audit] @@ -6593,42 +6619,38 @@ value = "Value" [portal.documents.filters] all = "All" -archived = "Archived" ariaLabel = "Filter documents by status" -needsReview = "Needs review" +flagged = "Flagged" +inReview = "In review" processed = "Processed" [portal.documents.overview] -confidence = "Confidence" -fieldsExtracted = "Fields extracted" -received = "Received" -source = "Source" +action = "Pipeline / Action" +product = "Product" +received = "Time" status = "Status" type = "Type" +user = "User" [portal.documents.queue.empty] description = "As sources feed documents into your pipelines they'll appear here for review." title = "No documents in the queue" -[portal.documents.summary] -avgConfidence = "Avg confidence" -inQueue = "In queue" -needsReview = "Needs review" -processedToday = "Processed today" - [portal.documents.table] +auto = "Auto" +editorAction = "Editor" empty = "No documents match this filter." +rowActions = "Row actions" sensitiveLabel = "Sensitive" sensitiveTitle = "Sensitive — access required" [portal.documents.table.columns] -confidence = "Confidence" -fields = "Fields" -name = "Name" -source = "Source" +action = "Pipeline / Action" +document = "Document" +product = "Product" status = "Status" time = "Time" -type = "Type" +user = "User" [portal.editorAdmin] subtitle = "Deploy the Stirling PDF Editor, pair self-hosted instances to your org, and operate the running fleet — targets, health, credentials, and offline activation in one place." @@ -6725,6 +6747,23 @@ ready = "Ready to deploy" description = "Once documents are processed, your 30-day usage appears here." title = "No usage yet" +[portal.home.editor] +activeUsers = "{{n}} active" +invite = "Invite teammates" +name = "Stirling PDF Editor" +open = "Open in browser" +updated = "updated {{time}}" + +[portal.home.editor.target] +cloud = "Managed Cloud" +docker = "Self-hosted · Docker" +kubernetes = "Self-hosted · Kubernetes" + +[portal.home.greeting] +afternoon = "Good afternoon" +evening = "Good evening" +morning = "Good morning" + [portal.home.kpis.enterprise] docs30d = "Docs / 30d" evalPassRate = "Eval pass rate" @@ -6745,15 +6784,31 @@ evalPassRate = "Eval pass rate" pipelines = "Pipelines" [portal.home.onboarding] -progress = "{{done}} / {{total}} done" -runAgain = "Run again" -start = "Start" -subtitle = "Four steps to a production-shaped Stirling project." -title = "Get to value" +dismiss = "Dismiss setup" +notStarted = "Not started" +progress = "{{done}} of {{total}} done" +title = "Finish setting up" -[portal.home.onboarding.empty] -description = "Onboarding tasks will appear here once your workspace is set up." -title = "No onboarding steps yet" +[portal.home.onboarding.enterprise] +body = "Org-wide SSO + SCIM + RBAC, committed volume pricing, and air-gapped deployment." +cta = "Start Trial" +ctaQuote = "Get Quote" +lead = "For 250+ employees." +tag = "Enterprise" + +[portal.home.onboarding.steps.editor] +blurb = "Deploy the desktop app, free forever." +title = "Download the PDF Editor" + +[portal.home.onboarding.steps.policies] +blurb = "{{active}} active · {{recommended}} recommended" +chip = "{{active}} active" +title = "Turn on policies" + +[portal.home.onboarding.steps.sources] +blurb = "{{connected}} connected · every PDF governed where it lands" +chip = "{{connected}} connected" +title = "Connect your sources" [portal.home.productGrid] ariaLabel = "Process PDFs at scale" @@ -6840,13 +6895,32 @@ actor = "Actor" event = "Event" latency = "Latency" status = "Status" -target = "Target" +target = "Resource" timestamp = "Timestamp" [portal.infrastructure.audit.empty] description = "Workspace activity will appear here as it happens." title = "No audit events" +[portal.infrastructure.audit.export] +cancel = "Cancel" +error = "Export failed. Please try again." +exportButton = "Export" +exporting = "Exporting…" +fieldsLegend = "Columns" +format = "Format" +open = "Export" +subtitle = "Download audit events as CSV or JSON. Choose which columns to include." +title = "Export audit log" + +[portal.infrastructure.audit.export.fields] +date = "Date" +documentName = "Document name" +ipAddress = "IP address" +outcome = "Outcome" +tool = "Tool" +username = "Username" + [portal.infrastructure.audit.filters] all = "All" auth = "Auth" @@ -6855,6 +6929,10 @@ elevation = "Elevation" processing = "Processing" security = "Security" +[portal.infrastructure.audit.forbidden] +description = "The audit log is available to team leads and admins. Ask your team lead or an admin for access." +title = "You don't have access" + [portal.infrastructure.audit.metrics] config = "Config" elevation = "Elevation" @@ -7183,18 +7261,39 @@ title = "Pipelines" [portal.pipelines.actions] newPipeline = "New pipeline" +[portal.pipelines.builder] +addStep = "Add tool" +back = "Back to pipelines" +discard = "Discard changes" +enabled = "Enabled" +keepEditing = "Keep editing" +needsUpload = "Needs an uploaded file" +noToolMatches = "No tools match your search." +pipelineSettings = "Pipeline settings" +searchTools = "Search tools" +selectToolBody = "Add a tool to build your pipeline." +selectToolTitle = "No tools yet" +toolSettings = "Tool settings" +unknownStep = "Unrecognized operation, kept as-is." +unsavedBody = "You have unsaved changes. Save them before leaving, or discard them?" +unsavedTitle = "Unsaved changes" +uploadUnsupported = "Uploaded files aren't supported in pipelines yet, so these steps can't be saved: {{tools}}." +usesDefaults = "Runs with default settings" + [portal.pipelines.composer] +addTool = "Add tool" cancel = "Cancel" -chainEmpty = "Add operations from the palette below." +chainEmpty = "Add a tool to start building your pipeline." create = "Create pipeline" directory = "Output folder" directoryHelp = "Absolute path on the server. Must be within the configured allowed folders." -editTitle = "Edit pipeline" +editingUnsupported = "Displaying these tool params for editing is not supported yet." moveDown = "Move down" moveUp = "Move up" name = "Name" namePlaceholder = "e.g. Redaction sweep" noSources = "No sources connected yet. The pipeline can still run on files supplied to it directly." +noToolSettings = "This tool has no configurable settings." operations_one = "Operation ({{count}})" operations_other = "Operations ({{count}})" output = "Output" @@ -7203,8 +7302,6 @@ save = "Save changes" scheduleEvery = "Run every" sources = "Sources" sourcesLoading = "Loading sources..." -subtitle = "Pick the sources it runs over, chain the operations, then choose when it runs and where output goes." -title = "New pipeline" trigger = "Trigger" triggerManual = "Manual only" @@ -7220,18 +7317,8 @@ confirm = "Delete" title = "Delete pipeline?" [portal.pipelines.detail] -closeAriaLabel = "Close detail" delete = "Delete pipeline" -edit = "Edit" -noSources = "No sources. Files are supplied directly to each run." -noSteps = "No operations configured." -output = "Output" -pause = "Pause" -resume = "Resume" run = "Run now" -sources = "Sources" -steps = "Operations" -subtitle = "{{trigger}} · {{status}}" [portal.pipelines.empty] action = "Create a pipeline" @@ -7253,6 +7340,7 @@ completed_other = "All {{count}} runs completed." empty = "Nothing to run: the sources had no documents to process." failed = "Run failed: {{error}}" running = "Run started; still in progress." +timeout = "Run is taking longer than expected; it may still finish in the background." [portal.pipelines.status] active = "Active" @@ -7430,7 +7518,7 @@ upgrade = "Upgrade" volumeSuffix = "PDFs processed · last 30 days" [portal.procurement] -enterpriseBadge = "Enterprise" +reset = "Reset procurement (demo)" subtitle = "Get your team evaluated, contracted, and onboarded. Every document in one place." title = "Procurement" @@ -7441,6 +7529,65 @@ request = "Request" sign = "Review & sign" upload = "Upload" +[portal.procurement.agreement] +agreeCta = "Agree & subscribe" +confirm = "I have read and agree to the Stirling Enterprise Agreement." +eyebrow = "Agreement" +intro = "One combined agreement covers your deal: Master Service Agreement, Order Form, EULA, and Data Processing Agreement. Review it, then agree to accept the quote into a committed subscription." +title = "Review your enterprise agreement" + +[portal.procurement.builder] +addons = "Add-ons" +back = "Back" +businessName = "Business name" +businessNamePlaceholder = "Your company" +continue = "Continue" +country = "Country" +countryEuro = "Eurozone (EUR €)" +countryUK = "United Kingdom (GBP £)" +countryUS = "United States (USD $)" +eula = "I have read and agree to the Stirling Enterprise EULA. It governs the agreement generated from this quote." +generate = "Generate quote" +included = "Included" +indemnification = "IP indemnification" +indemnificationSub = "We defend qualifying IP claims, per the EULA" +offlineLicense = "Offline / air-gapped licence" +offlineLicenseSub = "A downloadable licence file for an air-gapped self-hosted instance" +qbr = "Quarterly business reviews" +qbrSub = "Your SE reviews usage and roadmap each quarter" +running = "{{annual}} / yr · {{years}}-yr {{tcv}}" +s1Sub = "Your team, and the PDFs you expect to run each year." +# Step 1 — volume +s1Title = "How much will you process?" +s2Sub = "Longer terms discount the rate; your service level sets support." +# Step 2 — commitment & service +s2Title = "Commitment and service" +s3Sub = "For the quote and the agreement it generates." +# Step 3 — details +s3Title = "Your details" +serviceLevel = "Service level" +slDedicated = "Dedicated" +slDedicatedSub = "4 business hours · dedicated account manager · +30%" +slPriority = "Priority" +slPrioritySub = "Same business day · named CSM · +15%" +slStandard = "Standard" +slStandardSub = "Next business day · shared CSM · included" +stepOf = "Step {{n}} of {{total}}" +term = "Term" +termDiscount = "{{pct}}% multi-year commitment discount applied" +title = "Build your quote" +training = "Onboarding & training" +trainingSub = "Live sessions to get your team running" +users = "Total users" +usersPlaceholder = "e.g. 250" +volEstimated = "Estimated from {{count}} users (~2,000 PDFs each, including automation). Edit if you know better." +volManual = "Using your figure. Re-estimate from your team size any time." +volNoUsers = "Not sure? Enter your team size and we'll estimate it." +volume = "Annual PDF volume" +volumePlaceholder = "e.g. 1,000,000" +years_one = "{{count}} year" +years_other = "{{count}} years" + [portal.procurement.docs] count_one = "{{count}} doc" count_other = "{{count}} docs" @@ -7456,6 +7603,30 @@ supportingTitle = "Supporting your evaluation" title = "Documents" upcoming = "Upcoming" +[portal.procurement.error] +title = "Something went wrong" + +[portal.procurement.hero] +company = "Your enterprise deal" +ctaAgreement = "Review & sign agreement" +ctaLive = "You're live" +ctaPayment = "Add payment" +ctaQuote = "Review your quote" +ctaTrial = "Build your quote" +eyebrow = "Enterprise procurement" +inviteTeammates = "Invite teammates" +keyDocs = "Key documents" +nextStep = "Next step: {{action}}" +notStarted = "Not started" +open = "Open procurement" +scheduleCall = "Schedule a call" +setup1Sub = "Invite your teammates" +setup1Title = "Deploy the PDF Editor" +setup2Sub = "Turn on processing across editors and other sources" +setup2Title = "Connect the PDF Processor" +setup3Sub = "Turn on Security, Compliance, Routing, or Retention when you need them" +setup3Title = "Add recommended policies" + [portal.procurement.journey] daysLeft_one = "{{count}} day left" daysLeft_other = "{{count}} days left" @@ -7467,15 +7638,47 @@ subtitle = "Your solutions engineer is on every step. One next action at a time; title = "From trial to live, one guided path" trialTitle = "Enterprise trial" +[portal.procurement.license] +copied = "Copied" +copy = "Copy key" +downloadError = "Could not generate the offline licence file just yet — please try again in a moment." +downloadOffline = "Download offline licence (.lic)" +hint = "Paste this key into a self-hosted instance to activate it, or keep it for your records. Keep it safe." +label = "Your licence key" + +[portal.procurement.link] +cta = "Link account" +description = "Procurement runs on your linked Stirling account: it's how we provision the trial, price your quote, and start billing. Link an account to start." +eyebrow = "Enterprise" +title = "Link your account to begin" + +[portal.procurement.live] +description = "Your subscription is active and your licence is issued. Your team is provisioned and billing has started." +eyebrow = "Live" +title = "You're live on Stirling Enterprise" + [portal.procurement.locked] description = "Trial keys, committed-volume quotes, the one-signature agreement, payment, and your document ledger all live here once you start an enterprise evaluation." eyebrow = "Enterprise only" talkToSales = "Talk to sales" title = "The procurement track opens with Enterprise" +[portal.procurement.milestone] +accept = "Accept & continue" +description = "Download the PDF to share it with your team, come back to accept when you're ready, or make changes." +download = "Download PDF" +downloadError = "Could not download the quote PDF just yet — please try again in a moment." +edit = "Edit quote" +eyebrow = "Quote {{number}}" +perYear = " / yr" +preparedFor = "Prepared for {{company}}" +tcv = "{{value}} total contract value" +title = "Your quote is ready" + [portal.procurement.modal] cancel = "Cancel" chooseFile = "Choose file" +close = "Close" downloadBody = "Your download will begin shortly." downloadCta = "Download" downloadTitle = "Download" @@ -7494,6 +7697,19 @@ uploadBody = "Send us your PO and we invoice against it on your terms. Drag in t uploadCta = "Upload purchase order" uploadTitle = "Upload your purchase order" +[portal.procurement.payment] +description = "Your quote is accepted and your licence is already active — your team can start right away. Pay the first invoice when you're ready; you can pay or download it here, no email needed." +downloadInvoice = "Download invoice" +simulate = "Simulate payment received (demo)" +title = "Subscription created" +viewInvoice = "View & pay invoice" + +[portal.procurement.schedule] +fallback = "Couldn't load the scheduler." +fallbackLink = "Open scheduling in a new tab" +subtitle = "Your solutions engineer will walk your team through the rollout. Pick a time that suits you." +title = "Schedule a call" + [portal.procurement.status] action = "Action needed" available = "Available" @@ -7501,6 +7717,21 @@ complete = "Complete" pending = "Pending" request = "On request" +[portal.procurement.trial] +body = "Extending adds 7 days and notifies your solutions engineer." +bodyMaxed = "You have used all your extensions — talk to your solutions engineer if you need more time." +cancel = "Cancel trial" +extend = "Extend 7 days" +maxed = "Maxed out" +subtitle = "Your free trial runs through {{date}}. No card required." +title = "Enterprise trial" + +[portal.procurement.upsell] +homeBadge = "Enterprise" +homeBody = "Committed volume pricing, org-wide SSO + SCIM + RBAC, 90-day immutable audit, and a dedicated SE." +homeCta = "Start Trial →" +homeHeadline = "Process millions of PDFs." + [portal.recentActivity] title = "Recent activity" viewAll = "View all" @@ -7874,36 +8105,14 @@ status = "Status" suspend = "Suspend" [portal.welcome] -ariaLabel = "Stirling product highlights" -pagination = "Carousel pagination" -slideLabel = "Slide {{number}}: {{title}}" - -[portal.welcome.ornament.editor] -critical = "Critical" -ocrClean = "OCR-clean" -schemaMatch = "schema match 0.97" -signed = "signed" - -[portal.welcome.slides.agents] -eyebrow = "AI Agents" -primary = "Try PDF Processor" -secondary = "View MCP docs" -sub = "Wire your agent via MCP, REST or tool definitions. Deterministic operations and guardrails — test with scenarios and evals before you ship." -title = "PDF Processor for AI Agents" - -[portal.welcome.slides.editor] -eyebrow = "PDF Editor" -primary = "Install PDF Editor" -secondary = "Connect an instance" -sub = "Annotate, sign, redact, and review locally or in the cloud. Brought to the platform as the credibility anchor of the Stirling control plane." -title = "The #1 PDF Editor on GitHub" - -[portal.welcome.slides.platform] -eyebrow = "Platform" -primary = "Try a PDF operation" -secondary = "Get an API key" -sub = "Ingest from agents, APIs and connectors. Run composable pipelines with evals and golden sets. Land in a vault with zero-standing-access controls." -title = "PDF Infrastructure for Developers" +ariaLabel = "Welcome to Stirling PDF" +badge = "Open-source" +installEditor = "Install the Editor" +inviteTeammates = "Invite teammates" +perks = "Free forever · Self-hostable" +subtitle = "The world's most secure PDF Editor is free for teams of all sizes. Includes 60+ PDF operations and SSO." +title = "Welcome to" +titleAccent = "Stirling PDF" [printFile] title = "Print File" @@ -8791,6 +9000,21 @@ manage = "Manage" description = "Policies and legal information for this service." title = "Legal Documents" +[settings.licenses] +backendDescription = "Licenses for backend dependencies bundled with this server." +backendLabel = "Backend Licenses" +backendTitle = "Backend 3rd Party Licenses" +empty = "No dependencies found." +frontendDescription = "Licenses for frontend dependencies bundled into the release build." +frontendLabel = "Frontend Licenses" +frontendTitle = "Frontend 3rd Party Licenses" +license = "License" +listDescription = "The list is shown directly in the UI from the release bundle or backend endpoint." +listTitle = "Bundled dependencies" +loadError = "Failed to load third-party licenses" +module = "Module" +version = "Version" + [settings.licensingAnalytics] audit = "Audit" plan = "Plan" @@ -9543,7 +9767,9 @@ memberRemoved = "Member removed successfully" namePlaceholder = "Enter team name" personal = "Personal" removeError = "Failed to remove member" +renameCancel = "Cancel rename" renameError = "Failed to rename team" +renameSubmit = "Save team name" renameSuccess = "Team renamed successfully" [team.invitationBanner] @@ -9559,6 +9785,7 @@ sendButton = "Send Invitation" title = "Invite Team Member" [team.members] +actions = "Member actions" emailColumn = "Email" empty = "No team members yet" nameColumn = "Name" @@ -9914,14 +10141,23 @@ zoomOut = "Zoom Out" [viewer.attachments] addAttachment = "Add attachment" close = "Close attachments" +closeSidebar = "Close attachments sidebar" +download = "Download attachment" empty = "No attachments in this document" loading = "Loading attachments..." noDocument = "Open a PDF to view its attachments." noMatch = "No attachments match your search" noSupport = "Attachment support is unavailable for this viewer." +retry = "Retry" searchPlaceholder = "Search attachments" title = "Attachments" +[viewer.bookmarks] +bookmarkTitle = "Bookmark title" +closeSidebar = "Close bookmarks sidebar" +collapseAll = "Collapse all bookmarks" +expandAll = "Expand all bookmarks" + [viewer.comments] addComment = "Add comment" addCommentPlaceholder = "Add comment..." @@ -9932,6 +10168,7 @@ clearAll = "Clear all comments" clearAllDescription = "This removes comments and replies from the sidebar while keeping any attached annotations in the document." clearAllTitle = "Clear all comments?" close = "Close comments" +closeSidebar = "Close comments sidebar" deleteAnnotationAndComment = "Delete annotation & comment" deleteDescription = "This annotation has a comment attached. You can remove just the comment from the sidebar while keeping the annotation, or delete everything." deleteTitle = "Remove annotation from comments?" @@ -9963,6 +10200,11 @@ title = "Form Fields" unsavedBadge = "Unsaved" unsavedDesc = "You have unsaved changes" +[viewer.layers] +closeSidebar = "Close layers sidebar" +hideAll = "Hide all layers" +showAll = "Show all layers" + [viewer.link] delete = "Delete link" @@ -9993,6 +10235,9 @@ resultsOf = "of {{total}}" [viewer.signature] delete = "Delete signature" +[viewer.thumbnails] +closeSidebar = "Close thumbnails sidebar" + [viewPdf] tags = "view,read,annotate,text,image,highlight,edit" title = "View/Edit PDF" @@ -10419,6 +10664,7 @@ loading = "Loading people..." locked = "locked" lockedBadge = "Locked" loginRequired = "Enable login mode first" +memberActions = "Member actions" noMembersFound = "No members found" role = "Role" searchMembers = "Search members..." @@ -10428,6 +10674,7 @@ unlockAccount = "Unlock Account" unlockUserError = "Failed to unlock user account" unlockUserSuccess = "User account unlocked successfully" user = "User" +userInfo = "User info" [workspace.people.actions] upgrade = "Upgrade" @@ -10573,6 +10820,7 @@ removeMemberError = "Failed to remove user from team" removeMemberSuccess = "User removed from team" renameTeamLabel = "Rename Team" system = "System" +teamActions = "Team actions" teamName = "Team Name" teamNotFound = "Team not found" title = "Teams" diff --git a/frontend/editor/public/og-metadata.json b/frontend/editor/public/og-metadata.json index e8aded59d2..65f1da789c 100644 --- a/frontend/editor/public/og-metadata.json +++ b/frontend/editor/public/og-metadata.json @@ -485,6 +485,16 @@ "title": "Legal Settings - Stirling PDF", "description": "The Free Adobe Acrobat alternative (10M+ Downloads)" }, + "/settings/backendThirdPartyLicenses": { + "image": "/og_images/home.png", + "title": "Backend Third Party Licenses Settings - Stirling PDF", + "description": "The Free Adobe Acrobat alternative (10M+ Downloads)" + }, + "/settings/frontendThirdPartyLicenses": { + "image": "/og_images/home.png", + "title": "Frontend Third Party Licenses Settings - Stirling PDF", + "description": "The Free Adobe Acrobat alternative (10M+ Downloads)" + }, "/settings/payg": { "image": "/og_images/home.png", "title": "Payg Settings - Stirling PDF", @@ -641,6 +651,8 @@ "/settings/adminMcp": "/settings/adminMcp", "/settings/help": "/settings/help", "/settings/legal": "/settings/legal", + "/settings/backendThirdPartyLicenses": "/settings/backendThirdPartyLicenses", + "/settings/frontendThirdPartyLicenses": "/settings/frontendThirdPartyLicenses", "/settings/payg": "/settings/payg" } } diff --git a/frontend/editor/public/og_images/auto-split-by-size-count.png b/frontend/editor/public/og_images/auto-split-by-size-count.png deleted file mode 100644 index 59c7ed77ca..0000000000 Binary files a/frontend/editor/public/og_images/auto-split-by-size-count.png and /dev/null differ diff --git a/frontend/editor/public/og_images/auto-split-pages.png b/frontend/editor/public/og_images/auto-split-pages.png deleted file mode 100644 index 6929078e7c..0000000000 Binary files a/frontend/editor/public/og_images/auto-split-pages.png and /dev/null differ diff --git a/frontend/editor/public/og_images/manage-certificates.png b/frontend/editor/public/og_images/manage-certificates.png deleted file mode 100644 index da02e0847d..0000000000 Binary files a/frontend/editor/public/og_images/manage-certificates.png and /dev/null differ diff --git a/frontend/editor/public/og_images/split-by-chapters.png b/frontend/editor/public/og_images/split-by-chapters.png deleted file mode 100644 index 26db04b4cf..0000000000 Binary files a/frontend/editor/public/og_images/split-by-chapters.png and /dev/null differ diff --git a/frontend/editor/public/og_images/split-by-sections.png b/frontend/editor/public/og_images/split-by-sections.png deleted file mode 100644 index e3601ddda3..0000000000 Binary files a/frontend/editor/public/og_images/split-by-sections.png and /dev/null differ diff --git a/frontend/editor/public/og_images/splitPdf.png b/frontend/editor/public/og_images/splitPdf.png deleted file mode 100644 index a77a065b42..0000000000 Binary files a/frontend/editor/public/og_images/splitPdf.png and /dev/null differ diff --git a/frontend/editor/public/og_images/view-pdf.png b/frontend/editor/public/og_images/view-pdf.png deleted file mode 100644 index bef62ad513..0000000000 Binary files a/frontend/editor/public/og_images/view-pdf.png and /dev/null differ diff --git a/frontend/editor/scripts/generate-icons.js b/frontend/editor/scripts/generate-icons.js index 7e6da2740e..70b4a091d2 100644 --- a/frontend/editor/scripts/generate-icons.js +++ b/frontend/editor/scripts/generate-icons.js @@ -1,8 +1,8 @@ #!/usr/bin/env node -const { icons } = require("@iconify-json/material-symbols"); -const fs = require("fs"); -const path = require("path"); +import { icons } from "@iconify-json/material-symbols"; +import fs from "node:fs"; +import path from "node:path"; // Check for verbose flag const isVerbose = @@ -19,7 +19,7 @@ const debug = (message) => { // Function to scan codebase for LocalIcon usage function scanForUsedIcons() { const usedIcons = new Set(); - const srcDir = path.join(__dirname, "..", "src"); + const srcDir = path.join(import.meta.dirname, "..", "src"); info("🔍 Scanning codebase for LocalIcon usage..."); @@ -140,7 +140,7 @@ async function main() { // Check if we need to regenerate (compare with existing) const outputPath = path.join( - __dirname, + import.meta.dirname, "..", "src", "assets", @@ -200,7 +200,7 @@ async function main() { } // Create output directory - const outputDir = path.join(__dirname, "..", "src", "assets"); + const outputDir = path.join(import.meta.dirname, "..", "src", "assets"); if (!fs.existsSync(outputDir)) { fs.mkdirSync(outputDir, { recursive: true }); } diff --git a/frontend/editor/scripts/generate-licenses.js b/frontend/editor/scripts/generate-licenses.js index a82ec9a2bd..72da16c6a9 100644 --- a/frontend/editor/scripts/generate-licenses.js +++ b/frontend/editor/scripts/generate-licenses.js @@ -1,28 +1,21 @@ #!/usr/bin/env node -const { execSync } = require("node:child_process"); -const { - existsSync, - mkdirSync, - writeFileSync, - readFileSync, -} = require("node:fs"); -const path = require("node:path"); +import { execSync } from "node:child_process"; +import { existsSync, mkdirSync, writeFileSync, readFileSync } from "node:fs"; +import path from "node:path"; +import { argv } from "node:process"; -const { argv } = require("node:process"); const inputIdx = argv.indexOf("--input"); const INPUT_FILE = inputIdx > -1 ? argv[inputIdx + 1] : null; const POSTPROCESS_ONLY = !!INPUT_FILE; -// __dirname is available in CommonJS by default - /** * Generate 3rd party licenses for frontend dependencies * This script creates a JSON file similar to the Java backend's 3rdPartyLicenses.json */ const OUTPUT_FILE = path.join( - __dirname, + import.meta.dirname, "..", "src", "assets", @@ -30,7 +23,7 @@ const OUTPUT_FILE = path.join( ); // package.json lives at the workspace root (frontend/), not editor/. The // script is at frontend/editor/scripts/, so walk up two levels. -const PACKAGE_JSON = path.join(__dirname, "..", "..", "package.json"); +const PACKAGE_JSON = path.join(import.meta.dirname, "..", "..", "package.json"); // Ensure the output directory exists const outputDir = path.dirname(OUTPUT_FILE); @@ -192,7 +185,7 @@ try { // Write license warnings to a separate file for CI/CD const warningsFile = path.join( - __dirname, + import.meta.dirname, "..", "src", "assets", diff --git a/frontend/editor/scripts/generate-og-image.mjs b/frontend/editor/scripts/generate-og-image.mjs index 7cef32c9b0..cf617bf7e8 100644 --- a/frontend/editor/scripts/generate-og-image.mjs +++ b/frontend/editor/scripts/generate-og-image.mjs @@ -16,11 +16,10 @@ /* global document, getComputedStyle */ // used inside page.evaluate (browser context) import fs from "node:fs/promises"; +import { readFileSync } from "node:fs"; import path from "node:path"; import { fileURLToPath } from "node:url"; -import { createRequire } from "node:module"; -const require = createRequire(import.meta.url); const HERE = path.dirname(fileURLToPath(import.meta.url)); const ROOT = path.resolve(HERE, ".."); @@ -69,11 +68,14 @@ export const THEME = { }; // ---- icon resolution (material-symbols via iconify) ------------------------ -function resolveIcon(icon) { +async function resolveIcon(icon) { if (!icon) return ""; if (icon.trim().startsWith(" let _browser = null; async function getBrowser() { if (_browser) return _browser; - const puppeteer = require("puppeteer"); + const { default: puppeteer } = await import("puppeteer"); _browser = await puppeteer.launch({ headless: "new", args: ["--no-sandbox"], @@ -163,7 +165,7 @@ export async function renderOgCard({ outFile, theme = THEME, }) { - const iconSvg = resolveIcon(icon); + const iconSvg = await resolveIcon(icon); const html = await buildHtml({ name, description, iconSvg, theme }); const browser = await getBrowser(); const page = await browser.newPage(); @@ -230,7 +232,7 @@ const kebab = (id) => id.replace(/([A-Z])/g, "-$1").toLowerCase(); // English name/description live next to each tool as the `t(key, fallback)` default. function readRegistryStrings() { - const src = require("node:fs").readFileSync( + const src = readFileSync( path.join(ROOT, "src/core/data/useTranslatedToolRegistry.tsx"), "utf8", ); @@ -268,7 +270,7 @@ export async function generateMissing(theme = THEME) { // Each tool's app icon lives as `icon=""` just before its // `name: t("home..title", …)`. Pair each title with the closest preceding icon. function readRegistryIcons() { - const src = require("node:fs").readFileSync( + const src = readFileSync( path.join(ROOT, "src/core/data/useTranslatedToolRegistry.tsx"), "utf8", ); @@ -288,25 +290,26 @@ function readRegistryIcons() { return byId; } -function iconExists(name) { +async function iconExists(name) { if (!name) return false; try { - const { getIconData } = require("@iconify/utils"); - return !!getIconData( - require("@iconify-json/material-symbols/icons.json"), - name, + const { getIconData } = await import("@iconify/utils"); + const { default: set } = await import( + "@iconify-json/material-symbols/icons.json", + { with: { type: "json" } } ); + return !!getIconData(set, name); } catch { return false; } } // First candidate that resolves; also tries dropping a "-rounded" suffix. -function firstResolvableIcon(candidates) { +async function firstResolvableIcon(candidates) { for (const c of candidates) { - if (iconExists(c)) return c; + if (await iconExists(c)) return c; const alt = c && c.replace(/-rounded$/, ""); - if (alt && alt !== c && iconExists(alt)) return alt; + if (alt && alt !== c && (await iconExists(alt))) return alt; } return "description-outline"; } @@ -324,14 +327,14 @@ export async function generateAll(theme = THEME) { const { titles, descs } = readRegistryStrings(); const regIcons = readRegistryIcons(); const ogMap = JSON.parse( - require("node:fs").readFileSync( - path.join(ROOT, "src/core/data/ogImageMap.json"), - "utf8", - ), + readFileSync(path.join(ROOT, "src/core/data/ogImageMap.json"), "utf8"), ); const results = []; for (const [id, basename] of Object.entries(ogMap)) { - const icon = firstResolvableIcon([regIcons[id], MISSING_TOOL_ICONS[id]]); + const icon = await firstResolvableIcon([ + regIcons[id], + MISSING_TOOL_ICONS[id], + ]); await renderOgCard({ name: titles[id] || humanizeId(id), description: descs[id] || "", diff --git a/frontend/editor/scripts/generate-tool-api-types.mts b/frontend/editor/scripts/generate-tool-api-types.mts new file mode 100644 index 0000000000..f12572620a --- /dev/null +++ b/frontend/editor/scripts/generate-tool-api-types.mts @@ -0,0 +1,400 @@ +/** + * Generates the committed frontend tool API types (toolApiTypes.ts) from the + * Java backend's OpenAPI spec, so the frontend's request shapes stay in step + * with the backend. + */ + +import { readFileSync, writeFileSync, mkdirSync } from "node:fs"; +import { dirname, resolve } from "node:path"; +import { parseArgs } from "node:util"; +import { compile, type JSONSchema } from "json-schema-to-typescript"; +import * as prettier from "prettier"; + +// The API namespaces whose endpoints are real, callable tools. `/api/v1/filter/` +// (pipeline-only) and `/api/v1/ai/tools/` (not in the spec) are intentionally +// excluded. Extend this list when other namespaces become tools. +const ALLOWED_PATH_PREFIXES = [ + "/api/v1/general/", + "/api/v1/misc/", + "/api/v1/security/", + "/api/v1/convert/", +]; + +// File plumbing, not user parameters: `fileInput` is the uploaded document and +// `fileId` a server-side handle. Stripped from every generated request model. +// Named file fields (stampImage, attachments, ...) are real parameters and kept. +const BASE_FILE_FIELDS = new Set(["fileInput", "fileId"]); + +// The shared "upload a file or provide a file ID" wrapper schema and its two +// branches. An endpoint whose body is exactly this has no parameters, so it must +// resolve to an empty model. It needs separate handling because the wrapper is a +// `oneOf`, which survives the flat-field stripping above and would otherwise leak +// the file fields into the output. +const FILE_WRAPPER_COMPONENTS = new Set([ + "PDFFile", + "PDFFileUpload", + "PDFFileRef", +]); + +const COMPONENT_REF_PREFIX = "#/components/schemas/"; + +const FILE_HEADER = [ + "// AUTO-GENERATED FILE. DO NOT EDIT.", + "// Generated by editor/scripts/generate-tool-api-types.mts from the Java OpenAPI spec", + "// (SwaggerDoc.json). Regenerate with: task frontend:tool-models", + "// Tools that take only a file input have no parameters; their model is Record.", +].join("\n"); + +type Json = Record; + +interface DiscoveredTool { + path: string; + className: string; +} + +function isObject(value: unknown): value is Json { + return typeof value === "object" && value !== null && !Array.isArray(value); +} + +/** + * Recursively sort object keys so the output is byte-stable regardless of the + * key ordering springdoc happens to emit. + */ +function deepSortKeys(value: unknown): unknown { + if (Array.isArray(value)) return value.map(deepSortKeys); + if (isObject(value)) { + const sorted: Json = {}; + for (const key of Object.keys(value).sort()) { + sorted[key] = deepSortKeys(value[key]); + } + return sorted; + } + return value; +} + +function pascalCase(segment: string): string { + return segment + .split(/[-_/]/) + .filter(Boolean) + .map((part) => part.charAt(0).toUpperCase() + part.slice(1)) + .join(""); +} + +/** Fallback class name for an inline request body (no $ref to name it after). */ +function pathToClassName(path: string): string { + const relevant = path.replace(/^\/api\/v1\//, ""); + return `${pascalCase(relevant)}Request`; +} + +function dedupe(name: string, used: Set): string { + let candidate = name; + let n = 2; + while (used.has(candidate)) candidate = `${name}${n++}`; + used.add(candidate); + return candidate; +} + +/** The request body schema for a POST endpoint (multipart wins, then JSON), or null. */ +function requestBodySchema(pathItem: Json): Json | null { + const post = pathItem.post; + if (!isObject(post)) return null; + const requestBody = post.requestBody; + if (!isObject(requestBody)) return null; + const content = requestBody.content; + if (!isObject(content)) return null; + for (const mediaType of ["multipart/form-data", "application/json"]) { + const entry = content[mediaType]; + if (isObject(entry) && isObject(entry.schema)) return entry.schema; + } + return null; +} + +/** + * A POST endpoint's query parameters as a property map plus the required ones. + * Some tools take inputs on the query string alongside the multipart body (e.g. + * merge-pdfs' `fileOrder`), so a complete model has to fold them in. Ref-valued + * param schemas are inlined later by rewriteRefs. + */ +function queryParameters(pathItem: Json): { props: Json; required: string[] } { + const props: Json = {}; + const required: string[] = []; + const post = pathItem.post; + if (!isObject(post) || !Array.isArray(post.parameters)) + return { props, required }; + for (const param of post.parameters) { + if ( + !isObject(param) || + param.in !== "query" || + typeof param.name !== "string" + ) + continue; + if (!isObject(param.schema)) continue; + const schema = structuredClone(param.schema) as Json; + if (!("description" in schema) && typeof param.description === "string") { + schema.description = param.description; + } + props[param.name] = schema; + if (param.required === true) required.push(param.name); + } + return { props, required }; +} + +/** + * Rewrite every `#/components/schemas/X` ref to `#/definitions/X` in place (the + * form json-schema-to-typescript expects) and collect the referenced component + * names so the caller can inline them. + */ +function rewriteRefs(node: unknown, found: Set): void { + if (Array.isArray(node)) { + for (const item of node) rewriteRefs(item, found); + return; + } + if (!isObject(node)) return; + const ref = node.$ref; + if (typeof ref === "string" && ref.startsWith(COMPONENT_REF_PREFIX)) { + const name = ref.slice(COMPONENT_REF_PREFIX.length); + node.$ref = `#/definitions/${name}`; + found.add(name); + } + for (const value of Object.values(node)) rewriteRefs(value, found); +} + +/** Keep only fields the client must send: drop those with a default or already stripped. */ +function computeRequired(schema: Json, properties: Json): string[] { + const required = Array.isArray(schema.required) + ? (schema.required as string[]) + : []; + return required.filter((name) => { + const prop = properties[name]; + return name in properties && !(isObject(prop) && "default" in prop); + }); +} + +async function main(): Promise { + const { values } = parseArgs({ + options: { + spec: { type: "string" }, + output: { type: "string" }, + check: { type: "boolean", default: false }, + }, + }); + if (!values.spec || !values.output) { + throw new Error( + "Usage: generate-tool-api-types.mts --spec --output [--check]", + ); + } + const specPath = resolve(values.spec); + const outputPath = resolve(values.output); + + const spec = JSON.parse(readFileSync(specPath, "utf-8")) as Json; + const paths = isObject(spec.paths) ? spec.paths : {}; + const components = + isObject(spec.components) && isObject(spec.components.schemas) + ? spec.components.schemas + : {}; + + const tools: DiscoveredTool[] = []; + const definitions: Record = {}; + const usedClassNames = new Set(); + const pendingComponents = new Set(); + const skipped: string[] = []; + + for (const path of Object.keys(paths).sort()) { + if ( + path.includes("{") || + !ALLOWED_PATH_PREFIXES.some((p) => path.startsWith(p)) + ) + continue; + const pathItem = paths[path]; + if (!isObject(pathItem)) continue; + const bodySchema = requestBodySchema(pathItem); + if (!bodySchema) { + if (isObject(pathItem.post)) skipped.push(path); + continue; + } + + // Resolve the request model into a fresh, mutable clone so we never mutate the shared spec. + const ref = bodySchema.$ref; + const refComponent = + typeof ref === "string" && ref.startsWith(COMPONENT_REF_PREFIX) + ? ref.slice(COMPONENT_REF_PREFIX.length) + : null; + let className: string; + let modelSchema: Json; + if (refComponent && FILE_WRAPPER_COMPONENTS.has(refComponent)) { + // File-only endpoint: model it as an empty object so it becomes + // Record rather than the wrapper's file union. Named after + // the path since the wrapper schema is shared. Query params still fold in + // below. + className = pathToClassName(path); + modelSchema = { type: "object", properties: {} }; + } else if (refComponent) { + const component = components[refComponent]; + if (!isObject(component)) continue; + className = refComponent; + modelSchema = structuredClone(component) as Json; + } else { + className = pathToClassName(path); + modelSchema = structuredClone(bodySchema) as Json; + } + + // A component shared by several endpoints (e.g. GeneralFile) is only defined once. + if (!(className in definitions)) { + const uniqueName = dedupe(className, usedClassNames); + className = uniqueName; + const bodyProps: Json = isObject(modelSchema.properties) + ? (structuredClone(modelSchema.properties) as Json) + : {}; + const query = queryParameters(pathItem); + // Body wins over query on a name collision. + const properties: Json = { ...query.props, ...bodyProps }; + for (const field of BASE_FILE_FIELDS) delete properties[field]; + modelSchema.properties = properties; + const required = new Set(computeRequired(modelSchema, properties)); + for (const name of query.required) { + const prop = properties[name]; + if (name in properties && !(isObject(prop) && "default" in prop)) { + required.add(name); + } + } + if (required.size > 0) modelSchema.required = [...required]; + else delete modelSchema.required; + modelSchema.title = className; + rewriteRefs(modelSchema, pendingComponents); + definitions[className] = modelSchema; + } + + tools.push({ path, className }); + } + + // Transitively inline every referenced component into `definitions`, rewriting its refs too. + const queue = [...pendingComponents]; + while (queue.length > 0) { + const name = queue.pop() as string; + if (name in definitions) continue; + const component = components[name]; + if (!isObject(component)) continue; + const cloned = structuredClone(component) as Json; + cloned.title = name; + const nested = new Set(); + rewriteRefs(cloned, nested); + definitions[name] = cloned; + for (const next of nested) if (!(next in definitions)) queue.push(next); + } + + await compileAndWrite( + tools, + definitions, + outputPath, + values.check ?? false, + skipped, + ); +} + +async function compileAndWrite( + tools: DiscoveredTool[], + definitions: Record, + outputPath: string, + check: boolean, + skipped: string[], +): Promise { + // json-schema-to-typescript only emits a named, exported interface per schema + // if something references it, so wrap every model in one root object. The root + // interface itself is stripped from the output afterwards. + const rootName = "__ToolApiRootAutogen"; + const uniqueClassNames = [...new Set(tools.map((t) => t.className))]; + const rootSchema: JSONSchema = { + title: rootName, + type: "object", + additionalProperties: false, + properties: Object.fromEntries( + uniqueClassNames.map((name) => [name, { $ref: `#/definitions/${name}` }]), + ), + definitions: definitions as Record, + }; + + // Canonicalize key order so a reordering in SwaggerDoc.json can never change + // the generated file (which would flake the committed-types CI check). + const canonicalRoot = deepSortKeys(rootSchema) as JSONSchema; + + const compiled = await compile(canonicalRoot, rootName, { + bannerComment: "", + additionalProperties: false, + declareExternallyReferenced: true, + unreachableDefinitions: false, + strictIndexSignatures: true, + format: false, + }); + + // Drop the root wrapper interface, then rewrite empty models (file-only tools) + // to `Record` - the precise, lint-clean type for an object with + // no properties (json-schema-to-typescript always emits `{}` interfaces here). + const models = compiled + .replace(new RegExp(`export interface ${rootName} \\{[^}]*\\}`), "") + .replace( + /export interface (\w+) \{\s*\}/g, + "export type $1 = Record;", + ) + .trim(); + + const endpointUnion = tools + .map((t) => ` | ${JSON.stringify(t.path)}`) + .join("\n"); + const paramsEntries = tools + .map((t) => ` ${JSON.stringify(t.path)}: ${t.className};`) + .join("\n"); + const endpointList = tools + .map((t) => ` ${JSON.stringify(t.path)},`) + .join("\n"); + + const footer = [ + "/** Endpoint path for a generated tool operation (the operation identity across languages). */", + `export type ToolEndpoint =\n${endpointUnion};`, + "", + "/** Backend request-parameter model for each tool endpoint. */", + `export interface ToolApiParams {\n${paramsEntries}\n}`, + "", + "/** Every generated tool endpoint, for iteration. */", + `export const TOOL_ENDPOINTS = [\n${endpointList}\n] as const satisfies readonly ToolEndpoint[];`, + "", + "/** Union of every generated tool request model. */", + `export type ToolApiRequest = ToolApiParams[ToolEndpoint];`, + ].join("\n"); + + const body = `${FILE_HEADER}\n\n${models}\n\n${footer}\n`; + const prettierConfig = await prettier.resolveConfig(outputPath); + const formatted = await prettier.format(body, { + ...prettierConfig, + parser: "typescript", + }); + + if (check) { + let current = ""; + try { + current = readFileSync(outputPath, "utf-8"); + } catch { + // Missing file counts as out of date. + } + if (current !== formatted) { + throw new Error( + `${outputPath} is out of date. Run 'task frontend:tool-models' and commit the result.`, + ); + } + console.log(`Up to date: ${tools.length} tool endpoints.`); + return; + } + + mkdirSync(dirname(outputPath), { recursive: true }); + writeFileSync(outputPath, formatted, "utf-8"); + console.log(`Generated ${tools.length} tool endpoints -> ${outputPath}`); + if (skipped.length > 0) { + console.log( + `Skipped ${skipped.length} POST endpoint(s) with no request body: ${skipped.join(", ")}`, + ); + } +} + +main().catch((error: unknown) => { + console.error(error instanceof Error ? error.message : error); + process.exit(1); +}); diff --git a/frontend/editor/scripts/report-flaky-tests.mts b/frontend/editor/scripts/report-flaky-tests.mts new file mode 100644 index 0000000000..1b1039b3ae --- /dev/null +++ b/frontend/editor/scripts/report-flaky-tests.mts @@ -0,0 +1,127 @@ +// Reads a Playwright JSON report and surfaces "flaky" tests (tests that +// failed at least once, then passed on retry) in GitHub Actions WITHOUT +// failing the job: +// - emits one ::warning:: workflow command per flaky test, so the run and +// PR show a yellow warning triangle + count, and the annotation links to +// the test's source line +// - appends a summary table to the job summary ($GITHUB_STEP_SUMMARY) +// +// A green-but-flaky job is otherwise invisible (Playwright exits 0 once a +// retry passes), which lets flakes accrete unnoticed. This makes them visible +// without turning them into hard failures. +// +// Run: `npx tsx editor/scripts/report-flaky-tests.mts [more.json...]` +// (a single path is also read from PLAYWRIGHT_JSON_OUTPUT_FILE). Multiple +// reports are merged + de-duplicated, so a job that runs Playwright in +// several segments (e.g. the enterprise OAuth/SAML/license phases) can +// pass one report per phase. A missing report or zero flaky tests is a +// silent no-op, so it is safe to run with `if: always()` after any +// Playwright step. + +import { appendFileSync, existsSync, readFileSync } from "fs"; +import { isAbsolute, join, relative } from "path"; +import type { JSONReport, JSONReportSuite } from "@playwright/test/reporter"; + +interface FlakyTest { + file: string; + line: number; + title: string; +} + +// Playwright records each test's outcome as expected|unexpected|flaky|skipped. +// "flaky" means it needed a retry to pass, which is exactly what we surface. +function collectFlaky( + report: JSONReport, + workspace: string, + rootDir: string, +): FlakyTest[] { + const flaky: FlakyTest[] = []; + const walk = (suite: JSONReportSuite, trail: string[], depth: number) => { + // The outermost suite per file has title === the file path; skip it so the + // human-readable title is just "describe > test" (the path is shown + // separately as the location). Nested suites are the describe() blocks. + const titles = depth > 0 && suite.title ? [...trail, suite.title] : trail; + for (const spec of suite.specs ?? []) { + if ((spec.tests ?? []).some((t) => t.status === "flaky")) { + const abs = spec.file + ? isAbsolute(spec.file) + ? spec.file + : join(rootDir, spec.file) + : ""; + const rel = abs ? relative(workspace, abs) : ""; + flaky.push({ + // Drop the path from the annotation if it escapes the workspace, so + // we never emit a broken file= link (the warning still shows). + file: rel && !rel.startsWith("..") ? rel : "", + line: spec.line || 0, + title: [...titles, spec.title].filter(Boolean).join(" > "), + }); + } + } + for (const child of suite.suites ?? []) walk(child, titles, depth + 1); + }; + for (const suite of report.suites ?? []) walk(suite, [], 0); + return flaky; +} + +// Deliberately no process.exit() calls: every path falls through to a natural +// exit(0). This step must never fail the job, and it keeps CI green even when +// the report is missing or clean. +function main(): void { + // Accept one or more report paths: a job may run Playwright in several + // segments, each writing its own report (the enterprise job does this for + // OAuth / SAML / license phases). Fall back to the env var when no paths are + // passed. Missing files are skipped, not fatal. + const reportPaths = process.argv.slice(2); + const envPath = process.env.PLAYWRIGHT_JSON_OUTPUT_FILE; + if (reportPaths.length === 0 && envPath) { + reportPaths.push(envPath); + } + + const workspace = process.env.GITHUB_WORKSPACE || process.cwd(); + const seen = new Set(); + const flaky: FlakyTest[] = []; + for (const reportPath of reportPaths) { + if (!reportPath || !existsSync(reportPath)) { + // No report (e.g. the build failed before this segment ran). + continue; + } + const report = JSON.parse(readFileSync(reportPath, "utf8")) as JSONReport; + const rootDir = report.config?.rootDir || process.cwd(); + for (const test of collectFlaky(report, workspace, rootDir)) { + const key = `${test.file}:${test.line}:${test.title}`; + if (!seen.has(key)) { + seen.add(key); + flaky.push(test); + } + } + } + if (flaky.length === 0) { + return; + } + + for (const f of flaky) { + const loc = f.file ? `file=${f.file},line=${f.line},` : ""; + process.stdout.write( + `::warning ${loc}title=Flaky test::${f.title} passed only on retry\n`, + ); + } + + const summaryPath = process.env.GITHUB_STEP_SUMMARY; + if (summaryPath) { + const plural = flaky.length === 1 ? "" : "s"; + const lines = [ + `### :warning: ${flaky.length} flaky test${plural} (passed on retry)`, + "", + "These passed, but not on the first attempt. Worth fixing before they turn into hard failures.", + "", + "| Test | Location |", + "| --- | --- |", + ...flaky.map((f) => `| ${f.title} | \`${f.file || "?"}:${f.line}\` |`), + "", + ]; + appendFileSync(summaryPath, lines.join("\n") + "\n"); + } +} + +main(); diff --git a/frontend/editor/src-tauri/stirling-pdf.desktop b/frontend/editor/src-tauri/stirling-pdf.desktop index e9e26a39c1..13da1b88c6 100644 --- a/frontend/editor/src-tauri/stirling-pdf.desktop +++ b/frontend/editor/src-tauri/stirling-pdf.desktop @@ -10,7 +10,8 @@ Terminal=false MimeType=application/pdf; Categories=Office;Graphics;Utility; Actions=open-file; +StartupWMClass=Stirling-PDF [Desktop Action open-file] Name=Open PDF File -Exec={{exec}} %F \ No newline at end of file +Exec={{exec}} %F diff --git a/frontend/editor/src-tauri/tauri.conf.json b/frontend/editor/src-tauri/tauri.conf.json index 87f3a48a1d..6cfe33cbe6 100644 --- a/frontend/editor/src-tauri/tauri.conf.json +++ b/frontend/editor/src-tauri/tauri.conf.json @@ -2,7 +2,7 @@ "$schema": "../node_modules/@tauri-apps/cli/config.schema.json", "productName": "Stirling PDF", "mainBinaryName": "Stirling-PDF", - "version": "2.14.0", + "version": "2.14.1", "identifier": "stirling.pdf.dev", "build": { "frontendDist": "../dist", diff --git a/frontend/editor/src/assets/3rdPartyLicenses.json b/frontend/editor/src/assets/3rdPartyLicenses.json index baf60879b6..3b606376de 100644 --- a/frontend/editor/src/assets/3rdPartyLicenses.json +++ b/frontend/editor/src/assets/3rdPartyLicenses.json @@ -3,133 +3,182 @@ { "moduleName": "@atlaskit/pragmatic-drag-and-drop", "moduleUrl": "git+https://github.com/atlassian/pragmatic-drag-and-drop.git", - "moduleVersion": "1.7.7", + "moduleVersion": "1.7.9", "moduleLicense": "Apache-2.0", "moduleLicenseUrl": "git+https://github.com/atlassian/pragmatic-drag-and-drop.git" }, { - "moduleName": "@embedpdf/core", - "moduleUrl": "https://registry.npmjs.org/@embedpdf/core/-/core-1.3.1.tgz", - "moduleVersion": "1.3.0", + "moduleName": "@cantoo/pdf-lib", + "moduleUrl": "git+https://github.com/cantoo-scribe/pdf-lib.git", + "moduleVersion": "2.6.5", "moduleLicense": "MIT", - "moduleLicenseUrl": "https://registry.npmjs.org/@embedpdf/core/-/core-1.3.1.tgz" + "moduleLicenseUrl": "git+https://github.com/cantoo-scribe/pdf-lib.git" + }, + { + "moduleName": "@dnd-kit/core", + "moduleUrl": "git+https://github.com/clauderic/dnd-kit.git", + "moduleVersion": "6.3.1", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/clauderic/dnd-kit.git" + }, + { + "moduleName": "@embedpdf/core", + "moduleUrl": "https://registry.npmjs.org/@embedpdf/core/-/core-2.14.4.tgz", + "moduleVersion": "2.14.1", + "moduleLicense": "MIT", + "moduleLicenseUrl": "https://registry.npmjs.org/@embedpdf/core/-/core-2.14.4.tgz" }, { "moduleName": "@embedpdf/engines", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" + }, + { + "moduleName": "@embedpdf/models", + "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-annotation", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" + }, + { + "moduleName": "@embedpdf/plugin-attachment", + "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", + "moduleVersion": "2.14.1", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" + }, + { + "moduleName": "@embedpdf/plugin-bookmark", + "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", + "moduleVersion": "2.14.1", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" + }, + { + "moduleName": "@embedpdf/plugin-document-manager", + "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-export", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-history", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-interaction-manager", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", - "moduleLicense": "MIT", - "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" - }, - { - "moduleName": "@embedpdf/plugin-loader", - "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-pan", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" + }, + { + "moduleName": "@embedpdf/plugin-print", + "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", + "moduleVersion": "2.14.1", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" + }, + { + "moduleName": "@embedpdf/plugin-redaction", + "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-render", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-rotate", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-scroll", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-search", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-selection", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-spread", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-thumbnail", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-tiling", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-viewport", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, { "moduleName": "@embedpdf/plugin-zoom", "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git", - "moduleVersion": "1.3.0", + "moduleVersion": "2.14.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git" }, @@ -157,94 +206,185 @@ { "moduleName": "@mantine/core", "moduleUrl": "git+https://github.com/mantinedev/mantine.git", - "moduleVersion": "8.3.1", + "moduleVersion": "8.3.18", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git" }, { "moduleName": "@mantine/dates", "moduleUrl": "git+https://github.com/mantinedev/mantine.git", - "moduleVersion": "8.3.1", + "moduleVersion": "8.3.18", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git" }, { "moduleName": "@mantine/dropzone", "moduleUrl": "git+https://github.com/mantinedev/mantine.git", - "moduleVersion": "8.3.1", + "moduleVersion": "8.3.18", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git" }, { "moduleName": "@mantine/hooks", "moduleUrl": "git+https://github.com/mantinedev/mantine.git", - "moduleVersion": "8.3.1", + "moduleVersion": "8.3.18", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git" }, { "moduleName": "@mui/icons-material", "moduleUrl": "git+https://github.com/mui/material-ui.git", - "moduleVersion": "7.3.2", + "moduleVersion": "9.0.0", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/mui/material-ui.git" }, { "moduleName": "@mui/material", "moduleUrl": "git+https://github.com/mui/material-ui.git", - "moduleVersion": "7.3.2", + "moduleVersion": "9.0.0", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/mui/material-ui.git" }, { - "moduleName": "@tailwindcss/postcss", - "moduleUrl": "git+https://github.com/tailwindlabs/tailwindcss.git", - "moduleVersion": "4.1.13", + "moduleName": "@posthog/react", + "moduleUrl": "git+https://github.com/PostHog/posthog-js.git", + "moduleVersion": "1.8.2", "moduleLicense": "MIT", - "moduleLicenseUrl": "git+https://github.com/tailwindlabs/tailwindcss.git" + "moduleLicenseUrl": "git+https://github.com/PostHog/posthog-js.git" + }, + { + "moduleName": "@reactour/tour", + "moduleUrl": "git+https://github.com/elrumordelaluz/reactour.git", + "moduleVersion": "3.8.0", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/elrumordelaluz/reactour.git" + }, + { + "moduleName": "@stripe/react-stripe-js", + "moduleUrl": "https://github.com/stripe/react-stripe-js.git", + "moduleVersion": "4.0.2", + "moduleLicense": "MIT", + "moduleLicenseUrl": "https://github.com/stripe/react-stripe-js.git" + }, + { + "moduleName": "@stripe/stripe-js", + "moduleUrl": "https://github.com/stripe/stripe-js.git", + "moduleVersion": "7.9.0", + "moduleLicense": "MIT", + "moduleLicenseUrl": "https://github.com/stripe/stripe-js.git" + }, + { + "moduleName": "@supabase/supabase-js", + "moduleUrl": "https://github.com/supabase/supabase-js.git", + "moduleVersion": "2.100.0", + "moduleLicense": "MIT", + "moduleLicenseUrl": "https://github.com/supabase/supabase-js.git" + }, + { + "moduleName": "@tailwindcss/postcss", + "moduleUrl": "https://github.com/tailwindlabs/tailwindcss.git", + "moduleVersion": "4.2.2", + "moduleLicense": "MIT", + "moduleLicenseUrl": "https://github.com/tailwindlabs/tailwindcss.git" }, { "moduleName": "@tanstack/react-virtual", "moduleUrl": "git+https://github.com/TanStack/virtual.git", - "moduleVersion": "3.13.12", + "moduleVersion": "3.13.23", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/TanStack/virtual.git" }, + { + "moduleName": "@tauri-apps/api", + "moduleUrl": "git+https://github.com/tauri-apps/tauri.git", + "moduleVersion": "2.10.1", + "moduleLicense": "Apache-2.0 OR MIT", + "moduleLicenseUrl": "git+https://github.com/tauri-apps/tauri.git" + }, + { + "moduleName": "@tauri-apps/plugin-dialog", + "moduleUrl": "git+https://github.com/tauri-apps/plugins-workspace.git", + "moduleVersion": "2.7.0", + "moduleLicense": "MIT OR Apache-2.0", + "moduleLicenseUrl": "git+https://github.com/tauri-apps/plugins-workspace.git" + }, + { + "moduleName": "@tauri-apps/plugin-fs", + "moduleUrl": "git+https://github.com/tauri-apps/plugins-workspace.git", + "moduleVersion": "2.5.0", + "moduleLicense": "MIT OR Apache-2.0", + "moduleLicenseUrl": "git+https://github.com/tauri-apps/plugins-workspace.git" + }, + { + "moduleName": "@tauri-apps/plugin-http", + "moduleUrl": "git+https://github.com/tauri-apps/plugins-workspace.git", + "moduleVersion": "2.5.7", + "moduleLicense": "MIT OR Apache-2.0", + "moduleLicenseUrl": "git+https://github.com/tauri-apps/plugins-workspace.git" + }, + { + "moduleName": "@tauri-apps/plugin-notification", + "moduleUrl": "git+https://github.com/tauri-apps/plugins-workspace.git", + "moduleVersion": "2.3.3", + "moduleLicense": "MIT OR Apache-2.0", + "moduleLicenseUrl": "git+https://github.com/tauri-apps/plugins-workspace.git" + }, + { + "moduleName": "@tauri-apps/plugin-shell", + "moduleUrl": "git+https://github.com/tauri-apps/plugins-workspace.git", + "moduleVersion": "2.3.5", + "moduleLicense": "MIT OR Apache-2.0", + "moduleLicenseUrl": "git+https://github.com/tauri-apps/plugins-workspace.git" + }, + { + "moduleName": "@userback/widget", + "moduleUrl": "git+https://github.com/userback/widget-js.git", + "moduleVersion": "0.3.12", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/userback/widget-js.git" + }, { "moduleName": "autoprefixer", "moduleUrl": "git+https://github.com/postcss/autoprefixer.git", - "moduleVersion": "10.4.21", + "moduleVersion": "10.4.27", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/postcss/autoprefixer.git" }, { "moduleName": "axios", "moduleUrl": "git+https://github.com/axios/axios.git", - "moduleVersion": "1.12.2", + "moduleVersion": "1.15.0", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/axios/axios.git" }, + { + "moduleName": "d3", + "moduleUrl": "git+https://github.com/d3/d3.git", + "moduleVersion": "7.9.0", + "moduleLicense": "ISC", + "moduleLicenseUrl": "git+https://github.com/d3/d3.git" + }, + { + "moduleName": "globals", + "moduleUrl": "git+https://github.com/sindresorhus/globals.git", + "moduleVersion": "17.5.0", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/sindresorhus/globals.git" + }, { "moduleName": "i18next", "moduleUrl": "git+https://github.com/i18next/i18next.git", - "moduleVersion": "25.5.2", + "moduleVersion": "25.10.10", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/i18next/i18next.git" }, { "moduleName": "i18next-browser-languagedetector", "moduleUrl": "git+https://github.com/i18next/i18next-browser-languageDetector.git", - "moduleVersion": "8.2.0", + "moduleVersion": "8.2.1", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/i18next/i18next-browser-languageDetector.git" }, - { - "moduleName": "i18next-http-backend", - "moduleUrl": "git+ssh://git@github.com/i18next/i18next-http-backend.git", - "moduleVersion": "3.0.2", - "moduleLicense": "MIT", - "moduleLicenseUrl": "git+ssh://git@github.com/i18next/i18next-http-backend.git" - }, { "moduleName": "jszip", "moduleUrl": "git+https://github.com/Stuk/jszip.git", @@ -254,66 +394,129 @@ }, { "moduleName": "license-report", - "moduleUrl": "git+https://github.com/kessler/license-report.git", - "moduleVersion": "6.8.0", + "moduleUrl": "git+https://github.com/bepo65/license-report.git", + "moduleVersion": "6.8.2", "moduleLicense": "MIT", - "moduleLicenseUrl": "git+https://github.com/kessler/license-report.git" - }, - { - "moduleName": "pdf-lib", - "moduleUrl": "git+https://github.com/Hopding/pdf-lib.git", - "moduleVersion": "1.17.1", - "moduleLicense": "MIT", - "moduleLicenseUrl": "git+https://github.com/Hopding/pdf-lib.git" + "moduleLicenseUrl": "git+https://github.com/bepo65/license-report.git" }, { "moduleName": "pdfjs-dist", "moduleUrl": "git+https://github.com/mozilla/pdf.js.git", - "moduleVersion": "5.4.149", + "moduleVersion": "5.5.207", "moduleLicense": "Apache-2.0", "moduleLicenseUrl": "git+https://github.com/mozilla/pdf.js.git" }, + { + "moduleName": "peerjs", + "moduleUrl": "git+https://github.com/peers/peerjs.git", + "moduleVersion": "1.5.5", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/peers/peerjs.git" + }, + { + "moduleName": "pixelmatch", + "moduleUrl": "git+https://github.com/mapbox/pixelmatch.git", + "moduleVersion": "7.1.0", + "moduleLicense": "ISC", + "moduleLicenseUrl": "git+https://github.com/mapbox/pixelmatch.git" + }, { "moduleName": "posthog-js", - "moduleUrl": "git+https://github.com/PostHog/posthog-js.git", - "moduleVersion": "1.268.0", + "moduleUrl": "https://github.com/PostHog/posthog-js", + "moduleVersion": "1.363.3", "moduleLicense": "SEE LICENSE IN LICENSE https://github.com/PostHog/posthog-js/blob/main/LICENSE", - "moduleLicenseUrl": "git+https://github.com/PostHog/posthog-js.git" + "moduleLicenseUrl": "https://github.com/PostHog/posthog-js" + }, + { + "moduleName": "qrcode.react", + "moduleUrl": "git+https://github.com/zpao/qrcode.react.git", + "moduleVersion": "4.2.0", + "moduleLicense": "ISC", + "moduleLicenseUrl": "git+https://github.com/zpao/qrcode.react.git" }, { "moduleName": "react", "moduleUrl": "git+https://github.com/facebook/react.git", - "moduleVersion": "19.1.1", + "moduleVersion": "19.2.4", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/facebook/react.git" }, { "moduleName": "react-dom", "moduleUrl": "git+https://github.com/facebook/react.git", - "moduleVersion": "19.1.1", + "moduleVersion": "19.2.4", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/facebook/react.git" }, + { + "moduleName": "react-easy-crop", + "moduleUrl": "git+https://github.com/ValentinH/react-easy-crop.git", + "moduleVersion": "5.5.6", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/ValentinH/react-easy-crop.git" + }, { "moduleName": "react-i18next", "moduleUrl": "git+https://github.com/i18next/react-i18next.git", - "moduleVersion": "15.7.3", + "moduleVersion": "16.6.6", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/i18next/react-i18next.git" }, + { + "moduleName": "react-markdown", + "moduleUrl": "git+https://github.com/remarkjs/react-markdown.git", + "moduleVersion": "9.1.0", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/remarkjs/react-markdown.git" + }, + { + "moduleName": "react-rnd", + "moduleUrl": "git+https://github.com/bokuweb/react-rnd.git", + "moduleVersion": "10.5.3", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/bokuweb/react-rnd.git" + }, { "moduleName": "react-router-dom", "moduleUrl": "git+https://github.com/remix-run/react-router.git", - "moduleVersion": "7.9.1", + "moduleVersion": "7.13.2", "moduleLicense": "MIT", "moduleLicenseUrl": "git+https://github.com/remix-run/react-router.git" }, { - "moduleName": "tailwindcss", - "moduleUrl": "git+https://github.com/tailwindlabs/tailwindcss.git", - "moduleVersion": "4.1.13", + "moduleName": "recharts", + "moduleUrl": "git+https://github.com/recharts/recharts.git", + "moduleVersion": "3.8.0", "moduleLicense": "MIT", - "moduleLicenseUrl": "git+https://github.com/tailwindlabs/tailwindcss.git" + "moduleLicenseUrl": "git+https://github.com/recharts/recharts.git" + }, + { + "moduleName": "remark-gfm", + "moduleUrl": "git+https://github.com/remarkjs/remark-gfm.git", + "moduleVersion": "4.0.1", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/remarkjs/remark-gfm.git" + }, + { + "moduleName": "signature_pad", + "moduleUrl": "git+https://github.com/szimek/signature_pad.git", + "moduleVersion": "5.1.3", + "moduleLicense": "MIT", + "moduleLicenseUrl": "git+https://github.com/szimek/signature_pad.git" + }, + { + "moduleName": "smol-toml", + "moduleUrl": "github:squirrelchat/smol-toml", + "moduleVersion": "1.6.1", + "moduleLicense": "BSD-3-Clause", + "moduleLicenseUrl": "github:squirrelchat/smol-toml" + }, + { + "moduleName": "tailwindcss", + "moduleUrl": "https://github.com/tailwindlabs/tailwindcss.git", + "moduleVersion": "4.2.2", + "moduleLicense": "MIT", + "moduleLicenseUrl": "https://github.com/tailwindlabs/tailwindcss.git" }, { "moduleName": "web-vitals", diff --git a/frontend/editor/src/cloud/components/onboarding/renderButtons.tsx b/frontend/editor/src/cloud/components/onboarding/renderButtons.tsx index f2857af460..7ff108d121 100644 --- a/frontend/editor/src/cloud/components/onboarding/renderButtons.tsx +++ b/frontend/editor/src/cloud/components/onboarding/renderButtons.tsx @@ -1,5 +1,7 @@ import React from "react"; -import { Button, Group, ActionIcon } from "@mantine/core"; +import { Group } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import ChevronLeftIcon from "@mui/icons-material/ChevronLeft"; import { TFunction } from "i18next"; import { @@ -31,22 +33,6 @@ export function renderButtons({ (btn) => btn.group === "right", ); - const buttonStyles = (variant: ButtonDefinition["variant"]) => - variant === "primary" - ? { - root: { - background: "var(--onboarding-primary-button-bg)", - color: "var(--onboarding-primary-button-text)", - }, - } - : { - root: { - background: "var(--onboarding-secondary-button-bg)", - border: "1px solid var(--onboarding-secondary-button-border)", - color: "var(--onboarding-secondary-button-text)", - }, - }; - const resolveButtonLabel = (button: ButtonDefinition) => { // Translate the label (it's a translation key) const label = button.label ?? ""; @@ -65,20 +51,15 @@ export function renderButtons({ onAction(button.action)} - radius="md" - size={40} + size="lg" + variant="secondary" + accent="neutral" disabled={disabled} - styles={{ - root: { - background: "var(--onboarding-secondary-button-bg)", - border: "1px solid var(--onboarding-secondary-button-border)", - color: "var(--onboarding-secondary-button-text)", - }, - }} + aria-label={t("onboarding.buttons.back", "Back")} > - {button.icon === "chevron-left" && ( + {button.icon === "chevron-left" ? ( - )} + ) : null} ); } @@ -91,7 +72,8 @@ export function renderButtons({ key={button.key} onClick={() => onAction(button.action)} disabled={disabled} - styles={buttonStyles(variant)} + variant={variant === "primary" ? "primary" : "secondary"} + accent="neutral" > {label} diff --git a/frontend/editor/src/cloud/components/onboarding/slides/TeamSlide.tsx b/frontend/editor/src/cloud/components/onboarding/slides/TeamSlide.tsx index 03eadf0f4c..a1948f2f06 100644 --- a/frontend/editor/src/cloud/components/onboarding/slides/TeamSlide.tsx +++ b/frontend/editor/src/cloud/components/onboarding/slides/TeamSlide.tsx @@ -1,5 +1,6 @@ import React, { useEffect, useState } from "react"; -import { Badge, Button, TextInput } from "@mantine/core"; +import { Badge, TextInput } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import { SlideConfig } from "@app/types/types"; import { createLightSlideBackground } from "@app/components/onboarding/slides/unifiedBackgroundConfig"; diff --git a/frontend/editor/src/cloud/components/shared/FreeLimitReachedModal.tsx b/frontend/editor/src/cloud/components/shared/FreeLimitReachedModal.tsx index 7db30887e7..177a15b7af 100644 --- a/frontend/editor/src/cloud/components/shared/FreeLimitReachedModal.tsx +++ b/frontend/editor/src/cloud/components/shared/FreeLimitReachedModal.tsx @@ -1,5 +1,6 @@ import { useMemo } from "react"; -import { Modal, Stack, Button } from "@mantine/core"; +import { Modal, Stack } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import CelebrationIcon from "@mui/icons-material/CelebrationOutlined"; import AnimatedSlideBackground from "@app/components/onboarding/slides/AnimatedSlideBackground"; @@ -169,7 +170,7 @@ export function FreeLimitReachedModal({ onClose }: FreeLimitReachedModalProps) { > + {open && (

      @@ -446,16 +447,16 @@ function CapReachedHelp() { const [open, setOpen] = useState(false); return (
      - + {open && (
      @@ -656,7 +657,7 @@ function StripePortalLink({ onClick={handleClick} loading={loading} rightSection={} - variant="light" + variant="secondary" > {t("payg.stripe.open", "Open billing portal")} diff --git a/frontend/editor/src/cloud/components/shared/config/configSections/PaygFree.css b/frontend/editor/src/cloud/components/shared/config/configSections/PaygFree.css index 17ef96e8b3..6ade6c7b6d 100644 --- a/frontend/editor/src/cloud/components/shared/config/configSections/PaygFree.css +++ b/frontend/editor/src/cloud/components/shared/config/configSections/PaygFree.css @@ -217,25 +217,6 @@ border-top: 1px solid var(--payg-divider); padding-top: 16px; } -.paygf-cta__button { - padding: 13px 22px; - border: none; - border-radius: 11px; - background: linear-gradient(135deg, var(--payg-accent) 0%, #6c5ce7 100%); - color: white; - font-weight: 600; - font-size: 0.95rem; - font-family: inherit; - cursor: pointer; - transition: - transform 120ms ease, - box-shadow 120ms ease; - white-space: nowrap; -} -.paygf-cta__button:hover { - transform: translateY(-1px); - box-shadow: 0 8px 22px -6px rgba(10, 139, 255, 0.55); -} .paygf-cta__reassurance { margin: 0; font-size: 0.78rem; diff --git a/frontend/editor/src/cloud/components/shared/config/configSections/PaygFree.tsx b/frontend/editor/src/cloud/components/shared/config/configSections/PaygFree.tsx index 330bffa71e..ae3738bd5f 100644 --- a/frontend/editor/src/cloud/components/shared/config/configSections/PaygFree.tsx +++ b/frontend/editor/src/cloud/components/shared/config/configSections/PaygFree.tsx @@ -25,6 +25,7 @@ */ import React, { useState } from "react"; import { Stack } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import BoltIcon from "@mui/icons-material/BoltRounded"; import AllInclusiveIcon from "@mui/icons-material/AllInclusiveRounded"; import CheckIcon from "@mui/icons-material/CheckRounded"; @@ -171,14 +172,14 @@ function ProcessorCard({ snap, isLeader, onTurnOn }: ProcessorCardProps) { {isLeader ? ( <> - + {t( "payg.free.cta.reassurance", diff --git a/frontend/editor/src/cloud/components/shared/config/configSections/SpendCapControl.css b/frontend/editor/src/cloud/components/shared/config/configSections/SpendCapControl.css index 90083fb80e..bc9ce0cef8 100644 --- a/frontend/editor/src/cloud/components/shared/config/configSections/SpendCapControl.css +++ b/frontend/editor/src/cloud/components/shared/config/configSections/SpendCapControl.css @@ -22,10 +22,10 @@ gap: 14px; } [data-mantine-color-scheme="dark"] .scc { - --scc-accent-text: #66b8ff; - --scc-accent-soft: rgba(10, 139, 255, 0.16); - --scc-chip-bg: #272d35; - --scc-chip-border: #3d444e; + --scc-accent-text: #7ab4ff; + --scc-accent-soft: rgba(79, 142, 245, 0.16); + --scc-chip-bg: #1c2340; + --scc-chip-border: #2d3560; } /* ── Inline row: presets · custom · no-cap · (save) ──────────────────── */ diff --git a/frontend/editor/src/cloud/components/shared/config/configSections/StripeCheckoutPanel.tsx b/frontend/editor/src/cloud/components/shared/config/configSections/StripeCheckoutPanel.tsx index 1ffc9f4ee2..03584f11de 100644 --- a/frontend/editor/src/cloud/components/shared/config/configSections/StripeCheckoutPanel.tsx +++ b/frontend/editor/src/cloud/components/shared/config/configSections/StripeCheckoutPanel.tsx @@ -64,6 +64,7 @@ */ import React, { useEffect, useRef, useState } from "react"; import { useTranslation } from "react-i18next"; +import { Button } from "@app/ui/Button"; import { useAuth } from "@app/auth/UseSession"; import { createCheckoutSession, @@ -267,17 +268,12 @@ const StripeCheckoutPanel: React.FC = ({ )}
      - +
      ); diff --git a/frontend/editor/src/cloud/components/shared/config/configSections/TeamSection.tsx b/frontend/editor/src/cloud/components/shared/config/configSections/TeamSection.tsx index 6755a4d746..44fc59c738 100644 --- a/frontend/editor/src/cloud/components/shared/config/configSections/TeamSection.tsx +++ b/frontend/editor/src/cloud/components/shared/config/configSections/TeamSection.tsx @@ -1,6 +1,5 @@ import React, { useState, useEffect } from "react"; import { - Button, TextInput, Group, Text, @@ -8,9 +7,10 @@ import { Alert, Table, Badge, - ActionIcon, Menu, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useTranslation } from "react-i18next"; import { useSaaSTeam } from "@app/contexts/SaaSTeamContext"; import LocalIcon from "@app/components/shared/LocalIcon"; @@ -233,19 +233,18 @@ const TeamSection: React.FC = () => { }} /> @@ -257,7 +256,7 @@ const TeamSection: React.FC = () => { {isTeamLeader && !isPersonalTeam && ( {
      {!isPersonalTeam && !isTeamLeader && !isEditingName && ( + )}

      {step === "confirm" @@ -170,14 +172,13 @@ export default function UpgradeModal({ )}

    - + {/* Step indicator. Hidden on the confirmation panel since the @@ -198,13 +199,13 @@ export default function UpgradeModal({ "{{symbol}}{{amount}} / month", { symbol: sym, amount: effectiveCap }, )} - + ) : ( @@ -264,36 +265,23 @@ export default function UpgradeModal({
    {step === "cap" && ( <> - - + + )} {step === "confirm" && ( - + )}
    diff --git a/frontend/editor/src/core/assets/login/github.svg b/frontend/editor/src/core/assets/login/github.svg index 651eaac2b8..1174b67928 100644 --- a/frontend/editor/src/core/assets/login/github.svg +++ b/frontend/editor/src/core/assets/login/github.svg @@ -1,3 +1,3 @@ - + diff --git a/frontend/editor/src/core/components/StorageStatsCard.tsx b/frontend/editor/src/core/components/StorageStatsCard.tsx index 468d24fe37..186b56c4ca 100644 --- a/frontend/editor/src/core/components/StorageStatsCard.tsx +++ b/frontend/editor/src/core/components/StorageStatsCard.tsx @@ -1,5 +1,6 @@ import React from "react"; -import { Card, Group, Text, Button, Progress } from "@mantine/core"; +import { Card, Group, Text, Progress } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import StorageIcon from "@mui/icons-material/Storage"; import DeleteIcon from "@mui/icons-material/Delete"; @@ -58,21 +59,16 @@ const StorageStatsCard: React.FC = ({ {filesCount > 0 && ( )} - diff --git a/frontend/editor/src/core/components/annotation/shared/ColorControl.tsx b/frontend/editor/src/core/components/annotation/shared/ColorControl.tsx index ca41f0f6a2..524314ee62 100644 --- a/frontend/editor/src/core/components/annotation/shared/ColorControl.tsx +++ b/frontend/editor/src/core/components/annotation/shared/ColorControl.tsx @@ -1,5 +1,4 @@ import { - ActionIcon, Tooltip, Popover, Stack, @@ -10,6 +9,7 @@ import { import { useState, useCallback, useEffect } from "react"; import { useTranslation } from "react-i18next"; import ColorizeIcon from "@mui/icons-material/Colorize"; +import { ActionIcon } from "@app/ui/ActionIcon"; // safari and firefox do not support the eye dropper API, only edge, chrome and opera do. // the button is hidden in the UI if the API is not supported. @@ -66,24 +66,12 @@ export function ColorControl({ setOpened(!opened)} disabled={disabled} - styles={{ - root: { - flexShrink: 0, - backgroundColor: "var(--bg-raised)", - border: "1px solid var(--border-default)", - color: "var(--text-secondary)", - "&:hover": { - backgroundColor: "var(--hover-bg)", - borderColor: "var(--border-strong)", - color: "var(--text-primary)", - }, - }, - }} > @@ -117,11 +105,14 @@ export function ColorControl({ label={t("color.eyeDropper.tooltip", "Pick colour from screen")} > diff --git a/frontend/editor/src/core/components/annotation/shared/ColorPicker.tsx b/frontend/editor/src/core/components/annotation/shared/ColorPicker.tsx index e12db7f340..ec854426e6 100644 --- a/frontend/editor/src/core/components/annotation/shared/ColorPicker.tsx +++ b/frontend/editor/src/core/components/annotation/shared/ColorPicker.tsx @@ -4,13 +4,12 @@ import { Stack, ColorPicker as MantineColorPicker, Group, - Button, ColorSwatch, Slider, Text, } from "@mantine/core"; import { useTranslation } from "react-i18next"; - +import { Button } from "@app/ui/Button"; interface ColorPickerProps { isOpen: boolean; onClose: () => void; diff --git a/frontend/editor/src/core/components/annotation/shared/DrawingCanvas.tsx b/frontend/editor/src/core/components/annotation/shared/DrawingCanvas.tsx index 08808b5b61..c10d9d9023 100644 --- a/frontend/editor/src/core/components/annotation/shared/DrawingCanvas.tsx +++ b/frontend/editor/src/core/components/annotation/shared/DrawingCanvas.tsx @@ -1,6 +1,7 @@ import React, { useEffect, useRef, useState } from "react"; -import { Paper, Button, Modal, Stack, Text, Group } from "@mantine/core"; +import { Paper, Modal, Stack, Text, Group } from "@mantine/core"; import { useTranslation } from "react-i18next"; +import { Button } from "@app/ui/Button"; import { ColorSwatchButton } from "@app/components/annotation/shared/ColorPicker"; import PenSizeSelector from "@app/components/tools/sign/PenSizeSelector"; import SignaturePad from "signature_pad"; @@ -331,7 +332,7 @@ export const DrawingCanvas: React.FC = ({
    - diff --git a/frontend/editor/src/core/components/annotation/shared/DrawingControls.tsx b/frontend/editor/src/core/components/annotation/shared/DrawingControls.tsx index 7118a817e8..0844125117 100644 --- a/frontend/editor/src/core/components/annotation/shared/DrawingControls.tsx +++ b/frontend/editor/src/core/components/annotation/shared/DrawingControls.tsx @@ -1,7 +1,9 @@ import React from "react"; -import { Group, Button, ActionIcon, Tooltip } from "@mantine/core"; +import { Group, Tooltip } from "@mantine/core"; import { useTranslation } from "react-i18next"; import { LocalIcon } from "@app/components/shared/LocalIcon"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; interface DrawingControlsProps { onUndo?: () => void; @@ -37,12 +39,11 @@ export const DrawingControls: React.FC = ({ {onUndo && ( = ({ {onRedo && ( = ({ {/* Place Signature Button */} {showPlaceButton && onPlaceSignature && ( diff --git a/frontend/editor/src/core/components/annotation/shared/OpacityControl.tsx b/frontend/editor/src/core/components/annotation/shared/OpacityControl.tsx index 496b5c4070..3853fa32c2 100644 --- a/frontend/editor/src/core/components/annotation/shared/OpacityControl.tsx +++ b/frontend/editor/src/core/components/annotation/shared/OpacityControl.tsx @@ -1,14 +1,8 @@ -import { - ActionIcon, - Tooltip, - Popover, - Stack, - Slider, - Text, -} from "@mantine/core"; +import { Tooltip, Popover, Stack, Slider, Text } from "@mantine/core"; import { useTranslation } from "react-i18next"; import { useState } from "react"; import OpacityIcon from "@mui/icons-material/Opacity"; +import { ActionIcon } from "@app/ui/ActionIcon"; interface OpacityControlProps { value: number; // 0-100 @@ -29,24 +23,12 @@ export function OpacityControl({ setOpened(!opened)} disabled={disabled} - styles={{ - root: { - flexShrink: 0, - backgroundColor: "var(--bg-raised)", - border: "1px solid var(--border-default)", - color: "var(--text-secondary)", - "&:hover": { - backgroundColor: "var(--hover-bg)", - borderColor: "var(--border-strong)", - color: "var(--text-primary)", - }, - }, - }} > diff --git a/frontend/editor/src/core/components/annotation/shared/PropertiesPopover.tsx b/frontend/editor/src/core/components/annotation/shared/PropertiesPopover.tsx index 5f23b81ede..2f2a42b982 100644 --- a/frontend/editor/src/core/components/annotation/shared/PropertiesPopover.tsx +++ b/frontend/editor/src/core/components/annotation/shared/PropertiesPopover.tsx @@ -1,14 +1,7 @@ -import { - ActionIcon, - Tooltip, - Popover, - Stack, - Slider, - Text, - Group, - Button, -} from "@mantine/core"; +import { Tooltip, Popover, Stack, Slider, Text, Group } from "@mantine/core"; import { useTranslation } from "react-i18next"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useState } from "react"; import type { TrackedAnnotation } from "@embedpdf/plugin-annotation"; import type { PdfAnnotationObject } from "@embedpdf/models"; @@ -106,21 +99,24 @@ export function PropertiesPopover({ onUpdate({ textAlign: 0 })} size="md" > onUpdate({ textAlign: 1 })} size="md" > onUpdate({ textAlign: 2 })} size="md" > @@ -176,8 +172,8 @@ export function PropertiesPopover({ />
    - - @@ -633,14 +670,10 @@ const FileEditorThumbnail = ({ {file.name} - - diff --git a/frontend/editor/src/core/components/fileManager/CompactFileDetails.tsx b/frontend/editor/src/core/components/fileManager/CompactFileDetails.tsx index 09ca9a10b1..11657cc288 100644 --- a/frontend/editor/src/core/components/fileManager/CompactFileDetails.tsx +++ b/frontend/editor/src/core/components/fileManager/CompactFileDetails.tsx @@ -1,5 +1,7 @@ import React from "react"; -import { Stack, Box, Text, Button, ActionIcon, Center } from "@mantine/core"; +import { Stack, Box, Text, Center } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf"; import ChevronLeftIcon from "@mui/icons-material/ChevronLeft"; import ChevronRightIcon from "@mui/icons-material/ChevronRight"; @@ -128,18 +130,20 @@ const CompactFileDetails: React.FC = ({ {hasMultipleFiles && ( @@ -150,16 +154,10 @@ const CompactFileDetails: React.FC = ({ {/* Action Button */} {!shouldHideGoogleDrive && ( + {fieldsOpen && (
    } - variant="default" + variant="secondary" onClick={onOpenVersionHistory} > {t( @@ -291,7 +300,6 @@ export function FileDetailsPanel({
    @@ -309,7 +311,7 @@ function EmptyState({ ) : ( @@ -942,7 +935,7 @@ export default function FileManagerView() { ) : (
    )} @@ -1147,8 +1139,8 @@ export default function FileManagerView() { w={280} >
    @@ -1712,8 +1702,8 @@ function Breadcrumbs() { const isLast = idx === trail.length - 1; return ( - + {!isLast && ( {FOLDER_COLOR_PALETTE.map((c) => ( - +     ); } diff --git a/frontend/editor/src/core/components/filesPage/FolderNameDialog.tsx b/frontend/editor/src/core/components/filesPage/FolderNameDialog.tsx index 4197d652ed..62858076cd 100644 --- a/frontend/editor/src/core/components/filesPage/FolderNameDialog.tsx +++ b/frontend/editor/src/core/components/filesPage/FolderNameDialog.tsx @@ -1,8 +1,10 @@ import React, { useEffect, useState } from "react"; import { useTranslation } from "react-i18next"; -import { Alert, Button, Group, Modal, Stack, TextInput } from "@mantine/core"; +import { Alert, Group, Modal, Stack, TextInput } from "@mantine/core"; import ErrorOutlineIcon from "@mui/icons-material/ErrorOutlined"; +import { Button } from "@app/ui/Button"; + interface FolderNameDialogProps { opened: boolean; title: string; @@ -94,7 +96,7 @@ export function FolderNameDialog({ )} - + ); } diff --git a/frontend/editor/src/core/components/filesPage/VersionTimeline.tsx b/frontend/editor/src/core/components/filesPage/VersionTimeline.tsx index 937db8c384..0b6a75878b 100644 --- a/frontend/editor/src/core/components/filesPage/VersionTimeline.tsx +++ b/frontend/editor/src/core/components/filesPage/VersionTimeline.tsx @@ -1,6 +1,8 @@ import { useMemo, useState } from "react"; import { useTranslation } from "react-i18next"; -import { ActionIcon, Badge, Menu } from "@mantine/core"; +import { Badge, Menu } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import OpenInNewIcon from "@mui/icons-material/OpenInNew"; import DeleteIcon from "@mui/icons-material/Delete"; import DownloadIcon from "@mui/icons-material/Download"; @@ -144,8 +146,8 @@ export function VersionTimeline({ )} - + ); } @@ -181,24 +183,31 @@ export function VersionTimeline({ )}
    - +
    {formatFileSize(v.size)} {v.lastModified ? ( @@ -230,7 +232,7 @@ export function VersionTimeline({ {collapsible && showAllCollapsed && ( - + )}
    ); diff --git a/frontend/editor/src/core/components/onboarding/InitialOnboardingModal/renderButtons.tsx b/frontend/editor/src/core/components/onboarding/InitialOnboardingModal/renderButtons.tsx index fc7914db55..86a087f325 100644 --- a/frontend/editor/src/core/components/onboarding/InitialOnboardingModal/renderButtons.tsx +++ b/frontend/editor/src/core/components/onboarding/InitialOnboardingModal/renderButtons.tsx @@ -1,5 +1,7 @@ import React from "react"; -import { Button, Group, ActionIcon } from "@mantine/core"; +import { Group } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; +import { Button } from "@app/ui/Button"; import ChevronLeftIcon from "@mui/icons-material/ChevronLeft"; import { useTranslation } from "react-i18next"; import { @@ -33,22 +35,6 @@ export function SlideButtons({ (btn) => btn.group === "right", ); - const buttonStyles = (variant: ButtonDefinition["variant"]) => - variant === "primary" - ? { - root: { - background: "var(--onboarding-primary-button-bg)", - color: "var(--onboarding-primary-button-text)", - }, - } - : { - root: { - background: "var(--onboarding-secondary-button-bg)", - border: "1px solid var(--onboarding-secondary-button-border)", - color: "var(--onboarding-secondary-button-text)", - }, - }; - const resolveButtonLabel = (button: ButtonDefinition) => { // Special case: override "See Plans" with "Upgrade now" when over limit if ( @@ -77,20 +63,14 @@ export function SlideButtons({ onAction(button.action)} - radius="md" - size={40} + variant="secondary" + accent="neutral" disabled={disabled} - styles={{ - root: { - background: "var(--onboarding-secondary-button-bg)", - border: "1px solid var(--onboarding-secondary-button-border)", - color: "var(--onboarding-secondary-button-text)", - }, - }} + aria-label={t("onboarding.buttons.back", "Back")} > - {button.icon === "chevron-left" && ( + {button.icon === "chevron-left" ? ( - )} + ) : null} ); } @@ -103,7 +83,10 @@ export function SlideButtons({ key={button.key} onClick={() => onAction(button.action)} disabled={disabled} - styles={buttonStyles(variant)} + variant={variant === "primary" ? "primary" : "secondary"} + accent={ + button.accent ?? (variant === "primary" ? "default" : "neutral") + } > {label} diff --git a/frontend/editor/src/core/components/onboarding/OnboardingModalSlide.tsx b/frontend/editor/src/core/components/onboarding/OnboardingModalSlide.tsx index b1bc731d52..b8135739bd 100644 --- a/frontend/editor/src/core/components/onboarding/OnboardingModalSlide.tsx +++ b/frontend/editor/src/core/components/onboarding/OnboardingModalSlide.tsx @@ -6,9 +6,10 @@ */ import React from "react"; -import { Modal, Stack, ActionIcon } from "@mantine/core"; +import { Modal, Stack } from "@mantine/core"; +import { useTranslation } from "react-i18next"; +import { ActionIcon } from "@app/ui/ActionIcon"; import DiamondOutlinedIcon from "@mui/icons-material/DiamondOutlined"; -import CloseIcon from "@mui/icons-material/Close"; import type { SlideDefinition, @@ -45,6 +46,7 @@ export default function OnboardingModalSlide({ onAction, allowDismiss = true, }: OnboardingModalSlideProps) { + const { t } = useTranslation(); const renderHero = () => { if (slideDefinition.hero.type === "dual-icon") { return ( @@ -139,8 +141,9 @@ export default function OnboardingModalSlide({ {allowDismiss && ( - + )}
    diff --git a/frontend/editor/src/core/components/onboarding/OnboardingTour.tsx b/frontend/editor/src/core/components/onboarding/OnboardingTour.tsx index 1f3ca67692..c38d9f952b 100644 --- a/frontend/editor/src/core/components/onboarding/OnboardingTour.tsx +++ b/frontend/editor/src/core/components/onboarding/OnboardingTour.tsx @@ -8,7 +8,7 @@ import React from "react"; import { TourProvider, useTour, type StepType } from "@reactour/tour"; -import { CloseButton, ActionIcon } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import ArrowForwardIcon from "@mui/icons-material/ArrowForward"; import ArrowBackIcon from "@mui/icons-material/ArrowBack"; import CheckIcon from "@mui/icons-material/Check"; @@ -137,7 +137,7 @@ export default function OnboardingTour({ setIsOpen, }) } - variant="subtle" + variant="tertiary" size="lg" aria-label={ isLast @@ -151,11 +151,15 @@ export default function OnboardingTour({ }} components={{ Close: ({ onClick }) => ( - + > + × + ), Content: ({ content }: { content: string }) => (
    boolean; @@ -238,6 +241,7 @@ export const SLIDE_DEFINITIONS: Record = { type: "button", label: "onboarding.serverLicense.seePlans", variant: "primary", + accent: "premium", group: "right", action: "see-plans", }, diff --git a/frontend/editor/src/core/components/onboarding/slides/AnalyticsChoiceSlide.tsx b/frontend/editor/src/core/components/onboarding/slides/AnalyticsChoiceSlide.tsx index 6960b88c27..23566a5527 100644 --- a/frontend/editor/src/core/components/onboarding/slides/AnalyticsChoiceSlide.tsx +++ b/frontend/editor/src/core/components/onboarding/slides/AnalyticsChoiceSlide.tsx @@ -1,6 +1,6 @@ import React from "react"; import { Trans } from "react-i18next"; -import { Button } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import OpenInNewIcon from "@mui/icons-material/OpenInNew"; import i18n from "@app/i18n"; import { SlideConfig } from "@app/types/types"; @@ -36,7 +36,7 @@ export default function AnalyticsChoiceSlide({
    diff --git a/frontend/editor/src/core/components/onboarding/slides/MFASetupSlide.tsx b/frontend/editor/src/core/components/onboarding/slides/MFASetupSlide.tsx index de76eadd6b..c018d69265 100644 --- a/frontend/editor/src/core/components/onboarding/slides/MFASetupSlide.tsx +++ b/frontend/editor/src/core/components/onboarding/slides/MFASetupSlide.tsx @@ -8,13 +8,13 @@ import { import { Alert, Box, - Button, Group, Loader, Stack, Text, TextInput, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { QRCodeSVG } from "qrcode.react"; import { useTranslation } from "react-i18next"; import { SlideConfig } from "@app/types/types"; @@ -210,8 +210,8 @@ function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) { - diff --git a/frontend/editor/src/core/components/pageEditor/FileThumbnail.tsx b/frontend/editor/src/core/components/pageEditor/FileThumbnail.tsx index 93ff3c2ab9..472fc141d7 100644 --- a/frontend/editor/src/core/components/pageEditor/FileThumbnail.tsx +++ b/frontend/editor/src/core/components/pageEditor/FileThumbnail.tsx @@ -5,7 +5,9 @@ import React, { useMemo, useEffect, } from "react"; -import { ActionIcon, CheckboxIndicator } from "@mantine/core"; +import { CheckboxIndicator } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import MoreVertIcon from "@mui/icons-material/MoreVert"; import DeleteOutlineIcon from "@mui/icons-material/DeleteOutlined"; @@ -259,7 +261,7 @@ const FileThumbnail = ({ {/* Kebab menu */} { e.stopPropagation(); @@ -277,8 +279,18 @@ const FileThumbnail = ({ style={{ width: actionsWidth }} onClick={(e) => e.stopPropagation()} > - - - - + {terminology.download} +
    - - + {t("delete", "Delete")} +
    )} diff --git a/frontend/editor/src/core/components/pageEditor/PageEditorControls.tsx b/frontend/editor/src/core/components/pageEditor/PageEditorControls.tsx index 2e8653fa89..96762a9203 100644 --- a/frontend/editor/src/core/components/pageEditor/PageEditorControls.tsx +++ b/frontend/editor/src/core/components/pageEditor/PageEditorControls.tsx @@ -1,4 +1,5 @@ -import { Tooltip, ActionIcon } from "@mantine/core"; +import { Tooltip } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import UndoIcon from "@mui/icons-material/Undo"; import RedoIcon from "@mui/icons-material/Redo"; import ContentCutIcon from "@mui/icons-material/ContentCut"; @@ -135,28 +136,22 @@ const PageEditorControls = ({ {/* Undo/Redo */} @@ -176,17 +171,14 @@ const PageEditorControls = ({ label={t("pageEditor.toolbar.rotateLeft", "Rotate Selected Left")} > onRotate("left")} disabled={selectedPageIds.length === 0} - variant="subtle" - style={{ - color: - selectedPageIds.length > 0 - ? "var(--text-secondary)" - : "var(--text-muted)", - }} - radius="md" - size="lg" + aria-label={t( + "pageEditor.toolbar.rotateLeft", + "Rotate Selected Left", + )} > @@ -195,68 +187,47 @@ const PageEditorControls = ({ label={t("pageEditor.toolbar.rotateRight", "Rotate Selected Right")} > onRotate("right")} disabled={selectedPageIds.length === 0} - variant="subtle" - style={{ - color: - selectedPageIds.length > 0 - ? "var(--text-secondary)" - : "var(--text-muted)", - }} - radius="md" - size="lg" + aria-label={t( + "pageEditor.toolbar.rotateRight", + "Rotate Selected Right", + )} > 0 - ? "var(--text-secondary)" - : "var(--text-muted)", - }} - radius="md" - size="lg" + aria-label={t("pageEditor.toolbar.delete", "Delete Selected")} > 0 - ? "var(--text-secondary)" - : "var(--text-muted)", - }} - radius="md" - size="lg" + aria-label={getSplitTooltip()} > 0 - ? "var(--text-secondary)" - : "var(--text-muted)", - }} - radius="md" - size="lg" + aria-label={getPageBreakTooltip()} > diff --git a/frontend/editor/src/core/components/pageEditor/PageSelectByNumberButton.tsx b/frontend/editor/src/core/components/pageEditor/PageSelectByNumberButton.tsx index fff0b8ef8f..dc2032fa4a 100644 --- a/frontend/editor/src/core/components/pageEditor/PageSelectByNumberButton.tsx +++ b/frontend/editor/src/core/components/pageEditor/PageSelectByNumberButton.tsx @@ -1,4 +1,5 @@ -import { ActionIcon, Popover } from "@mantine/core"; +import { Popover } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import LocalIcon from "@app/components/shared/LocalIcon"; import { Tooltip } from "@app/components/shared/Tooltip"; import BulkSelectionPanel from "@app/components/pageEditor/BulkSelectionPanel"; @@ -37,8 +38,7 @@ export default function PageSelectByNumberButton({
    diff --git a/frontend/editor/src/core/components/pageEditor/bulkSelectionPanel/OperatorsSection.tsx b/frontend/editor/src/core/components/pageEditor/bulkSelectionPanel/OperatorsSection.tsx index 71c07d26b3..d2ff79ad97 100644 --- a/frontend/editor/src/core/components/pageEditor/bulkSelectionPanel/OperatorsSection.tsx +++ b/frontend/editor/src/core/components/pageEditor/bulkSelectionPanel/OperatorsSection.tsx @@ -1,4 +1,5 @@ -import { Button, Text, Group, Divider } from "@mantine/core"; +import { Text, Group, Divider } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import classes from "@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css"; import { LogicalOperator } from "@app/utils/bulkselection/selectionBuilders"; @@ -22,7 +23,7 @@ const OperatorsSection = ({ + × + ) } onKeyDown={(e) => e.key === "Enter" && onUpdatePagesFromCSV()} diff --git a/frontend/editor/src/core/components/pageEditor/bulkSelectionPanel/SelectPages.tsx b/frontend/editor/src/core/components/pageEditor/bulkSelectionPanel/SelectPages.tsx index 314ca282b6..5fc7341430 100644 --- a/frontend/editor/src/core/components/pageEditor/bulkSelectionPanel/SelectPages.tsx +++ b/frontend/editor/src/core/components/pageEditor/bulkSelectionPanel/SelectPages.tsx @@ -1,5 +1,6 @@ import { useState } from "react"; -import { Button, Text, NumberInput, Group } from "@mantine/core"; +import { Text, NumberInput, Group } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import classes from "@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css"; interface SelectPagesProps { diff --git a/frontend/editor/src/core/components/policies/policyRunStore.ts b/frontend/editor/src/core/components/policies/policyRunStore.ts new file mode 100644 index 0000000000..798149a911 --- /dev/null +++ b/frontend/editor/src/core/components/policies/policyRunStore.ts @@ -0,0 +1,27 @@ +/** + * Core stub — the real implementation lives in the proprietary overlay. + * Returns empty state so core-build consumers compile without a policyRunStore module. + */ + +export interface PolicyRunRecord { + runId: string; + categoryId: string; + fileId: string; + fileName: string; + status: string; + currentStep?: number; + stepCount?: number; + error: string | null; + retrying?: boolean; + startedAt: number; +} + +export const POLICY_IN_FLIGHT_STATUSES = [ + "PENDING", + "RUNNING", + "WAITING_FOR_INPUT", +] as const; + +export function usePolicyRuns(): PolicyRunRecord[] { + return []; +} diff --git a/frontend/editor/src/core/components/shared/AppConfigModal.tsx b/frontend/editor/src/core/components/shared/AppConfigModal.tsx index 365d42608a..264db178ac 100644 --- a/frontend/editor/src/core/components/shared/AppConfigModal.tsx +++ b/frontend/editor/src/core/components/shared/AppConfigModal.tsx @@ -5,7 +5,8 @@ import React, { useCallback, useRef, } from "react"; -import { Badge, Modal, Text, ActionIcon, Tooltip, Group } from "@mantine/core"; +import { Badge, Modal, Text, Tooltip, Group } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useNavigate, useLocation } from "react-router-dom"; import { useTranslation } from "react-i18next"; import LocalIcon from "@app/components/shared/LocalIcon"; @@ -365,7 +366,7 @@ const AppConfigModalInner: React.FC = ({ /> + + + ); +} + +interface AppSwitchProps { + /** The app this switcher is rendered in (shown as active in the menu). */ + current: AppSwitchTarget; + /** Resolved color scheme; picks the brand mark for the menu items. */ + theme: "light" | "dark"; + /** Invoked with the selected app; only called for apps other than `current`. */ + onSwitch: (app: AppSwitchTarget) => void; + className?: string; +} + +/** + * The editor ⇄ processor app switcher (chevron button → app menu). The editor + * and portal sidebars render this same element so the two apps present one + * identical switcher; each host supplies its own theme source and navigation. + */ +export function AppSwitch({ + current, + theme, + onSwitch, + className, +}: AppSwitchProps) { + const { t } = useTranslation(); + const mark = theme === "dark" ? markDark : markLight; + const apps: Array<{ id: AppSwitchTarget; label: string }> = [ + { + id: "processor", + label: t("portal.shell.sidebar.appProcessor", "Processor"), + }, + { id: "editor", label: t("portal.shell.sidebar.appEditor", "Editor") }, + ]; + return ( + + + + + + {apps.map((app) => ( + onSwitch(app.id)} + leading={} + > + {app.label} + + ))} + + + ); +} diff --git a/frontend/editor/src/core/components/shared/AppSwitcher.tsx b/frontend/editor/src/core/components/shared/AppSwitcher.tsx new file mode 100644 index 0000000000..298a46e1ac --- /dev/null +++ b/frontend/editor/src/core/components/shared/AppSwitcher.tsx @@ -0,0 +1,8 @@ +/** + * Core stub for the sidebar app switcher. Builds that bundle the admin portal + * (proprietary/saas) shadow this with a real switcher; core has no portal, so + * there is nothing to switch to. + */ +export function AppSwitcher() { + return null; +} diff --git a/frontend/editor/src/core/components/shared/BulkShareModal.tsx b/frontend/editor/src/core/components/shared/BulkShareModal.tsx index 978b321232..e210d2f201 100644 --- a/frontend/editor/src/core/components/shared/BulkShareModal.tsx +++ b/frontend/editor/src/core/components/shared/BulkShareModal.tsx @@ -3,13 +3,13 @@ import { Modal, Stack, Text, - Button, Group, Alert, TextInput, Paper, Select, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import LinkIcon from "@mui/icons-material/Link"; import ContentCopyRoundedIcon from "@mui/icons-material/ContentCopyRounded"; import { useTranslation } from "react-i18next"; @@ -243,8 +243,8 @@ const BulkShareModal: React.FC = ({ label={t("storageShare.linkLabel", "Share link")} rightSection={ - ); - - // Wrap with tooltip if provided (useful for disabled state explanations) - if (option.tooltip && isDisabled) { - return ( - - - {button} - - - ); - } - - return ( - - {button} - - ); - })} - + ); }; diff --git a/frontend/editor/src/core/components/shared/ButtonToggle.tsx b/frontend/editor/src/core/components/shared/ButtonToggle.tsx index 5e02fb169b..9932c88062 100644 --- a/frontend/editor/src/core/components/shared/ButtonToggle.tsx +++ b/frontend/editor/src/core/components/shared/ButtonToggle.tsx @@ -1,5 +1,4 @@ -import { Button, Stack } from "@mantine/core"; -import React from "react"; +import { SegmentedControl } from "@app/ui/SegmentedControl"; export interface ButtonToggleOption { value: string; @@ -13,70 +12,49 @@ export interface ButtonToggleProps { value: string; onChange: (value: string) => void; disabled?: boolean; - orientation?: "vertical" | "horizontal"; size?: "xs" | "sm" | "md" | "lg"; fullWidth?: boolean; } -export const ButtonToggle: React.FC = ({ +export const ButtonToggle = ({ options, value, onChange, disabled = false, - orientation = "vertical", size = "md", fullWidth = true, -}) => { - const isVertical = orientation === "vertical"; +}: ButtonToggleProps) => { + const segmentedSize = size === "xs" || size === "sm" ? "sm" : "md"; - const buttonStyle: React.CSSProperties = { - justifyContent: "flex-start", - height: isVertical ? "auto" : undefined, - minHeight: isVertical ? "50px" : undefined, - padding: isVertical ? "12px 16px" : undefined, - textAlign: "left", - }; - - const renderButton = (option: ButtonToggleOption) => { - const isSelected = value === option.value; - const isDisabled = disabled || option.disabled; - - return ( - - ); - }; - - if (isVertical) { - return {options.map(renderButton)}; - } + const segmentedOptions = options.map((option) => ({ + value: option.value, + disabled: disabled || option.disabled, + label: ( +
    +
    {option.label}
    + {option.description && ( +
    + {option.description} +
    + )} +
    + ), + })); return ( -
    - {options.map(renderButton)} -
    + ); }; diff --git a/frontend/editor/src/core/components/shared/DismissAllErrorsButton.tsx b/frontend/editor/src/core/components/shared/DismissAllErrorsButton.tsx index 3bcc53daf7..5f3f4ada2a 100644 --- a/frontend/editor/src/core/components/shared/DismissAllErrorsButton.tsx +++ b/frontend/editor/src/core/components/shared/DismissAllErrorsButton.tsx @@ -1,9 +1,9 @@ import React from "react"; -import { Button, Group } from "@mantine/core"; +import { Group } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import { useFileState } from "@app/contexts/FileContext"; import { useFileActions } from "@app/contexts/file/fileHooks"; -import CloseIcon from "@mui/icons-material/Close"; import { Z_INDEX_TOAST } from "@app/styles/zIndex"; interface DismissAllErrorsButtonProps { @@ -32,10 +32,9 @@ const DismissAllErrorsButton: React.FC = ({ return ( diff --git a/frontend/editor/src/core/components/shared/FileCard.tsx b/frontend/editor/src/core/components/shared/FileCard.tsx index 5d53418d7f..c731092459 100644 --- a/frontend/editor/src/core/components/shared/FileCard.tsx +++ b/frontend/editor/src/core/components/shared/FileCard.tsx @@ -1,15 +1,7 @@ import { useState } from "react"; -import { - Card, - Stack, - Text, - Group, - Badge, - Button, - Box, - ActionIcon, - Tooltip, -} from "@mantine/core"; +import { Card, Stack, Text, Group, Badge, Box, Tooltip } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useTranslation } from "react-i18next"; import StorageIcon from "@mui/icons-material/Storage"; import VisibilityIcon from "@mui/icons-material/Visibility"; @@ -114,8 +106,8 @@ const FileCard = ({ { e.stopPropagation(); onView(); @@ -131,8 +123,12 @@ const FileCard = ({ > { e.stopPropagation(); onEdit(); @@ -182,14 +178,14 @@ const FileCard = ({ diff --git a/frontend/editor/src/core/components/shared/FileDropdownMenu.tsx b/frontend/editor/src/core/components/shared/FileDropdownMenu.tsx index 519366b9d6..735d633fee 100644 --- a/frontend/editor/src/core/components/shared/FileDropdownMenu.tsx +++ b/frontend/editor/src/core/components/shared/FileDropdownMenu.tsx @@ -1,5 +1,6 @@ import React from "react"; -import { Menu, Loader, Group, Text, ActionIcon, Tooltip } from "@mantine/core"; +import { Menu, Loader, Group, Text, Tooltip } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useTranslation } from "react-i18next"; import InsertDriveFileIcon from "@mui/icons-material/InsertDriveFile"; import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown"; @@ -102,10 +103,14 @@ export const FileDropdownMenu: React.FC = ({ withArrow > { e.stopPropagation(); onFileRemove(file.fileId as FileId); diff --git a/frontend/editor/src/core/components/shared/FileGrid.tsx b/frontend/editor/src/core/components/shared/FileGrid.tsx index 2ade54426f..c1e87ab18a 100644 --- a/frontend/editor/src/core/components/shared/FileGrid.tsx +++ b/frontend/editor/src/core/components/shared/FileGrid.tsx @@ -1,13 +1,6 @@ import { useState } from "react"; -import { - Box, - Flex, - Group, - Text, - Button, - TextInput, - Select, -} from "@mantine/core"; +import { Box, Flex, Group, Text, TextInput, Select } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import SearchIcon from "@mui/icons-material/Search"; import SortIcon from "@mui/icons-material/Sort"; @@ -121,7 +114,7 @@ const FileGrid = ({ {onDeleteAll && ( - )} @@ -179,7 +172,7 @@ const FileGrid = ({ {/* Show All Button */} {hasMoreFiles && onShowAll && ( - diff --git a/frontend/editor/src/core/components/shared/FilePickerModal.tsx b/frontend/editor/src/core/components/shared/FilePickerModal.tsx index da1bb91b6c..5e077d3437 100644 --- a/frontend/editor/src/core/components/shared/FilePickerModal.tsx +++ b/frontend/editor/src/core/components/shared/FilePickerModal.tsx @@ -2,7 +2,6 @@ import { useState, useEffect } from "react"; import { Modal, Text, - Button, Group, Stack, Checkbox, @@ -11,6 +10,7 @@ import { Badge, SimpleGrid, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import DocumentThumbnail from "@app/components/shared/filePreview/DocumentThumbnail"; import { FileId } from "@app/types/file"; @@ -151,10 +151,10 @@ const FilePickerModal = ({ )} - - @@ -249,7 +249,7 @@ const FilePickerModal = ({ {/* Action buttons */} - + ); }) )} diff --git a/frontend/editor/src/core/components/shared/FileSidebar.css b/frontend/editor/src/core/components/shared/FileSidebar.css index d06982179e..0b495d723b 100644 --- a/frontend/editor/src/core/components/shared/FileSidebar.css +++ b/frontend/editor/src/core/components/shared/FileSidebar.css @@ -102,6 +102,18 @@ flex-shrink: 0; } +/* App switcher (portal builds only) sits at the far end of the header row. + The content-fade animation makes this span a stacking context, which would + trap the menu's z-index below later sidebar rows — elevate the span so the + open menu paints above them. */ +.file-sidebar-app-switch { + margin-inline-start: auto; + display: flex; + align-items: center; + position: relative; + z-index: var(--z-dropdown); +} + /* ---- Search row ---- */ .file-sidebar-search-row { display: flex; diff --git a/frontend/editor/src/core/components/shared/FileSidebar.tsx b/frontend/editor/src/core/components/shared/FileSidebar.tsx index 1eb51b759b..f6fb7f0ce9 100644 --- a/frontend/editor/src/core/components/shared/FileSidebar.tsx +++ b/frontend/editor/src/core/components/shared/FileSidebar.tsx @@ -7,6 +7,7 @@ import React, { forwardRef, } from "react"; import { Loader, Tooltip } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useTranslation } from "react-i18next"; import { useNavigate } from "react-router-dom"; import { useFileState, useFileActions } from "@app/contexts/file/fileHooks"; @@ -28,6 +29,7 @@ import { import { accountService } from "@app/services/accountService"; import { GoogleDriveIcon } from "@app/components/shared/CloudStorageIcons"; import { Wordmark } from "@app/components/shared/Wordmark"; +import { AppSwitcher } from "@app/components/shared/AppSwitcher"; import type { StirlingFileStub } from "@app/types/fileContext"; import MenuIcon from "@mui/icons-material/Menu"; import SearchIcon from "@mui/icons-material/Search"; @@ -678,6 +680,17 @@ const FileSidebar = forwardRef( className="file-sidebar-brand-text sidebar-content-fade" /> )} + {!collapsed && ( + // The header row itself toggles collapse; stop the switcher's + // clicks and key presses from reaching it. + e.stopPropagation()} + onKeyDown={(e) => e.stopPropagation()} + > + + + )}
    @@ -961,26 +974,31 @@ const FileSidebar = forwardRef( {t("fileSidebar.files", "Files")} - - +
    {!stubsLoaded ? ( @@ -989,35 +1007,6 @@ const FileSidebar = forwardRef(
    ) : filteredFileStubs.length > 0 ? (
    - {filteredFileStubs.map((stub) => { const workbenchFileId = state.files.ids.find( (id) => (id as string) === (stub.id as string), diff --git a/frontend/editor/src/core/components/shared/FileSidebarFileItem.css b/frontend/editor/src/core/components/shared/FileSidebarFileItem.css index cab9f589f2..5763ab2648 100644 --- a/frontend/editor/src/core/components/shared/FileSidebarFileItem.css +++ b/frontend/editor/src/core/components/shared/FileSidebarFileItem.css @@ -36,32 +36,6 @@ background-color: rgba(59, 130, 246, 0.06); } -/* A policy-enforced file glows in that policy's accent colour so it's obvious - the file has had a policy applied: it pulses a few times to catch the eye and - then fades out (no lingering glow). */ -.file-sidebar-file-item.policy-enforced { - animation: policy-glow-fade 4.5s ease-in-out forwards; -} -@keyframes policy-glow-fade { - 0%, - 24%, - 48% { - box-shadow: - inset 0 0 0 1px color-mix(in srgb, var(--policy-glow) 30%, transparent), - 0 0 6px -2px var(--policy-glow); - } - 12%, - 36%, - 60% { - box-shadow: - inset 0 0 0 1px color-mix(in srgb, var(--policy-glow) 75%, transparent), - 0 0 16px 0 var(--policy-glow); - } - 100% { - box-shadow: 0 0 0 0 transparent; - } -} - .file-sidebar-file-item.selected { background-color: rgba(59, 130, 246, 0.12); } @@ -91,7 +65,7 @@ width: 20px; height: 20px; border-radius: 5px; - border: 1.5px solid var(--border-hover, #52525b); + border: 1.5px solid var(--border-hover, var(--border-strong)); } .file-sidebar-file-item:hover .file-sidebar-file-checkbox-hover { @@ -160,25 +134,6 @@ text-overflow: ellipsis; } -/* ---- Policy activity badges (a shield per policy that has run on the file) ---- */ -.file-sidebar-policy-badges { - display: inline-flex; - align-items: center; - gap: 3px; - flex-shrink: 0; -} -.file-sidebar-policy-badge { - display: inline-flex; - align-items: center; - justify-content: center; - width: 15px; - height: 15px; - border-radius: 4px; - /* `color` is set inline to the policy's accent; the tint follows it. */ - color: var(--text-secondary); - background: color-mix(in srgb, currentColor 16%, transparent); -} - /* ---- Cloud badge (file saved to the server) ---- */ .file-sidebar-cloud-badge { display: inline-flex; diff --git a/frontend/editor/src/core/components/shared/FileSidebarFileItem.tsx b/frontend/editor/src/core/components/shared/FileSidebarFileItem.tsx index 58a318e0d8..3fb26afa5d 100644 --- a/frontend/editor/src/core/components/shared/FileSidebarFileItem.tsx +++ b/frontend/editor/src/core/components/shared/FileSidebarFileItem.tsx @@ -1,6 +1,7 @@ -import { useState, useCallback, useRef } from "react"; +import React, { useState, useCallback, useRef } from "react"; import { createPortal } from "react-dom"; -import { Menu, Tooltip } from "@mantine/core"; +import { Group, Loader, Menu, Stack, Text, Tooltip } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useTranslation } from "react-i18next"; import VisibilityOutlinedIcon from "@mui/icons-material/VisibilityOutlined"; import VisibilityOffOutlinedIcon from "@mui/icons-material/VisibilityOffOutlined"; @@ -12,6 +13,10 @@ import DeleteOutlineIcon from "@mui/icons-material/DeleteOutlined"; import HistoryIcon from "@mui/icons-material/History"; import type { FileId } from "@app/types/file"; import { FileDocIcon } from "@app/components/shared/FileDocIcon"; +import { + PolicyBadges, + type FileItemPolicyRef, +} from "@app/components/shared/PolicyBadges"; import { getFileDocVariant } from "@app/components/shared/filePreview/getFileTypeIcon"; import { useLazyThumbnail } from "@app/hooks/useLazyThumbnail"; import { IMAGE_EXTENSIONS } from "@app/utils/fileUtils"; @@ -131,17 +136,6 @@ export interface FileItemFolderRef { accentColor: string; } -/** A policy that has run on this file, used for the activity badges. */ -export interface FileItemPolicyRef { - id: string; - name: string; - /** CSS colour for the badge (matches the policy's accent). */ - accentColor: string; - /** True only just after the policy was applied — drives the one-off glow, so - * it doesn't replay on every reload of an already-enforced file. */ - recent: boolean; -} - export interface FileItemProps { fileId: FileId; name: string; @@ -177,7 +171,6 @@ export interface FileItemProps { } const MAX_VISIBLE_FOLDER_TAGS = 2; -const MAX_VISIBLE_POLICY_BADGES = 3; export function FileItem({ fileId, @@ -207,6 +200,23 @@ export function FileItem({ const dateLabel = lastModified ? formatFileDate(lastModified) : ""; const typeLabel = ext ? ext.toUpperCase() : "File"; + const policyEnforcing = policies.some((p) => p.enforcing); + const enforcingTooltip = (action: string): React.ReactNode => ( + + + + + {t( + "policy.blockingAction", + "{{action}} blocked while enforcing policy, please wait...", + { action }, + )} + + + + + ); + const visibleFolders = folders.slice(0, MAX_VISIBLE_FOLDER_TAGS); const overflowFolders = folders.slice(MAX_VISIBLE_FOLDER_TAGS); @@ -227,9 +237,6 @@ export function FileItem({ const handleMouseLeave = useCallback(() => setHoverRect(null), []); - // A just-applied policy (recent run) drives the one-off row glow. - const recentPolicy = policies.find((p) => p.recent); - // Reactive: tooltip appears as soon as both hover rect and thumbnail are ready const thumbPos = hoverRect && resolvedThumbnail @@ -243,14 +250,7 @@ export function FileItem({ <>
    onClick(fileId)} draggable={draggable} onDragStart={ @@ -300,25 +300,7 @@ export function FileItem({ )} - {policies.length > 0 && ( - - {policies.slice(0, MAX_VISIBLE_POLICY_BADGES).map((policy) => ( - - - - - - ))} - - )} + {folders.length > 0 && ( @@ -369,14 +351,15 @@ export function FileItem({ )}
    - - + {(onDelete || - onSaveToCloud || + (canSaveToCloud && onSaveToCloud) || (hasVersionHistory && onVersionHistory)) && ( - + e.stopPropagation()}> {hasVersionHistory && onVersionHistory && ( @@ -423,17 +406,10 @@ export function FileItem({ {t("fileSidebar.fileItem.versionHistory", "Version history")} )} - {canSaveToCloud && onSaveToCloud && ( - - } - onClick={(e) => { - e.stopPropagation(); - onSaveToCloud(fileId); - }} - > - {isUploadedToCloud + {canSaveToCloud && + onSaveToCloud && + (() => { + const uploadLabel = isUploadedToCloud ? t( "fileSidebar.fileItem.updateOnServer", "Update on server", @@ -441,21 +417,64 @@ export function FileItem({ : t( "fileSidebar.fileItem.uploadToServer", "Upload to server", - )} - - )} - {onDelete && ( - } - onClick={(e) => { - e.stopPropagation(); - onDelete(fileId); - }} - > - {t("fileSidebar.fileItem.delete", "Delete")} - - )} + ); + return ( + +
    + + } + onClick={(e) => { + e.stopPropagation(); + onSaveToCloud(fileId); + }} + > + {uploadLabel} + +
    +     + ); + })()} + {onDelete && + (() => { + const deleteLabel = t( + "fileSidebar.fileItem.delete", + "Delete", + ); + return ( + +
    + + } + onClick={(e) => { + e.stopPropagation(); + onDelete(fileId); + }} + > + {deleteLabel} + +
    +     + ); + })()}     )} diff --git a/frontend/editor/src/core/components/shared/FileUploadButton.tsx b/frontend/editor/src/core/components/shared/FileUploadButton.tsx index 000639f09c..b07fbd0271 100644 --- a/frontend/editor/src/core/components/shared/FileUploadButton.tsx +++ b/frontend/editor/src/core/components/shared/FileUploadButton.tsx @@ -1,6 +1,32 @@ import { useRef } from "react"; -import { FileButton, Button } from "@mantine/core"; import { useTranslation } from "react-i18next"; +import { FilePicker } from "@app/ui/FilePicker"; +import type { ButtonVariant } from "@app/ui/Button"; + +// Accept both shared DS variants and the legacy Mantine variant names that +// existing callers still pass, mapping the latter onto the DS equivalents. +type LegacyVariant = + | "outline" + | "filled" + | "light" + | "default" + | "subtle" + | "gradient"; + +const VARIANT_MAP: Record = { + filled: "primary", + outline: "secondary", + default: "secondary", + light: "tertiary", + subtle: "tertiary", + gradient: "primary", +}; + +function resolveVariant(variant: ButtonVariant | LegacyVariant): ButtonVariant { + return variant in VARIANT_MAP + ? VARIANT_MAP[variant as LegacyVariant] + : (variant as ButtonVariant); +} interface FileUploadButtonProps { file?: File; @@ -8,7 +34,7 @@ interface FileUploadButtonProps { accept?: string; disabled?: boolean; placeholder?: string; - variant?: "outline" | "filled" | "light" | "default" | "subtle" | "gradient"; + variant?: ButtonVariant | LegacyVariant; fullWidth?: boolean; } @@ -18,7 +44,7 @@ const FileUploadButton = ({ accept, disabled = false, placeholder, - variant = "outline", + variant = "secondary", fullWidth = true, }: FileUploadButtonProps) => { const { t } = useTranslation(); @@ -27,18 +53,16 @@ const FileUploadButton = ({ const defaultPlaceholder = t("chooseFile", "Choose File"); return ( - - {(props) => ( - - )} - + {file ? file.name : placeholder || defaultPlaceholder} + ); }; diff --git a/frontend/editor/src/core/components/shared/FirstLoginModal.tsx b/frontend/editor/src/core/components/shared/FirstLoginModal.tsx index 4d7764f91d..be91ccc03d 100644 --- a/frontend/editor/src/core/components/shared/FirstLoginModal.tsx +++ b/frontend/editor/src/core/components/shared/FirstLoginModal.tsx @@ -1,12 +1,6 @@ import { useState } from "react"; -import { - Modal, - Stack, - Text, - PasswordInput, - Button, - Alert, -} from "@mantine/core"; +import { Modal, Stack, Text, PasswordInput, Alert } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import LocalIcon from "@app/components/shared/LocalIcon"; import { accountService } from "@app/services/accountService"; @@ -195,8 +189,8 @@ export default function FirstLoginModal({ /> diff --git a/frontend/editor/src/core/components/shared/Footer.tsx b/frontend/editor/src/core/components/shared/Footer.tsx index e73a48fd2a..2fb7312fba 100644 --- a/frontend/editor/src/core/components/shared/Footer.tsx +++ b/frontend/editor/src/core/components/shared/Footer.tsx @@ -2,6 +2,7 @@ import { Flex } from "@mantine/core"; import { useTranslation } from "react-i18next"; import { useCookieConsent } from "@app/hooks/useCookieConsent"; import { useFooterInfo } from "@app/hooks/useFooterInfo"; +import { Button } from "@app/ui/Button"; interface FooterProps { privacyPolicy?: string; @@ -53,8 +54,8 @@ export default function Footer({
    )} {finalAnalyticsEnabled && ( - + )}
    diff --git a/frontend/editor/src/core/components/shared/HoverActionMenu.tsx b/frontend/editor/src/core/components/shared/HoverActionMenu.tsx index fafebdf8f2..d912aace48 100644 --- a/frontend/editor/src/core/components/shared/HoverActionMenu.tsx +++ b/frontend/editor/src/core/components/shared/HoverActionMenu.tsx @@ -1,5 +1,6 @@ import React from "react"; -import { ActionIcon, Tooltip } from "@mantine/core"; +import { Tooltip } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import styles from "@app/components/shared/HoverActionMenu.module.css"; import { Z_INDEX_HOVER_ACTION_MENU } from "@app/styles/zIndex"; @@ -9,6 +10,8 @@ export interface HoverAction { label: string; onClick: (e: React.MouseEvent) => void; disabled?: boolean; + /** Overrides label in the tooltip — use for rich ReactNode content (e.g. enforcement messages). */ + tooltip?: React.ReactNode; color?: string; hidden?: boolean; dataTour?: string; @@ -57,19 +60,22 @@ const HoverActionMenu: React.FC = ({ onClick={(e) => e.stopPropagation()} > {visibleActions.map((action) => ( - - - {action.icon} - + + {/* Wrapper keeps the tooltip working when the button is disabled + (disabled buttons don't emit the pointer events Tooltip needs). */} +
    + + {action.icon} + +
    ))}
    diff --git a/frontend/editor/src/core/components/shared/InfoBanner.tsx b/frontend/editor/src/core/components/shared/InfoBanner.tsx index c46d5cd665..6572022299 100644 --- a/frontend/editor/src/core/components/shared/InfoBanner.tsx +++ b/frontend/editor/src/core/components/shared/InfoBanner.tsx @@ -1,5 +1,7 @@ import React, { ReactNode } from "react"; -import { Paper, Group, Text, Button, ActionIcon, Stack } from "@mantine/core"; +import { Paper, Group, Text, Stack } from "@mantine/core"; +import { Button, type ButtonVariant, type ButtonAccent } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useTranslation } from "react-i18next"; import LocalIcon from "@app/components/shared/LocalIcon"; @@ -31,6 +33,40 @@ const toneStyles: Record< }, }; +function toSharedButtonVariant( + variant: "light" | "filled" | "white" | "outline" | "subtle", +): ButtonVariant { + switch (variant) { + case "filled": + return "primary"; + case "outline": + return "secondary"; + case "subtle": + return "tertiary"; + case "light": + case "white": + default: + return "secondary"; + } +} + +function toSharedButtonAccent(color: string | undefined): ButtonAccent { + // Mantine colours may carry a shade suffix (e.g. "orange.7"); use the hue. + const hue = (color ?? "").split(".")[0]; + switch (hue) { + case "red": + return "danger"; + case "green": + return "success"; + case "yellow": + case "orange": + return "warning"; + case "blue": + default: + return "default"; + } +} + interface InfoBannerProps { /** * Either a LocalIcon name (string) for the standard sized icon slot, or a @@ -98,7 +134,6 @@ export const InfoBanner: React.FC = ({ const iconSize = compact ? "1rem" : "1.2rem"; const textSize = compact ? "xs" : "sm"; - const buttonSize = compact ? "xs" : "xs"; return ( = ({ {buttonText && onButtonClick && ( )} {dismissible && ( diff --git a/frontend/editor/src/core/components/shared/LoginAgreementModal.tsx b/frontend/editor/src/core/components/shared/LoginAgreementModal.tsx index 8d419e7cc0..9fb7f7c925 100644 --- a/frontend/editor/src/core/components/shared/LoginAgreementModal.tsx +++ b/frontend/editor/src/core/components/shared/LoginAgreementModal.tsx @@ -2,7 +2,6 @@ import { useEffect, useRef, useState } from "react"; import { useLocation } from "react-router-dom"; import { Box, - Button, Divider, Group, Modal, @@ -10,6 +9,7 @@ import { Stack, Text, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import Markdown, { type Components } from "react-markdown"; import remarkGfm from "remark-gfm"; @@ -188,10 +188,10 @@ export default function LoginAgreementModal() { )} - - diff --git a/frontend/editor/src/core/components/shared/MultiSelectControls.tsx b/frontend/editor/src/core/components/shared/MultiSelectControls.tsx index 447662e9dd..160346dd1b 100644 --- a/frontend/editor/src/core/components/shared/MultiSelectControls.tsx +++ b/frontend/editor/src/core/components/shared/MultiSelectControls.tsx @@ -1,4 +1,5 @@ -import { Box, Group, Text, Button } from "@mantine/core"; +import { Box, Group, Text } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; interface MultiSelectControlsProps { @@ -36,20 +37,20 @@ const MultiSelectControls = ({ {selectedCount} {t("fileManager.filesSelected", "files")} - {onAddToUpload && ( - )} {onOpenInFileEditor && ( )} diff --git a/frontend/editor/src/core/components/shared/NavigationWarningModal.tsx b/frontend/editor/src/core/components/shared/NavigationWarningModal.tsx index 9917f37ac5..7e3c675f3b 100644 --- a/frontend/editor/src/core/components/shared/NavigationWarningModal.tsx +++ b/frontend/editor/src/core/components/shared/NavigationWarningModal.tsx @@ -1,5 +1,6 @@ import { useRef, useEffect } from "react"; -import { Modal, Text, Button, Group, Stack } from "@mantine/core"; +import { Modal, Text, Group, Stack } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useNavigationGuard } from "@app/contexts/NavigationContext"; import { useTranslation } from "react-i18next"; import ArrowBackIcon from "@mui/icons-material/ArrowBack"; @@ -103,10 +104,12 @@ const NavigationWarningModal = () => { {hasApply && ( {hasApply && ( + )}
    diff --git a/frontend/editor/src/core/components/shared/PolicyBadges.css b/frontend/editor/src/core/components/shared/PolicyBadges.css new file mode 100644 index 0000000000..d193cc752e --- /dev/null +++ b/frontend/editor/src/core/components/shared/PolicyBadges.css @@ -0,0 +1,62 @@ +/* Canonical policy badge styling — every per-file policy badge in the app + * (sidebar, thumbnails, files page, viewer indicator) uses these classes so + * colour and shape stay consistent. `color` is set inline to the policy's + * accent; the background tint follows it. */ + +.policy-badges { + display: inline-flex; + align-items: center; + gap: 3px; + flex-shrink: 0; +} + +.policy-badge { + display: inline-flex; + align-items: center; + justify-content: center; + width: 15px; + height: 15px; + border-radius: 4px; + color: var(--text-secondary); + background: color-mix(in srgb, currentColor 16%, transparent); + pointer-events: auto; +} + +/* Larger variant for standalone indicators (e.g. the minimised viewer overlay). */ +.policy-badge--lg { + width: 28px; + height: 28px; + border-radius: 8px; + box-shadow: var(--shadow-md); +} + +.policy-badge--enforcing svg { + animation: policy-badge-spin 1s linear infinite; +} +@keyframes policy-badge-spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} + +.policy-badge--recent { + animation: policy-badge-pulse 4.5s ease-in-out forwards; +} +@keyframes policy-badge-pulse { + 0%, + 24%, + 48% { + box-shadow: 0 0 0 0 transparent; + } + 12%, + 36% { + box-shadow: 0 0 5px 2px currentColor; + } + 60%, + 100% { + box-shadow: 0 0 0 0 transparent; + } +} diff --git a/frontend/editor/src/core/components/shared/PolicyBadges.tsx b/frontend/editor/src/core/components/shared/PolicyBadges.tsx new file mode 100644 index 0000000000..f8661b9176 --- /dev/null +++ b/frontend/editor/src/core/components/shared/PolicyBadges.tsx @@ -0,0 +1,72 @@ +import { Tooltip } from "@mantine/core"; +import ShieldOutlinedIcon from "@mui/icons-material/ShieldOutlined"; +import AutorenewIcon from "@mui/icons-material/Autorenew"; +import { useTranslation } from "react-i18next"; +import "@app/components/shared/PolicyBadges.css"; + +/** A policy that has run on this file, used for the activity badges. */ +export interface FileItemPolicyRef { + id: string; + name: string; + /** CSS colour for the badge (matches the policy's accent). */ + accentColor: string; + /** True only just after the policy was applied — drives the one-off glow, so + * it doesn't replay on every reload of an already-enforced file. */ + recent: boolean; + /** True while the policy run is actively in-flight on this file. */ + enforcing?: boolean; +} + +const MAX_VISIBLE = 3; + +/** + * The canonical policy badge row: one accent-tinted shield per policy that has + * run on a file, spinning while a run is in flight, glowing briefly after it + * lands. Every surface that shows per-file policy badges (file sidebar, file + * editor thumbnails, files page) renders this so they stay identical. + */ +export function PolicyBadges({ + policies, + className, +}: { + policies: FileItemPolicyRef[]; + /** Appended to the row for surface-specific layout (spacing only). */ + className?: string; +}) { + const { t } = useTranslation(); + if (policies.length === 0) return null; + return ( + + {policies.slice(0, MAX_VISIBLE).map((policy) => ( + + + {policy.enforcing ? ( + + ) : ( + + )} + + + ))} + + ); +} diff --git a/frontend/editor/src/core/components/shared/PolicyEnforcingOverlay.tsx b/frontend/editor/src/core/components/shared/PolicyEnforcingOverlay.tsx new file mode 100644 index 0000000000..5778d323aa --- /dev/null +++ b/frontend/editor/src/core/components/shared/PolicyEnforcingOverlay.tsx @@ -0,0 +1,7 @@ +export function PolicyEnforcingOverlay(_props: { + enforcing: boolean; + progress?: number; + zIndex?: number; +}) { + return null; +} diff --git a/frontend/editor/src/core/components/shared/ShareFileModal.tsx b/frontend/editor/src/core/components/shared/ShareFileModal.tsx index 2f205326e3..1430f9df20 100644 --- a/frontend/editor/src/core/components/shared/ShareFileModal.tsx +++ b/frontend/editor/src/core/components/shared/ShareFileModal.tsx @@ -3,13 +3,13 @@ import { Modal, Stack, Text, - Button, Group, Alert, TextInput, Paper, Select, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import LinkIcon from "@mui/icons-material/Link"; import ContentCopyRoundedIcon from "@mui/icons-material/ContentCopyRounded"; import { useTranslation } from "react-i18next"; @@ -253,8 +253,8 @@ const ShareFileModal: React.FC = ({ label={t("storageShare.linkLabel", "Share link")} rightSection={ + )} ); diff --git a/frontend/editor/src/core/components/shared/ToolPanelHeader.tsx b/frontend/editor/src/core/components/shared/ToolPanelHeader.tsx index e34ca4c6c2..9d5f921bec 100644 --- a/frontend/editor/src/core/components/shared/ToolPanelHeader.tsx +++ b/frontend/editor/src/core/components/shared/ToolPanelHeader.tsx @@ -1,5 +1,5 @@ import type { ReactNode } from "react"; -import { ActionIcon } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import CloseIcon from "@mui/icons-material/Close"; import "@app/components/shared/ToolPanelHeader.css"; @@ -38,12 +38,12 @@ export function ToolPanelHeader({ {onClose && ( diff --git a/frontend/editor/src/core/components/shared/Tooltip.tsx b/frontend/editor/src/core/components/shared/Tooltip.tsx index 12232effc1..9c94bc4726 100644 --- a/frontend/editor/src/core/components/shared/Tooltip.tsx +++ b/frontend/editor/src/core/components/shared/Tooltip.tsx @@ -7,6 +7,7 @@ import React, { } from "react"; import { createPortal } from "react-dom"; import { useTranslation } from "react-i18next"; +import { ActionIcon } from "@app/ui/ActionIcon"; import LocalIcon from "@app/components/shared/LocalIcon"; import { addEventListenerWithCleanup } from "@app/utils/genericUtils"; import { useTooltipPosition } from "@app/hooks/useTooltipPosition"; @@ -396,7 +397,8 @@ export const Tooltip: React.FC = ({ } > {shouldShowCloseButton && ( - + )} {arrow && !sidebarTooltip && (
    diff --git a/frontend/editor/src/core/components/shared/UpdateModal.tsx b/frontend/editor/src/core/components/shared/UpdateModal.tsx index c18549360c..4a5e5b2404 100644 --- a/frontend/editor/src/core/components/shared/UpdateModal.tsx +++ b/frontend/editor/src/core/components/shared/UpdateModal.tsx @@ -4,7 +4,6 @@ import { Stack, Text, Badge, - Button, Group, Loader, Center, @@ -13,9 +12,11 @@ import { Progress, Alert, Divider, - CloseButton, Anchor, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; +import LocalIcon from "@app/components/shared/LocalIcon"; import { useTranslation } from "react-i18next"; import { updateService, @@ -271,12 +272,14 @@ const UpdateModal: React.FC = ({     {canClose && ( - + > + + )} @@ -520,12 +523,12 @@ const UpdateModal: React.FC = ({ )} +
    )} - {(hasFiles || isCustomView) && - viewOptions.map((opt) => ( - - ))} + {(hasFiles || isCustomView) && ( + + className="workbench-bar-views" + size="sm" + value={currentView} + onChange={setCurrentView} + variant="secondary" + options={viewOptions.map((opt) => ({ + value: opt.value, + label: ( + <> + {opt.icon} + {opt.label} + + ), + }))} + /> + )}
    {/* Tool buttons - second row, only rendered when buttons exist */} @@ -493,31 +560,40 @@ export default function WorkbenchBar({ {currentView === "viewer" && renderWithTooltip( , - t("workbenchBar.print", "Print PDF"), + policyEnforcing + ? makeEnforcingTooltip(t("workbenchBar.print", "Print PDF")) + : t("workbenchBar.print", "Print PDF"), )} {/* Download (file-level action — not relevant in custom views) */} {!isCustomView && renderWithTooltip( handleExportAll()} disabled={ - disableForFullscreen || totalItems === 0 || allButtonsDisabled + disableForFullscreen || + totalItems === 0 || + allButtonsDisabled || + policyEnforcing } + aria-label={downloadTooltip} > , - downloadTooltip, + policyEnforcing + ? makeEnforcingTooltip(downloadTooltip) + : downloadTooltip, )} {/* Save As */} @@ -533,13 +611,17 @@ export default function WorkbenchBar({ icons.saveAsIconName && renderWithTooltip( handleExportAll(true)} disabled={ - disableForFullscreen || totalItems === 0 || allButtonsDisabled + disableForFullscreen || + totalItems === 0 || + allButtonsDisabled || + policyEnforcing } + aria-label={t("workbenchBar.saveAs", "Save As")} > , - t("workbenchBar.saveAs", "Save As"), + policyEnforcing + ? makeEnforcingTooltip(t("workbenchBar.saveAs", "Save As")) + : t("workbenchBar.saveAs", "Save As"), )} {/* Separator: export group | close */} @@ -559,8 +643,8 @@ export default function WorkbenchBar({ {!isCustomView && renderWithTooltip( @@ -77,20 +80,22 @@ const ZipWarningModal = ({ {/* Mobile layout: vertical stack */} diff --git a/frontend/editor/src/core/components/shared/config/RestartConfirmationModal.tsx b/frontend/editor/src/core/components/shared/config/RestartConfirmationModal.tsx index af96918154..f4e9c47b0a 100644 --- a/frontend/editor/src/core/components/shared/config/RestartConfirmationModal.tsx +++ b/frontend/editor/src/core/components/shared/config/RestartConfirmationModal.tsx @@ -1,4 +1,5 @@ -import { Modal, Text, Group, Button, Stack } from "@mantine/core"; +import { Modal, Text, Group, Stack } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import RefreshIcon from "@mui/icons-material/Refresh"; import ScheduleIcon from "@mui/icons-material/Schedule"; @@ -48,14 +49,13 @@ export default function RestartConfirmationModal({ diff --git a/frontend/editor/src/core/components/shared/signing/steps/SelectDocumentStep.tsx b/frontend/editor/src/core/components/shared/signing/steps/SelectDocumentStep.tsx index aaedc076d3..14bd56f75c 100644 --- a/frontend/editor/src/core/components/shared/signing/steps/SelectDocumentStep.tsx +++ b/frontend/editor/src/core/components/shared/signing/steps/SelectDocumentStep.tsx @@ -1,4 +1,5 @@ -import { Button, Stack, Text } from "@mantine/core"; +import { Stack, Text } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf"; import type { FileState } from "@app/types/file"; diff --git a/frontend/editor/src/core/components/shared/signing/steps/SelectParticipantsStep.tsx b/frontend/editor/src/core/components/shared/signing/steps/SelectParticipantsStep.tsx index 3baa15b7ba..99c0801519 100644 --- a/frontend/editor/src/core/components/shared/signing/steps/SelectParticipantsStep.tsx +++ b/frontend/editor/src/core/components/shared/signing/steps/SelectParticipantsStep.tsx @@ -1,4 +1,5 @@ -import { Button, Stack, Text, Group } from "@mantine/core"; +import { Stack, Text, Group } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import ArrowBackIcon from "@mui/icons-material/ArrowBack"; import UserSelector from "@app/components/shared/UserSelector"; @@ -53,7 +54,7 @@ export const SelectParticipantsStep: React.FC = ({ + )} - + × + {/* Progress bar - always show when present */} @@ -142,12 +146,12 @@ export default function ToastRenderer() { {/* Button - always show when present, positioned below body */} {t.buttonText && t.buttonCallback && (
    - +
    )} diff --git a/frontend/editor/src/core/components/tools/RightSidebar.tsx b/frontend/editor/src/core/components/tools/RightSidebar.tsx index 7e3aa04629..4333e263f1 100644 --- a/frontend/editor/src/core/components/tools/RightSidebar.tsx +++ b/frontend/editor/src/core/components/tools/RightSidebar.tsx @@ -1,5 +1,4 @@ import { useMemo, useState } from "react"; -import { ActionIcon } from "@mantine/core"; import { useTranslation } from "react-i18next"; import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext"; import { useSidebarContext } from "@app/contexts/SidebarContext"; @@ -21,6 +20,7 @@ import type { SubcategoryGroup } from "@app/hooks/useToolSections"; import { ToolIcon } from "@app/components/shared/ToolIcon"; import { ToolPanelHeader } from "@app/components/shared/ToolPanelHeader"; import { Tooltip as AppTooltip } from "@app/components/shared/Tooltip"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { withViewTransition } from "@app/utils/viewTransition"; import ChevronLeftIcon from "@mui/icons-material/ChevronLeft"; import ChevronRightIcon from "@mui/icons-material/ChevronRight"; @@ -224,13 +224,13 @@ export default function RightSidebar() {
    @@ -248,18 +248,18 @@ export default function RightSidebar() { arrow delay={300} > - + ))}
    @@ -322,10 +322,9 @@ export default function RightSidebar() { ) : null} {showCloseButton ? ( ) : ( diff --git a/frontend/editor/src/core/components/tools/ToolPanel.css b/frontend/editor/src/core/components/tools/ToolPanel.css index e5949e365a..a8ad41588f 100644 --- a/frontend/editor/src/core/components/tools/ToolPanel.css +++ b/frontend/editor/src/core/components/tools/ToolPanel.css @@ -130,6 +130,7 @@ width 0.3s ease, max-width 0.3s ease; view-transition-name: tool-rail; + user-select: none; } .tool-panel__collapsed-strip { diff --git a/frontend/editor/src/core/components/tools/ToolPanelModePrompt.tsx b/frontend/editor/src/core/components/tools/ToolPanelModePrompt.tsx index 3e3f072b69..f7f69ad2e7 100644 --- a/frontend/editor/src/core/components/tools/ToolPanelModePrompt.tsx +++ b/frontend/editor/src/core/components/tools/ToolPanelModePrompt.tsx @@ -1,6 +1,7 @@ import { useEffect, useState } from "react"; -import { Badge, Button, Card, Group, Modal, Stack, Text } from "@mantine/core"; +import { Badge, Card, Group, Modal, Stack, Text } from "@mantine/core"; import { useTranslation } from "react-i18next"; +import { Button } from "@app/ui/Button"; import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext"; import { usePreferences } from "@app/contexts/PreferencesContext"; import "@app/components/tools/ToolPanelModePrompt.css"; @@ -122,9 +123,6 @@ const ToolPanelModePrompt = ({
    + {parameters.attachments?.length > 0 && ( @@ -120,10 +110,17 @@ const AddAttachmentsSettings = ({ ({(file.size / 1024).toFixed(1)} KB) - + } + aria-label={t( + "AddAttachmentsRequest.removeFile", + "Remove file", + )} size="sm" - variant="subtle" - color="red" + variant="tertiary" + accent="danger" style={{ flexShrink: 0 }} onClick={() => { const newAttachments = ( @@ -132,9 +129,7 @@ const AddAttachmentsSettings = ({ onParameterChange("attachments", newAttachments); }} disabled={disabled} - > - - + /> ))} diff --git a/frontend/editor/src/core/components/tools/addPageNumbers/PageNumberPreview.tsx b/frontend/editor/src/core/components/tools/addPageNumbers/PageNumberPreview.tsx index 37247c863f..fe92d1ff42 100644 --- a/frontend/editor/src/core/components/tools/addPageNumbers/PageNumberPreview.tsx +++ b/frontend/editor/src/core/components/tools/addPageNumbers/PageNumberPreview.tsx @@ -5,6 +5,7 @@ import { pdfWorkerManager } from "@app/services/pdfWorkerManager"; import { useThumbnailGeneration } from "@app/hooks/useThumbnailGeneration"; import styles from "@app/components/tools/addPageNumbers/PageNumberPreview.module.css"; import { PrivateContent } from "@app/components/shared/PrivateContent"; +import { Button } from "@app/ui/Button"; // Simple utilities for page numbers (adapted from stamp) const A4_ASPECT_RATIO = 0.707; @@ -256,9 +257,9 @@ export default function PageNumberPreview({ const idx = (i + 1) as 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9; const selected = parameters.position === idx; return ( - + ); })} diff --git a/frontend/editor/src/core/components/tools/addPageNumbers/useAddPageNumbersOperation.ts b/frontend/editor/src/core/components/tools/addPageNumbers/useAddPageNumbersOperation.ts index f9bf73f4ce..ba8ca13b32 100644 --- a/frontend/editor/src/core/components/tools/addPageNumbers/useAddPageNumbersOperation.ts +++ b/frontend/editor/src/core/components/tools/addPageNumbers/useAddPageNumbersOperation.ts @@ -1,39 +1,86 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { AddPageNumbersParameters, defaultParameters, } from "@app/components/tools/addPageNumbers/useAddPageNumbersParameters"; +const ENDPOINT = "/api/v1/misc/add-page-numbers" satisfies ToolEndpoint; +type AddPageNumbersApiParams = ToolApiParams[typeof ENDPOINT]; + +// The UI labels fonts capitalized while the backend model uses lowercase; these +// maps translate between them so both mappers type-check without casting. +const FONT_TYPE_TO_API = { + Times: "times", + Helvetica: "helvetica", + Courier: "courier", +} as const satisfies Record< + AddPageNumbersParameters["fontType"], + AddPageNumbersApiParams["fontType"] +>; +const FONT_TYPE_FROM_API = { + times: "Times", + helvetica: "Helvetica", + courier: "Courier", +} as const satisfies Record< + AddPageNumbersApiParams["fontType"], + AddPageNumbersParameters["fontType"] +>; + +// Convert the tool's UI parameters into the add-page-numbers request body. The +// return type is the generated backend model, so a spec change that renames or +// drops a field breaks the build here. +export const addPageNumbersToApiParams = ( + parameters: AddPageNumbersParameters, +): AddPageNumbersApiParams => ({ + customMargin: parameters.customMargin, + position: parameters.position, + fontSize: parameters.fontSize, + fontType: FONT_TYPE_TO_API[parameters.fontType], + startingNumber: parameters.startingNumber, + pagesToNumber: parameters.pagesToNumber, + customText: parameters.customText, + zeroPad: parameters.zeroPad, +}); + +// Reconstruct the tool's UI parameters from an add-page-numbers request body, +// so a stored or AI-authored step can be re-rendered in the settings UI. +export const addPageNumbersFromApiParams = ( + apiParams: AddPageNumbersApiParams, +): Partial => ({ + customMargin: apiParams.customMargin, + position: apiParams.position, + fontSize: apiParams.fontSize, + fontType: FONT_TYPE_FROM_API[apiParams.fontType], + startingNumber: apiParams.startingNumber, + pagesToNumber: apiParams.pagesToNumber, + customText: apiParams.customText, + zeroPad: apiParams.zeroPad, +}); + export const buildAddPageNumbersFormData = ( parameters: AddPageNumbersParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("customMargin", parameters.customMargin); - formData.append("position", String(parameters.position)); - formData.append("fontSize", String(parameters.fontSize)); - formData.append("fontType", parameters.fontType); - formData.append("startingNumber", String(parameters.startingNumber)); - formData.append("pagesToNumber", parameters.pagesToNumber); - formData.append("customText", parameters.customText); - formData.append("zeroPad", String(parameters.zeroPad)); +): FormData => + objectToFormData(addPageNumbersToApiParams(parameters), { fileInput: file }); - return formData; -}; - -export const addPageNumbersOperationConfig = { - toolType: ToolType.singleFile, +export const addPageNumbersOperationConfig = defineSingleFileTool({ buildFormData: buildAddPageNumbersFormData, + toApiParams: addPageNumbersToApiParams, + fromApiParams: addPageNumbersFromApiParams, operationType: "addPageNumbers", - endpoint: "/api/v1/misc/add-page-numbers", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useAddPageNumbersOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/components/tools/addStamp/StampPositionFormattingSettings.tsx b/frontend/editor/src/core/components/tools/addStamp/StampPositionFormattingSettings.tsx index 7912cd0bcd..76f8be4109 100644 --- a/frontend/editor/src/core/components/tools/addStamp/StampPositionFormattingSettings.tsx +++ b/frontend/editor/src/core/components/tools/addStamp/StampPositionFormattingSettings.tsx @@ -4,7 +4,6 @@ import { Select, Stack, ColorInput, - Button, Slider, Text, NumberInput, @@ -13,6 +12,8 @@ import { AddStampParameters } from "@app/components/tools/addStamp/useAddStampPa import LocalIcon from "@app/components/shared/LocalIcon"; import styles from "@app/components/tools/addStamp/StampPreview.module.css"; import { Tooltip } from "@app/components/shared/Tooltip"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex"; interface StampPositionFormattingSettingsProps { @@ -55,7 +56,7 @@ const StampPositionFormattingSettings = ({ return ( + - + - + diff --git a/frontend/editor/src/core/components/tools/addStamp/StampPreview.tsx b/frontend/editor/src/core/components/tools/addStamp/StampPreview.tsx index 9659c4317a..88f2d72f6c 100644 --- a/frontend/editor/src/core/components/tools/addStamp/StampPreview.tsx +++ b/frontend/editor/src/core/components/tools/addStamp/StampPreview.tsx @@ -11,6 +11,7 @@ import { } from "@app/components/tools/addStamp/StampPreviewUtils"; import styles from "@app/components/tools/addStamp/StampPreview.module.css"; import { PrivateContent } from "@app/components/shared/PrivateContent"; +import { Button } from "@app/ui/Button"; type Props = { parameters: AddStampParameters; @@ -429,9 +430,9 @@ export default function StampPreview({ parameters.position === idx && (parameters.overrideX < 0 || parameters.overrideY < 0); return ( - + ); })} diff --git a/frontend/editor/src/core/components/tools/addStamp/StampSetupSettings.tsx b/frontend/editor/src/core/components/tools/addStamp/StampSetupSettings.tsx index 1625affa59..4c7ee96c5b 100644 --- a/frontend/editor/src/core/components/tools/addStamp/StampSetupSettings.tsx +++ b/frontend/editor/src/core/components/tools/addStamp/StampSetupSettings.tsx @@ -5,7 +5,6 @@ import { Textarea, TextInput, Select, - Button, Text, Divider, Accordion, @@ -15,6 +14,7 @@ import { Box, Paper, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { AddStampParameters } from "@app/components/tools/addStamp/useAddStampParameters"; import ButtonSelector from "@app/components/shared/ButtonSelector"; import styles from "@app/components/tools/addStamp/StampPreview.module.css"; @@ -236,7 +236,6 @@ const StampSetupSettings = ({ { value: "image", label: t("watermark.type.2", "Image") }, ]} disabled={disabled} - buttonClassName={styles.modeToggleButton} textClassName={styles.modeToggleButtonText} /> @@ -673,8 +672,8 @@ const StampSetupSettings = ({ id="stamp-image-input" /> - diff --git a/frontend/editor/src/core/components/tools/automate/AutomationEntry.tsx b/frontend/editor/src/core/components/tools/automate/AutomationEntry.tsx index de8c82d449..322d2d87fc 100644 --- a/frontend/editor/src/core/components/tools/automate/AutomationEntry.tsx +++ b/frontend/editor/src/core/components/tools/automate/AutomationEntry.tsx @@ -1,6 +1,7 @@ import React, { useState } from "react"; import { useTranslation } from "react-i18next"; -import { Group, Text, ActionIcon, Menu, Button, Box } from "@mantine/core"; +import { Group, Text, Menu, Box } from "@mantine/core"; +import { Button as SharedButton } from "@app/ui/Button"; import MoreVertIcon from "@mui/icons-material/MoreVert"; import EditIcon from "@mui/icons-material/Edit"; import DeleteIcon from "@mui/icons-material/Delete"; @@ -181,31 +182,24 @@ export default function AutomationEntry({ onMouseEnter={() => setIsHovered(true)} onMouseLeave={() => setIsHovered(false)} > - + {showMenu && ( setIsMenuOpen(false)} > - } + variant="tertiary" + accent="neutral" size="md" aria-label={t( "automate.entryMenu.label", @@ -234,9 +229,7 @@ export default function AutomationEntry({ transition: "opacity 0.2s ease", pointerEvents: shouldShowMenu ? "auto" : "none", }} - > - - + /> diff --git a/frontend/editor/src/core/components/tools/automate/AutomationImportModal.tsx b/frontend/editor/src/core/components/tools/automate/AutomationImportModal.tsx index 95e85e8026..c8c20cf607 100644 --- a/frontend/editor/src/core/components/tools/automate/AutomationImportModal.tsx +++ b/frontend/editor/src/core/components/tools/automate/AutomationImportModal.tsx @@ -3,13 +3,13 @@ import { useTranslation } from "react-i18next"; import { Alert, Badge, - Button, Group, Modal, Stack, Text, Textarea, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { Dropzone } from "@mantine/dropzone"; import UploadFileIcon from "@mui/icons-material/UploadFile"; import { Z_INDEX_AUTOMATE_MODAL } from "@app/styles/zIndex"; @@ -218,7 +218,7 @@ export default function AutomationImportModal({ )} - )} diff --git a/frontend/editor/src/core/components/tools/automate/IconSelector.tsx b/frontend/editor/src/core/components/tools/automate/IconSelector.tsx index cd67d1487f..1b0909cbc0 100644 --- a/frontend/editor/src/core/components/tools/automate/IconSelector.tsx +++ b/frontend/editor/src/core/components/tools/automate/IconSelector.tsx @@ -1,14 +1,7 @@ import React, { useState } from "react"; import { useTranslation } from "react-i18next"; -import { - Box, - Text, - Stack, - Button, - SimpleGrid, - Tooltip, - Popover, -} from "@mantine/core"; +import { Box, Text, Stack, SimpleGrid, Tooltip, Popover } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown"; import { iconMap, iconOptions } from "@app/components/tools/automate/iconMap"; import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex"; @@ -58,12 +51,13 @@ export default function IconSelector({ zIndex={Z_INDEX_AUTOMATE_DROPDOWN} > - + diff --git a/frontend/editor/src/core/components/tools/automate/ToolConfigurationModal.tsx b/frontend/editor/src/core/components/tools/automate/ToolConfigurationModal.tsx index b70f6b925e..93631e087c 100644 --- a/frontend/editor/src/core/components/tools/automate/ToolConfigurationModal.tsx +++ b/frontend/editor/src/core/components/tools/automate/ToolConfigurationModal.tsx @@ -1,15 +1,7 @@ import { Suspense, useState, useEffect } from "react"; import { useTranslation } from "react-i18next"; -import { - Modal, - Title, - Button, - Group, - Stack, - Text, - Alert, - Loader, -} from "@mantine/core"; +import { Modal, Title, Group, Stack, Text, Alert, Loader } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { Z_INDEX_AUTOMATE_MODAL } from "@app/styles/zIndex"; import SettingsIcon from "@mui/icons-material/Settings"; import CheckIcon from "@mui/icons-material/Check"; @@ -125,7 +117,7 @@ export default function ToolConfigurationModal({ {isServerCertificateEnabled && ( )} {isHardwareAvailable && ( diff --git a/frontend/editor/src/core/components/tools/certSign/HardwareCertificateSettings.tsx b/frontend/editor/src/core/components/tools/certSign/HardwareCertificateSettings.tsx index 820636af35..b384ce8d5c 100644 --- a/frontend/editor/src/core/components/tools/certSign/HardwareCertificateSettings.tsx +++ b/frontend/editor/src/core/components/tools/certSign/HardwareCertificateSettings.tsx @@ -1,7 +1,6 @@ import { useCallback, useEffect, useState } from "react"; import { Alert, - Button, Group, Loader, NumberInput, @@ -10,6 +9,7 @@ import { Text, TextInput, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import { CertSignParameters } from "@app/hooks/tools/certSign/useCertSignParameters"; import { @@ -284,22 +284,34 @@ const HardwareCertificateSettings = ({ {supported.windows && supported.pkcs11 && (
    @@ -332,7 +344,7 @@ const HardwareCertificateSettings = ({ )} />
    removeSignature(sig.id)} aria-label={t( @@ -177,7 +172,7 @@ export const SelectSignatureModal: React.FC = ({ - diff --git a/frontend/editor/src/core/components/tools/certSign/panels/SignControlsPanel.tsx b/frontend/editor/src/core/components/tools/certSign/panels/SignControlsPanel.tsx index 7945c697f4..15fe50eb90 100644 --- a/frontend/editor/src/core/components/tools/certSign/panels/SignControlsPanel.tsx +++ b/frontend/editor/src/core/components/tools/certSign/panels/SignControlsPanel.tsx @@ -1,15 +1,8 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react"; -import { - ActionIcon, - Box, - Button, - Group, - Menu, - Modal, - SegmentedControl, - Stack, - Text, -} from "@mantine/core"; +import { Box, Group, Menu, Modal, Stack, Text } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; +import { Button } from "@app/ui/Button"; +import { SegmentedControl } from "@app/ui/SegmentedControl"; import { useTranslation } from "react-i18next"; import DrawIcon from "@mui/icons-material/Draw"; import OpenWithIcon from "@mui/icons-material/OpenWith"; @@ -363,11 +356,10 @@ export default function SignControlsPanel({ ) : ( ) : ( - setDropdownOpened(!dropdownOpened)} @@ -106,7 +108,7 @@ const GroupedFormatDropdown = ({ : "var(--dropdown-trigger-text)", }} > - + {selectedLabel} @@ -119,7 +121,7 @@ const GroupedFormatDropdown = ({ }} /> - + handleOptionSelect(option.value)} disabled={option.enabled === false} + rightSection={ + option.usesCloud ? ( + + ) : undefined + } style={{ fontSize: "0.75rem", height: "2rem", @@ -160,15 +173,6 @@ const GroupedFormatDropdown = ({ }} > {option.label} - {option.usesCloud && ( - - )} ))} diff --git a/frontend/editor/src/core/components/tools/crop/CropSettings.tsx b/frontend/editor/src/core/components/tools/crop/CropSettings.tsx index 65b0e8f0fe..710391dd6c 100644 --- a/frontend/editor/src/core/components/tools/crop/CropSettings.tsx +++ b/frontend/editor/src/core/components/tools/crop/CropSettings.tsx @@ -4,11 +4,11 @@ import { Text, Box, Group, - ActionIcon, Center, Alert, Checkbox, } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useTranslation } from "react-i18next"; import RestartAltIcon from "@mui/icons-material/RestartAlt"; import { CropParametersHook } from "@app/hooks/tools/crop/useCropParameters"; @@ -193,7 +193,7 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => { {t("crop.preview.title", "Crop Area Selection")} { e.preventDefault(); if (hasChildren) handleToggle(bookmark.id); @@ -272,13 +271,17 @@ export default function BookmarkEditor({ )} > { e.preventDefault(); handleAddChild(bookmark.id); }} disabled={disabled} + aria-label={t( + "editTableOfContents.editor.actions.addChild", + "Add child bookmark", + )} > @@ -290,13 +293,16 @@ export default function BookmarkEditor({ )} > { e.preventDefault(); handleAddSibling(bookmark.id); }} disabled={disabled} + aria-label={t( + "editTableOfContents.editor.actions.addSibling", + "Add sibling bookmark", + )} > @@ -308,13 +314,17 @@ export default function BookmarkEditor({ )} > { e.preventDefault(); handleRemove(bookmark.id); }} disabled={disabled} + aria-label={t( + "editTableOfContents.editor.actions.remove", + "Remove bookmark", + )} > @@ -399,8 +409,7 @@ export default function BookmarkEditor({ - + - + - - file && onImportJson(file)} accept="application/json" disabled={disabled} + variant="secondary" + leftSection={} + fullWidth > - {(props) => ( - - )} - - + {t("editTableOfContents.actions.importJson", "Import JSON")} + - + @@ -184,16 +167,15 @@ export default function EditTableOfContentsSettings({ - - + - + diff --git a/frontend/editor/src/core/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView.tsx b/frontend/editor/src/core/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView.tsx index 43702d5c65..148917dba6 100644 --- a/frontend/editor/src/core/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView.tsx +++ b/frontend/editor/src/core/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView.tsx @@ -1,6 +1,7 @@ import { useMemo } from "react"; import { useTranslation } from "react-i18next"; -import { Box, Button, Card, Divider, Group, Stack, Text } from "@mantine/core"; +import { Box, Card, Divider, Group, Stack, Text } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import LocalIcon from "@app/components/shared/LocalIcon"; import { BookmarkNode } from "@app/utils/editTableOfContents"; import ErrorNotification from "@app/components/tools/shared/ErrorNotification"; @@ -150,7 +151,6 @@ const EditTableOfContentsWorkbenchView = ({ )} + ); const { key: disabledKey, fallback: disabledFallback } = diff --git a/frontend/editor/src/core/components/tools/fullscreen/DetailedToolItem.tsx b/frontend/editor/src/core/components/tools/fullscreen/DetailedToolItem.tsx index 32fa181a16..464403e286 100644 --- a/frontend/editor/src/core/components/tools/fullscreen/DetailedToolItem.tsx +++ b/frontend/editor/src/core/components/tools/fullscreen/DetailedToolItem.tsx @@ -14,6 +14,7 @@ import { useToolMeta, getDisabledLabel, } from "@app/components/tools/fullscreen/shared"; +import { Button } from "@app/ui/Button"; interface DetailedToolItemProps { id: string; @@ -56,8 +57,8 @@ const DetailedToolItem: React.FC = ({ const disabledMessage = t(disabledKey, disabledFallback); return ( - + ); }; diff --git a/frontend/editor/src/core/components/tools/getPdfInfo/GetPdfInfoResults.tsx b/frontend/editor/src/core/components/tools/getPdfInfo/GetPdfInfoResults.tsx index 7c1c5fe423..487252ae81 100644 --- a/frontend/editor/src/core/components/tools/getPdfInfo/GetPdfInfoResults.tsx +++ b/frontend/editor/src/core/components/tools/getPdfInfo/GetPdfInfoResults.tsx @@ -1,5 +1,6 @@ import { useCallback, useMemo } from "react"; -import { Alert, Button, Group, Loader, Stack, Text } from "@mantine/core"; +import { Alert, Group, Loader, Stack, Text } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import type { GetPdfInfoOperationHook } from "@app/hooks/tools/getPdfInfo/useGetPdfInfoOperation"; import { downloadFile } from "@app/services/downloadService"; @@ -72,7 +73,6 @@ const GetPdfInfoResults = ({ {t("getPdfInfo.downloads", "Downloads")} - diff --git a/frontend/editor/src/core/components/tools/pdfTextEditor/PdfTextEditorView.tsx b/frontend/editor/src/core/components/tools/pdfTextEditor/PdfTextEditorView.tsx index cc6389845a..0cbd88e619 100644 --- a/frontend/editor/src/core/components/tools/pdfTextEditor/PdfTextEditorView.tsx +++ b/frontend/editor/src/core/components/tools/pdfTextEditor/PdfTextEditorView.tsx @@ -7,11 +7,9 @@ import React, { useState, } from "react"; import { - ActionIcon, Alert, Badge, Box, - Button, Card, Divider, Group, @@ -24,6 +22,8 @@ import { Text, Tooltip, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { Dropzone } from "@mantine/dropzone"; import { useTranslation } from "react-i18next"; import AutorenewIcon from "@mui/icons-material/Autorenew"; @@ -1553,10 +1553,10 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => { {resizeHandle} {activeGroupId === groupId && ( { + ) : ( )} diff --git a/frontend/editor/src/core/components/tools/sign/SavedSignaturesSection.tsx b/frontend/editor/src/core/components/tools/sign/SavedSignaturesSection.tsx index 8b40b8721a..50cc3d2fe2 100644 --- a/frontend/editor/src/core/components/tools/sign/SavedSignaturesSection.tsx +++ b/frontend/editor/src/core/components/tools/sign/SavedSignaturesSection.tsx @@ -1,7 +1,6 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import { useTranslation } from "react-i18next"; import { - ActionIcon, Alert, Badge, Box, @@ -13,6 +12,7 @@ import { Tooltip, } from "@mantine/core"; import { LocalIcon } from "@app/components/shared/LocalIcon"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { SavedSignature, SavedSignatureType, @@ -301,7 +301,7 @@ export const SavedSignaturesSection = ({ setActivePersonalIndex((prev) => Math.max(0, prev - 1)) @@ -315,7 +315,7 @@ export const SavedSignaturesSection = ({ /> setActivePersonalIndex((prev) => @@ -351,8 +351,7 @@ export const SavedSignaturesSection = ({ onUseSignature(activePersonalSignature)} disabled={disabled} @@ -365,8 +364,8 @@ export const SavedSignaturesSection = ({ onDeleteSignature(activePersonalSignature) @@ -432,7 +431,7 @@ export const SavedSignaturesSection = ({ setActiveSharedIndex((prev) => Math.max(0, prev - 1)) @@ -446,7 +445,7 @@ export const SavedSignaturesSection = ({ /> setActiveSharedIndex((prev) => @@ -478,8 +477,7 @@ export const SavedSignaturesSection = ({ onUseSignature(activeSharedSignature)} disabled={disabled} @@ -493,8 +491,8 @@ export const SavedSignaturesSection = ({ {isAdmin && ( onDeleteSignature(activeSharedSignature) @@ -564,7 +562,7 @@ export const SavedSignaturesSection = ({ setActiveLocalStorageIndex((prev) => @@ -580,7 +578,7 @@ export const SavedSignaturesSection = ({ /> setActiveLocalStorageIndex((prev) => @@ -616,8 +614,7 @@ export const SavedSignaturesSection = ({ onUseSignature(activeLocalStorageSignature) @@ -632,8 +629,8 @@ export const SavedSignaturesSection = ({ onDeleteSignature(activeLocalStorageSignature) diff --git a/frontend/editor/src/core/components/tools/sign/SignSettings.tsx b/frontend/editor/src/core/components/tools/sign/SignSettings.tsx index de7a410b0d..648ada1c47 100644 --- a/frontend/editor/src/core/components/tools/sign/SignSettings.tsx +++ b/frontend/editor/src/core/components/tools/sign/SignSettings.tsx @@ -2,16 +2,15 @@ import { useTranslation } from "react-i18next"; import { Stack, - Button, Text, Alert, - SegmentedControl, Divider, - ActionIcon, Tooltip, Group, Box, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { SegmentedControl } from "@app/ui/SegmentedControl"; import { SignParameters } from "@app/hooks/tools/sign/useSignParameters"; import { useSignature } from "@app/contexts/SignatureContext"; import { useViewer } from "@app/contexts/ViewerContext"; @@ -437,9 +436,9 @@ const SignSettings = ({ const button = ( ) : ( - + } > - - - {translate("mode.resume", "Resume placement")} - - + {translate("mode.resume", "Resume placement")} + ) ) : null; @@ -1185,7 +1168,7 @@ const SignSettings = ({ onChange={(value) => handleSignatureSourceChange(value as SignatureSource) } - data={sourceOptions} + options={sourceOptions} /> )} {renderSignatureBuilder()} @@ -1228,7 +1211,7 @@ const SignSettings = ({ /> {onSave && ( - )} diff --git a/frontend/editor/src/core/components/tools/toolPicker/FavoriteStar.tsx b/frontend/editor/src/core/components/tools/toolPicker/FavoriteStar.tsx index d951951421..10bd556df9 100644 --- a/frontend/editor/src/core/components/tools/toolPicker/FavoriteStar.tsx +++ b/frontend/editor/src/core/components/tools/toolPicker/FavoriteStar.tsx @@ -1,31 +1,38 @@ import React from "react"; -import { ActionIcon } from "@mantine/core"; -import type { MantineSize } from "@mantine/core"; import { useTranslation } from "react-i18next"; import StarRoundedIcon from "@mui/icons-material/StarRounded"; import StarBorderRoundedIcon from "@mui/icons-material/StarBorderRounded"; - +import { ActionIcon } from "@app/ui/ActionIcon"; +import type { ActionIconSize } from "@app/ui/ActionIcon"; +type FavoriteStarSize = "xs" | ActionIconSize; +const SIZE_MAP: Record = { + xs: "sm", + sm: "sm", + md: "md", + lg: "lg", + xl: "xl", +}; interface FavoriteStarProps { isFavorite: boolean; onToggle: () => void; className?: string; - size?: MantineSize; + size?: FavoriteStarSize; } const FavoriteStar: React.FC = ({ isFavorite, onToggle, className, - size = "xs", + size = "sm", }) => { const { t } = useTranslation(); return ( { e.stopPropagation(); onToggle(); diff --git a/frontend/editor/src/core/components/tools/toolPicker/ToolButton.tsx b/frontend/editor/src/core/components/tools/toolPicker/ToolButton.tsx index e184ae6d58..efbe3bb2cb 100644 --- a/frontend/editor/src/core/components/tools/toolPicker/ToolButton.tsx +++ b/frontend/editor/src/core/components/tools/toolPicker/ToolButton.tsx @@ -1,5 +1,6 @@ import React, { memo } from "react"; -import { Button, Badge } from "@mantine/core"; +import { Badge } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { useTranslation } from "react-i18next"; import { Tooltip } from "@app/components/shared/Tooltip"; import { ToolIcon } from "@app/components/shared/ToolIcon"; @@ -143,84 +144,83 @@ const ToolButton: React.FC = ({ ); - + const buttonIcon = ( + + ); const buttonContent = ( - <> - +
    -
    + {tool.versionStatus === "alpha" && ( + + {t("toolPanel.alpha", "Alpha")} + + )} + {typeof badgeCount === "number" && badgeCount > 0 && ( + + {badgeCount} + + )} + {usesCloud && !visuallyUnavailable && } +
    + {showDescription && tool.description && ( + + {tool.description} + + )} + {matchedSynonym && ( + - - {tool.versionStatus === "alpha" && ( - - {t("toolPanel.alpha", "Alpha")} - - )} - {typeof badgeCount === "number" && badgeCount > 0 && ( - - {badgeCount} - - )} - {usesCloud && !visuallyUnavailable && } -
    - {showDescription && tool.description && ( - - {tool.description} - - )} - {matchedSynonym && ( - - {matchedSynonym} - - )} -
    - + {matchedSynonym} +     + )} + ); const handleExternalClick = (e: React.MouseEvent) => { @@ -234,24 +234,21 @@ const ToolButton: React.FC = ({ const buttonElement = navProps ? ( // For internal tools with URLs, render Button as an anchor for proper link behavior diff --git a/frontend/editor/src/core/components/viewer/BookmarkSidebar.tsx b/frontend/editor/src/core/components/viewer/BookmarkSidebar.tsx index 40bd9d3045..e9ae53183e 100644 --- a/frontend/editor/src/core/components/viewer/BookmarkSidebar.tsx +++ b/frontend/editor/src/core/components/viewer/BookmarkSidebar.tsx @@ -3,16 +3,15 @@ import { Box, ScrollArea, Text, - ActionIcon, Loader, Stack, TextInput, NumberInput, - Button, Group, - UnstyledButton, } from "@mantine/core"; import LocalIcon from "@app/components/shared/LocalIcon"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useViewer } from "@app/contexts/ViewerContext"; import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext"; import { useFileContext } from "@app/contexts/FileContext"; @@ -20,6 +19,7 @@ import { isStirlingFile, type FileId } from "@app/types/fileContext"; import { createStirlingFilesAndStubs } from "@app/services/fileStubHelpers"; import apiClient from "@app/services/apiClient"; import { PdfBookmarkObject, PdfActionType } from "@embedpdf/models"; +import { useTranslation } from "react-i18next"; import BookmarksIcon from "@mui/icons-material/BookmarksRounded"; import "@app/components/viewer/SidebarBase.css"; import "@app/components/viewer/BookmarkSidebar.css"; @@ -93,6 +93,7 @@ export const BookmarkSidebar = ({ getScrollState, toggleBookmarkSidebar, } = useViewer(); + const { t } = useTranslation(); const { handleToolSelectForced } = useToolWorkflow(); const { selectors, actions: fileActions } = useFileContext(); const [expanded, setExpanded] = useState>({}); @@ -475,6 +476,34 @@ export const BookmarkSidebar = ({ })); }; + const expandAll = useCallback(() => { + const allExpanded: Record = {}; + const expandRecursive = (nodes: BookmarkNode[]) => { + nodes.forEach((node) => { + if (node.children && node.children.length > 0) { + allExpanded[node.id] = true; + expandRecursive(node.children as BookmarkNode[]); + } + }); + }; + expandRecursive(bookmarksWithIds); + setExpanded(allExpanded); + }, [bookmarksWithIds]); + + const collapseAll = useCallback(() => { + const allCollapsed: Record = {}; + const collapseRecursive = (nodes: BookmarkNode[]) => { + nodes.forEach((node) => { + if (node.children && node.children.length > 0) { + allCollapsed[node.id] = false; + collapseRecursive(node.children as BookmarkNode[]); + } + }); + }; + collapseRecursive(bookmarksWithIds); + setExpanded(allCollapsed); + }, [bookmarksWithIds]); + const handleBookmarkClick = ( bookmark: PdfBookmarkObject, event: React.MouseEvent, @@ -569,9 +598,10 @@ export const BookmarkSidebar = ({ > {hasChildren ? ( { event.stopPropagation(); toggleNode(node.id); @@ -654,12 +684,54 @@ export const BookmarkSidebar = ({ + {bookmarkSupport && bookmarksWithIds.length > 0 && ( + <> + {Object.values(expanded).some((val) => val === false) ? ( + + + + ) : ( + + + + )} + + )} @@ -706,7 +778,7 @@ export const BookmarkSidebar = ({ {currentError} - @@ -726,7 +798,6 @@ export const BookmarkSidebar = ({ )} - {showEmptyState && !isAddingBookmark && ( @@ -862,9 +930,12 @@ export const BookmarkSidebar = ({ flexShrink: 0, }} > - @@ -883,7 +954,7 @@ export const BookmarkSidebar = ({ Need to reorder or nest? Open the Bookmark Editor - + )} diff --git a/frontend/editor/src/core/components/viewer/CommentsSidebar.tsx b/frontend/editor/src/core/components/viewer/CommentsSidebar.tsx index cc470b3ea6..e25f9671d9 100644 --- a/frontend/editor/src/core/components/viewer/CommentsSidebar.tsx +++ b/frontend/editor/src/core/components/viewer/CommentsSidebar.tsx @@ -5,16 +5,15 @@ import { Text, Textarea, Stack, - ActionIcon, Group, Tooltip, TextInput, Menu, Modal, - Button, - UnstyledButton, } from "@mantine/core"; import { useTranslation } from "react-i18next"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import DeleteIcon from "@mui/icons-material/Delete"; import CheckIcon from "@mui/icons-material/CheckRounded"; import MoreHorizIcon from "@mui/icons-material/MoreHoriz"; @@ -120,7 +119,6 @@ function getCommentDisplayContent(entry: { /** Placeholder authors we never show; use current user's name from context instead. */ const PLACEHOLDER_AUTHORS = new Set(["Guest", "Digital Signature", ""]); - function getAuthorName( obj: Pick, currentDisplayName: string, @@ -188,7 +186,6 @@ function getIconByType(type: number | undefined): string { if (type === 15) return "edit"; return "comment"; } - function isCommentAnnotation(ann: PdfAnnotationObject): boolean { const customData = getStirlingAnnotationMetadata(ann).customData; const toolId = customData?.toolId ?? customData?.annotationToolId; @@ -252,7 +249,6 @@ function getAnnotationToolId(ann: PdfAnnotationObject): string { const customData = getStirlingAnnotationMetadata(ann).customData; return customData?.toolId ?? customData?.annotationToolId ?? ""; } - function getAnnotationTypeLabel( ann: PdfAnnotationObject, t: (key: string, fallback: string) => string, @@ -285,7 +281,6 @@ function getAnnotationTypeLabel( if (type === 1) return t("viewer.comments.typeComment", "Comment"); return t("viewer.comments.typeComment", "Comment"); } - function AnnotationTypeIcon({ ann }: { ann: PdfAnnotationObject }) { const toolId = getAnnotationToolId(ann); const iconName = TOOL_ICON_MAP[toolId] ?? getIconByType(ann?.type); @@ -714,9 +709,10 @@ export function CommentsSidebar({ @@ -727,7 +723,15 @@ export function CommentsSidebar({ - + @@ -746,11 +750,14 @@ export function CommentsSidebar({ )} {toggleCommentsSidebar && ( @@ -775,9 +782,9 @@ export function CommentsSidebar({ {isPlacingComment ? ( ) : ( @@ -943,9 +942,13 @@ export function CommentsSidebar({ )} > handleLocateAnnotation(pageIndex, ann) } @@ -962,9 +965,13 @@ export function CommentsSidebar({ )} > { handleSendMainComment( pageIndex, @@ -1043,9 +1053,7 @@ export function CommentsSidebar({ }} disabled={!(draft ?? "").trim()} > - + @@ -1112,7 +1120,9 @@ export function CommentsSidebar({ > {canEditReply && !isEditingReply ? ( - { setEditingReplyKey( @@ -1135,7 +1145,7 @@ export function CommentsSidebar({ "Edit", )} - + ) : null} {rTimestamp ? ( @@ -1178,9 +1188,12 @@ export function CommentsSidebar({ )} > handleSaveReplyEdit( replyEditKey, @@ -1196,7 +1209,6 @@ export function CommentsSidebar({ @@ -1252,13 +1264,12 @@ export function CommentsSidebar({ )} > handleSendReply( pageIndex, @@ -1268,9 +1279,7 @@ export function CommentsSidebar({ } disabled={!replyDraft.trim()} > - +     @@ -1305,10 +1314,10 @@ export function CommentsSidebar({ )} - - - diff --git a/frontend/editor/src/core/components/viewer/EmbedPdfViewer.tsx b/frontend/editor/src/core/components/viewer/EmbedPdfViewer.tsx index 24bc42b02e..1e21637849 100644 --- a/frontend/editor/src/core/components/viewer/EmbedPdfViewer.tsx +++ b/frontend/editor/src/core/components/viewer/EmbedPdfViewer.tsx @@ -6,7 +6,9 @@ import React, { useState, } from "react"; import { useTranslation } from "react-i18next"; -import { Box, Center, Text, ActionIcon, Button, Stack } from "@mantine/core"; +import { Box, Center, Text, Stack } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import CloseIcon from "@mui/icons-material/Close"; import LockIcon from "@mui/icons-material/Lock"; @@ -45,6 +47,7 @@ import { useWheelZoom } from "@app/hooks/useWheelZoom"; import { useFormFill } from "@app/tools/formFill/FormFillContext"; import { FormSaveBar } from "@app/tools/formFill/FormSaveBar"; import { useViewerKeyCommand } from "@app/hooks/useViewerKeyCommand"; +import { usePolicyFileBadges } from "@app/hooks/usePolicyFileBadges"; import { alert } from "@app/components/toast"; // ─── Measure dictionary extraction ──────────────────────────────────────────── @@ -441,6 +444,15 @@ const EmbedPdfViewerContent = ({ const viewerKeyCommand = useViewerKeyCommand(); + const policyFileBadges = usePolicyFileBadges(); + const policyEnforcing = + !!activeFileId && + (policyFileBadges.get(activeFileId) ?? []).some((p) => p.enforcing); + // Use a ref so the keydown handler always reads the latest value without + // needing to be in the effect's dependency array. + const policyEnforcingRef = useRef(false); + policyEnforcingRef.current = policyEnforcing; + // Handle keyboard shortcuts useEffect(() => { const handleKeyDown = (event: KeyboardEvent) => { @@ -466,7 +478,9 @@ const EmbedPdfViewerContent = ({ case "p": case "P": event.preventDefault(); - printActions.print(); + if (!policyEnforcingRef.current) { + printActions.print(); + } return; case "a": case "A": @@ -1225,15 +1239,14 @@ const EmbedPdfViewerContent = ({ {/* Close Button - Only show in preview mode */} {onClose && previewFile && ( @@ -1261,7 +1274,6 @@ const EmbedPdfViewerContent = ({ )} - + {/* Navigate / Open */} - + ); }, diff --git a/frontend/editor/src/core/components/viewer/NonPdfViewer.tsx b/frontend/editor/src/core/components/viewer/NonPdfViewer.tsx index 1b54fa1680..ed4a2e2263 100644 --- a/frontend/editor/src/core/components/viewer/NonPdfViewer.tsx +++ b/frontend/editor/src/core/components/viewer/NonPdfViewer.tsx @@ -1,5 +1,6 @@ import { useCallback, useMemo } from "react"; -import { Box, Button, Center, Stack, Text } from "@mantine/core"; +import { Box, Center, Stack, Text } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import ArticleIcon from "@mui/icons-material/Article"; import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf"; @@ -81,8 +82,8 @@ export function NonPdfViewer({ file }: NonPdfViewerProps) { {isConvertAvailable && ( +     )} {/* Previous Page Button */} - +     {/* Page Input */} {/* Next Page Button */} - +     {/* Last Page Button */} {!isPhone && ( - + )} {/* Dual Page Toggle */} @@ -261,21 +246,24 @@ export function PdfViewerToolbar({ position="top" arrow > - + )} @@ -292,11 +280,9 @@ export function PdfViewerToolbar({ position="top" arrow > - + )} @@ -323,9 +309,7 @@ export function PdfViewerToolbar({ style={{ marginLeft: 16, flexShrink: 0 }} > @@ -346,9 +330,7 @@ export function PdfViewerToolbar({ label={null} /> @@ -376,9 +358,7 @@ export function PdfViewerToolbar({ > @@ -172,14 +162,11 @@ function RedactionSelectionMenuInner({ position="top" > diff --git a/frontend/editor/src/core/components/viewer/SearchInterface.tsx b/frontend/editor/src/core/components/viewer/SearchInterface.tsx index f111837860..2c93aff17c 100644 --- a/frontend/editor/src/core/components/viewer/SearchInterface.tsx +++ b/frontend/editor/src/core/components/viewer/SearchInterface.tsx @@ -1,7 +1,8 @@ import React, { useState, useEffect, useRef } from "react"; -import { Box, TextInput, ActionIcon, Text, Group } from "@mantine/core"; +import { Box, TextInput, Text, Group } from "@mantine/core"; import { useTranslation } from "react-i18next"; import { LocalIcon } from "@app/components/shared/LocalIcon"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { ViewerContext } from "@app/contexts/ViewerContext"; interface SearchInterfaceProps { @@ -200,7 +201,7 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) { {t("search.title", "Search PDF")} @@ -275,7 +276,7 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) { diff --git a/frontend/editor/src/core/components/viewer/ThumbnailSidebar.tsx b/frontend/editor/src/core/components/viewer/ThumbnailSidebar.tsx index 94919eb4f2..3fb62df970 100644 --- a/frontend/editor/src/core/components/viewer/ThumbnailSidebar.tsx +++ b/frontend/editor/src/core/components/viewer/ThumbnailSidebar.tsx @@ -1,5 +1,7 @@ import { useState, useEffect, useRef } from "react"; -import { Box, ScrollArea, Text, ActionIcon } from "@mantine/core"; +import { Box, ScrollArea, Text } from "@mantine/core"; +import { ActionIcon } from "@app/ui/ActionIcon"; +import { useTranslation } from "react-i18next"; import { useViewer } from "@app/contexts/ViewerContext"; import { PrivateContent } from "@app/components/shared/PrivateContent"; import LocalIcon from "@app/components/shared/LocalIcon"; @@ -17,6 +19,7 @@ export function ThumbnailSidebar({ onToggle, activeFileId, }: ThumbnailSidebarProps) { + const { t } = useTranslation(); const { getScrollState, scrollActions, getThumbnailAPI } = useViewer(); const [thumbnails, setThumbnails] = useState<{ [key: number]: string }>({}); @@ -182,11 +185,14 @@ export function ThumbnailSidebar({ diff --git a/frontend/editor/src/core/components/viewer/ViewerAnnotationControls.tsx b/frontend/editor/src/core/components/viewer/ViewerAnnotationControls.tsx index 78888f4188..32b4b1ce11 100644 --- a/frontend/editor/src/core/components/viewer/ViewerAnnotationControls.tsx +++ b/frontend/editor/src/core/components/viewer/ViewerAnnotationControls.tsx @@ -1,7 +1,7 @@ import React, { useCallback } from "react"; -import { ActionIcon } from "@mantine/core"; import { useTranslation } from "react-i18next"; import LocalIcon from "@app/components/shared/LocalIcon"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { Tooltip } from "@app/components/shared/Tooltip"; import { ViewerContext } from "@app/contexts/ViewerContext"; import { useSignature } from "@app/contexts/SignatureContext"; @@ -186,12 +186,15 @@ export default function ViewerAnnotationControls({ portalTarget={document.body} > s.id === activeFileId) : undefined; + const policyFileBadges = usePolicyFileBadges(); + const runs = usePolicyRuns(); + const enforcing = + !!activeFileId && + (policyFileBadges.get(activeFileId) ?? []).some((p) => p.enforcing); + const enforcingRun = enforcing + ? runs.find( + (r) => + r.fileId === activeFileId && + (POLICY_IN_FLIGHT_STATUSES as readonly string[]).includes(r.status), + ) + : undefined; + const enforcingProgress = + enforcingRun?.currentStep != null && enforcingRun.stepCount + ? Math.round((enforcingRun.currentStep / enforcingRun.stepCount) * 100) + : undefined; + const label = t("workbenchBar.share", "Share"); - const isDisabled = Boolean(disabled) || !stub; + const isDisabled = Boolean(disabled) || !stub || enforcing; + + const tooltipContent = enforcing ? ( + + + + + {t( + "policy.blockingAction", + "{{action}} blocked while enforcing policy, please wait", + { action: label }, + )} + + + {enforcingProgress != null ? ( + + ) : ( + + )} + + ) : ( + label + ); const openShare = (target: StirlingFileStub) => { setShareStub(target); @@ -123,7 +177,7 @@ export default function ViewerShareButton({ return ( <>
    + ); } diff --git a/frontend/editor/src/core/components/viewer/nonpdf/NonPdfBanner.tsx b/frontend/editor/src/core/components/viewer/nonpdf/NonPdfBanner.tsx index e1f169b85b..2d73a0f558 100644 --- a/frontend/editor/src/core/components/viewer/nonpdf/NonPdfBanner.tsx +++ b/frontend/editor/src/core/components/viewer/nonpdf/NonPdfBanner.tsx @@ -1,4 +1,4 @@ -import { Button } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf"; import { useTranslation } from "react-i18next"; @@ -13,9 +13,9 @@ export function NonPdfBanner({ onConvertToPdf }: NonPdfBannerProps) { return ( {!deletePromptIsServerOnly && ( {!deletePromptIsServerOnly && ( - diff --git a/frontend/editor/src/core/contexts/file/fileActions.ts b/frontend/editor/src/core/contexts/file/fileActions.ts index 749e820e41..86483baf32 100644 --- a/frontend/editor/src/core/contexts/file/fileActions.ts +++ b/frontend/editor/src/core/contexts/file/fileActions.ts @@ -254,6 +254,9 @@ interface AddFileOptions { ) => Promise; // Optional callback to confirm extraction of large ZIP files allowDuplicates?: boolean; skipUploadTracking?: boolean; + /** When true, marks every added stub as derivedFromTool so the policy + * auto-run skips it — used for policy outputs imported via addFiles. */ + derivedFromTool?: boolean; } /** @@ -368,6 +371,7 @@ export async function addFiles( // Create new filestub with minimal metadata; hydrate thumbnails/processedFile asynchronously const fileStub = createNewStirlingFileStub(file, fileId); + if (options.derivedFromTool) fileStub.derivedFromTool = true; // Early encryption detection for PDFs — set the flag before dispatch so the // viewer gate and modal queue pick it up immediately instead of after hydration diff --git a/frontend/editor/src/core/hooks/tools/addAttachments/useAddAttachmentsOperation.ts b/frontend/editor/src/core/hooks/tools/addAttachments/useAddAttachmentsOperation.ts index 2b66bbdc34..ddbf20f247 100644 --- a/frontend/editor/src/core/hooks/tools/addAttachments/useAddAttachmentsOperation.ts +++ b/frontend/editor/src/core/hooks/tools/addAttachments/useAddAttachmentsOperation.ts @@ -1,41 +1,60 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolOperationConfig, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; -import { AddAttachmentsParameters } from "@app/hooks/tools/addAttachments/useAddAttachmentsParameters"; +import { + AddAttachmentsParameters, + DEFAULT_ADD_ATTACHMENTS_PARAMETERS, +} from "@app/hooks/tools/addAttachments/useAddAttachmentsParameters"; + +const ENDPOINT = "/api/v1/misc/add-attachments" satisfies ToolEndpoint; +type AddAttachmentsApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the add-attachments request body. The +// attachment files are uploaded via the named "attachments" field (see +// buildFormData); the model lists them but they are not scalar parameters. +export const addAttachmentsToApiParams = ( + parameters: AddAttachmentsParameters, +): AddAttachmentsApiParams => ({ + attachments: [], + convertToPdfA3b: parameters.convertToPdfA3b, +}); + +// Reconstruct the tool's UI parameters from an add-attachments request body (the +// attachment files themselves are not recoverable from stored parameters). +export const addAttachmentsFromApiParams = ( + apiParams: AddAttachmentsApiParams, +): Partial => ({ + convertToPdfA3b: + apiParams.convertToPdfA3b ?? + DEFAULT_ADD_ATTACHMENTS_PARAMETERS.convertToPdfA3b, +}); const buildFormData = ( parameters: AddAttachmentsParameters, file: File, -): FormData => { - const formData = new FormData(); - - // Add the main PDF file (single file per request in singleFile mode) - if (file) { - formData.append("fileInput", file); - } - - // Add attachment files - (parameters.attachments || []).forEach((attachment) => { - if (attachment) formData.append("attachments", attachment); +): FormData => + objectToFormData(addAttachmentsToApiParams(parameters), { + fileInput: file, + attachments: (parameters.attachments || []).filter(Boolean), }); - formData.append("convertToPdfA3b", String(parameters.convertToPdfA3b)); - - return formData; -}; - // Operation configuration for automation -export const addAttachmentsOperationConfig: ToolOperationConfig = - { - toolType: ToolType.singleFile, - buildFormData, - operationType: "addAttachments", - endpoint: "/api/v1/misc/add-attachments", - }; +export const addAttachmentsOperationConfig = defineSingleFileTool({ + buildFormData, + toApiParams: addAttachmentsToApiParams, + fromApiParams: addAttachmentsFromApiParams, + operationType: "addAttachments", + endpoint: ENDPOINT, + defaultParameters: DEFAULT_ADD_ATTACHMENTS_PARAMETERS, +}); export const useAddAttachmentsOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/addPassword/useAddPasswordOperation.test.ts b/frontend/editor/src/core/hooks/tools/addPassword/useAddPasswordOperation.test.ts index 3045c69450..77958629b0 100644 --- a/frontend/editor/src/core/hooks/tools/addPassword/useAddPasswordOperation.test.ts +++ b/frontend/editor/src/core/hooks/tools/addPassword/useAddPasswordOperation.test.ts @@ -1,6 +1,10 @@ import { describe, expect, test, vi, beforeEach } from "vitest"; import { renderHook } from "@testing-library/react"; -import { useAddPasswordOperation } from "@app/hooks/tools/addPassword/useAddPasswordOperation"; +import { + addPasswordFromApiParams, + addPasswordToApiParams, + useAddPasswordOperation, +} from "@app/hooks/tools/addPassword/useAddPasswordOperation"; import type { AddPasswordFullParameters } from "@app/hooks/tools/addPassword/useAddPasswordParameters"; // Mock the useToolOperation hook @@ -141,3 +145,48 @@ describe("useAddPasswordOperation", () => { expect(callArgs[property]).toBe(expectedValue); }); }); + +describe("addPassword mappers", () => { + test("round-trips backend params, including the flattened permissions", () => { + // Baseline differs from the configured values so the round trip fails if + // fromApiParams drops a field instead of reconstructing it. + const baseline: AddPasswordFullParameters = { + password: "", + ownerPassword: "", + keyLength: 40, + permissions: { + preventAssembly: false, + preventExtractContent: false, + preventExtractForAccessibility: false, + preventFillInForm: false, + preventModify: false, + preventModifyAnnotations: false, + preventPrinting: false, + preventPrintingFaithful: false, + }, + }; + const configured: AddPasswordFullParameters = { + password: "user-pw", + ownerPassword: "owner-pw", + keyLength: 128, + permissions: { + preventAssembly: true, + preventExtractContent: false, + preventExtractForAccessibility: true, + preventFillInForm: false, + preventModify: true, + preventModifyAnnotations: false, + preventPrinting: true, + preventPrintingFaithful: false, + }, + }; + + const api = addPasswordToApiParams(configured); + const roundTripped = addPasswordToApiParams({ + ...baseline, + ...addPasswordFromApiParams(api), + }); + + expect(roundTripped).toEqual(api); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/addPassword/useAddPasswordOperation.ts b/frontend/editor/src/core/hooks/tools/addPassword/useAddPasswordOperation.ts index c09a740250..f6eca6ffbd 100644 --- a/frontend/editor/src/core/hooks/tools/addPassword/useAddPasswordOperation.ts +++ b/frontend/editor/src/core/hooks/tools/addPassword/useAddPasswordOperation.ts @@ -1,31 +1,82 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { AddPasswordFullParameters, defaultParameters, } from "@app/hooks/tools/addPassword/useAddPasswordParameters"; import { defaultParameters as permissionsDefaults } from "@app/hooks/tools/changePermissions/useChangePermissionsParameters"; -import { getFormData } from "@app/hooks/tools/changePermissions/useChangePermissionsOperation"; + +const ENDPOINT = "/api/v1/security/add-password" satisfies ToolEndpoint; +type AddPasswordApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the add-password request body. The +// permissions sub-object is flattened into the request's prevent* fields. +export const addPasswordToApiParams = ( + parameters: AddPasswordFullParameters, +): AddPasswordApiParams => ({ + password: parameters.password, + ownerPassword: parameters.ownerPassword, + // The UI stores keyLength as a number; narrow it to the model's allowed sizes. + keyLength: parameters.keyLength as AddPasswordApiParams["keyLength"], + preventAssembly: parameters.permissions.preventAssembly ?? false, + preventExtractContent: parameters.permissions.preventExtractContent ?? false, + preventExtractForAccessibility: + parameters.permissions.preventExtractForAccessibility ?? false, + preventFillInForm: parameters.permissions.preventFillInForm ?? false, + preventModify: parameters.permissions.preventModify ?? false, + preventModifyAnnotations: + parameters.permissions.preventModifyAnnotations ?? false, + preventPrinting: parameters.permissions.preventPrinting ?? false, + preventPrintingFaithful: + parameters.permissions.preventPrintingFaithful ?? false, +}); + +// Reconstruct the tool's UI parameters from an add-password request body, so a +// stored or AI-authored step can be re-rendered in the settings UI. +export const addPasswordFromApiParams = ( + apiParams: AddPasswordApiParams, +): Partial => ({ + password: apiParams.password ?? defaultParameters.password, + ownerPassword: apiParams.ownerPassword ?? defaultParameters.ownerPassword, + keyLength: apiParams.keyLength, + permissions: { + preventAssembly: + apiParams.preventAssembly ?? permissionsDefaults.preventAssembly, + preventExtractContent: + apiParams.preventExtractContent ?? + permissionsDefaults.preventExtractContent, + preventExtractForAccessibility: + apiParams.preventExtractForAccessibility ?? + permissionsDefaults.preventExtractForAccessibility, + preventFillInForm: + apiParams.preventFillInForm ?? permissionsDefaults.preventFillInForm, + preventModify: apiParams.preventModify ?? permissionsDefaults.preventModify, + preventModifyAnnotations: + apiParams.preventModifyAnnotations ?? + permissionsDefaults.preventModifyAnnotations, + preventPrinting: + apiParams.preventPrinting ?? permissionsDefaults.preventPrinting, + preventPrintingFaithful: + apiParams.preventPrintingFaithful ?? + permissionsDefaults.preventPrintingFaithful, + }, +}); // Static function that can be used by both the hook and automation executor export const buildAddPasswordFormData = ( parameters: AddPasswordFullParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("password", parameters.password); - formData.append("ownerPassword", parameters.ownerPassword); - formData.append("keyLength", parameters.keyLength.toString()); - getFormData(parameters.permissions).forEach(([key, value]) => { - formData.append(key, value); - }); - return formData; -}; +): FormData => + objectToFormData(addPasswordToApiParams(parameters), { fileInput: file }); // Full default parameters including permissions for automation const fullDefaultParameters: AddPasswordFullParameters = { @@ -34,13 +85,14 @@ const fullDefaultParameters: AddPasswordFullParameters = { }; // Static configuration object -export const addPasswordOperationConfig = { - toolType: ToolType.singleFile, +export const addPasswordOperationConfig = defineSingleFileTool({ buildFormData: buildAddPasswordFormData, + toApiParams: addPasswordToApiParams, + fromApiParams: addPasswordFromApiParams, operationType: "addPassword", - endpoint: "/api/v1/security/add-password", + endpoint: ENDPOINT, defaultParameters: fullDefaultParameters, -} as const; +}); export const useAddPasswordOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.test.ts b/frontend/editor/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.test.ts new file mode 100644 index 0000000000..e00753e41c --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.test.ts @@ -0,0 +1,26 @@ +import { describe, expect, test } from "vitest"; +import { + addWatermarkFromApiParams, + addWatermarkToApiParams, +} from "@app/hooks/tools/addWatermark/useAddWatermarkOperation"; +import { + AddWatermarkParameters, + defaultParameters, +} from "@app/hooks/tools/addWatermark/useAddWatermarkParameters"; + +describe("addWatermark mappers", () => { + // opacity 33 exercises the percentage <-> fraction conversion (/100, *100), + // which must survive the round trip without drifting on floating point. + test.each>([ + { watermarkType: "text", watermarkText: "DRAFT", opacity: 33 }, + { watermarkType: "image", opacity: 33 }, + ])("round-trips backend params for %o", (overrides) => { + const api = addWatermarkToApiParams({ ...defaultParameters, ...overrides }); + const roundTripped = addWatermarkToApiParams({ + ...defaultParameters, + ...addWatermarkFromApiParams(api), + }); + + expect(roundTripped).toEqual(api); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.ts b/frontend/editor/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.ts index 19700f43e7..423110a2d2 100644 --- a/frontend/editor/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.ts +++ b/frontend/editor/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.ts @@ -1,61 +1,100 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { AddWatermarkParameters, defaultParameters, } from "@app/hooks/tools/addWatermark/useAddWatermarkParameters"; +const ENDPOINT = "/api/v1/security/add-watermark" satisfies ToolEndpoint; +type AddWatermarkApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the add-watermark request body. The +// watermark image itself is a File and is passed via the `files` argument. +export const addWatermarkToApiParams = ( + parameters: AddWatermarkParameters, +): AddWatermarkApiParams => { + const watermarkType = parameters.watermarkType || "text"; + const apiParams: AddWatermarkApiParams = { + watermarkType, + fontSize: parameters.fontSize, + rotation: parameters.rotation, + // The UI stores opacity as a 0-100 percentage; the backend expects 0.0-1.0. + opacity: parameters.opacity / 100, + widthSpacer: parameters.widthSpacer, + heightSpacer: parameters.heightSpacer, + // The UI types alphabet as a free string; the wire always sends it (empty + // string when unset) so the value is passed through and cast to the model + // enum to preserve existing behaviour. + alphabet: (parameters.alphabet || "") as AddWatermarkApiParams["alphabet"], + customColor: parameters.customColor || "", + convertPDFToImage: parameters.convertPDFToImage ?? false, + }; + + if (watermarkType === "text") { + apiParams.watermarkText = parameters.watermarkText; + } + + return apiParams; +}; + +// Reconstruct the tool's UI parameters from an add-watermark request body, so a +// stored or AI-authored step can be re-rendered in the settings UI. The +// watermark image File cannot be recovered from the request model. +export const addWatermarkFromApiParams = ( + apiParams: AddWatermarkApiParams, +): Partial => { + const result: Partial = { + watermarkType: apiParams.watermarkType, + fontSize: apiParams.fontSize, + rotation: apiParams.rotation, + widthSpacer: apiParams.widthSpacer, + heightSpacer: apiParams.heightSpacer, + alphabet: apiParams.alphabet ?? defaultParameters.alphabet, + customColor: apiParams.customColor ?? defaultParameters.customColor, + convertPDFToImage: + apiParams.convertPDFToImage ?? defaultParameters.convertPDFToImage, + }; + + if (apiParams.opacity !== undefined) { + result.opacity = apiParams.opacity * 100; + } + if (apiParams.watermarkText !== undefined) { + result.watermarkText = apiParams.watermarkText; + } + + return result; +}; + // Static function that can be used by both the hook and automation executor export const buildAddWatermarkFormData = ( parameters: AddWatermarkParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - - // Required: watermarkType as string - formData.append("watermarkType", parameters.watermarkType || "text"); - - // Add watermark content based on type - if (parameters.watermarkType === "text") { - formData.append("watermarkText", parameters.watermarkText); - } else if ( - parameters.watermarkType === "image" && - parameters.watermarkImage - ) { - formData.append("watermarkImage", parameters.watermarkImage); - } - - // Required parameters with correct formatting (defaults merged in automationExecutor) - formData.append("fontSize", parameters.fontSize.toString()); - formData.append("rotation", parameters.rotation.toString()); - formData.append("opacity", (parameters.opacity / 100).toString()); // Convert percentage to decimal - formData.append("widthSpacer", parameters.widthSpacer.toString()); - formData.append("heightSpacer", parameters.heightSpacer.toString()); - - // Backend-expected parameters from user input - formData.append("alphabet", parameters.alphabet || ""); - formData.append("customColor", parameters.customColor || ""); - formData.append( - "convertPDFToImage", - (parameters.convertPDFToImage ?? false).toString(), +): FormData => + objectToFormData( + addWatermarkToApiParams(parameters), + parameters.watermarkType === "image" && parameters.watermarkImage + ? { fileInput: file, watermarkImage: parameters.watermarkImage } + : { fileInput: file }, ); - return formData; -}; - // Static configuration object -export const addWatermarkOperationConfig = { - toolType: ToolType.singleFile, +export const addWatermarkOperationConfig = defineSingleFileTool({ buildFormData: buildAddWatermarkFormData, + toApiParams: addWatermarkToApiParams, + fromApiParams: addWatermarkFromApiParams, operationType: "watermark", - endpoint: "/api/v1/security/add-watermark", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useAddWatermarkOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/adjustContrast/useAdjustContrastOperation.ts b/frontend/editor/src/core/hooks/tools/adjustContrast/useAdjustContrastOperation.ts index 4a26de244d..18981b58d0 100644 --- a/frontend/editor/src/core/hooks/tools/adjustContrast/useAdjustContrastOperation.ts +++ b/frontend/editor/src/core/hooks/tools/adjustContrast/useAdjustContrastOperation.ts @@ -1,6 +1,6 @@ import { useTranslation } from "react-i18next"; import { - ToolType, + defineCustomTool, useToolOperation, CustomProcessorResult, } from "@app/hooks/tools/shared/useToolOperation"; @@ -195,14 +195,11 @@ async function processPdfClientSide( }; } -export const adjustContrastOperationConfig = { - toolType: ToolType.custom, +export const adjustContrastOperationConfig = defineCustomTool({ customProcessor: processPdfClientSide, operationType: "adjustContrast", defaultParameters, - settingsComponentPath: - "components/tools/adjustContrast/AdjustContrastSingleStepSettings", -} as const; +}); export const useAdjustContrastOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/adjustPageScale/adjustPageScaleFormData.ts b/frontend/editor/src/core/hooks/tools/adjustPageScale/adjustPageScaleFormData.ts index 95ee6f3293..e278097508 100644 --- a/frontend/editor/src/core/hooks/tools/adjustPageScale/adjustPageScaleFormData.ts +++ b/frontend/editor/src/core/hooks/tools/adjustPageScale/adjustPageScaleFormData.ts @@ -1,13 +1,38 @@ -import { AdjustPageScaleParameters } from "@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters"; +import { + AdjustPageScaleParameters, + PageSize, +} from "@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; + +export const ADJUST_PAGE_SCALE_ENDPOINT = + "/api/v1/general/scale-pages" satisfies ToolEndpoint; +type AdjustPageScaleApiParams = + ToolApiParams[typeof ADJUST_PAGE_SCALE_ENDPOINT]; + +export const adjustPageScaleToApiParams = ( + parameters: AdjustPageScaleParameters, +): AdjustPageScaleApiParams => ({ + scaleFactor: parameters.scaleFactor, + pageSize: parameters.pageSize, + orientation: parameters.orientation, +}); + +export const adjustPageScaleFromApiParams = ( + apiParams: AdjustPageScaleApiParams, +): Partial => ({ + scaleFactor: apiParams.scaleFactor, + pageSize: apiParams.pageSize as PageSize, + orientation: apiParams.orientation, +}); export const buildAdjustPageScaleFormData = ( parameters: AdjustPageScaleParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("scaleFactor", parameters.scaleFactor.toString()); - formData.append("pageSize", parameters.pageSize); - formData.append("orientation", parameters.orientation); - return formData; -}; +): FormData => + objectToFormData(adjustPageScaleToApiParams(parameters), { + fileInput: file, + }); diff --git a/frontend/editor/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.test.ts b/frontend/editor/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.test.ts index 264c71c940..7453ecfb3e 100644 --- a/frontend/editor/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.test.ts +++ b/frontend/editor/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.test.ts @@ -1,5 +1,9 @@ -import { describe, expect, it } from "vitest"; -import { buildAdjustPageScaleFormData } from "@app/hooks/tools/adjustPageScale/adjustPageScaleFormData"; +import { describe, expect, it, test } from "vitest"; +import { + adjustPageScaleFromApiParams, + adjustPageScaleToApiParams, + buildAdjustPageScaleFormData, +} from "@app/hooks/tools/adjustPageScale/adjustPageScaleFormData"; import { defaultParameters, PageSize, @@ -49,3 +53,20 @@ describe("buildAdjustPageScaleFormData", () => { expect(formData.get("fileInput")).toBe(file); }); }); + +describe("adjustPageScale mappers", () => { + test("round-trips backend params", () => { + const api = adjustPageScaleToApiParams({ + ...defaultParameters, + scaleFactor: 1.5, + pageSize: PageSize.A4, + orientation: "LANDSCAPE", + }); + const roundTripped = adjustPageScaleToApiParams({ + ...defaultParameters, + ...adjustPageScaleFromApiParams(api), + }); + + expect(roundTripped).toEqual(api); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.ts b/frontend/editor/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.ts index c710737722..db0ce22da2 100644 --- a/frontend/editor/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.ts +++ b/frontend/editor/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.ts @@ -1,24 +1,34 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { AdjustPageScaleParameters, defaultParameters, } from "@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters"; -import { buildAdjustPageScaleFormData } from "@app/hooks/tools/adjustPageScale/adjustPageScaleFormData"; +import { + buildAdjustPageScaleFormData, + adjustPageScaleToApiParams, + adjustPageScaleFromApiParams, + ADJUST_PAGE_SCALE_ENDPOINT, +} from "@app/hooks/tools/adjustPageScale/adjustPageScaleFormData"; -export { buildAdjustPageScaleFormData }; +export { + buildAdjustPageScaleFormData, + adjustPageScaleToApiParams, + adjustPageScaleFromApiParams, +}; -export const adjustPageScaleOperationConfig = { - toolType: ToolType.singleFile, +export const adjustPageScaleOperationConfig = defineSingleFileTool({ buildFormData: buildAdjustPageScaleFormData, + toApiParams: adjustPageScaleToApiParams, + fromApiParams: adjustPageScaleFromApiParams, operationType: "scalePages", - endpoint: "/api/v1/general/scale-pages", + endpoint: ADJUST_PAGE_SCALE_ENDPOINT, defaultParameters, -} as const; +}); export const useAdjustPageScaleOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/autoRename/useAutoRenameOperation.ts b/frontend/editor/src/core/hooks/tools/autoRename/useAutoRenameOperation.ts index 26c900df66..15466998e5 100644 --- a/frontend/editor/src/core/hooks/tools/autoRename/useAutoRenameOperation.ts +++ b/frontend/editor/src/core/hooks/tools/autoRename/useAutoRenameOperation.ts @@ -1,45 +1,58 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { AutoRenameParameters, defaultParameters, } from "@app/hooks/tools/autoRename/useAutoRenameParameters"; -export const getFormData = (parameters: AutoRenameParameters) => - Object.entries(parameters).map(([key, value]) => [ - key, - value.toString(), - ]) as string[][]; +const ENDPOINT = "/api/v1/misc/auto-rename" satisfies ToolEndpoint; +type AutoRenameApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the auto-rename request body. The return +// type is the generated backend model, so a spec change that renames or drops a +// field breaks the build here. +export const autoRenameToApiParams = ( + parameters: AutoRenameParameters, +): AutoRenameApiParams => ({ + useFirstTextAsFallback: parameters.useFirstTextAsFallback, +}); + +// Reconstruct the tool's UI parameters from an auto-rename request body, so a +// stored or AI-authored step can be re-rendered in the settings UI. +export const autoRenameFromApiParams = ( + apiParams: AutoRenameApiParams, +): Partial => ({ + useFirstTextAsFallback: + apiParams.useFirstTextAsFallback ?? + defaultParameters.useFirstTextAsFallback, +}); // Static function that can be used by both the hook and automation executor export const buildAutoRenameFormData = ( parameters: AutoRenameParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - - // Add all permission parameters - getFormData(parameters).forEach(([key, value]) => { - formData.append(key, value); - }); - - return formData; -}; +): FormData => + objectToFormData(autoRenameToApiParams(parameters), { fileInput: file }); // Static configuration object -export const autoRenameOperationConfig = { - toolType: ToolType.singleFile, +export const autoRenameOperationConfig = defineSingleFileTool({ buildFormData: buildAutoRenameFormData, + toApiParams: autoRenameToApiParams, + fromApiParams: autoRenameFromApiParams, operationType: "autoRename", - endpoint: "/api/v1/misc/auto-rename", + endpoint: ENDPOINT, preserveBackendFilename: true, // Use filename from backend response headers defaultParameters, -} as const; +}); export const useAutoRenameOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/automate/useAutomateOperation.ts b/frontend/editor/src/core/hooks/tools/automate/useAutomateOperation.ts index 2ef3d33d96..d1d6436fa9 100644 --- a/frontend/editor/src/core/hooks/tools/automate/useAutomateOperation.ts +++ b/frontend/editor/src/core/hooks/tools/automate/useAutomateOperation.ts @@ -1,5 +1,5 @@ import { - ToolType, + defineCustomTool, useToolOperation, } from "@app/hooks/tools/shared/useToolOperation"; import { useCallback } from "react"; @@ -55,10 +55,11 @@ export function useAutomateOperation() { [toolRegistry], ); - return useToolOperation({ - toolType: ToolType.custom, - operationType: "automate", - customProcessor, - consumesAllInputs: true, - }); + return useToolOperation( + defineCustomTool({ + operationType: "automate", + customProcessor, + consumesAllInputs: true, + }), + ); } diff --git a/frontend/editor/src/core/hooks/tools/bookletImposition/useBookletImpositionOperation.ts b/frontend/editor/src/core/hooks/tools/bookletImposition/useBookletImpositionOperation.ts index 6da2b66320..7add5d126c 100644 --- a/frontend/editor/src/core/hooks/tools/bookletImposition/useBookletImpositionOperation.ts +++ b/frontend/editor/src/core/hooks/tools/bookletImposition/useBookletImpositionOperation.ts @@ -1,40 +1,72 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { BookletImpositionParameters, defaultParameters, } from "@app/hooks/tools/bookletImposition/useBookletImpositionParameters"; +const ENDPOINT = "/api/v1/general/booklet-imposition" satisfies ToolEndpoint; +type BookletImpositionApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the booklet-imposition request body. The +// return type is the generated backend model, so a spec change that renames or +// drops a field breaks the build here. +export const bookletImpositionToApiParams = ( + parameters: BookletImpositionParameters, +): BookletImpositionApiParams => ({ + pagesPerSheet: parameters.pagesPerSheet, + addBorder: parameters.addBorder, + spineLocation: parameters.spineLocation, + addGutter: parameters.addGutter, + gutterSize: parameters.gutterSize, + doubleSided: parameters.doubleSided, + duplexPass: parameters.duplexPass, + flipOnShortEdge: parameters.flipOnShortEdge, +}); + +// Reconstruct the tool's UI parameters from a booklet-imposition request body, +// so a stored or AI-authored step can be re-rendered in the settings UI. +export const bookletImpositionFromApiParams = ( + apiParams: BookletImpositionApiParams, +): Partial => ({ + pagesPerSheet: apiParams.pagesPerSheet ?? defaultParameters.pagesPerSheet, + addBorder: apiParams.addBorder ?? defaultParameters.addBorder, + spineLocation: apiParams.spineLocation ?? defaultParameters.spineLocation, + addGutter: apiParams.addGutter ?? defaultParameters.addGutter, + gutterSize: apiParams.gutterSize ?? defaultParameters.gutterSize, + doubleSided: apiParams.doubleSided ?? defaultParameters.doubleSided, + duplexPass: apiParams.duplexPass ?? defaultParameters.duplexPass, + flipOnShortEdge: + apiParams.flipOnShortEdge ?? defaultParameters.flipOnShortEdge, +}); + // Static configuration that can be used by both the hook and automation executor export const buildBookletImpositionFormData = ( parameters: BookletImpositionParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("pagesPerSheet", parameters.pagesPerSheet.toString()); - formData.append("addBorder", parameters.addBorder.toString()); - formData.append("spineLocation", parameters.spineLocation); - formData.append("addGutter", parameters.addGutter.toString()); - formData.append("gutterSize", parameters.gutterSize.toString()); - formData.append("doubleSided", parameters.doubleSided.toString()); - formData.append("duplexPass", parameters.duplexPass); - formData.append("flipOnShortEdge", parameters.flipOnShortEdge.toString()); - return formData; -}; +): FormData => + objectToFormData(bookletImpositionToApiParams(parameters), { + fileInput: file, + }); // Static configuration object -export const bookletImpositionOperationConfig = { - toolType: ToolType.singleFile, +export const bookletImpositionOperationConfig = defineSingleFileTool({ buildFormData: buildBookletImpositionFormData, + toApiParams: bookletImpositionToApiParams, + fromApiParams: bookletImpositionFromApiParams, operationType: "bookletImposition", - endpoint: "/api/v1/general/booklet-imposition", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useBookletImpositionOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/certSign/useCertSignOperation.ts b/frontend/editor/src/core/hooks/tools/certSign/useCertSignOperation.ts index 8488dec77a..01cfa32b1a 100644 --- a/frontend/editor/src/core/hooks/tools/certSign/useCertSignOperation.ts +++ b/frontend/editor/src/core/hooks/tools/certSign/useCertSignOperation.ts @@ -1,91 +1,149 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type FormDataFiles, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { CertSignParameters, defaultParameters, } from "@app/hooks/tools/certSign/useCertSignParameters"; +const ENDPOINT = "/api/v1/security/cert-sign" satisfies ToolEndpoint; +type CertSignApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the cert-sign request body. The keystore +// uploads (privateKeyFile, certFile, p12File, jksFile) are actual File uploads +// and are appended separately (see buildCertSignFormData); only the scalar +// fields are serialized here. +export const certSignToApiParams = ( + parameters: CertSignParameters, +): CertSignApiParams => { + // AUTO mode signs with the server certificate; no keystore/password is sent. + if (parameters.signMode === "AUTO") { + return withSignatureAppearance({ certType: "SERVER" }, parameters); + } + + const apiParams: CertSignApiParams = { + certType: parameters.certType as CertSignApiParams["certType"], + password: parameters.password, + }; + + // Non-file identifiers depend on the chosen certificate type. + switch (parameters.certType) { + case "WINDOWS_STORE": + if (parameters.alias) apiParams.alias = parameters.alias; + break; + case "PKCS11": + if (parameters.pkcs11LibraryPath) { + apiParams.pkcs11LibraryPath = parameters.pkcs11LibraryPath; + } + if (parameters.pkcs11Slot != null) { + apiParams.pkcs11Slot = parameters.pkcs11Slot; + } + if (parameters.alias) apiParams.alias = parameters.alias; + break; + } + + return withSignatureAppearance(apiParams, parameters); +}; + +// Signature appearance fields are only sent when the visible signature is +// enabled, matching the original form behaviour. +const withSignatureAppearance = ( + apiParams: CertSignApiParams, + parameters: CertSignParameters, +): CertSignApiParams => { + if (parameters.showSignature) { + apiParams.showSignature = true; + apiParams.reason = parameters.reason; + apiParams.location = parameters.location; + apiParams.name = parameters.name; + apiParams.pageNumber = parameters.pageNumber; + apiParams.showLogo = parameters.showLogo; + } + return apiParams; +}; + +// Select the keystore File uploads for the chosen certificate type. AUTO mode +// (server certificate) uploads no keystore. +const certSignFiles = (parameters: CertSignParameters): FormDataFiles => { + if (parameters.signMode === "AUTO") return {}; + + switch (parameters.certType) { + case "PEM": + return { + privateKeyFile: parameters.privateKeyFile, + certFile: parameters.certFile, + }; + case "PKCS12": + case "PFX": + return { p12File: parameters.p12File }; + case "JKS": + return { jksFile: parameters.jksFile }; + default: + return {}; + } +}; + +// Reconstruct the tool's UI parameters from a cert-sign request body, so a stored +// or AI-authored step can be re-rendered in the settings UI. Uploaded keystore +// files cannot be recovered from the request model. +export const certSignFromApiParams = ( + apiParams: CertSignApiParams, +): Partial => { + const result: Partial = { + signMode: apiParams.certType === "SERVER" ? "AUTO" : "MANUAL", + showSignature: apiParams.showSignature ?? defaultParameters.showSignature, + }; + + if (apiParams.certType !== "SERVER") { + result.certType = apiParams.certType; + result.password = apiParams.password ?? defaultParameters.password; + } + if (apiParams.alias !== undefined) result.alias = apiParams.alias; + if (apiParams.pkcs11LibraryPath !== undefined) { + result.pkcs11LibraryPath = apiParams.pkcs11LibraryPath; + } + if (apiParams.pkcs11Slot !== undefined) { + result.pkcs11Slot = apiParams.pkcs11Slot; + } + if (apiParams.reason !== undefined) result.reason = apiParams.reason; + if (apiParams.location !== undefined) result.location = apiParams.location; + if (apiParams.name !== undefined) result.name = apiParams.name; + if (apiParams.pageNumber !== undefined) { + result.pageNumber = apiParams.pageNumber; + } + if (apiParams.showLogo !== undefined) result.showLogo = apiParams.showLogo; + + return result; +}; + // Build form data for signing export const buildCertSignFormData = ( parameters: CertSignParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - - // Handle sign mode - if (parameters.signMode === "AUTO") { - formData.append("certType", "SERVER"); - } else { - formData.append("certType", parameters.certType); - formData.append("password", parameters.password); - - // Add certificate files based on type (only for manual mode) - switch (parameters.certType) { - case "PEM": - if (parameters.privateKeyFile) { - formData.append("privateKeyFile", parameters.privateKeyFile); - } - if (parameters.certFile) { - formData.append("certFile", parameters.certFile); - } - break; - case "PKCS12": - case "PFX": - if (parameters.p12File) { - formData.append("p12File", parameters.p12File); - } - break; - case "JKS": - if (parameters.jksFile) { - formData.append("jksFile", parameters.jksFile); - } - break; - case "WINDOWS_STORE": - if (parameters.alias) { - formData.append("alias", parameters.alias); - } - break; - case "PKCS11": - if (parameters.pkcs11LibraryPath) { - formData.append("pkcs11LibraryPath", parameters.pkcs11LibraryPath); - } - if (parameters.pkcs11Slot != null) { - formData.append("pkcs11Slot", parameters.pkcs11Slot.toString()); - } - if (parameters.alias) { - formData.append("alias", parameters.alias); - } - break; - } - } - - // Add signature appearance options if enabled - if (parameters.showSignature) { - formData.append("showSignature", "true"); - formData.append("reason", parameters.reason); - formData.append("location", parameters.location); - formData.append("name", parameters.name); - formData.append("pageNumber", parameters.pageNumber.toString()); - formData.append("showLogo", parameters.showLogo.toString()); - } - - return formData; -}; +): FormData => + objectToFormData(certSignToApiParams(parameters), { + fileInput: file, + ...certSignFiles(parameters), + }); // Static configuration object -export const certSignOperationConfig = { - toolType: ToolType.singleFile, +export const certSignOperationConfig = defineSingleFileTool({ buildFormData: buildCertSignFormData, + toApiParams: certSignToApiParams, + fromApiParams: certSignFromApiParams, operationType: "certSign", - endpoint: "/api/v1/security/cert-sign", - multiFileEndpoint: false, + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useCertSignOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.test.ts b/frontend/editor/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.test.ts index 6444f5f05d..0a3bf0e78a 100644 --- a/frontend/editor/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.test.ts +++ b/frontend/editor/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.test.ts @@ -1,5 +1,12 @@ -import { buildChangeMetadataFormData } from "@app/hooks/tools/changeMetadata/useChangeMetadataOperation"; -import { ChangeMetadataParameters } from "@app/hooks/tools/changeMetadata/useChangeMetadataParameters"; +import { + buildChangeMetadataFormData, + changeMetadataToApiParams, + changeMetadataFromApiParams, +} from "@app/hooks/tools/changeMetadata/useChangeMetadataOperation"; +import { + ChangeMetadataParameters, + defaultParameters, +} from "@app/hooks/tools/changeMetadata/useChangeMetadataParameters"; import { TrappedStatus } from "@app/types/metadata"; import { describe, expect, test } from "vitest"; @@ -142,3 +149,78 @@ describe("buildChangeMetadataFormData", () => { expect(formData.get("allRequestParams[customValue1]")).toBe("Engineering"); }); }); + +describe("changeMetadata mappers", () => { + const fullApi: Parameters[0] = { + title: "Title", + author: "Author", + subject: "Subject", + keywords: "a, b", + creator: "Creator", + producer: "Producer", + creationDate: "2024/01/15 10:30:00", + modificationDate: "2024/02/20 14:05:09", + trapped: "True", + deleteAll: false, + allRequestParams: { + customKey1: "Department", + customValue1: "Engineering", + customKey2: "Project", + customValue2: "Falcon", + }, + }; + + test("round-trips a full request through fromApiParams and back", () => { + const roundTripped = changeMetadataToApiParams({ + ...defaultParameters, + ...changeMetadataFromApiParams(fullApi), + }); + + expect(roundTripped).toEqual(fullApi); + }); + + test("reconstructs dates in local time and clears absent ones", () => { + const params = changeMetadataFromApiParams(fullApi); + expect(params.creationDate).toEqual(new Date(2024, 0, 15, 10, 30, 0)); + expect(params.modificationDate).toEqual(new Date(2024, 1, 20, 14, 5, 9)); + + const cleared = changeMetadataFromApiParams({ + creationDate: "", + modificationDate: undefined, + }); + expect(cleared.creationDate).toBeNull(); + expect(cleared.modificationDate).toBeNull(); + }); + + test.each([TrappedStatus.TRUE, TrappedStatus.FALSE, TrappedStatus.UNKNOWN])( + "round-trips trapped=%s", + (trapped) => { + const api = changeMetadataToApiParams({ ...defaultParameters, trapped }); + expect(api.trapped).toBe(trapped); + expect(changeMetadataFromApiParams(api).trapped).toBe(trapped); + }, + ); + + test("falls back to the default for an unrecognised trapped value", () => { + const params = changeMetadataFromApiParams({ + trapped: "Bogus", + } as unknown as Parameters[0]); + expect(params.trapped).toBe(defaultParameters.trapped); + }); + + test("reconstructs custom metadata, tolerating non-contiguous indices", () => { + const params = changeMetadataFromApiParams({ + allRequestParams: { + customKey1: "Department", + customValue1: "Engineering", + customKey3: "Project", + customValue3: "Falcon", + }, + }); + + expect(params.customMetadata).toEqual([ + { key: "Department", value: "Engineering", id: "custom1" }, + { key: "Project", value: "Falcon", id: "custom3" }, + ]); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.ts b/frontend/editor/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.ts index 045b029522..97a8285194 100644 --- a/frontend/editor/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.ts +++ b/frontend/editor/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.ts @@ -1,15 +1,24 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; +import { TrappedStatus, CustomMetadataEntry } from "@app/types/metadata"; import { ChangeMetadataParameters, defaultParameters, } from "@app/hooks/tools/changeMetadata/useChangeMetadataParameters"; -// Helper function to format Date object to string +const ENDPOINT = "/api/v1/misc/update-metadata" satisfies ToolEndpoint; +type ChangeMetadataApiParams = ToolApiParams[typeof ENDPOINT]; + +// Backend date format (yyyy/MM/dd HH:mm:ss), in local time to mirror the parser. const formatDateForBackend = (date: Date | null): string => { if (!date) return ""; const year = date.getFullYear(); @@ -21,67 +30,137 @@ const formatDateForBackend = (date: Date | null): string => { return `${year}/${month}/${day} ${hours}:${minutes}:${seconds}`; }; +// Inverse of formatDateForBackend; returns null for empty or unparseable input. +const parseDateFromBackend = (value: string | undefined): Date | null => { + if (!value) return null; + const match = /^(\d{4})\/(\d{2})\/(\d{2}) (\d{2}):(\d{2}):(\d{2})$/.exec( + value, + ); + if (!match) return null; + const [, year, month, day, hours, minutes, seconds] = match; + return new Date( + Number(year), + Number(month) - 1, + Number(day), + Number(hours), + Number(minutes), + Number(seconds), + ); +}; + +// Custom metadata is carried in the request's allRequestParams map as paired +// customKey/customValue entries; the backend rejoins them by the shared +// index N (see MetadataController). Only entries with a non-blank key and value +// are sent, and they are re-numbered from 1 so the indices stay contiguous. +const buildCustomMetadataMap = ( + customMetadata: CustomMetadataEntry[], +): Record | undefined => { + const validEntries = customMetadata.filter( + (entry) => entry.key.trim() && entry.value.trim(), + ); + if (validEntries.length === 0) return undefined; + + const map: Record = {}; + validEntries.forEach((entry, index) => { + const n = index + 1; + map[`customKey${n}`] = entry.key.trim(); + map[`customValue${n}`] = entry.value.trim(); + }); + return map; +}; + +// Rebuild the UI's custom metadata list from the allRequestParams map by pairing +// customKey/customValue on their shared index N. Mirrors the backend +// (MetadataController), which pairs by index across all entries and does not +// assume the indices are contiguous, so a non-contiguous stored map round-trips. +const parseCustomMetadataMap = ( + allRequestParams: ChangeMetadataApiParams["allRequestParams"], +): CustomMetadataEntry[] => { + if (!allRequestParams) return []; + return Object.keys(allRequestParams) + .map((key) => /^customKey(\d+)$/.exec(key)?.[1]) + .filter((n): n is string => n !== undefined) + .map(Number) + .sort((a, b) => a - b) + .map((n) => ({ + key: allRequestParams[`customKey${n}`] ?? "", + value: allRequestParams[`customValue${n}`] ?? "", + id: `custom${n}`, + })); +}; + +// Map the backend's trapped string onto the UI enum, validating against the +// actual enum values so an unrecognised value falls back to the default instead +// of being force-cast. +const parseTrapped = (value: string | undefined): TrappedStatus => + Object.values(TrappedStatus).find((status) => status === value) ?? + defaultParameters.trapped; + +// Convert the tool's UI parameters into the update-metadata request body. The +// return type is the generated backend model, so a spec change that renames or +// drops a field breaks the build here. +export const changeMetadataToApiParams = ( + parameters: ChangeMetadataParameters, +): ChangeMetadataApiParams => ({ + title: parameters.title, + author: parameters.author, + subject: parameters.subject, + keywords: parameters.keywords, + creator: parameters.creator, + producer: parameters.producer, + creationDate: formatDateForBackend(parameters.creationDate), + modificationDate: formatDateForBackend(parameters.modificationDate), + trapped: parameters.trapped, + deleteAll: parameters.deleteAll, + allRequestParams: buildCustomMetadataMap(parameters.customMetadata), +}); + +// Reconstruct the tool's UI parameters from an update-metadata request body, so +// a stored or AI-authored step can be re-rendered in the settings UI. +export const changeMetadataFromApiParams = ( + apiParams: ChangeMetadataApiParams, +): Partial => ({ + title: apiParams.title ?? defaultParameters.title, + author: apiParams.author ?? defaultParameters.author, + subject: apiParams.subject ?? defaultParameters.subject, + keywords: apiParams.keywords ?? defaultParameters.keywords, + creator: apiParams.creator ?? defaultParameters.creator, + producer: apiParams.producer ?? defaultParameters.producer, + creationDate: parseDateFromBackend(apiParams.creationDate), + modificationDate: parseDateFromBackend(apiParams.modificationDate), + trapped: parseTrapped(apiParams.trapped), + deleteAll: apiParams.deleteAll ?? defaultParameters.deleteAll, + customMetadata: parseCustomMetadataMap(apiParams.allRequestParams), +}); + // Static function that can be used by both the hook and automation executor export const buildChangeMetadataFormData = ( parameters: ChangeMetadataParameters, file: File, ): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - - // Standard metadata fields - formData.append("title", parameters.title || ""); - formData.append("author", parameters.author || ""); - formData.append("subject", parameters.subject || ""); - formData.append("keywords", parameters.keywords || ""); - formData.append("creator", parameters.creator || ""); - formData.append("producer", parameters.producer || ""); - - // Date fields - convert Date objects to strings - formData.append( - "creationDate", - formatDateForBackend(parameters.creationDate), - ); - formData.append( - "modificationDate", - formatDateForBackend(parameters.modificationDate), - ); - - // Trapped status - formData.append("trapped", parameters.trapped || ""); - - // Delete all metadata flag - formData.append("deleteAll", parameters.deleteAll.toString()); - - // Custom metadata - backend expects them as values to 'allRequestParams[customKeyX/customValueX]' - let keyNumber = 0; - if (parameters.customMetadata && Array.isArray(parameters.customMetadata)) { - parameters.customMetadata.forEach((entry) => { - if (entry.key.trim() && entry.value.trim()) { - keyNumber += 1; - formData.append( - `allRequestParams[customKey${keyNumber}]`, - entry.key.trim(), - ); - formData.append( - `allRequestParams[customValue${keyNumber}]`, - entry.value.trim(), - ); - } - }); + // allRequestParams is a Spring-bound map: objectToFormData only serializes + // primitives, so the scalar fields go through it and the map is flattened into + // allRequestParams[] form fields separately. + const { allRequestParams, ...scalarParams } = + changeMetadataToApiParams(parameters); + const formData = objectToFormData(scalarParams, { fileInput: file }); + for (const [key, value] of Object.entries(allRequestParams ?? {})) { + if (value !== undefined) { + formData.append(`allRequestParams[${key}]`, value); + } } - return formData; }; // Static configuration object -export const changeMetadataOperationConfig = { - toolType: ToolType.singleFile, +export const changeMetadataOperationConfig = defineSingleFileTool({ buildFormData: buildChangeMetadataFormData, + toApiParams: changeMetadataToApiParams, + fromApiParams: changeMetadataFromApiParams, operationType: "changeMetadata", - endpoint: "/api/v1/misc/update-metadata", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useChangeMetadataOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.test.ts b/frontend/editor/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.test.ts index 2be13c3466..bad85097e2 100644 --- a/frontend/editor/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.test.ts +++ b/frontend/editor/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.test.ts @@ -1,7 +1,14 @@ import { describe, expect, test, vi, beforeEach } from "vitest"; import { renderHook } from "@testing-library/react"; -import { useChangePermissionsOperation } from "@app/hooks/tools/changePermissions/useChangePermissionsOperation"; -import type { ChangePermissionsParameters } from "@app/hooks/tools/changePermissions/useChangePermissionsParameters"; +import { + changePermissionsFromApiParams, + changePermissionsToApiParams, + useChangePermissionsOperation, +} from "@app/hooks/tools/changePermissions/useChangePermissionsOperation"; +import { + type ChangePermissionsParameters, + defaultParameters, +} from "@app/hooks/tools/changePermissions/useChangePermissionsParameters"; // Mock the useToolOperation hook vi.mock("../shared/useToolOperation", async () => { @@ -141,3 +148,26 @@ describe("useChangePermissionsOperation", () => { expect(callArgs[property]).toBe(expectedValue); }); }); + +describe("changePermissions mappers", () => { + test("round-trips backend params", () => { + const configured: ChangePermissionsParameters = { + preventAssembly: true, + preventExtractContent: false, + preventExtractForAccessibility: true, + preventFillInForm: false, + preventModify: true, + preventModifyAnnotations: false, + preventPrinting: true, + preventPrintingFaithful: false, + }; + + const api = changePermissionsToApiParams(configured); + const roundTripped = changePermissionsToApiParams({ + ...defaultParameters, + ...changePermissionsFromApiParams(api), + }); + + expect(roundTripped).toEqual(api); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.ts b/frontend/editor/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.ts index 0500d86417..a2e3eb3d1d 100644 --- a/frontend/editor/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.ts +++ b/frontend/editor/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.ts @@ -1,46 +1,84 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { ChangePermissionsParameters, defaultParameters, } from "@app/hooks/tools/changePermissions/useChangePermissionsParameters"; -export const getFormData = (parameters: ChangePermissionsParameters) => { - if (!parameters) return []; - return Object.entries(parameters).map(([key, value]) => [ - key, - (value ?? false).toString(), - ]) as string[][]; -}; +// Change Permissions reuses the Add Password endpoint but sends only the +// prevent* subset of the request model (no password or keyLength). +const ENDPOINT = "/api/v1/security/add-password" satisfies ToolEndpoint; +type AddPasswordApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the add-password request body. Only the +// prevent* permission flags are sent; password and keyLength are optional on the +// model and left unset, so the endpoint changes permissions without encrypting. +export const changePermissionsToApiParams = ( + parameters: ChangePermissionsParameters, +): AddPasswordApiParams => ({ + preventAssembly: parameters.preventAssembly ?? false, + preventExtractContent: parameters.preventExtractContent ?? false, + preventExtractForAccessibility: + parameters.preventExtractForAccessibility ?? false, + preventFillInForm: parameters.preventFillInForm ?? false, + preventModify: parameters.preventModify ?? false, + preventModifyAnnotations: parameters.preventModifyAnnotations ?? false, + preventPrinting: parameters.preventPrinting ?? false, + preventPrintingFaithful: parameters.preventPrintingFaithful ?? false, +}); + +// Reconstruct the tool's UI parameters from an add-password request body, so a +// stored or AI-authored step can be re-rendered in the settings UI. +export const changePermissionsFromApiParams = ( + apiParams: AddPasswordApiParams, +): Partial => ({ + preventAssembly: + apiParams.preventAssembly ?? defaultParameters.preventAssembly, + preventExtractContent: + apiParams.preventExtractContent ?? defaultParameters.preventExtractContent, + preventExtractForAccessibility: + apiParams.preventExtractForAccessibility ?? + defaultParameters.preventExtractForAccessibility, + preventFillInForm: + apiParams.preventFillInForm ?? defaultParameters.preventFillInForm, + preventModify: apiParams.preventModify ?? defaultParameters.preventModify, + preventModifyAnnotations: + apiParams.preventModifyAnnotations ?? + defaultParameters.preventModifyAnnotations, + preventPrinting: + apiParams.preventPrinting ?? defaultParameters.preventPrinting, + preventPrintingFaithful: + apiParams.preventPrintingFaithful ?? + defaultParameters.preventPrintingFaithful, +}); // Static function that can be used by both the hook and automation executor export const buildChangePermissionsFormData = ( parameters: ChangePermissionsParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - - // Add all permission parameters - getFormData(parameters).forEach(([key, value]) => { - formData.append(key, value); +): FormData => + objectToFormData(changePermissionsToApiParams(parameters), { + fileInput: file, }); - return formData; -}; - // Static configuration object -export const changePermissionsOperationConfig = { - toolType: ToolType.singleFile, +export const changePermissionsOperationConfig = defineSingleFileTool({ buildFormData: buildChangePermissionsFormData, + toApiParams: changePermissionsToApiParams, + fromApiParams: changePermissionsFromApiParams, operationType: "changePermissions", - endpoint: "/api/v1/security/add-password", // Change Permissions is a fake endpoint for the Add Password tool + endpoint: ENDPOINT, // Change Permissions is a fake endpoint for the Add Password tool defaultParameters, -} as const; +}); export const useChangePermissionsOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/compress/useCompressOperation.test.ts b/frontend/editor/src/core/hooks/tools/compress/useCompressOperation.test.ts new file mode 100644 index 0000000000..4118eaf7d6 --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/compress/useCompressOperation.test.ts @@ -0,0 +1,127 @@ +import { describe, expect, test } from "vitest"; +import { + buildCompressFormData, + compressFromApiParams, + compressToApiParams, +} from "@app/hooks/tools/compress/useCompressOperation"; +import { + CompressParameters, + defaultParameters, +} from "@app/hooks/tools/compress/useCompressParameters"; + +const params = ( + overrides: Partial, +): CompressParameters => ({ + ...defaultParameters, + ...overrides, +}); + +describe("compressToApiParams", () => { + test("quality mode sends optimizeLevel and no expectedOutputSize", () => { + const api = compressToApiParams( + params({ compressionMethod: "quality", compressionLevel: 7 }), + ); + + expect(api.optimizeLevel).toBe(7); + expect(api.expectedOutputSize).toBeUndefined(); + }); + + test("file-size mode sends expectedOutputSize (level still present for the spec)", () => { + const api = compressToApiParams( + params({ + compressionMethod: "filesize", + fileSizeValue: "100", + fileSizeUnit: "MB", + }), + ); + + // optimizeLevel is required by the backend model; the backend recomputes it + // from the target size, so its presence is harmless. + expect(api.optimizeLevel).toBeDefined(); + expect(api.expectedOutputSize).toBe("100MB"); + }); + + test("omits expectedOutputSize when file-size value is empty", () => { + const api = compressToApiParams( + params({ compressionMethod: "filesize", fileSizeValue: "" }), + ); + + expect(api.expectedOutputSize).toBeUndefined(); + }); + + test("line-art thresholds only included when line art is enabled", () => { + const off = compressToApiParams(params({ lineArt: false })); + expect(off.lineArtThreshold).toBeUndefined(); + expect(off.lineArtEdgeLevel).toBeUndefined(); + + const on = compressToApiParams( + params({ lineArt: true, lineArtThreshold: 40, lineArtEdgeLevel: 2 }), + ); + expect(on.lineArtThreshold).toBe(40); + expect(on.lineArtEdgeLevel).toBe(2); + }); + + test("defaults produce the required optimizeLevel field", () => { + const api = compressToApiParams(defaultParameters); + expect(api.optimizeLevel).toBe(defaultParameters.compressionLevel); + }); +}); + +describe("compressFromApiParams", () => { + test("expectedOutputSize maps back to file-size mode and its value/unit", () => { + const ui = compressFromApiParams({ + optimizeLevel: 5, + expectedOutputSize: "25KB", + }); + + expect(ui.compressionMethod).toBe("filesize"); + expect(ui.fileSizeValue).toBe("25"); + expect(ui.fileSizeUnit).toBe("KB"); + }); + + test("no expectedOutputSize maps back to quality mode", () => { + const ui = compressFromApiParams({ optimizeLevel: 8 }); + + expect(ui.compressionMethod).toBe("quality"); + expect(ui.compressionLevel).toBe(8); + }); +}); + +describe("compress round-trip", () => { + test.each>([ + { compressionMethod: "quality", compressionLevel: 3, grayscale: true }, + { + compressionMethod: "filesize", + fileSizeValue: "10", + fileSizeUnit: "MB", + linearize: true, + }, + { + compressionMethod: "quality", + lineArt: true, + lineArtThreshold: 60, + lineArtEdgeLevel: 3, + }, + ])("toApiParams(fromApiParams(x)) reproduces x %o", (overrides) => { + const api = compressToApiParams(params(overrides)); + const roundTripped = compressToApiParams( + params(compressFromApiParams(api)), + ); + + expect(roundTripped).toEqual(api); + }); +}); + +describe("buildCompressFormData", () => { + test("appends the file and serialized parameters", () => { + const file = new File(["x"], "test.pdf", { type: "application/pdf" }); + const formData = buildCompressFormData( + params({ compressionMethod: "quality", compressionLevel: 6 }), + file, + ); + + expect(formData.get("fileInput")).toBe(file); + expect(formData.get("optimizeLevel")).toBe("6"); + expect(formData.get("grayscale")).toBe("false"); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/compress/useCompressOperation.ts b/frontend/editor/src/core/hooks/tools/compress/useCompressOperation.ts index 6efa24e5d3..b24bb8c6ee 100644 --- a/frontend/editor/src/core/hooks/tools/compress/useCompressOperation.ts +++ b/frontend/editor/src/core/hooks/tools/compress/useCompressOperation.ts @@ -1,52 +1,103 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { CompressParameters, defaultParameters, } from "@app/hooks/tools/compress/useCompressParameters"; +const ENDPOINT = "/api/v1/misc/compress-pdf" satisfies ToolEndpoint; +type CompressApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the compress-pdf request body. The +// return type is the generated backend model, so a spec change that renames or +// drops a field breaks the build here. +export const compressToApiParams = ( + parameters: CompressParameters, +): CompressApiParams => { + const apiParams: CompressApiParams = { + // compressionLevel is validated to 1-9 by the parameters hook. It is always + // sent: in file-size mode the backend recomputes the level from the target + // size (autoMode in CompressController), so this value only takes effect in + // quality mode. + optimizeLevel: + parameters.compressionLevel as CompressApiParams["optimizeLevel"], + grayscale: parameters.grayscale ?? false, + lineArt: parameters.lineArt, + linearize: parameters.linearize, + }; + + if (parameters.compressionMethod === "filesize" && parameters.fileSizeValue) { + apiParams.expectedOutputSize = `${parameters.fileSizeValue}${parameters.fileSizeUnit}`; + } + + if (parameters.lineArt) { + apiParams.lineArtThreshold = parameters.lineArtThreshold; + apiParams.lineArtEdgeLevel = parameters.lineArtEdgeLevel; + } + + return apiParams; +}; + +// Reconstruct the tool's UI parameters from a compress-pdf request body, so a +// stored or AI-authored step can be re-rendered in the settings UI. +export const compressFromApiParams = ( + apiParams: CompressApiParams, +): Partial => { + const result: Partial = { + compressionLevel: apiParams.optimizeLevel, + grayscale: apiParams.grayscale ?? defaultParameters.grayscale, + lineArt: apiParams.lineArt ?? defaultParameters.lineArt, + linearize: apiParams.linearize ?? defaultParameters.linearize, + }; + + if (apiParams.lineArtThreshold !== undefined) { + result.lineArtThreshold = apiParams.lineArtThreshold; + } + if (apiParams.lineArtEdgeLevel !== undefined) { + result.lineArtEdgeLevel = apiParams.lineArtEdgeLevel; + } + + if (apiParams.expectedOutputSize) { + result.compressionMethod = "filesize"; + const match = /^(\d+(?:\.\d+)?)(KB|MB)$/i.exec( + apiParams.expectedOutputSize, + ); + if (match) { + result.fileSizeValue = match[1]; + result.fileSizeUnit = match[2].toUpperCase() as "KB" | "MB"; + } + } else { + result.compressionMethod = "quality"; + } + + return result; +}; + // Static configuration that can be used by both the hook and automation executor export const buildCompressFormData = ( parameters: CompressParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - - if (parameters.compressionMethod === "quality") { - formData.append("optimizeLevel", parameters.compressionLevel.toString()); - } else { - // File size method - const fileSize = parameters.fileSizeValue - ? `${parameters.fileSizeValue}${parameters.fileSizeUnit}` - : ""; - if (fileSize) { - formData.append("expectedOutputSize", fileSize); - } - } - - formData.append("grayscale", (parameters.grayscale ?? false).toString()); - formData.append("lineArt", parameters.lineArt.toString()); - formData.append("linearize", parameters.linearize.toString()); - if (parameters.lineArt) { - formData.append("lineArtThreshold", parameters.lineArtThreshold.toString()); - formData.append("lineArtEdgeLevel", parameters.lineArtEdgeLevel.toString()); - } - return formData; -}; +): FormData => + objectToFormData(compressToApiParams(parameters), { fileInput: file }); // Static configuration object -export const compressOperationConfig = { - toolType: ToolType.singleFile, +export const compressOperationConfig = defineSingleFileTool({ buildFormData: buildCompressFormData, + toApiParams: compressToApiParams, + fromApiParams: compressFromApiParams, operationType: "compress", - endpoint: "/api/v1/misc/compress-pdf", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useCompressOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/compress/useCompressParameters.test.ts b/frontend/editor/src/core/hooks/tools/compress/useCompressParameters.test.ts new file mode 100644 index 0000000000..eb03607d54 --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/compress/useCompressParameters.test.ts @@ -0,0 +1,42 @@ +import { describe, expect, test } from "vitest"; +import { renderHook, act } from "@testing-library/react"; +import { useCompressParameters } from "@app/hooks/tools/compress/useCompressParameters"; + +describe("useCompressParameters", () => { + test("defaults (quality mode) validate", () => { + const { result } = renderHook(() => useCompressParameters()); + + expect(result.current.validateParameters()).toBe(true); + }); + + test("compressionLevel outside 1-9 is invalid", () => { + const { result } = renderHook(() => useCompressParameters()); + + act(() => { + result.current.updateParameter("compressionLevel", 0); + }); + expect(result.current.validateParameters()).toBe(false); + + act(() => { + result.current.updateParameter("compressionLevel", 10); + }); + expect(result.current.validateParameters()).toBe(false); + }); + + test("filesize mode requires a target size", () => { + const { result } = renderHook(() => useCompressParameters()); + + // Filesize mode with no size entered must not validate: otherwise the + // request omits expectedOutputSize and the backend silently falls back to a + // quality compression. + act(() => { + result.current.updateParameter("compressionMethod", "filesize"); + }); + expect(result.current.validateParameters()).toBe(false); + + act(() => { + result.current.updateParameter("fileSizeValue", "5"); + }); + expect(result.current.validateParameters()).toBe(true); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/compress/useCompressParameters.ts b/frontend/editor/src/core/hooks/tools/compress/useCompressParameters.ts index a6e9bfe631..0500b8c77c 100644 --- a/frontend/editor/src/core/hooks/tools/compress/useCompressParameters.ts +++ b/frontend/editor/src/core/hooks/tools/compress/useCompressParameters.ts @@ -37,8 +37,15 @@ export const useCompressParameters = (): CompressParametersHook => { defaultParameters, endpointName: "compress-pdf", validateFn: (params) => { - // For compression, we only need to validate that compression level is within range - return params.compressionLevel >= 1 && params.compressionLevel <= 9; + if (params.compressionLevel < 1 || params.compressionLevel > 9) { + return false; + } + // Filesize mode needs a target size; without one the request omits + // expectedOutputSize and the backend silently does a quality compression. + if (params.compressionMethod === "filesize") { + return params.fileSizeValue.trim() !== ""; + } + return true; }, }); }; diff --git a/frontend/editor/src/core/hooks/tools/convert/useConvertOperation.ts b/frontend/editor/src/core/hooks/tools/convert/useConvertOperation.ts index 1da1b96b31..a9488e373d 100644 --- a/frontend/editor/src/core/hooks/tools/convert/useConvertOperation.ts +++ b/frontend/editor/src/core/hooks/tools/convert/useConvertOperation.ts @@ -8,7 +8,7 @@ import { import { createFileFromApiResponse } from "@app/utils/fileResponseUtils"; import { useToolOperation, - ToolType, + defineCustomTool, CustomProcessorResult, } from "@app/hooks/tools/shared/useToolOperation"; import { @@ -300,8 +300,7 @@ export const convertProcessor = async ( }; // Static configuration object -export const convertOperationConfig = { - toolType: ToolType.custom, +export const convertOperationConfig = defineCustomTool({ customProcessor: convertProcessor, // Can't use callback version here operationType: "convert", defaultParameters, @@ -311,7 +310,7 @@ export const convertOperationConfig = { params.toExtension === "pdfx" ? "pdfa" : params.toExtension; return getEndpointUrl(params.fromExtension, actualToExtension) ?? undefined; }, -} as const; +}); export const useConvertOperation = (parameters?: ConvertParameters) => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/crop/useCropOperation.test.ts b/frontend/editor/src/core/hooks/tools/crop/useCropOperation.test.ts new file mode 100644 index 0000000000..806ad40af0 --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/crop/useCropOperation.test.ts @@ -0,0 +1,32 @@ +import { describe, expect, test } from "vitest"; +import { + cropFromApiParams, + cropToApiParams, +} from "@app/hooks/tools/crop/useCropOperation"; +import { + CropParameters, + defaultParameters, +} from "@app/hooks/tools/crop/useCropParameters"; + +describe("crop mappers", () => { + // With autoCrop on the coordinates aren't sent, so they must not resurface on + // the round trip; with autoCrop off the rectangle must survive intact. + test.each<{ label: string; overrides: Partial }>([ + { label: "autoCrop on", overrides: { autoCrop: true } }, + { + label: "autoCrop off with a rectangle", + overrides: { + autoCrop: false, + cropArea: { x: 10, y: 20, width: 300, height: 400 }, + }, + }, + ])("round-trips backend params ($label)", ({ overrides }) => { + const api = cropToApiParams({ ...defaultParameters, ...overrides }); + const roundTripped = cropToApiParams({ + ...defaultParameters, + ...cropFromApiParams(api), + }); + + expect(roundTripped).toEqual(api); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/crop/useCropOperation.ts b/frontend/editor/src/core/hooks/tools/crop/useCropOperation.ts index 67d72c8df0..b3a69f9dbe 100644 --- a/frontend/editor/src/core/hooks/tools/crop/useCropOperation.ts +++ b/frontend/editor/src/core/hooks/tools/crop/useCropOperation.ts @@ -1,44 +1,72 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { CropParameters, defaultParameters, } from "@app/hooks/tools/crop/useCropParameters"; +import { DEFAULT_CROP_AREA } from "@app/constants/cropConstants"; + +const ENDPOINT = "/api/v1/general/crop" satisfies ToolEndpoint; +type CropApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the crop request body. The return type +// is the generated backend model, so a spec change that renames or drops a +// field breaks the build here. +export const cropToApiParams = (parameters: CropParameters): CropApiParams => { + const apiParams: CropApiParams = { + autoCrop: parameters.autoCrop, + }; + + if (!parameters.autoCrop) { + const cropArea = parameters.cropArea; + apiParams.x = cropArea.x; + apiParams.y = cropArea.y; + apiParams.width = cropArea.width; + apiParams.height = cropArea.height; + } + + return apiParams; +}; + +// Reconstruct the tool's UI parameters from a crop request body, so a stored or +// AI-authored step can be re-rendered in the settings UI. +export const cropFromApiParams = ( + apiParams: CropApiParams, +): Partial => ({ + autoCrop: apiParams.autoCrop ?? defaultParameters.autoCrop, + cropArea: { + x: apiParams.x ?? DEFAULT_CROP_AREA.x, + y: apiParams.y ?? DEFAULT_CROP_AREA.y, + width: apiParams.width ?? DEFAULT_CROP_AREA.width, + height: apiParams.height ?? DEFAULT_CROP_AREA.height, + }, +}); // Static configuration that can be used by both the hook and automation executor export const buildCropFormData = ( parameters: CropParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - - if (!parameters.autoCrop) { - const cropArea = parameters.cropArea; - - formData.append("x", cropArea.x.toString()); - formData.append("y", cropArea.y.toString()); - formData.append("width", cropArea.width.toString()); - formData.append("height", cropArea.height.toString()); - } - - formData.append("autoCrop", parameters.autoCrop.toString()); - - return formData; -}; +): FormData => + objectToFormData(cropToApiParams(parameters), { fileInput: file }); // Static configuration object -export const cropOperationConfig = { - toolType: ToolType.singleFile, +export const cropOperationConfig = defineSingleFileTool({ buildFormData: buildCropFormData, + toApiParams: cropToApiParams, + fromApiParams: cropFromApiParams, operationType: "crop", - endpoint: "/api/v1/general/crop", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useCropOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.test.ts b/frontend/editor/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.test.ts new file mode 100644 index 0000000000..288beed847 --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.test.ts @@ -0,0 +1,46 @@ +import { describe, test, expect } from "vitest"; +import { expectConsole } from "@app/tests/failOnConsole"; +import { editTableOfContentsFromApiParams } from "@app/hooks/tools/editTableOfContents/useEditTableOfContentsOperation"; + +describe("editTableOfContentsFromApiParams", () => { + test("passes replaceExisting through", () => { + expect(editTableOfContentsFromApiParams({ replaceExisting: true })).toEqual( + { + replaceExisting: true, + }, + ); + }); + + test("hydrates a valid (empty) bookmark array", () => { + expect( + editTableOfContentsFromApiParams({ + replaceExisting: false, + bookmarkData: "[]", + }), + ).toEqual({ replaceExisting: false, bookmarks: [] }); + }); + + test.each(["", "not json", "{truncated"])( + "does not throw on malformed bookmarkData (%j); leaves bookmarks unset", + (bookmarkData) => { + expectConsole.warn(/could not parse bookmarkData/); + const result = editTableOfContentsFromApiParams({ + replaceExisting: true, + bookmarkData, + }); + expect(result).toEqual({ replaceExisting: true }); + expect(result).not.toHaveProperty("bookmarks"); + }, + ); + + test.each(["{}", "null", "42"])( + "ignores non-array bookmarkData (%j) without throwing", + (bookmarkData) => { + const result = editTableOfContentsFromApiParams({ + replaceExisting: false, + bookmarkData, + }); + expect(result).not.toHaveProperty("bookmarks"); + }, + ); +}); diff --git a/frontend/editor/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.ts b/frontend/editor/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.ts index 7f94008503..8473ea972c 100644 --- a/frontend/editor/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.ts +++ b/frontend/editor/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.ts @@ -1,34 +1,75 @@ import { useTranslation } from "react-i18next"; import { - ToolType, - type ToolOperationConfig, + defineSingleFileTool, useToolOperation, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { EditTableOfContentsParameters } from "@app/hooks/tools/editTableOfContents/useEditTableOfContentsParameters"; -import { serializeBookmarkNodes } from "@app/utils/editTableOfContents"; +import { + hydrateBookmarkPayload, + serializeBookmarkNodes, + type BookmarkPayload, +} from "@app/utils/editTableOfContents"; + +const ENDPOINT = + "/api/v1/general/edit-table-of-contents" satisfies ToolEndpoint; +type EditTableOfContentsApiParams = ToolApiParams[typeof ENDPOINT]; + +// bookmarkData is a string in the backend model even though it carries JSON, so +// the serialized bookmark tree is JSON-encoded into that string here. +export const editTableOfContentsToApiParams = ( + parameters: EditTableOfContentsParameters, +): EditTableOfContentsApiParams => ({ + replaceExisting: parameters.replaceExisting, + bookmarkData: JSON.stringify(serializeBookmarkNodes(parameters.bookmarks)), +}); + +export const editTableOfContentsFromApiParams = ( + apiParams: EditTableOfContentsApiParams, +): Partial => { + const result: Partial = { + replaceExisting: apiParams.replaceExisting, + }; + + // bookmarkData carries JSON in a string field, so a stored step + // could hold malformed or non-array content. Degrade to leaving bookmarks unset. + if (apiParams.bookmarkData !== undefined) { + try { + const payload = JSON.parse(apiParams.bookmarkData) as BookmarkPayload[]; + if (Array.isArray(payload)) { + result.bookmarks = hydrateBookmarkPayload(payload); + } + } catch (error) { + console.warn( + `editTableOfContents: could not parse bookmarkData; ` + + `leaving bookmarks unset. Error: ${error}`, + ); + } + } + + return result; +}; const buildFormData = ( parameters: EditTableOfContentsParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("replaceExisting", String(parameters.replaceExisting)); - formData.append( - "bookmarkData", - JSON.stringify(serializeBookmarkNodes(parameters.bookmarks)), - ); - return formData; -}; +): FormData => + objectToFormData(editTableOfContentsToApiParams(parameters), { + fileInput: file, + }); -export const editTableOfContentsOperationConfig: ToolOperationConfig = - { - toolType: ToolType.singleFile, - operationType: "editTableOfContents", - endpoint: "/api/v1/general/edit-table-of-contents", - buildFormData, - }; +export const editTableOfContentsOperationConfig = defineSingleFileTool({ + operationType: "editTableOfContents", + endpoint: ENDPOINT, + buildFormData, + toApiParams: editTableOfContentsToApiParams, + fromApiParams: editTableOfContentsFromApiParams, +}); export const useEditTableOfContentsOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/extractImages/useExtractImagesOperation.ts b/frontend/editor/src/core/hooks/tools/extractImages/useExtractImagesOperation.ts index e52a9d6f2e..0a70f43424 100644 --- a/frontend/editor/src/core/hooks/tools/extractImages/useExtractImagesOperation.ts +++ b/frontend/editor/src/core/hooks/tools/extractImages/useExtractImagesOperation.ts @@ -2,8 +2,13 @@ import { useCallback } from "react"; import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { ExtractImagesParameters, @@ -11,26 +16,39 @@ import { } from "@app/hooks/tools/extractImages/useExtractImagesParameters"; import { useToolResources } from "@app/hooks/tools/shared/useToolResources"; +const ENDPOINT = "/api/v1/misc/extract-images" satisfies ToolEndpoint; +type ExtractImagesApiParams = ToolApiParams[typeof ENDPOINT]; + +// The frontend param type uses "jpg" while the backend model uses "jpeg"; the +// wire value is preserved verbatim (as the pre-mapper code did) via the cast. +export const extractImagesToApiParams = ( + parameters: ExtractImagesParameters, +): ExtractImagesApiParams => ({ + format: parameters.format as ExtractImagesApiParams["format"], +}); + +export const extractImagesFromApiParams = ( + apiParams: ExtractImagesApiParams, +): Partial => ({ + format: apiParams.format as ExtractImagesParameters["format"], +}); + // Static configuration that can be used by both the hook and automation executor export const buildExtractImagesFormData = ( parameters: ExtractImagesParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("format", parameters.format); - // formData.append("allowDuplicates", parameters.allowDuplicates.toString()); - return formData; -}; +): FormData => + objectToFormData(extractImagesToApiParams(parameters), { fileInput: file }); // Static configuration object (without response handler - will be added in hook) -export const extractImagesOperationConfig = { - toolType: ToolType.singleFile, +export const extractImagesOperationConfig = defineSingleFileTool({ buildFormData: buildExtractImagesFormData, + toApiParams: extractImagesToApiParams, + fromApiParams: extractImagesFromApiParams, operationType: "extractImages", - endpoint: "/api/v1/misc/extract-images", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useExtractImagesOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/extractPages/useExtractPagesOperation.ts b/frontend/editor/src/core/hooks/tools/extractPages/useExtractPagesOperation.ts index 4119ed191b..0cd5273f0b 100644 --- a/frontend/editor/src/core/hooks/tools/extractPages/useExtractPagesOperation.ts +++ b/frontend/editor/src/core/hooks/tools/extractPages/useExtractPagesOperation.ts @@ -1,7 +1,7 @@ import apiClient from "@app/services/apiClient"; import { useTranslation } from "react-i18next"; import { - ToolType, + defineCustomTool, useToolOperation, CustomProcessorResult, } from "@app/hooks/tools/shared/useToolOperation"; @@ -33,8 +33,7 @@ async function resolveSelectionToCsv( } } -export const extractPagesOperationConfig = { - toolType: ToolType.custom, +export const extractPagesOperationConfig = defineCustomTool({ operationType: "extractPages", customProcessor: async ( parameters: ExtractPagesParameters, @@ -71,7 +70,7 @@ export const extractPagesOperationConfig = { }; }, defaultParameters, -} as const; +}); export const useExtractPagesOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/flatten/useFlattenOperation.ts b/frontend/editor/src/core/hooks/tools/flatten/useFlattenOperation.ts index 9138b824ed..4027b7048e 100644 --- a/frontend/editor/src/core/hooks/tools/flatten/useFlattenOperation.ts +++ b/frontend/editor/src/core/hooks/tools/flatten/useFlattenOperation.ts @@ -1,37 +1,72 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { FlattenParameters, defaultParameters, } from "@app/hooks/tools/flatten/useFlattenParameters"; +const ENDPOINT = "/api/v1/misc/flatten" satisfies ToolEndpoint; +type FlattenApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the flatten request body. The return +// type is the generated backend model, so a spec change that renames or drops a +// field breaks the build here. +export const flattenToApiParams = ( + parameters: FlattenParameters, +): FlattenApiParams => { + const apiParams: FlattenApiParams = { + flattenOnlyForms: parameters.flattenOnlyForms, + }; + + if (parameters.renderDpi != null) { + apiParams.renderDpi = parameters.renderDpi; + } + + return apiParams; +}; + +// Reconstruct the tool's UI parameters from a flatten request body, so a stored +// or AI-authored step can be re-rendered in the settings UI. +export const flattenFromApiParams = ( + apiParams: FlattenApiParams, +): Partial => { + const result: Partial = { + flattenOnlyForms: + apiParams.flattenOnlyForms ?? defaultParameters.flattenOnlyForms, + }; + + if (apiParams.renderDpi != null) { + result.renderDpi = apiParams.renderDpi; + } + + return result; +}; + // Static function that can be used by both the hook and automation executor export const buildFlattenFormData = ( parameters: FlattenParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("flattenOnlyForms", parameters.flattenOnlyForms.toString()); - if (parameters.renderDpi != null) { - formData.append("renderDpi", parameters.renderDpi.toString()); - } - return formData; -}; +): FormData => + objectToFormData(flattenToApiParams(parameters), { fileInput: file }); // Static configuration object -export const flattenOperationConfig = { - toolType: ToolType.singleFile, +export const flattenOperationConfig = defineSingleFileTool({ buildFormData: buildFlattenFormData, + toApiParams: flattenToApiParams, + fromApiParams: flattenFromApiParams, operationType: "flatten", - endpoint: "/api/v1/misc/flatten", - multiFileEndpoint: false, + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useFlattenOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/merge/useMergeOperation.test.ts b/frontend/editor/src/core/hooks/tools/merge/useMergeOperation.test.ts index c637f2fe53..21817ddfcd 100644 --- a/frontend/editor/src/core/hooks/tools/merge/useMergeOperation.test.ts +++ b/frontend/editor/src/core/hooks/tools/merge/useMergeOperation.test.ts @@ -29,6 +29,10 @@ import { ToolOperationHook, useToolOperation, } from "@app/hooks/tools/shared/useToolOperation"; +import { + mergeFromApiParams, + mergeToApiParams, +} from "@app/hooks/tools/merge/useMergeOperation"; describe("useMergeOperation", () => { const mockUseToolOperation = vi.mocked(useToolOperation); @@ -128,4 +132,60 @@ describe("useMergeOperation", () => { expect(formData2.get("removeCertSign")).toBe("true"); expect(formData2.get("generateToc")).toBe("true"); }); + + test("should include client file IDs derived from the files", () => { + renderHook(() => useMergeOperation()); + + const config = getToolConfig(); + const mockFiles = [ + new File(["a"], "a.pdf", { type: "application/pdf" }), + new File(["b"], "b.pdf", { type: "application/pdf" }), + ]; + const formData = config.buildFormData( + { removeDigitalSignature: false, generateTableOfContents: false }, + mockFiles, + ); + + expect(formData.get("clientFileIds")).toBe( + JSON.stringify(["a.pdf", "b.pdf"]), + ); + }); +}); + +describe("merge mappers", () => { + test("toApiParams renames UI fields to the backend request model", () => { + expect( + mergeToApiParams({ + removeDigitalSignature: true, + generateTableOfContents: false, + }), + ).toEqual({ + sortType: "orderProvided", + removeCertSign: true, + generateToc: false, + }); + }); + + test("fromApiParams maps the backend request model back to UI fields", () => { + expect( + mergeFromApiParams({ removeCertSign: false, generateToc: true }), + ).toEqual({ + removeDigitalSignature: false, + generateTableOfContents: true, + }); + }); + + test("round-trips backend params", () => { + const api = mergeToApiParams({ + removeDigitalSignature: true, + generateTableOfContents: true, + }); + const roundTripped = mergeToApiParams({ + removeDigitalSignature: false, + generateTableOfContents: false, + ...mergeFromApiParams(api), + }); + + expect(roundTripped).toEqual(api); + }); }); diff --git a/frontend/editor/src/core/hooks/tools/merge/useMergeOperation.ts b/frontend/editor/src/core/hooks/tools/merge/useMergeOperation.ts index 44cee9e134..fc742ff410 100644 --- a/frontend/editor/src/core/hooks/tools/merge/useMergeOperation.ts +++ b/frontend/editor/src/core/hooks/tools/merge/useMergeOperation.ts @@ -1,51 +1,69 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolOperationConfig, - ToolType, + defineMultiFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { MergeParameters, defaultParameters, } from "@app/hooks/tools/merge/useMergeParameters"; +const ENDPOINT = "/api/v1/general/merge-pdfs" satisfies ToolEndpoint; +type MergeApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the merge-pdfs request body. File-derived +// fields (clientFileIds) are appended by buildFormData, not here. +export const mergeToApiParams = ( + parameters: MergeParameters, +): MergeApiParams => ({ + // The UI owns file ordering, so the backend is always told to keep it. + sortType: "orderProvided", + removeCertSign: parameters.removeDigitalSignature ?? false, + generateToc: parameters.generateTableOfContents ?? false, +}); + +// Reconstruct the tool's UI parameters from a merge-pdfs request body. +export const mergeFromApiParams = ( + apiParams: MergeApiParams, +): Partial => ({ + removeDigitalSignature: + apiParams.removeCertSign ?? defaultParameters.removeDigitalSignature, + generateTableOfContents: + apiParams.generateToc ?? defaultParameters.generateTableOfContents, +}); + const buildFormData = ( parameters: MergeParameters, files: File[], ): FormData => { - const formData = new FormData(); - - files.forEach((file) => { - formData.append("fileInput", file); + const formData = objectToFormData(mergeToApiParams(parameters), { + fileInput: files, }); - // Provide stable client file IDs (align with files order) + // Stable client file IDs, aligned with the fileInput order. Derived from the + // files themselves, so it belongs to the file-appending step. const clientIds: string[] = files.map((f) => String((f as { fileId?: string }).fileId || f.name), ); formData.append("clientFileIds", JSON.stringify(clientIds)); - formData.append("sortType", "orderProvided"); // Always use orderProvided since UI handles sorting - formData.append( - "removeCertSign", - (parameters.removeDigitalSignature ?? false).toString(), - ); - formData.append( - "generateToc", - (parameters.generateTableOfContents ?? false).toString(), - ); - return formData; }; // Operation configuration for automation -export const mergeOperationConfig: ToolOperationConfig = { - toolType: ToolType.multiFile, +export const mergeOperationConfig = defineMultiFileTool({ buildFormData, + toApiParams: mergeToApiParams, + fromApiParams: mergeFromApiParams, operationType: "merge", - endpoint: "/api/v1/general/merge-pdfs", + endpoint: ENDPOINT, filePrefix: "merged_", defaultParameters, -}; +}); export const useMergeOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/ocr/useOCROperation.ts b/frontend/editor/src/core/hooks/tools/ocr/useOCROperation.ts index b7d6d56564..f995ef06fc 100644 --- a/frontend/editor/src/core/hooks/tools/ocr/useOCROperation.ts +++ b/frontend/editor/src/core/hooks/tools/ocr/useOCROperation.ts @@ -7,11 +7,19 @@ import { import { useToolOperation, ToolOperationConfig, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { useToolResources } from "@app/hooks/tools/shared/useToolResources"; +const ENDPOINT = "/api/v1/misc/ocr-pdf" satisfies ToolEndpoint; +type OCRApiParams = ToolApiParams[typeof ENDPOINT]; + // Helper: get MIME type based on file extension function getMimeType(filename: string): string { const ext = filename.toLowerCase().split(".").pop(); @@ -48,28 +56,49 @@ function stripExt(name: string): string { return i > 0 ? name.slice(0, i) : name; } +// Convert the tool's UI parameters into the ocr-pdf request body. The return +// type is the generated backend model, so a spec change that renames or drops a +// field breaks the build here. +export const ocrToApiParams = (parameters: OCRParameters): OCRApiParams => { + const options = parameters.additionalOptions || []; + return { + languages: parameters.languages, + ocrType: parameters.ocrType as OCRApiParams["ocrType"], + ocrRenderType: parameters.ocrRenderType as OCRApiParams["ocrRenderType"], + sidecar: options.includes("sidecar"), + deskew: options.includes("deskew"), + clean: options.includes("clean"), + cleanFinal: options.includes("cleanFinal"), + removeImagesAfter: options.includes("removeImagesAfter"), + }; +}; + +// Reconstruct the tool's UI parameters from an ocr-pdf request body, so a stored +// or AI-authored step can be re-rendered in the settings UI. +export const ocrFromApiParams = ( + apiParams: OCRApiParams, +): Partial => { + const additionalOptions: string[] = []; + if (apiParams.sidecar) additionalOptions.push("sidecar"); + if (apiParams.deskew) additionalOptions.push("deskew"); + if (apiParams.clean) additionalOptions.push("clean"); + if (apiParams.cleanFinal) additionalOptions.push("cleanFinal"); + if (apiParams.removeImagesAfter) additionalOptions.push("removeImagesAfter"); + + return { + languages: apiParams.languages ?? defaultParameters.languages, + ocrType: apiParams.ocrType, + ocrRenderType: apiParams.ocrRenderType ?? defaultParameters.ocrRenderType, + additionalOptions, + }; +}; + // Static function that can be used by both the hook and automation executor export const buildOCRFormData = ( parameters: OCRParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - parameters.languages.forEach((lang) => formData.append("languages", lang)); - formData.append("ocrType", parameters.ocrType); - formData.append("ocrRenderType", parameters.ocrRenderType); - - const options = parameters.additionalOptions || []; - formData.append("sidecar", options.includes("sidecar").toString()); - formData.append("deskew", options.includes("deskew").toString()); - formData.append("clean", options.includes("clean").toString()); - formData.append("cleanFinal", options.includes("cleanFinal").toString()); - formData.append( - "removeImagesAfter", - options.includes("removeImagesAfter").toString(), - ); - return formData; -}; +): FormData => + objectToFormData(ocrToApiParams(parameters), { fileInput: file }); // Static response handler for OCR - can be used by automation executor export const ocrResponseHandler = async ( @@ -122,13 +151,14 @@ export const ocrResponseHandler = async ( }; // Static configuration object (without t function dependencies) -export const ocrOperationConfig = { - toolType: ToolType.singleFile, +export const ocrOperationConfig = defineSingleFileTool({ buildFormData: buildOCRFormData, + toApiParams: ocrToApiParams, + fromApiParams: ocrFromApiParams, operationType: "ocr", - endpoint: "/api/v1/misc/ocr-pdf", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useOCROperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/overlayPdfs/useOverlayPdfsOperation.ts b/frontend/editor/src/core/hooks/tools/overlayPdfs/useOverlayPdfsOperation.ts index 02b72e9e1d..f71c237e9d 100644 --- a/frontend/editor/src/core/hooks/tools/overlayPdfs/useOverlayPdfsOperation.ts +++ b/frontend/editor/src/core/hooks/tools/overlayPdfs/useOverlayPdfsOperation.ts @@ -1,45 +1,72 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, type ToolOperationConfig, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; -import { type OverlayPdfsParameters } from "@app/hooks/tools/overlayPdfs/useOverlayPdfsParameters"; +import { + type OverlayPdfsParameters, + defaultParameters, +} from "@app/hooks/tools/overlayPdfs/useOverlayPdfsParameters"; + +const ENDPOINT = "/api/v1/general/overlay-pdfs" satisfies ToolEndpoint; +type OverlayPdfsApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the overlay-pdfs request body. The +// overlay documents are actual File uploads sent as repeated `overlayFiles` +// fields (see buildFormData), so `overlayFiles` here is an empty array: the real +// uploads are appended separately and an empty array serializes to no fields. +export const overlayPdfsToApiParams = ( + parameters: OverlayPdfsParameters, +): OverlayPdfsApiParams => { + const apiParams: OverlayPdfsApiParams = { + overlayFiles: [], + overlayMode: parameters.overlayMode, + overlayPosition: parameters.overlayPosition, + }; + + // Counts are only relevant for FixedRepeatOverlay; the server accepts repeated + // 'counts' fields. + if (parameters.overlayMode === "FixedRepeatOverlay") { + apiParams.counts = parameters.counts || []; + } + + return apiParams; +}; + +// Reconstruct the tool's UI parameters from an overlay-pdfs request body. The +// overlay File uploads cannot be recovered from the request model. +export const overlayPdfsFromApiParams = ( + apiParams: OverlayPdfsApiParams, +): Partial => ({ + overlayMode: apiParams.overlayMode, + overlayPosition: apiParams.overlayPosition, + counts: apiParams.counts ?? defaultParameters.counts, +}); const buildFormData = ( parameters: OverlayPdfsParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - - // Overlay files - for (const overlay of parameters.overlayFiles || []) { - formData.append("overlayFiles", overlay); - } - - // Mode and position - formData.append("overlayMode", parameters.overlayMode); - formData.append("overlayPosition", String(parameters.overlayPosition)); - - // Counts (only relevant for FixedRepeatOverlay, server accepts repeated 'counts' fields) - if (parameters.overlayMode === "FixedRepeatOverlay") { - for (const count of parameters.counts || []) { - formData.append("counts", String(count)); - } - } - - return formData; -}; +): FormData => + objectToFormData(overlayPdfsToApiParams(parameters), { + fileInput: file, + overlayFiles: parameters.overlayFiles || [], + }); export const overlayPdfsOperationConfig: ToolOperationConfig = - { - toolType: ToolType.singleFile, + defineSingleFileTool({ buildFormData, + toApiParams: overlayPdfsToApiParams, + fromApiParams: overlayPdfsFromApiParams, operationType: "overlayPdfs", - endpoint: "/api/v1/general/overlay-pdfs", - }; + endpoint: ENDPOINT, + }); export const useOverlayPdfsOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/pageLayout/usePageLayoutOperation.test.ts b/frontend/editor/src/core/hooks/tools/pageLayout/usePageLayoutOperation.test.ts new file mode 100644 index 0000000000..874fdff811 --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/pageLayout/usePageLayoutOperation.test.ts @@ -0,0 +1,24 @@ +import { describe, expect, test } from "vitest"; +import { + pageLayoutFromApiParams, + pageLayoutToApiParams, +} from "@app/hooks/tools/pageLayout/usePageLayoutOperation"; +import { + PageLayoutParameters, + defaultParameters, +} from "@app/hooks/tools/pageLayout/usePageLayoutParameters"; + +describe("pageLayout mappers", () => { + test.each>([ + {}, + { addBorder: true, borderWidth: 3, innerMargin: 5, topMargin: 2 }, + ])("round-trips backend params for %o", (overrides) => { + const api = pageLayoutToApiParams({ ...defaultParameters, ...overrides }); + const roundTripped = pageLayoutToApiParams({ + ...defaultParameters, + ...pageLayoutFromApiParams(api), + }); + + expect(roundTripped).toEqual(api); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/pageLayout/usePageLayoutOperation.ts b/frontend/editor/src/core/hooks/tools/pageLayout/usePageLayoutOperation.ts index b168f15f6f..5de635f965 100644 --- a/frontend/editor/src/core/hooks/tools/pageLayout/usePageLayoutOperation.ts +++ b/frontend/editor/src/core/hooks/tools/pageLayout/usePageLayoutOperation.ts @@ -1,44 +1,80 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { PageLayoutParameters, defaultParameters, } from "@app/hooks/tools/pageLayout/usePageLayoutParameters"; +const ENDPOINT = "/api/v1/general/multi-page-layout" satisfies ToolEndpoint; +type PageLayoutApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the multi-page-layout request body. The +// return type is the generated backend model, so a spec change that renames or +// drops a field breaks the build here. +export const pageLayoutToApiParams = ( + parameters: PageLayoutParameters, +): PageLayoutApiParams => ({ + mode: parameters.mode, + pagesPerSheet: + parameters.pagesPerSheet as PageLayoutApiParams["pagesPerSheet"], + rows: parameters.rows, + cols: parameters.cols, + orientation: parameters.orientation, + arrangement: parameters.arrangement, + readingDirection: parameters.readingDirection, + innerMargin: parameters.innerMargin ?? 0, + topMargin: parameters.topMargin ?? 0, + bottomMargin: parameters.bottomMargin ?? 0, + leftMargin: parameters.leftMargin ?? 0, + rightMargin: parameters.rightMargin ?? 0, + addBorder: parameters.addBorder, + borderWidth: parameters.borderWidth ?? 1, +}); + +// Reconstruct the tool's UI parameters from a multi-page-layout request body, so +// a stored or AI-authored step can be re-rendered in the settings UI. +export const pageLayoutFromApiParams = ( + apiParams: PageLayoutApiParams, +): Partial => ({ + mode: apiParams.mode, + pagesPerSheet: apiParams.pagesPerSheet, + rows: apiParams.rows, + cols: apiParams.cols, + orientation: apiParams.orientation, + arrangement: apiParams.arrangement, + readingDirection: apiParams.readingDirection, + innerMargin: apiParams.innerMargin, + topMargin: apiParams.topMargin, + bottomMargin: apiParams.bottomMargin, + leftMargin: apiParams.leftMargin, + rightMargin: apiParams.rightMargin, + addBorder: apiParams.addBorder, + borderWidth: apiParams.borderWidth, +}); + export const buildPageLayoutFormData = ( parameters: PageLayoutParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("mode", String(parameters.mode)); - formData.append("pagesPerSheet", String(parameters.pagesPerSheet)); - formData.append("rows", String(parameters.rows)); - formData.append("cols", String(parameters.cols)); - formData.append("orientation", String(parameters.orientation)); - formData.append("arrangement", String(parameters.arrangement)); - formData.append("readingDirection", String(parameters.readingDirection)); - formData.append("innerMargin", String(parameters.innerMargin ?? 0)); - formData.append("topMargin", String(parameters.topMargin ?? 0)); - formData.append("bottomMargin", String(parameters.bottomMargin ?? 0)); - formData.append("leftMargin", String(parameters.leftMargin ?? 0)); - formData.append("rightMargin", String(parameters.rightMargin ?? 0)); - formData.append("addBorder", String(parameters.addBorder)); - formData.append("borderWidth", String(parameters.borderWidth ?? 1)); - return formData; -}; +): FormData => + objectToFormData(pageLayoutToApiParams(parameters), { fileInput: file }); -export const pageLayoutOperationConfig = { - toolType: ToolType.singleFile, +export const pageLayoutOperationConfig = defineSingleFileTool({ buildFormData: buildPageLayoutFormData, + toApiParams: pageLayoutToApiParams, + fromApiParams: pageLayoutFromApiParams, operationType: "pageLayout", - endpoint: "/api/v1/general/multi-page-layout", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const usePageLayoutOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/redact/useRedactOperation.ts b/frontend/editor/src/core/hooks/tools/redact/useRedactOperation.ts index bc4db5b6c3..82d45e9e55 100644 --- a/frontend/editor/src/core/hooks/tools/redact/useRedactOperation.ts +++ b/frontend/editor/src/core/hooks/tools/redact/useRedactOperation.ts @@ -1,56 +1,80 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { RedactParameters, defaultParameters, } from "@app/hooks/tools/redact/useRedactParameters"; +// Automatic redaction is the only mode that calls the backend; manual redaction +// is handled client-side by EmbedPDF in the viewer. +const AUTO_ENDPOINT = "/api/v1/security/auto-redact" satisfies ToolEndpoint; +type RedactApiParams = ToolApiParams[typeof AUTO_ENDPOINT]; + +// Convert the tool's UI parameters into the auto-redact request body. +export const redactToApiParams = ( + parameters: RedactParameters, +): RedactApiParams => ({ + // The backend takes the search terms as a single newline-separated string. + listOfText: parameters.wordsToRedact.join("\n"), + useRegex: parameters.useRegex, + wholeWordSearch: parameters.wholeWordSearch, + // The backend expects the hex colour without the leading '#'. + redactColor: parameters.redactColor.replace("#", ""), + customPadding: parameters.customPadding, + convertPDFToImage: parameters.convertPDFToImage, +}); + +// Reconstruct the tool's UI parameters from an auto-redact request body. +export const redactFromApiParams = ( + apiParams: RedactApiParams, +): Partial => ({ + mode: "automatic", + wordsToRedact: apiParams.listOfText ? apiParams.listOfText.split("\n") : [], + useRegex: apiParams.useRegex ?? defaultParameters.useRegex, + wholeWordSearch: + apiParams.wholeWordSearch ?? defaultParameters.wholeWordSearch, + redactColor: apiParams.redactColor + ? `#${apiParams.redactColor}` + : defaultParameters.redactColor, + customPadding: apiParams.customPadding, + convertPDFToImage: + apiParams.convertPDFToImage ?? defaultParameters.convertPDFToImage, +}); + // Static configuration that can be used by both the hook and automation executor export const buildRedactFormData = ( parameters: RedactParameters, file: File, ): FormData => { - const formData = new FormData(); - - // For automatic mode we hit the backend and need full payload - if (parameters.mode === "automatic") { - formData.append("fileInput", file); - // Convert array to newline-separated string as expected by backend - formData.append("listOfText", parameters.wordsToRedact.join("\n")); - formData.append("useRegex", parameters.useRegex.toString()); - formData.append("wholeWordSearch", parameters.wholeWordSearch.toString()); - formData.append("redactColor", parameters.redactColor.replace("#", "")); - formData.append("customPadding", parameters.customPadding.toString()); - formData.append( - "convertPDFToImage", - parameters.convertPDFToImage.toString(), - ); - } else { - // Manual redaction uses EmbedPDF in-viewer; we don't call the API. - // Return an empty formData to satisfy shared interfaces without throwing. + // Manual redaction uses EmbedPDF in-viewer and makes no API call; return an + // empty payload to satisfy the shared interface without throwing. + if (parameters.mode !== "automatic") { + return new FormData(); } - - return formData; + return objectToFormData(redactToApiParams(parameters), { fileInput: file }); }; // Static configuration object -export const redactOperationConfig = { - toolType: ToolType.singleFile, +export const redactOperationConfig = defineSingleFileTool({ buildFormData: buildRedactFormData, + toApiParams: redactToApiParams, + fromApiParams: redactFromApiParams, operationType: "redact", - endpoint: (parameters: RedactParameters) => { - if (parameters.mode === "automatic") { - return "/api/v1/security/auto-redact"; - } - // Manual redaction is handled by EmbedPDF in the viewer; no endpoint call. - return ""; - }, + endpoint: (parameters: RedactParameters) => + parameters.mode === "automatic" ? AUTO_ENDPOINT : null, + // Routing set: `mode` is frontend-only, so a stored step matches by this rather than by replay. + endpoints: [AUTO_ENDPOINT], defaultParameters, -} as const; +}); export const useRedactOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsOperation.ts b/frontend/editor/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsOperation.ts index 4f9d3fbc7d..de4f384b9e 100644 --- a/frontend/editor/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsOperation.ts +++ b/frontend/editor/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsOperation.ts @@ -1,7 +1,7 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, + defineCustomTool, CustomProcessorResult, } from "@app/hooks/tools/shared/useToolOperation"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; @@ -78,12 +78,11 @@ const removeAnnotationsProcessor = async ( }; // Static configuration object -export const removeAnnotationsOperationConfig = { - toolType: ToolType.custom, +export const removeAnnotationsOperationConfig = defineCustomTool({ operationType: "removeAnnotations", customProcessor: removeAnnotationsProcessor, defaultParameters, -} as const; +}); export const useRemoveAnnotationsOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/removeBlanks/useRemoveBlanksOperation.ts b/frontend/editor/src/core/hooks/tools/removeBlanks/useRemoveBlanksOperation.ts index 5f24a28dd8..54e45d43fe 100644 --- a/frontend/editor/src/core/hooks/tools/removeBlanks/useRemoveBlanksOperation.ts +++ b/frontend/editor/src/core/hooks/tools/removeBlanks/useRemoveBlanksOperation.ts @@ -1,10 +1,14 @@ import { useCallback } from "react"; import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, - ToolOperationConfig, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { RemoveBlanksParameters, @@ -12,25 +16,38 @@ import { } from "@app/hooks/tools/removeBlanks/useRemoveBlanksParameters"; import { useToolResources } from "@app/hooks/tools/shared/useToolResources"; +const ENDPOINT = "/api/v1/misc/remove-blanks" satisfies ToolEndpoint; +type RemoveBlanksApiParams = ToolApiParams[typeof ENDPOINT]; + +// Note: includeBlankPages is not sent to backend as it always returns both files in a ZIP +export const removeBlanksToApiParams = ( + parameters: RemoveBlanksParameters, +): RemoveBlanksApiParams => ({ + threshold: parameters.threshold, + whitePercent: parameters.whitePercent, +}); + +export const removeBlanksFromApiParams = ( + apiParams: RemoveBlanksApiParams, +): Partial => ({ + threshold: apiParams.threshold, + whitePercent: apiParams.whitePercent, +}); + export const buildRemoveBlanksFormData = ( parameters: RemoveBlanksParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("threshold", String(parameters.threshold)); - formData.append("whitePercent", String(parameters.whitePercent)); - // Note: includeBlankPages is not sent to backend as it always returns both files in a ZIP - return formData; -}; +): FormData => + objectToFormData(removeBlanksToApiParams(parameters), { fileInput: file }); -export const removeBlanksOperationConfig = { - toolType: ToolType.singleFile, +export const removeBlanksOperationConfig = defineSingleFileTool({ buildFormData: buildRemoveBlanksFormData, + toApiParams: removeBlanksToApiParams, + fromApiParams: removeBlanksFromApiParams, operationType: "removeBlanks", - endpoint: "/api/v1/misc/remove-blanks", + endpoint: ENDPOINT, defaultParameters, -} as const satisfies ToolOperationConfig; +}); export const useRemoveBlanksOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation.ts b/frontend/editor/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation.ts index 1d6604f0ef..fd2b5200c3 100644 --- a/frontend/editor/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation.ts +++ b/frontend/editor/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation.ts @@ -1,32 +1,38 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + fileOnlyMapping, + objectToFormData, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { RemoveCertificateSignParameters, defaultParameters, } from "@app/hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters"; -// Static function that can be used by both the hook and automation executor +const ENDPOINT = "/api/v1/security/remove-cert-sign" satisfies ToolEndpoint; + +// Removing certificate signatures takes only a file; no parameters to map. +const { toApiParams, fromApiParams } = fileOnlyMapping(); + export const buildRemoveCertificateSignFormData = ( _parameters: RemoveCertificateSignParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - return formData; -}; +): FormData => objectToFormData(toApiParams(), { fileInput: file }); // Static configuration object -export const removeCertificateSignOperationConfig = { - toolType: ToolType.singleFile, +export const removeCertificateSignOperationConfig = defineSingleFileTool({ buildFormData: buildRemoveCertificateSignFormData, + toApiParams, + fromApiParams, operationType: "removeCertSign", - endpoint: "/api/v1/security/remove-cert-sign", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useRemoveCertificateSignOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/removeImage/useRemoveImageOperation.ts b/frontend/editor/src/core/hooks/tools/removeImage/useRemoveImageOperation.ts index 3441623cf6..96de39321c 100644 --- a/frontend/editor/src/core/hooks/tools/removeImage/useRemoveImageOperation.ts +++ b/frontend/editor/src/core/hooks/tools/removeImage/useRemoveImageOperation.ts @@ -1,28 +1,33 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolOperationConfig, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + fileOnlyMapping, + objectToFormData, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import type { RemoveImageParameters } from "@app/hooks/tools/removeImage/useRemoveImageParameters"; +const ENDPOINT = "/api/v1/general/remove-image-pdf" satisfies ToolEndpoint; + +// Remove-image takes only a file; there are no request parameters to map. +const { toApiParams, fromApiParams } = fileOnlyMapping(); + export const buildRemoveImageFormData = ( _params: RemoveImageParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - return formData; -}; +): FormData => objectToFormData(toApiParams(), { fileInput: file }); -export const removeImageOperationConfig: ToolOperationConfig = - { - toolType: ToolType.singleFile, - buildFormData: buildRemoveImageFormData, - operationType: "removeImage", - endpoint: "/api/v1/general/remove-image-pdf", - }; +export const removeImageOperationConfig = defineSingleFileTool({ + buildFormData: buildRemoveImageFormData, + toApiParams, + fromApiParams, + operationType: "removeImage", + endpoint: ENDPOINT, +}); export const useRemoveImageOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/removePages/useRemovePagesOperation.ts b/frontend/editor/src/core/hooks/tools/removePages/useRemovePagesOperation.ts index 9ff5e6fb62..c8a8aca2d0 100644 --- a/frontend/editor/src/core/hooks/tools/removePages/useRemovePagesOperation.ts +++ b/frontend/editor/src/core/hooks/tools/removePages/useRemovePagesOperation.ts @@ -1,9 +1,13 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, - ToolOperationConfig, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { RemovePagesParameters, @@ -11,24 +15,40 @@ import { } from "@app/hooks/tools/removePages/useRemovePagesParameters"; // import { useToolResources } from '@app/hooks/tools/shared/useToolResources'; +const ENDPOINT = "/api/v1/general/remove-pages" satisfies ToolEndpoint; +type RemovePagesApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the remove-pages request body. The +// return type is the generated backend model, so a spec change that renames or +// drops a field breaks the build here. +export const removePagesToApiParams = ( + parameters: RemovePagesParameters, +): RemovePagesApiParams => ({ + pageNumbers: parameters.pageNumbers.replace(/\s+/g, ""), +}); + +// Reconstruct the tool's UI parameters from a remove-pages request body, so a +// stored or AI-authored step can be re-rendered in the settings UI. +export const removePagesFromApiParams = ( + apiParams: RemovePagesApiParams, +): Partial => ({ + pageNumbers: apiParams.pageNumbers ?? defaultParameters.pageNumbers, +}); + export const buildRemovePagesFormData = ( parameters: RemovePagesParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - const cleaned = parameters.pageNumbers.replace(/\s+/g, ""); - formData.append("pageNumbers", cleaned); - return formData; -}; +): FormData => + objectToFormData(removePagesToApiParams(parameters), { fileInput: file }); -export const removePagesOperationConfig = { - toolType: ToolType.singleFile, +export const removePagesOperationConfig = defineSingleFileTool({ buildFormData: buildRemovePagesFormData, + toApiParams: removePagesToApiParams, + fromApiParams: removePagesFromApiParams, operationType: "removePages", - endpoint: "/api/v1/general/remove-pages", + endpoint: ENDPOINT, defaultParameters, -} as const satisfies ToolOperationConfig; +}); export const useRemovePagesOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/removePassword/buildRemovePasswordFormData.ts b/frontend/editor/src/core/hooks/tools/removePassword/buildRemovePasswordFormData.ts index 8f04c4806f..c55040c7f2 100644 --- a/frontend/editor/src/core/hooks/tools/removePassword/buildRemovePasswordFormData.ts +++ b/frontend/editor/src/core/hooks/tools/removePassword/buildRemovePasswordFormData.ts @@ -1,4 +1,35 @@ -import { RemovePasswordParameters } from "@app/hooks/tools/removePassword/useRemovePasswordParameters"; +import { + RemovePasswordParameters, + defaultParameters, +} from "@app/hooks/tools/removePassword/useRemovePasswordParameters"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; + +// Defined here (not in the operation config) so both the mappers and the config +// share one endpoint constant without a circular import via FileContext. +export const REMOVE_PASSWORD_ENDPOINT = + "/api/v1/security/remove-password" satisfies ToolEndpoint; +type RemovePasswordApiParams = ToolApiParams[typeof REMOVE_PASSWORD_ENDPOINT]; + +// Convert the tool's UI parameters into the remove-password request body. The +// return type is the generated backend model, so a spec change that renames or +// drops a field breaks the build here. +export const removePasswordToApiParams = ( + parameters: RemovePasswordParameters, +): RemovePasswordApiParams => ({ + password: parameters.password, +}); + +// Reconstruct the tool's UI parameters from a remove-password request body, so a +// stored or AI-authored step can be re-rendered in the settings UI. +export const removePasswordFromApiParams = ( + apiParams: RemovePasswordApiParams, +): Partial => ({ + password: apiParams.password ?? defaultParameters.password, +}); /** * Builds FormData for remove password API request. @@ -7,9 +38,5 @@ import { RemovePasswordParameters } from "@app/hooks/tools/removePassword/useRem export const buildRemovePasswordFormData = ( parameters: RemovePasswordParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("password", parameters.password); - return formData; -}; +): FormData => + objectToFormData(removePasswordToApiParams(parameters), { fileInput: file }); diff --git a/frontend/editor/src/core/hooks/tools/removePassword/useRemovePasswordOperation.ts b/frontend/editor/src/core/hooks/tools/removePassword/useRemovePasswordOperation.ts index aa71a5befb..644bbe3b1a 100644 --- a/frontend/editor/src/core/hooks/tools/removePassword/useRemovePasswordOperation.ts +++ b/frontend/editor/src/core/hooks/tools/removePassword/useRemovePasswordOperation.ts @@ -1,26 +1,32 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { RemovePasswordParameters, defaultParameters, } from "@app/hooks/tools/removePassword/useRemovePasswordParameters"; -import { buildRemovePasswordFormData } from "@app/hooks/tools/removePassword/buildRemovePasswordFormData"; +import { + buildRemovePasswordFormData, + removePasswordToApiParams, + removePasswordFromApiParams, + REMOVE_PASSWORD_ENDPOINT, +} from "@app/hooks/tools/removePassword/buildRemovePasswordFormData"; // Re-export for backwards compatibility with any other imports export { buildRemovePasswordFormData }; // Static configuration object -export const removePasswordOperationConfig = { - toolType: ToolType.singleFile, +export const removePasswordOperationConfig = defineSingleFileTool({ buildFormData: buildRemovePasswordFormData, + toApiParams: removePasswordToApiParams, + fromApiParams: removePasswordFromApiParams, operationType: "removePassword", - endpoint: "/api/v1/security/remove-password", + endpoint: REMOVE_PASSWORD_ENDPOINT, defaultParameters, -} as const; +}); export const useRemovePasswordOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/reorganizePages/useReorganizePagesOperation.ts b/frontend/editor/src/core/hooks/tools/reorganizePages/useReorganizePagesOperation.ts index de5aaf5c53..457132887b 100644 --- a/frontend/editor/src/core/hooks/tools/reorganizePages/useReorganizePagesOperation.ts +++ b/frontend/editor/src/core/hooks/tools/reorganizePages/useReorganizePagesOperation.ts @@ -1,35 +1,65 @@ import { useTranslation } from "react-i18next"; import { - ToolOperationConfig, - ToolType, + defineSingleFileTool, useToolOperation, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; -import { ReorganizePagesParameters } from "@app/hooks/tools/reorganizePages/useReorganizePagesParameters"; +import { + ReorganizePagesParameters, + defaultReorganizePagesParameters, +} from "@app/hooks/tools/reorganizePages/useReorganizePagesParameters"; + +const ENDPOINT = "/api/v1/general/rearrange-pages" satisfies ToolEndpoint; +type ReorganizePagesApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the rearrange-pages request body. The +// return type is the generated backend model, so a spec change that renames or +// drops a field breaks the build here. +export const reorganizePagesToApiParams = ( + parameters: ReorganizePagesParameters, +): ReorganizePagesApiParams => { + const apiParams: ReorganizePagesApiParams = {}; + if (parameters.customMode) { + apiParams.customMode = + parameters.customMode as ReorganizePagesApiParams["customMode"]; + } + if (parameters.pageNumbers) { + apiParams.pageNumbers = parameters.pageNumbers.replace(/\s+/g, ""); + } + return apiParams; +}; + +// Reconstruct the tool's UI parameters from a rearrange-pages request body, so a +// stored or AI-authored step can be re-rendered in the settings UI. +export const reorganizePagesFromApiParams = ( + apiParams: ReorganizePagesApiParams, +): Partial => ({ + customMode: + apiParams.customMode ?? defaultReorganizePagesParameters.customMode, + pageNumbers: + apiParams.pageNumbers ?? defaultReorganizePagesParameters.pageNumbers, +}); const buildFormData = ( parameters: ReorganizePagesParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - if (parameters.customMode) { - formData.append("customMode", parameters.customMode); - } - if (parameters.pageNumbers) { - const cleaned = parameters.pageNumbers.replace(/\s+/g, ""); - formData.append("pageNumbers", cleaned); - } - return formData; -}; +): FormData => + objectToFormData(reorganizePagesToApiParams(parameters), { + fileInput: file, + }); -export const reorganizePagesOperationConfig: ToolOperationConfig = - { - toolType: ToolType.singleFile, - buildFormData, - operationType: "reorganizePages", - endpoint: "/api/v1/general/rearrange-pages", - }; +export const reorganizePagesOperationConfig = defineSingleFileTool({ + buildFormData, + toApiParams: reorganizePagesToApiParams, + fromApiParams: reorganizePagesFromApiParams, + operationType: "reorganizePages", + endpoint: ENDPOINT, +}); export const useReorganizePagesOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/repair/useRepairOperation.ts b/frontend/editor/src/core/hooks/tools/repair/useRepairOperation.ts index a62f448bac..af05cf59b9 100644 --- a/frontend/editor/src/core/hooks/tools/repair/useRepairOperation.ts +++ b/frontend/editor/src/core/hooks/tools/repair/useRepairOperation.ts @@ -1,32 +1,38 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + fileOnlyMapping, + objectToFormData, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { RepairParameters, defaultParameters, } from "@app/hooks/tools/repair/useRepairParameters"; -// Static function that can be used by both the hook and automation executor +const ENDPOINT = "/api/v1/misc/repair" satisfies ToolEndpoint; + +// Repair takes only a file; there are no request parameters to map. +const { toApiParams, fromApiParams } = fileOnlyMapping(); + export const buildRepairFormData = ( _parameters: RepairParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - return formData; -}; +): FormData => objectToFormData(toApiParams(), { fileInput: file }); // Static configuration object -export const repairOperationConfig = { - toolType: ToolType.singleFile, +export const repairOperationConfig = defineSingleFileTool({ buildFormData: buildRepairFormData, + toApiParams, + fromApiParams, operationType: "repair", - endpoint: "/api/v1/misc/repair", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useRepairOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/replaceColor/useReplaceColorOperation.ts b/frontend/editor/src/core/hooks/tools/replaceColor/useReplaceColorOperation.ts index dd24c10e22..33223afa43 100644 --- a/frontend/editor/src/core/hooks/tools/replaceColor/useReplaceColorOperation.ts +++ b/frontend/editor/src/core/hooks/tools/replaceColor/useReplaceColorOperation.ts @@ -1,44 +1,75 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { ReplaceColorParameters, defaultParameters, } from "@app/hooks/tools/replaceColor/useReplaceColorParameters"; +const ENDPOINT = "/api/v1/misc/replace-invert-pdf" satisfies ToolEndpoint; +type ReplaceColorApiParams = ToolApiParams[typeof ENDPOINT]; + +export const replaceColorToApiParams = ( + parameters: ReplaceColorParameters, +): ReplaceColorApiParams => { + const apiParams: ReplaceColorApiParams = { + replaceAndInvertOption: parameters.replaceAndInvertOption, + }; + + if (parameters.replaceAndInvertOption === "HIGH_CONTRAST_COLOR") { + apiParams.highContrastColorCombination = + parameters.highContrastColorCombination; + } else if (parameters.replaceAndInvertOption === "CUSTOM_COLOR") { + apiParams.textColor = parameters.textColor; + apiParams.backGroundColor = parameters.backGroundColor; + } + + return apiParams; +}; + +export const replaceColorFromApiParams = ( + apiParams: ReplaceColorApiParams, +): Partial => { + const result: Partial = { + replaceAndInvertOption: apiParams.replaceAndInvertOption, + }; + + if (apiParams.highContrastColorCombination !== undefined) { + result.highContrastColorCombination = + apiParams.highContrastColorCombination; + } + if (apiParams.textColor !== undefined) { + result.textColor = apiParams.textColor; + } + if (apiParams.backGroundColor !== undefined) { + result.backGroundColor = apiParams.backGroundColor; + } + + return result; +}; + export const buildReplaceColorFormData = ( parameters: ReplaceColorParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); +): FormData => + objectToFormData(replaceColorToApiParams(parameters), { fileInput: file }); - formData.append("replaceAndInvertOption", parameters.replaceAndInvertOption); - - if (parameters.replaceAndInvertOption === "HIGH_CONTRAST_COLOR") { - formData.append( - "highContrastColorCombination", - parameters.highContrastColorCombination, - ); - } else if (parameters.replaceAndInvertOption === "CUSTOM_COLOR") { - formData.append("textColor", parameters.textColor); - formData.append("backGroundColor", parameters.backGroundColor); - } - - return formData; -}; - -export const replaceColorOperationConfig = { - toolType: ToolType.singleFile, +export const replaceColorOperationConfig = defineSingleFileTool({ buildFormData: buildReplaceColorFormData, + toApiParams: replaceColorToApiParams, + fromApiParams: replaceColorFromApiParams, operationType: "replaceColor", - endpoint: "/api/v1/misc/replace-invert-pdf", - multiFileEndpoint: false, + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useReplaceColorOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/rotate/useRotateOperation.test.ts b/frontend/editor/src/core/hooks/tools/rotate/useRotateOperation.test.ts index 5db2b30788..96973db125 100644 --- a/frontend/editor/src/core/hooks/tools/rotate/useRotateOperation.test.ts +++ b/frontend/editor/src/core/hooks/tools/rotate/useRotateOperation.test.ts @@ -30,6 +30,10 @@ import { ToolType, useToolOperation, } from "@app/hooks/tools/shared/useToolOperation"; +import { + rotateFromApiParams, + rotateToApiParams, +} from "@app/hooks/tools/rotate/useRotateOperation"; describe("useRotateOperation", () => { const mockUseToolOperation = vi.mocked(useToolOperation); @@ -114,3 +118,30 @@ describe("useRotateOperation", () => { expect(callArgs[property]).toBe(expectedValue); }); }); + +describe("rotate mappers", () => { + test.each([ + { angle: 0, expected: 0 }, + { angle: 90, expected: 90 }, + { angle: -90, expected: 270 }, + { angle: 450, expected: 90 }, + ])( + "toApiParams normalizes angle $angle to $expected", + ({ angle, expected }) => { + expect(rotateToApiParams({ angle }).angle).toBe(expected); + }, + ); + + test("fromApiParams maps the backend angle back to the UI parameter", () => { + expect(rotateFromApiParams({ angle: 180 })).toEqual({ angle: 180 }); + }); + + test.each([0, 90, 180, 270] as const)( + "round-trips a normalized angle %i", + (angle) => { + const ui = rotateFromApiParams({ angle }); + const api = rotateToApiParams({ angle: ui.angle ?? 0 }); + expect(api).toEqual({ angle }); + }, + ); +}); diff --git a/frontend/editor/src/core/hooks/tools/rotate/useRotateOperation.ts b/frontend/editor/src/core/hooks/tools/rotate/useRotateOperation.ts index e675610eb9..f8c6d32216 100644 --- a/frontend/editor/src/core/hooks/tools/rotate/useRotateOperation.ts +++ b/frontend/editor/src/core/hooks/tools/rotate/useRotateOperation.ts @@ -1,8 +1,13 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { RotateParameters, @@ -10,26 +15,42 @@ import { normalizeAngle, } from "@app/hooks/tools/rotate/useRotateParameters"; +const ENDPOINT = "/api/v1/general/rotate-pdf" satisfies ToolEndpoint; +type RotateApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the rotate-pdf request body. The return +// type is the generated backend model, so a spec change breaks the build here. +export const rotateToApiParams = ( + parameters: RotateParameters, +): RotateApiParams => ({ + // The UI angle can be any multiple of 90 (including negatives or values above + // 360); normalize to the four values the backend accepts. + angle: normalizeAngle(parameters.angle) as RotateApiParams["angle"], +}); + +// Reconstruct the tool's UI parameters from a rotate-pdf request body. +export const rotateFromApiParams = ( + apiParams: RotateApiParams, +): Partial => ({ + angle: apiParams.angle, +}); + // Static configuration that can be used by both the hook and automation executor export const buildRotateFormData = ( parameters: RotateParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - // Normalize angle for backend (0, 90, 180, 270) - formData.append("angle", normalizeAngle(parameters.angle).toString()); - return formData; -}; +): FormData => + objectToFormData(rotateToApiParams(parameters), { fileInput: file }); // Static configuration object -export const rotateOperationConfig = { - toolType: ToolType.singleFile, +export const rotateOperationConfig = defineSingleFileTool({ buildFormData: buildRotateFormData, + toApiParams: rotateToApiParams, + fromApiParams: rotateFromApiParams, operationType: "rotate", - endpoint: "/api/v1/general/rotate-pdf", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useRotateOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/sanitize/useSanitizeOperation.ts b/frontend/editor/src/core/hooks/tools/sanitize/useSanitizeOperation.ts index 9c98b7d57f..26a5ca7250 100644 --- a/frontend/editor/src/core/hooks/tools/sanitize/useSanitizeOperation.ts +++ b/frontend/editor/src/core/hooks/tools/sanitize/useSanitizeOperation.ts @@ -1,54 +1,68 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { SanitizeParameters, defaultParameters, } from "@app/hooks/tools/sanitize/useSanitizeParameters"; +const ENDPOINT = "/api/v1/security/sanitize-pdf" satisfies ToolEndpoint; +type SanitizeApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the sanitize-pdf request body. The +// return type is the generated backend model, so a spec change that renames or +// drops a field breaks the build here. +export const sanitizeToApiParams = ( + parameters: SanitizeParameters, +): SanitizeApiParams => ({ + removeJavaScript: parameters.removeJavaScript ?? false, + removeEmbeddedFiles: parameters.removeEmbeddedFiles ?? false, + removeXMPMetadata: parameters.removeXMPMetadata ?? false, + removeMetadata: parameters.removeMetadata ?? false, + removeLinks: parameters.removeLinks ?? false, + removeFonts: parameters.removeFonts ?? false, +}); + +// Reconstruct the tool's UI parameters from a sanitize-pdf request body, so a +// stored or AI-authored step can be re-rendered in the settings UI. +export const sanitizeFromApiParams = ( + apiParams: SanitizeApiParams, +): Partial => ({ + removeJavaScript: + apiParams.removeJavaScript ?? defaultParameters.removeJavaScript, + removeEmbeddedFiles: + apiParams.removeEmbeddedFiles ?? defaultParameters.removeEmbeddedFiles, + removeXMPMetadata: + apiParams.removeXMPMetadata ?? defaultParameters.removeXMPMetadata, + removeMetadata: apiParams.removeMetadata ?? defaultParameters.removeMetadata, + removeLinks: apiParams.removeLinks ?? defaultParameters.removeLinks, + removeFonts: apiParams.removeFonts ?? defaultParameters.removeFonts, +}); + // Static function that can be used by both the hook and automation executor export const buildSanitizeFormData = ( parameters: SanitizeParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - - // Add parameters - formData.append( - "removeJavaScript", - (parameters.removeJavaScript ?? false).toString(), - ); - formData.append( - "removeEmbeddedFiles", - (parameters.removeEmbeddedFiles ?? false).toString(), - ); - formData.append( - "removeXMPMetadata", - (parameters.removeXMPMetadata ?? false).toString(), - ); - formData.append( - "removeMetadata", - (parameters.removeMetadata ?? false).toString(), - ); - formData.append("removeLinks", (parameters.removeLinks ?? false).toString()); - formData.append("removeFonts", (parameters.removeFonts ?? false).toString()); - - return formData; -}; +): FormData => + objectToFormData(sanitizeToApiParams(parameters), { fileInput: file }); // Static configuration object -export const sanitizeOperationConfig = { - toolType: ToolType.singleFile, +export const sanitizeOperationConfig = defineSingleFileTool({ buildFormData: buildSanitizeFormData, + toApiParams: sanitizeToApiParams, + fromApiParams: sanitizeFromApiParams, operationType: "sanitize", - endpoint: "/api/v1/security/sanitize-pdf", - multiFileEndpoint: false, + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useSanitizeOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitOperation.ts b/frontend/editor/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitOperation.ts index e035c90ce5..26db1414d0 100644 --- a/frontend/editor/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitOperation.ts +++ b/frontend/editor/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitOperation.ts @@ -1,10 +1,15 @@ import { useCallback } from "react"; import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, ToolOperationConfig, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { ScannerImageSplitParameters, @@ -12,28 +17,51 @@ import { } from "@app/hooks/tools/scannerImageSplit/useScannerImageSplitParameters"; import { useToolResources } from "@app/hooks/tools/shared/useToolResources"; +const ENDPOINT = "/api/v1/misc/extract-image-scans" satisfies ToolEndpoint; +type ScannerImageSplitApiParams = ToolApiParams[typeof ENDPOINT]; + +// Convert the tool's UI parameters into the extract-image-scans request body. +// The frontend uses snake_case field names, but the backend model (the contract) +// uses camelCase, so the keys are renamed here. +export const scannerImageSplitToApiParams = ( + parameters: ScannerImageSplitParameters, +): ScannerImageSplitApiParams => ({ + angleThreshold: parameters.angle_threshold, + tolerance: parameters.tolerance, + minArea: parameters.min_area, + minContourArea: parameters.min_contour_area, + borderSize: parameters.border_size, +}); + +// Reconstruct the tool's UI parameters from an extract-image-scans request body, +// so a stored or AI-authored step can be re-rendered in the settings UI. +export const scannerImageSplitFromApiParams = ( + apiParams: ScannerImageSplitApiParams, +): Partial => ({ + angle_threshold: apiParams.angleThreshold, + tolerance: apiParams.tolerance, + min_area: apiParams.minArea, + min_contour_area: apiParams.minContourArea, + border_size: apiParams.borderSize, +}); + export const buildScannerImageSplitFormData = ( parameters: ScannerImageSplitParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - formData.append("angle_threshold", parameters.angle_threshold.toString()); - formData.append("tolerance", parameters.tolerance.toString()); - formData.append("min_area", parameters.min_area.toString()); - formData.append("min_contour_area", parameters.min_contour_area.toString()); - formData.append("border_size", parameters.border_size.toString()); - return formData; -}; +): FormData => + objectToFormData(scannerImageSplitToApiParams(parameters), { + fileInput: file, + }); // Static configuration object -export const scannerImageSplitOperationConfig = { - toolType: ToolType.singleFile, +export const scannerImageSplitOperationConfig = defineSingleFileTool({ buildFormData: buildScannerImageSplitFormData, + toApiParams: scannerImageSplitToApiParams, + fromApiParams: scannerImageSplitFromApiParams, operationType: "scannerImageSplit", - endpoint: "/api/v1/misc/extract-image-scans", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useScannerImageSplitOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/shared/migratedToolMappers.test.ts b/frontend/editor/src/core/hooks/tools/shared/migratedToolMappers.test.ts new file mode 100644 index 0000000000..d562384921 --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/shared/migratedToolMappers.test.ts @@ -0,0 +1,179 @@ +import { describe, expect, test } from "vitest"; +import { + ToolType, + type RegistryToolOperationConfig, +} from "@app/hooks/tools/shared/toolOperationTypes"; +import { objectToFormData } from "@app/hooks/tools/shared/toolApiMapping"; + +// Pilot tools. +import { compressOperationConfig } from "@app/hooks/tools/compress/useCompressOperation"; +import { rotateOperationConfig } from "@app/hooks/tools/rotate/useRotateOperation"; +import { mergeOperationConfig } from "@app/hooks/tools/merge/useMergeOperation"; +import { splitOperationConfig } from "@app/hooks/tools/split/useSplitOperation"; +// Rolled out in Phase 3. +import { addAttachmentsOperationConfig } from "@app/hooks/tools/addAttachments/useAddAttachmentsOperation"; +import { addPageNumbersOperationConfig } from "@app/components/tools/addPageNumbers/useAddPageNumbersOperation"; +import { addPasswordOperationConfig } from "@app/hooks/tools/addPassword/useAddPasswordOperation"; +import { addStampOperationConfig } from "@app/components/tools/addStamp/useAddStampOperation"; +import { addWatermarkOperationConfig } from "@app/hooks/tools/addWatermark/useAddWatermarkOperation"; +import { adjustPageScaleOperationConfig } from "@app/hooks/tools/adjustPageScale/useAdjustPageScaleOperation"; +import { autoRenameOperationConfig } from "@app/hooks/tools/autoRename/useAutoRenameOperation"; +import { bookletImpositionOperationConfig } from "@app/hooks/tools/bookletImposition/useBookletImpositionOperation"; +import { certSignOperationConfig } from "@app/hooks/tools/certSign/useCertSignOperation"; +import { changeMetadataOperationConfig } from "@app/hooks/tools/changeMetadata/useChangeMetadataOperation"; +import { changePermissionsOperationConfig } from "@app/hooks/tools/changePermissions/useChangePermissionsOperation"; +import { cropOperationConfig } from "@app/hooks/tools/crop/useCropOperation"; +import { editTableOfContentsOperationConfig } from "@app/hooks/tools/editTableOfContents/useEditTableOfContentsOperation"; +import { extractImagesOperationConfig } from "@app/hooks/tools/extractImages/useExtractImagesOperation"; +import { flattenOperationConfig } from "@app/hooks/tools/flatten/useFlattenOperation"; +import { ocrOperationConfig } from "@app/hooks/tools/ocr/useOCROperation"; +import { overlayPdfsOperationConfig } from "@app/hooks/tools/overlayPdfs/useOverlayPdfsOperation"; +import { pageLayoutOperationConfig } from "@app/hooks/tools/pageLayout/usePageLayoutOperation"; +import { redactOperationConfig } from "@app/hooks/tools/redact/useRedactOperation"; +import { removeBlanksOperationConfig } from "@app/hooks/tools/removeBlanks/useRemoveBlanksOperation"; +import { removeCertificateSignOperationConfig } from "@app/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation"; +import { removeImageOperationConfig } from "@app/hooks/tools/removeImage/useRemoveImageOperation"; +import { removePagesOperationConfig } from "@app/hooks/tools/removePages/useRemovePagesOperation"; +import { removePasswordOperationConfig } from "@app/hooks/tools/removePassword/useRemovePasswordOperation"; +import { reorganizePagesOperationConfig } from "@app/hooks/tools/reorganizePages/useReorganizePagesOperation"; +import { repairOperationConfig } from "@app/hooks/tools/repair/useRepairOperation"; +import { replaceColorOperationConfig } from "@app/hooks/tools/replaceColor/useReplaceColorOperation"; +import { sanitizeOperationConfig } from "@app/hooks/tools/sanitize/useSanitizeOperation"; +import { scannerImageSplitOperationConfig } from "@app/hooks/tools/scannerImageSplit/useScannerImageSplitOperation"; +import { singleLargePageOperationConfig } from "@app/hooks/tools/singleLargePage/useSingleLargePageOperation"; +import { timestampPdfOperationConfig } from "@app/hooks/tools/timestampPdf/useTimestampPdfOperation"; +import { unlockPdfFormsOperationConfig } from "@app/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation"; + +// Every tool migrated to the mapper seam. Erased to the registry shape so one +// loop can invoke toApiParams(defaultParameters) uniformly regardless of the +// tool's own parameter type. +const MIGRATED_CONFIGS = [ + compressOperationConfig, + rotateOperationConfig, + mergeOperationConfig, + splitOperationConfig, + addAttachmentsOperationConfig, + addPageNumbersOperationConfig, + addPasswordOperationConfig, + addStampOperationConfig, + addWatermarkOperationConfig, + adjustPageScaleOperationConfig, + autoRenameOperationConfig, + bookletImpositionOperationConfig, + certSignOperationConfig, + changeMetadataOperationConfig, + changePermissionsOperationConfig, + cropOperationConfig, + editTableOfContentsOperationConfig, + extractImagesOperationConfig, + flattenOperationConfig, + ocrOperationConfig, + overlayPdfsOperationConfig, + pageLayoutOperationConfig, + redactOperationConfig, + removeBlanksOperationConfig, + removeCertificateSignOperationConfig, + removeImageOperationConfig, + removePagesOperationConfig, + removePasswordOperationConfig, + reorganizePagesOperationConfig, + repairOperationConfig, + replaceColorOperationConfig, + sanitizeOperationConfig, + scannerImageSplitOperationConfig, + singleLargePageOperationConfig, + timestampPdfOperationConfig, + unlockPdfFormsOperationConfig, + // Erase each tool's own TParams to the shared registry shape (the same + // existential boundary asRegistryConfig applies) so one loop can call + // toApiParams(defaultParameters) uniformly. +] as unknown as RegistryToolOperationConfig[]; + +// A few tools have no static defaultParameters (the UI always supplies a value); +// give the sweep a minimal valid parameter set for those. +const FALLBACK_PARAMS: Record> = { + editTableOfContents: { bookmarks: [], replaceExisting: false }, +}; + +describe("migrated tool mappers (sweep)", () => { + const file = new File(["x"], "test.pdf", { type: "application/pdf" }); + + test.each( + MIGRATED_CONFIGS.map((config) => [config.operationType, config] as const), + )( + "%s: exposes both mappers and serializes its default parameters cleanly", + (_name, config) => { + // Every migrated tool authors both directions of the mapping. + expect(config.toApiParams).toBeDefined(); + expect(config.fromApiParams).toBeDefined(); + + // Serialize the defaults through the tool's own buildFormData - the real + // path the executor uses - so a tool whose toApiParams carries a structured + // field that buildFormData flattens itself (e.g. changeMetadata's + // allRequestParams map) is exercised too, not just tools whose mapper + // output is directly objectToFormData-able. Custom tools have no + // buildFormData, so fall back to serializing the mapper output directly. + const params = + config.defaultParameters ?? FALLBACK_PARAMS[config.operationType] ?? {}; + if (config.toolType === ToolType.multiFile) { + const build = config.buildFormData; + expect(() => build(params, [file])).not.toThrow(); + } else if (config.toolType === ToolType.singleFile) { + const build = config.buildFormData; + expect(() => build(params, file)).not.toThrow(); + } else { + const toApiParams = config.toApiParams!; + expect(() => + objectToFormData(toApiParams(params), { fileInput: file }), + ).not.toThrow(); + } + }, + ); +}); + +describe("redact mappers", () => { + test("toApiParams builds the auto-redact body from UI parameters", () => { + const api = redactOperationConfig.toApiParams!({ + mode: "automatic", + wordsToRedact: ["foo", "bar"], + useRegex: true, + wholeWordSearch: false, + redactColor: "#ff0000", + customPadding: 0.2, + convertPDFToImage: false, + }); + + expect(api).toEqual({ + listOfText: "foo\nbar", + useRegex: true, + wholeWordSearch: false, + redactColor: "ff0000", // '#' stripped for the backend + customPadding: 0.2, + convertPDFToImage: false, + }); + }); + + test("round-trips through fromApiParams", () => { + const api = redactOperationConfig.toApiParams!({ + mode: "automatic", + wordsToRedact: ["secret"], + useRegex: false, + wholeWordSearch: true, + redactColor: "#123456", + customPadding: 0.1, + convertPDFToImage: true, + }); + const roundTripped = redactOperationConfig.toApiParams!({ + mode: "automatic", + wordsToRedact: [], + useRegex: false, + wholeWordSearch: false, + redactColor: "#000000", + customPadding: 0, + convertPDFToImage: false, + ...redactOperationConfig.fromApiParams!(api), + }); + + expect(roundTripped).toEqual(api); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/shared/toolApiMapping.test.ts b/frontend/editor/src/core/hooks/tools/shared/toolApiMapping.test.ts new file mode 100644 index 0000000000..ba8c0bc2be --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/shared/toolApiMapping.test.ts @@ -0,0 +1,94 @@ +import { describe, expect, test } from "vitest"; +import { + isToolEndpoint, + objectToFormData, + type ToolApiParams, +} from "@app/hooks/tools/shared/toolApiMapping"; + +describe("isToolEndpoint", () => { + test("accepts a generated endpoint and rejects an unknown path", () => { + expect(isToolEndpoint("/api/v1/misc/compress-pdf")).toBe(true); + expect(isToolEndpoint("/api/v1/misc/not-a-real-tool")).toBe(false); + expect(isToolEndpoint("")).toBe(false); + }); +}); + +describe("objectToFormData", () => { + test("serializes primitive fields to string form values", () => { + const request: ToolApiParams["/api/v1/misc/compress-pdf"] = { + optimizeLevel: 3, + grayscale: true, + linearize: false, + expectedOutputSize: "25KB", + }; + const formData = objectToFormData(request); + + expect(formData.get("optimizeLevel")).toBe("3"); + expect(formData.get("grayscale")).toBe("true"); + expect(formData.get("linearize")).toBe("false"); + expect(formData.get("expectedOutputSize")).toBe("25KB"); + }); + + test("omits fields whose value is undefined", () => { + const request: ToolApiParams["/api/v1/misc/compress-pdf"] = { + optimizeLevel: 5, + expectedOutputSize: undefined, + }; + const formData = objectToFormData(request); + + expect(formData.has("optimizeLevel")).toBe(true); + expect(formData.has("expectedOutputSize")).toBe(false); + }); + + test("expands arrays into repeated fields", () => { + const request: ToolApiParams["/api/v1/misc/add-attachments"] = { + attachments: ["a.png", "b.png", "c.png"], + }; + const formData = objectToFormData(request); + + expect(formData.getAll("attachments")).toEqual(["a.png", "b.png", "c.png"]); + }); + + test("throws on a non-primitive field value rather than dropping it", () => { + // A redact request whose structured field was left un-encoded: the array + // items are objects, which cannot be sent as form fields. + const request: ToolApiParams["/api/v1/security/redact"] = { + redactions: [{ x: 1, y: 2 }], + }; + + expect(() => objectToFormData(request)).toThrow(/field "redactions"/); + }); + + test("appends a single file under its field name", () => { + const file = new File(["x"], "doc.pdf", { type: "application/pdf" }); + const request: ToolApiParams["/api/v1/misc/compress-pdf"] = { + optimizeLevel: 5, + }; + const formData = objectToFormData(request, { fileInput: file }); + + expect(formData.get("fileInput")).toBe(file); + expect(formData.get("optimizeLevel")).toBe("5"); + }); + + test("appends multiple files under the same field name", () => { + const files = [ + new File(["1"], "a.pdf", { type: "application/pdf" }), + new File(["2"], "b.pdf", { type: "application/pdf" }), + ]; + const formData = objectToFormData({}, { fileInput: files }); + + expect(formData.getAll("fileInput")).toEqual(files); + }); + + test("appends named file fields alongside fileInput", () => { + const doc = new File(["d"], "doc.pdf", { type: "application/pdf" }); + const stamp = new File(["s"], "stamp.png", { type: "image/png" }); + const formData = objectToFormData( + {}, + { fileInput: doc, stampImage: stamp }, + ); + + expect(formData.get("fileInput")).toBe(doc); + expect(formData.get("stampImage")).toBe(stamp); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/shared/toolApiMapping.ts b/frontend/editor/src/core/hooks/tools/shared/toolApiMapping.ts new file mode 100644 index 0000000000..9c6f5d9e4b --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/shared/toolApiMapping.ts @@ -0,0 +1,99 @@ +import { + TOOL_ENDPOINTS, + type ToolApiParams, + type ToolApiRequest, + type ToolEndpoint, +} from "@app/types/toolApiTypes"; + +export type { ToolApiParams, ToolApiRequest, ToolEndpoint }; + +const TOOL_ENDPOINT_SET: ReadonlySet = new Set(TOOL_ENDPOINTS); + +/** + * Runtime check that a string is one of the generated tool endpoints, so callers can narrow an + * arbitrary endpoint path to {@link ToolEndpoint} against the real supported set rather than casting. + */ +export function isToolEndpoint(value: string): value is ToolEndpoint { + return TOOL_ENDPOINT_SET.has(value); +} + +/** + * Mapping for tools that take only a file and have no request parameters (their + * generated model is `Record`). Both directions are empty; the + * tool's buildFormData just appends the file. + */ +export function fileOnlyMapping(): { + toApiParams: () => Record; + fromApiParams: () => Record; +} { + return { toApiParams: () => ({}), fromApiParams: () => ({}) }; +} + +/** Named file fields to append alongside the serialized parameters. */ +export interface FormDataFiles { + /** Primary document input(s); appended under the `fileInput` field. */ + fileInput?: File | File[]; + /** Any other named file field the endpoint accepts. */ + [field: string]: File | File[] | undefined; +} + +function appendPrimitive( + formData: FormData, + key: string, + value: unknown, +): void { + if (value === undefined || value === null) return; + if (typeof value === "string") { + formData.append(key, value); + } else if (typeof value === "number" || typeof value === "boolean") { + formData.append(key, `${value}`); + } else { + // A non-primitive here means a mapper produced a value the backend cannot + // receive as a form field. Fail loudly rather than silently drop it: + // structured fields must be JSON-encoded in the mapper, and Files passed via + // the `files` argument. + throw new Error( + `objectToFormData: field "${key}" has an unsupported value of type ` + + `"${typeof value}"; expected a string, number, or boolean.`, + ); + } +} + +/** + * Serialize a backend request model (the output of a `toApiParams` function) + * into multipart FormData: primitives become string fields, arrays become + * repeated fields, and `undefined`/`null` are omitted. Files are appended + * separately via `files`, keeping file plumbing out of the parameter mapper. + * + * Throws if a field holds a non-primitive value, since that cannot be sent as a + * form field: structured fields must be JSON-encoded by the mapper. + */ +export function objectToFormData( + params: ToolApiRequest, + files?: FormDataFiles, +): FormData { + const formData = new FormData(); + + for (const [key, value] of Object.entries(params)) { + if (Array.isArray(value)) { + for (const item of value) { + appendPrimitive(formData, key, item); + } + } else { + appendPrimitive(formData, key, value); + } + } + + if (files) { + for (const [field, value] of Object.entries(files)) { + if (value === undefined) continue; + if (Array.isArray(value)) { + value.forEach((file) => formData.append(field, file)); + } else { + formData.append(field, value); + } + } + } + + return formData; +} diff --git a/frontend/editor/src/core/hooks/tools/shared/toolAutomation.test.ts b/frontend/editor/src/core/hooks/tools/shared/toolAutomation.test.ts new file mode 100644 index 0000000000..03b85798d8 --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/shared/toolAutomation.test.ts @@ -0,0 +1,215 @@ +import { describe, expect, test } from "vitest"; +import { + ToolCategoryId, + SubcategoryId, + type ToolRegistry, + type ToolRegistryEntry, +} from "@app/data/toolsTaxonomy"; +import { type ToolId } from "@app/types/toolId"; +import { + asRegistryConfig, + ToolType, +} from "@app/hooks/tools/shared/toolOperationTypes"; +import { + deserializeToolStep, + getExecutableTools, + serializeToolStep, + stepRequiresUpload, + type WorkingToolStep, +} from "@app/hooks/tools/shared/toolAutomation"; +import { compressOperationConfig } from "@app/hooks/tools/compress/useCompressOperation"; +import { defaultParameters as compressDefaults } from "@app/hooks/tools/compress/useCompressParameters"; +import { splitOperationConfig } from "@app/hooks/tools/split/useSplitOperation"; +import { SPLIT_METHODS } from "@app/constants/splitConstants"; +import { redactOperationConfig } from "@app/hooks/tools/redact/useRedactOperation"; + +function entry(over: Partial): ToolRegistryEntry { + return { + icon: null, + name: "", + component: null, + description: "", + categoryId: ToolCategoryId.RECOMMENDED_TOOLS, + subcategoryId: SubcategoryId.GENERAL, + automationSettings: null, + ...over, + }; +} + +const NoopSettings = () => null; + +// A migrated, param-less config (mappers present, no settings UI) -> "noSettings". +const repairConfig = asRegistryConfig({ + toolType: ToolType.singleFile, + operationType: "repair", + endpoint: "/api/v1/misc/repair", + defaultParameters: {}, + buildFormData: () => new FormData(), + toApiParams: () => ({}), + fromApiParams: () => ({}), +}); + +// A config with no mappers (not migrated) -> "unsupported". +const changeMetadataConfig = asRegistryConfig({ + toolType: ToolType.singleFile, + operationType: "changeMetadata", + endpoint: "/api/v1/misc/update-metadata", + defaultParameters: {}, + buildFormData: () => new FormData(), +}); + +const registry: Partial = { + compress: entry({ + name: "Compress", + automationSettings: NoopSettings, + operationConfig: asRegistryConfig(compressOperationConfig), + }), + repair: entry({ name: "Repair", operationConfig: repairConfig }), + changeMetadata: entry({ + name: "Change metadata", + automationSettings: NoopSettings, + operationConfig: changeMetadataConfig, + }), + // Excluded: automation explicitly off. + sign: entry({ + name: "Sign", + supportsAutomate: false, + operationConfig: repairConfig, + }), + // Excluded: no operationConfig at all. + extractPages: entry({ name: "Extract pages" }), +}; + +// Separate registry so these don't change the getExecutableTools expectations above. +const dynamicRegistry: Partial = { + split: entry({ + name: "Split", + automationSettings: NoopSettings, + operationConfig: asRegistryConfig(splitOperationConfig), + }), + redact: entry({ + name: "Redact", + automationSettings: NoopSettings, + operationConfig: asRegistryConfig(redactOperationConfig), + }), +}; + +describe("getExecutableTools", () => { + test("lists automatable tools with a resolvable endpoint, classified by support", () => { + const tools = getExecutableTools(registry); + expect(tools.map((t) => t.toolId)).toEqual([ + "changeMetadata", + "compress", + "repair", + ]); + expect(Object.fromEntries(tools.map((t) => [t.toolId, t.support]))).toEqual( + { + compress: "editable", + repair: "noSettings", + changeMetadata: "unsupported", + }, + ); + }); +}); + +describe("serialize/deserialize round-trip", () => { + test("compress maps UI params to the backend body and back", () => { + const step: WorkingToolStep = { + toolId: "compress" as ToolId, + operation: "/api/v1/misc/compress-pdf", + params: { + ...compressDefaults, + compressionLevel: 7, + compressionMethod: "filesize", + fileSizeValue: "2", + fileSizeUnit: "MB", + }, + support: "editable", + }; + + const api = serializeToolStep(step, registry); + expect(api.operation).toBe("/api/v1/misc/compress-pdf"); + expect(api.parameters).toMatchObject({ + optimizeLevel: 7, + expectedOutputSize: "2MB", + }); + + const back = deserializeToolStep(api, registry); + expect(back.toolId).toBe("compress"); + expect(back.params).toMatchObject({ + compressionLevel: 7, + compressionMethod: "filesize", + fileSizeValue: "2", + fileSizeUnit: "MB", + }); + }); + + test("an unknown endpoint is preserved as an unmapped step", () => { + const step = deserializeToolStep( + { operation: "/api/v1/unknown/thing", parameters: { keep: true } }, + registry, + ); + expect(step.toolId).toBeNull(); + expect(step.support).toBe("unknown"); + expect(serializeToolStep(step, registry)).toEqual({ + operation: "/api/v1/unknown/thing", + parameters: { keep: true }, + }); + }); + + test("a dynamic-endpoint tool (split by chapters) round-trips as an editable step", () => { + const step: WorkingToolStep = { + toolId: "split" as ToolId, + operation: "/api/v1/general/split-pdf-by-chapters", + params: { method: SPLIT_METHODS.BY_CHAPTERS, bookmarkLevel: "2" }, + support: "editable", + }; + + const api = serializeToolStep(step, dynamicRegistry); + expect(api.operation).toBe("/api/v1/general/split-pdf-by-chapters"); + expect(api.parameters).toMatchObject({ bookmarkLevel: 2 }); + + // No `method` in the stored body, so this only matches via the declared endpoint set. + const back = deserializeToolStep(api, dynamicRegistry); + expect(back.toolId).toBe("split"); + expect(back.support).toBe("editable"); + expect(back.operation).toBe("/api/v1/general/split-pdf-by-chapters"); + expect(back.params).toMatchObject({ method: SPLIT_METHODS.BY_CHAPTERS }); + }); + + test("a dynamic-endpoint tool whose routing field is dropped (redact) stays editable", () => { + const step: WorkingToolStep = { + toolId: "redact" as ToolId, + operation: "/api/v1/security/auto-redact", + params: { mode: "automatic", wordsToRedact: ["secret"] }, + support: "editable", + }; + + const api = serializeToolStep(step, dynamicRegistry); + expect(api.operation).toBe("/api/v1/security/auto-redact"); + expect(api.parameters).not.toHaveProperty("mode"); + + // No `mode` in the body, so it only matches via the declared set (replay would yield null). + const back = deserializeToolStep(api, dynamicRegistry); + expect(back.toolId).toBe("redact"); + expect(back.support).toBe("editable"); + expect(back.operation).toBe("/api/v1/security/auto-redact"); + expect(back.params).toMatchObject({ mode: "automatic" }); + }); +}); + +describe("stepRequiresUpload", () => { + const step = (params: Record): WorkingToolStep => ({ + toolId: "compress" as ToolId, + operation: "/api/v1/misc/compress-pdf", + params, + support: "editable", + }); + + test("detects a File (or list of Files) among the parameters", () => { + const image = new File(["x"], "logo.png", { type: "image/png" }); + expect(stepRequiresUpload(step({ level: 5 }))).toBe(false); + expect(stepRequiresUpload(step({ watermarkImage: image }))).toBe(true); + expect(stepRequiresUpload(step({ attachments: [image] }))).toBe(true); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/shared/toolAutomation.ts b/frontend/editor/src/core/hooks/tools/shared/toolAutomation.ts new file mode 100644 index 0000000000..d567a1dad1 --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/shared/toolAutomation.ts @@ -0,0 +1,260 @@ +/** + * Registry-level automation logic: which tools can be run as a backend operation step, how much + * of their parameters can be edited in a UI, and conversion between a tool's frontend parameter + * shape and the backend step contract (endpoint + backend parameters). + * + * This is core behaviour shared by every surface that composes or replays tool operations against + * the backend engine (portal pipelines today; backend-executed automations and AI plans later), + * so the "is this tool usable, and how" decision lives with the tools rather than in any one + * feature. It builds on each tool's `operationConfig` mappers (`toApiParams` / `fromApiParams`), + * keeping the frontend<->backend parameter mapping single-sourced in the tools. + */ + +import { type ReactNode } from "react"; +import { + getToolSupportsAutomate, + type SubcategoryId, + type ToolRegistry, + type ToolRegistryEntry, +} from "@app/data/toolsTaxonomy"; +import { type ToolId } from "@app/types/toolId"; +import { + isToolEndpoint, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; +import { + type ErasedToolParams, + type RegistryToolOperationConfig, +} from "@app/hooks/tools/shared/toolOperationTypes"; + +/** + * How much of a tool's parameters a UI can edit when composing a backend step: + * - `editable`: has both mappers and a settings UI -> render the settings UI. + * - `noSettings`: migrated to the mapper seam but has no parameters to configure. + * - `unsupported`: not migrated to the mapper seam -> parameters can't be mapped for editing yet; + * the step runs with the backend's defaults. + */ +export type ToolStepSupport = "editable" | "noSettings" | "unsupported"; + +/** A tool that can be added to a backend operation chain, with its editing support. */ +export interface ExecutableTool { + toolId: ToolId; + name: string; + icon: ReactNode; + /** Subcategory the tool belongs to, so a picker can group tools without re-reading the registry. */ + subcategoryId: SubcategoryId; + /** Endpoint resolved from default parameters, for display/inclusion. The stored step's endpoint is re-resolved from the configured parameters at serialization time. */ + endpoint: ToolEndpoint; + support: ToolStepSupport; +} + +/** + * The backend step contract: an endpoint path plus its backend-shaped parameters. `operation` is a + * plain string, not a {@link ToolEndpoint}, because this is the raw backend boundary (it mirrors + * the stored policy step) and a pipeline may reference endpoints the frontend does not model. + */ +export interface ToolApiStep { + operation: string; + parameters: Record; +} + +/** A step being edited in a UI that maps to a known tool: parameters are in the tool's frontend shape. */ +export interface KnownToolStep { + toolId: ToolId; + operation: ToolEndpoint; + params: ErasedToolParams; + support: ToolStepSupport; +} + +/** A stored step whose endpoint maps to no known tool: preserved verbatim, not editable. */ +export interface UnknownToolStep { + toolId: null; + operation: string; + params: ErasedToolParams; + support: "unknown"; +} + +/** A step being edited in a UI, discriminated by whether its endpoint maps to a known tool. */ +export type WorkingToolStep = KnownToolStep | UnknownToolStep; + +/** + * Resolve a tool's endpoint from parameters. Static endpoints ignore params; dynamic ones may + * return undefined if the params don't determine one. The result is validated against the generated + * endpoint set (via {@link isToolEndpoint}) rather than cast, so a config endpoint that is not a + * known {@link ToolEndpoint} (e.g. a custom tool's arbitrary string) resolves to undefined. + */ +function resolveEndpoint( + config: RegistryToolOperationConfig | undefined, + params: ErasedToolParams, +): ToolEndpoint | undefined { + const endpoint = config?.endpoint; + if (typeof endpoint === "string") { + return isToolEndpoint(endpoint) ? endpoint : undefined; + } + if (typeof endpoint === "function") { + const resolved = safeCall(endpoint, params); + return typeof resolved === "string" && isToolEndpoint(resolved) + ? resolved + : undefined; + } + return undefined; +} + +/** Invoke a dynamic-endpoint function defensively; a throw means the params don't determine one. */ +function safeCall( + fn: (params: ErasedToolParams) => string | null | undefined, + params: ErasedToolParams, +): string | null | undefined { + try { + return fn(params); + } catch { + return undefined; + } +} + +/** Classify how much of a tool's parameters a UI can edit when composing a step. */ +export function classifyToolStepSupport( + entry: ToolRegistryEntry, +): ToolStepSupport { + const config = entry.operationConfig; + const hasMappers = Boolean(config?.toApiParams && config?.fromApiParams); + if (!hasMappers) return "unsupported"; + return entry.automationSettings ? "editable" : "noSettings"; +} + +function isFileValue(value: unknown): boolean { + if (typeof File === "undefined") return false; + if (value instanceof File) return true; + return Array.isArray(value) && value.some((item) => item instanceof File); +} + +/** + * True if any of a step's parameters is an uploaded file (or list of files). Such a step cannot be + * saved into a stored pipeline yet: the file bytes are not persisted with the policy, so a later + * (e.g. scheduled) run would have nothing to send for that named file field. + */ +export function stepRequiresUpload(step: WorkingToolStep): boolean { + return Object.values(step.params).some(isFileValue); +} + +/** + * The tools that can be run as a backend operation step, sorted by name. Includes only automatable + * tools whose endpoint resolves from defaults (so they can become a backend step); this drops + * tools with no operationConfig and tools whose endpoint needs runtime input (e.g. convert). + */ +export function getExecutableTools( + registry: Partial, +): ExecutableTool[] { + const tools: ExecutableTool[] = []; + for (const [id, entry] of Object.entries(registry)) { + if (!entry || !getToolSupportsAutomate(entry)) continue; + const config = entry.operationConfig; + if (!config) continue; + const endpoint = resolveEndpoint(config, config.defaultParameters ?? {}); + if (!endpoint) continue; + tools.push({ + toolId: id as ToolId, + name: entry.name, + icon: entry.icon, + subcategoryId: entry.subcategoryId, + endpoint, + support: classifyToolStepSupport(entry), + }); + } + return tools.sort((a, b) => a.name.localeCompare(b.name)); +} + +/** A fresh working step for a tool just added to a chain, seeded with its default parameters. */ +export function newWorkingToolStep( + tool: ExecutableTool, + registry: Partial, +): KnownToolStep { + const config = registry[tool.toolId]?.operationConfig; + return { + toolId: tool.toolId, + operation: tool.endpoint, + params: { ...(config?.defaultParameters ?? {}) }, + support: tool.support, + }; +} + +/** Serialize a working step into the backend step contract (endpoint + backend parameters). */ +export function serializeToolStep( + step: WorkingToolStep, + registry: Partial, +): ToolApiStep { + const config = + step.toolId !== null ? registry[step.toolId]?.operationConfig : undefined; + if (!config) { + // Unmapped step (unknown endpoint on edit): round-trip it unchanged. + return { operation: step.operation, parameters: step.params }; + } + const merged = { ...(config.defaultParameters ?? {}), ...step.params }; + const operation = resolveEndpoint(config, merged) ?? step.operation; + const parameters = config.toApiParams + ? (config.toApiParams(merged) as Record) + : {}; + return { operation, parameters }; +} + +/** + * Find the registry tool for a stored step's endpoint: exact match for static endpoints, else + * membership in a dynamic tool's declared `endpoints` set (replaying its function can't recover a + * frontend-only routing field). Replay is only the fallback when no set is declared. + */ +function findToolByEndpoint( + step: ToolApiStep, + registry: Partial, +): [ToolId, ToolRegistryEntry] | undefined { + let dynamic: [ToolId, ToolRegistryEntry] | undefined; + for (const [id, entry] of Object.entries(registry)) { + const endpoint = entry?.operationConfig?.endpoint; + if (typeof endpoint === "string") { + if (endpoint === step.operation) return [id as ToolId, entry]; + } else if (typeof endpoint === "function" && !dynamic) { + const declared = entry?.operationConfig?.endpoints; + const matched = declared + ? declared.some((e) => e === step.operation) + : safeCall(endpoint, step.parameters) === step.operation; + if (matched) dynamic = [id as ToolId, entry]; + } + } + return dynamic; +} + +/** A stored step kept verbatim because its endpoint maps to no known tool. */ +function unmappedStep(step: ToolApiStep): UnknownToolStep { + return { + toolId: null, + operation: step.operation, + params: { ...step.parameters }, + support: "unknown", + }; +} + +/** + * Rehydrate a stored backend step into a working step for editing: map the endpoint back to a tool + * and its backend parameters back to the frontend shape via `fromApiParams`. Steps whose endpoint + * maps to no known tool are kept as an unmapped, non-editable working step (parameters preserved). + */ +export function deserializeToolStep( + step: ToolApiStep, + registry: Partial, +): WorkingToolStep { + const match = findToolByEndpoint(step, registry); + if (!match) return unmappedStep(step); + const [toolId, entry] = match; + const config = entry.operationConfig; + const params: ErasedToolParams = config?.fromApiParams + ? { + ...(config.defaultParameters ?? {}), + ...config.fromApiParams(step.parameters as never), + } + : { ...(config?.defaultParameters ?? {}) }; + // Validate against the generated endpoint set instead of casting the matched string. + const operation = + resolveEndpoint(config, params) ?? + (isToolEndpoint(step.operation) ? step.operation : undefined); + if (operation === undefined) return unmappedStep(step); + return { toolId, operation, params, support: classifyToolStepSupport(entry) }; +} diff --git a/frontend/editor/src/core/hooks/tools/shared/toolOperationTypes.ts b/frontend/editor/src/core/hooks/tools/shared/toolOperationTypes.ts index 0d48ce6d09..321443f463 100644 --- a/frontend/editor/src/core/hooks/tools/shared/toolOperationTypes.ts +++ b/frontend/editor/src/core/hooks/tools/shared/toolOperationTypes.ts @@ -3,9 +3,16 @@ import { StirlingFile } from "@app/types/fileContext"; import type { ResponseHandler } from "@app/utils/toolResponseProcessor"; import { ToolId } from "@app/types/toolId"; import type { ProcessingProgress } from "@app/hooks/tools/shared/useToolState"; +import type { ToolApiParams, ToolEndpoint } from "@app/types/toolApiTypes"; export type { ProcessingProgress, ResponseHandler }; +/** + * A tool operation's backend endpoint, checked against the generated ToolEndpoint + * set, or `null` when the operation has no backend endpoint. + */ +export type ToolOperationEndpoint = ToolEndpoint | null; + export enum ToolType { singleFile, multiFile, @@ -46,7 +53,7 @@ export interface CustomProcessorResult { * 2. Multi-file tools: toolType: multiFile, single API call with all files * 3. Complex tools: toolType: custom, customProcessor handles all processing logic */ -interface BaseToolOperationConfig { +interface BaseToolOperationConfig { /** Operation identifier for tracking and logging */ operationType: ToolId; @@ -72,6 +79,20 @@ interface BaseToolOperationConfig { /** Default parameter values for automation */ defaultParameters?: TParams; + /** + * Typed frontend params -> backend request model. When a tool provides this, + * it is the spec-checked source of truth for the request body and its + * buildFormData is derived from it via objectToFormData. Bound to the tool's + * endpoint, so a spec rename of that endpoint's model breaks the build here. + */ + toApiParams?(params: TParams): ToolApiParams[TEndpoint]; + + /** + * Backend request model -> partial frontend params, so a stored API call + * can be re-hydrated into this tool's settings UI. + */ + fromApiParams?(apiParams: ToolApiParams[TEndpoint]): Partial; + /** * For custom tools: if true, success implies all input files were successfully processed. * Use this for tools like Automate or Merge where Many-to-One relationships exist @@ -80,24 +101,30 @@ interface BaseToolOperationConfig { consumesAllInputs?: boolean; } -export interface SingleFileToolOperationConfig< +interface SingleFileToolBody< TParams, -> extends BaseToolOperationConfig { + TEndpoint extends ToolEndpoint, +> extends BaseToolOperationConfig { /** This tool processes one file at a time. */ toolType: ToolType.singleFile; /** Builds FormData for API request. */ buildFormData: (params: TParams, file: File) => FormData; - /** API endpoint for the operation. Can be static string or function for dynamic routing. */ - endpoint: string | ((params: TParams) => string); - customProcessor?: undefined; } -export interface MultiFileToolOperationConfig< +/** Single-file tool config; see {@link EndpointBinding} for the endpoint/endpoints rule. */ +export type SingleFileToolOperationConfig< TParams, -> extends BaseToolOperationConfig { + TEndpoint extends ToolEndpoint = ToolEndpoint, +> = SingleFileToolBody & + EndpointBinding; + +interface MultiFileToolBody< + TParams, + TEndpoint extends ToolEndpoint, +> extends BaseToolOperationConfig { /** This tool processes multiple files at once. */ toolType: ToolType.multiFile; @@ -107,15 +134,18 @@ export interface MultiFileToolOperationConfig< /** Builds FormData for API request. */ buildFormData: (params: TParams, files: File[]) => FormData; - /** API endpoint for the operation. Can be static string or function for dynamic routing. */ - endpoint: string | ((params: TParams) => string); - customProcessor?: undefined; } +/** Multi-file counterpart of {@link SingleFileToolOperationConfig}. */ +export type MultiFileToolOperationConfig< + TParams, + TEndpoint extends ToolEndpoint = ToolEndpoint, +> = MultiFileToolBody & EndpointBinding; + export interface CustomToolOperationConfig< TParams, -> extends BaseToolOperationConfig { +> extends BaseToolOperationConfig { /** This tool has custom behaviour. */ toolType: ToolType.custom; @@ -128,6 +158,9 @@ export interface CustomToolOperationConfig< */ endpoint?: string | ((params: TParams) => string | undefined); + /** `never` so `endpoints` stays readable across the union; custom tools declare no set. */ + endpoints?: never; + /** * Custom processing logic that completely bypasses standard file processing. * This tool handles all API calls, response processing, and file creation. @@ -143,11 +176,79 @@ export interface CustomToolOperationConfig< ) => Promise; } -export type ToolOperationConfig = - | SingleFileToolOperationConfig - | MultiFileToolOperationConfig +export type ToolOperationConfig< + TParams = void, + TEndpoint extends ToolEndpoint = ToolEndpoint, +> = + | SingleFileToolOperationConfig + | MultiFileToolOperationConfig | CustomToolOperationConfig; +/** + * A static `endpoint` declares no set; a dynamic (function) `endpoint` must declare its full + * `endpoints` set, which is how findToolByEndpoint maps a stored step back to its tool when the + * endpoint-selecting parameter is frontend-only. + */ +type EndpointBinding = + | { endpoint: TEndpoint | null; endpoints?: never } + | { + endpoint: (params: TParams) => TEndpoint | null; + endpoints: readonly TEndpoint[]; + }; + +/** Union-distributing Omit, so stripping a key from a discriminated config keeps its branches. */ +type DistributiveOmit = T extends unknown + ? Omit + : never; + +/** + * Define a single-file tool's operation config. Infers the endpoint literal from + * `endpoint` and binds toApiParams/fromApiParams to that endpoint's request + * model, so a mapper cannot silently drift from the generated spec. + */ +export function defineSingleFileTool< + TParams, + const TEndpoint extends ToolEndpoint, +>( + config: DistributiveOmit< + SingleFileToolOperationConfig, + "toolType" + >, +): SingleFileToolOperationConfig { + return { + ...config, + toolType: ToolType.singleFile, + } as SingleFileToolOperationConfig; +} + +/** Multi-file counterpart of {@link defineSingleFileTool}. */ +export function defineMultiFileTool< + TParams, + const TEndpoint extends ToolEndpoint, +>( + config: DistributiveOmit< + MultiFileToolOperationConfig, + "toolType" + >, +): MultiFileToolOperationConfig { + return { + ...config, + toolType: ToolType.multiFile, + } as MultiFileToolOperationConfig; +} + +/** + * Custom-processor counterpart of {@link defineSingleFileTool}, for tools whose + * customProcessor owns the API calls and file handling. Rejects fields that + * belong to the file-based patterns (e.g. buildFormData) and any property not on + * the config, so a stray or stale field is a build error rather than dead weight. + */ +export function defineCustomTool( + config: Omit, "toolType">, +): CustomToolOperationConfig { + return { ...config, toolType: ToolType.custom }; +} + /** * One generic source-of-truth for the props every automation settings component * accepts: the tool's parameters plus a typed change handler. diff --git a/frontend/editor/src/core/hooks/tools/shared/useToolApiCalls.ts b/frontend/editor/src/core/hooks/tools/shared/useToolApiCalls.ts index 28da62484a..cca1f5e563 100644 --- a/frontend/editor/src/core/hooks/tools/shared/useToolApiCalls.ts +++ b/frontend/editor/src/core/hooks/tools/shared/useToolApiCalls.ts @@ -10,7 +10,7 @@ import type { ProcessingProgress } from "@app/hooks/tools/shared/useToolState"; import type { StirlingFile, FileId } from "@app/types/fileContext"; export interface ApiCallsConfig { - endpoint: string | ((params: TParams) => string); + endpoint: string | null | ((params: TParams) => string | null); buildFormData: (params: TParams, file: File) => FormData; filePrefix?: string; responseHandler?: ResponseHandler; @@ -37,6 +37,19 @@ export const useToolApiCalls = () => { // Create cancel token for this operation cancelTokenRef.current = axios.CancelToken.source(); + // Params are the same for every file, so resolve the endpoint once. A null + // endpoint means the tool has no backend call (e.g. client-side tools) and + // should never reach here, so fail loudly rather than POST to null. + const endpoint = + typeof config.endpoint === "function" + ? config.endpoint(params) + : config.endpoint; + if (!endpoint) { + throw new Error( + "This operation has no backend endpoint and cannot be executed directly.", + ); + } + for (let i = 0; i < validFiles.length; i++) { const file = validFiles[i]; @@ -51,10 +64,6 @@ export const useToolApiCalls = () => { try { const formData = config.buildFormData(params, file); - const endpoint = - typeof config.endpoint === "function" - ? config.endpoint(params) - : config.endpoint; console.debug("[processFiles] POST", { endpoint, name: file.name }); const response = await apiClient.post(endpoint, formData, { responseType: "blob", diff --git a/frontend/editor/src/core/hooks/tools/shared/useToolOperation.ts b/frontend/editor/src/core/hooks/tools/shared/useToolOperation.ts index 5629dfe54b..7ee69da142 100644 --- a/frontend/editor/src/core/hooks/tools/shared/useToolOperation.ts +++ b/frontend/editor/src/core/hooks/tools/shared/useToolOperation.ts @@ -40,6 +40,9 @@ import { } from "@app/hooks/tools/shared/toolOperationHelpers"; import { ToolType, + defineSingleFileTool, + defineMultiFileTool, + defineCustomTool, ToolOperationConfig, ToolOperationHook, CustomProcessorResult, @@ -50,7 +53,12 @@ import { ResponseHandler, } from "@app/hooks/tools/shared/toolOperationTypes"; -export { ToolType }; +export { + ToolType, + defineSingleFileTool, + defineMultiFileTool, + defineCustomTool, +}; export type { ToolOperationConfig, ToolOperationHook, @@ -69,10 +77,10 @@ export { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; * Shared hook for tool operations providing consistent error handling, progress tracking, * and FileContext integration. Eliminates boilerplate while maintaining flexibility. * - * Supports three tool patterns: - * 1. Single-file tools: Set multiFileEndpoint: false, processes files individually - * 2. Multi-file tools: Set multiFileEndpoint: true, single API call with all files - * 3. Complex tools: Provide customProcessor for full control over processing logic + * Supports three tool patterns, selected by the config's toolType: + * 1. Single-file tools (ToolType.singleFile): processes files individually + * 2. Multi-file tools (ToolType.multiFile): single API call with all files + * 3. Complex tools (ToolType.custom): customProcessor takes full control * * @param config - Tool operation configuration * @returns Hook interface with state and execution methods @@ -266,6 +274,11 @@ export const useToolOperation = ( typeof config.endpoint === "function" ? config.endpoint(params) : config.endpoint; + if (!endpoint) { + throw new Error( + "This operation has no backend endpoint and cannot be executed directly.", + ); + } const response = await apiClient.post(endpoint, formData, { responseType: "blob", diff --git a/frontend/editor/src/core/hooks/tools/sign/useSignOperation.ts b/frontend/editor/src/core/hooks/tools/sign/useSignOperation.ts index bd92fdd758..d54be4ecbf 100644 --- a/frontend/editor/src/core/hooks/tools/sign/useSignOperation.ts +++ b/frontend/editor/src/core/hooks/tools/sign/useSignOperation.ts @@ -2,7 +2,7 @@ import { useTranslation } from "react-i18next"; import { useToolOperation, ToolOperationHook, - ToolType, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; import { SignParameters, @@ -50,14 +50,16 @@ export const buildSignFormData = ( }; // Static configuration object -export const signOperationConfig = { - toolType: ToolType.singleFile, +export const signOperationConfig = defineSingleFileTool({ buildFormData: buildSignFormData, operationType: "sign", - endpoint: "/api/v1/security/add-signature", + // Signing is applied client-side in the viewer (see createStampTool -> + // flattenSignatures); there is no backend endpoint and the standard execute + // path is never used. + endpoint: null, filePrefix: "signed_", defaultParameters: DEFAULT_PARAMETERS, -} as const; +}); export const useSignOperation = (): ToolOperationHook => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/singleLargePage/useSingleLargePageOperation.ts b/frontend/editor/src/core/hooks/tools/singleLargePage/useSingleLargePageOperation.ts index a57a26a7dc..432aae59ec 100644 --- a/frontend/editor/src/core/hooks/tools/singleLargePage/useSingleLargePageOperation.ts +++ b/frontend/editor/src/core/hooks/tools/singleLargePage/useSingleLargePageOperation.ts @@ -1,32 +1,39 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + fileOnlyMapping, + objectToFormData, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { SingleLargePageParameters, defaultParameters, } from "@app/hooks/tools/singleLargePage/useSingleLargePageParameters"; +const ENDPOINT = "/api/v1/general/pdf-to-single-page" satisfies ToolEndpoint; + +// Single large page takes only a file; there are no request parameters to map. +const { toApiParams, fromApiParams } = fileOnlyMapping(); + // Static function that can be used by both the hook and automation executor export const buildSingleLargePageFormData = ( _parameters: SingleLargePageParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - return formData; -}; +): FormData => objectToFormData(toApiParams(), { fileInput: file }); // Static configuration object -export const singleLargePageOperationConfig = { - toolType: ToolType.singleFile, +export const singleLargePageOperationConfig = defineSingleFileTool({ buildFormData: buildSingleLargePageFormData, + toApiParams, + fromApiParams, operationType: "pdfToSinglePage", - endpoint: "/api/v1/general/pdf-to-single-page", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useSingleLargePageOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/split/useSplitOperation.test.ts b/frontend/editor/src/core/hooks/tools/split/useSplitOperation.test.ts new file mode 100644 index 0000000000..4cf8509c5d --- /dev/null +++ b/frontend/editor/src/core/hooks/tools/split/useSplitOperation.test.ts @@ -0,0 +1,212 @@ +import { describe, expect, test } from "vitest"; +import { + buildSplitFormData, + getSplitEndpoint, + splitFromApiParams, + splitToApiParams, +} from "@app/hooks/tools/split/useSplitOperation"; +import { + SplitParameters, + defaultParameters, +} from "@app/hooks/tools/split/useSplitParameters"; +import { SPLIT_METHODS } from "@app/constants/splitConstants"; + +const params = (overrides: Partial): SplitParameters => ({ + ...defaultParameters, + ...overrides, +}); + +describe("splitToApiParams", () => { + test("byPages sends pageNumbers", () => { + expect( + splitToApiParams( + params({ method: SPLIT_METHODS.BY_PAGES, pages: "2,5" }), + ), + ).toEqual({ pageNumbers: "2,5" }); + }); + + test("bySections sends divisions and split mode without custom pages", () => { + expect( + splitToApiParams( + params({ + method: SPLIT_METHODS.BY_SECTIONS, + hDiv: "3", + vDiv: "2", + merge: true, + splitMode: "SPLIT_ALL", + }), + ), + ).toEqual({ + horizontalDivisions: 3, + verticalDivisions: 2, + merge: true, + splitMode: "SPLIT_ALL", + }); + }); + + test("bySections includes pageNumbers only for CUSTOM mode", () => { + expect( + splitToApiParams( + params({ + method: SPLIT_METHODS.BY_SECTIONS, + splitMode: "CUSTOM", + customPages: "1,2", + }), + ), + ).toMatchObject({ splitMode: "CUSTOM", pageNumbers: "1,2" }); + }); + + test.each([ + { method: SPLIT_METHODS.BY_SIZE, splitType: 0 }, + { method: SPLIT_METHODS.BY_PAGE_COUNT, splitType: 1 }, + { method: SPLIT_METHODS.BY_DOC_COUNT, splitType: 2 }, + ])("$method maps to splitType $splitType", ({ method, splitType }) => { + expect(splitToApiParams(params({ method, splitValue: "5" }))).toEqual({ + splitType, + splitValue: "5", + }); + }); + + test("byChapters converts bookmarkLevel to a number", () => { + expect( + splitToApiParams( + params({ + method: SPLIT_METHODS.BY_CHAPTERS, + bookmarkLevel: "2", + includeMetadata: true, + }), + ), + ).toEqual({ + bookmarkLevel: 2, + includeMetadata: true, + allowDuplicates: false, + }); + }); + + test("byPageDivider sends duplexMode", () => { + expect( + splitToApiParams( + params({ method: SPLIT_METHODS.BY_PAGE_DIVIDER, duplexMode: true }), + ), + ).toEqual({ duplexMode: true }); + }); + + test("byPoster maps the factors to the spec's xFactor/yFactor fields", () => { + expect( + splitToApiParams( + params({ + method: SPLIT_METHODS.BY_POSTER, + pageSize: "A4", + xFactor: "3", + yFactor: "2", + rightToLeft: true, + }), + ), + ).toEqual({ pageSize: "A4", xFactor: 3, yFactor: 2, rightToLeft: true }); + }); + + // A cleared numeric field arrives as "". It must fall back to the default, + // not Number("") === 0, which the backend turns into an empty/degenerate PDF. + test("byPoster falls back to the default factor for empty fields", () => { + expect( + splitToApiParams( + params({ method: SPLIT_METHODS.BY_POSTER, xFactor: "", yFactor: "" }), + ), + ).toMatchObject({ xFactor: 2, yFactor: 2 }); + }); + + test("bySections falls back to the default divisions for empty fields", () => { + expect( + splitToApiParams( + params({ method: SPLIT_METHODS.BY_SECTIONS, hDiv: "", vDiv: "" }), + ), + ).toMatchObject({ horizontalDivisions: 2, verticalDivisions: 2 }); + }); + + test("byChapters falls back to the default bookmark level for an empty field", () => { + expect( + splitToApiParams( + params({ method: SPLIT_METHODS.BY_CHAPTERS, bookmarkLevel: "" }), + ), + ).toMatchObject({ bookmarkLevel: 1 }); + }); +}); + +describe("split round-trip", () => { + test.each>([ + { method: SPLIT_METHODS.BY_PAGES, pages: "2,5" }, + { + method: SPLIT_METHODS.BY_SECTIONS, + hDiv: "3", + vDiv: "2", + merge: true, + splitMode: "SPLIT_ALL", + }, + { + method: SPLIT_METHODS.BY_SECTIONS, + splitMode: "CUSTOM", + customPages: "1,2", + }, + { method: SPLIT_METHODS.BY_SIZE, splitValue: "10MB" }, + { method: SPLIT_METHODS.BY_PAGE_COUNT, splitValue: "5" }, + { method: SPLIT_METHODS.BY_DOC_COUNT, splitValue: "3" }, + { + method: SPLIT_METHODS.BY_CHAPTERS, + bookmarkLevel: "2", + includeMetadata: true, + }, + { method: SPLIT_METHODS.BY_PAGE_DIVIDER, duplexMode: true }, + { + method: SPLIT_METHODS.BY_POSTER, + pageSize: "A4", + xFactor: "3", + yFactor: "2", + }, + ])("toApiParams(fromApiParams(x)) reproduces x for %o", (overrides) => { + const api = splitToApiParams(params(overrides)); + const roundTripped = splitToApiParams(params(splitFromApiParams(api))); + + expect(roundTripped).toEqual(api); + }); +}); + +describe("getSplitEndpoint", () => { + test.each([ + { method: SPLIT_METHODS.BY_PAGES, endpoint: "/api/v1/general/split-pages" }, + { + method: SPLIT_METHODS.BY_SECTIONS, + endpoint: "/api/v1/general/split-pdf-by-sections", + }, + { + method: SPLIT_METHODS.BY_SIZE, + endpoint: "/api/v1/general/split-by-size-or-count", + }, + { + method: SPLIT_METHODS.BY_CHAPTERS, + endpoint: "/api/v1/general/split-pdf-by-chapters", + }, + { + method: SPLIT_METHODS.BY_PAGE_DIVIDER, + endpoint: "/api/v1/misc/auto-split-pdf", + }, + { + method: SPLIT_METHODS.BY_POSTER, + endpoint: "/api/v1/general/split-for-poster-print", + }, + ])("$method routes to $endpoint", ({ method, endpoint }) => { + expect(getSplitEndpoint(params({ method }))).toBe(endpoint); + }); +}); + +describe("buildSplitFormData", () => { + test("appends the file and the serialized parameters", () => { + const file = new File(["x"], "test.pdf", { type: "application/pdf" }); + const formData = buildSplitFormData( + params({ method: SPLIT_METHODS.BY_PAGES, pages: "3" }), + file, + ); + + expect(formData.get("fileInput")).toBe(file); + expect(formData.get("pageNumbers")).toBe("3"); + }); +}); diff --git a/frontend/editor/src/core/hooks/tools/split/useSplitOperation.ts b/frontend/editor/src/core/hooks/tools/split/useSplitOperation.ts index bedf83d09e..af14ca2045 100644 --- a/frontend/editor/src/core/hooks/tools/split/useSplitOperation.ts +++ b/frontend/editor/src/core/hooks/tools/split/useSplitOperation.ts @@ -1,123 +1,186 @@ import { useCallback } from "react"; import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, ToolOperationConfig, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { SplitParameters, defaultParameters, } from "@app/hooks/tools/split/useSplitParameters"; -import { SPLIT_METHODS } from "@app/constants/splitConstants"; +import { SPLIT_METHODS, type SplitMethod } from "@app/constants/splitConstants"; import { useToolResources } from "@app/hooks/tools/shared/useToolResources"; -// Static functions that can be used by both the hook and automation executor -export const buildSplitFormData = ( +// Split routes to a different endpoint per method. This map is the single source +// of truth: getSplitEndpoint returns from it, and the mapper types below are +// derived from it, so the endpoint posted and the request shape checked can +// never point at different endpoints. +const SPLIT_ENDPOINTS = { + [SPLIT_METHODS.BY_PAGES]: "/api/v1/general/split-pages", + [SPLIT_METHODS.BY_SECTIONS]: "/api/v1/general/split-pdf-by-sections", + [SPLIT_METHODS.BY_SIZE]: "/api/v1/general/split-by-size-or-count", + [SPLIT_METHODS.BY_PAGE_COUNT]: "/api/v1/general/split-by-size-or-count", + [SPLIT_METHODS.BY_DOC_COUNT]: "/api/v1/general/split-by-size-or-count", + [SPLIT_METHODS.BY_CHAPTERS]: "/api/v1/general/split-pdf-by-chapters", + [SPLIT_METHODS.BY_PAGE_DIVIDER]: "/api/v1/misc/auto-split-pdf", + [SPLIT_METHODS.BY_POSTER]: "/api/v1/general/split-for-poster-print", +} as const satisfies Record; + +type SplitEndpoint = (typeof SPLIT_ENDPOINTS)[SplitMethod]; +type SplitApiParams = ToolApiParams[SplitEndpoint]; +type SectionsApiParams = + ToolApiParams[(typeof SPLIT_ENDPOINTS)[typeof SPLIT_METHODS.BY_SECTIONS]]; +type PosterApiParams = + ToolApiParams[(typeof SPLIT_ENDPOINTS)[typeof SPLIT_METHODS.BY_POSTER]]; + +// Convert the tool's UI parameters into the request body for the routed endpoint. +export const splitToApiParams = ( parameters: SplitParameters, - file: File, -): FormData => { - const formData = new FormData(); - - formData.append("fileInput", file); - +): SplitApiParams => { // Use BY_PAGES as default if no method is selected const method = parameters.method || SPLIT_METHODS.BY_PAGES; switch (method) { case SPLIT_METHODS.BY_PAGES: - formData.append("pageNumbers", parameters.pages); - break; - case SPLIT_METHODS.BY_SECTIONS: - formData.append("horizontalDivisions", parameters.hDiv); - formData.append("verticalDivisions", parameters.vDiv); - formData.append("merge", (parameters.merge ?? false).toString()); - formData.append("splitMode", parameters.splitMode || "SPLIT_ALL"); + return { pageNumbers: parameters.pages }; + case SPLIT_METHODS.BY_SECTIONS: { + const sections: SectionsApiParams = { + horizontalDivisions: Number(parameters.hDiv || "2"), + verticalDivisions: Number(parameters.vDiv || "2"), + merge: parameters.merge ?? false, + splitMode: (parameters.splitMode || + "SPLIT_ALL") as SectionsApiParams["splitMode"], + }; if (parameters.splitMode === "CUSTOM" && parameters.customPages) { - formData.append("pageNumbers", parameters.customPages); + sections.pageNumbers = parameters.customPages; } - break; + return sections; + } case SPLIT_METHODS.BY_SIZE: - formData.append("splitType", "0"); - formData.append("splitValue", parameters.splitValue); - break; + return { splitType: 0, splitValue: parameters.splitValue }; case SPLIT_METHODS.BY_PAGE_COUNT: - formData.append("splitType", "1"); - formData.append("splitValue", parameters.splitValue); - break; + return { splitType: 1, splitValue: parameters.splitValue }; case SPLIT_METHODS.BY_DOC_COUNT: - formData.append("splitType", "2"); - formData.append("splitValue", parameters.splitValue); - break; + return { splitType: 2, splitValue: parameters.splitValue }; case SPLIT_METHODS.BY_CHAPTERS: - formData.append("bookmarkLevel", parameters.bookmarkLevel); - formData.append( - "includeMetadata", - (parameters.includeMetadata ?? false).toString(), - ); - formData.append( - "allowDuplicates", - (parameters.allowDuplicates ?? false).toString(), - ); - break; + return { + bookmarkLevel: Number(parameters.bookmarkLevel || "1"), + includeMetadata: parameters.includeMetadata ?? false, + allowDuplicates: parameters.allowDuplicates ?? false, + }; case SPLIT_METHODS.BY_PAGE_DIVIDER: - formData.append( - "duplexMode", - (parameters.duplexMode ?? false).toString(), - ); - break; + return { duplexMode: parameters.duplexMode ?? false }; case SPLIT_METHODS.BY_POSTER: - formData.append("pageSize", parameters.pageSize || "A4"); - formData.append("xFactor", parameters.xFactor || "2"); - formData.append("yFactor", parameters.yFactor || "2"); - formData.append( - "rightToLeft", - (parameters.rightToLeft ?? false).toString(), - ); - break; + return { + pageSize: (parameters.pageSize || "A4") as PosterApiParams["pageSize"], + xFactor: Number(parameters.xFactor || "2"), + yFactor: Number(parameters.yFactor || "2"), + rightToLeft: parameters.rightToLeft ?? false, + }; default: throw new Error(`Unknown split method: ${method}`); } - - return formData; }; -export const getSplitEndpoint = (parameters: SplitParameters): string => { - // Default to BY_PAGES endpoint if no method selected yet - if (!parameters.method) { - return "/api/v1/general/split-pages"; +// Reconstruct the tool's UI parameters from a stored request body. The step +// carries no explicit method, so it is inferred from the fields present. +export const splitFromApiParams = ( + apiParams: SplitApiParams, +): Partial => { + if ("pageSize" in apiParams) { + return { + method: SPLIT_METHODS.BY_POSTER, + pageSize: apiParams.pageSize, + xFactor: + apiParams.xFactor !== undefined ? `${apiParams.xFactor}` : undefined, + yFactor: + apiParams.yFactor !== undefined ? `${apiParams.yFactor}` : undefined, + rightToLeft: apiParams.rightToLeft ?? defaultParameters.rightToLeft, + }; } - - switch (parameters.method) { - case null: - case SPLIT_METHODS.BY_PAGES: - return "/api/v1/general/split-pages"; - case SPLIT_METHODS.BY_SECTIONS: - return "/api/v1/general/split-pdf-by-sections"; - case SPLIT_METHODS.BY_SIZE: - case SPLIT_METHODS.BY_PAGE_COUNT: - case SPLIT_METHODS.BY_DOC_COUNT: - return "/api/v1/general/split-by-size-or-count"; - case SPLIT_METHODS.BY_CHAPTERS: - return "/api/v1/general/split-pdf-by-chapters"; - case SPLIT_METHODS.BY_PAGE_DIVIDER: - return "/api/v1/misc/auto-split-pdf"; - case SPLIT_METHODS.BY_POSTER: - return "/api/v1/general/split-for-poster-print"; - default: - throw new Error(`Unknown split method: ${parameters.method}`); + if ("horizontalDivisions" in apiParams || "verticalDivisions" in apiParams) { + return { + method: SPLIT_METHODS.BY_SECTIONS, + hDiv: + apiParams.horizontalDivisions !== undefined + ? `${apiParams.horizontalDivisions}` + : undefined, + vDiv: + apiParams.verticalDivisions !== undefined + ? `${apiParams.verticalDivisions}` + : undefined, + merge: apiParams.merge ?? false, + splitMode: apiParams.splitMode ?? "SPLIT_ALL", + customPages: + apiParams.splitMode === "CUSTOM" + ? apiParams.pageNumbers + : defaultParameters.customPages, + }; } + if ("bookmarkLevel" in apiParams) { + return { + method: SPLIT_METHODS.BY_CHAPTERS, + bookmarkLevel: + apiParams.bookmarkLevel !== undefined + ? `${apiParams.bookmarkLevel}` + : "", + includeMetadata: apiParams.includeMetadata ?? false, + allowDuplicates: apiParams.allowDuplicates ?? false, + }; + } + if ("splitType" in apiParams) { + const methodBySplitType = { + 0: SPLIT_METHODS.BY_SIZE, + 1: SPLIT_METHODS.BY_PAGE_COUNT, + 2: SPLIT_METHODS.BY_DOC_COUNT, + } as const; + return { + method: methodBySplitType[apiParams.splitType as 0 | 1 | 2], + splitValue: apiParams.splitValue ?? "", + }; + } + if ("duplexMode" in apiParams) { + return { + method: SPLIT_METHODS.BY_PAGE_DIVIDER, + duplexMode: apiParams.duplexMode ?? false, + }; + } + const pages = "pageNumbers" in apiParams ? apiParams.pageNumbers : undefined; + return { + method: SPLIT_METHODS.BY_PAGES, + pages: pages ?? defaultParameters.pages, + }; }; +// Static functions that can be used by both the hook and automation executor +export const buildSplitFormData = ( + parameters: SplitParameters, + file: File, +): FormData => + objectToFormData(splitToApiParams(parameters), { fileInput: file }); + +export const getSplitEndpoint = (parameters: SplitParameters): SplitEndpoint => + // Default to BY_PAGES when no method is selected yet. + SPLIT_ENDPOINTS[parameters.method ?? SPLIT_METHODS.BY_PAGES]; + // Static configuration object -export const splitOperationConfig = { - toolType: ToolType.singleFile, +export const splitOperationConfig = defineSingleFileTool({ buildFormData: buildSplitFormData, + toApiParams: splitToApiParams, + fromApiParams: splitFromApiParams, operationType: "split", endpoint: getSplitEndpoint, + // Full routing set: a stored step maps back to Split though its `method` selector is frontend-only. + endpoints: Array.from(new Set(Object.values(SPLIT_ENDPOINTS))), defaultParameters, -} as const; +}); export const useSplitOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/timestampPdf/useTimestampPdfOperation.ts b/frontend/editor/src/core/hooks/tools/timestampPdf/useTimestampPdfOperation.ts index b14f785574..0769f37952 100644 --- a/frontend/editor/src/core/hooks/tools/timestampPdf/useTimestampPdfOperation.ts +++ b/frontend/editor/src/core/hooks/tools/timestampPdf/useTimestampPdfOperation.ts @@ -1,34 +1,48 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + objectToFormData, + type ToolApiParams, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { TimestampPdfParameters, defaultParameters, } from "@app/hooks/tools/timestampPdf/useTimestampPdfParameters"; +const ENDPOINT = "/api/v1/security/timestamp-pdf" satisfies ToolEndpoint; +type TimestampPdfApiParams = ToolApiParams[typeof ENDPOINT]; + +export const timestampPdfToApiParams = ( + parameters: TimestampPdfParameters, +): TimestampPdfApiParams => ({ + tsaUrl: parameters.tsaUrl, +}); + +export const timestampPdfFromApiParams = ( + apiParams: TimestampPdfApiParams, +): Partial => ({ + tsaUrl: apiParams.tsaUrl, +}); + export const buildTimestampPdfFormData = ( parameters: TimestampPdfParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); +): FormData => + objectToFormData(timestampPdfToApiParams(parameters), { fileInput: file }); - formData.append("tsaUrl", parameters.tsaUrl); - - return formData; -}; - -export const timestampPdfOperationConfig = { - toolType: ToolType.singleFile, +export const timestampPdfOperationConfig = defineSingleFileTool({ buildFormData: buildTimestampPdfFormData, + toApiParams: timestampPdfToApiParams, + fromApiParams: timestampPdfFromApiParams, operationType: "timestampPdf", - endpoint: "/api/v1/security/timestamp-pdf", - multiFileEndpoint: false, + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useTimestampPdfOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation.ts b/frontend/editor/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation.ts index 1e78d2d407..2212d284bd 100644 --- a/frontend/editor/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation.ts +++ b/frontend/editor/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation.ts @@ -1,32 +1,39 @@ import { useTranslation } from "react-i18next"; import { - ToolType, useToolOperation, + defineSingleFileTool, } from "@app/hooks/tools/shared/useToolOperation"; +import { + fileOnlyMapping, + objectToFormData, + type ToolEndpoint, +} from "@app/hooks/tools/shared/toolApiMapping"; import { createStandardErrorHandler } from "@app/utils/toolErrorHandler"; import { UnlockPdfFormsParameters, defaultParameters, } from "@app/hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters"; +const ENDPOINT = "/api/v1/misc/unlock-pdf-forms" satisfies ToolEndpoint; + +// Unlock PDF forms takes only a file; there are no request parameters to map. +const { toApiParams, fromApiParams } = fileOnlyMapping(); + // Static function that can be used by both the hook and automation executor export const buildUnlockPdfFormsFormData = ( _parameters: UnlockPdfFormsParameters, file: File, -): FormData => { - const formData = new FormData(); - formData.append("fileInput", file); - return formData; -}; +): FormData => objectToFormData(toApiParams(), { fileInput: file }); // Static configuration object -export const unlockPdfFormsOperationConfig = { - toolType: ToolType.singleFile, +export const unlockPdfFormsOperationConfig = defineSingleFileTool({ buildFormData: buildUnlockPdfFormsFormData, + toApiParams, + fromApiParams, operationType: "unlockPDFForms", - endpoint: "/api/v1/misc/unlock-pdf-forms", + endpoint: ENDPOINT, defaultParameters, -} as const; +}); export const useUnlockPdfFormsOperation = () => { const { t } = useTranslation(); diff --git a/frontend/editor/src/core/hooks/usePolicyFileBadges.ts b/frontend/editor/src/core/hooks/usePolicyFileBadges.ts index e3297f9bd0..8013edf0b9 100644 --- a/frontend/editor/src/core/hooks/usePolicyFileBadges.ts +++ b/frontend/editor/src/core/hooks/usePolicyFileBadges.ts @@ -1,4 +1,4 @@ -import type { FileItemPolicyRef } from "@app/components/shared/FileSidebarFileItem"; +import type { FileItemPolicyRef } from "@app/components/shared/PolicyBadges"; /** * Policies that have run on each file, keyed by fileId — drives the shield diff --git a/frontend/editor/src/core/pages/HomePage.tsx b/frontend/editor/src/core/pages/HomePage.tsx index 2e5d2aa08d..c1b4f572bc 100644 --- a/frontend/editor/src/core/pages/HomePage.tsx +++ b/frontend/editor/src/core/pages/HomePage.tsx @@ -38,6 +38,7 @@ import { useFileHandler } from "@app/hooks/useFileHandler"; import { FolderTreePanel } from "@app/components/filesPage/FolderTreePanel"; import type { FileSidebarProps } from "@app/components/shared/FileSidebar"; +import { Button } from "@app/ui/Button"; import "@app/pages/HomePage.css"; const SIDEBAR_COLLAPSED_STORAGE_KEY = "stirling.fileSidebarCollapsed"; @@ -404,7 +405,8 @@ export default function HomePage() {
    )}
    - + {toolAvailability["automate"]?.available !== false && ( - + )} - - +
    {/* Back button - floating top left */} - - + {/* Video feed - fills available space */} {/* Capture button */} - + @@ -1291,15 +1289,14 @@ export default function MobileScannerPage() { align="center" style={{ maxWidth: "500px", margin: "0 auto" }} > - - + - + @@ -1383,23 +1379,22 @@ export default function MobileScannerPage() { > - - + - + @@ -1413,17 +1408,22 @@ export default function MobileScannerPage() { ) - - +     { }); const attachments = doc.getAttachments(); expect(attachments.length).toBeGreaterThan(0); - expect(attachments.map((a) => a.name)).toContain(attachmentName); + expect(attachments.map((a: { name?: string }) => a.name)).toContain( + attachmentName, + ); }); test("Add bookmark from viewer sidebar adds the bookmark to the produced PDF outline", async ({ diff --git a/frontend/editor/src/core/tests/stubbed/add-page-numbers-tool.spec.ts b/frontend/editor/src/core/tests/stubbed/add-page-numbers-tool.spec.ts index ecb6f6ce0b..8fa6a1940c 100644 --- a/frontend/editor/src/core/tests/stubbed/add-page-numbers-tool.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/add-page-numbers-tool.spec.ts @@ -2,7 +2,10 @@ import { test, expect } from "@app/tests/helpers/stub-test-base"; import { uploadFiles } from "@app/tests/helpers/ui-helpers"; import path from "path"; -const SAMPLE_PDF = path.join(__dirname, "../test-fixtures/sample.pdf"); +const SAMPLE_PDF = path.join( + import.meta.dirname, + "../test-fixtures/sample.pdf", +); /** * Add Page Numbers walks the user through a multi-step config: position diff --git a/frontend/editor/src/core/tests/stubbed/add-stamp-tool.spec.ts b/frontend/editor/src/core/tests/stubbed/add-stamp-tool.spec.ts index 56236d5bb4..6c6adbb4ac 100644 --- a/frontend/editor/src/core/tests/stubbed/add-stamp-tool.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/add-stamp-tool.spec.ts @@ -2,7 +2,10 @@ import { test, expect } from "@app/tests/helpers/stub-test-base"; import { uploadFiles } from "@app/tests/helpers/ui-helpers"; import path from "path"; -const SAMPLE_PDF = path.join(__dirname, "../test-fixtures/sample.pdf"); +const SAMPLE_PDF = path.join( + import.meta.dirname, + "../test-fixtures/sample.pdf", +); /** * AddStamp loads, accepts a PDF upload, and remains interactive. diff --git a/frontend/editor/src/core/tests/stubbed/cert-sign-wizard.spec.ts b/frontend/editor/src/core/tests/stubbed/cert-sign-wizard.spec.ts index 807e4231d4..e2d2e8b154 100644 --- a/frontend/editor/src/core/tests/stubbed/cert-sign-wizard.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/cert-sign-wizard.spec.ts @@ -3,7 +3,7 @@ import { uploadFiles } from "@app/tests/helpers/ui-helpers"; import type { Page, Route } from "@playwright/test"; import path from "path"; -const FIXTURES_DIR = path.join(__dirname, "../test-fixtures"); +const FIXTURES_DIR = path.join(import.meta.dirname, "../test-fixtures"); const SAMPLE_PDF = path.join(FIXTURES_DIR, "sample.pdf"); // app-config the desktop bundle would return: hardware signing is offered only there. @@ -59,7 +59,7 @@ async function mockHardwareEndpoints(page: Page) { } test.describe("CertSign tool - certificate source model", () => { - test("renders, accepts a PDF, and exposes the Upload source", async ({ + test("skips the redundant source step and goes straight to certificate format when Upload is the only source", async ({ page, }) => { await page.route("**/api/v1/security/cert-sign", (route) => @@ -76,10 +76,21 @@ test.describe("CertSign tool - certificate source model", () => { await uploadFiles(page, SAMPLE_PDF); await expect(page).toHaveURL(/\/cert-sign/); - // Source step always offers "Upload" (the former "Manual" mode). + // With no server cert or hardware token there is nothing to choose, so the + // whole "Certificate source" step is hidden and the format picker shows directly. await expect( - page.getByRole("button", { name: /^upload$/i }).first(), - ).toBeAttached({ timeout: 10_000 }); + page.getByRole("button", { name: /pkcs12/i }).first(), + ).toBeVisible({ timeout: 10_000 }); + await expect(page.getByText(/certificate source/i)).toHaveCount(0); + await expect( + page.getByText(/no other certificate sources are available/i), + ).toHaveCount(0); + await expect( + page.getByRole("button", { name: /this device/i }), + ).toHaveCount(0); + await expect(page.getByRole("button", { name: /^server$/i })).toHaveCount( + 0, + ); }); test("does NOT offer 'This device' when not running as desktop", async ({ @@ -89,9 +100,10 @@ test.describe("CertSign tool - certificate source model", () => { await page.waitForLoadState("domcontentloaded"); await uploadFiles(page, SAMPLE_PDF); + // No alternative sources: the source step is hidden, and hardware is never offered. await expect( - page.getByRole("button", { name: /^upload$/i }).first(), - ).toBeAttached({ timeout: 10_000 }); + page.getByRole("button", { name: /pkcs12/i }).first(), + ).toBeVisible({ timeout: 10_000 }); await expect( page.getByRole("button", { name: /this device/i }), ).toHaveCount(0); diff --git a/frontend/editor/src/core/tests/stubbed/certificate-validation.spec.ts b/frontend/editor/src/core/tests/stubbed/certificate-validation.spec.ts index 075464c587..a00a91c6ba 100644 --- a/frontend/editor/src/core/tests/stubbed/certificate-validation.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/certificate-validation.spec.ts @@ -5,7 +5,7 @@ import { suppressNativeFilePicker } from "@app/tests/helpers/ui-helpers"; // --------------------------------------------------------------------------- // Test fixtures — pre-generated keystores in test-fixtures/certs/ // --------------------------------------------------------------------------- -const CERTS_DIR = path.join(__dirname, "../test-fixtures/certs"); +const CERTS_DIR = path.join(import.meta.dirname, "../test-fixtures/certs"); const VALID_P12 = path.join(CERTS_DIR, "valid-test.p12"); const EXPIRED_P12 = path.join(CERTS_DIR, "expired-test.p12"); const NOT_YET_VALID_P12 = path.join(CERTS_DIR, "not-yet-valid-test.p12"); diff --git a/frontend/editor/src/core/tests/stubbed/comments-sidebar-order.spec.ts b/frontend/editor/src/core/tests/stubbed/comments-sidebar-order.spec.ts index 097b162c85..91206b1222 100644 --- a/frontend/editor/src/core/tests/stubbed/comments-sidebar-order.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/comments-sidebar-order.spec.ts @@ -2,7 +2,7 @@ import { test, expect } from "@app/tests/helpers/stub-test-base"; import path from "path"; const ANNOTATED_PDF = path.join( - __dirname, + import.meta.dirname, "../test-fixtures/annotations_out_of_order.pdf", ); diff --git a/frontend/editor/src/core/tests/stubbed/compare.spec.ts b/frontend/editor/src/core/tests/stubbed/compare.spec.ts index 6bcaaee538..6893721465 100644 --- a/frontend/editor/src/core/tests/stubbed/compare.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/compare.spec.ts @@ -22,7 +22,7 @@ import { test, expect, type Page } from "@playwright/test"; import path from "path"; import { mockAppApis } from "@app/tests/helpers/api-stubs"; -const FIXTURES_DIR = path.join(__dirname, "../test-fixtures"); +const FIXTURES_DIR = path.join(import.meta.dirname, "../test-fixtures"); const PDF_A = path.join(FIXTURES_DIR, "compare_sample_a.pdf"); const PDF_B = path.join(FIXTURES_DIR, "compare_sample_b.pdf"); diff --git a/frontend/editor/src/core/tests/stubbed/convert.spec.ts b/frontend/editor/src/core/tests/stubbed/convert.spec.ts index de8fa17a9c..52feefcb98 100644 --- a/frontend/editor/src/core/tests/stubbed/convert.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/convert.spec.ts @@ -10,7 +10,7 @@ import path from "path"; import { mockAppApis } from "@app/tests/helpers/api-stubs"; import { suppressNativeFilePicker } from "@app/tests/helpers/ui-helpers"; -const FIXTURES_DIR = path.join(__dirname, "../test-fixtures"); +const FIXTURES_DIR = path.join(import.meta.dirname, "../test-fixtures"); const SAMPLE_PDF = path.join(FIXTURES_DIR, "sample.pdf"); // --------------------------------------------------------------------------- diff --git a/frontend/editor/src/core/tests/stubbed/encrypted-pdf-unlock.spec.ts b/frontend/editor/src/core/tests/stubbed/encrypted-pdf-unlock.spec.ts index 2a202b6cfe..430f5e4f24 100644 --- a/frontend/editor/src/core/tests/stubbed/encrypted-pdf-unlock.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/encrypted-pdf-unlock.spec.ts @@ -23,7 +23,7 @@ import fs from "fs"; import { mockAppApis } from "@app/tests/helpers/api-stubs"; import { suppressNativeFilePicker } from "@app/tests/helpers/ui-helpers"; -const FIXTURES_DIR = path.join(__dirname, "../test-fixtures"); +const FIXTURES_DIR = path.join(import.meta.dirname, "../test-fixtures"); const ENCRYPTED_PDF = path.join(FIXTURES_DIR, "encrypted.pdf"); const FAKE_UNLOCKED_PDF = Buffer.from( diff --git a/frontend/editor/src/core/tests/stubbed/file-state-across-tools.spec.ts b/frontend/editor/src/core/tests/stubbed/file-state-across-tools.spec.ts index e4b9a30c3e..09708bbb0a 100644 --- a/frontend/editor/src/core/tests/stubbed/file-state-across-tools.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/file-state-across-tools.spec.ts @@ -2,13 +2,18 @@ import { test, expect } from "@app/tests/helpers/stub-test-base"; import { uploadFiles } from "@app/tests/helpers/ui-helpers"; import path from "path"; -const FIXTURES_DIR = path.join(__dirname, "../test-fixtures"); +const FIXTURES_DIR = path.join(import.meta.dirname, "../test-fixtures"); const SAMPLE_PDF = path.join(FIXTURES_DIR, "sample.pdf"); /** * Files uploaded on one tool page should remain in the workbench when the * user navigates to a different tool. This is FileContext behaviour and * easy to break with a stale-effect or unmount-clear bug. + * + * Covered for both navigation mechanisms, which take different code paths: + * - a full page reload (page.goto) -> FileContext re-hydrates from IndexedDB + * - an in-app tool-link click -> client-side nav, FileContext stays + * in memory */ test.describe("File state persists across tool navigation", () => { test("file uploaded on /merge survives navigation to /split", async ({ @@ -32,4 +37,37 @@ test.describe("File state persists across tool navigation", () => { timeout: 5_000, }); }); + + test("file uploaded on /merge survives an in-app tool-link navigation", async ({ + page, + }) => { + await page.goto("/merge"); + await page.waitForLoadState("domcontentloaded"); + await uploadFiles(page, SAMPLE_PDF); + + // Navigate via the in-app tool link (client-side React Router nav) rather + // than a full reload, so this exercises the in-memory FileContext path the + // page.goto test above doesn't. Fall back to a direct visit if the nav + // rail isn't showing the link yet. + const splitNav = page.getByRole("link", { name: /^Split$/i }).first(); + if (await splitNav.isVisible({ timeout: 1_000 }).catch(() => false)) { + await splitNav.click(); + } else { + await page.goto("/split"); + } + + // A client-side nav has no document load event, so waitForLoadState is a + // no-op here. Wait for the route to actually commit before opening the + // file manager; otherwise the my-files click fires mid-transition and + // opens it against a not-yet-settled workbench, which renders a permanent + // empty state (the flaky "0 items" that then passes on retry). + await expect(page).toHaveURL(/\/split(?:$|[/?#])/); + + // The upload must still be listed after the tool switch. A "no files" + // empty state here would mean the client-side nav silently dropped it. + await page.getByTestId("my-files-button").click(); + await expect(page.getByText(/sample\.pdf/i).first()).toBeVisible({ + timeout: 10_000, + }); + }); }); diff --git a/frontend/editor/src/core/tests/stubbed/files-page.spec.ts b/frontend/editor/src/core/tests/stubbed/files-page.spec.ts index 7c08d943bb..56687b2217 100644 --- a/frontend/editor/src/core/tests/stubbed/files-page.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/files-page.spec.ts @@ -825,11 +825,10 @@ test.describe("Files page", () => { // and direct user shares.) await page.locator("#filesPage-tab-sharedByMe").click(); const sharedByMeCards = page.locator(".files-page-card:not(.is-folder)"); - await expect(sharedByMeCards).toHaveCount(2, { timeout: 3_000 }); - await expect(sharedByMeCards).toContainText([ - "link-shared.pdf", - "user-shared.pdf", - ]); + await expect(sharedByMeCards).toHaveCount(2, { timeout: 5_000 }); + for (const name of ["link-shared.pdf", "user-shared.pdf"]) { + await expect(sharedByMeCards.filter({ hasText: name })).toHaveCount(1); + } // "Shared with me" -> only from-someone-else.pdf await page.locator("#filesPage-tab-shared").click(); diff --git a/frontend/editor/src/core/tests/stubbed/merge-response-handling.spec.ts b/frontend/editor/src/core/tests/stubbed/merge-response-handling.spec.ts index 8dd5662c3d..20a96e32f4 100644 --- a/frontend/editor/src/core/tests/stubbed/merge-response-handling.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/merge-response-handling.spec.ts @@ -13,7 +13,7 @@ import fs from "fs"; // `result.zip` instead of the merged file. The UI fix uses signature-based // detection - %PDF wins regardless of Content-Type. -const FIXTURES_DIR = path.join(__dirname, "../test-fixtures"); +const FIXTURES_DIR = path.join(import.meta.dirname, "../test-fixtures"); const SAMPLE_PDF = path.join(FIXTURES_DIR, "sample.pdf"); const SAMPLE_PDF_BYTES = fs.readFileSync(SAMPLE_PDF); diff --git a/frontend/editor/src/core/tests/stubbed/page-editor-rotation.spec.ts b/frontend/editor/src/core/tests/stubbed/page-editor-rotation.spec.ts index 5912c89211..f24e13f312 100644 --- a/frontend/editor/src/core/tests/stubbed/page-editor-rotation.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/page-editor-rotation.spec.ts @@ -10,7 +10,10 @@ import { uploadFiles, dismissTourTooltip } from "@app/tests/helpers/ui-helpers"; // Fixture: 4 portrait pages whose intrinsic /Rotate is 0, 90, 270, 180. // Page 3 (index 2) is 270 so a single rotate-right lands on a net-0 target - // the exact case the export used to drop, leaving the source rotation behind. -const ROTATED_PDF = path.join(__dirname, "../test-fixtures/rotated-pages.pdf"); +const ROTATED_PDF = path.join( + import.meta.dirname, + "../test-fixtures/rotated-pages.pdf", +); const SOURCE_ROTATIONS = [0, 90, 270, 180]; /** Read the rotation each thumbnail is currently displaying (= page.rotation). */ @@ -90,7 +93,11 @@ test.describe("PageEditor (multitool) rotation save", () => { // 4. The exported /Rotate must match what the editor showed: page 3 upright // (0), the untouched pages keeping their source rotation. const outDoc = await PDFDocument.load(fs.readFileSync(tmpOut)); - const outRotations = outDoc.getPages().map((p) => p.getRotation().angle); + const outRotations = outDoc + .getPages() + .map( + (p: { getRotation: () => { angle: number } }) => p.getRotation().angle, + ); fs.rmSync(tmpOut, { force: true }); expect(outRotations).toEqual([0, 90, 0, 180]); }); diff --git a/frontend/editor/src/core/tests/stubbed/pdf-text-search.spec.ts b/frontend/editor/src/core/tests/stubbed/pdf-text-search.spec.ts index ce4bbce081..89d2fcfcce 100644 --- a/frontend/editor/src/core/tests/stubbed/pdf-text-search.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/pdf-text-search.spec.ts @@ -1,7 +1,10 @@ import { test, expect } from "@app/tests/helpers/stub-test-base"; import path from "path"; -const SAMPLE_PDF = path.join(__dirname, "../test-fixtures/sample.pdf"); +const SAMPLE_PDF = path.join( + import.meta.dirname, + "../test-fixtures/sample.pdf", +); /** * The reader/viewer exposes an in-PDF text search via CustomSearchLayer. diff --git a/frontend/editor/src/core/tests/stubbed/seed.spec.ts b/frontend/editor/src/core/tests/stubbed/seed.spec.ts index e85e7a723f..6b50e198aa 100644 --- a/frontend/editor/src/core/tests/stubbed/seed.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/seed.spec.ts @@ -22,7 +22,14 @@ function resolveFixturePath(filename: string): string { filename, ), path.join(process.cwd(), "src", "core", "tests", "test-fixtures", filename), - path.join(__dirname, "..", "core", "tests", "test-fixtures", filename), + path.join( + import.meta.dirname, + "..", + "core", + "tests", + "test-fixtures", + filename, + ), ]; for (const p of candidates) { if (fs.existsSync(p)) return p; diff --git a/frontend/editor/src/core/tests/stubbed/tour-onboarding.spec.ts b/frontend/editor/src/core/tests/stubbed/tour-onboarding.spec.ts index 658407e263..8d4d07cd8c 100644 --- a/frontend/editor/src/core/tests/stubbed/tour-onboarding.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/tour-onboarding.spec.ts @@ -17,7 +17,10 @@ import { uploadFiles, openSettings } from "@app/tests/helpers/ui-helpers"; * - whatsNewStepsConfig.ts */ -const SAMPLE_PDF = path.join(__dirname, "../test-fixtures/sample.pdf"); +const SAMPLE_PDF = path.join( + import.meta.dirname, + "../test-fixtures/sample.pdf", +); // --------------------------------------------------------------------------- // 15.1 Static layout - always visible on the main page diff --git a/frontend/editor/src/core/tests/stubbed/unsaved-changes-guard.spec.ts b/frontend/editor/src/core/tests/stubbed/unsaved-changes-guard.spec.ts deleted file mode 100644 index fc3a1240d1..0000000000 --- a/frontend/editor/src/core/tests/stubbed/unsaved-changes-guard.spec.ts +++ /dev/null @@ -1,43 +0,0 @@ -import { test, expect } from "@app/tests/helpers/stub-test-base"; -import { uploadFiles } from "@app/tests/helpers/ui-helpers"; -import path from "path"; - -const SAMPLE_PDF = path.join(__dirname, "../test-fixtures/sample.pdf"); - -/** - * The NavigationGuard context warns the user when they have unsaved work - * (uploaded files or modified config) and try to navigate away. The guard - * surface is a Mantine modal asking to confirm or cancel the navigation. - * - * Today the guard logic exists but is silently bypassed by tests that go - * through the workbench. This spec asserts the modal appears and that - * cancelling keeps the user on the current tool. - */ -test.describe("Unsaved changes navigation guard", () => { - test("uploading then navigating away surfaces the guard prompt", async ({ - page, - }) => { - await page.goto("/merge"); - await page.waitForLoadState("domcontentloaded"); - await uploadFiles(page, SAMPLE_PDF); - - // Triggering a tool-level navigation while files are loaded should - // either prompt or clear-and-navigate cleanly. A regression that - // discards files silently is the failure we want to catch. - const splitNav = page.getByRole("link", { name: /^Split$/i }).first(); - if (await splitNav.isVisible({ timeout: 1_000 }).catch(() => false)) { - await splitNav.click(); - } else { - await page.goto("/split"); - } - - // After arriving at /split the My Files page should still list the - // previously uploaded sample (NavigationGuard either kept us on - // /merge or moved us with state intact). A "no files" empty state - // here would indicate the guard silently dropped the workbench. - await page.getByTestId("my-files-button").click(); - await expect(page.getByText(/sample\.pdf/i).first()).toBeVisible({ - timeout: 5_000, - }); - }); -}); diff --git a/frontend/editor/src/core/tests/stubbed/validate-signature-trust.spec.ts b/frontend/editor/src/core/tests/stubbed/validate-signature-trust.spec.ts index e699451d9e..322b7cc88f 100644 --- a/frontend/editor/src/core/tests/stubbed/validate-signature-trust.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/validate-signature-trust.spec.ts @@ -3,7 +3,7 @@ import { uploadFiles } from "@app/tests/helpers/ui-helpers"; import type { Page, Route } from "@playwright/test"; import path from "path"; -const FIXTURES_DIR = path.join(__dirname, "../test-fixtures"); +const FIXTURES_DIR = path.join(import.meta.dirname, "../test-fixtures"); const SAMPLE_PDF = path.join(FIXTURES_DIR, "sample.pdf"); // Base backend SignatureValidationResult; tests override the trust-related fields. diff --git a/frontend/editor/src/core/tests/stubbed/viewer-sidebar-add-buttons.spec.ts b/frontend/editor/src/core/tests/stubbed/viewer-sidebar-add-buttons.spec.ts index ad3527c9c3..67df3865e1 100644 --- a/frontend/editor/src/core/tests/stubbed/viewer-sidebar-add-buttons.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/viewer-sidebar-add-buttons.spec.ts @@ -17,7 +17,10 @@ import path from "path"; * Backend-free spec. */ -const SAMPLE_PDF = path.join(__dirname, "../test-fixtures/sample.pdf"); +const SAMPLE_PDF = path.join( + import.meta.dirname, + "../test-fixtures/sample.pdf", +); async function openViewerWithSample(page: import("@playwright/test").Page) { await page.goto("/read"); diff --git a/frontend/editor/src/core/tests/stubbed/viewer-text-selection.spec.ts b/frontend/editor/src/core/tests/stubbed/viewer-text-selection.spec.ts index 1a7486e37a..d9a08ae9e7 100644 --- a/frontend/editor/src/core/tests/stubbed/viewer-text-selection.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/viewer-text-selection.spec.ts @@ -1,7 +1,7 @@ import path from "path"; import { test, expect } from "@app/tests/helpers/stub-test-base"; -const FIXTURES_DIR = path.join(__dirname, "../test-fixtures"); +const FIXTURES_DIR = path.join(import.meta.dirname, "../test-fixtures"); const SAMPLE_PDF = path.join(FIXTURES_DIR, "sample.pdf"); const MULTIPAGE_PDF = path.join(FIXTURES_DIR, "annotations_out_of_order.pdf"); diff --git a/frontend/editor/src/core/tests/stubbed/watermark-tool.spec.ts b/frontend/editor/src/core/tests/stubbed/watermark-tool.spec.ts index 47ad9cd57c..c72fbadba0 100644 --- a/frontend/editor/src/core/tests/stubbed/watermark-tool.spec.ts +++ b/frontend/editor/src/core/tests/stubbed/watermark-tool.spec.ts @@ -2,7 +2,10 @@ import { test, expect } from "@app/tests/helpers/stub-test-base"; import { uploadFiles } from "@app/tests/helpers/ui-helpers"; import path from "path"; -const SAMPLE_PDF = path.join(__dirname, "../test-fixtures/sample.pdf"); +const SAMPLE_PDF = path.join( + import.meta.dirname, + "../test-fixtures/sample.pdf", +); /** * Watermark has three modes — text / image / file overlay — selected via @@ -30,11 +33,11 @@ test.describe("Watermark tool — mode selection after upload", () => { test("post-upload UI renders mode cards or settings (whatever the chooser is)", async ({ page, }) => { - // The chooser may render as Mantine cards or buttons depending on the build. - // Either flavour is fine; what we want to catch is "post-upload watermark - // page is empty / errored". + // The chooser may render as Mantine cards, buttons, or a segmented control + // depending on the build. Either flavour is fine; what we want to catch is + // "post-upload watermark page is empty / errored". const choices = page.locator( - '.mantine-Card-root, button:has-text("Text"), button:has-text("Image"), button:has-text("File")', + '.mantine-Card-root, .mantine-SegmentedControl-root label, button:has-text("Text"), button:has-text("Image"), button:has-text("File")', ); await expect .poll(async () => choices.count(), { timeout: 10_000 }) diff --git a/frontend/editor/src/core/theme/mantineTheme.ts b/frontend/editor/src/core/theme/mantineTheme.ts index 061ac0e819..374c3c1a79 100644 --- a/frontend/editor/src/core/theme/mantineTheme.ts +++ b/frontend/editor/src/core/theme/mantineTheme.ts @@ -58,6 +58,23 @@ const gray: MantineColorsTuple = [ "var(--color-gray-900)", ]; +// Navy-indigo dark scale — replaces Mantine's neutral gray defaults so all +// dark-mode components (SegmentedControl, inputs, dropdowns, etc.) use the +// portal palette automatically via --mantine-color-dark-*. +// dark-0..3 = text/icon shades, dark-4..7 = surface elevations, dark-8..9 = deepest bg. +const dark: MantineColorsTuple = [ + "#c2c8e0", // dark-0 — primary text on dark bg + "#9299b0", // dark-1 — secondary text + "#6e7898", // dark-2 — muted text / icons + "#4a5282", // dark-3 — subtle text / dividers + "#1c2340", // dark-4 — elevated surface / selected bg (e.g. SegmentedControl indicator) + "#131729", // dark-5 — card / panel surface + "#0d1020", // dark-6 — toolbar / sidebar bg (e.g. SegmentedControl root) + "#090b18", // dark-7 — page background (deepest reachable surface) + "#07091a", // dark-8 + "#050714", // dark-9 +]; + export const mantineTheme = createTheme({ // Primary color primaryColor: "primary", @@ -68,6 +85,7 @@ export const mantineTheme = createTheme({ green, yellow, gray, + dark, }, // Spacing system - uses CSS variables diff --git a/frontend/editor/src/core/tokens/tokens.css b/frontend/editor/src/core/tokens/tokens.css index c8ba2171a0..189b88cb8e 100644 --- a/frontend/editor/src/core/tokens/tokens.css +++ b/frontend/editor/src/core/tokens/tokens.css @@ -117,6 +117,8 @@ --color-toggle-off: #cbd5e1; --color-badge-red: #ef4444; + /* Segmented control — semantic tokens so dark mode can decouple from blue surfaces */ + /* Shadows */ --shadow-sm: inset 0 0 0 1px #e3e8ee; --shadow-md: inset 0 0 0 1px #e3e8ee, 0 1px 2px rgba(15, 23, 42, 0.04); @@ -241,6 +243,8 @@ --color-toggle-off: #3d4f6a; + /* Segmented control — blue-toned dark to match app surface colors */ + --shadow-sm: inset 0 0 0 1px #283248; --shadow-md: inset 0 0 0 1px #283248, 0 1px 3px rgba(0, 0, 0, 0.3); --shadow-lg: inset 0 0 0 1px #283248, 0 8px 24px rgba(0, 0, 0, 0.4); @@ -405,6 +409,15 @@ } } +/* Default transition set (avoids text-colour transitions); not !important so components can override. */ +*, +*::before, +*::after { + transition-property: + background, background-color, border, border-color, box-shadow, opacity, + transform, fill, stroke, outline-color; +} + /* Visually-hidden utility for content meant only for screen readers. */ .sr-only { position: absolute; diff --git a/frontend/editor/src/core/tools/AddStamp.tsx b/frontend/editor/src/core/tools/AddStamp.tsx index 9a7422188e..6070ae5e89 100644 --- a/frontend/editor/src/core/tools/AddStamp.tsx +++ b/frontend/editor/src/core/tools/AddStamp.tsx @@ -126,7 +126,6 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => { }, ]} disabled={endpointLoading} - buttonClassName={styles.modeToggleButton} textClassName={styles.modeToggleButtonText} /> )} diff --git a/frontend/editor/src/core/tools/CertSign.tsx b/frontend/editor/src/core/tools/CertSign.tsx index dd0668a491..4f5173b174 100644 --- a/frontend/editor/src/core/tools/CertSign.tsx +++ b/frontend/editor/src/core/tools/CertSign.tsx @@ -1,5 +1,7 @@ +import { useEffect } from "react"; import { useTranslation } from "react-i18next"; import { createToolFlow } from "@app/components/tools/shared/createToolFlow"; +import { useAppConfig } from "@app/contexts/AppConfigContext"; import CertificateTypeSettings from "@app/components/tools/certSign/CertificateTypeSettings"; import CertificateFormatSettings from "@app/components/tools/certSign/CertificateFormatSettings"; import CertificateFilesSettings from "@app/components/tools/certSign/CertificateFilesSettings"; @@ -23,6 +25,25 @@ const CertSign = (props: BaseToolProps) => { props, ); + const { config } = useAppConfig(); + // "Upload" is always available; the source chooser is only meaningful when a + // server certificate or a hardware token gives the user an actual alternative. + const hasCertSourceChoice = + (config?.serverCertificateEnabled ?? false) || + (config?.hardwareSigningAvailable ?? false); + + // With Upload as the only source, keep signMode on MANUAL even if a saved + // automation set AUTO/DEVICE, so the hidden source step can't strand the flow. + useEffect(() => { + if (!hasCertSourceChoice && base.params.parameters.signMode !== "MANUAL") { + base.params.updateParameter("signMode", "MANUAL"); + } + }, [ + hasCertSourceChoice, + base.params.parameters.signMode, + base.params.updateParameter, + ]); + const certTypeTips = useCertificateTypeTips(); const appearanceTips = useSignatureAppearanceTips(); const signModeTips = useSignModeTips(); @@ -63,6 +84,7 @@ const CertSign = (props: BaseToolProps) => { steps: [ { title: t("certSign.source.stepTitle", "Certificate source"), + isVisible: hasCertSourceChoice, isCollapsed: base.settingsCollapsed, onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset diff --git a/frontend/editor/src/core/tools/Compare.tsx b/frontend/editor/src/core/tools/Compare.tsx index 81cf263ded..b555ecfb9b 100644 --- a/frontend/editor/src/core/tools/Compare.tsx +++ b/frontend/editor/src/core/tools/Compare.tsx @@ -2,15 +2,9 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import { useTranslation } from "react-i18next"; import CompareRoundedIcon from "@mui/icons-material/CompareRounded"; import CloseIcon from "@mui/icons-material/Close"; -import { - Box, - Group, - Stack, - Text, - Button, - Modal, - ActionIcon, -} from "@mantine/core"; +import { Box, Group, Stack, Text, Modal } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import SwapVertRoundedIcon from "@mui/icons-material/SwapVertRounded"; import { createToolFlow } from "@app/components/tools/shared/createToolFlow"; import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool"; @@ -33,7 +27,7 @@ import type { CompareWorkbenchData } from "@app/types/compare"; import { getDefaultWorkbench } from "@app/types/workbench"; import { truncateCenter } from "@app/utils/textUtils"; import { - FileSelectorPicker, + FileSelectorPicker as PopoverFileSelector, FileSelectorResult, } from "@app/components/shared/FileSelectorPicker"; import "@app/components/tools/compare/compareView.css"; @@ -373,9 +367,14 @@ const Compare = (props: BaseToolProps) => { }} > clearSlot(role)} aria-label={t("compare.clearSlot", "Remove file")} > @@ -421,7 +420,7 @@ const Compare = (props: BaseToolProps) => { data-slot-state="empty" style={{ width: "100%" }} > - {
    + )}
    @@ -543,13 +541,12 @@ const Compare = (props: BaseToolProps) => { {idx < CHAPTERS.length - 1 && }     ))} diff --git a/frontend/editor/src/core/tools/Merge.tsx b/frontend/editor/src/core/tools/Merge.tsx index 9138dfa4f0..ae2bed26fe 100644 --- a/frontend/editor/src/core/tools/Merge.tsx +++ b/frontend/editor/src/core/tools/Merge.tsx @@ -1,6 +1,7 @@ import { useCallback, useEffect, useRef } from "react"; import { useTranslation } from "react-i18next"; -import { Button, Stack, Text } from "@mantine/core"; +import { Stack, Text } from "@mantine/core"; +import { Button } from "@app/ui/Button"; import { createToolFlow } from "@app/components/tools/shared/createToolFlow"; import MergeSettings from "@app/components/tools/merge/MergeSettings"; import MergeFileSorter from "@app/components/tools/merge/MergeFileSorter"; @@ -181,8 +182,8 @@ const Merge = (props: BaseToolProps) => { )} - - - {filterOptions.map((f) => ( - + + {filterOptions.map((f) => { + const active = filters.includes(f.key); + return ( + + setFilters((prev) => + prev.includes(f.key) + ? prev.filter((k) => k !== f.key) + : [...prev, f.key], + ) + } + > {f.label} - ))} - - + ); + })} + {controller.loading && items.length === 0 ? (
    diff --git a/frontend/editor/src/core/tools/annotate/AnnotationPanel.tsx b/frontend/editor/src/core/tools/annotate/AnnotationPanel.tsx index 17f2e028c0..6986f4d7e4 100644 --- a/frontend/editor/src/core/tools/annotate/AnnotationPanel.tsx +++ b/frontend/editor/src/core/tools/annotate/AnnotationPanel.tsx @@ -4,17 +4,17 @@ import { useTranslation } from "react-i18next"; import { Text, Group, - ActionIcon, Stack, Slider, Box, Tooltip as MantineTooltip, - Button, Tooltip, Paper, Menu, Modal, } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import LocalIcon from "@app/components/shared/LocalIcon"; import { ColorPicker, @@ -365,12 +365,10 @@ export function AnnotationPanel(props: AnnotationPanelProps) { activateAnnotationTool(tool.id)} disabled={!annotationsVisible} aria-label={tool.label} @@ -641,9 +639,12 @@ export function AnnotationPanel(props: AnnotationPanelProps) { setTextAlignment("left")} size="md" + aria-label={t("annotation.alignLeft", "Align left")} > setTextAlignment("center")} size="md" + aria-label={t("annotation.alignCenter", "Align center")} > setTextAlignment("right")} size="md" + aria-label={t("annotation.alignRight", "Align right")} > void handleApplyChangesClick()} + style={{ marginTop: "0.75rem" }} > {t("annotation.saveChanges", "Save Changes")} @@ -1324,14 +1318,13 @@ export function AnnotationPanel(props: AnnotationPanelProps) { diff --git a/frontend/editor/src/core/tools/formFill/FormSaveBar.tsx b/frontend/editor/src/core/tools/formFill/FormSaveBar.tsx index d6186af566..48ded3045f 100644 --- a/frontend/editor/src/core/tools/formFill/FormSaveBar.tsx +++ b/frontend/editor/src/core/tools/formFill/FormSaveBar.tsx @@ -10,20 +10,14 @@ * save UX that users expect from browser PDF viewers. */ import React, { useCallback, useState } from "react"; -import { - Stack, - Group, - Text, - Button, - Transition, - CloseButton, - Paper, - Badge, -} from "@mantine/core"; +import { Stack, Group, Text, Transition, Paper, Badge } from "@mantine/core"; +import { Button } from "@app/ui/Button"; +import { ActionIcon } from "@app/ui/ActionIcon"; import { useTranslation } from "react-i18next"; import DownloadIcon from "@mui/icons-material/Download"; import SaveIcon from "@mui/icons-material/Save"; import EditNoteIcon from "@mui/icons-material/EditNote"; +import CloseIcon from "@mui/icons-material/Close"; import { useFormFill } from "@app/tools/formFill/FormFillContext"; import { downloadFileWithPolicy } from "@app/services/exportWithPolicy"; @@ -34,12 +28,15 @@ interface FormSaveBarProps { isFormFillToolActive: boolean; /** Callback when form changes are applied (should reload PDF with filled values) */ onApply?: (filledBlob: Blob) => Promise; + /** Disable download while an ingestion-time policy run is in flight. */ + policyEnforcing?: boolean; } export function FormSaveBar({ file, isFormFillToolActive, onApply, + policyEnforcing = false, }: FormSaveBarProps) { const { t } = useTranslation(); const { state, submitForm } = useFormFill(); @@ -160,37 +157,36 @@ export function FormSaveBar({ - setDismissed(true)} aria-label={t("viewer.formBar.dismiss", "Dismiss")} - /> + > + + {isDirty && ( diff --git a/frontend/editor/src/core/types/toolApiTypes.ts b/frontend/editor/src/core/types/toolApiTypes.ts new file mode 100644 index 0000000000..d62e13b20f --- /dev/null +++ b/frontend/editor/src/core/types/toolApiTypes.ts @@ -0,0 +1,1594 @@ +// AUTO-GENERATED FILE. DO NOT EDIT. +// Generated by editor/scripts/generate-tool-api-types.mts from the Java OpenAPI spec +// (SwaggerDoc.json). Regenerate with: task frontend:tool-models +// Tools that take only a file input have no parameters; their model is Record. + +export interface AddAttachmentRequest { + /** + * The image file to be overlaid onto the PDF. + */ + attachments: string[]; + /** + * Convert the resulting PDF to PDF/A-3b format after adding attachments + */ + convertToPdfA3b?: boolean; +} +export interface AddCommentsRequest { + /** + * JSON array of comment specs. Each element has: {pageIndex, x, y, width, height, text, author?, subject?}. Coordinates are PDF user-space with origin at the page's bottom-left. + */ + comments: string; +} +export interface AddPageNumbersRequest { + /** + * Custom margin: small/medium/large/x-large + */ + customMargin?: "small" | "medium" | "large" | "x-large"; + /** + * Custom text pattern. Available variables: {n}=current page number, {total}=total pages, {filename}=original filename + */ + customText?: string; + /** + * Hex colour for page numbers (e.g. #FF0000) + */ + fontColor?: string; + /** + * Font size for page numbers + */ + fontSize?: number; + /** + * Font type for page numbers + */ + fontType: "helvetica" | "courier" | "times"; + /** + * The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5') + */ + pageNumbers?: string; + /** + * Which pages to number (e.g. '1,3-5,7' or 'all') + */ + pagesToNumber?: string; + /** + * Position: 1-9 representing positions on the page (1=top-left, 2=top-center, 3=top-right, 4=middle-left, 5=middle-center, 6=middle-right, 7=bottom-left, 8=bottom-center, 9=bottom-right) + */ + position: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9; + /** + * Starting number for page numbering + */ + startingNumber?: number; + /** + * Zero-padding width for page numbers (Bates Stamping). Set to 0 to disable padding + */ + zeroPad?: number; +} +export interface AddPasswordRequest { + /** + * The length of the encryption key + */ + keyLength?: 40 | 128 | 256; + /** + * The owner password to be added to the PDF file (Restricts what can be done with the document once it is opened) + */ + ownerPassword?: string; + /** + * The password to be added to the PDF file (Restricts the opening of the document itself.) + */ + password?: string; + /** + * Whether document assembly is prevented + */ + preventAssembly?: boolean; + /** + * Whether content extraction is prevented + */ + preventExtractContent?: boolean; + /** + * Whether content extraction for accessibility is prevented + */ + preventExtractForAccessibility?: boolean; + /** + * Whether form filling is prevented + */ + preventFillInForm?: boolean; + /** + * Whether document modification is prevented + */ + preventModify?: boolean; + /** + * Whether modification of annotations is prevented + */ + preventModifyAnnotations?: boolean; + /** + * Whether printing of the document is prevented + */ + preventPrinting?: boolean; + /** + * Whether faithful printing is prevented + */ + preventPrintingFaithful?: boolean; +} +export interface AddStampRequest { + /** + * The selected alphabet of the stamp text + */ + alphabet?: "roman" | "arabic" | "japanese" | "korean" | "chinese" | "thai"; + /** + * The color of the stamp text + */ + customColor?: string; + /** + * Specifies the margin size for the stamp. + */ + customMargin?: "small" | "medium" | "large" | "x-large"; + /** + * The font size of the stamp text and image in points. + */ + fontSize?: number; + /** + * The opacity of the stamp (0.0 - 1.0) + */ + opacity?: number; + /** + * Override X coordinate for stamp placement. If set, it will override the position-based calculation. Negative value means no override. + */ + overrideX?: number; + /** + * Override Y coordinate for stamp placement. If set, it will override the position-based calculation. Negative value means no override. + */ + overrideY?: number; + /** + * The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5') + */ + pageNumbers?: string; + /** + * Position for stamp placement based on a 1-9 grid (1: bottom-left, 2: bottom-center, 3: bottom-right, 4: middle-left, 5: middle-center, 6: middle-right, 7: top-left, 8: top-center, 9: top-right) + */ + position?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9; + /** + * The rotation of the stamp in degrees + */ + rotation?: number; + stampImage?: string; + /** + * The stamp text + */ + stampText?: string; + /** + * The stamp type (text or image) + */ + stampType: "text" | "image"; +} +export interface AddWatermarkRequest { + /** + * The selected alphabet + */ + alphabet?: "roman" | "arabic" | "japanese" | "korean" | "chinese" | "thai"; + /** + * Convert the redacted PDF to an image + */ + convertPDFToImage?: boolean; + /** + * The color for watermark + */ + customColor?: string; + /** + * The font size of the watermark text + */ + fontSize?: number; + /** + * The height spacer between watermark elements + */ + heightSpacer?: number; + /** + * The opacity of the watermark (0.0 - 1.0) + */ + opacity?: number; + /** + * The rotation of the watermark in degrees + */ + rotation?: number; + watermarkImage?: string; + /** + * The watermark text + */ + watermarkText?: string; + /** + * The watermark type (text or image) + */ + watermarkType: "text" | "image"; + /** + * The width spacer between watermark elements + */ + widthSpacer?: number; +} +export interface AutoSplitPdfRequest { + /** + * Flag indicating if the duplex mode is active, where the page after the divider also gets removed. + */ + duplexMode?: boolean; +} +export interface BookletImpositionRequest { + /** + * Boolean for if you wish to add border around the pages + */ + addBorder?: boolean; + /** + * Add gutter margin (inner margin for binding) + */ + addGutter?: boolean; + /** + * Generate both front and back sides (double-sided printing) + */ + doubleSided?: boolean; + /** + * For manual duplex: which pass to generate + */ + duplexPass?: "BOTH" | "FIRST" | "SECOND"; + /** + * Flip back sides for short-edge duplex printing (default is long-edge) + */ + flipOnShortEdge?: boolean; + /** + * Gutter margin size in points (used when addGutter is true) + */ + gutterSize?: number; + /** + * The number of pages per side for booklet printing (always 2 for proper booklet). + */ + pagesPerSheet?: 2; + /** + * The spine location for the booklet. + */ + spineLocation?: "LEFT" | "RIGHT"; +} +export interface ConvertCbrToPdfRequest { + /** + * Optimize the output PDF for ebook reading using Ghostscript + */ + optimizeForEbook?: boolean; +} +export interface ConvertCbzToPdfRequest { + /** + * Optimize the output PDF for ebook reading using Ghostscript + */ + optimizeForEbook?: boolean; +} +export interface ConvertEbookToPdfRequest { + /** + * Embed all fonts from the eBook into the generated PDF + */ + embedAllFonts?: true | false; + /** + * Add page numbers to the generated PDF + */ + includePageNumbers?: true | false; + /** + * Add a generated table of contents to the resulting PDF + */ + includeTableOfContents?: true | false; + /** + * Optimize the PDF for eBook reading (smaller file size, better rendering on eInk devices) + */ + optimizeForEbook?: true | false; +} +export type ConvertPdfHtmlRequest = Record; +export type ConvertPdfMarkdownRequest = Record; +export type ConvertPdfTextEditorMetadataRequest = Record; +export interface ConvertPdfTextEditorRequest { + lightweight?: boolean; +} +export interface ConvertPdfToCbrRequest { + /** + * The DPI (Dots Per Inch) for rendering PDF pages as images + */ + dpi: number; +} +export interface ConvertPdfToCbzRequest { + /** + * The DPI (Dots Per Inch) for rendering PDF pages as images + */ + dpi: number; +} +export interface ConvertPdfToEpubRequest { + /** + * Detect headings that look like chapters and insert EPUB page breaks. + */ + detectChapters?: true | false; + /** + * Choose the output format for the ebook. + */ + outputFormat?: "EPUB" | "AZW3"; + /** + * Choose an output profile optimized for the reader device. + */ + targetDevice?: "TABLET_PHONE_IMAGES" | "KINDLE_EINK_TEXT"; +} +export type ConvertPdfXmlRequest = Record; +export interface ConvertToImageRequest { + /** + * The color type of the output image(s) + */ + colorType?: "color" | "greyscale" | "blackwhite"; + /** + * The DPI (dots per inch) for the output image(s) + */ + dpi?: number; + /** + * The output image format + */ + imageFormat?: "png" | "jpeg" | "jpg" | "gif" | "webp"; + /** + * Include annotations such as comments in the output image(s) + */ + includeAnnotations?: boolean; + /** + * The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5') + */ + pageNumbers?: string; + /** + * Choose between a single image containing all pages or separate images for each page + */ + singleOrMultiple?: "single" | "multiple"; +} +export interface ConvertToPdfRequest { + /** + * Whether to automatically rotate the images to better fit the PDF page + */ + autoRotate?: boolean; + /** + * The color type of the output image(s) + */ + colorType?: "color" | "greyscale" | "blackwhite"; + /** + * Option to determine how the image will fit onto the page + */ + fitOption?: "fillPage" | "fitDocumentToImage" | "maintainAspectRatio"; +} +export interface CropPdfForm { + /** + * Enable auto-crop to detect and remove white space + */ + autoCrop?: boolean; + /** + * The height of the crop area + */ + height?: number; + /** + * Whether to remove text outside the crop area (keeps images) + */ + removeDataOutsideCrop?: boolean; + /** + * The width of the crop area + */ + width?: number; + /** + * The x-coordinate of the top-left corner of the crop area + */ + x?: number; + /** + * The y-coordinate of the top-left corner of the crop area + */ + y?: number; +} +export interface DeleteAttachmentRequest { + /** + * The name of the attachment to delete + */ + attachmentName: string; +} +export interface EditTableOfContentsRequest { + /** + * Bookmark structure in JSON format + */ + bookmarkData?: string; + /** + * Whether to replace existing bookmarks or append to them + */ + replaceExisting?: boolean; +} +export interface EditTextRequest { + /** + * Ordered list of find/replace operations. Each replaces every occurrence on the selected pages, in order; later operations see the result of earlier ones (so 'foo'->'foos' then 'foos'->'bars' turns 'foo' into 'bars'). + */ + edits: EditTextOperation[]; + /** + * The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5') + */ + pageNumbers?: string; + /** + * Whether matches must be whole words (boundaries determined by non-word characters) + */ + wholeWordSearch?: boolean; +} +/** + * Ordered list of find/replace operations. Each replaces every occurrence on the selected pages, in order; later operations see the result of earlier ones (so 'foo'->'foos' then 'foos'->'bars' turns 'foo' into 'bars'). + */ +export interface EditTextOperation { + /** + * The literal text to find. + */ + find: string; + /** + * The replacement text. May be empty to delete the matched text. + */ + replace: string; +} +export interface EmlToPdfRequest { + /** + * Download HTML intermediate file instead of PDF + */ + downloadHtml?: boolean; + /** + * Include CC and BCC recipients in header (if available) + */ + includeAllRecipients?: boolean; + /** + * Include email attachments in the PDF output + */ + includeAttachments?: boolean; + /** + * Maximum attachment size in MB to include (default 10MB, range: 1-100) + */ + maxAttachmentSizeMB?: number; +} +export type ExtractAttachmentsRequest = Record; +export interface ExtractHeaderRequest { + /** + * Flag indicating whether to use the first text as a fallback if no suitable title is found. Defaults to false. + */ + useFirstTextAsFallback?: boolean; +} +export interface ExtractImageScansRequest { + /** + * The angle threshold for the image scan extraction + */ + angleThreshold?: number; + /** + * The border size for the image scan extraction + */ + borderSize?: number; + /** + * The minimum area for the image scan extraction + */ + minArea?: number; + /** + * The minimum contour area for the image scan extraction + */ + minContourArea?: number; + /** + * The tolerance for the image scan extraction + */ + tolerance?: number; +} +export interface FlattenRequest { + /** + * True to flatten only the forms, false to flatten full PDF (Convert page to image) + */ + flattenOnlyForms?: boolean; + /** + * Optional DPI for page rendering when flattening the full document. + */ + renderDpi?: number; +} +export interface GeneralExtractBookmarksRequest { + file: string; +} +export type GeneralFile = Record; +export type GeneralPdfToSinglePageRequest = Record; +export type GeneralRemoveImagePdfRequest = Record; +export interface HTMLToPdfRequest { + /** + * Zoom level for displaying the website. Default is '1'. + */ + zoom?: number; +} +export type ListAttachmentsRequest = Record; +export interface ManualRedactPdfRequest { + /** + * Convert the redacted PDF to an image + */ + convertPDFToImage?: boolean; + /** + * The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5') + */ + pageNumbers?: string; + /** + * The color used to fully redact certain pages + */ + pageRedactionColor?: string; + /** + * A list of areas that should be redacted + */ + redactions: RedactionArea[]; +} +/** + * A list of areas that should be redacted + */ +export interface RedactionArea { + /** + * The color used to redact the specified area. + */ + color?: string; + /** + * The height of the area to be redacted. + */ + height?: number; + /** + * The page on which the area should be redacted. + */ + page?: number; + /** + * The width of the area to be redacted. + */ + width?: number; + /** + * The left edge point of the area to be redacted. + */ + x?: number; + /** + * The top edge point of the area to be redacted. + */ + y?: number; +} +export interface MergeMultiplePagesRequest { + /** + * Boolean for if you wish to add border around the pages + */ + addBorder?: boolean; + /** + * The arrangement of pages on the sheet: BY_ROWS fills pages row by row, while BY_COLUMNS fills pages column by column. + */ + arrangement?: "BY_ROWS" | "BY_COLUMNS"; + /** + * Border width (in points) to apply around each page when merging + */ + borderWidth?: number; + /** + * Bottom margin (in points) to apply to the output pages when merging + */ + bottomMargin?: number; + /** + * Number of columns + */ + cols?: number; + /** + * Inner margin (in points) to apply around each page when merging + */ + innerMargin?: number; + /** + * Left margin (in points) to apply to the output pages when merging + */ + leftMargin?: number; + /** + * Input mode: DEFAULT uses pagesPerSheet; CUSTOM uses explicit cols x rows. + */ + mode?: "DEFAULT" | "CUSTOM"; + /** + * The orientation of the output PDF pages + */ + orientation?: "PORTRAIT" | "LANDSCAPE"; + /** + * The number of pages to fit onto a single sheet in the output PDF. + */ + pagesPerSheet?: 2 | 4 | 9 | 16; + /** + * The direction in which pages are arranged on the sheet: LTR (left-to-right) or RTL (right-to-left). + */ + readingDirection?: "LTR" | "RTL"; + /** + * Right margin (in points) to apply to the output pages when merging + */ + rightMargin?: number; + /** + * Number of rows + */ + rows?: number; + /** + * Top margin (in points) to apply to the output pages when merging + */ + topMargin?: number; +} +export interface MergePdfsRequest { + /** + * JSON array of client-provided IDs for each uploaded file (same order as fileInput) + */ + clientFileIds?: string; + fileOrder?: string; + /** + * Flag indicating whether to generate a table of contents for the merged PDF. If true, a table of contents will be created using the input filenames as chapter names. + */ + generateToc?: boolean; + /** + * Flag indicating whether to remove certification signatures from the merged PDF. If true, all certification signatures will be removed from the final merged document. + */ + removeCertSign?: boolean; + /** + * The type of sorting to be applied on the input files before merging. + */ + sortType?: + | "orderProvided" + | "byFileName" + | "byDateModified" + | "byDateCreated" + | "byPDFTitle"; +} +export interface MetadataRequest { + /** + * Map list of key and value of custom parameters. Note these must start with customKey and customValue if they are non-standard + */ + allRequestParams?: { + /** + * Map list of key and value of custom parameters. Note these must start with customKey and customValue if they are non-standard + */ + [k: string]: string | undefined; + }; + /** + * The author of the document + */ + author?: string; + /** + * The creation date of the document (format: yyyy/MM/dd HH:mm:ss) + */ + creationDate?: string; + /** + * The creator of the document + */ + creator?: string; + /** + * Delete all metadata if set to true + */ + deleteAll?: boolean; + /** + * The keywords for the document + */ + keywords?: string; + /** + * The modification date of the document (format: yyyy/MM/dd HH:mm:ss) + */ + modificationDate?: string; + /** + * The producer of the document + */ + producer?: string; + /** + * The subject of the document + */ + subject?: string; + /** + * The title of the document + */ + title?: string; + /** + * The trapped status of the document + */ + trapped?: "True" | "False" | "Unknown"; +} +export type MiscDecompressPdfRequest = Record; +export type MiscRepairRequest = Record; +export type MiscShowJavascriptRequest = Record; +export type MiscUnlockPdfFormsRequest = Record; +export interface OptimizePdfRequest { + /** + * The expected output size, e.g. '100MB', '25KB', etc. + */ + expectedOutputSize?: string; + /** + * Whether to convert the PDF to grayscale. Default is false. + */ + grayscale?: boolean; + /** + * Whether to convert images to high-contrast line art using ImageMagick. Default is false. + */ + lineArt?: boolean; + /** + * Edge detection strength to use for line art conversion (1-3). This maps to ImageMagick's -edge radius. + */ + lineArtEdgeLevel?: 1 | 2 | 3; + /** + * Threshold to use for line art conversion (0-100). + */ + lineArtThreshold?: number; + /** + * Whether to linearize the PDF for faster web viewing. Default is false. + */ + linearize?: boolean; + /** + * Whether to normalize the PDF content for better compatibility. Default is false. + */ + normalize?: boolean; + /** + * The level of optimization to apply to the PDF file. Higher values indicate greater compression but may reduce quality. + */ + optimizeLevel: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9; +} +export interface OverlayImageRequest { + /** + * Whether to overlay the image onto every page of the PDF. + */ + everyPage?: boolean; + imageFile: string; + /** + * The x-coordinate at which to place the top-left corner of the image. + */ + x?: number; + /** + * The y-coordinate at which to place the top-left corner of the image. + */ + y?: number; +} +export interface OverlayPdfsRequest { + /** + * An array of integers specifying the number of times each corresponding overlay file should be applied in the 'FixedRepeatOverlay' mode. This should match the length of the overlayFiles array. + */ + counts?: number[]; + /** + * An array of PDF files to be used as overlays on the base PDF. The order in these files is applied based on the selected mode. + */ + overlayFiles: string[]; + /** + * The mode of overlaying: 'SequentialOverlay' for sequential application, 'InterleavedOverlay' for round-robin application, 'FixedRepeatOverlay' for fixed repetition based on provided counts + */ + overlayMode: + | "SequentialOverlay" + | "InterleavedOverlay" + | "FixedRepeatOverlay"; + /** + * Overlay position 0 is Foregound, 1 is Background + */ + overlayPosition: 0 | 1; +} +export interface PDFExtractImagesRequest { + /** + * The output image format e.g., 'png', 'jpeg', or 'gif' + */ + format?: "png" | "jpeg" | "gif"; +} +export interface PDFPasswordRequest { + /** + * The password of the PDF file + */ + password?: string; +} +export type PDFVerificationRequest = Record; +export interface PDFWithPageNums { + /** + * The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5') + */ + pageNumbers?: string; +} +export interface PdfToPdfARequest { + /** + * The output format type (PDF/A or PDF/X) + */ + outputFormat: + | "pdfa" + | "pdfa-1" + | "pdfa-2" + | "pdfa-2b" + | "pdfa-3" + | "pdfa-3b" + | "pdfx"; + /** + * If true, the conversion will fail if the output is not perfectly compliant + */ + strict?: boolean; +} +export interface PdfToPresentationRequest { + /** + * The output Presentation format + */ + outputFormat: "ppt" | "pptx" | "odp"; +} +export interface PdfToTextOrRTFRequest { + /** + * The output Text or RTF format + */ + outputFormat: "rtf" | "txt"; +} +export interface PdfToWordRequest { + /** + * The output Word document format + */ + outputFormat: "doc" | "docx" | "odt"; +} +export interface PdfVectorExportRequest { + /** + * Target vector format extension + */ + outputFormat?: "eps" | "ps" | "pcl" | "xps"; + /** + * Apply Ghostscript prepress settings + */ + prepress?: true | false; +} +export interface Pkcs11CertificatesRequest { + libraryPath?: string; + pin?: string; + slot?: number; +} +export interface PosterPdfRequest { + /** + * Target page size for output chunks (e.g., 'A4', 'Letter', 'A3') + */ + pageSize: "A4" | "Letter" | "A3" | "A5" | "Legal" | "Tabloid"; + /** + * Split right-to-left instead of left-to-right + */ + rightToLeft?: boolean; + /** + * Horizontal decimation factor (how many columns to split into) + */ + xFactor?: number; + /** + * Vertical decimation factor (how many rows to split into) + */ + yFactor?: number; +} +export interface ProcessPdfWithOcrRequest { + /** + * Clean the input file if set to true + */ + clean?: boolean; + /** + * Clean the final output if set to true + */ + cleanFinal?: boolean; + /** + * Deskew the input file if set to true + */ + deskew?: boolean; + /** + * List of languages to use in OCR processing, e.g., 'eng', 'deu' + */ + languages?: string[]; + /** + * Specify the OCR render type, either 'hocr' or 'sandwich' + */ + ocrRenderType?: "hocr" | "sandwich"; + /** + * Specify the OCR type, e.g., 'skip-text', 'force-ocr', or 'Normal' + */ + ocrType: "skip-text" | "force-ocr" | "Normal"; + /** + * Remove images from the output PDF if set to true + */ + removeImagesAfter?: boolean; + /** + * Include OCR text in a sidecar text file if set to true + */ + sidecar?: boolean; +} +export interface RearrangePagesRequest { + /** + * The custom mode for page rearrangement. Valid values are: + * CUSTOM: Uses order defined in PageNums DUPLICATE: Duplicate pages n times (if Page order defined as 4, then duplicates each page 4 times)REVERSE_ORDER: Reverses the order of all pages. + * DUPLEX_SORT: Sorts pages as if all fronts were scanned then all backs in reverse (1, n, 2, n-1, ...). BOOKLET_SORT: Arranges pages for booklet printing (last, first, second, second last, ...). + * ODD_EVEN_SPLIT: Splits and arranges pages into odd and even numbered pages. + * REMOVE_FIRST: Removes the first page. + * REMOVE_LAST: Removes the last page. + * REMOVE_FIRST_AND_LAST: Removes both the first and the last pages. + * + */ + customMode?: + | "CUSTOM" + | "REVERSE_ORDER" + | "DUPLEX_SORT" + | "BOOKLET_SORT" + | "SIDE_STITCH_BOOKLET_SORT" + | "ODD_EVEN_SPLIT" + | "REMOVE_FIRST" + | "REMOVE_LAST" + | "REMOVE_FIRST_AND_LAST" + | "DUPLICATE"; + /** + * The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5') + */ + pageNumbers?: string; +} +export interface RedactExecuteRequest { + /** + * Rectangular areas to black out, each defined by a page number and bounding box coordinates. + */ + imageBoxes?: ImageBox[]; + /** + * Text ranges to redact by specifying a start and end anchor phrase. All content between the two phrases (inclusive) is redacted. Anchors work best when short and unique. They must appear verbatim in the document. + */ + ranges?: TextRange[]; + /** + * 1-indexed page numbers to redact all detected images from. Pass an empty list to redact images from every page. Omit or pass null to skip image redaction entirely. + */ + redactImagePages?: number[]; + /** + * Regex patterns to match and redact. Each match anywhere in the document is blacked out. Uses Java/PCRE regex syntax. Well-suited for strings that follow known patterns, like phone numbers, email addresses, national ID numbers, or dates (which can appear with different separators, optional country codes, etc.). For fixed known strings such as names, use textValues instead. + */ + regexPatterns?: string[]; + style?: RedactStyle; + /** + * Exact strings to find and black out. One entry per phrase to redact. Best for known names, identifiers, and specific text found in the document. + */ + textValues?: string[]; + /** + * 1-indexed page numbers to wipe entirely (all content removed from those pages). + */ + wipePages?: number[]; +} +/** + * Rectangular areas to black out, each defined by a page number and bounding box coordinates. + */ +export interface ImageBox { + /** + * 0-indexed page number (first page = 0). + */ + pageIndex: number; + /** + * Left x coordinate of the redaction rectangle in PDF user-space points. + */ + x1: number; + /** + * Right x coordinate of the redaction rectangle in PDF user-space points. + */ + x2: number; + /** + * Top y coordinate of the redaction rectangle in PDF user-space points. + */ + y1: number; + /** + * Bottom y coordinate of the redaction rectangle in PDF user-space points. + */ + y2: number; +} +/** + * Text ranges to redact by specifying a start and end anchor phrase. All content between the two phrases (inclusive) is redacted. Anchors work best when short and unique. They must appear verbatim in the document. + */ +export interface TextRange { + /** + * A short, distinctive phrase (5–15 words) that marks where redaction ends (inclusive). Must appear verbatim in the document. Shorter phrases match more reliably. + */ + endString: string; + /** + * A short, distinctive phrase (5–15 words) that marks where redaction begins (inclusive). Must appear verbatim in the document — e.g. a section heading or a unique sentence fragment. + */ + startString: string; +} +/** + * Redaction style options + */ +export interface RedactStyle { + /** + * Hex redaction box color + */ + color?: string; + /** + * Rasterize output to prevent text extraction + */ + convertToImage?: boolean; + /** + * Extra padding around each box in points + */ + padding?: number; + /** + * Execution strategy hint for the redaction pipeline + */ + strategy?: "AUTO" | "OVERLAY_ONLY" | "IMAGE_FINALIZE"; +} +export interface RedactPdfRequest { + /** + * Convert the redacted PDF to an image + */ + convertPDFToImage?: boolean; + /** + * Custom padding for redaction + */ + customPadding: number; + /** + * List of text to redact from the PDF + */ + listOfText?: string; + /** + * The color for redaction + */ + redactColor?: string; + /** + * Whether to use regex for the listOfText + */ + useRegex?: boolean; + /** + * Whether to use whole word search + */ + wholeWordSearch?: boolean; +} +export interface RemoveBlankPagesRequest { + /** + * The threshold value to determine blank pages + */ + threshold?: number; + /** + * The percentage of white color on a page to consider it as blank + */ + whitePercent?: number; +} +export interface RenameAttachmentRequest { + /** + * The current name of the attachment to rename + */ + attachmentName: string; + /** + * The new name for the attachment + */ + newName: string; +} +export interface ReplaceAndInvertColorRequest { + /** + * If CUSTOM_COLOR option selected, then pick the custom color for background. Expected color value should be 24bit decimal value of a color + */ + backGroundColor?: string; + /** + * If HIGH_CONTRAST_COLOR option selected, then pick the default color option for text and background. + */ + highContrastColorCombination?: + | "WHITE_TEXT_ON_BLACK" + | "BLACK_TEXT_ON_WHITE" + | "YELLOW_TEXT_ON_BLACK" + | "GREEN_TEXT_ON_BLACK"; + /** + * Replace and Invert color options of a pdf. + */ + replaceAndInvertOption?: + | "HIGH_CONTRAST_COLOR" + | "CUSTOM_COLOR" + | "FULL_INVERSION" + | "COLOR_SPACE_CONVERSION"; + /** + * If CUSTOM_COLOR option selected, then pick the custom color for text. Expected color value should be 24bit decimal value of a color + */ + textColor?: string; +} +export interface RotatePDFRequest { + /** + * The clockwise angle by which to rotate all pages in the PDF file. Must be a multiple of 90. + */ + angle: 0 | 90 | 180 | 270; +} +export interface SanitizePdfRequest { + /** + * Remove embedded files from the PDF + */ + removeEmbeddedFiles?: boolean; + /** + * Remove fonts from the PDF + */ + removeFonts?: boolean; + /** + * Remove JavaScript actions from the PDF + */ + removeJavaScript?: boolean; + /** + * Remove links from the PDF + */ + removeLinks?: boolean; + /** + * Remove document info metadata from the PDF + */ + removeMetadata?: boolean; + /** + * Remove XMP metadata from the PDF + */ + removeXMPMetadata?: boolean; +} +export interface ScalePagesRequest { + /** + * Orientation to apply to the target page size. Ignored when pageSize is KEEP. + */ + orientation?: "PORTRAIT" | "LANDSCAPE"; + /** + * The scale of pages in the output PDF. Acceptable values are A0-A6, LETTER, LEGAL, KEEP. + */ + pageSize: + | "A0" + | "A1" + | "A2" + | "A3" + | "A4" + | "A5" + | "A6" + | "LETTER" + | "LEGAL" + | "KEEP"; + /** + * The scale of the content on the pages of the output PDF. Acceptable values are floats. + */ + scaleFactor?: number; +} +export interface ScannerEffectRequest { + /** + * Whether advanced settings are enabled + */ + advancedEnabled?: boolean; + /** + * Blur amount (0 = none, higher = more blur) + */ + blur?: number; + /** + * Border thickness in pixels + */ + border?: number; + /** + * Brightness multiplier (1.0 = no change) + */ + brightness?: number; + /** + * Colorspace for output image + */ + colorspace?: "grayscale" | "color"; + /** + * Contrast multiplier (1.0 = no change) + */ + contrast?: number; + /** + * Noise amount (0 = none, higher = more noise) + */ + noise?: number; + /** + * Scan quality preset + */ + quality: "low" | "medium" | "high"; + /** + * Rendering resolution in DPI + */ + resolution?: number; + /** + * Base rotation in degrees + */ + rotate?: number; + /** + * Random rotation variance in degrees + */ + rotateVariance?: number; + /** + * Rotation preset + */ + rotation: "none" | "slight" | "moderate" | "severe"; + rotationValue?: number; + /** + * Simulate yellowed paper + */ + yellowish?: boolean; +} +export interface SecurityCertSignSessionsRequest { + file: string; + request?: WorkflowCreationRequest; +} +export interface WorkflowCreationRequest { + documentName?: string; + dueDate?: string; + message?: string; + ownerEmail?: string; + participantEmails?: string[]; + participantUserIds?: number[]; + workflowMetadata?: string; + workflowType?: "SIGNING" | "REVIEW" | "APPROVAL"; +} +export interface SecurityCertSignValidateCertificateRequest { + certType: string; + jksFile?: string; + p12File?: string; + password?: string; +} +export type SecurityGetInfoOnPdfRequest = Record; +export type SecurityRemoveCertSignRequest = Record; +export interface SignPDFWithCertRequest { + /** + * The alias of the certificate to sign with. Required for WINDOWS_STORE and recommended for PKCS11 tokens holding multiple certificates. + */ + alias?: string; + certFile?: string; + /** + * The type of the digital certificate. WINDOWS_STORE and PKCS11 are hardware-backed and only available in the desktop app. + */ + certType: + | "PEM" + | "PKCS12" + | "PFX" + | "JKS" + | "SERVER" + | "WINDOWS_STORE" + | "PKCS11"; + jksFile?: string; + /** + * The location where the PDF is signed + */ + location?: string; + /** + * The name of the signer + */ + name?: string; + p12File?: string; + /** + * The page number where the signature should be visible. This is required if showSignature is set to true + */ + pageNumber?: number; + /** + * The password for the keystore / private key, or the token PIN for PKCS11 + */ + password?: string; + /** + * Absolute path to the PKCS#11 driver library (required for PKCS11 type). Must be an allowed driver - a detected one or configured via STIRLING_PKCS11_LIBRARIES. + */ + pkcs11LibraryPath?: string; + /** + * Optional PKCS#11 slot index. When omitted the first slot with a token is used. + */ + pkcs11Slot?: number; + privateKeyFile?: string; + /** + * The reason for signing the PDF + */ + reason?: string; + /** + * Whether to visually show a signature logo along with the signature + */ + showLogo?: boolean; + /** + * Whether to visually show the signature in the PDF file + */ + showSignature?: boolean; +} +export interface SignatureValidationRequest { + certFile?: string; +} +export interface SplitPagesRequest { + /** + * Split points - page numbers after which the PDF will be cut. For example, `"2"` produces two documents (pages 1-2 and pages 3+); `"2,5"` produces three (pages 1-2, 3-5, 6+). Supports ranges (e.g. `"1,3,5-9"` splits after pages 1, 3, 5, 6, 7, 8, 9, yielding 8 documents), `"all"` (split after every page), or functions like `"2n+1"`, `"3n"`, `"6n-5"`. + */ + pageNumbers?: string; +} +export interface SplitPdfByChaptersRequest { + /** + * Whether to allow duplicates or not + */ + allowDuplicates?: boolean; + /** + * Maximum bookmark level required + */ + bookmarkLevel?: number; + /** + * Whether to include Metadata or not + */ + includeMetadata?: boolean; +} +export interface SplitPdfBySectionsRequest { + /** + * Number of horizontal divisions for each PDF page + */ + horizontalDivisions?: number; + /** + * Merge the split documents into a single PDF + */ + merge?: boolean; + /** + * Pages to be split by section + */ + pageNumbers?: string; + /** + * Modes for page split. Valid values are: + * SPLIT_ALL_EXCEPT_FIRST_AND_LAST: Splits all except the first and the last pages. + * SPLIT_ALL_EXCEPT_FIRST: Splits all except the first page. + * SPLIT_ALL_EXCEPT_LAST: Splits all except the last page. + * SPLIT_ALL: Splits all pages. + * CUSTOM: Custom split. + * + */ + splitMode?: + | "CUSTOM" + | "SPLIT_ALL_EXCEPT_FIRST_AND_LAST" + | "SPLIT_ALL_EXCEPT_FIRST" + | "SPLIT_ALL_EXCEPT_LAST" + | "SPLIT_ALL"; + /** + * Number of vertical divisions for each PDF page + */ + verticalDivisions?: number; +} +export interface SplitPdfBySizeOrCountRequest { + /** + * Determines the type of split: 0 for size, 1 for page count, 2 for document count + */ + splitType?: number; + /** + * Value for split: size in MB (e.g., '10MB') or number of pages (e.g., '5') + */ + splitValue?: string; +} +export interface SvgToPdfRequest { + /** + * Whether to combine all SVG files into a single PDF (each SVG as a separate page) or create separate PDF files for each SVG. + */ + combineIntoSinglePdf?: boolean; +} +export interface TimestampPdfRequest { + /** + * URL of the RFC 3161 Time Stamp Authority (TSA) server. Must be one of the built-in presets (DigiCert, Sectigo, SSL.com, FreeTSA, MeSign) or an admin-configured URL in settings.yml (security.timestamp.customTsaUrls). If omitted, the server default is used. + */ + tsaUrl?: string; +} +export interface UrlToPdfRequest { + /** + * The input URL to be converted to a PDF file + */ + urlInput: string; +} + +/** Endpoint path for a generated tool operation (the operation identity across languages). */ +export type ToolEndpoint = + | "/api/v1/convert/cbr/pdf" + | "/api/v1/convert/cbz/pdf" + | "/api/v1/convert/ebook/pdf" + | "/api/v1/convert/eml/pdf" + | "/api/v1/convert/file/pdf" + | "/api/v1/convert/html/pdf" + | "/api/v1/convert/img/pdf" + | "/api/v1/convert/markdown/pdf" + | "/api/v1/convert/pdf/cbr" + | "/api/v1/convert/pdf/cbz" + | "/api/v1/convert/pdf/csv" + | "/api/v1/convert/pdf/epub" + | "/api/v1/convert/pdf/html" + | "/api/v1/convert/pdf/img" + | "/api/v1/convert/pdf/markdown" + | "/api/v1/convert/pdf/pdfa" + | "/api/v1/convert/pdf/presentation" + | "/api/v1/convert/pdf/text" + | "/api/v1/convert/pdf/text-editor" + | "/api/v1/convert/pdf/text-editor/metadata" + | "/api/v1/convert/pdf/vector" + | "/api/v1/convert/pdf/word" + | "/api/v1/convert/pdf/xlsx" + | "/api/v1/convert/pdf/xml" + | "/api/v1/convert/svg/pdf" + | "/api/v1/convert/text-editor/pdf" + | "/api/v1/convert/url/pdf" + | "/api/v1/convert/vector/pdf" + | "/api/v1/general/booklet-imposition" + | "/api/v1/general/crop" + | "/api/v1/general/edit-table-of-contents" + | "/api/v1/general/edit-text" + | "/api/v1/general/extract-bookmarks" + | "/api/v1/general/merge-pdfs" + | "/api/v1/general/multi-page-layout" + | "/api/v1/general/overlay-pdfs" + | "/api/v1/general/pdf-to-single-page" + | "/api/v1/general/rearrange-pages" + | "/api/v1/general/remove-image-pdf" + | "/api/v1/general/remove-pages" + | "/api/v1/general/rotate-pdf" + | "/api/v1/general/scale-pages" + | "/api/v1/general/split-by-size-or-count" + | "/api/v1/general/split-for-poster-print" + | "/api/v1/general/split-pages" + | "/api/v1/general/split-pdf-by-chapters" + | "/api/v1/general/split-pdf-by-sections" + | "/api/v1/misc/add-attachments" + | "/api/v1/misc/add-comments" + | "/api/v1/misc/add-image" + | "/api/v1/misc/add-page-numbers" + | "/api/v1/misc/add-stamp" + | "/api/v1/misc/auto-rename" + | "/api/v1/misc/auto-split-pdf" + | "/api/v1/misc/compress-pdf" + | "/api/v1/misc/decompress-pdf" + | "/api/v1/misc/delete-attachment" + | "/api/v1/misc/extract-attachments" + | "/api/v1/misc/extract-image-scans" + | "/api/v1/misc/extract-images" + | "/api/v1/misc/flatten" + | "/api/v1/misc/list-attachments" + | "/api/v1/misc/ocr-pdf" + | "/api/v1/misc/remove-blanks" + | "/api/v1/misc/rename-attachment" + | "/api/v1/misc/repair" + | "/api/v1/misc/replace-invert-pdf" + | "/api/v1/misc/scanner-effect" + | "/api/v1/misc/show-javascript" + | "/api/v1/misc/unlock-pdf-forms" + | "/api/v1/misc/update-metadata" + | "/api/v1/security/add-password" + | "/api/v1/security/add-watermark" + | "/api/v1/security/auto-redact" + | "/api/v1/security/cert-sign" + | "/api/v1/security/cert-sign/hardware/pkcs11-certificates" + | "/api/v1/security/cert-sign/sessions" + | "/api/v1/security/cert-sign/validate-certificate" + | "/api/v1/security/get-info-on-pdf" + | "/api/v1/security/redact" + | "/api/v1/security/redact-execute" + | "/api/v1/security/remove-cert-sign" + | "/api/v1/security/remove-password" + | "/api/v1/security/sanitize-pdf" + | "/api/v1/security/timestamp-pdf" + | "/api/v1/security/validate-signature" + | "/api/v1/security/verify-pdf"; + +/** Backend request-parameter model for each tool endpoint. */ +export interface ToolApiParams { + "/api/v1/convert/cbr/pdf": ConvertCbrToPdfRequest; + "/api/v1/convert/cbz/pdf": ConvertCbzToPdfRequest; + "/api/v1/convert/ebook/pdf": ConvertEbookToPdfRequest; + "/api/v1/convert/eml/pdf": EmlToPdfRequest; + "/api/v1/convert/file/pdf": GeneralFile; + "/api/v1/convert/html/pdf": HTMLToPdfRequest; + "/api/v1/convert/img/pdf": ConvertToPdfRequest; + "/api/v1/convert/markdown/pdf": GeneralFile; + "/api/v1/convert/pdf/cbr": ConvertPdfToCbrRequest; + "/api/v1/convert/pdf/cbz": ConvertPdfToCbzRequest; + "/api/v1/convert/pdf/csv": PDFWithPageNums; + "/api/v1/convert/pdf/epub": ConvertPdfToEpubRequest; + "/api/v1/convert/pdf/html": ConvertPdfHtmlRequest; + "/api/v1/convert/pdf/img": ConvertToImageRequest; + "/api/v1/convert/pdf/markdown": ConvertPdfMarkdownRequest; + "/api/v1/convert/pdf/pdfa": PdfToPdfARequest; + "/api/v1/convert/pdf/presentation": PdfToPresentationRequest; + "/api/v1/convert/pdf/text": PdfToTextOrRTFRequest; + "/api/v1/convert/pdf/text-editor": ConvertPdfTextEditorRequest; + "/api/v1/convert/pdf/text-editor/metadata": ConvertPdfTextEditorMetadataRequest; + "/api/v1/convert/pdf/vector": PdfVectorExportRequest; + "/api/v1/convert/pdf/word": PdfToWordRequest; + "/api/v1/convert/pdf/xlsx": PDFWithPageNums; + "/api/v1/convert/pdf/xml": ConvertPdfXmlRequest; + "/api/v1/convert/svg/pdf": SvgToPdfRequest; + "/api/v1/convert/text-editor/pdf": GeneralFile; + "/api/v1/convert/url/pdf": UrlToPdfRequest; + "/api/v1/convert/vector/pdf": PdfVectorExportRequest; + "/api/v1/general/booklet-imposition": BookletImpositionRequest; + "/api/v1/general/crop": CropPdfForm; + "/api/v1/general/edit-table-of-contents": EditTableOfContentsRequest; + "/api/v1/general/edit-text": EditTextRequest; + "/api/v1/general/extract-bookmarks": GeneralExtractBookmarksRequest; + "/api/v1/general/merge-pdfs": MergePdfsRequest; + "/api/v1/general/multi-page-layout": MergeMultiplePagesRequest; + "/api/v1/general/overlay-pdfs": OverlayPdfsRequest; + "/api/v1/general/pdf-to-single-page": GeneralPdfToSinglePageRequest; + "/api/v1/general/rearrange-pages": RearrangePagesRequest; + "/api/v1/general/remove-image-pdf": GeneralRemoveImagePdfRequest; + "/api/v1/general/remove-pages": PDFWithPageNums; + "/api/v1/general/rotate-pdf": RotatePDFRequest; + "/api/v1/general/scale-pages": ScalePagesRequest; + "/api/v1/general/split-by-size-or-count": SplitPdfBySizeOrCountRequest; + "/api/v1/general/split-for-poster-print": PosterPdfRequest; + "/api/v1/general/split-pages": SplitPagesRequest; + "/api/v1/general/split-pdf-by-chapters": SplitPdfByChaptersRequest; + "/api/v1/general/split-pdf-by-sections": SplitPdfBySectionsRequest; + "/api/v1/misc/add-attachments": AddAttachmentRequest; + "/api/v1/misc/add-comments": AddCommentsRequest; + "/api/v1/misc/add-image": OverlayImageRequest; + "/api/v1/misc/add-page-numbers": AddPageNumbersRequest; + "/api/v1/misc/add-stamp": AddStampRequest; + "/api/v1/misc/auto-rename": ExtractHeaderRequest; + "/api/v1/misc/auto-split-pdf": AutoSplitPdfRequest; + "/api/v1/misc/compress-pdf": OptimizePdfRequest; + "/api/v1/misc/decompress-pdf": MiscDecompressPdfRequest; + "/api/v1/misc/delete-attachment": DeleteAttachmentRequest; + "/api/v1/misc/extract-attachments": ExtractAttachmentsRequest; + "/api/v1/misc/extract-image-scans": ExtractImageScansRequest; + "/api/v1/misc/extract-images": PDFExtractImagesRequest; + "/api/v1/misc/flatten": FlattenRequest; + "/api/v1/misc/list-attachments": ListAttachmentsRequest; + "/api/v1/misc/ocr-pdf": ProcessPdfWithOcrRequest; + "/api/v1/misc/remove-blanks": RemoveBlankPagesRequest; + "/api/v1/misc/rename-attachment": RenameAttachmentRequest; + "/api/v1/misc/repair": MiscRepairRequest; + "/api/v1/misc/replace-invert-pdf": ReplaceAndInvertColorRequest; + "/api/v1/misc/scanner-effect": ScannerEffectRequest; + "/api/v1/misc/show-javascript": MiscShowJavascriptRequest; + "/api/v1/misc/unlock-pdf-forms": MiscUnlockPdfFormsRequest; + "/api/v1/misc/update-metadata": MetadataRequest; + "/api/v1/security/add-password": AddPasswordRequest; + "/api/v1/security/add-watermark": AddWatermarkRequest; + "/api/v1/security/auto-redact": RedactPdfRequest; + "/api/v1/security/cert-sign": SignPDFWithCertRequest; + "/api/v1/security/cert-sign/hardware/pkcs11-certificates": Pkcs11CertificatesRequest; + "/api/v1/security/cert-sign/sessions": SecurityCertSignSessionsRequest; + "/api/v1/security/cert-sign/validate-certificate": SecurityCertSignValidateCertificateRequest; + "/api/v1/security/get-info-on-pdf": SecurityGetInfoOnPdfRequest; + "/api/v1/security/redact": ManualRedactPdfRequest; + "/api/v1/security/redact-execute": RedactExecuteRequest; + "/api/v1/security/remove-cert-sign": SecurityRemoveCertSignRequest; + "/api/v1/security/remove-password": PDFPasswordRequest; + "/api/v1/security/sanitize-pdf": SanitizePdfRequest; + "/api/v1/security/timestamp-pdf": TimestampPdfRequest; + "/api/v1/security/validate-signature": SignatureValidationRequest; + "/api/v1/security/verify-pdf": PDFVerificationRequest; +} + +/** Every generated tool endpoint, for iteration. */ +export const TOOL_ENDPOINTS = [ + "/api/v1/convert/cbr/pdf", + "/api/v1/convert/cbz/pdf", + "/api/v1/convert/ebook/pdf", + "/api/v1/convert/eml/pdf", + "/api/v1/convert/file/pdf", + "/api/v1/convert/html/pdf", + "/api/v1/convert/img/pdf", + "/api/v1/convert/markdown/pdf", + "/api/v1/convert/pdf/cbr", + "/api/v1/convert/pdf/cbz", + "/api/v1/convert/pdf/csv", + "/api/v1/convert/pdf/epub", + "/api/v1/convert/pdf/html", + "/api/v1/convert/pdf/img", + "/api/v1/convert/pdf/markdown", + "/api/v1/convert/pdf/pdfa", + "/api/v1/convert/pdf/presentation", + "/api/v1/convert/pdf/text", + "/api/v1/convert/pdf/text-editor", + "/api/v1/convert/pdf/text-editor/metadata", + "/api/v1/convert/pdf/vector", + "/api/v1/convert/pdf/word", + "/api/v1/convert/pdf/xlsx", + "/api/v1/convert/pdf/xml", + "/api/v1/convert/svg/pdf", + "/api/v1/convert/text-editor/pdf", + "/api/v1/convert/url/pdf", + "/api/v1/convert/vector/pdf", + "/api/v1/general/booklet-imposition", + "/api/v1/general/crop", + "/api/v1/general/edit-table-of-contents", + "/api/v1/general/edit-text", + "/api/v1/general/extract-bookmarks", + "/api/v1/general/merge-pdfs", + "/api/v1/general/multi-page-layout", + "/api/v1/general/overlay-pdfs", + "/api/v1/general/pdf-to-single-page", + "/api/v1/general/rearrange-pages", + "/api/v1/general/remove-image-pdf", + "/api/v1/general/remove-pages", + "/api/v1/general/rotate-pdf", + "/api/v1/general/scale-pages", + "/api/v1/general/split-by-size-or-count", + "/api/v1/general/split-for-poster-print", + "/api/v1/general/split-pages", + "/api/v1/general/split-pdf-by-chapters", + "/api/v1/general/split-pdf-by-sections", + "/api/v1/misc/add-attachments", + "/api/v1/misc/add-comments", + "/api/v1/misc/add-image", + "/api/v1/misc/add-page-numbers", + "/api/v1/misc/add-stamp", + "/api/v1/misc/auto-rename", + "/api/v1/misc/auto-split-pdf", + "/api/v1/misc/compress-pdf", + "/api/v1/misc/decompress-pdf", + "/api/v1/misc/delete-attachment", + "/api/v1/misc/extract-attachments", + "/api/v1/misc/extract-image-scans", + "/api/v1/misc/extract-images", + "/api/v1/misc/flatten", + "/api/v1/misc/list-attachments", + "/api/v1/misc/ocr-pdf", + "/api/v1/misc/remove-blanks", + "/api/v1/misc/rename-attachment", + "/api/v1/misc/repair", + "/api/v1/misc/replace-invert-pdf", + "/api/v1/misc/scanner-effect", + "/api/v1/misc/show-javascript", + "/api/v1/misc/unlock-pdf-forms", + "/api/v1/misc/update-metadata", + "/api/v1/security/add-password", + "/api/v1/security/add-watermark", + "/api/v1/security/auto-redact", + "/api/v1/security/cert-sign", + "/api/v1/security/cert-sign/hardware/pkcs11-certificates", + "/api/v1/security/cert-sign/sessions", + "/api/v1/security/cert-sign/validate-certificate", + "/api/v1/security/get-info-on-pdf", + "/api/v1/security/redact", + "/api/v1/security/redact-execute", + "/api/v1/security/remove-cert-sign", + "/api/v1/security/remove-password", + "/api/v1/security/sanitize-pdf", + "/api/v1/security/timestamp-pdf", + "/api/v1/security/validate-signature", + "/api/v1/security/verify-pdf", +] as const satisfies readonly ToolEndpoint[]; + +/** Union of every generated tool request model. */ +export type ToolApiRequest = ToolApiParams[ToolEndpoint]; diff --git a/frontend/editor/src/core/ui/ActionIcon.css b/frontend/editor/src/core/ui/ActionIcon.css new file mode 100644 index 0000000000..1a56a484e2 --- /dev/null +++ b/frontend/editor/src/core/ui/ActionIcon.css @@ -0,0 +1,21 @@ +/* Mantine ActionIcon-backed — colour driven by the shared accent palette (accents.css). */ +@import "./accents.css"; + +/* ---- shape ---- */ +.sui-ai--circle.mantine-ActionIcon-root { + --ai-radius: 50%; +} +.sui-ai--pill.mantine-ActionIcon-root { + --ai-radius: 9999px; +} + +/* ---- gradient accents: brighten on hover instead of a hard bg swap ---- */ +.sui-acc-ai.sui-ai--primary:not([data-disabled]):hover, +.sui-acc-premium.sui-ai--primary:not([data-disabled]):hover { + filter: brightness(1.06); +} + +/* no-hover: !important to beat Mantine's own :hover background rule. */ +.sui-ai--no-hover:not([data-disabled]):hover { + background: var(--ai-bg, transparent) !important; +} diff --git a/frontend/editor/src/core/ui/ActionIcon.stories.tsx b/frontend/editor/src/core/ui/ActionIcon.stories.tsx new file mode 100644 index 0000000000..a4df1359dc --- /dev/null +++ b/frontend/editor/src/core/ui/ActionIcon.stories.tsx @@ -0,0 +1,132 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { ActionIcon } from "@app/ui/ActionIcon"; + +const Plus = () => ( + + + +); +const Trash = () => ( + + + +); + +const ACCENTS = [ + "default", + "neutral", + "brand", + "ai", + "premium", + "danger", + "success", + "warning", +] as const; + +const meta: Meta = { + title: "Primitives/ActionIcon", + component: ActionIcon, + parameters: { layout: "centered" }, + args: { + variant: "primary", + accent: "default", + size: "md", + "aria-label": "Add", + }, + argTypes: { + variant: { + control: "inline-radio", + options: ["primary", "secondary", "tertiary", "quiet"], + }, + accent: { control: "inline-radio", options: ACCENTS }, + size: { control: "inline-radio", options: ["sm", "md", "lg", "xl"] }, + shape: { control: "inline-radio", options: ["default", "circle", "pill"] }, + }, +}; +export default meta; +type Story = StoryObj; + +const Wrap = ({ children }: { children: React.ReactNode }) => ( +
    + {children} +
    +); + +export const Playground: Story = { + render: (args) => ( + + + + ), +}; + +/** The three variants × every accent. */ +export const Accents: Story = { + render: () => ( +
    + {(["primary", "secondary", "tertiary"] as const).flatMap((variant) => + ACCENTS.map((accent) => ( + + + + )), + )} +
    + ), +}; + +/** Square at every size; the icon scales with `1em`. */ +export const Sizes: Story = { + render: () => ( + + {(["sm", "md", "lg", "xl"] as const).map((size) => ( + + + + ))} + + ), +}; + +export const Shapes: Story = { + render: () => ( + + + + + + + + + + + + ), +}; diff --git a/frontend/editor/src/core/ui/ActionIcon.tsx b/frontend/editor/src/core/ui/ActionIcon.tsx new file mode 100644 index 0000000000..44584be569 --- /dev/null +++ b/frontend/editor/src/core/ui/ActionIcon.tsx @@ -0,0 +1,140 @@ +import { ActionIcon as MantineActionIcon } from "@mantine/core"; +import { forwardRef } from "react"; +import type { + ComponentPropsWithoutRef, + CSSProperties, + ElementType, + ReactNode, +} from "react"; +import { CONTROL_HEIGHT } from "@app/ui/controlSizes"; +import "@app/ui/ActionIcon.css"; + +/** Icon-only button (square) — same variant/accent dials as Button. */ +export type ActionIconVariant = "primary" | "secondary" | "tertiary" | "quiet"; +export type ActionIconAccent = + | "default" + | "neutral" + | "brand" + | "ai" + | "premium" + | "danger" + | "success" + | "warning"; +export type ActionIconSize = "sm" | "md" | "lg" | "xl"; +export type ActionIconShape = "default" | "circle" | "pill"; + +type ActionIconOwnProps = { + variant?: ActionIconVariant; + accent?: ActionIconAccent; + size?: ActionIconSize; + shape?: ActionIconShape; + /** Required — an icon-only control must have an accessible name. */ + "aria-label": string; + loading?: boolean; + /** false = no hover background change. */ + hover?: boolean; + /** Polymorphic root element (e.g. `"a"` or a router Link). */ + as?: ElementType; + style?: CSSProperties; + /** The icon. */ + children?: ReactNode; +}; + +export type ActionIconProps = ActionIconOwnProps & + Omit< + ComponentPropsWithoutRef<"button">, + keyof ActionIconOwnProps | "color" + > & { + href?: string; + target?: string; + rel?: string; + }; + +const MANTINE_VARIANT: Record = { + primary: "filled", + secondary: "outline", + tertiary: "subtle", + quiet: "subtle", +}; + +export const ActionIcon = forwardRef( + function ActionIcon( + { + variant = "primary", + accent = "default", + size = "md", + shape = "default", + loading = false, + hover = true, + as, + disabled, + className, + style, + children, + ...rest + }, + ref, + ) { + const classes = [ + "sui-ai", + `sui-acc-${accent}`, + `sui-ai--${variant}`, + shape !== "default" ? `sui-ai--${shape}` : "", + !hover ? "sui-ai--no-hover" : "", + className ?? "", + ] + .filter(Boolean) + .join(" "); + + // Accent palette → Mantine ActionIcon vars (inline to win). --ai-bd is a full `border` shorthand. + const accentVars = + variant === "primary" + ? { + "--ai-bg": "var(--_solid)", + "--ai-hover": "var(--_solid-hover)", + "--ai-color": "var(--_on)", + "--ai-bd": "1px solid transparent", + } + : variant === "quiet" + ? { + "--ai-bg": "transparent", + "--ai-hover": "transparent", + "--ai-color": "var(--_text)", + "--ai-hover-color": "var(--color-text-1)", + "--ai-bd": "1px solid transparent", + } + : { + "--ai-bg": "transparent", + "--ai-hover": "var(--_tint)", + "--ai-color": "var(--_text)", + "--ai-bd": + variant === "secondary" + ? "1px solid var(--_bd)" + : "1px solid transparent", + }; + + // Loosely-typed alias so the polymorphic `component={as}` doesn't fight Mantine's typing. + const Comp = MantineActionIcon as ElementType; + + return ( + + {children} + + ); + }, +); diff --git a/frontend/editor/src/proprietary/ui/Avatar.css b/frontend/editor/src/core/ui/Avatar.css similarity index 100% rename from frontend/editor/src/proprietary/ui/Avatar.css rename to frontend/editor/src/core/ui/Avatar.css diff --git a/frontend/editor/src/proprietary/ui/Avatar.stories.tsx b/frontend/editor/src/core/ui/Avatar.stories.tsx similarity index 100% rename from frontend/editor/src/proprietary/ui/Avatar.stories.tsx rename to frontend/editor/src/core/ui/Avatar.stories.tsx diff --git a/frontend/editor/src/proprietary/ui/Avatar.tsx b/frontend/editor/src/core/ui/Avatar.tsx similarity index 100% rename from frontend/editor/src/proprietary/ui/Avatar.tsx rename to frontend/editor/src/core/ui/Avatar.tsx diff --git a/frontend/editor/src/proprietary/ui/Banner.css b/frontend/editor/src/core/ui/Banner.css similarity index 85% rename from frontend/editor/src/proprietary/ui/Banner.css rename to frontend/editor/src/core/ui/Banner.css index 7d249295b4..937905a915 100644 --- a/frontend/editor/src/proprietary/ui/Banner.css +++ b/frontend/editor/src/core/ui/Banner.css @@ -76,19 +76,10 @@ align-items: center; } +/* Sizing/background/hover are owned by the ActionIcon; this just keeps it from + * stretching and sizes the × glyph. */ .sui-banner__close { flex: 0 0 auto; - width: 1.5rem; - height: 1.5rem; - display: inline-flex; - align-items: center; - justify-content: center; - border-radius: var(--radius-sm); - color: var(--color-text-4); - font-size: 1rem; + font-size: 1.125rem; line-height: 1; } -.sui-banner__close:hover { - background: rgba(0, 0, 0, 0.06); - color: var(--color-text-1); -} diff --git a/frontend/editor/src/proprietary/ui/Banner.stories.tsx b/frontend/editor/src/core/ui/Banner.stories.tsx similarity index 96% rename from frontend/editor/src/proprietary/ui/Banner.stories.tsx rename to frontend/editor/src/core/ui/Banner.stories.tsx index c6b8ddfd1e..891cf66b78 100644 --- a/frontend/editor/src/proprietary/ui/Banner.stories.tsx +++ b/frontend/editor/src/core/ui/Banner.stories.tsx @@ -39,7 +39,7 @@ export const WithAction: Story = { title: "Approaching cap", description: "389k of 500k docs processed.", action: ( - ), diff --git a/frontend/editor/src/proprietary/ui/Banner.tsx b/frontend/editor/src/core/ui/Banner.tsx similarity index 71% rename from frontend/editor/src/proprietary/ui/Banner.tsx rename to frontend/editor/src/core/ui/Banner.tsx index b7db925740..ca89f57aab 100644 --- a/frontend/editor/src/proprietary/ui/Banner.tsx +++ b/frontend/editor/src/core/ui/Banner.tsx @@ -1,4 +1,5 @@ import type { ReactNode } from "react"; +import { ActionIcon } from "@app/ui/ActionIcon"; import "@app/ui/Banner.css"; export type BannerTone = "info" | "success" | "warning" | "danger" | "neutral"; @@ -7,21 +8,15 @@ export interface BannerProps { tone?: BannerTone; title?: ReactNode; description?: ReactNode; - /** Right-aligned action — typically a button. */ action?: ReactNode; - /** When set, shows an × button that calls this handler. */ onDismiss?: () => void; - /** Optional leading icon (caller supplies — keeps the primitive icon-set-agnostic). */ + /** Caller-supplied icon keeps this component icon-set-agnostic. */ icon?: ReactNode; className?: string; children?: ReactNode; } -/** - * Inline alert. Use `tone` to convey severity; pair with `action` for - * "Approaching cap → Upgrade" style flows. Use `Toast` (separate primitive) - * for transient/dismissible notifications layered over the UI. - */ +/** Inline alert. Use Toast for transient overlay notifications instead. */ export function Banner({ tone = "info", title, @@ -51,14 +46,17 @@ export function Banner({ {action &&
    {action}
    } {onDismiss && ( - + × +     )} ); diff --git a/frontend/editor/src/core/ui/Button.css b/frontend/editor/src/core/ui/Button.css new file mode 100644 index 0000000000..5592711979 --- /dev/null +++ b/frontend/editor/src/core/ui/Button.css @@ -0,0 +1,41 @@ +/* Mantine-backed Button — colour driven by the shared accent palette (accents.css). */ +@import "./accents.css"; + +/* ---- icon-only: square, no horizontal padding ---- */ +.sui-btn--icon.mantine-Button-root { + --button-padding-x: 0; + width: var(--button-height); + min-width: var(--button-height); +} +/* Zero the section margin / hide the empty label so the lone icon centres. */ +.sui-btn--icon .mantine-Button-section { + margin-inline: 0; +} +.sui-btn--icon .mantine-Button-label { + display: none; +} + +/* ---- shape ---- */ +.sui-btn--circle.mantine-Button-root { + --button-radius: 50%; +} +.sui-btn--pill.mantine-Button-root { + --button-radius: 9999px; +} + +/* ---- gradient accents: brighten on hover instead of a hard bg swap ---- */ +/* [data-disabled] too: :disabled never matches polymorphic (as="a") roots. */ +.sui-acc-ai.sui-btn--primary:not(:disabled):not([data-disabled]):hover, +.sui-acc-premium.sui-btn--primary:not(:disabled):not([data-disabled]):hover { + filter: brightness(1.06); +} + +/* ---- overflow: default wraps the label; Mantine's label is nowrap ---- */ +.sui-btn--wrap .mantine-Button-label { + white-space: normal; +} + +/* no-hover: !important to beat Mantine's own :hover background rule. */ +.sui-btn--no-hover:not(:disabled):not([data-disabled]):hover { + background: var(--button-bg, transparent) !important; +} diff --git a/frontend/editor/src/core/ui/Button.stories.tsx b/frontend/editor/src/core/ui/Button.stories.tsx new file mode 100644 index 0000000000..2def9e099f --- /dev/null +++ b/frontend/editor/src/core/ui/Button.stories.tsx @@ -0,0 +1,293 @@ +import type { ReactNode } from "react"; +import type { Meta, StoryObj } from "@storybook/react"; +import { Button } from "@app/ui/Button"; + +/* tiny inline icons for the demos */ +const Plus = () => ( + + + +); +const Arrow = () => ( + + + +); +const Trash = () => ( + + + +); +const Sparkle = () => ( + + + + +); + +const meta: Meta = { + title: "Primitives/Button", + component: Button, + parameters: { layout: "centered" }, + args: { text: "Button", variant: "primary", accent: "default", size: "md" }, + argTypes: { + variant: { + control: "inline-radio", + options: ["primary", "secondary", "tertiary", "quiet"], + }, + accent: { + control: "inline-radio", + options: [ + "default", + "neutral", + "brand", + "ai", + "premium", + "danger", + "success", + "warning", + ], + }, + size: { control: "inline-radio", options: ["sm", "md", "lg", "xl"] }, + justify: { + control: "inline-radio", + options: ["center", "start", "end", "between"], + }, + shape: { control: "inline-radio", options: ["default", "circle", "pill"] }, + text: { control: "text" }, + }, +}; +export default meta; +type Story = StoryObj; + +const Wrap = ({ children }: { children: ReactNode }) => ( +
    + {children} +
    +); + +/** Tweak every prop live with the controls. */ +export const Playground: Story = {}; + +/** The three fill treatments. */ +export const Variants: Story = { + render: (args) => ( + + - +
    Compose document workflows from typed operations.

    - - +

    Agents

    Wire your agent via MCP, REST, or tool definitions.

    -     diff --git a/frontend/editor/src/proprietary/ui/Card.tsx b/frontend/editor/src/core/ui/Card.tsx similarity index 86% rename from frontend/editor/src/proprietary/ui/Card.tsx rename to frontend/editor/src/core/ui/Card.tsx index 27eb7aed62..dbdb1a393a 100644 --- a/frontend/editor/src/proprietary/ui/Card.tsx +++ b/frontend/editor/src/core/ui/Card.tsx @@ -1,9 +1,17 @@ import type { HTMLAttributes, ReactNode } from "react"; import "@app/ui/Card.css"; +/** Subset of the shared accent dial that has a styled strip (see Card.css). */ +export type CardAccent = + | "default" + | "premium" + | "danger" + | "success" + | "warning"; + export interface CardProps extends HTMLAttributes { /** Adds an accent strip on the left edge of the card. */ - accent?: "blue" | "purple" | "green" | "amber" | "red"; + accent?: CardAccent; /** * Padding profile. `tight` = 0.75rem, `default` = 1.125rem, `loose` = 1.5rem. * `none` removes padding so the card surface can host edge-to-edge content diff --git a/frontend/editor/src/proprietary/ui/ChatFABButton.css b/frontend/editor/src/core/ui/ChatFABButton.css similarity index 100% rename from frontend/editor/src/proprietary/ui/ChatFABButton.css rename to frontend/editor/src/core/ui/ChatFABButton.css diff --git a/frontend/editor/src/proprietary/ui/ChatFABButton.stories.tsx b/frontend/editor/src/core/ui/ChatFABButton.stories.tsx similarity index 90% rename from frontend/editor/src/proprietary/ui/ChatFABButton.stories.tsx rename to frontend/editor/src/core/ui/ChatFABButton.stories.tsx index c6986dad14..5e85738b57 100644 --- a/frontend/editor/src/proprietary/ui/ChatFABButton.stories.tsx +++ b/frontend/editor/src/core/ui/ChatFABButton.stories.tsx @@ -6,7 +6,7 @@ const meta: Meta = { component: ChatFABButton, parameters: { layout: "centered" }, argTypes: { - isLoading: { control: "boolean" }, + loading: { control: "boolean" }, showTick: { control: "boolean" }, onClick: { action: "clicked" }, }, @@ -19,7 +19,7 @@ export const Default: Story = {}; /** Agent is actively working — the logo paths animate and a green pulse dot appears. */ export const Loading: Story = { - args: { isLoading: true }, + args: { loading: true }, }; /** Agent finished while the panel was closed — tick badge pops in to signal an unread result. */ @@ -33,5 +33,5 @@ export const Tick: Story = { * In practice this transition is handled by the parent via `hasUnviewedResult`. */ export const TickWhileLoading: Story = { - args: { isLoading: true, showTick: true }, + args: { loading: true, showTick: true }, }; diff --git a/frontend/editor/src/proprietary/ui/ChatFABButton.tsx b/frontend/editor/src/core/ui/ChatFABButton.tsx similarity index 84% rename from frontend/editor/src/proprietary/ui/ChatFABButton.tsx rename to frontend/editor/src/core/ui/ChatFABButton.tsx index 8ee8e74d7a..5ba3c8113b 100644 --- a/frontend/editor/src/proprietary/ui/ChatFABButton.tsx +++ b/frontend/editor/src/core/ui/ChatFABButton.tsx @@ -2,21 +2,21 @@ import type { ButtonHTMLAttributes } from "react"; import "@app/ui/ChatFABButton.css"; export interface ChatFABButtonProps extends ButtonHTMLAttributes { - /** Shows a green pulse dot to indicate the agent is actively working. */ - isLoading?: boolean; - /** Shows a green tick badge to indicate an unread result is waiting. */ + /** Green pulse dot — agent is working. */ + loading?: boolean; + /** Green tick badge — unread result waiting. */ showTick?: boolean; } export function ChatFABButton({ - isLoading = false, + loading = false, showTick = false, className, ...rest }: ChatFABButtonProps) { const classes = [ "chat-fab-btn", - isLoading ? "chat-fab-btn--loading" : "", + loading ? "chat-fab-btn--loading" : "", showTick ? "chat-fab-btn--tick" : "", className ?? "", ] @@ -39,7 +39,7 @@ export function ChatFABButton({ /> - {isLoading && !showTick && ( + {loading && !showTick && ( 
    diff --git a/frontend/editor/src/proprietary/ui/Collapsible.css b/frontend/editor/src/core/ui/Collapsible.css
similarity index 100%
rename from frontend/editor/src/proprietary/ui/Collapsible.css
rename to frontend/editor/src/core/ui/Collapsible.css
diff --git a/frontend/editor/src/proprietary/ui/Collapsible.stories.tsx b/frontend/editor/src/core/ui/Collapsible.stories.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/Collapsible.stories.tsx
rename to frontend/editor/src/core/ui/Collapsible.stories.tsx
diff --git a/frontend/editor/src/proprietary/ui/Collapsible.tsx b/frontend/editor/src/core/ui/Collapsible.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/Collapsible.tsx
rename to frontend/editor/src/core/ui/Collapsible.tsx
diff --git a/frontend/editor/src/core/ui/ColorInput.tsx b/frontend/editor/src/core/ui/ColorInput.tsx
new file mode 100644
index 0000000000..6063ecf688
--- /dev/null
+++ b/frontend/editor/src/core/ui/ColorInput.tsx
@@ -0,0 +1,146 @@
+import type React from "react";
+import {
+  ColorInput as MantineColorInput,
+  type ColorInputProps as MantineColorInputProps,
+} from "@mantine/core";
+import { useInputAria } from "@app/ui/ariaForwarding";
+import "@app/ui/MantineForms.css";
+
+const SUI_INPUT_VARS = {
+  "--input-bg": "var(--color-surface)",
+  "--input-bd": "var(--color-border-input)",
+  "--input-bd-focus": "var(--color-blue)",
+  "--input-radius": "var(--radius-md)",
+  "--input-color": "var(--color-text-1)",
+  "--input-placeholder-color": "var(--color-text-placeholder)",
+  "--input-height-sm": "1.75rem",
+  "--input-height-md": "2.25rem",
+} as React.CSSProperties;
+
+export type ColorInputSize = "sm" | "md";
+
+export interface ColorInputProps {
+  // Value
+  value?: string;
+  onChange?: (value: string) => void;
+  defaultValue?: string;
+
+  // Behaviour
+  format?: "hex" | "hexa" | "rgb" | "rgba" | "hsl" | "hsla";
+  swatches?: string[];
+  swatchesPerRow?: number;
+  withPicker?: boolean;
+
+  // Popover escape hatch — only for zIndex / offset overrides in modals
+  popoverProps?: MantineColorInputProps["popoverProps"];
+
+  // Form
+  placeholder?: string;
+  id?: string;
+  name?: string;
+  "aria-label"?: string;
+  "aria-invalid"?: boolean;
+  "aria-describedby"?: string;
+  required?: boolean;
+  disabled?: boolean;
+  readOnly?: boolean;
+  onFocus?: React.FocusEventHandler;
+  onBlur?: React.FocusEventHandler;
+
+  // SUI — invalid applies error styling; FormField renders the message itself.
+  inputSize?: ColorInputSize;
+  invalid?: boolean;
+}
+
+type PassthroughProps = Omit<
+  Pick<
+    MantineColorInputProps,
+    | "value"
+    | "onChange"
+    | "defaultValue"
+    | "format"
+    | "swatches"
+    | "swatchesPerRow"
+    | "withPicker"
+    | "popoverProps"
+    | "placeholder"
+    | "id"
+    | "name"
+    | "aria-label"
+    | "aria-describedby"
+    | "required"
+    | "disabled"
+    | "readOnly"
+    | "onFocus"
+    | "onBlur"
+  >,
+  never
+>;
+
+/**
+ * SUI colour picker input with swatch preview and popover picker. Use with
+ *  for labels and error display. Appearance is locked to SUI tokens.
+ *
+ * Defaults to hex format. Pass `popoverProps={{ withinPortal: true, zIndex: Z }}` when
+ * rendering inside a modal.
+ */
+export function ColorInput({
+  inputSize = "md",
+  invalid,
+  format = "hex",
+  value,
+  onChange,
+  defaultValue,
+  swatches,
+  swatchesPerRow,
+  withPicker,
+  popoverProps,
+  placeholder,
+  id,
+  name,
+  "aria-label": ariaLabel,
+  "aria-invalid": ariaInvalid,
+  "aria-describedby": ariaDescribedBy,
+  required,
+  disabled,
+  readOnly,
+  onFocus,
+  onBlur,
+}: ColorInputProps) {
+  const inputRef = useInputAria({ describedBy: ariaDescribedBy });
+  const passthroughProps: PassthroughProps = {
+    value,
+    onChange,
+    defaultValue,
+    format,
+    swatches,
+    swatchesPerRow,
+    withPicker,
+    popoverProps,
+    placeholder,
+    id,
+    name,
+    "aria-label": ariaLabel,
+    "aria-describedby": ariaDescribedBy,
+    required,
+    disabled,
+    readOnly,
+    onFocus,
+    onBlur,
+  };
+
+  return (
+    
+  );
+}
diff --git a/frontend/editor/src/proprietary/ui/DataRow.css b/frontend/editor/src/core/ui/DataRow.css
similarity index 100%
rename from frontend/editor/src/proprietary/ui/DataRow.css
rename to frontend/editor/src/core/ui/DataRow.css
diff --git a/frontend/editor/src/proprietary/ui/DataRow.stories.tsx b/frontend/editor/src/core/ui/DataRow.stories.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/DataRow.stories.tsx
rename to frontend/editor/src/core/ui/DataRow.stories.tsx
diff --git a/frontend/editor/src/proprietary/ui/DataRow.tsx b/frontend/editor/src/core/ui/DataRow.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/DataRow.tsx
rename to frontend/editor/src/core/ui/DataRow.tsx
diff --git a/frontend/editor/src/proprietary/ui/Drawer.css b/frontend/editor/src/core/ui/Drawer.css
similarity index 83%
rename from frontend/editor/src/proprietary/ui/Drawer.css
rename to frontend/editor/src/core/ui/Drawer.css
index d2b90f26a7..8972bbefc2 100644
--- a/frontend/editor/src/proprietary/ui/Drawer.css
+++ b/frontend/editor/src/core/ui/Drawer.css
@@ -75,22 +75,10 @@
   color: var(--color-text-4);
 }
 
+/* Sizing/background/hover are owned by the Button; this just keeps it from
+ * stretching. */
 .sui-drawer__close {
   flex: 0 0 auto;
-  width: 1.75rem;
-  height: 1.75rem;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: var(--radius-sm);
-  color: var(--color-text-4);
-  transition:
-    background var(--motion-fast),
-    color var(--motion-fast);
-}
-.sui-drawer__close:hover {
-  background: var(--color-bg-hover);
-  color: var(--color-text-1);
 }
 
 .sui-drawer__body {
diff --git a/frontend/editor/src/proprietary/ui/Drawer.stories.tsx b/frontend/editor/src/core/ui/Drawer.stories.tsx
similarity index 91%
rename from frontend/editor/src/proprietary/ui/Drawer.stories.tsx
rename to frontend/editor/src/core/ui/Drawer.stories.tsx
index 3600d774a2..c1df90536b 100644
--- a/frontend/editor/src/proprietary/ui/Drawer.stories.tsx
+++ b/frontend/editor/src/core/ui/Drawer.stories.tsx
@@ -71,11 +71,11 @@ export const WithFooter: Story = {
             subtitle="COI Compliance · us-east-1"
             footer={
               <>
-                
-                
-                
+                
+                
               
             }
           >
diff --git a/frontend/editor/src/proprietary/ui/Drawer.tsx b/frontend/editor/src/core/ui/Drawer.tsx
similarity index 75%
rename from frontend/editor/src/proprietary/ui/Drawer.tsx
rename to frontend/editor/src/core/ui/Drawer.tsx
index 20279c3c59..7327b854dc 100644
--- a/frontend/editor/src/proprietary/ui/Drawer.tsx
+++ b/frontend/editor/src/core/ui/Drawer.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useId, type ReactNode } from "react";
 import { createPortal } from "react-dom";
 import { FocusTrap } from "@mantine/core";
+import { Button } from "@app/ui/Button";
 import "@app/ui/Drawer.css";
 
 export type DrawerSide = "right" | "left";
@@ -10,11 +11,10 @@ export interface DrawerProps {
   open: boolean;
   onClose: () => void;
   side?: DrawerSide;
-  /** Width preset. sm=22rem, md=27.5rem, lg=36rem. */
+  /** sm=22rem, md=27.5rem, lg=36rem. */
   width?: DrawerWidth;
   title?: ReactNode;
   subtitle?: ReactNode;
-  /** Sticky footer slot below the body. */
   footer?: ReactNode;
   disableBackdropClose?: boolean;
   disableEscapeClose?: boolean;
@@ -23,12 +23,7 @@ export interface DrawerProps {
   children?: ReactNode;
 }
 
-/**
- * Side drawer — sibling to {@link Modal}, with our own brand shell. Tab focus
- * trapping, initial focus, and focus restoration on close are delegated to
- * Mantine's ; we keep the slide-in chrome, scroll lock, and ESC /
- * backdrop dismissal.
- */
+/** Tab focus trapping and restoration are delegated to Mantine's FocusTrap. */
 export function Drawer({
   open,
   onClose,
@@ -104,27 +99,31 @@ export function Drawer({
                 )}
                 {subtitle && 
    {subtitle}
    }
               
-              
+                leftSection={
+                  
+                    
+                    
+                  
+                }
+              />
             
           )}
           
    {children}
    
diff --git a/frontend/editor/src/proprietary/ui/Dropdown.css b/frontend/editor/src/core/ui/Dropdown.css
similarity index 86%
rename from frontend/editor/src/proprietary/ui/Dropdown.css
rename to frontend/editor/src/core/ui/Dropdown.css
index c96aec1672..736371e6ae 100644
--- a/frontend/editor/src/proprietary/ui/Dropdown.css
+++ b/frontend/editor/src/core/ui/Dropdown.css
@@ -36,6 +36,12 @@
   font-size: 0.8125rem;
   color: var(--color-text-2);
   border-radius: var(--radius-sm);
+  /* Explicit button reset: hosts without a global button reset (e.g. the
+     editor) would otherwise show the UA's buttonface background and border. */
+  background: none;
+  border: none;
+  font-family: inherit;
+  cursor: pointer;
   transition:
     background var(--motion-fast),
     color var(--motion-fast);
diff --git a/frontend/editor/src/proprietary/ui/Dropdown.stories.tsx b/frontend/editor/src/core/ui/Dropdown.stories.tsx
similarity index 90%
rename from frontend/editor/src/proprietary/ui/Dropdown.stories.tsx
rename to frontend/editor/src/core/ui/Dropdown.stories.tsx
index 7e05785ee6..ad84a09fb1 100644
--- a/frontend/editor/src/proprietary/ui/Dropdown.stories.tsx
+++ b/frontend/editor/src/core/ui/Dropdown.stories.tsx
@@ -20,7 +20,7 @@ export const Basic: Story = {
   render: () => (
     
       
-        
+        
       
       
          console.log("a")}>Item A
@@ -37,7 +37,7 @@ export const WithDivider: Story = {
   render: () => (
     
       
-        
+        
       
       
         Profile
@@ -53,7 +53,7 @@ export const WithTrailingHints: Story = {
   render: () => (
     
       
-        
+        
       
       
         Search
@@ -71,7 +71,7 @@ export const AlignStart: Story = {
   render: () => (
     
       
-        
+        
       
       
         One
diff --git a/frontend/editor/src/proprietary/ui/Dropdown.tsx b/frontend/editor/src/core/ui/Dropdown.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/Dropdown.tsx
rename to frontend/editor/src/core/ui/Dropdown.tsx
diff --git a/frontend/editor/src/proprietary/ui/EmptyState.css b/frontend/editor/src/core/ui/EmptyState.css
similarity index 100%
rename from frontend/editor/src/proprietary/ui/EmptyState.css
rename to frontend/editor/src/core/ui/EmptyState.css
diff --git a/frontend/editor/src/proprietary/ui/EmptyState.stories.tsx b/frontend/editor/src/core/ui/EmptyState.stories.tsx
similarity index 90%
rename from frontend/editor/src/proprietary/ui/EmptyState.stories.tsx
rename to frontend/editor/src/core/ui/EmptyState.stories.tsx
index ac153ec0b0..859b498c5f 100644
--- a/frontend/editor/src/proprietary/ui/EmptyState.stories.tsx
+++ b/frontend/editor/src/core/ui/EmptyState.stories.tsx
@@ -31,10 +31,10 @@ export const WithCTAs: Story = {
       "The fastest way in is forking a pre-bundled pipeline like PII Sweep or Compliance Pack.",
     actions: (
       <>
-        
-        
+        
       
     ),
   },
diff --git a/frontend/editor/src/proprietary/ui/EmptyState.tsx b/frontend/editor/src/core/ui/EmptyState.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/EmptyState.tsx
rename to frontend/editor/src/core/ui/EmptyState.tsx
diff --git a/frontend/editor/src/core/ui/FilePicker.tsx b/frontend/editor/src/core/ui/FilePicker.tsx
new file mode 100644
index 0000000000..3e33b20e46
--- /dev/null
+++ b/frontend/editor/src/core/ui/FilePicker.tsx
@@ -0,0 +1,55 @@
+import { FileButton as MantineFileButton } from "@mantine/core";
+import type { ForwardedRef, ReactNode } from "react";
+import { Button } from "@app/ui/Button";
+import type { ButtonProps } from "@app/ui/Button";
+
+type TriggerButtonProps = Omit<
+  ButtonProps,
+  "onClick" | "onChange" | "children"
+>;
+
+export interface FilePickerProps<
+  Multiple extends boolean = false,
+> extends TriggerButtonProps {
+  /** Called with the picked file(s); null when the dialog is dismissed. */
+  onChange: (payload: Multiple extends true ? File[] : File | null) => void;
+  accept?: string;
+  multiple?: Multiple;
+  /** Ref to a function that clears the current selection (Mantine resetRef). */
+  resetRef?: ForwardedRef<() => void>;
+  name?: string;
+  capture?: boolean | "user" | "environment";
+  /** Trigger label. */
+  children?: ReactNode;
+}
+
+/** File-picker button: a shared Button trigger over a hidden file input (Mantine FileButton). */
+export function FilePicker({
+  onChange,
+  accept,
+  multiple,
+  resetRef,
+  name,
+  capture,
+  disabled,
+  children,
+  ...buttonProps
+}: FilePickerProps) {
+  return (
+    
+      onChange={onChange}
+      accept={accept}
+      multiple={multiple}
+      resetRef={resetRef}
+      name={name}
+      capture={capture}
+      disabled={disabled}
+    >
+      {(props) => (
+        
+      )}
+    
+  );
+}
diff --git a/frontend/editor/src/proprietary/ui/FormField.css b/frontend/editor/src/core/ui/FormField.css
similarity index 100%
rename from frontend/editor/src/proprietary/ui/FormField.css
rename to frontend/editor/src/core/ui/FormField.css
diff --git a/frontend/editor/src/proprietary/ui/FormField.tsx b/frontend/editor/src/core/ui/FormField.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/FormField.tsx
rename to frontend/editor/src/core/ui/FormField.tsx
diff --git a/frontend/editor/src/proprietary/ui/Forms.stories.tsx b/frontend/editor/src/core/ui/Forms.stories.tsx
similarity index 93%
rename from frontend/editor/src/proprietary/ui/Forms.stories.tsx
rename to frontend/editor/src/core/ui/Forms.stories.tsx
index 10f4e0b1c3..0d14cf3392 100644
--- a/frontend/editor/src/proprietary/ui/Forms.stories.tsx
+++ b/frontend/editor/src/core/ui/Forms.stories.tsx
@@ -73,23 +73,6 @@ export const Input_Error: Story = {
   ),
 };
 
-export const Select_Default: Story = {
-  render: () => (
-    
-       setRetention(e.target.value)}
+              onChange={(value) => setRetention(value ?? "90")}
               options={[
                 { value: "30", label: "30 days" },
                 { value: "90", label: "90 days" },
diff --git a/frontend/editor/src/proprietary/ui/IconBadge.css b/frontend/editor/src/core/ui/IconBadge.css
similarity index 91%
rename from frontend/editor/src/proprietary/ui/IconBadge.css
rename to frontend/editor/src/core/ui/IconBadge.css
index 10e2d28915..43d4eb0af9 100644
--- a/frontend/editor/src/proprietary/ui/IconBadge.css
+++ b/frontend/editor/src/core/ui/IconBadge.css
@@ -34,3 +34,7 @@
 .sui-iconbadge--red {
   --ib-base: var(--color-red);
 }
+.sui-iconbadge--neutral {
+  --ib-base: var(--color-text-1);
+  background: none;
+}
diff --git a/frontend/editor/src/proprietary/ui/IconBadge.stories.tsx b/frontend/editor/src/core/ui/IconBadge.stories.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/IconBadge.stories.tsx
rename to frontend/editor/src/core/ui/IconBadge.stories.tsx
diff --git a/frontend/editor/src/proprietary/ui/IconBadge.tsx b/frontend/editor/src/core/ui/IconBadge.tsx
similarity index 89%
rename from frontend/editor/src/proprietary/ui/IconBadge.tsx
rename to frontend/editor/src/core/ui/IconBadge.tsx
index 9b421d47c5..ae6c5536d1 100644
--- a/frontend/editor/src/proprietary/ui/IconBadge.tsx
+++ b/frontend/editor/src/core/ui/IconBadge.tsx
@@ -1,7 +1,13 @@
 import type { ReactNode } from "react";
 import "@app/ui/IconBadge.css";
 
-export type IconBadgeAccent = "blue" | "purple" | "green" | "amber" | "red";
+export type IconBadgeAccent =
+  | "blue"
+  | "purple"
+  | "green"
+  | "amber"
+  | "red"
+  | "neutral";
 
 export interface IconBadgeProps {
   children: ReactNode;
diff --git a/frontend/editor/src/proprietary/ui/Inline.css b/frontend/editor/src/core/ui/Inline.css
similarity index 100%
rename from frontend/editor/src/proprietary/ui/Inline.css
rename to frontend/editor/src/core/ui/Inline.css
diff --git a/frontend/editor/src/proprietary/ui/Inline.stories.tsx b/frontend/editor/src/core/ui/Inline.stories.tsx
similarity index 88%
rename from frontend/editor/src/proprietary/ui/Inline.stories.tsx
rename to frontend/editor/src/core/ui/Inline.stories.tsx
index b6e4ed54eb..10233e1371 100644
--- a/frontend/editor/src/proprietary/ui/Inline.stories.tsx
+++ b/frontend/editor/src/core/ui/Inline.stories.tsx
@@ -15,9 +15,9 @@ type Story = StoryObj;
 export const Default: Story = {
   render: () => (
     
-      
-      
-      
+      
+      
+      
     
   ),
 };
diff --git a/frontend/editor/src/proprietary/ui/Inline.tsx b/frontend/editor/src/core/ui/Inline.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/Inline.tsx
rename to frontend/editor/src/core/ui/Inline.tsx
diff --git a/frontend/editor/src/proprietary/ui/Input.css b/frontend/editor/src/core/ui/Input.css
similarity index 100%
rename from frontend/editor/src/proprietary/ui/Input.css
rename to frontend/editor/src/core/ui/Input.css
diff --git a/frontend/editor/src/proprietary/ui/Input.tsx b/frontend/editor/src/core/ui/Input.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/Input.tsx
rename to frontend/editor/src/core/ui/Input.tsx
diff --git a/frontend/editor/src/proprietary/ui/ListRow.css b/frontend/editor/src/core/ui/ListRow.css
similarity index 100%
rename from frontend/editor/src/proprietary/ui/ListRow.css
rename to frontend/editor/src/core/ui/ListRow.css
diff --git a/frontend/editor/src/proprietary/ui/ListRow.stories.tsx b/frontend/editor/src/core/ui/ListRow.stories.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/ListRow.stories.tsx
rename to frontend/editor/src/core/ui/ListRow.stories.tsx
diff --git a/frontend/editor/src/proprietary/ui/ListRow.tsx b/frontend/editor/src/core/ui/ListRow.tsx
similarity index 100%
rename from frontend/editor/src/proprietary/ui/ListRow.tsx
rename to frontend/editor/src/core/ui/ListRow.tsx
diff --git a/frontend/editor/src/core/ui/MantineForms.css b/frontend/editor/src/core/ui/MantineForms.css
new file mode 100644
index 0000000000..66551aedf5
--- /dev/null
+++ b/frontend/editor/src/core/ui/MantineForms.css
@@ -0,0 +1,114 @@
+/* ===================================================================
+ * MantineForms.css — SUI design tokens injected into Mantine inputs
+ *
+ * Applied via classNames.wrapper="sui-mantine-wrapper" on each
+ * Mantine-backed SUI component (MultiSelect, NumberInput, ColorInput).
+ * The inline `styles.wrapper` in each component sets the base CSS
+ * variables; this file adds focus ring + pill styling that require
+ * CSS pseudo-selectors or attribute selectors.
+ * =================================================================== */
+
+/* CSS custom properties for Mantine's input system, mapped to SUI tokens.
+ * These are also set as inline styles (higher specificity); the declarations
+ * here act as a typed reference and as a fallback for any slot Mantine reads
+ * before the inline vars are applied. */
+.sui-mantine-wrapper {
+  --input-bg: var(--color-surface);
+  --input-bd: var(--color-border-input);
+  --input-bd-focus: var(--color-blue);
+  --input-radius: var(--radius-md);
+  --input-color: var(--color-text-1);
+  --input-placeholder-color: var(--color-text-placeholder);
+  --input-height-sm: 1.75rem;
+  --input-height-md: 2.25rem;
+  font-size: 0.875rem;
+}
+
+/* SUI focus ring — matches .sui-input:focus-within */
+.sui-mantine-wrapper[data-focused],
+.sui-mantine-wrapper:focus-within {
+  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-blue) 16%, transparent);
+}
+
+/* Error state */
+.sui-mantine-wrapper[data-invalid] {
+  --input-bd: var(--color-red);
+  --input-bd-focus: var(--color-red);
+}
+
+.sui-mantine-wrapper[data-invalid][data-focused],
+.sui-mantine-wrapper[data-invalid]:focus-within {
+  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-red) 16%, transparent);
+}
+
+/* Disabled state */
+.sui-mantine-wrapper[data-disabled] {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+/* ---- MultiSelect pills ---- */
+/* Pills match SUI's Chip component: small rounded tags. */
+.sui-mantine-pill {
+  background: var(--color-blue-light) !important;
+  color: var(--color-blue-dark) !important;
+  border: 1px solid var(--color-blue-border) !important;
+  border-radius: var(--radius-sm) !important;
+  font-size: 0.75rem !important;
+  font-weight: 500 !important;
+}
+
+/* Pills list needs a min-height to not collapse when empty */
+.sui-mantine-pills-list {
+  min-height: var(--input-height-sm, 1.75rem);
+}
+
+/* ---- NumberInput controls (increment/decrement buttons) ---- */
+.sui-mantine-control {
+  border-color: var(--color-border-input) !important;
+  color: var(--color-text-3) !important;
+}
+
+.sui-mantine-control:hover {
+  background: var(--color-bg-hover) !important;
+  color: var(--color-text-1) !important;
+}
+
+/* ---- Select: hide Mantine's right-section clear button border ---- */
+.sui-mantine-wrapper .mantine-Select-section {
+  color: var(--color-text-3);
+}
+
+/* ---- Slider ---- */
+.sui-mantine-slider {
+  --slider-color: var(--color-blue);
+  --slider-track-bg: var(--color-border);
+  --slider-thumb-color: var(--color-surface);
+  --slider-thumb-bd: var(--color-blue);
+}
+
+.sui-mantine-slider:focus-within {
+  outline: none;
+}
+
+/* Thumb focus ring matches SUI */
+.sui-mantine-slider .mantine-Slider-thumb:focus-visible {
+  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-blue) 16%, transparent);
+  outline: none;
+}
+
+/* Mark labels use SUI text tokens */
+.sui-mantine-slider .mantine-Slider-markLabel {
+  color: var(--color-text-3);
+  font-size: 0.75rem;
+}
+
+/* ---- Dark mode: Mantine's own dark-mode vars beat ours when Mantine's
+ * color-scheme is "dark". Reassert SUI tokens so the two systems stay in sync.
+ * SuiProvider syncs forceColorScheme to SUI theme, so
+ * [data-mantine-color-scheme="dark"] === [data-theme="dark"] in practice. ---- */
+[data-mantine-color-scheme="dark"] .sui-mantine-wrapper {
+  --input-bg: var(--color-surface);
+  --input-bd: var(--color-border-input);
+  --input-color: var(--color-text-1);
+}
diff --git a/frontend/editor/src/core/ui/MantineForms.stories.tsx b/frontend/editor/src/core/ui/MantineForms.stories.tsx
new file mode 100644
index 0000000000..dfa40644dd
--- /dev/null
+++ b/frontend/editor/src/core/ui/MantineForms.stories.tsx
@@ -0,0 +1,568 @@
+import { useState } from "react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { FormField } from "@app/ui/FormField";
+import { Stack } from "@app/ui/Stack";
+import { MultiSelect } from "@app/ui/MultiSelect";
+import { NumberInput } from "@app/ui/NumberInput";
+import { ColorInput } from "@app/ui/ColorInput";
+import { Select } from "@app/ui/Select";
+import { Slider } from "@app/ui/Slider";
+
+const PII_OPTIONS = [
+  { value: "ssn", label: "Social Security Number" },
+  { value: "dob", label: "Date of Birth" },
+  { value: "account", label: "Account Number" },
+  { value: "email", label: "Email Address" },
+  { value: "phone", label: "Phone Number" },
+  { value: "address", label: "Postal Address" },
+  { value: "passport", label: "Passport Number" },
+  { value: "license", label: "Driver's License" },
+];
+
+const meta: Meta = {
+  title: "Primitives/Forms",
+  parameters: { layout: "padded" },
+  decorators: [
+    (S) => (
+      
    
+        
+      
    
+    ),
+  ],
+};
+export default meta;
+type Story = StoryObj;
+
+// ─── MultiSelect ─────────────────────────────────────────────────────────────
+
+export const MultiSelect_Default: Story = {
+  render: () => {
+    function Bound() {
+      const [value, setValue] = useState([]);
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const MultiSelect_WithValues: Story = {
+  render: () => {
+    function Bound() {
+      const [value, setValue] = useState(["ssn", "dob", "email"]);
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const MultiSelect_SmSize: Story = {
+  render: () => {
+    function Bound() {
+      const [value, setValue] = useState(["ssn", "email"]);
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const MultiSelect_Error: Story = {
+  render: () => (
+    
+       {}}
+        placeholder="Choose types…"
+        invalid
+      />
+    
+  ),
+};
+
+export const MultiSelect_Disabled: Story = {
+  render: () => (
+    
+       {}}
+        disabled
+      />
+    
+  ),
+};
+
+// ─── NumberInput ─────────────────────────────────────────────────────────────
+
+export const NumberInput_Default: Story = {
+  render: () => {
+    function Bound() {
+      const [value, setValue] = useState(100);
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const NumberInput_Decimal: Story = {
+  render: () => {
+    function Bound() {
+      const [value, setValue] = useState(0.85);
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const NumberInput_WithUnit: Story = {
+  render: () => {
+    function Bound() {
+      const [opacity, setOpacity] = useState(80);
+      const [fontSize, setFontSize] = useState(24);
+      return (
+        
+          
+            
+          
+          
+            
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const NumberInput_SmSize: Story = {
+  render: () => {
+    function Bound() {
+      const [v, setV] = useState(12);
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const NumberInput_Error: Story = {
+  render: () => (
+    
+       {}} invalid />
+    
+  ),
+};
+
+export const NumberInput_Disabled: Story = {
+  render: () => (
+    
+       {}} disabled />
+    
+  ),
+};
+
+// ─── ColorInput ──────────────────────────────────────────────────────────────
+
+export const ColorInput_Default: Story = {
+  render: () => {
+    function Bound() {
+      const [color, setColor] = useState("");
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const ColorInput_Preselected: Story = {
+  render: () => {
+    function Bound() {
+      const [color, setColor] = useState("#3B82F6");
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const ColorInput_SmSize: Story = {
+  render: () => {
+    function Bound() {
+      const [color, setColor] = useState("#EF4444");
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const ColorInput_Error: Story = {
+  render: () => (
+    
+       {}} invalid />
+    
+  ),
+};
+
+export const ColorInput_Disabled: Story = {
+  render: () => (
+    
+       {}} disabled />
+    
+  ),
+};
+
+// ─── Select ──────────────────────────────────────────────────────────────────
+
+const RETENTION_OPTIONS = [
+  { value: "30", label: "30 days" },
+  { value: "60", label: "60 days" },
+  { value: "90", label: "90 days (default)" },
+  { value: "180", label: "180 days" },
+  { value: "never", label: "Never expire" },
+];
+
+export const Select_Default: Story = {
+  render: () => {
+    function Bound() {
+      const [value, setValue] = useState("90");
+      return (
+        
+          
+        
+      );
+    }
+    return ;
+  },
+};
+
+export const Select_SmSize: Story = {
+  render: () => {
+    function Bound() {
+      const [value, setValue] = useState("upload");
+      return (
+        
+           {}}
+        placeholder="Choose…"
+        invalid
+      />
+    
+  ),
+};
+
+export const Select_Disabled: Story = {
+  render: () => (
+    
+       {}}
+        required
+        aria-describedby="help-1"
+      />,
+    );
+    const input = container.querySelector("input");
+    expect(input?.hasAttribute("required")).toBe(true);
+    expect(input?.getAttribute("aria-describedby")).toBe("help-1");
+  });
+
+  it("Select sets aria-invalid from the invalid flag", () => {
+    const { container } = renderInProvider(
+       onRegion(e.target.value)}
+          onChange={(value) => onRegion(value ?? "")}
           options={regionOptions}
         />
       
@@ -639,7 +647,7 @@ function WorkspacePanel({
             
           
         )}
-        
       
@@ -750,8 +758,8 @@ function AuthenticationPanel({
         >
            setQuery(e.target.value)}
+          placeholder={t("portal.documents.search")}
+          aria-label={t("portal.documents.search")}
+          leadingIcon={}
+          inputSize="sm"
+        />
+      
 
       {isLoading && (
         
    
diff --git a/frontend/editor/src/portal/components/documents/ReviewQueueTable.stories.tsx b/frontend/editor/src/portal/components/documents/ReviewQueueTable.stories.tsx
index bf0f6bb640..1ebdd430aa 100644
--- a/frontend/editor/src/portal/components/documents/ReviewQueueTable.stories.tsx
+++ b/frontend/editor/src/portal/components/documents/ReviewQueueTable.stories.tsx
@@ -12,7 +12,7 @@ const meta: Meta = {
   args: { documents: DOCS, onRowClick: () => {} },
   decorators: [
     (S) => (
-      
    
+      
    
         
       
    
     ),
@@ -23,12 +23,10 @@ type Story = StoryObj;
 
 export const Default: Story = {};
 
-/** Only the rows demanding a decision. */
+/** Only the rows that need a human decision. */
 export const NeedsReview: Story = {
   args: {
-    documents: DOCS.filter(
-      (d) => d.status === "needs-review" || d.status === "flagged",
-    ),
+    documents: DOCS.filter((d) => d.status === "flagged"),
   },
 };
 
diff --git a/frontend/editor/src/portal/components/documents/ReviewQueueTable.tsx b/frontend/editor/src/portal/components/documents/ReviewQueueTable.tsx
index 88835344e8..cda3d20ca2 100644
--- a/frontend/editor/src/portal/components/documents/ReviewQueueTable.tsx
+++ b/frontend/editor/src/portal/components/documents/ReviewQueueTable.tsx
@@ -1,22 +1,50 @@
 import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
-import { ProgressBar, StatusBadge, Table, type TableColumn } from "@app/ui";
+import { Button, Chip, StatusBadge, Table, type TableColumn } from "@app/ui";
 import {
+  classificationTone,
   DOCUMENT_STATUS_LABEL,
   DOCUMENT_STATUS_TONE,
+  PRODUCT_CHIP_TONE,
   type ReviewDocument,
 } from "@portal/api/documents";
-import {
-  confidencePct,
-  confidenceTone,
-} from "@portal/components/documents/format";
 
 interface ReviewQueueTableProps {
   documents: ReviewDocument[];
   onRowClick: (doc: ReviewDocument) => void;
 }
 
-/** The document stream — one row per document awaiting a review decision. */
+function BoltIcon() {
+  return (
+    
+      
+    
+  );
+}
+
+function KebabIcon() {
+  return (
+    
+      
+      
+      
+    
+  );
+}
+
+/** The document stream - one row per document your org has processed. */
 export function ReviewQueueTable({
   documents,
   onRowClick,
@@ -25,79 +53,106 @@ export function ReviewQueueTable({
   const columns = useMemo[]>(
     () => [
       {
-        key: "name",
-        header: t("portal.documents.table.columns.name"),
+        key: "document",
+        header: t("portal.documents.table.columns.document"),
         render: (d) => (
-          
    
-            {d.name}
-            {d.sensitive && (
-              
-                🔒
-              
-            )}
+          
    
+            
    
+              {d.name}
+              {d.classification && (
+                
+                  {d.classification}
+                
+              )}
+              {d.auto && (
+                }>
+                  {t("portal.documents.table.auto")}
+                
+              )}
+              {d.sensitive && (
+                
+                  🔒
+                
+              )}
+            
    
+            {d.note && {d.note}}
           
    
         ),
       },
       {
-        key: "type",
-        header: t("portal.documents.table.columns.type"),
-        render: (d) => d.type,
+        key: "product",
+        header: t("portal.documents.table.columns.product"),
+        width: "7rem",
+        render: (d) => (
+          
+            {d.product}
+          
+        ),
+      },
+      {
+        key: "action",
+        header: t("portal.documents.table.columns.action"),
+        width: "12rem",
+        render: (d) =>
+          d.product === "Editor" || !d.action ? (
+            
+              {t("portal.documents.table.editorAction")}
+            
+          ) : (
+            {d.action}
+          ),
+      },
+      {
+        key: "user",
+        header: t("portal.documents.table.columns.user"),
+        width: "8rem",
+        render: (d) => (
+          {d.user || "-"}
+        ),
       },
       {
         key: "status",
         header: t("portal.documents.table.columns.status"),
+        width: "10rem",
         render: (d) => (
           
             {DOCUMENT_STATUS_LABEL[d.status]}
+            {d.status === "in-review" && d.reviewer ? ` · ${d.reviewer}` : ""}
           
         ),
       },
-      {
-        key: "source",
-        header: t("portal.documents.table.columns.source"),
-        render: (d) => (
-          {d.source}
-        ),
-      },
-      {
-        key: "confidence",
-        header: t("portal.documents.table.columns.confidence"),
-        width: "9rem",
-        render: (d) => (
-          
    
-            
-            
-              {confidencePct(d.confidence)}
-            
-          
    
-        ),
-      },
-      {
-        key: "fields",
-        header: t("portal.documents.table.columns.fields"),
-        align: "right",
-        render: (d) => (
-          {d.fieldsExtracted}
-        ),
-      },
       {
         key: "time",
         header: t("portal.documents.table.columns.time"),
-        align: "right",
+        width: "7rem",
         render: (d) => (
           {d.time}
         ),
       },
+      {
+        key: "actions",
+        header: "",
+        width: "3rem",
+        render: (d) => (
+          
+      
 
       {open && (
         
    
@@ -71,7 +71,7 @@ export function ApiKeyCard({ apiKey }: { apiKey: ApiKey }) {
               
    {t("portal.infrastructure.apiKeys.card.permissions")}
    
               
    
                 {apiKey.permissions.map((p) => (
-                  
+                  
                     {p}
                   
                 ))}
@@ -86,7 +86,7 @@ export function ApiKeyCard({ apiKey }: { apiKey: ApiKey }) {
                   
                 ) : (
                   apiKey.allowedIps.map((ip) => (
-                    
+                    
                       {ip}
                     
                   ))
diff --git a/frontend/editor/src/portal/components/infrastructure/ApiKeysTab.tsx b/frontend/editor/src/portal/components/infrastructure/ApiKeysTab.tsx
index a41dca0d20..a93b2c0c56 100644
--- a/frontend/editor/src/portal/components/infrastructure/ApiKeysTab.tsx
+++ b/frontend/editor/src/portal/components/infrastructure/ApiKeysTab.tsx
@@ -24,10 +24,9 @@ export function ApiKeysTab() {
           sub={t("portal.infrastructure.apiKeys.subheading")}
         />
         
diff --git a/frontend/editor/src/portal/components/infrastructure/AuditExportModal.stories.tsx b/frontend/editor/src/portal/components/infrastructure/AuditExportModal.stories.tsx
new file mode 100644
index 0000000000..dc12295a32
--- /dev/null
+++ b/frontend/editor/src/portal/components/infrastructure/AuditExportModal.stories.tsx
@@ -0,0 +1,37 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { http, HttpResponse } from "msw";
+import { AuditExportModal } from "@portal/components/infrastructure/AuditExportModal";
+import "@portal/views/Infrastructure.css";
+
+/**
+ * Export modal for the Infrastructure → Audit tab. Rendered always-open here.
+ * Downloads via the editor's real `/audit-export` endpoint (mocked by MSW), so
+ * clicking "Export" pulls a sample CSV/JSON.
+ */
+const meta: Meta = {
+  title: "Portal/Infrastructure/AuditExportModal",
+  component: AuditExportModal,
+  parameters: { layout: "fullscreen" },
+  args: { open: true, onClose: () => {} },
+};
+export default meta;
+type Story = StoryObj;
+
+export const Open: Story = {};
+
+/**
+ * The export request fails - click "Export" to see the inline error message.
+ * (Overrides the sample-export handler with a 500.)
+ */
+export const ExportFails: Story = {
+  parameters: {
+    msw: {
+      handlers: [
+        http.get(
+          "*/api/v1/proprietary/ui-data/audit-export",
+          () => new HttpResponse(null, { status: 500 }),
+        ),
+      ],
+    },
+  },
+};
diff --git a/frontend/editor/src/portal/components/infrastructure/AuditExportModal.tsx b/frontend/editor/src/portal/components/infrastructure/AuditExportModal.tsx
new file mode 100644
index 0000000000..5b147ed90f
--- /dev/null
+++ b/frontend/editor/src/portal/components/infrastructure/AuditExportModal.tsx
@@ -0,0 +1,139 @@
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Button, Checkbox, Modal, RadioGroup } from "@app/ui";
+import { exportAuditLog } from "@portal/api/infrastructure";
+
+interface AuditExportModalProps {
+  open: boolean;
+  onClose: () => void;
+}
+
+type ExportFormat = "csv" | "json";
+
+/** Columns offered for export - mirrors the editor's audit export section. */
+const FIELD_KEYS = [
+  "date",
+  "username",
+  "ipaddress",
+  "tool",
+  "documentName",
+  "outcome",
+] as const;
+type FieldKey = (typeof FIELD_KEYS)[number];
+
+const DEFAULT_FIELDS: Record = {
+  date: true,
+  username: true,
+  ipaddress: false,
+  tool: true,
+  documentName: true,
+  outcome: true,
+};
+
+/** Export the audit log to CSV/JSON via the admin-only, whole-server endpoint. */
+export function AuditExportModal({ open, onClose }: AuditExportModalProps) {
+  const { t } = useTranslation();
+  const [format, setFormat] = useState("csv");
+  const [fields, setFields] =
+    useState>(DEFAULT_FIELDS);
+  const [exporting, setExporting] = useState(false);
+  const [error, setError] = useState(null);
+
+  const anyField = FIELD_KEYS.some((k) => fields[k]);
+
+  async function handleExport() {
+    setError(null);
+    setExporting(true);
+    try {
+      const fieldsParam = FIELD_KEYS.filter((k) => fields[k]).join(",");
+      const blob = await exportAuditLog(format, fieldsParam);
+      const url = window.URL.createObjectURL(blob);
+      const link = document.createElement("a");
+      link.href = url;
+      link.download = `audit-export-${new Date().toISOString()}.${format}`;
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+      window.URL.revokeObjectURL(url);
+      onClose();
+    } catch {
+      setError(t("portal.infrastructure.audit.export.error"));
+    } finally {
+      setExporting(false);
+    }
+  }
+
+  const fieldLabel: Record = {
+    date: t("portal.infrastructure.audit.export.fields.date"),
+    username: t("portal.infrastructure.audit.export.fields.username"),
+    ipaddress: t("portal.infrastructure.audit.export.fields.ipAddress"),
+    tool: t("portal.infrastructure.audit.export.fields.tool"),
+    documentName: t("portal.infrastructure.audit.export.fields.documentName"),
+    outcome: t("portal.infrastructure.audit.export.fields.outcome"),
+  };
+
+  return (
+    
+          
+          
+        
    
+      }
+    >
+      
    
+        
    
+          
+            {t("portal.infrastructure.audit.export.format")}
+          
+          
+            name="audit-export-format"
+            value={format}
+            onChange={setFormat}
+            direction="horizontal"
+            options={[
+              { value: "csv", label: "CSV" },
+              { value: "json", label: "JSON" },
+            ]}
+          />
+        
    
+
+        
    
+          
+            {t("portal.infrastructure.audit.export.fieldsLegend")}
+          
+          
    
+            {FIELD_KEYS.map((k) => (
+               {
+                  // Capture synchronously; React nulls currentTarget before the state update.
+                  const checked = e.target.checked;
+                  setFields((prev) => ({ ...prev, [k]: checked }));
+                }}
+              />
+            ))}
+          
    
+        
    
+
+        {error && 
    {error}
    }
+      
    
+    
+  );
+}
diff --git a/frontend/editor/src/portal/components/infrastructure/AuditTab.stories.tsx b/frontend/editor/src/portal/components/infrastructure/AuditTab.stories.tsx
index d4aefcd197..3bb2d6dc3c 100644
--- a/frontend/editor/src/portal/components/infrastructure/AuditTab.stories.tsx
+++ b/frontend/editor/src/portal/components/infrastructure/AuditTab.stories.tsx
@@ -24,10 +24,13 @@ export const Loading: Story = {
   parameters: {
     msw: {
       handlers: [
-        http.get("/v1/infrastructure/audit-log", async () => {
-          await delay("infinite");
-          return HttpResponse.json({ summary: {}, events: [] });
-        }),
+        http.get(
+          "*/api/v1/proprietary/ui-data/infrastructure/audit-log",
+          async () => {
+            await delay("infinite");
+            return HttpResponse.json({ summary: {}, events: [] });
+          },
+        ),
       ],
     },
   },
@@ -37,10 +40,84 @@ export const Empty: Story = {
   parameters: {
     msw: {
       handlers: [
-        http.get("/v1/infrastructure/audit-log", () =>
+        http.get("*/api/v1/proprietary/ui-data/infrastructure/audit-log", () =>
           HttpResponse.json({
             summary: { totalEvents: 0, processing: 0, elevation: 0, config: 0 },
             events: [],
+            fullServer: true,
+          }),
+        ),
+      ],
+    },
+  },
+};
+
+// A team member who isn't a lead (or any caller the backend scopes out) gets a
+// 403 - the tab shows the access message, not the "no events" empty state.
+export const NonLeadForbidden: Story = {
+  parameters: {
+    msw: {
+      handlers: [
+        http.get("*/api/v1/proprietary/ui-data/infrastructure/audit-log", () =>
+          HttpResponse.json({ detail: "Not permitted" }, { status: 403 }),
+        ),
+      ],
+    },
+  },
+};
+
+// A team leader sees only their own team's events - a narrower slice than the
+// admin whole-server view (the Default story). fullServer:false, so no Export.
+export const TeamLeadScoped: Story = {
+  parameters: {
+    msw: {
+      handlers: [
+        http.get("*/api/v1/proprietary/ui-data/infrastructure/audit-log", () =>
+          HttpResponse.json({
+            summary: { totalEvents: 4, processing: 2, elevation: 0, config: 1 },
+            events: [
+              {
+                id: "9102",
+                timestamp: "2026-07-07 18:12:03",
+                category: "processing",
+                action: "Compress PDF",
+                actor: "alice.chen@acme.com",
+                target: "acme-invoice-8841.pdf",
+                status: "success",
+                latencyMs: 842,
+              },
+              {
+                id: "9101",
+                timestamp: "2026-07-07 17:44:20",
+                category: "auth",
+                action: "User signed in",
+                actor: "bob.martin@acme.com",
+                target: "Web session",
+                status: "success",
+                latencyMs: 128,
+              },
+              {
+                id: "9100",
+                timestamp: "2026-07-07 17:05:58",
+                category: "config",
+                action: "Profile settings updated",
+                actor: "alice.chen@acme.com",
+                target: "/api/v1/user/change-settings",
+                status: "info",
+                latencyMs: 175,
+              },
+              {
+                id: "9099",
+                timestamp: "2026-07-07 16:31:11",
+                category: "processing",
+                action: "Merge PDFs",
+                actor: "bob.martin@acme.com",
+                target: "onboarding-packet.pdf",
+                status: "success",
+                latencyMs: 2199,
+              },
+            ],
+            fullServer: false,
           }),
         ),
       ],
diff --git a/frontend/editor/src/portal/components/infrastructure/AuditTab.tsx b/frontend/editor/src/portal/components/infrastructure/AuditTab.tsx
index 6420950458..0b0d806c59 100644
--- a/frontend/editor/src/portal/components/infrastructure/AuditTab.tsx
+++ b/frontend/editor/src/portal/components/infrastructure/AuditTab.tsx
@@ -1,6 +1,7 @@
 import { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import {
+  Button,
   Card,
   EmptyState,
   MetricCard,
@@ -12,19 +13,21 @@ import {
 } from "@app/ui";
 import { useTier } from "@portal/contexts/TierContext";
 import { useAsync, useSectionFlags } from "@portal/hooks/useAsync";
+import { HttpError } from "@portal/api/http";
 import {
   fetchAuditLog,
   type AuditCategory,
   type AuditEvent,
   type AuditLogResponse,
 } from "@portal/api/infrastructure";
+import { AuditExportModal } from "@portal/components/infrastructure/AuditExportModal";
 import { SectionHeader } from "@portal/components/infrastructure/SectionHeader";
 import { TableSkeleton } from "@portal/components/infrastructure/TableSkeleton";
 import {
   AUDIT_CAT_LABEL,
   AUDIT_CAT_TONE,
+  AUDIT_STATUS_LABEL,
   AUDIT_TONE,
-  titleCase,
 } from "@portal/components/infrastructure/infraFormat";
 
 type AuditFilter = "all" | AuditCategory;
@@ -33,6 +36,7 @@ export function AuditTab() {
   const { t } = useTranslation();
   const { tier } = useTier();
   const [filter, setFilter] = useState("all");
+  const [exportOpen, setExportOpen] = useState(false);
 
   const auditFilters: TabItem[] = [
     { key: "all", label: t("portal.infrastructure.audit.filters.all") },
@@ -85,7 +89,7 @@ export function AuditTab() {
       header: t("portal.infrastructure.audit.columns.status"),
       render: (e) => (
         
-          {titleCase(e.status)}
+          {AUDIT_STATUS_LABEL[e.status]}
         
       ),
     },
@@ -104,8 +108,10 @@ export function AuditTab() {
   ];
 
   const state = useAsync(() => fetchAuditLog(tier), [tier]);
-  const { data } = state;
+  const { data, error } = state;
   const { isLoading, isEmpty } = useSectionFlags(state);
+  // Backend returns 403 for scoped-out callers; show an access message, not an empty state.
+  const forbidden = error instanceof HttpError && error.status === 403;
 
   const rows = useMemo(() => {
     if (!data) return [];
@@ -115,9 +121,22 @@ export function AuditTab() {
 
   return (
     
    
-      
+        
+        {/* Export is admin-only + whole-server, so only shown in the full-server view. */}
+        {data?.fullServer && (
+          
+        )}
+      
    
+
+       setExportOpen(false)}
       />
 
       {data && (
@@ -141,17 +160,26 @@ export function AuditTab() {
         
       )}
 
-      
-        items={auditFilters}
-        activeKey={filter}
-        onChange={setFilter}
-        variant="pill"
-        ariaLabel={t("portal.infrastructure.audit.filterAriaLabel")}
-      />
+      {!forbidden && (
+        
+          items={auditFilters}
+          activeKey={filter}
+          onChange={setFilter}
+          variant="pill"
+          ariaLabel={t("portal.infrastructure.audit.filterAriaLabel")}
+        />
+      )}
 
       
         {isLoading && }
-        {isEmpty && (
+        {!isLoading && forbidden && (
+          
+        )}
+        {!isLoading && !forbidden && isEmpty && (
           
+          
         ) : (
           
    
-            
             
    
-              
-                {a.framework}
-              
+              {a.framework}
               
    {a.detail}
    
               {a.reportUrl ? (
                 
+                  
                 )}
@@ -186,7 +186,9 @@ export function StorageTab() {
              setName(e.target.value)}
-          />
-        
-
-        {/* Sources */}
-        
    
-          
-            {t("portal.pipelines.composer.sources")}
-          
-          {sourcesState.loading ? (
-            
    
-              {t("portal.pipelines.composer.sourcesLoading")}
-            
    
-          ) : availableSources.length === 0 ? (
-            
    
-              {t("portal.pipelines.composer.noSources")}
-            
    
-          ) : (
-            
    
-              {availableSources.map((source) => (
-                 toggleSource(source.id, e.target.checked)}
-                  label={source.name}
-                />
-              ))}
-            
    
-          )}
-
-          
-            {t("portal.pipelines.composer.trigger")}
-          
-          
-            name="pipeline-trigger"
-            value={triggerType}
-            onChange={setTriggerType}
-            direction="horizontal"
-            options={triggerOptions}
-          />
-          {triggerType === "schedule" && (
-            
    
-              
-                {t("portal.pipelines.composer.scheduleEvery")}
-              
-               setScheduleCount(e.target.value)}
-                className="portal-pipelines__schedule-count"
-              />
-               setOutputDirectory(e.target.value)}
-              />
-            
-          )}
-        
    
-
-        {error && }
-      
    
-    
-  );
-}
diff --git a/frontend/editor/src/portal/components/pipelines/PipelineDetailCard.tsx b/frontend/editor/src/portal/components/pipelines/PipelineDetailCard.tsx
deleted file mode 100644
index 6bfc39d510..0000000000
--- a/frontend/editor/src/portal/components/pipelines/PipelineDetailCard.tsx
+++ /dev/null
@@ -1,215 +0,0 @@
-import { useEffect, useRef, useState } from "react";
-import { useTranslation } from "react-i18next";
-import { Banner, Button, Chip } from "@app/ui";
-import { errorMessage } from "@portal/api/http";
-import {
-  fetchRun,
-  triggerPipeline,
-  type PipelineView,
-  type PolicyRunView,
-} from "@portal/api/pipelines";
-import { humanizeOperation } from "@portal/components/pipelines/pipelineOperations";
-import "@portal/views/Pipelines.css";
-
-const TERMINAL_STATUSES = new Set(["COMPLETED", "FAILED", "CANCELLED"]);
-const POLL_INTERVAL_MS = 1500;
-const POLL_ATTEMPTS = 60;
-
-type RunResult = { tone: "success" | "danger" | "info"; text: string };
-
-interface PipelineDetailCardProps {
-  pipeline: PipelineView;
-  onClose: () => void;
-  onEdit: (pipeline: PipelineView) => void;
-  onTogglePause: (pipeline: PipelineView) => void;
-  onDelete: (pipeline: PipelineView) => void;
-  /** Disables the actions while a page-level mutation is in flight. */
-  busy?: boolean;
-}
-
-const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
-
-/** Expanded detail for the selected pipeline row, with run/edit/pause/delete actions. */
-export function PipelineDetailCard({
-  pipeline,
-  onClose,
-  onEdit,
-  onTogglePause,
-  onDelete,
-  busy = false,
-}: PipelineDetailCardProps) {
-  const { t } = useTranslation();
-  const paused = pipeline.status === "paused";
-
-  const [running, setRunning] = useState(false);
-  const [runResult, setRunResult] = useState(null);
-  const mounted = useRef(true);
-  useEffect(() => {
-    mounted.current = true;
-    return () => {
-      mounted.current = false;
-    };
-  }, []);
-
-  // Poll a run until it reaches a terminal state (or we give up), so a failure
-  // during execution surfaces with its error message rather than silently.
-  async function awaitRun(runId: string): Promise {
-    for (let attempt = 0; attempt < POLL_ATTEMPTS; attempt++) {
-      if (!mounted.current) return null;
-      const view = await fetchRun(runId);
-      if (TERMINAL_STATUSES.has(view.status)) return view;
-      await sleep(POLL_INTERVAL_MS);
-    }
-    return null;
-  }
-
-  async function handleRun() {
-    if (running || busy) return;
-    setRunning(true);
-    setRunResult(null);
-    try {
-      const runIds = await triggerPipeline(pipeline.id);
-      if (runIds.length === 0) {
-        if (mounted.current)
-          setRunResult({ tone: "info", text: t("portal.pipelines.run.empty") });
-        return;
-      }
-      const finals = await Promise.all(runIds.map((id) => awaitRun(id)));
-      if (!mounted.current) return;
-      const failed = finals.find((r) => r?.status === "FAILED");
-      if (failed) {
-        setRunResult({
-          tone: "danger",
-          text: t("portal.pipelines.run.failed", { error: failed.error ?? "" }),
-        });
-      } else if (finals.every((r) => r?.status === "COMPLETED")) {
-        setRunResult({
-          tone: "success",
-          text: t("portal.pipelines.run.completed", { count: finals.length }),
-        });
-      } else {
-        // Still running when we stopped polling, or cancelled.
-        setRunResult({ tone: "info", text: t("portal.pipelines.run.running") });
-      }
-    } catch (e) {
-      if (mounted.current)
-        setRunResult({ tone: "danger", text: errorMessage(e) });
-    } finally {
-      if (mounted.current) setRunning(false);
-    }
-  }
-
-  return (
-    
    
-      
    
-        
-          ⛓
-        
-        
    
-          
    {pipeline.name}
    
-          
-            {t("portal.pipelines.detail.subtitle", {
-              trigger: t(`portal.pipelines.trigger.${pipeline.trigger}`, {
-                defaultValue: pipeline.trigger,
-              }),
-              status: t(`portal.pipelines.status.${pipeline.status}`),
-            })}
-          
-        
    
-        
-      
    
-
-      
    
-        
    
-          
-            {t("portal.pipelines.detail.steps")}
-          
-          {pipeline.steps.length === 0 ? (
-            
    
-              {t("portal.pipelines.detail.noSteps")}
-            
    
-          ) : (
-            
    
-              {pipeline.steps.map((step, i) => (
-                
-                  {`${i + 1}. ${humanizeOperation(step)}`}
-                
-              ))}
-            
    
-          )}
-        
    
-
-        
    
-          
-            {t("portal.pipelines.detail.sources")}
-          
-          {pipeline.sources.length === 0 ? (
-            
    
-              {t("portal.pipelines.detail.noSources")}
-            
    
-          ) : (
-            
    
-              {pipeline.sources.map((source) => (
-                
-                  {source.name}
-                
-              ))}
-            
    
-          )}
-        
    
-
-        
    
-          
-            {t("portal.pipelines.detail.output")}
-          
-          
-            {t(`portal.pipelines.output.${pipeline.output}`, {
-              defaultValue: pipeline.output,
-            })}
-          
-        
    
-      
    
-
-      {runResult && (
-        
-      )}
-
-      
    
-        
-        
-        
-        
-      
    
-    
    
-  );
-}
diff --git a/frontend/editor/src/portal/components/pipelines/PipelineStepSettings.tsx b/frontend/editor/src/portal/components/pipelines/PipelineStepSettings.tsx
new file mode 100644
index 0000000000..fe2ee9dd2a
--- /dev/null
+++ b/frontend/editor/src/portal/components/pipelines/PipelineStepSettings.tsx
@@ -0,0 +1,59 @@
+import { Suspense } from "react";
+import { useTranslation } from "react-i18next";
+import { Banner } from "@app/ui";
+import { type ToolRegistry } from "@app/data/toolsTaxonomy";
+import { type ErasedToolParams } from "@app/hooks/tools/shared/toolOperationTypes";
+import { type WorkingToolStep } from "@app/hooks/tools/shared/toolAutomation";
+
+interface PipelineStepSettingsProps {
+  step: WorkingToolStep;
+  registry: Partial;
+  onChange: (params: ErasedToolParams) => void;
+}
+
+/**
+ * Renders the parameter editor for one pipeline step, chosen by the tool's capability:
+ * the tool's own settings UI when editable, an explanatory note when it has no parameters,
+ * or a "not supported yet" fallback for tools not yet migrated to the mapper seam.
+ */
+export function PipelineStepSettings({
+  step,
+  registry,
+  onChange,
+}: PipelineStepSettingsProps) {
+  const { t } = useTranslation();
+
+  if (step.support === "noSettings") {
+    return (
+      
+    );
+  }
+
+  const entry = step.toolId ? registry[step.toolId] : undefined;
+  const Settings =
+    step.support === "editable" ? entry?.automationSettings : null;
+
+  if (!Settings) {
+    return (
+      
+    );
+  }
+
+  return (
+    
+      
+          onChange({ ...step.params, [key]: value })
+        }
+        disabled={false}
+      />
+    
+  );
+}
diff --git a/frontend/editor/src/portal/components/pipelines/PipelinesTable.tsx b/frontend/editor/src/portal/components/pipelines/PipelinesTable.tsx
index a39f1c5e95..42550e28a4 100644
--- a/frontend/editor/src/portal/components/pipelines/PipelinesTable.tsx
+++ b/frontend/editor/src/portal/components/pipelines/PipelinesTable.tsx
@@ -1,5 +1,6 @@
 import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
+import ChevronRightRoundedIcon from "@mui/icons-material/ChevronRightRounded";
 import {
   Chip,
   StatusBadge,
@@ -16,16 +17,11 @@ const STATUS_TONE: Record = {
 
 interface PipelinesTableProps {
   pipelines: PipelineView[];
-  /** Id of the row whose detail panel is open, drives the caret state. */
-  expandedId: string | null;
+  /** A row opens that pipeline's own page. */
   onRowClick: (pipeline: PipelineView) => void;
 }
 
-export function PipelinesTable({
-  pipelines,
-  expandedId,
-  onRowClick,
-}: PipelinesTableProps) {
+export function PipelinesTable({ pipelines, onRowClick }: PipelinesTableProps) {
   const { t } = useTranslation();
   const columns = useMemo[]>(
     () => [
@@ -39,7 +35,7 @@ export function PipelinesTable({
             
             
    
               {p.name}
-              
+              
                 {t(`portal.pipelines.trigger.${p.trigger}`, {
                   defaultValue: p.trigger,
                 })}
@@ -90,24 +86,18 @@ export function PipelinesTable({
         ),
       },
       {
-        key: "expand",
+        key: "open",
         header: "",
         align: "right",
         width: "2.5rem",
-        render: (p) => (
-          
-            ▸
+        render: () => (
+          
+            
           
         ),
       },
     ],
-    [expandedId, t],
+    [t],
   );
 
   return (
diff --git a/frontend/editor/src/portal/components/pipelines/ToolPicker.tsx b/frontend/editor/src/portal/components/pipelines/ToolPicker.tsx
new file mode 100644
index 0000000000..e031854ec1
--- /dev/null
+++ b/frontend/editor/src/portal/components/pipelines/ToolPicker.tsx
@@ -0,0 +1,99 @@
+import { useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Button } from "@app/ui";
+import {
+  getSubcategoryLabel,
+  SUBCATEGORY_ORDER,
+  type SubcategoryId,
+} from "@app/data/toolsTaxonomy";
+import { type ExecutableTool } from "@app/hooks/tools/shared/toolAutomation";
+
+interface ToolPickerProps {
+  tools: ExecutableTool[];
+  onPick: (tool: ExecutableTool) => void;
+  onClose: () => void;
+}
+
+/**
+ * Type-to-filter, category-grouped tool picker for adding a step to a pipeline. Replaces the flat
+ * wall of tool pills so the list stays usable as the tool count grows.
+ */
+export function ToolPicker({ tools, onPick, onClose }: ToolPickerProps) {
+  const { t } = useTranslation();
+  const [query, setQuery] = useState("");
+
+  const groups = useMemo(() => {
+    const q = query.trim().toLowerCase();
+    const matched = q
+      ? tools.filter((tool) => tool.name.toLowerCase().includes(q))
+      : tools;
+    const byCategory = new Map();
+    for (const tool of matched) {
+      const list = byCategory.get(tool.subcategoryId) ?? [];
+      list.push(tool);
+      byCategory.set(tool.subcategoryId, list);
+    }
+    return SUBCATEGORY_ORDER.filter((id) => byCategory.has(id)).map((id) => ({
+      id,
+      label: getSubcategoryLabel(t, id),
+      tools: byCategory.get(id) ?? [],
+    }));
+  }, [tools, query, t]);
+
+  return (
+    
    
+      
    
+         setQuery(e.target.value)}
+          onKeyDown={(e) => {
+            if (e.key === "Escape") onClose();
+          }}
+        />
+      
    
+      
    
+        {groups.length === 0 ? (
+          
    
+            {t("portal.pipelines.builder.noToolMatches")}
+          
    
+        ) : (
+          groups.map((group) => (
+            
    
+              
    
+                {group.label}
+              
    
+              {group.tools.map((tool) => (
+                
+              ))}
+            
    
+          ))
+        )}
+      
    
+    
    
+  );
+}
diff --git a/frontend/editor/src/portal/components/policies/PolicyCategoryCard.tsx b/frontend/editor/src/portal/components/policies/PolicyCategoryCard.tsx
index 21aef179a1..3ec4a72f78 100644
--- a/frontend/editor/src/portal/components/policies/PolicyCategoryCard.tsx
+++ b/frontend/editor/src/portal/components/policies/PolicyCategoryCard.tsx
@@ -50,7 +50,7 @@ export function PolicyCategoryCard({ entry, onOpen }: PolicyCategoryCardProps) {
       
    
 
       {comingSoon ? (
-        
+        
           {t("portal.policies.card.comingSoon")}
         
       ) : policy ? (
@@ -82,7 +82,7 @@ export function PolicyCategoryCard({ entry, onOpen }: PolicyCategoryCardProps) {
           
         
    
       ) : (
-        
+        
           {t("portal.policies.card.notSetUp")}
         
       )}
diff --git a/frontend/editor/src/portal/components/policies/PolicyDetailPanel.tsx b/frontend/editor/src/portal/components/policies/PolicyDetailPanel.tsx
index fd10a0a8d6..d638cc4b7a 100644
--- a/frontend/editor/src/portal/components/policies/PolicyDetailPanel.tsx
+++ b/frontend/editor/src/portal/components/policies/PolicyDetailPanel.tsx
@@ -84,15 +84,16 @@ function ActivityError({ message }: { message: string }) {
       >
         {message}
       
-      
+      
     
   );
 }
@@ -139,8 +140,8 @@ export function PolicyDetailPanel({
         
    
           {canDelete && (
             
+                
               )}
             
    
           ))}
diff --git a/frontend/editor/src/portal/components/policies/PolicyFieldRow.tsx b/frontend/editor/src/portal/components/policies/PolicyFieldRow.tsx
index cb1893cc66..bad56b0541 100644
--- a/frontend/editor/src/portal/components/policies/PolicyFieldRow.tsx
+++ b/frontend/editor/src/portal/components/policies/PolicyFieldRow.tsx
@@ -45,7 +45,7 @@ export function PolicyFieldRow({
           {(field.options ?? []).map((opt) => (
              toggle(opt)}
             >
@@ -64,7 +64,7 @@ export function PolicyFieldRow({
           inputSize="sm"
           value={typeof value === "string" ? value : ""}
           options={(field.options ?? []).map((o) => ({ value: o, label: o }))}
-          onChange={(e) => onChange(e.target.value)}
+          onChange={(value) => onChange(value ?? "")}
         />
       
     );
diff --git a/frontend/editor/src/portal/components/policies/PolicySetupWizard.tsx b/frontend/editor/src/portal/components/policies/PolicySetupWizard.tsx
index 30b1d05403..13f0dab8ac 100644
--- a/frontend/editor/src/portal/components/policies/PolicySetupWizard.tsx
+++ b/frontend/editor/src/portal/components/policies/PolicySetupWizard.tsx
@@ -251,7 +251,7 @@ function PolicySetupWizardBody({
       subtitle={config.summary}
       footer={
         
    
-          
           {step === "workflow" ? (
@@ -265,7 +265,7 @@ function PolicySetupWizardBody({
           ) : (
             <>
               
+                
               ))
             )}
           
    
@@ -413,22 +414,23 @@ function PolicySetupWizardBody({
                         count: scopeTypes.length,
                       })}
                 
-                
+                
               
    
               {scopeNarrow && (
                 
    
                   {POLICY_DOC_TYPES.map((dt) => (
                      toggleScopeType(dt)}
                     >
@@ -453,8 +455,8 @@ function PolicySetupWizardBody({
                    {
-                      const mode = e.target.value as "new_file" | "new_version";
+                    onChange={(value) => {
+                      const mode = (value ?? "new_file") as
+                        | "new_file"
+                        | "new_version";
                       setOutputMode(mode);
                       // Auto-number only applies to separate new files.
                       if (
@@ -508,9 +512,12 @@ function PolicySetupWizardBody({
                      setChecked(e.target.checked)}
+        />
+        {t("portal.procurement.agreement.confirm")}
+      
+
+      
    
+        
+      
    
+    
+  );
+}
diff --git a/frontend/editor/src/portal/components/procurement/ProcurementBanner.tsx b/frontend/editor/src/portal/components/procurement/ProcurementBanner.tsx
new file mode 100644
index 0000000000..902bb14c0d
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/ProcurementBanner.tsx
@@ -0,0 +1,80 @@
+import { useTranslation } from "react-i18next";
+import { Button, Card } from "@app/ui";
+import { useView } from "@portal/contexts/ViewContext";
+import { DealStatusHero } from "@portal/components/procurement/DealStatusHero";
+import type { ProcurementController } from "@portal/components/procurement/useProcurement";
+
+/**
+ * The deal-status hero, wired to a shared ProcurementController. Rendered both
+ * standalone (the /procurement route) and as the Home hero card's footer once a
+ * deal is underway. Assumes an active deal (controller.data present).
+ */
+export function ControlledDealStatusHero({
+  controller,
+}: {
+  controller: ProcurementController;
+}) {
+  const { setActiveView } = useView();
+  if (!controller.data) return null;
+  return (
+     controller.setOpen(true)}
+      onKeyDocs={() => controller.setExtra("docs")}
+      onInvite={() => setActiveView("users")}
+      onSchedule={() => controller.setExtra("schedule")}
+      onManageTrial={() => controller.setExtra("trial")}
+      onNavigate={setActiveView}
+    />
+  );
+}
+
+/**
+ * Enterprise on-ramp shown when no deal exists yet. Only used on the dedicated
+ * /procurement route — on Home the setup checklist's Enterprise rung owns the
+ * on-ramp, so this doesn't render there.
+ */
+export function ProcurementUpsell({
+  controller,
+}: {
+  controller: ProcurementController;
+}) {
+  const { t } = useTranslation();
+  return (
+    
+      
    
+        
+          {t("portal.procurement.upsell.homeBadge")}
+        
+        
    
+          {t("portal.procurement.upsell.homeHeadline")} 
+          {t("portal.procurement.upsell.homeBody")}
+        
    
+      
    
+      
+        
+  );
+}
+
+/** Deal-status hero when a deal is underway, otherwise the enterprise on-ramp. */
+export function ProcurementBanner({
+  controller,
+}: {
+  controller: ProcurementController;
+}) {
+  return controller.isLinked && controller.started && controller.data ? (
+    
+  ) : (
+    
+  );
+}
diff --git a/frontend/editor/src/portal/components/procurement/ProcurementExtras.tsx b/frontend/editor/src/portal/components/procurement/ProcurementExtras.tsx
new file mode 100644
index 0000000000..3046e895f2
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/ProcurementExtras.tsx
@@ -0,0 +1,279 @@
+import { useEffect } from "react";
+import { createPortal } from "react-dom";
+import { useTranslation } from "react-i18next";
+import { Button } from "@app/ui";
+import type { ProcurementSnapshot } from "@portal/api/procurement";
+import { CalendlyInline } from "@portal/components/procurement/CalendlyInline";
+import { useFocusTrap } from "@portal/components/procurement/ProcurementModal";
+import "@portal/views/Procurement.css";
+
+/**
+ * Small centred dialogs that hang off the deal-status hero's quick actions — Key documents, Schedule
+ * a call, and trial management. Schedule a call embeds the live Calendly scheduler; Key documents is
+ * still mocked for the pilot (static demo data). The shells and wiring are real so the hero behaves
+ * like the marketing prototype.
+ */
+
+function SideModal({
+  open,
+  onClose,
+  title,
+  subtitle,
+  children,
+  footer,
+  wide = false,
+}: {
+  open: boolean;
+  onClose: () => void;
+  title: string;
+  subtitle?: string;
+  children: React.ReactNode;
+  footer?: React.ReactNode;
+  wide?: boolean;
+}) {
+  const { t } = useTranslation();
+  const trapRef = useFocusTrap(open);
+
+  useEffect(() => {
+    if (!open) return;
+    const onKey = (e: KeyboardEvent) => e.key === "Escape" && onClose();
+    document.addEventListener("keydown", onKey);
+    return () => document.removeEventListener("keydown", onKey);
+  }, [open, onClose]);
+
+  if (!open) return null;
+  return createPortal(
+    
     e.target === e.currentTarget && onClose()}
+    >
+      
    
+        
+        
    
+          
    {title}
    
+          {subtitle && 
    {subtitle}
    }
+        
    
+        
    {children}
    
+        {footer && 
    {footer}
    }
+      
    
+    
    ,
+    document.body,
+  );
+}
+
+// ── Key documents ────────────────────────────────────────────────────────────
+type DocStatus = "available" | "action" | "request";
+interface DocRow {
+  name: string;
+  sub: string;
+  status: DocStatus;
+  fee?: number;
+}
+const STAGE_DOCS: { group: string; docs: DocRow[] }[] = [
+  {
+    group: "Your deal",
+    docs: [
+      {
+        name: "Formal quote",
+        sub: "Built to your volume, term, and service level",
+        status: "available",
+      },
+      {
+        name: "Master Services Agreement",
+        sub: "One signature — MSA, order form, EULA, and DPA combined",
+        status: "action",
+      },
+      {
+        name: "Bank transfer instructions",
+        sub: "Wire details for your AP team",
+        status: "available",
+      },
+      {
+        name: "Purchase order",
+        sub: "Issuing a PO? Upload it and we invoice against it",
+        status: "request",
+      },
+    ],
+  },
+  {
+    group: "Supporting your evaluation",
+    docs: [
+      {
+        name: "SOC 2 Type II report",
+        sub: "Audited · NDA-gated",
+        status: "available",
+      },
+      {
+        name: "Custom security review",
+        sub: "We complete your questionnaire and join your review call",
+        status: "request",
+        fee: 5000,
+      },
+      {
+        name: "Business Associate Agreement",
+        sub: "HIPAA · available on request",
+        status: "request",
+        fee: 2500,
+      },
+      { name: "IRS Form W-9", sub: "Stirling PDF Inc.", status: "available" },
+      {
+        name: "Certificate of Insurance",
+        sub: "Cyber + E&O · current policy",
+        status: "available",
+      },
+    ],
+  },
+];
+const STATUS_LABEL: Record = {
+  available: "Download",
+  action: "Action needed",
+  request: "Request",
+};
+
+export function KeyDocumentsModal({
+  open,
+  onClose,
+}: {
+  open: boolean;
+  onClose: () => void;
+}) {
+  return (
+    
+      {STAGE_DOCS.map((g) => (
+        
    
+          
    {g.group}
    
+          
      
+            {g.docs.map((d) => (
+              
    • 
+                
      
+                  {d.name}
+                  
+                    {d.sub}
+                    {d.fee ? ` · one-time $${d.fee.toLocaleString()}` : ""}
+                  
+                
      
+                
+                  {STATUS_LABEL[d.status]}
+                
+              
      • 
+            ))}
+          
    
+        
    
+      ))}
+        
+  );
+}
+
+// ── Schedule a call ──────────────────────────────────────────────────────────
+export function ScheduleCallModal({
+  open,
+  onClose,
+  email,
+}: {
+  open: boolean;
+  onClose: () => void;
+  /** Linked account's email; prefills the Calendly booking form. */
+  email?: string | null;
+}) {
+  const { t } = useTranslation();
+  return (
+    
+      
+    
+  );
+}
+
+// ── Trial management ─────────────────────────────────────────────────────────
+export function TrialManageModal({
+  open,
+  onClose,
+  snapshot,
+  busy,
+  onExtend,
+  onCancel,
+}: {
+  open: boolean;
+  onClose: () => void;
+  snapshot: ProcurementSnapshot;
+  busy: boolean;
+  onExtend: () => void;
+  onCancel: () => void;
+}) {
+  const { t } = useTranslation();
+  const ends = snapshot.trialEndsAt
+    ? new Date(snapshot.trialEndsAt).toLocaleDateString(undefined, {
+        month: "long",
+        day: "numeric",
+        year: "numeric",
+      })
+    : "";
+  const maxed = snapshot.trialExtensionsUsed >= 2;
+  return (
+    
+          
+          
+        
+      }
+    >
+      
    
+        {maxed
+          ? t("portal.procurement.trial.bodyMaxed")
+          : t("portal.procurement.trial.body")}
+      
    
+        
+  );
+}
diff --git a/frontend/editor/src/portal/components/procurement/ProcurementFlow.tsx b/frontend/editor/src/portal/components/procurement/ProcurementFlow.tsx
new file mode 100644
index 0000000000..94ee979b86
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/ProcurementFlow.tsx
@@ -0,0 +1,196 @@
+import { useTranslation } from "react-i18next";
+import { Banner, Button, EmptyState, Skeleton } from "@app/ui";
+import { useUI } from "@portal/contexts/UIContext";
+import { useLinkedAccountEmail } from "@portal/hooks/useLinkedAccountEmail";
+import { JOURNEY } from "@portal/api/procurement";
+import { ProcurementAgreement } from "@portal/components/procurement/ProcurementAgreement";
+import {
+  KeyDocumentsModal,
+  ScheduleCallModal,
+  TrialManageModal,
+} from "@portal/components/procurement/ProcurementExtras";
+import { ProcurementModal } from "@portal/components/procurement/ProcurementModal";
+import {
+  LicensePanel,
+  LiveStageCard,
+  PaymentStageCard,
+  QuoteMilestoneCard,
+} from "@portal/components/procurement/ProcurementStages";
+import { QuoteBuilder } from "@portal/components/procurement/QuoteBuilder";
+import { StageStepper } from "@portal/components/procurement/StageStepper";
+import type { ProcurementController } from "@portal/components/procurement/useProcurement";
+
+/**
+ * The procurement takeover flow: the full-screen journey modal (quote builder →
+ * milestone → agreement → payment → live) plus the key-documents, schedule-call,
+ * and trial-management modals. Driven entirely by a shared ProcurementController
+ * so it can sit next to a deal-status hero rendered elsewhere (e.g. inside the
+ * tier hero card on Home).
+ */
+export function ProcurementFlow({
+  controller,
+}: {
+  controller: ProcurementController;
+}) {
+  const { t } = useTranslation();
+  const { openLinkModal } = useUI();
+  const scheduleEmail = useLinkedAccountEmail();
+  const {
+    isLinked,
+    loading,
+    data,
+    started,
+    stage,
+    latest,
+    isIssued,
+    isDraft,
+    busy,
+    downloading,
+    downloadingLicense,
+    error,
+    setError,
+    open,
+    setOpen,
+    editing,
+    setEditing,
+    extra,
+    setExtra,
+    invoicePdf,
+    onExtendTrial,
+    onReset,
+    onGenerate,
+    onAcceptQuote,
+    onAgree,
+    onGoLive,
+    onDownloadPdf,
+    onDownloadOfflineLicense,
+  } = controller;
+
+  return (
+    <>
+       setOpen(false)}
+        title={t("portal.procurement.title")}
+        subtitle={t("portal.procurement.subtitle")}
+      >
+        {error && (
+           setError(null)}
+          >
+            {error}
+          
+        )}
+
+        {!isLinked && (
+           openLinkModal()}
+              >
+                {t("portal.procurement.link.cta")}
+              
+            }
+          />
+        )}
+
+        {isLinked && (loading || !started) && }
+
+        {isLinked && started && (
+          <>
+            
    
+              
+            
    
+
+            {(editing ||
+              (isDraft && (stage === "trial" || stage === "quote"))) && (
+              
+            )}
+
+            {!editing && isIssued && stage === "quote" && latest && (
+               setEditing(true)}
+              />
+            )}
+
+            {!editing && stage === "security" && latest && (
+              
+            )}
+
+            {!editing && stage === "procurement" && latest && (
+              
+            )}
+
+            {!editing && stage === "active" && }
+
+            {data?.licenseKey && (
+              
+            )}
+
+            
    
+              
+            
    
+          
+        )}
+          
+
+       setExtra(null)}
+      />
+       setExtra(null)}
+        email={scheduleEmail}
+      />
+      {data && (
+         setExtra(null)}
+          snapshot={data}
+          busy={busy}
+          onExtend={async () => {
+            await onExtendTrial();
+            setExtra(null);
+          }}
+          onCancel={async () => {
+            await onReset();
+            setExtra(null);
+          }}
+        />
+      )}
+    
+  );
+}
diff --git a/frontend/editor/src/portal/components/procurement/ProcurementHome.stories.tsx b/frontend/editor/src/portal/components/procurement/ProcurementHome.stories.tsx
new file mode 100644
index 0000000000..ae424922ad
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/ProcurementHome.stories.tsx
@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { ProcurementHome } from "@portal/components/procurement/ProcurementHome";
+
+/**
+ * The end-to-end procurement experience (Home hero + takeover modal), driven by the `procurementSaas`
+ * MSW handlers: start trial → build quote → generate (issue Stripe Quote) → milestone (download PDF /
+ * accept). `autoOpen` opens the modal so the flow is immediately clickable.
+ */
+const meta: Meta = {
+  title: "Portal/Procurement/ProcurementHome",
+  component: ProcurementHome,
+  parameters: { layout: "fullscreen" },
+};
+export default meta;
+
+type Story = StoryObj;
+
+export const Default: Story = { args: { autoOpen: true } };
diff --git a/frontend/editor/src/portal/components/procurement/ProcurementHome.tsx b/frontend/editor/src/portal/components/procurement/ProcurementHome.tsx
new file mode 100644
index 0000000000..1877e0bc3c
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/ProcurementHome.tsx
@@ -0,0 +1,22 @@
+import { ProcurementBanner } from "@portal/components/procurement/ProcurementBanner";
+import { ProcurementFlow } from "@portal/components/procurement/ProcurementFlow";
+import { useProcurement } from "@portal/components/procurement/useProcurement";
+import "@portal/views/Procurement.css";
+
+/**
+ * The standalone procurement experience: a deal-status hero (or enterprise
+ * on-ramp when no deal exists) above the full-screen takeover flow that holds
+ * the journey — build + issue a quote, review + agree to the enterprise
+ * agreement, then accept into a committed subscription. Rendered at
+ * /procurement (autoOpen). On Home the deal-status hero instead attaches to the
+ * tier hero card's footer (see HomeHero) so this component isn't used there.
+ */
+export function ProcurementHome({ autoOpen = false }: { autoOpen?: boolean }) {
+  const controller = useProcurement(autoOpen);
+  return (
+    <>
+      
+      
+    
+  );
+}
diff --git a/frontend/editor/src/portal/components/procurement/ProcurementModal.stories.tsx b/frontend/editor/src/portal/components/procurement/ProcurementModal.stories.tsx
new file mode 100644
index 0000000000..6c57c501c7
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/ProcurementModal.stories.tsx
@@ -0,0 +1,42 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { Button, Card } from "@app/ui";
+import { ProcurementModal } from "@portal/components/procurement/ProcurementModal";
+
+/**
+ * The full-screen takeover modal shell. Rendered always-open here to verify the panel has a solid
+ * (not see-through) surface over the dimmed, blurred backdrop.
+ */
+const meta: Meta = {
+  title: "Portal/Procurement/ProcurementModal",
+  component: ProcurementModal,
+  parameters: { layout: "fullscreen" },
+  args: {
+    open: true,
+    onClose: () => {},
+    title: "Enterprise procurement",
+    subtitle: "Get your team evaluated, contracted, and onboarded.",
+  },
+};
+export default meta;
+
+type Story = StoryObj;
+
+export const Open: Story = {
+  args: {
+    children: (
+      
+        
    Ready for payment
    
+        
    
+          Your quote is accepted. Continue to checkout to pay your committed
+          contract and go live.
+        
    
+        
    
+          
+          
+        
    
+          
+    ),
+  },
+};
diff --git a/frontend/editor/src/portal/components/procurement/ProcurementModal.tsx b/frontend/editor/src/portal/components/procurement/ProcurementModal.tsx
new file mode 100644
index 0000000000..bf3f463585
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/ProcurementModal.tsx
@@ -0,0 +1,102 @@
+import { useEffect, useRef } from "react";
+import { createPortal } from "react-dom";
+import "@portal/views/Procurement.css";
+
+/** Keep keyboard focus inside an open dialog: focus it on open and wrap Tab at the edges. */
+export function useFocusTrap(open: boolean) {
+  const ref = useRef(null);
+  useEffect(() => {
+    if (!open) return;
+    const panel = ref.current;
+    if (!panel) return;
+    const prev = document.activeElement as HTMLElement | null;
+    const focusables = () =>
+      Array.from(
+        panel.querySelectorAll(
+          'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])',
+        ),
+      ).filter((el) => !el.hasAttribute("disabled"));
+    (focusables()[0] ?? panel).focus();
+    const onKey = (e: KeyboardEvent) => {
+      if (e.key !== "Tab") return;
+      const items = focusables();
+      if (items.length === 0) return;
+      const first = items[0];
+      const last = items[items.length - 1];
+      if (e.shiftKey && document.activeElement === first) {
+        e.preventDefault();
+        last.focus();
+      } else if (!e.shiftKey && document.activeElement === last) {
+        e.preventDefault();
+        first.focus();
+      }
+    };
+    panel.addEventListener("keydown", onKey);
+    return () => {
+      panel.removeEventListener("keydown", onKey);
+      prev?.focus?.();
+    };
+  }, [open]);
+  return ref;
+}
+
+/**
+ * Full-screen takeover modal for the procurement flow, copying the prototype's modal design
+ * (portaled to body, dimmed + blurred backdrop, rounded panel, close button). The Home deal-status
+ * hero expands into this.
+ */
+export function ProcurementModal({
+  open,
+  onClose,
+  title,
+  subtitle,
+  children,
+}: {
+  open: boolean;
+  onClose: () => void;
+  title: string;
+  subtitle?: string;
+  children: React.ReactNode;
+}) {
+  const trapRef = useFocusTrap(open);
+
+  useEffect(() => {
+    if (!open) return;
+    const onKey = (e: KeyboardEvent) => e.key === "Escape" && onClose();
+    document.addEventListener("keydown", onKey);
+    return () => document.removeEventListener("keydown", onKey);
+  }, [open, onClose]);
+
+  if (!open) return null;
+
+  return createPortal(
+    
     e.target === e.currentTarget && onClose()}
+    >
+      
    
+        
+        
    
+          
    {title}
    
+          {subtitle && 
    {subtitle}
    }
+        
    
+        
    {children}
    
+      
    
+    
    ,
+    document.body,
+  );
+}
diff --git a/frontend/editor/src/portal/components/procurement/ProcurementStages.tsx b/frontend/editor/src/portal/components/procurement/ProcurementStages.tsx
new file mode 100644
index 0000000000..bd5c0e3fc5
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/ProcurementStages.tsx
@@ -0,0 +1,215 @@
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Button, Card } from "@app/ui";
+import type { QuoteResult } from "@portal/api/procurement";
+import { money } from "@portal/components/procurement/format";
+import "@portal/views/Procurement.css";
+
+/**
+ * The stage-specific cards shown inside the procurement takeover modal once a quote exists: the
+ * issued-quote milestone, the subscription-created payment step, and the live confirmation. Each is
+ * a pure presentational view driven by props; ProcurementHome owns the state and the actions.
+ */
+
+/** The issued Stripe Quote as a shareable milestone: itemised, with accept / download / edit. */
+export function QuoteMilestoneCard({
+  quote,
+  busy,
+  downloading,
+  onAccept,
+  onDownload,
+  onEdit,
+}: {
+  quote: QuoteResult;
+  busy: boolean;
+  downloading: boolean;
+  onAccept: () => void;
+  onDownload: () => void;
+  onEdit: () => void;
+}) {
+  const { t } = useTranslation();
+  return (
+    
+      
+        {t("portal.procurement.milestone.eyebrow", {
+          number: quote.quoteNumber,
+        })}
+      
+      
    
+        {t("portal.procurement.milestone.title")}
+      
    
+      {quote.config.businessName && (
+        
    
+          {t("portal.procurement.milestone.preparedFor", {
+            company: quote.config.businessName,
+          })}
+        
    
+      )}
+      
    
+        {t("portal.procurement.milestone.description")}
+      
    
+      
      
+        {quote.lineItems.map((li) => (
+          
    • 
+            {li.label}
+            
+              {li.kind === "INCLUDED"
+                ? t("portal.procurement.builder.included")
+                : money(li.amountMinor, quote.currency)}
+            
+          
      • 
+        ))}
+      
    
+      
    
+        
+          {money(quote.annualNetMinor, quote.currency)}
+          {t("portal.procurement.milestone.perYear")}
+        
+        
+          {t("portal.procurement.milestone.tcv", {
+            value: money(quote.tcvMinor, quote.currency),
+          })}
+        
+      
    
+      
    
+        
+        
+        
+      
    
+        
+  );
+}
+
+/** The subscription-created step: pay/download the first invoice, or (demo) simulate payment. */
+export function PaymentStageCard({
+  invoiceUrl,
+  invoicePdf,
+  busy,
+  onSimulate,
+}: {
+  invoiceUrl?: string | null;
+  invoicePdf?: string | null;
+  busy: boolean;
+  onSimulate: () => void;
+}) {
+  const { t } = useTranslation();
+  return (
+    
+      
    
+        {t("portal.procurement.payment.title")}
+      
    
+      
    
+        {t("portal.procurement.payment.description")}
+      
    
+      {(invoiceUrl || invoicePdf) && (
+        
    
+          {invoiceUrl && (
+            
+          )}
+          {invoicePdf && (
+            
+          )}
+        
    
+      )}
+      
    
+        
+      
    
+        
+  );
+}
+
+/** The live confirmation once the deal is active. */
+export function LiveStageCard() {
+  const { t } = useTranslation();
+  return (
+    
+      
+        {t("portal.procurement.live.eyebrow")}
+      
+      
    
+        {t("portal.procurement.live.title")}
+      
    
+      
    
+        {t("portal.procurement.live.description")}
+      
    
+        
+  );
+}
+
+/**
+ * The team's licence key with Copy — and, when the paid offline add-on was taken, a download for
+ * the air-gapped licence file. Shown from the trial step onward (the key exists from the trial and
+ * is upgraded in place at accept), so it lives outside any single stage card.
+ */
+export function LicensePanel({
+  licenseKey,
+  offlineAvailable,
+  downloadingLicense,
+  onDownloadOffline,
+}: {
+  licenseKey: string;
+  offlineAvailable: boolean;
+  downloadingLicense: boolean;
+  onDownloadOffline: () => void;
+}) {
+  const { t } = useTranslation();
+  const [copied, setCopied] = useState(false);
+
+  const copyKey = () => {
+    void navigator.clipboard?.writeText(licenseKey);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 1500);
+  };
+
+  return (
+    
    
+      
+        {t("portal.procurement.license.label")}
+      
+      {licenseKey}
+      
    
+        
+        {offlineAvailable && (
+          
+        )}
+      
    
+      
    
+        {t("portal.procurement.license.hint")}
+      
    
+    
    
+  );
+}
diff --git a/frontend/editor/src/portal/components/procurement/QuoteBuilder.stories.tsx b/frontend/editor/src/portal/components/procurement/QuoteBuilder.stories.tsx
new file mode 100644
index 0000000000..430bcf23cf
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/QuoteBuilder.stories.tsx
@@ -0,0 +1,20 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { QuoteBuilder } from "@portal/components/procurement/QuoteBuilder";
+import "@portal/views/Procurement.css";
+
+/**
+ * The enterprise quote builder. The "Review quote" step calls the SaaS backend, answered here by
+ * the `procurementSaas` MSW handler, so all four steps (incl. the itemised quote paper) work in
+ * Storybook. Click through Volume → Commitment & service → Details → Quote.
+ */
+const meta: Meta = {
+  title: "Portal/Procurement/QuoteBuilder",
+  component: QuoteBuilder,
+  parameters: { layout: "padded" },
+  args: { deployment: "cloud", onGenerate: () => {} },
+};
+export default meta;
+
+type Story = StoryObj;
+
+export const Default: Story = {};
diff --git a/frontend/editor/src/portal/components/procurement/QuoteBuilder.tsx b/frontend/editor/src/portal/components/procurement/QuoteBuilder.tsx
new file mode 100644
index 0000000000..1ba6016a4a
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/QuoteBuilder.tsx
@@ -0,0 +1,450 @@
+import { useEffect, useState, type ReactNode } from "react";
+import { useTranslation } from "react-i18next";
+import { Button } from "@app/ui";
+import {
+  DocumentsIcon,
+  PoliciesIcon,
+  UsersIcon,
+} from "@portal/components/icons";
+import { money } from "@portal/components/procurement/format";
+import {
+  buildQuote,
+  type QuoteConfigInput,
+  type QuoteResult,
+} from "@portal/api/procurement";
+import "@portal/views/Procurement.css";
+
+const STEPS = ["volume", "plan", "details"] as const;
+const TERM_DISCOUNT = [0, 0.05, 0.1, 0.12, 0.15]; // 1..5 years
+const SLA_UPLIFT: Record = {
+  standard: 0,
+  priority: 0.15,
+  dedicated: 0.3,
+};
+
+/**
+ * The enterprise quote builder — volume → commitment & service → details. A client-side preview
+ * drives the live footer total; the backend is authoritative. Completing the form generates the
+ * quote directly (build + issue in one step) — the issued quote is then shown as the milestone, so
+ * there's no redundant in-builder preview.
+ */
+export function QuoteBuilder({
+  deployment,
+  initial,
+  onGenerate,
+}: {
+  deployment: string;
+  /** Seed the builder from an existing quote's config (re-editing a quote). */
+  initial?: QuoteConfigInput;
+  /** Called with the priced DRAFT quote; the parent issues it as a Stripe Quote. */
+  onGenerate: (quote: QuoteResult) => void;
+}) {
+  const { t } = useTranslation();
+  const [step, setStep] = useState(0);
+  const [cfg, setCfg] = useState(
+    initial ?? {
+      volume: 1_000_000,
+      users: 0,
+      deployment,
+      termYears: 3,
+      serviceLevel: "priority",
+      indemnification: false,
+      training: false,
+      qbr: false,
+      offlineLicense: false,
+      currency: "USD",
+      businessName: "",
+    },
+  );
+  // A seeded quote carries a volume but no user count, so treat it as manually set.
+  const [manualVolume, setManualVolume] = useState(initial != null);
+  const [eula, setEula] = useState(initial != null);
+  const [busy, setBusy] = useState(false);
+
+  function set(k: K, v: QuoteConfigInput[K]) {
+    setCfg((c) => ({ ...c, [k]: v }));
+  }
+
+  // Re-editing an existing quote: everything is seeded, so jump to the last step (details) with the
+  // agreement pre-accepted — one click re-generates, or Back to change a field. No walking from step 1.
+  // Mount-only: seed the step from `initial` once (deliberately no deps).
+  useEffect(() => {
+    if (initial) setStep(STEPS.length - 1);
+  }, []);
+
+  const preview = previewAnnualMinor(cfg);
+  const tcvPreview = preview * cfg.termYears + (cfg.training ? 750_000 : 0);
+
+  // Fully filled → price + hand the draft to the parent to issue as a Stripe Quote (which then shows
+  // as the milestone). No separate in-builder preview step.
+  async function generate() {
+    setBusy(true);
+    try {
+      onGenerate(await buildQuote(cfg));
+    } finally {
+      setBusy(false);
+    }
+  }
+
+  return (
+    
    
+      
    
+        
    
+          {t("portal.procurement.builder.title")}
+        
    
+        
+          {t("portal.procurement.builder.stepOf", {
+            n: step + 1,
+            total: STEPS.length,
+          })}
+        
+      
    
+      
    
+        {STEPS.map((s, i) => (
+          
+        ))}
+      
    
+
+      
    
+        {step === 0 && (
+          }
+            title={t("portal.procurement.builder.s1Title")}
+            sub={t("portal.procurement.builder.s1Sub")}
+          >
+            
    
+              
+                 {
+                    const users = Number(e.target.value);
+                    set("users", users);
+                    if (!manualVolume) set("volume", estimateVolume(users));
+                  }}
+                />
+              
+              
+                 {
+                    setManualVolume(true);
+                    set("volume", Number(e.target.value));
+                  }}
+                />
+              
+            
    
+            
    
+              {cfg.users > 0 && !manualVolume
+                ? t("portal.procurement.builder.volEstimated", {
+                    count: cfg.users,
+                  })
+                : cfg.users > 0
+                  ? t("portal.procurement.builder.volManual")
+                  : t("portal.procurement.builder.volNoUsers")}
+            
    
+              
+        )}
+
+        {step === 1 && (
+          }
+            title={t("portal.procurement.builder.s2Title")}
+            sub={t("portal.procurement.builder.s2Sub")}
+          >
+            
+              
    
+                {[1, 2, 3, 4, 5].map((y) => (
+                  
+                ))}
+              
    
+              {TERM_DISCOUNT[cfg.termYears - 1] > 0 && (
+                
    
+                  {t("portal.procurement.builder.termDiscount", {
+                    pct: Math.round(TERM_DISCOUNT[cfg.termYears - 1] * 100),
+                  })}
+                
    
+              )}
+                
+
+            
+              
    
+                 set("serviceLevel", "standard")}
+                />
+                 set("serviceLevel", "priority")}
+                />
+                 set("serviceLevel", "dedicated")}
+                />
+              
    
+                
+
+            
+              
    
+                 set("indemnification", !cfg.indemnification)}
+                />
+                 set("training", !cfg.training)}
+                />
+                 set("qbr", !cfg.qbr)}
+                />
+                 set("offlineLicense", !cfg.offlineLicense)}
+                />
+              
    
+                
+              
+        )}
+
+        {step === 2 && (
+          }
+            title={t("portal.procurement.builder.s3Title")}
+            sub={t("portal.procurement.builder.s3Sub")}
+          >
+            
+               set("businessName", e.target.value)}
+              />
+            
+            
    
+              
+                
+              
+            
    
+            
+              
+        )}
+      
    
+
+      
    
+        
+          {t("portal.procurement.builder.running", {
+            annual: money(preview, cfg.currency),
+            years: cfg.termYears,
+            tcv: money(tcvPreview, cfg.currency),
+          })}
+        
+        
    
+          {step > 0 && (
+            
+          )}
+          {step === 0 && (
+            
+          )}
+          {step === 1 && (
+            
+          )}
+          {step === 2 && (
+            
+          )}
+        
    
+      
    
+    
    
+  );
+}
+
+function Step({
+  icon,
+  title,
+  sub,
+  children,
+}: {
+  icon: ReactNode;
+  title: string;
+  sub: string;
+  children: React.ReactNode;
+}) {
+  return (
+    <>
+      
    
+        
+          {icon}
+        
+        
    
+          
    {title}
    
+          
    {sub}
    
+        
    
+      
    
+      {children}
+    
+  );
+}
+
+function Field({
+  label,
+  children,
+}: {
+  label: string;
+  children: React.ReactNode;
+}) {
+  return (
+    
+  );
+}
+
+function OptCard({
+  on,
+  title,
+  sub,
+  onClick,
+}: {
+  on: boolean;
+  title: string;
+  sub: string;
+  onClick: () => void;
+}) {
+  return (
+    
+  );
+}
+
+function AddOn({
+  on,
+  title,
+  sub,
+  onClick,
+}: {
+  on: boolean;
+  title: string;
+  sub: string;
+  onClick: () => void;
+}) {
+  return (
+    
+  );
+}
+
+function estimateVolume(users: number): number {
+  const raw = Math.max(0, users) * 5 * 230 * 1.75;
+  const stepSize = raw >= 1_000_000 ? 50_000 : raw >= 100_000 ? 25_000 : 5_000;
+  return Math.round(raw / stepSize) * stepSize;
+}
+
+function previewAnnualMinor(cfg: QuoteConfigInput): number {
+  const perPdf = cfg.volume >= 5_000_000 ? 3 : cfg.volume >= 1_000_000 ? 4 : 5;
+  const usage = Math.round(cfg.volume * perPdf);
+  const withSla = Math.round(usage * (1 + (SLA_UPLIFT[cfg.serviceLevel] ?? 0)));
+  const withInd = cfg.indemnification ? Math.round(withSla * 1.05) : withSla;
+  const disc = Math.round(
+    withInd * TERM_DISCOUNT[Math.min(Math.max(cfg.termYears, 1), 5) - 1],
+  );
+  // Flat annual add-ons (QBR, offline licence) sit outside the multi-year discount, mirroring the
+  // server (PricingRates: qbr 800_000, offline licence 1_200_000). TCV preview derives from this.
+  return (
+    withInd -
+    disc +
+    (cfg.qbr ? 800_000 : 0) +
+    (cfg.offlineLicense ? 1_200_000 : 0)
+  );
+}
diff --git a/frontend/editor/src/portal/components/procurement/format.ts b/frontend/editor/src/portal/components/procurement/format.ts
index bba7e63393..75f5b2fb16 100644
--- a/frontend/editor/src/portal/components/procurement/format.ts
+++ b/frontend/editor/src/portal/components/procurement/format.ts
@@ -9,6 +9,15 @@ export const USD = new Intl.NumberFormat(undefined, {
   maximumFractionDigits: 0,
 });
 
+/** Format a minor-unit (cents) amount in the given currency, whole units (no decimals). */
+export function money(minor: number, currency: string): string {
+  return new Intl.NumberFormat(undefined, {
+    style: "currency",
+    currency: currency || "USD",
+    maximumFractionDigits: 0,
+  }).format(minor / 100);
+}
+
 /** Document status → badge tone. Action items lean amber to pull the eye. */
 export const STATUS_TONE: Record = {
   available: "success",
diff --git a/frontend/editor/src/portal/components/procurement/useProcurement.ts b/frontend/editor/src/portal/components/procurement/useProcurement.ts
new file mode 100644
index 0000000000..e2fdb922bf
--- /dev/null
+++ b/frontend/editor/src/portal/components/procurement/useProcurement.ts
@@ -0,0 +1,206 @@
+import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { usePortalLinked } from "@portal/contexts/usePortalLinked";
+import { useAsync } from "@portal/hooks/useAsync";
+import {
+  acceptQuote,
+  extendTrial,
+  fetchLicenseFile,
+  fetchQuotePdf,
+  fetchSnapshot,
+  goLive,
+  issueQuote,
+  resetProcurement,
+  startAgreement,
+  startTrial,
+  type ProcurementSnapshot,
+  type QuoteResult,
+} from "@portal/api/procurement";
+
+export type ProcurementExtra = null | "docs" | "schedule" | "trial";
+
+/**
+ * Owns the procurement deal state and actions shared by the Home hero footer
+ * (deal-status hero) and the takeover flow modals. Extracted from
+ * ProcurementHome so the deal-status hero can render inside the tier hero card
+ * while the flow modals live alongside it. Gated on an account link.
+ */
+export interface ProcurementController {
+  isLinked: boolean;
+  loading: boolean;
+  data: ProcurementSnapshot | null;
+  started: boolean;
+  stage: ProcurementSnapshot["stage"] | undefined;
+  latest: QuoteResult | null;
+  isIssued: boolean;
+  isDraft: boolean;
+  busy: boolean;
+  downloading: boolean;
+  downloadingLicense: boolean;
+  error: string | null;
+  setError: (e: string | null) => void;
+  open: boolean;
+  setOpen: (b: boolean) => void;
+  editing: boolean;
+  setEditing: (b: boolean) => void;
+  extra: ProcurementExtra;
+  setExtra: (e: ProcurementExtra) => void;
+  invoicePdf: string | null;
+  onStartTrial: () => void;
+  onExtendTrial: () => void;
+  onReset: () => void;
+  onGenerate: (draft: QuoteResult) => void;
+  onAcceptQuote: () => void;
+  onAgree: () => void;
+  onGoLive: () => void;
+  onDownloadPdf: () => Promise;
+  onDownloadOfflineLicense: () => Promise;
+}
+
+export function useProcurement(autoOpen = false): ProcurementController {
+  const { t } = useTranslation();
+  const isLinked = usePortalLinked();
+
+  const state = useAsync(
+    () => (isLinked ? fetchSnapshot() : Promise.resolve(null)),
+    [isLinked],
+  );
+  const [snap, setSnap] = useState(null);
+  const [open, setOpen] = useState(false);
+  const [busy, setBusy] = useState(false);
+  const [editing, setEditing] = useState(false);
+  const [downloading, setDownloading] = useState(false);
+  const [downloadingLicense, setDownloadingLicense] = useState(false);
+  const [invoicePdf, setInvoicePdf] = useState(null);
+  const [error, setError] = useState(null);
+  const [extra, setExtra] = useState(null);
+
+  const data = snap ?? (state.loading ? null : state.data);
+  const started = data?.dealId != null;
+  const stage = data?.stage;
+  const latest = data?.latestQuote ?? null;
+  const isIssued = latest?.status === "sent" || latest?.status === "open";
+  // No live quote to act on (none yet, still a draft, or expired/canceled) → the buyer (re)builds.
+  const isDraft =
+    !latest ||
+    ["draft", "expired", "canceled", "cancelled"].includes(latest.status);
+
+  async function run(fn: () => Promise) {
+    setBusy(true);
+    setError(null);
+    try {
+      await fn();
+      setSnap(await fetchSnapshot());
+    } catch (e) {
+      console.error("[procurement] action failed", e);
+      setError(e instanceof Error ? e.message : String(e));
+    } finally {
+      setBusy(false);
+    }
+  }
+
+  const onStartTrial = () => run(startTrial);
+  const onExtendTrial = () => run(extendTrial);
+  const onReset = () =>
+    run(async () => {
+      await resetProcurement();
+      setEditing(false);
+      setInvoicePdf(null);
+    });
+  const onGenerate = (draft: QuoteResult) =>
+    run(async () => {
+      await issueQuote(draft.quoteId);
+      setEditing(false);
+    });
+  // Milestone → agreement (security) stage; then agreeing accepts into a subscription.
+  const onAcceptQuote = () => run(startAgreement);
+  const onAgree = () =>
+    run(async () => {
+      if (!latest) return;
+      const res = await acceptQuote(latest.quoteId);
+      setInvoicePdf(res.invoicePdf);
+    });
+  const onGoLive = () => run(goLive);
+
+  async function onDownloadPdf() {
+    if (!latest) return;
+    setDownloading(true);
+    try {
+      const blob = await fetchQuotePdf(latest.quoteId);
+      // A same-gesture      click is reliable; window.open after an await is often
+      // popup-blocked (which is what made this take "a few goes").
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = `${latest.quoteNumber || "quote"}.pdf`;
+      document.body.appendChild(a);
+      a.click();
+      a.remove();
+      setTimeout(() => URL.revokeObjectURL(url), 60_000);
+    } catch (e) {
+      console.error("[procurement] quote PDF download failed", e);
+      setError(t("portal.procurement.milestone.downloadError"));
+    } finally {
+      setDownloading(false);
+    }
+  }
+
+  async function onDownloadOfflineLicense() {
+    setDownloadingLicense(true);
+    try {
+      const cert = await fetchLicenseFile();
+      const blob = new Blob([cert], { type: "text/plain" });
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = "stirling-enterprise.lic";
+      document.body.appendChild(a);
+      a.click();
+      a.remove();
+      setTimeout(() => URL.revokeObjectURL(url), 60_000);
+    } catch (e) {
+      console.error("[procurement] offline licence download failed", e);
+      setError(t("portal.procurement.license.downloadError"));
+    } finally {
+      setDownloadingLicense(false);
+    }
+  }
+
+  // A deep link (/procurement) opens the flow when a deal is already underway; if there's no deal
+  // yet it must NOT silently start a trial — leave the modal closed so the Start-trial CTA shows.
+  useEffect(() => {
+    if (autoOpen && started) setOpen(true);
+  }, [autoOpen, started]);
+
+  return {
+    isLinked,
+    loading: state.loading,
+    data,
+    started,
+    stage,
+    latest,
+    isIssued,
+    isDraft,
+    busy,
+    downloading,
+    downloadingLicense,
+    error,
+    setError,
+    open,
+    setOpen,
+    editing,
+    setEditing,
+    extra,
+    setExtra,
+    invoicePdf,
+    onStartTrial,
+    onExtendTrial,
+    onReset,
+    onGenerate,
+    onAcceptQuote,
+    onAgree,
+    onGoLive,
+    onDownloadPdf,
+    onDownloadOfflineLicense,
+  };
+}
diff --git a/frontend/editor/src/portal/components/settings/accountLinkSettings.tsx b/frontend/editor/src/portal/components/settings/accountLinkSettings.tsx
new file mode 100644
index 0000000000..8e769672d7
--- /dev/null
+++ b/frontend/editor/src/portal/components/settings/accountLinkSettings.tsx
@@ -0,0 +1,26 @@
+import type { ComponentType, ReactNode } from "react";
+import { LinkIcon } from "@portal/components/icons";
+import { AccountLinkPanel } from "@portal/components/account-link/AccountLinkPanel";
+
+export interface AccountLinkSettingsSeam {
+  /** Section key in the Settings nav + body switch. */
+  navKey: string;
+  /** i18n key for the nav label; resolved with `t()` at the call site. */
+  labelKey: string;
+  icon: ReactNode;
+  /** The section body — the account-link panel. */
+  Body: ComponentType;
+}
+
+/**
+ * The admin "Account link" section of Settings (self-hosted only). The SaaS
+ * build shadows this file with `null`: the signed-in account IS the SaaS
+ * account, so there is no instance to link — the nav item and its panel both
+ * drop out, and nothing imports the link-only AccountLinkPanel.
+ */
+export const accountLinkSettings: AccountLinkSettingsSeam | null = {
+  navKey: "account-link",
+  labelKey: "portal.settings.sections.account-link",
+  icon: ,
+  Body: AccountLinkPanel,
+};
diff --git a/frontend/editor/src/portal/components/sidebarGroups.tsx b/frontend/editor/src/portal/components/sidebarGroups.tsx
new file mode 100644
index 0000000000..71b7539412
--- /dev/null
+++ b/frontend/editor/src/portal/components/sidebarGroups.tsx
@@ -0,0 +1,44 @@
+import { type ReactNode } from "react";
+import { type ViewId } from "@portal/contexts/ViewContext";
+import {
+  HomeIcon,
+  UsersIcon,
+  SourcesIcon,
+  PoliciesIcon,
+  PipelinesIcon,
+  DocumentsIcon,
+  ComponentsIcon,
+  InfrastructureIcon,
+  UsageIcon,
+  DocsIcon,
+} from "@portal/components/icons";
+
+export interface NavEntry {
+  id: ViewId;
+  icon: ReactNode;
+  /** When set, the tab opens this URL in a new tab instead of navigating in-app. */
+  externalUrl?: string;
+}
+
+// Developer docs has no built-in portal page yet, so the tab opens the hosted docs
+// site in a new tab rather than routing to an empty page.
+const DEVELOPER_DOCS_URL = "https://docs.stirlingpdf.com/";
+
+// Sidebar nav groups. This is a flavor seam: the SaaS build shadows this file to
+// drop sections not yet shipped there (see src/portal-saas/components/sidebarGroups).
+export const GROUP_PRIMARY: NavEntry[] = [{ id: "home", icon:  }];
+
+export const GROUP_OPERATIONAL: NavEntry[] = [
+  { id: "users", icon:  },
+  { id: "sources", icon:  },
+  { id: "policies", icon:  },
+  { id: "pipelines", icon:  },
+  { id: "documents", icon:  },
+  { id: "components", icon:  },
+];
+
+export const GROUP_PLATFORM: NavEntry[] = [
+  { id: "infrastructure", icon:  },
+  { id: "usage", icon:  },
+  { id: "docs", icon: , externalUrl: DEVELOPER_DOCS_URL },
+];
diff --git a/frontend/editor/src/portal/components/sources/AgentBuilderAction.tsx b/frontend/editor/src/portal/components/sources/AgentBuilderAction.tsx
new file mode 100644
index 0000000000..5e3885e5fc
--- /dev/null
+++ b/frontend/editor/src/portal/components/sources/AgentBuilderAction.tsx
@@ -0,0 +1,22 @@
+import { useTranslation } from "react-i18next";
+import { Button } from "@app/ui";
+import { useView } from "@portal/contexts/ViewContext";
+import { AgentBuilderIcon } from "@portal/components/icons";
+
+/**
+ * The "Agent Builder" action in the Sources header. A flavor seam: the SaaS build
+ * shadows this with a no-op (Agent Builder isn't shipped there yet).
+ */
+export function AgentBuilderAction() {
+  const { t } = useTranslation();
+  const { setActiveView } = useView();
+  return (
+    
+  );
+}
diff --git a/frontend/editor/src/portal/components/sources/ConnectWizard.test.tsx b/frontend/editor/src/portal/components/sources/ConnectWizard.test.tsx
index c6874effcd..d354da1d40 100644
--- a/frontend/editor/src/portal/components/sources/ConnectWizard.test.tsx
+++ b/frontend/editor/src/portal/components/sources/ConnectWizard.test.tsx
@@ -1,8 +1,13 @@
 import { beforeEach, describe, expect, it, vi } from "vitest";
 import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
 import { HttpError } from "@portal/api/http";
 import { ConnectWizard } from "@portal/components/sources/ConnectWizard";
 
+function renderWithMantine(ui: React.ReactElement) {
+  return render({ui});
+}
+
 // Deterministic i18n: keys come back verbatim so the test never waits on the
 // async TOML backend.
 vi.mock("react-i18next", () => ({
@@ -41,7 +46,9 @@ describe("ConnectWizard", () => {
     const onCreated = vi.fn();
     const onClose = vi.fn();
 
-    render();
+    renderWithMantine(
+      ,
+    );
 
     stepToReview();
 
@@ -66,7 +73,7 @@ describe("ConnectWizard", () => {
     createSource.mockResolvedValue({ id: "s1" });
     const onCreated = vi.fn();
 
-    render(
+    renderWithMantine(
        {
       }),
     );
 
-    render();
+    renderWithMantine(
+      ,
+    );
 
     stepToReview();
     fireEvent.click(screen.getByText("portal.sources.actions.connectSource"));
diff --git a/frontend/editor/src/portal/components/sources/ConnectWizard.tsx b/frontend/editor/src/portal/components/sources/ConnectWizard.tsx
index 8683873316..afb3982545 100644
--- a/frontend/editor/src/portal/components/sources/ConnectWizard.tsx
+++ b/frontend/editor/src/portal/components/sources/ConnectWizard.tsx
@@ -153,7 +153,7 @@ export function ConnectWizard({
       footer={
         
    
           
+            
           ))}
         
    
       )}
@@ -245,8 +245,8 @@ export function ConnectWizard({
                     value: o.value,
                     label: t(o.labelKey),
                   }))}
-                  onChange={(e) =>
-                    setOptions((o) => ({ ...o, [field.key]: e.target.value }))
+                  onChange={(value) =>
+                    setOptions((o) => ({ ...o, [field.key]: value ?? "" }))
                   }
                 />
               ) : (
diff --git a/frontend/editor/src/portal/components/sources/SourceDetailCard.tsx b/frontend/editor/src/portal/components/sources/SourceDetailCard.tsx
index e1ab6a3503..ca659ec9d5 100644
--- a/frontend/editor/src/portal/components/sources/SourceDetailCard.tsx
+++ b/frontend/editor/src/portal/components/sources/SourceDetailCard.tsx
@@ -1,9 +1,10 @@
 import { useTranslation } from "react-i18next";
-import { Button } from "@app/ui";
+import { ActionIcon, Button } from "@app/ui";
 import type { SourceView } from "@portal/api/sources";
 import { SourceDetailPanel } from "@portal/components/sources/SourceDetailPanel";
 import { sourceTypeMeta } from "@portal/components/sources/sourceTypes";
 import "@portal/views/Sources.css";
+import CloseIcon from "@mui/icons-material/Close";
 
 interface SourceDetailCardProps {
   source: SourceView;
@@ -33,7 +34,7 @@ export function SourceDetailCard({
     
    
       
    
         
           {meta.icon}
@@ -47,28 +48,28 @@ export function SourceDetailCard({
             })}
           
         
    
-        
+          
+        
       
 
       
 
       
    
         
         
         
           
@@ -188,7 +188,7 @@ export function AccessControls({ access }: AccessControlsProps) {
           title={t("portal.users.access.upgrade.title")}
           description={access.upgradeHint}
           action={
-            
           }
diff --git a/frontend/editor/src/portal/components/users/InviteMemberModal.tsx b/frontend/editor/src/portal/components/users/InviteMemberModal.tsx
index 5031b6427c..fe90105cf5 100644
--- a/frontend/editor/src/portal/components/users/InviteMemberModal.tsx
+++ b/frontend/editor/src/portal/components/users/InviteMemberModal.tsx
@@ -60,7 +60,7 @@ export function InviteMemberModal({ open, onClose }: InviteMemberModalProps) {
       subtitle={t("portal.users.invite.subtitle")}
       footer={
         
    
-          
           
    
+        
    
+           setEnabled(e.target.checked)}
+            label={t("portal.pipelines.builder.enabled")}
+          />
+          {isEdit && (
+            <>
+              
+              
+            
+          )}
+          
+          
+        
    
+      
+
+      {error && }
+      {runResult && (
+        
+      )}
+      {hasUploadSteps && (
+        
+      )}
+
+      {/* Pipeline-level settings, above the operation list. */}
+      
    
+        
    
+          {t("portal.pipelines.builder.pipelineSettings")}
+        
    
+        
    
+          
    
+            
+              {t("portal.pipelines.composer.sources")}
+            
+            {sourcesState.loading ? (
+              
    
+                {t("portal.pipelines.composer.sourcesLoading")}
+              
    
+            ) : availableSources.length === 0 ? (
+              
    
+                {t("portal.pipelines.composer.noSources")}
+              
    
+            ) : (
+              
    
+                {availableSources.map((source) => (
+                   toggleSource(source.id, e.target.checked)}
+                    label={source.name}
+                  />
+                ))}
+              
    
+            )}
+            
+          
    
+
+          
    
+            
+              {t("portal.pipelines.composer.trigger")}
+            
+            
+              name="pipeline-trigger"
+              value={triggerType}
+              onChange={setTriggerType}
+              options={triggerOptions}
+            />
+            {triggerType === "schedule" && (
+              
    
+                
+                  {t("portal.pipelines.composer.scheduleEvery")}
+                
+                 setScheduleCount(e.target.value)}
+                  className="portal-pipelines__schedule-count"
+                />
+                 setOutputDirectory(e.target.value)}
+                />
+              
+            )}
+          
    
+        
    
+      
    
+
+      
    
+        
    
+          
    
+            {t("portal.pipelines.composer.operations", { count: steps.length })}
+          
    
+
+          {steps.length === 0 && !pickerOpen && (
+            
    
+              {t("portal.pipelines.composer.chainEmpty")}
+            
    
+          )}
+
+          
      
+            {steps.map((step, i) => (
+              
    1. 
+                
      
+                  
+                  
      
+                     moveStep(i, -1)}
+                    >
+                      
+                    
+                     moveStep(i, 1)}
+                    >
+                      
+                    
+                     removeStep(i)}
+                    >
+                      
+                    
+                  
      
+                
      
+              
      2. 
+            ))}
+          
    
+
+          {pickerOpen ? (
+             setPickerOpen(false)}
+            />
+          ) : (
+            
+          )}
+        
    
+
+        
+      
    
+
+       !deleting && setPendingDelete(false)}
+        width="sm"
+        title={t("portal.pipelines.delete.title")}
+        footer={
+          
    
+            
+            
+          
    
+        }
+      >
+        
    {t("portal.pipelines.delete.body", { name: name || "" })}
    
+          
+
+       !submitting && setPendingNav(null)}
+        width="sm"
+        title={t("portal.pipelines.builder.unsavedTitle")}
+        footer={
+          
    
+            
+            
    
+              
+              
+            
    
+          
    
+        }
+      >
+        
    {t("portal.pipelines.builder.unsavedBody")}
    
+          
+    
    
+  );
+}
diff --git a/frontend/editor/src/portal/views/Pipelines.css b/frontend/editor/src/portal/views/Pipelines.css
index c61f6bcafe..7cd241074d 100644
--- a/frontend/editor/src/portal/views/Pipelines.css
+++ b/frontend/editor/src/portal/views/Pipelines.css
@@ -81,104 +81,6 @@
   color: var(--color-blue);
 }
 
-/* Expanded detail panel */
-.portal-pipelines__expanded {
-  background: var(--color-surface);
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-lg);
-  box-shadow: var(--shadow-sm);
-  padding: 1.25rem;
-  animation: portal-pipelines-reveal var(--motion-fast) ease-out;
-}
-
-@keyframes portal-pipelines-reveal {
-  from {
-    opacity: 0;
-    transform: translateY(-0.25rem);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-.portal-pipelines__expanded-head {
-  display: flex;
-  align-items: center;
-  gap: 0.75rem;
-  padding-bottom: 0.875rem;
-  margin-bottom: 1rem;
-  border-bottom: 1px solid var(--color-border-light);
-}
-
-.portal-pipelines__expanded-title {
-  margin: 0;
-  font-size: 1rem;
-  font-weight: 600;
-  color: var(--color-text-1);
-}
-
-.portal-pipelines__expanded-sub {
-  font-size: 0.75rem;
-  color: var(--color-text-4);
-}
-
-.portal-pipelines__expanded-close {
-  margin-left: auto;
-  width: 1.75rem;
-  height: 1.75rem;
-  border-radius: var(--radius-md);
-  border: 1px solid var(--color-border);
-  background: var(--color-surface);
-  color: var(--color-text-4);
-  font-size: 1.125rem;
-  line-height: 1;
-  cursor: pointer;
-  transition:
-    background var(--motion-fast),
-    color var(--motion-fast);
-}
-
-.portal-pipelines__expanded-close:hover {
-  background: var(--color-bg-hover);
-  color: var(--color-text-1);
-}
-
-/* Detail body */
-.portal-pipelines__detail {
-  display: flex;
-  flex-direction: column;
-  gap: 1.125rem;
-}
-
-.portal-pipelines__detail-section {
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-}
-
-.portal-pipelines__detail-heading {
-  font-size: 0.6875rem;
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-  color: var(--color-text-5);
-  font-weight: 600;
-}
-
-.portal-pipelines__chips {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.375rem;
-}
-
-.portal-pipelines__detail-actions {
-  display: flex;
-  gap: 0.5rem;
-  padding-top: 0.875rem;
-  margin-top: 1rem;
-  border-top: 1px solid var(--color-border-light);
-}
-
 /* Table skeleton */
 .portal-pipelines__table-skeleton {
   display: flex;
@@ -186,20 +88,13 @@
   gap: 0.5rem;
 }
 
-/* ──────────────────────────────────────────────────────────────────────── */
-/*  Composer                                                                 */
-/* ──────────────────────────────────────────────────────────────────────── */
-
-.portal-pipelines__composer {
-  display: flex;
-  flex-direction: column;
-  gap: 1.25rem;
-}
-
-.portal-pipelines__composer-section {
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
+/* Shared with the pipeline builder page. */
+.portal-pipelines__detail-heading {
+  font-size: 0.6875rem;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  color: var(--color-text-5);
+  font-weight: 600;
 }
 
 .portal-pipelines__composer-footer {
@@ -221,83 +116,6 @@
   border-radius: var(--radius-md);
 }
 
-/* Operation chain */
-.portal-pipelines__chain {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 0.375rem;
-}
-
-.portal-pipelines__chain-row {
-  display: flex;
-  align-items: center;
-  gap: 0.625rem;
-  padding: 0.4375rem 0.625rem;
-  background: var(--color-bg-subtle);
-  border: 1px solid var(--color-border-light);
-  border-radius: var(--radius-md);
-}
-
-.portal-pipelines__chain-index {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 1.25rem;
-  height: 1.25rem;
-  flex-shrink: 0;
-  border-radius: 50%;
-  font-size: 0.6875rem;
-  font-weight: 600;
-  background: var(--color-blue-light);
-  color: var(--color-blue);
-}
-
-.portal-pipelines__chain-op {
-  flex: 1;
-  font-size: 0.8125rem;
-  color: var(--color-text-1);
-}
-
-.portal-pipelines__chain-actions {
-  display: flex;
-  gap: 0.25rem;
-}
-
-.portal-pipelines__chain-actions button {
-  width: 1.5rem;
-  height: 1.5rem;
-  border-radius: var(--radius-md);
-  border: 1px solid var(--color-border);
-  background: var(--color-surface);
-  color: var(--color-text-3);
-  font-size: 0.8125rem;
-  line-height: 1;
-  cursor: pointer;
-  transition:
-    background var(--motion-fast),
-    color var(--motion-fast);
-}
-
-.portal-pipelines__chain-actions button:hover:not(:disabled) {
-  background: var(--color-bg-hover);
-  color: var(--color-text-1);
-}
-
-.portal-pipelines__chain-actions button:disabled {
-  opacity: 0.4;
-  cursor: default;
-}
-
-.portal-pipelines__op-palette {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.375rem;
-}
-
-/* Schedule row */
 .portal-pipelines__schedule {
   display: flex;
   align-items: center;
diff --git a/frontend/editor/src/portal/views/Pipelines.test.tsx b/frontend/editor/src/portal/views/Pipelines.test.tsx
index 6b69d8ca33..5bc20616bb 100644
--- a/frontend/editor/src/portal/views/Pipelines.test.tsx
+++ b/frontend/editor/src/portal/views/Pipelines.test.tsx
@@ -1,13 +1,20 @@
 import { beforeEach, describe, expect, it, vi } from "vitest";
-import { fireEvent, render, screen, waitFor } from "@testing-library/react";
-import { MemoryRouter } from "react-router-dom";
-import { HttpError } from "@portal/api/http";
-import type { PipelinesOverviewResponse, Policy } from "@portal/api/pipelines";
-import type { SourcesResponse } from "@portal/api/sources";
+import {
+  fireEvent,
+  render as baseRender,
+  screen,
+} from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import { MemoryRouter, Route, Routes } from "react-router-dom";
+import type { PipelinesOverviewResponse } from "@portal/api/pipelines";
 import { Pipelines } from "@portal/views/Pipelines";
 
-// Deterministic i18n: keys returned verbatim, so assertions are stable without
-// the async TOML backend.
+const render = (
+  ui: Parameters[0],
+  options?: Parameters[1],
+) => baseRender(ui, { wrapper: MantineProvider, ...options });
+
+// Deterministic i18n: keys returned verbatim.
 vi.mock("react-i18next", () => ({
   useTranslation: () => ({
     t: (key: string) => key,
@@ -16,25 +23,8 @@ vi.mock("react-i18next", () => ({
 }));
 
 const fetchPipelines = vi.fn();
-const fetchPipeline = vi.fn();
-const savePipeline = vi.fn();
-const deletePipeline = vi.fn();
-const fetchTriggers = vi.fn();
-const triggerPipeline = vi.fn();
-const fetchRun = vi.fn();
 vi.mock("@portal/api/pipelines", () => ({
   fetchPipelines: () => fetchPipelines(),
-  fetchPipeline: (id: string) => fetchPipeline(id),
-  savePipeline: (policy: unknown) => savePipeline(policy),
-  deletePipeline: (id: string) => deletePipeline(id),
-  fetchTriggers: () => fetchTriggers(),
-  triggerPipeline: (id: string) => triggerPipeline(id),
-  fetchRun: (runId: string) => fetchRun(runId),
-}));
-
-const fetchSources = vi.fn();
-vi.mock("@portal/api/sources", () => ({
-  fetchSources: () => fetchSources(),
 }));
 
 const RESPONSE: PipelinesOverviewResponse = {
@@ -55,55 +45,20 @@ const RESPONSE: PipelinesOverviewResponse = {
       output: "inline",
       owner: "security@acme.com",
     },
-    {
-      id: "plc-archive",
-      name: "Archive compressor",
-      enabled: true,
-      status: "active",
-      trigger: "manual",
-      sources: [],
-      steps: ["/api/v1/misc/compress-pdf"],
-      output: "folder",
-      owner: "data@acme.com",
-    },
   ],
 };
 
-const RAW_REDACTION: Policy = {
-  id: "plc-redaction",
-  name: "Redaction sweep",
-  enabled: true,
-  trigger: {
-    type: "schedule",
-    options: { schedule: { type: "every", count: 6, unit: "HOURS" } },
-  },
-  sourceIds: ["src-claims"],
-  steps: [{ operation: "/api/v1/security/auto-redact", parameters: {} }],
-  output: { type: "inline", options: {} },
-};
-
-const SOURCES: SourcesResponse = {
-  kpis: [],
-  sources: [
-    {
-      id: "src-claims",
-      name: "Claims intake",
-      type: "folder",
-      status: "active",
-      referenceCount: 1,
-      referencingPolicies: [],
-      config: [],
-      docsTotal: 0,
-      docs24h: 0,
-      docs30d: 0,
-    },
-  ],
-};
-
-function renderView() {
+function renderView(initial = "/portal/pipelines") {
   return render(
-    
-      
+    
+      
+        } />
+        builder new
    } />
+        pipeline page}
+        />
+      
     ,
   );
 }
@@ -111,139 +66,19 @@ function renderView() {
 describe("Pipelines view", () => {
   beforeEach(() => {
     fetchPipelines.mockReset();
-    fetchPipeline.mockReset();
-    savePipeline.mockReset();
-    deletePipeline.mockReset();
-    fetchSources.mockReset();
-    fetchTriggers.mockReset();
-    triggerPipeline.mockReset();
-    fetchRun.mockReset();
-    // The composer loads the trigger registry on open; default to none.
-    fetchTriggers.mockResolvedValue([]);
+    fetchPipelines.mockResolvedValue(RESPONSE);
   });
 
-  it("surfaces the inline error message when a delete fails", async () => {
-    fetchPipelines.mockResolvedValue(RESPONSE);
-    deletePipeline.mockRejectedValue(
-      new HttpError(500, "Server Error", {
-        detail: "Could not delete pipeline",
-      }),
-    );
-
+  it("opens the builder when creating a pipeline", async () => {
     renderView();
-
-    fireEvent.click(await screen.findByText("Redaction sweep"));
-    fireEvent.click(await screen.findByText("portal.pipelines.detail.delete"));
-    fireEvent.click(await screen.findByText("portal.pipelines.delete.confirm"));
-
-    await waitFor(() => {
-      expect(deletePipeline).toHaveBeenCalledWith("plc-redaction");
-    });
-    expect(
-      await screen.findByText("Could not delete pipeline"),
-    ).toBeInTheDocument();
-  });
-
-  it("pauses a pipeline by re-saving it with enabled flipped off", async () => {
-    fetchPipelines.mockResolvedValue(RESPONSE);
-    fetchPipeline.mockResolvedValue(RAW_REDACTION);
-    savePipeline.mockResolvedValue({});
-
-    renderView();
-
-    fireEvent.click(await screen.findByText("Redaction sweep"));
-    fireEvent.click(await screen.findByText("portal.pipelines.detail.pause"));
-
-    await waitFor(() => {
-      expect(savePipeline).toHaveBeenCalledTimes(1);
-    });
-    expect(fetchPipeline).toHaveBeenCalledWith("plc-redaction");
-    expect(savePipeline).toHaveBeenCalledWith(
-      expect.objectContaining({ id: "plc-redaction", enabled: false }),
-    );
-  });
-
-  it("runs a pipeline now and reports success inline", async () => {
-    fetchPipelines.mockResolvedValue(RESPONSE);
-    triggerPipeline.mockResolvedValue(["run-1"]);
-    fetchRun.mockResolvedValue({
-      runId: "run-1",
-      policyId: "plc-redaction",
-      status: "COMPLETED",
-      currentStep: 1,
-      stepCount: 1,
-      error: null,
-      errorCode: null,
-      createdAt: 0,
-    });
-
-    renderView();
-
-    fireEvent.click(await screen.findByText("Redaction sweep"));
-    fireEvent.click(await screen.findByText("portal.pipelines.detail.run"));
-
-    await waitFor(() => {
-      expect(triggerPipeline).toHaveBeenCalledWith("plc-redaction");
-    });
-    expect(
-      await screen.findByText("portal.pipelines.run.completed"),
-    ).toBeInTheDocument();
-  });
-
-  it("surfaces an execution failure from a manual run", async () => {
-    fetchPipelines.mockResolvedValue(RESPONSE);
-    triggerPipeline.mockResolvedValue(["run-1"]);
-    fetchRun.mockResolvedValue({
-      runId: "run-1",
-      policyId: "plc-redaction",
-      status: "FAILED",
-      currentStep: 1,
-      stepCount: 1,
-      error: "step 1 blew up",
-      errorCode: null,
-      createdAt: 0,
-    });
-
-    renderView();
-
-    fireEvent.click(await screen.findByText("Redaction sweep"));
-    fireEvent.click(await screen.findByText("portal.pipelines.detail.run"));
-
-    expect(
-      await screen.findByText("portal.pipelines.run.failed"),
-    ).toBeInTheDocument();
-  });
-
-  it("creates a pipeline with the chosen name and chained operation", async () => {
-    fetchPipelines.mockResolvedValue(RESPONSE);
-    fetchSources.mockResolvedValue(SOURCES);
-    savePipeline.mockResolvedValue({});
-
-    renderView();
-
-    // Wait for the table so the initial fetch has settled, then open the composer.
     await screen.findByText("Redaction sweep");
     fireEvent.click(screen.getByText("portal.pipelines.actions.newPipeline"));
+    expect(await screen.findByText("builder new")).toBeInTheDocument();
+  });
 
-    fireEvent.change(await screen.findByRole("textbox"), {
-      target: { value: "Nightly compress" },
-    });
-    // Operation palette chip labels are derived from the endpoint path.
-    fireEvent.click(await screen.findByText("+ Compress"));
-    fireEvent.click(screen.getByText("portal.pipelines.composer.create"));
-
-    await waitFor(() => {
-      expect(savePipeline).toHaveBeenCalledTimes(1);
-    });
-    expect(savePipeline).toHaveBeenCalledWith(
-      expect.objectContaining({
-        name: "Nightly compress",
-        trigger: null,
-        output: expect.objectContaining({ type: "inline" }),
-        steps: [
-          expect.objectContaining({ operation: "/api/v1/misc/compress-pdf" }),
-        ],
-      }),
-    );
+  it("opens a pipeline's own page when its row is clicked", async () => {
+    renderView();
+    fireEvent.click(await screen.findByText("Redaction sweep"));
+    expect(await screen.findByText("pipeline page")).toBeInTheDocument();
   });
 });
diff --git a/frontend/editor/src/portal/views/Pipelines.tsx b/frontend/editor/src/portal/views/Pipelines.tsx
index d87e697446..0122de5bbc 100644
--- a/frontend/editor/src/portal/views/Pipelines.tsx
+++ b/frontend/editor/src/portal/views/Pipelines.tsx
@@ -1,107 +1,32 @@
-import { useCallback, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Banner, Button, EmptyState, Modal, Skeleton } from "@app/ui";
+import { useNavigate } from "react-router-dom";
+import AddRoundedIcon from "@mui/icons-material/AddRounded";
+import { Button, EmptyState, Skeleton } from "@app/ui";
 import { useAsync, useSectionFlags } from "@portal/hooks/useAsync";
-import { errorMessage } from "@portal/api/http";
 import {
-  deletePipeline,
-  fetchPipeline,
   fetchPipelines,
-  savePipeline,
   type PipelinesOverviewResponse,
   type PipelineView,
-  type Policy,
 } from "@portal/api/pipelines";
+import { VIEW_PATHS, toPortalPath } from "@portal/contexts/ViewContext";
 import { KpiStrip } from "@portal/components/pipelines/KpiStrip";
 import { PipelinesTable } from "@portal/components/pipelines/PipelinesTable";
-import { PipelineDetailCard } from "@portal/components/pipelines/PipelineDetailCard";
-import { PipelineComposer } from "@portal/components/pipelines/PipelineComposer";
 import "@portal/views/Pipelines.css";
 
 export function Pipelines() {
   const { t } = useTranslation();
-  // Refetch after every mutation by bumping this counter, so the table reflects
-  // the backend (mirrors the Sources view).
-  const [version, setVersion] = useState(0);
-  const state = useAsync(
-    () => fetchPipelines(),
-    [version],
-  );
+  const navigate = useNavigate();
+  const state = useAsync(() => fetchPipelines(), []);
   const { data, loading } = state;
   const { isLoading, isEmpty } = useSectionFlags(state);
-  const refetch = useCallback(() => setVersion((v) => v + 1), []);
-
-  const [expandedId, setExpandedId] = useState(null);
-  const [composerOpen, setComposerOpen] = useState(false);
-  const [editing, setEditing] = useState(null);
-  const [mutating, setMutating] = useState(false);
-  const [pageError, setPageError] = useState(null);
-  const [pendingDelete, setPendingDelete] = useState(null);
-  const [deleting, setDeleting] = useState(false);
-  const [deleteError, setDeleteError] = useState(null);
 
   const pipelines = data?.pipelines ?? [];
-  const expanded = pipelines.find((p) => p.id === expandedId) ?? null;
 
-  function openCreate() {
-    setEditing(null);
-    setComposerOpen(true);
-  }
-
-  // Editing needs the raw policy (steps, trigger, source ids), which the overview
-  // rows don't carry, so fetch it before opening the composer prefilled.
-  async function openEdit(pipeline: PipelineView) {
-    if (mutating) return;
-    setPageError(null);
-    setMutating(true);
-    try {
-      setEditing(await fetchPipeline(pipeline.id));
-      setComposerOpen(true);
-    } catch (e) {
-      setPageError(errorMessage(e));
-    } finally {
-      setMutating(false);
-    }
-  }
-
-  // Pause/resume: re-save the policy with enabled flipped (the backend has no
-  // dedicated endpoint; every mutation routes through POST /policies). Fetch the
-  // raw record first so the full config round-trips intact.
-  async function togglePause(pipeline: PipelineView) {
-    if (mutating) return;
-    setPageError(null);
-    setMutating(true);
-    try {
-      const raw = await fetchPipeline(pipeline.id);
-      await savePipeline({ ...raw, enabled: !raw.enabled });
-      refetch();
-    } catch (e) {
-      setPageError(errorMessage(e));
-    } finally {
-      setMutating(false);
-    }
-  }
-
-  function requestDelete(pipeline: PipelineView) {
-    setDeleteError(null);
-    setPendingDelete(pipeline);
-  }
-
-  async function confirmDelete() {
-    if (!pendingDelete || deleting) return;
-    setDeleting(true);
-    setDeleteError(null);
-    try {
-      await deletePipeline(pendingDelete.id);
-      setPendingDelete(null);
-      setExpandedId(null);
-      refetch();
-    } catch (e) {
-      setDeleteError(errorMessage(e));
-    } finally {
-      setDeleting(false);
-    }
-  }
+  const openCreate = () =>
+    navigate(`${toPortalPath(VIEW_PATHS.pipelines)}/new`);
+  // A row opens that pipeline's own page (view / edit / run / delete live there).
+  const openPipeline = (pipeline: PipelineView) =>
+    navigate(`${toPortalPath(VIEW_PATHS.pipelines)}/${pipeline.id}`);
 
   return (
     
    
@@ -114,13 +39,14 @@ export function Pipelines() {
             {t("portal.pipelines.subtitle")}
           
    
         
    
-        
       
 
-      {pageError && }
-
       
 
       {isLoading && (
@@ -144,66 +70,8 @@ export function Pipelines() {
       )}
 
       {!isLoading && !isEmpty && pipelines.length > 0 && (
-        
-            setExpandedId((cur) => (cur === p.id ? null : p.id))
-          }
-        />
+        
       )}
-
-      {expanded && (
-         setExpandedId(null)}
-          onEdit={openEdit}
-          onTogglePause={togglePause}
-          onDelete={requestDelete}
-          busy={mutating}
-        />
-      )}
-
-       setComposerOpen(false)}
-        onSaved={refetch}
-      />
-
-       !deleting && setPendingDelete(null)}
-        width="sm"
-        title={t("portal.pipelines.delete.title")}
-        footer={
-          
    
-            
-            
-          
    
-        }
-      >
-        
    
-          {t("portal.pipelines.delete.body", {
-            name: pendingDelete?.name ?? "",
-          })}
-        
    
-        {deleteError && }
-          
     
   );
 }
diff --git a/frontend/editor/src/portal/views/Policies.css b/frontend/editor/src/portal/views/Policies.css
index 5744b2ff42..6bad9365c5 100644
--- a/frontend/editor/src/portal/views/Policies.css
+++ b/frontend/editor/src/portal/views/Policies.css
@@ -36,6 +36,31 @@
   gap: 0.375rem;
 }
 
+/* Category row — locked (coming soon) */
+.portal-policies__row {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  padding: 0.25rem 0.75rem;
+  min-height: 2.25rem;
+}
+
+.portal-policies__row-name {
+  flex: 1;
+  font-size: 0.9375rem;
+  font-weight: 600;
+  color: var(--color-text-3);
+}
+
+/* "Set up" underline link inside the active-row button's rightSection */
+.portal-policies__setup-link {
+  font-size: 0.8125rem;
+  font-weight: 600;
+  color: var(--color-blue);
+  text-decoration: underline;
+  text-underline-offset: 2px;
+}
+
 /* Category card — horizontal table row */
 .portal-policies__card {
   display: flex;
@@ -109,6 +134,55 @@
   color: var(--color-text-1);
 }
 
+.portal-policies__card-blurb {
+  font-size: 0.75rem;
+  color: var(--color-text-4);
+  line-height: 1.4;
+}
+
+.portal-policies__card-summary {
+  margin: 0;
+  font-size: 0.8125rem;
+  line-height: 1.5;
+  color: var(--color-text-2);
+}
+
+.portal-policies__card-foot {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+  margin-top: auto;
+  flex-wrap: wrap;
+}
+
+.portal-policies__card-rules {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.375rem;
+}
+
+.portal-policies__card-cta {
+  font-size: 0.75rem;
+  font-weight: 600;
+  color: var(--color-blue);
+}
+
+.portal-policies__chevron-right {
+  transform: rotate(-90deg);
+  display: block;
+}
+
+/* Configured-card stat footer */
+.portal-policies__card-stats {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 0.5rem;
+  margin-top: auto;
+  padding-top: 0.75rem;
+  border-top: 1px solid var(--color-border-light);
+}
+
 /* Wizard + detail shared chrome */
 .portal-policies__wizard-title {
   display: inline-flex;
diff --git a/frontend/editor/src/portal/views/Policies.tsx b/frontend/editor/src/portal/views/Policies.tsx
index d0c4e05d49..609f7b2bfc 100644
--- a/frontend/editor/src/portal/views/Policies.tsx
+++ b/frontend/editor/src/portal/views/Policies.tsx
@@ -133,7 +133,7 @@ export function Policies() {
           title={t("portal.policies.offline.title")}
           description={t("portal.policies.offline.description")}
           action={
-            
           }
diff --git a/frontend/editor/src/portal/views/Procurement.css b/frontend/editor/src/portal/views/Procurement.css
index 90da816a53..adc21fd79a 100644
--- a/frontend/editor/src/portal/views/Procurement.css
+++ b/frontend/editor/src/portal/views/Procurement.css
@@ -451,3 +451,1007 @@
     overflow-x: auto;
   }
 }
+
+/* ── Enterprise upsell CTA (Home / Usage on-ramp) ─────────────────────────── */
+.portal-proc__upsell {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+  flex-wrap: wrap;
+}
+.portal-proc__upsell-badge {
+  display: inline-block;
+  font-size: 0.625rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: var(--color-primary, #2383e2);
+  background: var(--color-primary-light, #eaf2fb);
+  padding: 0.15rem 0.5rem;
+  border-radius: 0.375rem;
+  margin-bottom: 0.4rem;
+}
+.portal-proc__upsell-copy {
+  margin: 0;
+  font-size: 0.8125rem;
+  line-height: 1.45;
+  color: var(--color-text-3);
+  max-width: 44rem;
+}
+.portal-proc__upsell-copy strong {
+  color: var(--color-text-1);
+}
+
+/* ── Quote builder ────────────────────────────────────────────────────────── */
+.portal-proc__builder-head {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  margin-bottom: 1rem;
+}
+.portal-proc__builder-title {
+  margin: 0;
+  font-size: 1rem;
+  font-weight: 650;
+  color: var(--color-text-1);
+}
+.portal-proc__builder-step {
+  font-size: 0.75rem;
+  color: var(--color-text-5);
+}
+.portal-proc__builder-body {
+  display: flex;
+  flex-direction: column;
+  gap: 0.85rem;
+}
+.portal-proc__field {
+  display: flex;
+  flex-direction: column;
+  gap: 0.3rem;
+  font-size: 0.8125rem;
+  color: var(--color-text-3);
+}
+.portal-proc__field input,
+.portal-proc__field select {
+  padding: 0.45rem 0.6rem;
+  border: 1px solid var(--color-border, #eae8e3);
+  border-radius: 0.5rem;
+  font-size: 0.875rem;
+  background: var(--color-bg-elevated, #fff);
+  color: var(--color-text-1);
+}
+.portal-proc__builder-addons {
+  display: flex;
+  flex-direction: column;
+  gap: 0.4rem;
+  font-size: 0.8125rem;
+  color: var(--color-text-2);
+}
+.portal-proc__builder-addons label {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+.portal-proc__builder-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 0.6rem;
+  margin-top: 0.5rem;
+}
+.portal-proc__quote-head {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  border-bottom: 1px solid var(--color-border, #eae8e3);
+  padding-bottom: 0.5rem;
+}
+.portal-proc__quote-number {
+  font-weight: 650;
+  color: var(--color-text-1);
+}
+.portal-proc__quote-valid {
+  font-size: 0.75rem;
+  color: var(--color-text-5);
+}
+.portal-proc__quote-lines {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+.portal-proc__quote-lines li {
+  display: flex;
+  justify-content: space-between;
+  padding: 0.4rem 0;
+  font-size: 0.8125rem;
+  color: var(--color-text-2);
+  border-bottom: 1px solid var(--color-border-light, #f0eee9);
+}
+.portal-proc__quote-lines li[data-kind="DISCOUNT"] {
+  color: var(--color-success, #0f7b6c);
+}
+.portal-proc__quote-total {
+  display: flex;
+  justify-content: space-between;
+  align-items: baseline;
+  padding: 0.6rem 0 0.2rem;
+  font-size: 0.9375rem;
+}
+.portal-proc__quote-total strong {
+  font-size: 1.25rem;
+  color: var(--color-text-1);
+}
+.portal-proc__quote-tcv {
+  font-size: 0.75rem;
+  color: var(--color-text-5);
+}
+
+/* ══ Quote builder — copied from the marketing prototype (tight density) ═════ */
+.portal-qb {
+  background: #ffffff;
+  border: 1px solid #e3e1dc;
+  border-radius: 14px;
+  box-shadow: inset 0 0 0 1px #eae8e3;
+  overflow: hidden;
+}
+.portal-qb__head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 18px 24px 14px;
+  border-bottom: 1px solid #f0eee9;
+  background: linear-gradient(
+    180deg,
+    rgba(35, 131, 226, 0.055) 0%,
+    transparent 100%
+  );
+}
+.portal-qb__title {
+  margin: 0;
+  font-size: 16px;
+  font-weight: 700;
+  color: #37352f;
+}
+.portal-qb__stepchip {
+  font-size: 11px;
+  font-weight: 700;
+  color: #9b9a97;
+  background: #f5f4f1;
+  padding: 3px 10px;
+  border-radius: 999px;
+}
+.portal-qb__progress {
+  display: flex;
+  gap: 6px;
+  padding: 12px 24px 0;
+}
+.portal-qb__progress span {
+  flex: 1;
+  height: 6px;
+  border-radius: 999px;
+  background: #f0eee9;
+  transition: background 0.3s;
+}
+.portal-qb__progress span[data-on] {
+  background: #2383e2;
+}
+.portal-qb__body {
+  padding: 20px 24px;
+  max-height: 56vh;
+  overflow-y: auto;
+}
+.portal-qb__intro {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-bottom: 18px;
+}
+.portal-qb__intro-icon {
+  width: 38px;
+  height: 38px;
+  border-radius: 10px;
+  background: #eaf2fb;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 18px;
+  flex-shrink: 0;
+}
+.portal-qb__intro-title {
+  font-size: 15px;
+  font-weight: 700;
+  color: #37352f;
+}
+.portal-qb__intro-sub {
+  font-size: 12.5px;
+  color: #9b9a97;
+  margin-top: 1px;
+}
+.portal-qb__field {
+  display: block;
+  margin-bottom: 18px;
+}
+.portal-qb__field-label {
+  display: block;
+  font-size: 12px;
+  font-weight: 600;
+  color: #787774;
+  margin-bottom: 6px;
+}
+.portal-qb__field input,
+.portal-qb__field select {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 9px 11px;
+  font-size: 13.5px;
+  border-radius: 8px;
+  border: 1px solid #e3e1dc;
+  font-family: inherit;
+  outline: none;
+  background: #fff;
+  color: #37352f;
+}
+.portal-qb__row {
+  display: flex;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.portal-qb__row .portal-qb__field {
+  flex: 1;
+  min-width: 190px;
+}
+.portal-qb__hint {
+  margin: 7px 0 0;
+  font-size: 11.5px;
+  color: #9b9a97;
+  line-height: 1.4;
+}
+.portal-qb__pills {
+  display: flex;
+  gap: 8px;
+  flex-wrap: wrap;
+}
+.portal-qb__pills button {
+  padding: 8px 16px;
+  font-size: 13px;
+  font-weight: 600;
+  border-radius: 8px;
+  border: 1px solid #e3e1dc;
+  background: #fff;
+  color: #37352f;
+  cursor: pointer;
+}
+.portal-qb__pills button[data-on] {
+  background: #2383e2;
+  border-color: #2383e2;
+  color: #fff;
+}
+.portal-qb__discount {
+  margin: 6px 0 0;
+  font-size: 11.5px;
+  color: #0f7b6c;
+}
+.portal-qb__opts {
+  display: flex;
+  gap: 10px;
+  flex-wrap: wrap;
+}
+.portal-qb__opt {
+  text-align: left;
+  flex: 1;
+  min-width: 150px;
+  padding: 12px 14px;
+  border-radius: 9px;
+  border: 1px solid #e3e1dc;
+  background: #fff;
+  cursor: pointer;
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+.portal-qb__opt[data-on] {
+  border-color: #2383e2;
+  background: #eaf2fb;
+}
+.portal-qb__opt-title {
+  font-size: 13px;
+  font-weight: 700;
+  color: #37352f;
+}
+.portal-qb__opt[data-on] .portal-qb__opt-title {
+  color: #1b6ec2;
+}
+.portal-qb__opt-sub {
+  font-size: 11.5px;
+  color: #9b9a97;
+  line-height: 1.4;
+}
+.portal-qb__addons {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.portal-qb__addon {
+  display: flex;
+  align-items: flex-start;
+  gap: 11px;
+  padding: 11px 13px;
+  border-radius: 9px;
+  border: 1px solid #e3e1dc;
+  background: #fff;
+  cursor: pointer;
+  text-align: left;
+}
+.portal-qb__addon[data-on] {
+  border-color: #2383e2;
+  background: #eaf2fb;
+}
+.portal-qb__addon-box {
+  width: 18px;
+  height: 18px;
+  flex-shrink: 0;
+  border-radius: 5px;
+  border: 1px solid #d3d1cb;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 12px;
+  color: transparent;
+  background: #fff;
+}
+.portal-qb__addon[data-on] .portal-qb__addon-box {
+  background: #2383e2;
+  border-color: #2383e2;
+  color: #fff;
+}
+.portal-qb__addon-title {
+  display: block;
+  font-size: 13px;
+  font-weight: 600;
+  color: #37352f;
+}
+.portal-qb__addon-sub {
+  display: block;
+  font-size: 11.5px;
+  color: #9b9a97;
+  margin-top: 1px;
+}
+.portal-qb__eula {
+  display: flex;
+  align-items: flex-start;
+  gap: 10px;
+  padding: 12px;
+  border-radius: 9px;
+  border: 1px solid #f0eee9;
+  background: #f5f4f1;
+  font-size: 12.5px;
+  color: #37352f;
+  line-height: 1.5;
+  cursor: pointer;
+}
+.portal-qb__foot {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 14px 24px;
+  border-top: 1px solid #f0eee9;
+  flex-wrap: wrap;
+}
+.portal-qb__running {
+  font-size: 11.5px;
+  color: #9b9a97;
+}
+.portal-qb__foot-btns {
+  display: flex;
+  gap: 10px;
+}
+/* Step 4 — the itemised quote paper */
+.portal-qb__papertray {
+  background: #f5f4f1;
+  padding: 18px;
+  max-height: 56vh;
+  overflow-y: auto;
+  margin: -20px -24px;
+}
+.portal-qb__paper {
+  background: #fff;
+  border: 1px solid #f0eee9;
+  border-radius: 12px;
+  overflow: hidden;
+  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
+}
+.portal-qb__paper-head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  padding: 20px 24px;
+  border-bottom: 1px solid #f0eee9;
+}
+.portal-qb__paper-brand {
+  font-size: 13.5px;
+  font-weight: 800;
+  color: #37352f;
+}
+.portal-qb__paper-eyebrow {
+  font-size: 11px;
+  color: #9b9a97;
+}
+.portal-qb__paper-meta {
+  text-align: right;
+}
+.portal-qb__quote-number {
+  font-size: 12.5px;
+  font-weight: 700;
+  color: #37352f;
+}
+.portal-qb__paper-meta div:not(.portal-qb__quote-number) {
+  font-size: 11px;
+  color: #9b9a97;
+}
+.portal-qb__paper-for {
+  padding: 18px 24px 0;
+}
+.portal-qb__paper-company {
+  font-size: 14px;
+  font-weight: 700;
+  color: #37352f;
+}
+.portal-qb__lines {
+  list-style: none;
+  margin: 0;
+  padding: 12px 24px 0;
+}
+.portal-qb__lines li {
+  display: flex;
+  justify-content: space-between;
+  gap: 14px;
+  padding: 10px 0;
+  border-bottom: 1px solid #f0eee9;
+  font-size: 13px;
+  font-weight: 600;
+  color: #37352f;
+}
+.portal-qb__lines li[data-kind="DISCOUNT"] {
+  color: #0f7b6c;
+}
+.portal-qb__lines li[data-kind="INCLUDED"] span:last-child {
+  color: #9b9a97;
+  font-weight: 500;
+}
+.portal-qb__total {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin: 16px 24px 24px;
+  padding: 16px 18px;
+  border-radius: 10px;
+  background: #eaf2fb;
+  border: 1px solid #b8d5f2;
+}
+.portal-qb__total-label {
+  font-size: 13px;
+  font-weight: 700;
+  color: #37352f;
+}
+.portal-qb__total-tcv {
+  font-size: 11.5px;
+  color: #787774;
+  margin-top: 2px;
+}
+.portal-qb__total-num {
+  text-align: right;
+}
+.portal-qb__total-num strong {
+  display: block;
+  font-size: 23px;
+  font-weight: 800;
+  color: #37352f;
+  line-height: 1;
+}
+.portal-qb__total-num span {
+  font-size: 11px;
+  color: #9b9a97;
+  margin-top: 3px;
+}
+
+/* ── Enterprise upsell text wrapper (Home on-ramp) ────────────────────────── */
+.portal-proc__upsell-text {
+  flex: 1 1 20rem;
+}
+
+/* ── Deal-status hero (Home, active deal) ─────────────────────────────────── */
+.portal-hero {
+  border: 1px solid var(--color-border);
+  border-radius: 12px;
+  padding: 1.1rem 1.25rem;
+  background:
+    radial-gradient(
+      120% 140% at 100% 0%,
+      rgba(124, 58, 237, 0.08),
+      transparent 55%
+    ),
+    var(--color-surface);
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+.portal-hero__top {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 1rem;
+  flex-wrap: wrap;
+}
+.portal-hero__eyebrow {
+  display: block;
+  font-size: 0.6875rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: var(--color-primary, #2383e2);
+}
+.portal-hero__company {
+  display: block;
+  font-size: 1.0625rem;
+  font-weight: 650;
+  color: var(--color-text-1);
+  margin-top: 0.2rem;
+}
+.portal-hero__chips {
+  display: flex;
+  gap: 0.4rem;
+  flex-wrap: wrap;
+}
+.portal-hero__chip {
+  font-size: 0.6875rem;
+  font-weight: 600;
+  color: var(--color-text-3);
+  background: var(--color-border-light);
+  border-radius: 999px;
+  padding: 0.2rem 0.6rem;
+}
+.portal-hero__stepper {
+  overflow-x: auto;
+}
+.portal-hero__next {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  flex-wrap: wrap;
+  padding-top: 0.85rem;
+  border-top: 1px solid var(--color-border-light);
+}
+.portal-hero__next-label {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.45rem;
+  font-size: 0.8125rem;
+  font-weight: 600;
+  color: var(--color-text-2);
+}
+.portal-hero__next-dot {
+  width: 0.5rem;
+  height: 0.5rem;
+  border-radius: 999px;
+  background: var(--color-primary, #2383e2);
+  box-shadow: 0 0 0 3px rgba(35, 131, 226, 0.18);
+}
+
+/* ── Full-screen takeover modal (procurement flow) ────────────────────────── */
+.portal-procmodal {
+  position: fixed;
+  inset: 0;
+  z-index: 1000;
+  display: flex;
+  align-items: flex-start;
+  justify-content: center;
+  padding: clamp(0.5rem, 4vh, 3rem) 1rem;
+  overflow-y: auto;
+  background: rgba(15, 23, 42, 0.55);
+  backdrop-filter: blur(6px) saturate(160%);
+  -webkit-backdrop-filter: blur(6px) saturate(160%);
+  animation: portal-procmodal-fade 0.15s ease-out;
+}
+@keyframes portal-procmodal-fade {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+.portal-procmodal__panel {
+  position: relative;
+  width: 100%;
+  max-width: 62rem;
+  background: var(--color-surface);
+  border: 1px solid var(--color-border);
+  border-radius: 14px;
+  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.28);
+  padding: 1.5rem 1.5rem 1.75rem;
+}
+.portal-procmodal__close {
+  position: absolute;
+  top: 0.85rem;
+  right: 0.85rem;
+  border: none;
+  background: var(--color-border-light);
+  color: var(--color-text-3);
+  width: 1.9rem;
+  height: 1.9rem;
+  border-radius: 8px;
+  font-size: 0.85rem;
+  cursor: pointer;
+}
+.portal-procmodal__close:hover {
+  background: var(--color-border);
+  color: var(--color-text-1);
+}
+.portal-procmodal__header {
+  margin-bottom: 1.25rem;
+  padding-right: 2.5rem;
+}
+.portal-procmodal__title {
+  margin: 0;
+  font-size: 1.35rem;
+  font-weight: 700;
+  color: var(--color-text-1);
+}
+.portal-procmodal__sub {
+  margin: 0.3rem 0 0;
+  font-size: 0.875rem;
+  color: var(--color-text-3);
+}
+.portal-procmodal__body {
+  display: flex;
+  flex-direction: column;
+  gap: 1.25rem;
+}
+
+.portal-proc__modal-stepper {
+  overflow-x: auto;
+}
+.portal-proc__payment-actions {
+  display: flex;
+  gap: 0.6rem;
+  flex-wrap: wrap;
+  margin-top: 1rem;
+}
+.portal-proc__license {
+  margin-top: 1.25rem;
+  padding: 1rem;
+  border: 1px solid var(--color-border, rgba(0, 0, 0, 0.1));
+  border-radius: 0.6rem;
+  background: var(--color-surface-2, rgba(0, 0, 0, 0.02));
+}
+.portal-proc__license-label {
+  display: block;
+  font-size: 0.75rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.03em;
+  color: var(--color-text-2);
+}
+.portal-proc__license-key {
+  display: block;
+  margin-top: 0.4rem;
+  padding: 0.55rem 0.7rem;
+  border-radius: 0.4rem;
+  background: var(--color-surface-3, rgba(0, 0, 0, 0.05));
+  font-family: var(--font-mono, monospace);
+  font-size: 0.85rem;
+  word-break: break-all;
+  color: var(--color-text-1);
+}
+.portal-proc__license-hint {
+  margin: 0.6rem 0 0;
+  font-size: 0.75rem;
+  color: var(--color-text-3, var(--color-text-2));
+}
+.portal-proc__milestone-for {
+  margin: 0.15rem 0 0;
+  font-size: 0.8125rem;
+  font-weight: 600;
+  color: var(--color-text-2);
+}
+.portal-proc__milestone-lines {
+  margin: 0.85rem 0 0.5rem;
+}
+.portal-proc__milestone-totals {
+  display: flex;
+  align-items: baseline;
+  gap: 1rem;
+  flex-wrap: wrap;
+  margin: 0.75rem 0 0.25rem;
+}
+.portal-proc__milestone-annual {
+  font-size: 1.75rem;
+  font-weight: 700;
+  color: var(--color-text-1);
+}
+.portal-proc__milestone-annual small {
+  font-size: 0.8125rem;
+  font-weight: 500;
+  color: var(--color-text-4);
+}
+.portal-proc__milestone-tcv {
+  font-size: 0.8125rem;
+  color: var(--color-text-3);
+}
+
+/* Hero next-step action row (primary CTA + optional extend-trial). */
+.portal-hero__next-actions {
+  display: flex;
+  gap: 0.5rem;
+  flex-wrap: wrap;
+}
+
+/* Hero quick-action chips (clickable pills next to the company name). */
+.portal-hero__chip--action {
+  border: 1px solid var(--color-border);
+  cursor: pointer;
+  transition:
+    background 0.12s,
+    box-shadow 0.12s,
+    transform 0.12s;
+}
+.portal-hero__chip--action:hover {
+  background: var(--color-surface);
+  box-shadow: 0 2px 5px rgba(15, 23, 42, 0.1);
+  transform: translateY(-1px);
+}
+
+/* Hero rollout checklist (trial): the "do this now" setup steps. */
+.portal-hero__checklist {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  border-top: 1px solid var(--color-border-light);
+}
+.portal-hero__checklist li {
+  border-bottom: 1px solid var(--color-border-light);
+}
+.portal-hero__checklist button {
+  display: flex;
+  align-items: center;
+  gap: 0.85rem;
+  width: 100%;
+  padding: 0.7rem 0.25rem;
+  background: none;
+  border: none;
+  cursor: pointer;
+  text-align: left;
+}
+.portal-hero__checklist button:hover {
+  background: var(--color-bg-hover, var(--color-border-light));
+}
+.portal-hero__check-dot {
+  width: 0.5rem;
+  height: 0.5rem;
+  border-radius: 999px;
+  background: var(--color-border);
+  flex-shrink: 0;
+}
+.portal-hero__check-text {
+  flex: 1;
+  min-width: 0;
+}
+.portal-hero__check-title {
+  display: block;
+  font-size: 0.85rem;
+  font-weight: 600;
+  color: var(--color-text-1);
+}
+.portal-hero__check-sub {
+  display: block;
+  font-size: 0.75rem;
+  color: var(--color-text-4);
+  margin-top: 0.05rem;
+}
+.portal-hero__check-pill {
+  font-size: 0.6875rem;
+  font-weight: 600;
+  color: var(--color-text-5);
+  background: var(--color-border-light);
+  border-radius: 999px;
+  padding: 0.15rem 0.55rem;
+  flex-shrink: 0;
+}
+
+/* ── Side dialogs (Key documents / Schedule a call / Trial) ───────────────── */
+.portal-sidemodal {
+  position: fixed;
+  inset: 0;
+  z-index: 1100;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 1rem;
+  overflow-y: auto;
+  background: rgba(15, 23, 42, 0.55);
+  backdrop-filter: blur(4px);
+  -webkit-backdrop-filter: blur(4px);
+  animation: portal-procmodal-fade 0.15s ease-out;
+  /* Portaled to , outside .portal-scope, so set the portal UI font explicitly. */
+  font-family: var(--font-sans);
+}
+.portal-sidemodal__panel {
+  position: relative;
+  width: 100%;
+  max-width: 30rem;
+  background: var(--color-surface);
+  border: 1px solid var(--color-border);
+  border-radius: 14px;
+  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.28);
+  padding: 1.35rem 1.4rem 1.4rem;
+  max-height: 86vh;
+  overflow-y: auto;
+}
+/* Wide enough for Calendly's two-pane layout (its single-column layout below ~680px inner width is
+   tall and scrolls); paired with the embed's taller fixed height so the time view needs no scroll. */
+.portal-sidemodal__panel--wide {
+  max-width: 52rem;
+}
+.portal-sidemodal__header {
+  margin-bottom: 1rem;
+  padding-right: 2rem;
+}
+.portal-sidemodal__title {
+  margin: 0;
+  font-size: 1.05rem;
+  font-weight: 700;
+  color: var(--color-text-1);
+}
+.portal-sidemodal__sub {
+  margin: 0.25rem 0 0;
+  font-size: 0.8125rem;
+  color: var(--color-text-4);
+  line-height: 1.5;
+}
+.portal-sidemodal__text {
+  margin: 0;
+  font-size: 0.8125rem;
+  color: var(--color-text-3);
+  line-height: 1.55;
+}
+.portal-sidemodal__footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  margin-top: 1.1rem;
+  padding-top: 0.9rem;
+  border-top: 1px solid var(--color-border-light);
+}
+.portal-sidemodal__ghost {
+  border: none;
+  background: none;
+  font-size: 0.8125rem;
+  color: var(--color-text-4);
+  cursor: pointer;
+}
+.portal-sidemodal__ghost:hover:not(:disabled) {
+  color: var(--color-text-2);
+}
+
+/* Key documents ledger. */
+.portal-docs__group + .portal-docs__group {
+  margin-top: 1rem;
+}
+.portal-docs__group-title {
+  font-size: 0.6875rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: var(--color-text-5);
+  margin-bottom: 0.4rem;
+}
+.portal-docs__list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+.portal-docs__row {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  padding: 0.55rem 0;
+  border-top: 1px solid var(--color-border-light);
+}
+.portal-docs__row-text {
+  flex: 1;
+  min-width: 0;
+}
+.portal-docs__row-name {
+  display: block;
+  font-size: 0.8125rem;
+  font-weight: 600;
+  color: var(--color-text-1);
+}
+.portal-docs__row-sub {
+  display: block;
+  font-size: 0.72rem;
+  color: var(--color-text-4);
+  margin-top: 0.05rem;
+}
+.portal-docs__row-action {
+  font-size: 0.6875rem;
+  font-weight: 600;
+  border-radius: 999px;
+  padding: 0.2rem 0.6rem;
+  flex-shrink: 0;
+  color: var(--color-text-3);
+  background: var(--color-border-light);
+}
+.portal-docs__row-action[data-status="action"] {
+  color: var(--color-primary, #2383e2);
+  background: var(--color-primary-light, #eaf2fb);
+}
+.portal-docs__row-action[data-status="request"] {
+  color: var(--color-text-5);
+}
+
+/* Calendly scheduler embed (Schedule a call). The widget is always light (Calendly renders inputs on
+   white), so give it a white surface — it reads as a clean card even inside the dark-mode modal. */
+.portal-calendly {
+  border-radius: 10px;
+  overflow: hidden;
+  background: #ffffff;
+}
+
+/* ── Agreement (security) step ────────────────────────────────────────────── */
+.portal-agreement__doc {
+  margin: 1rem 0;
+  max-height: 22rem;
+  overflow-y: auto;
+  padding: 1rem 1.1rem;
+  border: 1px solid var(--color-border);
+  border-radius: 10px;
+  background: var(--color-bg-subtle, var(--color-bg));
+  font-size: 0.8125rem;
+  line-height: 1.55;
+  color: var(--color-text-3);
+}
+.portal-agreement__doc h4 {
+  margin: 1rem 0 0.35rem;
+  font-size: 0.8125rem;
+  font-weight: 650;
+  color: var(--color-text-1);
+}
+.portal-agreement__doc h4:first-child {
+  margin-top: 0;
+}
+.portal-agreement__doc p {
+  margin: 0 0 0.5rem;
+}
+.portal-agreement__doc strong {
+  color: var(--color-text-1);
+}
+.portal-agreement__accept {
+  margin-top: 0.25rem;
+}
+.portal-agreement__lines {
+  margin: 0.4rem 0 0.6rem;
+}
+.portal-proc__reset {
+  display: flex;
+  justify-content: center;
+  padding-top: 0.5rem;
+}
+.portal-proc__reset button {
+  border: none;
+  background: none;
+  font-size: 0.75rem;
+  color: var(--color-text-5);
+  cursor: pointer;
+  text-decoration: underline;
+}
+.portal-proc__reset button:hover:not(:disabled) {
+  color: var(--color-text-3);
+}
+.portal-proc__reset button:disabled {
+  opacity: 0.5;
+  cursor: default;
+}
diff --git a/frontend/editor/src/portal/views/Procurement.tsx b/frontend/editor/src/portal/views/Procurement.tsx
index f4fa25178a..1f6e2329a9 100644
--- a/frontend/editor/src/portal/views/Procurement.tsx
+++ b/frontend/editor/src/portal/views/Procurement.tsx
@@ -1,111 +1,15 @@
-import { useEffect, useState } from "react";
-import { useTranslation } from "react-i18next";
-import { Card, Skeleton, StatusBadge } from "@app/ui";
-import { useTier } from "@portal/contexts/TierContext";
-import { useAsync } from "@portal/hooks/useAsync";
-import {
-  advanceStage,
-  fetchProcurement,
-  type DealStage,
-  type LedgerDoc,
-  type ProcurementResponse,
-} from "@portal/api/procurement";
-import { DealJourney } from "@portal/components/procurement/DealJourney";
-import { DocumentLedger } from "@portal/components/procurement/DocumentLedger";
-import { ActionModal } from "@portal/components/procurement/ActionModal";
-import { LockedState } from "@portal/components/procurement/LockedState";
+import { ProcurementHome } from "@portal/components/procurement/ProcurementHome";
 import "@portal/views/Procurement.css";
 
 /**
- * Procurement: the enterprise commercial journey (trial to live) plus the
- * document ledger. Enterprise-only: free/pro buyers see a locked upgrade state.
+ * /procurement — procurement is no longer a nav tab; it lives on Home as the deal-status hero.
+ * This route is kept for deep links (and the Usage "Build your quote" CTA): it renders the same
+ * surface, opening the takeover modal once a deal is underway.
  */
 export function Procurement() {
-  const { t } = useTranslation();
-  const { tier } = useTier();
-  const [activeDoc, setActiveDoc] = useState(null);
-  const [advancing, setAdvancing] = useState(false);
-
-  const state = useAsync(
-    () => fetchProcurement(tier),
-    [tier],
-  );
-
-  // Write actions return the new canonical state; we hold it here so the
-  // journey reflects every action immediately. Cleared when the tier (and so
-  // the deal) changes, falling back to whatever the GET loaded.
-  const [applied, setApplied] = useState(null);
-  useEffect(() => setApplied(null), [tier]);
-  const data = applied ?? (state.loading ? null : state.data);
-
-  async function onAdvance(stage: DealStage) {
-    setAdvancing(true);
-    try {
-      setApplied(await advanceStage(stage));
-    } finally {
-      setAdvancing(false);
-    }
-  }
-
   return (
     
    
-      
    
-        
    
-          
    
-            {t("portal.procurement.title")}
-          
    
-          
    
-            {t("portal.procurement.subtitle")}
-          
    
-        
    
-        
-          {t("portal.procurement.enterpriseBadge")}
-        
-      
    
-
-      {state.loading && (
-        
-          
-          
-        
-      )}
-
-      {data && !data.unlocked && (
-         {
-            // TODO(backend): POST /v1/procurement/sales-contact, for now this
-            // is the sidebar's upgrade path; hand off to the account team.
-          }}
-        />
-      )}
-
-      {data && data.unlocked && data.deal && (
-        <>
-          
-          
-        
-      )}
-
-       setActiveDoc(null)}
-        onDone={(next) => {
-          setApplied(next);
-          setActiveDoc(null);
-        }}
-      />
+      
     
    
   );
 }
diff --git a/frontend/editor/src/portal/views/Sources.css b/frontend/editor/src/portal/views/Sources.css
index d265a17135..d8cc6897af 100644
--- a/frontend/editor/src/portal/views/Sources.css
+++ b/frontend/editor/src/portal/views/Sources.css
@@ -74,23 +74,23 @@
   background: var(--color-bg-subtle);
   color: var(--color-text-3);
 }
-.portal-sources__type-dot--blue {
+.portal-sources__type-dot--default {
   background: var(--color-blue-light);
   color: var(--color-blue);
 }
-.portal-sources__type-dot--purple {
+.portal-sources__type-dot--premium {
   background: var(--color-purple-light);
   color: var(--color-purple);
 }
-.portal-sources__type-dot--green {
+.portal-sources__type-dot--success {
   background: var(--color-green-light);
   color: var(--color-green-dark);
 }
-.portal-sources__type-dot--amber {
+.portal-sources__type-dot--warning {
   background: var(--color-amber-light);
   color: var(--color-amber-dark);
 }
-.portal-sources__type-dot--red {
+.portal-sources__type-dot--danger {
   background: var(--color-red-light);
   color: var(--color-red);
 }
diff --git a/frontend/editor/src/portal/views/Sources.test.tsx b/frontend/editor/src/portal/views/Sources.test.tsx
index a68399d588..7226c2e017 100644
--- a/frontend/editor/src/portal/views/Sources.test.tsx
+++ b/frontend/editor/src/portal/views/Sources.test.tsx
@@ -1,7 +1,18 @@
 import { beforeEach, describe, expect, it, vi } from "vitest";
-import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import {
+  fireEvent,
+  render as baseRender,
+  screen,
+  waitFor,
+} from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
 import { MemoryRouter } from "react-router-dom";
 import { HttpError } from "@portal/api/http";
+
+const render = (
+  ui: Parameters[0],
+  options?: Parameters[1],
+) => baseRender(ui, { wrapper: MantineProvider, ...options });
 import type { SourcesResponse } from "@portal/api/sources";
 import { Sources } from "@portal/views/Sources";
 
diff --git a/frontend/editor/src/portal/views/Sources.tsx b/frontend/editor/src/portal/views/Sources.tsx
index b44eacb2ec..56ec5b4459 100644
--- a/frontend/editor/src/portal/views/Sources.tsx
+++ b/frontend/editor/src/portal/views/Sources.tsx
@@ -1,7 +1,7 @@
-import { useCallback, useState } from "react";
+import { useCallback, useEffect, useState } from "react";
+import { useSearchParams } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import { Banner, Button, EmptyState, Modal, Skeleton } from "@app/ui";
-import { useView } from "@portal/contexts/ViewContext";
 import { useAsync, useSectionFlags } from "@portal/hooks/useAsync";
 import { errorMessage } from "@portal/api/http";
 import {
@@ -14,7 +14,7 @@ import {
   type SourcesResponse,
   type SourceView,
 } from "@portal/api/sources";
-import { AgentBuilderIcon } from "@portal/components/icons";
+import { AgentBuilderAction } from "@portal/components/sources/AgentBuilderAction";
 import { KpiStrip } from "@portal/components/sources/KpiStrip";
 import { SourcesTable } from "@portal/components/sources/SourcesTable";
 import { SourceDetailCard } from "@portal/components/sources/SourceDetailCard";
@@ -23,7 +23,7 @@ import "@portal/views/Sources.css";
 
 export function Sources() {
   const { t } = useTranslation();
-  const { setActiveView } = useView();
+  const [searchParams, setSearchParams] = useSearchParams();
   // Refetch after every mutation by bumping this counter, so the table reflects
   // the in-memory store the handlers maintain (mirrors the Policies view).
   const [version, setVersion] = useState(0);
@@ -64,6 +64,17 @@ export function Sources() {
     setWizardOpen(true);
   }
 
+  // Arriving with ?new (e.g. from the pipeline builder's "connect a source" link) opens the
+  // create wizard straight away, then strips the flag so a refresh doesn't reopen it.
+  useEffect(() => {
+    if (searchParams.get("new") === null) return;
+    setEditingSource(null);
+    setWizardOpen(true);
+    const next = new URLSearchParams(searchParams);
+    next.delete("new");
+    setSearchParams(next, { replace: true });
+  }, [searchParams, setSearchParams]);
+
   // Editing needs the raw source (config options), which the overview rows don't
   // carry, so fetch it before opening the wizard prefilled.
   async function openEdit(source: SourceView) {
@@ -126,14 +137,8 @@ export function Sources() {
           
    {t("portal.sources.subtitle")}
    
         
         
    
-          
-          
         
    
@@ -200,7 +205,7 @@ export function Sources() {
         footer={
           
    
             
             
+              onReauth ? (
+                
+              ) : undefined
             }
           >
             {t(
@@ -219,7 +213,7 @@ export function Usage() {
           
         )}
 
-        {isLinked && error && (
+        {error && (
           
         )}
 
-        {isLinked && portal.error && (
+        {portal.error && (
           
         )}
 
-        {isLinked && wallet && wallet.status === "free" && (
+        {wallet && wallet.status === "free" && (
           
         )}
 
-        {isLinked && wallet && wallet.status === "subscribed" && (
+        {wallet && wallet.status === "subscribed" && (
           
         
diff --git a/frontend/editor/src/portal/vite-env.d.ts b/frontend/editor/src/portal/vite-env.d.ts
index 07664b3f5f..91acc858f2 100644
--- a/frontend/editor/src/portal/vite-env.d.ts
+++ b/frontend/editor/src/portal/vite-env.d.ts
@@ -1,10 +1,10 @@
 /// 
 
 interface ImportMetaEnv {
-  /** Hosted SaaS Supabase project URL — in-app account-link login. Empty → link UI shows a configure state. */
-  readonly VITE_SAAS_SUPABASE_URL: string;
-  /** Hosted SaaS Supabase anon/publishable key (public). */
-  readonly VITE_SAAS_SUPABASE_ANON_KEY: string;
+  /** Stirling Supabase project URL — in-app account-link login (same project every flavor uses). Empty → link UI shows a configure state. */
+  readonly VITE_SUPABASE_URL: string;
+  /** Stirling Supabase publishable/anon key (public). */
+  readonly VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY: string;
   /** Hosted SaaS Java backend base URL — attended portal→SaaS reads (wallet, invoices, …) via apiClient.saas with the admin's JWT. */
   readonly VITE_SAAS_API_URL: string;
   /** Stripe publishable key (pk_live_… / pk_test_…) used by embedded Checkout. */
diff --git a/frontend/editor/src/proprietary/auth/ui/EmailPasswordForm.tsx b/frontend/editor/src/proprietary/auth/ui/EmailPasswordForm.tsx
index 7fa97ecc09..08236c12c4 100644
--- a/frontend/editor/src/proprietary/auth/ui/EmailPasswordForm.tsx
+++ b/frontend/editor/src/proprietary/auth/ui/EmailPasswordForm.tsx
@@ -1,6 +1,7 @@
 import { useTranslation } from "react-i18next";
+import { Button } from "@app/ui/Button";
 import "@app/auth/ui/auth.css";
-import { TextInput, PasswordInput, Button } from "@mantine/core";
+import { TextInput, PasswordInput } from "@mantine/core";
 
 // Force light mode styles for auth inputs
 const authInputStyles = {
@@ -128,18 +129,11 @@ export default function EmailPasswordForm({
           (showPasswordField && !password) ||
           (requiresMfa && !mfaCode.trim())
         }
-        className="auth-button"
         fullWidth
         loading={isSubmitting}
-        styles={{
-          // Own the brand colour inline so the host app's Mantine primaryColor
-          // can't win over .auth-button (editor vs portal Mantine themes
-          // differ). The fallback keeps it red even if auth-theme.css is absent.
-          root: {
-            backgroundColor: "var(--auth-button-bg-light-only, #af3434)",
-            color: "var(--auth-button-text-light-only, #ffffff)",
-          },
-        }}
+        // Stirling-red brand CTA; the brand accent sets the colour inline so the
+        // host app's Mantine primaryColor can't win (editor vs portal differ).
+        accent="brand"
       >
         {submitButtonText}
       
diff --git a/frontend/editor/src/proprietary/auth/ui/LoginRightCarousel.tsx b/frontend/editor/src/proprietary/auth/ui/LoginRightCarousel.tsx
index 7a2d76d129..f6ad17ec7e 100644
--- a/frontend/editor/src/proprietary/auth/ui/LoginRightCarousel.tsx
+++ b/frontend/editor/src/proprietary/auth/ui/LoginRightCarousel.tsx
@@ -1,4 +1,5 @@
 import { memo, useEffect, useMemo, useRef, useState } from "react";
+import { Button } from "@app/ui/Button";
 import bgDefault from "@app/assets/login/LoginBackgroundPanel.png";
 
 export type ImageSlide = {
@@ -208,13 +209,14 @@ function LoginRightCarousel({
         }}
       >
         {Array.from({ length: totalSlides }).map((_, i) => (
-          
+            
           
    
         ))}
       
     );
   }
-
-  if (layout === "fullwidth") {
-    // Mirrors the SaaS editor login: rounded pill buttons stacked vertically,
-    // each with the provider's icon + "Sign in with X" label.
-    return (
-      
    
-        {providers.map((p) => (
-          
-        ))}
-      
    
-    );
-  }
-
   if (layout === "grid") {
     return (
       
    
@@ -167,24 +133,55 @@ export default function OAuthButtons({
             key={p.id}
             title={`${t("login.signInWith", "Sign in with")} ${p.label}`}
           >
-            
+            
           
    
         ))}
       
     );
   }
+  if (layout === "fullwidth") {
+    // Mirrors the SaaS editor login: rounded pill buttons stacked vertically,
+    // each with the provider's icon + "Sign in with X" label.
+    return (
+      
    
+        {providers.map((p) => (
+           onProviderClick(p.id)}
+            disabled={isSubmitting}
+            className="oauth-button-fullwidth"
+            title={p.label}
+            aria-label={ctaPrefix ? `${ctaPrefix} ${p.label}` : p.label}
+          >
+            
+              {p.label}
+              
+                {ctaPrefix ? `${ctaPrefix} ${p.label}` : p.label}
+              
+            
+          
+        ))}
+      
    
+    );
+  }
 
   return (
     
    
-          
+          
         
    
       ))}
     
diff --git a/frontend/editor/src/proprietary/auth/ui/SpringLoginForm.tsx b/frontend/editor/src/proprietary/auth/ui/SpringLoginForm.tsx
index f6c616fd77..ca8deb3c32 100644
--- a/frontend/editor/src/proprietary/auth/ui/SpringLoginForm.tsx
+++ b/frontend/editor/src/proprietary/auth/ui/SpringLoginForm.tsx
@@ -102,11 +102,10 @@ export default function SpringLoginForm({
         
       )}
 
diff --git a/frontend/editor/src/proprietary/auth/ui/auth-theme.css b/frontend/editor/src/proprietary/auth/ui/auth-theme.css
index 79c7ec6acd..f62691f518 100644
--- a/frontend/editor/src/proprietary/auth/ui/auth-theme.css
+++ b/frontend/editor/src/proprietary/auth/ui/auth-theme.css
@@ -39,8 +39,8 @@
   --auth-magic-button-text-light-only: var(--text-primary);
   --auth-text-primary-light-only: var(--text-primary);
   --auth-text-secondary-light-only: var(--text-secondary);
-  --text-divider-rule-rgb-light: 58, 64, 71;
-  --text-divider-label-rgb-light: 107, 114, 128;
+  --text-divider-rule-rgb-light: 28, 35, 64;
+  --text-divider-label-rgb-light: 91, 98, 128;
   --tool-subcategory-rule-color-light: var(--border-default);
   --tool-subcategory-text-color-light: var(--text-secondary);
 }
diff --git a/frontend/editor/src/proprietary/auth/ui/auth.css b/frontend/editor/src/proprietary/auth/ui/auth.css
index 3fce26f7ce..249d6cdda5 100644
--- a/frontend/editor/src/proprietary/auth/ui/auth.css
+++ b/frontend/editor/src/proprietary/auth/ui/auth.css
@@ -707,6 +707,61 @@
   min-height: 0;
 }
 
+.oauth-container-fullwidth {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+
+.oauth-button-fullwidth {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.75rem 1rem;
+  border: 1px solid #d1d5db;
+  border-radius: 100px;
+  background-color: #ffffff;
+  font-size: 1rem;
+  font-weight: 600;
+  color: #000000;
+  cursor: pointer;
+  gap: 0.5rem;
+  box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.04);
+  transition:
+    background-color 150ms ease,
+    box-shadow 150ms ease,
+    border-color 150ms ease;
+}
+
+.oauth-button-fullwidth:disabled {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
+.oauth-button-fullwidth:hover:not(:disabled) {
+  background-color: #fafafa;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+[data-mantine-color-scheme="dark"] .oauth-button-fullwidth {
+  background-color: var(--bg-surface);
+  color: var(--text-primary);
+  border-color: var(--border-default);
+  box-shadow: none;
+}
+
+[data-mantine-color-scheme="dark"]
+  .oauth-button-fullwidth:hover:not(:disabled) {
+  background-color: var(--bg-raised);
+  box-shadow: none;
+}
+
+/* ── Dark-mode icon inversion for monochrome OAuth logos ────────────── */
+[data-mantine-color-scheme="dark"] .oauth-icon--github {
+  filter: invert(1);
+}
+
 /* ── Icon+label group — keeps icons vertically aligned across buttons ── */
 .oauth-btn-group {
   display: inline-flex;
diff --git a/frontend/editor/src/proprietary/billing/SpendCapControl.tsx b/frontend/editor/src/proprietary/billing/SpendCapControl.tsx
index c5589133f3..d6c267a099 100644
--- a/frontend/editor/src/proprietary/billing/SpendCapControl.tsx
+++ b/frontend/editor/src/proprietary/billing/SpendCapControl.tsx
@@ -123,8 +123,9 @@ export function SpendCapControl({
     
    
       
    
         {presets.map((preset) => (
-          
+          
         ))}
 
         
 
-        
+        
 
         {onSave && (
           
    
             
       
         
      
           {toolSteps.map((step, i) => {
@@ -333,14 +336,16 @@ function ChatMessageBubble({
 
   const actions = (
     
      
-      
+      
       
         {formatRelativeTime(timestamp, t)}
       
@@ -551,9 +556,6 @@ export function ChatPanel({ onBack, backLabel }: ChatPanelProps) {
       
      
          handleSend()}
           disabled={!input.trim() || isLoading}
diff --git a/frontend/editor/src/proprietary/components/chat/ChatQuickActions.tsx b/frontend/editor/src/proprietary/components/chat/ChatQuickActions.tsx
index 1905433037..f650c953fd 100644
--- a/frontend/editor/src/proprietary/components/chat/ChatQuickActions.tsx
+++ b/frontend/editor/src/proprietary/components/chat/ChatQuickActions.tsx
@@ -1,6 +1,8 @@
 import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
-import { Box, Group, Stack, Text, UnstyledButton } from "@mantine/core";
+import { Box, Group, Stack, Text } from "@mantine/core";
+import { Button } from "@app/ui/Button";
+import { ActionIcon } from "@app/ui/ActionIcon";
 import CloseIcon from "@mui/icons-material/Close";
 import CompressIcon from "@mui/icons-material/Compress";
 import ContentCutIcon from "@mui/icons-material/ContentCut";
@@ -26,7 +28,10 @@ interface QuickAction {
 
 function QuickActionCard({ action }: { action: QuickAction }) {
   return (
-    
       
-    
+    
   );
 }
 
@@ -81,23 +86,27 @@ function WorkbenchFilePills({
           
             {stub.name}
           
-          
+          
         
       ))}
       {overflow > 0 && (
-        
           {moreLabel(overflow)}
-        
+        
       )}
     
      
   );
diff --git a/frontend/editor/src/proprietary/components/policies/Policies.css b/frontend/editor/src/proprietary/components/policies/Policies.css
index 7785702a98..37b92a5830 100644
--- a/frontend/editor/src/proprietary/components/policies/Policies.css
+++ b/frontend/editor/src/proprietary/components/policies/Policies.css
@@ -178,6 +178,11 @@
   color: var(--color-text-4);
   text-decoration: none;
   white-space: nowrap;
+  cursor: pointer;
+  transition: color var(--motion-fast);
+}
+.pol-row-upgrade:hover {
+  color: var(--color-text-1);
 }
 .pol-row-upgrade:hover {
   text-decoration: underline;
diff --git a/frontend/editor/src/proprietary/components/policies/PoliciesSidebar.tsx b/frontend/editor/src/proprietary/components/policies/PoliciesSidebar.tsx
index 2a3616bafd..15b494c3f6 100644
--- a/frontend/editor/src/proprietary/components/policies/PoliciesSidebar.tsx
+++ b/frontend/editor/src/proprietary/components/policies/PoliciesSidebar.tsx
@@ -33,6 +33,8 @@ import type {
 import type { WatchedFolder } from "@app/types/watchedFolders";
 import { POLICIES_ENABLED } from "@app/constants/featureFlags";
 import { Tooltip as AppTooltip } from "@app/components/shared/Tooltip";
+import { Button } from "@app/ui/Button";
+import { ActionIcon } from "@app/ui/ActionIcon";
 import { IconBadge } from "@app/ui/IconBadge";
 import {
   deriveRowStatus,
@@ -167,8 +169,9 @@ export function PoliciesSection({
           sidebarTooltip
           pinOnClick
         >
-          
+          
         
       
      
 
@@ -199,26 +202,34 @@ export function PoliciesSection({
                       {t(`policies.catalog.${cat.id}`, cat.label)}
                     
                     
-                            
+                          window.open(
+                            "https://stirling.com/contact",
+                            "_blank",
+                            "noopener,noreferrer",
+                          )
+                        }
                       >
                         {t(
                           "policies.sidebar.upgradeToEnterprise",
                           "Upgrade to enterprise",
                         )}
-                      
+                      
                     
                   
    
                 );
               }
               const status = deriveRowStatus(pol.policies[cat.id]);
               return (
-                
+                
               );
             })}
           
    
@@ -508,8 +519,10 @@ export function PoliciesCollapsedButton({
               arrow
               delay={300}
             >
-              
+              
             
           );
         })}
diff --git a/frontend/editor/src/proprietary/components/policies/PolicyDeleteConfirmModal.tsx b/frontend/editor/src/proprietary/components/policies/PolicyDeleteConfirmModal.tsx
index 0d40660d19..89d3dde57a 100644
--- a/frontend/editor/src/proprietary/components/policies/PolicyDeleteConfirmModal.tsx
+++ b/frontend/editor/src/proprietary/components/policies/PolicyDeleteConfirmModal.tsx
@@ -1,5 +1,6 @@
-import { Modal, Text, Button, Stack, Group } from "@mantine/core";
+import { Modal, Text, Stack, Group } from "@mantine/core";
 import { useTranslation } from "react-i18next";
+import { Button } from "@app/ui/Button";
 
 interface PolicyDeleteConfirmModalProps {
   opened: boolean;
@@ -35,10 +36,10 @@ export function PolicyDeleteConfirmModal({
           )}
         
         
-          
-          
         
diff --git a/frontend/editor/src/proprietary/components/policies/PolicyDetailPanel.tsx b/frontend/editor/src/proprietary/components/policies/PolicyDetailPanel.tsx
index 1193111c8a..4afcf5891c 100644
--- a/frontend/editor/src/proprietary/components/policies/PolicyDetailPanel.tsx
+++ b/frontend/editor/src/proprietary/components/policies/PolicyDetailPanel.tsx
@@ -84,15 +84,15 @@ function ActivityError({
       >
         {message}
       
-      
+      
     
   );
 }
@@ -221,7 +221,7 @@ export function PolicyDetailPanel({
                   trailing={
                     item.status === "flagged" && onRetry ? (
                       
           )}
-          
-          
         
    
diff --git a/frontend/editor/src/proprietary/components/policies/PolicyFieldRow.tsx b/frontend/editor/src/proprietary/components/policies/PolicyFieldRow.tsx
index 2559a0e522..1210b997ca 100644
--- a/frontend/editor/src/proprietary/components/policies/PolicyFieldRow.tsx
+++ b/frontend/editor/src/proprietary/components/policies/PolicyFieldRow.tsx
@@ -51,12 +51,7 @@ export function PolicyFieldRow({
         
         
    
           {(field.options ?? []).map((opt) => (
-             toggle(opt)}
-            >
+             toggle(opt)}>
               {t(`policies.fieldOption.${field.key}.${opt}`, opt)}
             
           ))}
@@ -81,7 +76,7 @@ export function PolicyFieldRow({
           label: t(`policies.fieldOption.${field.key}.${o}`, o),
         }))}
         value={typeof value === "string" ? value : ""}
-        onChange={(e) => onChange(e.target.value)}
+        onChange={(value) => onChange(value ?? "")}
         aria-label={fieldLabel}
       />
     ) : (
diff --git a/frontend/editor/src/proprietary/components/policies/PolicySetupWizard.tsx b/frontend/editor/src/proprietary/components/policies/PolicySetupWizard.tsx
index e63ee4e61f..d096b8327e 100644
--- a/frontend/editor/src/proprietary/components/policies/PolicySetupWizard.tsx
+++ b/frontend/editor/src/proprietary/components/policies/PolicySetupWizard.tsx
@@ -409,8 +409,8 @@ export function PolicySetupWizard({
                      {
-                        const mode = e.target.value as
+                      onChange={(value) => {
+                        const mode = (value ?? "new_file") as
                           | "new_file"
                           | "new_version";
                         setOutputMode(mode);
@@ -481,9 +481,12 @@ export function PolicySetupWizard({
                   
-          {placeholder && (
-            
-          )}
-          {options.map((opt) => (
-            
-          ))}
-        
-        
-          
-            
-          
-        
-      
-    );
-  },
-);
diff --git a/frontend/editor/src/proprietary/ui/Slider.tsx b/frontend/editor/src/proprietary/ui/Slider.tsx
deleted file mode 100644
index 3b540def06..0000000000
--- a/frontend/editor/src/proprietary/ui/Slider.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-import { forwardRef, type InputHTMLAttributes } from "react";
-import "@app/ui/Slider.css";
-
-export interface SliderProps extends Omit<
-  InputHTMLAttributes,
-  "type" | "value" | "onChange"
-> {
-  value: number;
-  min?: number;
-  max?: number;
-  step?: number;
-  onChange: (value: number) => void;
-  /** Optional formatter for the value pill (e.g. "0.85", "30 days"). */
-  formatValue?: (value: number) => string;
-  /** Show the right-aligned value badge. Defaults to true. */
-  showValue?: boolean;
-}
-
-export const Slider = forwardRef(function Slider(
-  {
-    value,
-    min = 0,
-    max = 1,
-    step = 0.01,
-    onChange,
-    formatValue,
-    showValue = true,
-    className,
-    ...rest
-  },
-  ref,
-) {
-  const pct = ((value - min) / (max - min)) * 100;
-  return (
-    
-       onChange(Number(e.target.value))}
-        className="sui-slider__input"
-        {...rest}
-      />
-      {showValue && (
-        
-          {formatValue ? formatValue(value) : value.toString()}
-        
-      )}
-    
-  );
-});
diff --git a/frontend/editor/src/prototypes/hooks/tools/pdfCommentAgent/pdfCommentAgentOperationConfig.ts b/frontend/editor/src/prototypes/hooks/tools/pdfCommentAgent/pdfCommentAgentOperationConfig.ts
index f9aec1718a..8994ee9df1 100644
--- a/frontend/editor/src/prototypes/hooks/tools/pdfCommentAgent/pdfCommentAgentOperationConfig.ts
+++ b/frontend/editor/src/prototypes/hooks/tools/pdfCommentAgent/pdfCommentAgentOperationConfig.ts
@@ -1,7 +1,6 @@
 import apiClient from "@app/services/apiClient";
 import {
-  ToolType,
-  CustomToolOperationConfig,
+  defineCustomTool,
   CustomProcessorResult,
 } from "@app/hooks/tools/shared/toolOperationTypes";
 import {
@@ -104,10 +103,10 @@ const processPdfCommentAgent = async (
   return { files: [resultFile] };
 };
 
-export const pdfCommentAgentOperationConfig = {
-  toolType: ToolType.custom,
-  operationType: "pdfCommentAgent",
-  endpoint: PDF_COMMENT_AGENT_ENDPOINT,
-  customProcessor: processPdfCommentAgent,
-  defaultParameters,
-} as const satisfies CustomToolOperationConfig;
+export const pdfCommentAgentOperationConfig =
+  defineCustomTool({
+    operationType: "pdfCommentAgent",
+    endpoint: PDF_COMMENT_AGENT_ENDPOINT,
+    customProcessor: processPdfCommentAgent,
+    defaultParameters,
+  });
diff --git a/frontend/editor/src/saas/auth/supabase.ts b/frontend/editor/src/saas/auth/supabase.ts
index ad32cfa58d..1ea68e077e 100644
--- a/frontend/editor/src/saas/auth/supabase.ts
+++ b/frontend/editor/src/saas/auth/supabase.ts
@@ -1,22 +1,10 @@
 import { createClient } from "@supabase/supabase-js";
 
-// Debug helper to log Supabase configuration
-const debugConfig = () => {
-  const url = import.meta.env.VITE_SUPABASE_URL;
-  const key = import.meta.env.VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY;
-
-  console.log("[Supabase Debug] Configuration:", {
-    url: url ? "✓ URL configured" : "✗ URL missing",
-    key: key ? "✓ Key configured" : "✗ Key missing",
-    urlValue: url || "undefined",
-    keyValue: key ? `${key.substring(0, 20)}...` : "undefined",
-  });
-
-  return { url, key };
+const config = {
+  url: import.meta.env.VITE_SUPABASE_URL,
+  key: import.meta.env.VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY,
 };
 
-const config = debugConfig();
-
 if (!config.url) {
   throw new Error("Missing VITE_SUPABASE_URL environment variable");
 }
diff --git a/frontend/editor/src/saas/components/SignupRequiredBootstrap.tsx b/frontend/editor/src/saas/components/SignupRequiredBootstrap.tsx
index 43e388587d..b9028ce22b 100644
--- a/frontend/editor/src/saas/components/SignupRequiredBootstrap.tsx
+++ b/frontend/editor/src/saas/components/SignupRequiredBootstrap.tsx
@@ -1,5 +1,6 @@
 import { useEffect, useState, useMemo } from "react";
-import { Modal, Stack, Button, Text } from "@mantine/core";
+import { Modal, Stack, Text } from "@mantine/core";
+import { Button } from "@app/ui/Button";
 import PersonAddIcon from "@mui/icons-material/PersonAdd";
 import { useTranslation } from "react-i18next";
 import { withBasePath } from "@app/constants/app";
@@ -112,7 +113,7 @@ export default function SignupRequiredBootstrap() {
             gap: "0.5rem",
           }}
         >
-          
           
    
         
    
-          
-          
+          
         
    
       
     
diff --git a/frontend/editor/src/saas/components/shared/AppConfigModal.tsx b/frontend/editor/src/saas/components/shared/AppConfigModal.tsx
index 0fa14721d7..b691244e68 100644
--- a/frontend/editor/src/saas/components/shared/AppConfigModal.tsx
+++ b/frontend/editor/src/saas/components/shared/AppConfigModal.tsx
@@ -1,5 +1,7 @@
 import React, { useCallback, useMemo, useState, useEffect } from "react";
-import { Modal, Button, Text, ActionIcon } from "@mantine/core";
+import { Modal, Text } from "@mantine/core";
+import { Button } from "@app/ui/Button";
+import { ActionIcon } from "@app/ui/ActionIcon";
 import { useMediaQuery } from "@mantine/hooks";
 import { useAuth } from "@app/auth/UseSession";
 import { isUserAnonymous } from "@app/auth/supabase";
@@ -253,9 +255,9 @@ const AppConfigModal: React.FC = ({ opened, onClose }) => {
                   ) : null}
                 
                 
                   
                 
@@ -276,11 +278,11 @@ const AppConfigModal: React.FC = ({ opened, onClose }) => {
         
    
           Are you sure you want to sign out?
           
    
-            
             
           
    
-          
+          
         
    
       
 
@@ -434,8 +434,8 @@ const Overview: React.FC = ({ onLogoutClick }) => {
                   },
                 )}
               
-              
+              
             
           
         ) : (
@@ -464,24 +464,21 @@ const Overview: React.FC = ({ onLogoutClick }) => {
               }}
             >
               
-                
-                  {(props) => (
-                    
-                  )}
-                
-                
+                
               
               
                 {t(
@@ -559,8 +556,8 @@ const Overview: React.FC = ({ onLogoutClick }) => {
                     key={provider.id}
                     content={`${t("config.account.upgrade.linkWith", "Link with")} ${provider.label}`}
                   >
-                    
+                    
                   
                 ))}
             
@@ -624,9 +621,9 @@ const Overview: React.FC = ({ onLogoutClick }) => {
                   )}
                   style={{ flex: 1 }}
                 />
-                
+                
               
             
           
@@ -644,13 +641,13 @@ const Overview: React.FC = ({ onLogoutClick }) => {
             borderTop: "1px solid var(--mantine-color-default-border)",
           }}
         >
-          
+          
         
       )}
 
@@ -693,11 +690,16 @@ const Overview: React.FC = ({ onLogoutClick }) => {
             mb="md"
           />
           
-            
-            
+            
           
         
       
diff --git a/frontend/editor/src/saas/components/shared/config/configSections/PasswordSecurity.tsx b/frontend/editor/src/saas/components/shared/config/configSections/PasswordSecurity.tsx
index 8010b5482a..d38e46e1a7 100644
--- a/frontend/editor/src/saas/components/shared/config/configSections/PasswordSecurity.tsx
+++ b/frontend/editor/src/saas/components/shared/config/configSections/PasswordSecurity.tsx
@@ -1,6 +1,5 @@
 import React, { useState } from "react";
 import {
-  Button,
   PasswordInput,
   Group,
   Alert,
@@ -8,6 +7,7 @@ import {
   Modal,
   Divider,
 } from "@mantine/core";
+import { Button } from "@app/ui/Button";
 import { useTranslation } from "react-i18next";
 import { useAuth } from "@app/auth/UseSession";
 import { supabase } from "@app/auth/supabase";
@@ -116,7 +116,7 @@ const PasswordSecurity: React.FC = () => {
             )}
           
    
         
-        
       
@@ -166,7 +166,7 @@ const PasswordSecurity: React.FC = () => {
             
               
         
       ) : (
         
-          
+            }
           >
-            
-            
-              {translate("mode.resume", "Resume placement")}
-            
-          
+            {translate("mode.resume", "Resume placement")}
+          
         
       )
     ) : null;
@@ -1217,7 +1200,7 @@ const SignSettings = ({
             onChange={(value) =>
               handleSignatureSourceChange(value as SignatureSource)
             }
-            data={sourceOptions}
+            options={sourceOptions}
           />
         )}
         {renderSignatureBuilder()}
@@ -1260,7 +1243,7 @@ const SignSettings = ({
       />
 
       {onSave && (
-        
       )}
diff --git a/frontend/editor/src/saas/routes/AuthCallback.tsx b/frontend/editor/src/saas/routes/AuthCallback.tsx
index 1701163f9d..ee16d8ce36 100644
--- a/frontend/editor/src/saas/routes/AuthCallback.tsx
+++ b/frontend/editor/src/saas/routes/AuthCallback.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { supabase } from "@app/auth/supabase";
-import { Button } from "@mantine/core";
+import { Button } from "@app/ui/Button";
 import { withBasePath } from "@app/constants/app";
 
 interface CallbackState {
@@ -206,8 +206,8 @@ export default function AuthCallback() {
               if (state.status === "error") {
                 return (
                   
diff --git a/frontend/editor/src/saas/routes/Login.tsx b/frontend/editor/src/saas/routes/Login.tsx
index 4395bef998..dcf7b454a2 100644
--- a/frontend/editor/src/saas/routes/Login.tsx
+++ b/frontend/editor/src/saas/routes/Login.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useMemo, useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { supabase, signInAnonymously } from "@app/auth/supabase";
+import { Button } from "@app/ui/Button";
 import { useAuth } from "@app/auth/UseSession";
 import { useTranslation } from "@app/hooks/useTranslation";
 import { useDocumentMeta } from "@app/hooks/useDocumentMeta";
@@ -299,8 +300,8 @@ export default function Login() {
 
         {/* Magic link button + its expandable form as one unit */}
         
    
-          
+          
 
           
    
-                    
                   
    
                 )}
               
    
@@ -370,8 +371,8 @@ export default function Login() {
       
 
       {/* Email & Password button */}
-      
+      
 
       {/* Email form — animated expand */}
       
    
-            
+            
           
    
         
       
 
       {/* Skip */}
       
    
-        
+        
       
    
 
       {/* Bottom */}
@@ -441,8 +442,8 @@ export default function Login() {
           paddingTop: "1rem",
         }}
       >
-        
+        
       
     
   );
diff --git a/frontend/editor/src/saas/routes/OAuthConsent.tsx b/frontend/editor/src/saas/routes/OAuthConsent.tsx
index e36f4d371b..d851a91a53 100644
--- a/frontend/editor/src/saas/routes/OAuthConsent.tsx
+++ b/frontend/editor/src/saas/routes/OAuthConsent.tsx
@@ -1,5 +1,6 @@
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";
+import { Button } from "@app/ui/Button";
 import { useAuth } from "@app/auth/UseSession";
 import { useTranslation } from "@app/hooks/useTranslation";
 import { useDocumentMeta } from "@app/hooks/useDocumentMeta";
@@ -236,13 +237,13 @@ export default function OAuthConsent() {
             "Sign in to your Stirling PDF account to continue connecting the app.",
           )}
         
    
-        
+        
       
     );
   }
@@ -358,8 +359,7 @@ export default function OAuthConsent() {
       
 
       
    
-        
-        
+        
       
    
 
       {displayName && (
diff --git a/frontend/editor/src/saas/routes/ResetPassword.tsx b/frontend/editor/src/saas/routes/ResetPassword.tsx
index f17e82bd68..b0a1273199 100644
--- a/frontend/editor/src/saas/routes/ResetPassword.tsx
+++ b/frontend/editor/src/saas/routes/ResetPassword.tsx
@@ -9,6 +9,7 @@ import NavigationLink from "@app/routes/login/NavigationLink";
 import { supabase } from "@app/auth/supabase";
 import { absoluteWithBasePath } from "@app/constants/app";
 import { useTranslation } from "@app/hooks/useTranslation";
+import { Button } from "@app/ui/Button";
 
 export default function ResetPassword() {
   const { t } = useTranslation();
@@ -233,7 +234,7 @@ export default function ResetPassword() {
               />
             
           
-          
            navigate("/login")}
             text={t("login.backToSignIn", "Back to sign in")}
diff --git a/frontend/editor/src/saas/routes/Signup.tsx b/frontend/editor/src/saas/routes/Signup.tsx
index 36d162a549..3836c60ac1 100644
--- a/frontend/editor/src/saas/routes/Signup.tsx
+++ b/frontend/editor/src/saas/routes/Signup.tsx
@@ -9,6 +9,7 @@ import AuthLayout from "@app/routes/authShared/AuthLayout";
 import "@app/auth/ui/auth.css";
 import "@app/routes/authShared/saas-auth.css";
 import { alert } from "@app/components/toast";
+import { Button } from "@app/ui/Button";
 
 // Import signup components
 import ErrorMessage from "@app/auth/ui/ErrorMessage";
@@ -209,8 +210,8 @@ export default function Signup() {
       
 
       {/* Email & Password button */}
-      
+      
 
       {/* Email form — animated expand */}
       
    
-        
+        
       
    
 
       {/* Bottom */}
@@ -276,8 +277,8 @@ export default function Signup() {
           paddingTop: "1rem",
         }}
       >
-        
+        
       
     
   );
diff --git a/frontend/editor/src/saas/routes/authShared/GuestSignInButton.tsx b/frontend/editor/src/saas/routes/authShared/GuestSignInButton.tsx
index 31bbc35ca0..273bb17dfd 100644
--- a/frontend/editor/src/saas/routes/authShared/GuestSignInButton.tsx
+++ b/frontend/editor/src/saas/routes/authShared/GuestSignInButton.tsx
@@ -1,4 +1,7 @@
 import React from "react";
+import { Button } from "@app/ui/Button";
+
+// TODO: add saas-auth.css to the same location as auth.css
 import "@app/auth/ui/auth.css";
 import "@app/routes/authShared/saas-auth.css";
 
@@ -14,13 +17,13 @@ export default function GuestSignInButton({
   disabled,
 }: GuestSignInButtonProps) {
   return (
-    
+    
   );
 }
diff --git a/frontend/editor/src/saas/routes/authShared/saas-auth.css b/frontend/editor/src/saas/routes/authShared/saas-auth.css
index 535d72d3dd..96d97f695c 100644
--- a/frontend/editor/src/saas/routes/authShared/saas-auth.css
+++ b/frontend/editor/src/saas/routes/authShared/saas-auth.css
@@ -129,6 +129,11 @@
   text-align: center;
 }
 
+/* ── Dark-mode icon inversion for monochrome OAuth logos ────────────── */
+[data-mantine-color-scheme="dark"] .oauth-icon--github {
+  filter: invert(1);
+}
+
 /* ── Icon helpers inside oauth-button-fullwidth ─────────────────────── */
 .auth-at-icon {
   font-size: 1.25rem;
diff --git a/frontend/editor/src/saas/routes/login/EmailPasswordForm.tsx b/frontend/editor/src/saas/routes/login/EmailPasswordForm.tsx
index ecc8cbd209..a7435eb43b 100644
--- a/frontend/editor/src/saas/routes/login/EmailPasswordForm.tsx
+++ b/frontend/editor/src/saas/routes/login/EmailPasswordForm.tsx
@@ -1,6 +1,7 @@
 import { useTranslation } from "react-i18next";
 import "@app/auth/ui/auth.css";
 import "@app/routes/authShared/saas-auth.css";
+import { Button } from "@app/ui/Button";
 
 interface EmailPasswordFormProps {
   email: string;
@@ -78,13 +79,14 @@ export default function EmailPasswordForm({
         )}
       
 
-      
+      
     
   );
 }
diff --git a/frontend/editor/src/saas/routes/login/MagicLinkForm.tsx b/frontend/editor/src/saas/routes/login/MagicLinkForm.tsx
index 9833928247..2a669595de 100644
--- a/frontend/editor/src/saas/routes/login/MagicLinkForm.tsx
+++ b/frontend/editor/src/saas/routes/login/MagicLinkForm.tsx
@@ -1,3 +1,4 @@
+import { Button } from "@app/ui/Button";
 import { useTranslation } from "@app/hooks/useTranslation";
 import "@app/auth/ui/auth.css";
 import "@app/routes/authShared/saas-auth.css";
@@ -24,7 +25,8 @@ export default function MagicLinkForm({
   if (!showMagicLink) {
     return (
       
    
-        
+        
       
    
     );
   }
@@ -47,13 +49,13 @@ export default function MagicLinkForm({
         onKeyPress={(e) => e.key === "Enter" && !isSubmitting && onSubmit()}
         className="auth-input"
       />
-      
+      
     
   );
 }
diff --git a/frontend/editor/src/saas/routes/login/OAuthButtons.tsx b/frontend/editor/src/saas/routes/login/OAuthButtons.tsx
index 21e76348f9..202a1c9d3c 100644
--- a/frontend/editor/src/saas/routes/login/OAuthButtons.tsx
+++ b/frontend/editor/src/saas/routes/login/OAuthButtons.tsx
@@ -1,6 +1,7 @@
 import { oauthProviders } from "@app/constants/authProviders";
 import { useTranslation } from "@app/hooks/useTranslation";
 import { Tooltip } from "@app/components/shared/Tooltip";
+import { Button } from "@app/ui/Button";
 import { oauthIconUrl } from "@app/auth/ui/oauthIcons";
 
 // Exports for compatibility with proprietary code
@@ -38,7 +39,8 @@ export default function OAuthButtons({
             content={`${t("login.signInWith", "Sign in with")} ${p.label}`}
             position="top"
           >
-            
+            
           
         ))}
       
@@ -65,7 +67,8 @@ export default function OAuthButtons({
             content={`${t("login.signInWith", "Sign in with")} ${p.label}`}
             position="top"
           >
-            
+            
           
         ))}
       
@@ -87,8 +90,9 @@ export default function OAuthButtons({
     return (
       
    
         {oauthProviders.map((p) => (
-          
+          
         ))}
       
    
     );
@@ -115,8 +119,9 @@ export default function OAuthButtons({
   return (
     
    
       {oauthProviders.map((p) => (
-        
+        
       ))}
     
    
   );
diff --git a/frontend/editor/src/saas/styles/saas-theme.css b/frontend/editor/src/saas/styles/saas-theme.css
index 3cbce19761..654fe5fe17 100644
--- a/frontend/editor/src/saas/styles/saas-theme.css
+++ b/frontend/editor/src/saas/styles/saas-theme.css
@@ -76,8 +76,6 @@
   --api-keys-card-shadow: rgba(0, 0, 0, 0.06);
   --api-keys-input-bg: #f8f8f8;
   --api-keys-input-border: #e0e0e0;
-  --api-keys-button-bg: #f5f5f5;
-  --api-keys-button-color: #333333;
 }
 
 [data-mantine-color-scheme="dark"] {
@@ -90,8 +88,8 @@
   --spdf-compare-added-badge-fg: var(--color-green-500);
   --spdf-compare-inline-removed-bg: rgba(255, 59, 48, 0.25);
   --spdf-compare-inline-added-bg: rgba(52, 199, 89, 0.25);
-  --compare-page-label-bg: #2a2f36;
-  --compare-page-label-fg: #d0d6dc;
+  --compare-page-label-bg: #0d1020;
+  --compare-page-label-fg: #c2c8e0;
 
   /* Orange scale (dark mode mirrors light values to match UI) */
   --color-orange-50: #fff4ed;
@@ -122,29 +120,27 @@
   --tool-subcategory-text-color-light: #9ca3af;
 
   /* API usage progress bar colors (dark mode) */
-  --usage-weekly-active: #60a5fa;
+  --usage-weekly-active: #4f8ef5;
   --usage-bought-active: #34d399;
-  --usage-total-used: #ffffff;
-  --usage-inactive: #43464b;
+  --usage-total-used: #e8eaf6;
+  --usage-inactive: #1c2340;
 
   /* API Keys section colors (dark mode) */
-  --api-keys-card-bg: #2a2f36;
-  --api-keys-card-border: #3a4047;
+  --api-keys-card-bg: #131729;
+  --api-keys-card-border: #1c2340;
   --api-keys-card-shadow: none;
-  --api-keys-input-bg: #1f2329;
-  --api-keys-input-border: #3a4047;
-  --api-keys-button-bg: #3a4047;
-  --api-keys-button-color: #d0d6dc;
+  --api-keys-input-bg: #0d1020;
+  --api-keys-input-border: #1c2340;
 
   --text-divider-rule-color: var(--tool-subcategory-rule-color);
   --text-divider-label-color: var(--text-muted);
 
   /* App Config Modal colors (dark mode) */
-  --modal-nav-bg: #1f2329;
-  --modal-nav-section-title: #9ca3af;
-  --modal-nav-item: #d0d6dc;
-  --modal-nav-item-active: #0a8bff;
-  --modal-nav-item-active-bg: rgba(10, 139, 255, 0.15);
-  --modal-content-bg: #2a2f36;
-  --modal-header-border: rgba(255, 255, 255, 0.08);
+  --modal-nav-bg: #0d1020;
+  --modal-nav-section-title: #5b6280;
+  --modal-nav-item: #c2c8e0;
+  --modal-nav-item-active: #4f8ef5;
+  --modal-nav-item-active-bg: rgba(79, 142, 245, 0.15);
+  --modal-content-bg: #131729;
+  --modal-header-border: rgba(255, 255, 255, 0.05);
 }
diff --git a/frontend/editor/src/saas/tsconfig.json b/frontend/editor/src/saas/tsconfig.json
index 08beefbb77..a887c3c5c5 100644
--- a/frontend/editor/src/saas/tsconfig.json
+++ b/frontend/editor/src/saas/tsconfig.json
@@ -8,11 +8,19 @@
         "../../src/proprietary/*",
         "../../src/core/*"
       ],
-      "@portal/*": ["../../src/portal/*"],
+      "@portal/*": ["../../src/portal-saas/*", "../../src/portal/*"],
+      "@portal-proprietary/*": ["../../src/portal/*"],
       "@cloud/*": ["../../src/cloud/*"],
       "@proprietary/*": ["../../src/proprietary/*"],
       "@core/*": ["../../src/core/*"]
     }
   },
-  "include": ["../global.d.ts", "../*.js", "../*.ts", "../*.tsx", "."]
+  "include": [
+    "../global.d.ts",
+    "../*.js",
+    "../*.ts",
+    "../*.tsx",
+    ".",
+    "../portal-saas"
+  ]
 }
diff --git a/frontend/editor/tailwind.config.js b/frontend/editor/tailwind.config.js
index b38eea76ee..37af74b68a 100644
--- a/frontend/editor/tailwind.config.js
+++ b/frontend/editor/tailwind.config.js
@@ -1,5 +1,5 @@
 /** @type {import('tailwindcss').Config} */
-module.exports = {
+export default {
   content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
   darkMode: ["class", '[data-mantine-color-scheme="dark"]'],
   theme: {
diff --git a/frontend/editor/tsconfig.portal.vite.json b/frontend/editor/tsconfig.portal.vite.json
index 8a63033eb6..924d616019 100644
--- a/frontend/editor/tsconfig.portal.vite.json
+++ b/frontend/editor/tsconfig.portal.vite.json
@@ -1,14 +1,9 @@
 {
   "extends": "./tsconfig.json",
-  "comment": "Path resolution for the portal's vitest project (referenced by vitest.config.ts). Broad include ('src', via the base) so vite-tsconfig-paths rewrites @app/* in every editor/src file the portal tests pull in (e.g. proprietary/ui), not just the portal layer. The portal's own typecheck uses src/portal/tsconfig.json.",
+  "comment": "Path resolution for the portal's vitest project (referenced by vitest.config.ts). Broad include ('src', via the base) so vite-tsconfig-paths rewrites @app/* in every editor/src file the portal tests pull in (e.g. core/ui), not just the portal layer. The portal's own typecheck uses src/portal/tsconfig.json.",
   "compilerOptions": {
     "paths": {
-      "@app/*": [
-        "./src/portal/*",
-        "./src/cloud/*",
-        "./src/proprietary/*",
-        "./src/core/*"
-      ],
+      "@app/*": ["./src/cloud/*", "./src/proprietary/*", "./src/core/*"],
       "@portal/*": ["./src/portal/*"],
       "@cloud/*": ["./src/cloud/*"],
       "@proprietary/*": ["./src/proprietary/*"],
diff --git a/frontend/editor/tsconfig.saas.vite.json b/frontend/editor/tsconfig.saas.vite.json
index c7d2c03eb2..f31279fac3 100644
--- a/frontend/editor/tsconfig.saas.vite.json
+++ b/frontend/editor/tsconfig.saas.vite.json
@@ -8,7 +8,8 @@
         "./src/proprietary/*",
         "./src/core/*"
       ],
-      "@portal/*": ["./src/portal/*"],
+      "@portal/*": ["./src/portal-saas/*", "./src/portal/*"],
+      "@portal-proprietary/*": ["./src/portal/*"],
       "@cloud/*": ["./src/cloud/*"],
       "@proprietary/*": ["./src/proprietary/*"],
       "@core/*": ["./src/core/*"]
diff --git a/frontend/editor/vite-env.d.ts b/frontend/editor/vite-env.d.ts
index d26c3bceb9..f690cf1b3e 100644
--- a/frontend/editor/vite-env.d.ts
+++ b/frontend/editor/vite-env.d.ts
@@ -3,6 +3,8 @@
 interface ImportMetaEnv {
   // Used by all builds (.env)
   readonly VITE_API_BASE_URL: string;
+  /** "true" includes the admin portal's lazy route/chunk in the editor build. */
+  readonly VITE_INCLUDE_PORTAL: string;
   readonly VITE_GOOGLE_DRIVE_CLIENT_ID: string;
   readonly VITE_GOOGLE_DRIVE_API_KEY: string;
   readonly VITE_GOOGLE_DRIVE_APP_ID: string;
diff --git a/frontend/editor/vitest.config.ts b/frontend/editor/vitest.config.ts
index 5a0fc50651..5d7a00bccf 100644
--- a/frontend/editor/vitest.config.ts
+++ b/frontend/editor/vitest.config.ts
@@ -57,7 +57,7 @@ export default defineConfig({
           react(),
           tsconfigPaths({
             // Broad project so @app/@portal resolve in every editor file the
-            // portal tests pull in (proprietary/ui, core, ...).
+            // portal tests pull in (core/ui, core, ...).
             projects: ["./tsconfig.portal.vite.json"],
           }),
         ],
@@ -104,7 +104,13 @@ export default defineConfig({
       {
         test: {
           name: "saas",
-          include: ["src/saas/**/*.test.{ts,tsx}"],
+          // src/saas = editor-saas layer; src/portal-saas = the portal's saas
+          // overrides (sibling to src/portal). Both build under the saas flavor,
+          // so both resolve @portal via the saas cascade (tsconfig.saas.vite.json).
+          include: [
+            "src/saas/**/*.test.{ts,tsx}",
+            "src/portal-saas/**/*.test.{ts,tsx}",
+          ],
           environment: "jsdom",
           globals: true,
           setupFiles: ["./src/saas/setupTests.ts"],
diff --git a/frontend/eslint.config.mjs b/frontend/eslint.config.mjs
index 4a3df8ad10..d954ca4006 100644
--- a/frontend/eslint.config.mjs
+++ b/frontend/eslint.config.mjs
@@ -6,7 +6,8 @@ import { defineConfig } from "eslint/config";
 import tseslint from "typescript-eslint";
 
 const srcGlobs = [
-  // The portal layer lives under editor/src/portal, so editor/src/** covers it.
+  // The portal layers live under editor/src/portal (base) and
+  // editor/src/portal-saas (saas override), so editor/src/** covers them.
   "editor/src/**/*.{js,mjs,jsx,ts,tsx}",
 ];
 const nodeGlobs = [
@@ -30,11 +31,48 @@ const baseRestrictedImportPatterns = [
   },
 ];
 
+// Button/SegmentedControl/Chip must come from the shared DS (@app/ui), not Mantine.
+// If no variant fits, extend @app/ui — that layer (editor/src/core/ui) is exempt below.
+const mantineComponentImportRestrictions = [
+  {
+    selector:
+      "ImportDeclaration[source.value='@mantine/core'] > ImportSpecifier[imported.name=/^(Button|ActionIcon|UnstyledButton|CloseButton|FileButton)$/]",
+    message:
+      'Use the shared Button (@app/ui/Button) instead of the Mantine button family. variant=primary|secondary|tertiary, accent=default|neutral|brand|ai|premium|danger|success|warning; an icon-only button is `