Dashboard screens R11–R23, R27–R30 / S26–S33 are superseded by docs/mockups/inbox/ if Zare approves it.

# Support (spec 1.4) M1–M4 — mockup approval list

One sitting: open each link, answer the question (if any), tick it. Hosted pack:
<https://dotsy-support-roadmap-mockups.pages.dev> (redeploy after this commit). Every file has `?state=` deep links,
a state bar, light/dark; `&shot=1` hides the bar. Prices are **`[price TBD]`** on purpose (§ 11.6 not decided).
M0 (agent reporting + Slack triage card in `slack.html`) is built in another channel and is **not** in this list.

Legend: **new** = drawn in this pass · **wording update** = existing screen, copy changed · **as is** = existing, unchanged, still the current pick.

## M1 — Report a bug in the dashboard and editor; email replies

| # | Screen | File (state) | PNG | Kind | Blocks engineering on | Question |
|---|---|---|---|---|---|---|
| S1 | Help menu: Ask · Report a bug · Your reports | `m1-help-menu.html?state=menu` | `png/s01-help-menu-1440-light.png` (+ dark) | new | Where the widget mounts in the dashboard shell (top-bar trailing slot vs floating) | A: a "?" menu in the top bar (pick; no button over the editor canvas) or B: the floating launcher `widget.html?state=1`? |
| S2 | Bug form: description, screenshot, more images, details list | `widget.html?state=2` | `png/widget-2-1440-light.png` | as is | Report panel layout + field set | — |
| S3 | Mark it up: box, pen, arrow, blur | `widget.html?state=3` | `png/widget-3-1440-light.png` | as is | Annotate tool set | Spec § 9.2 lists Box, Pen, Blur. Drop Arrow (pick) or keep it? |
| S4 | Report from the editor: editor + page in one screenshot | `m1-help-menu.html?state=editor` | `png/s04-editor-report-1440-light.png` | new | Shell + iframe capture composition (§ 9.2) | — |
| S5 | Guest report: email field first | `widget.html?state=9` | `png/s05-guest-report-1440-light.png` | new | Guest path fields (email required) | — |
| S6 | API key screen: key hidden in the screenshot | `m1-masked.html?state=keys` | `png/s06-masked-keys-1440-light.png` | new | not blocking — `data-dotsy-private` list proceeds | — |
| S7 | Billing screen: payment details hidden | `m1-masked.html?state=billing` | `png/s07-masked-billing-1440-light.png` | new | not blocking — backend proceeds | — |
| S8 | Sent: receipt + "we'll reply here or by email" | `widget.html?state=4` | `png/widget-4-1440-light.png` | as is | Receipt copy | — |
| S9 | Needs info: the support agent asks | `widget.html?state=5` | `png/widget-5-1440-light.png` | as is | not blocking | — |
| S10 | Fix in progress: a person joined | `widget.html?state=6` | `png/widget-6-1440-light.png` | as is | not blocking | — |
| S11 | Fixed, live: changelog link + "Did this fix it?" | `widget.html?state=7` | `png/widget-7-1440-light.png` | as is | not blocking | — |
| S12 | Your reports: list, statuses, unread dot | `widget.html?state=8` | `png/s12-your-reports-1440-light.png`, `-390-light.png` | new | `GET /support/mine` fields (status words, last-reply line, unread) | Status words Fixing · Needs your reply · Fixed · Closed (pick, Gleap-like and plain) or show the raw spec states? |
| S13 | Email: team reply, reply-by-email | `m1-email.html?state=reply` | `png/s13-email-reply-1440-light.png`, `-390-light.png` | new | Email template + `Reply-To` (§ 8.6) | — |
| S14 | Email: fixed notice to reporter and +1s | `m1-email.html?state=fixed` | `png/s14-email-fixed-1440-light.png` | new | not blocking | — |

## M2 — AI chat in the same launcher

| # | Screen | File (state) | PNG | Kind | Blocks engineering on | Question |
|---|---|---|---|---|---|---|
| S15 | Welcome: search help, common questions, report a bug | `widget.html?state=b` | `png/widget-b-1440-light.png` | as is | Ask tab layout | — |
| S16 | Cited answer: help-centre links under the answer | `widget.html?state=c` | `png/widget-c-1440-light.png` | as is | Citation card format | — |
| S17 | Signed-in check (read-only DNS lookup) | `widget.html?state=d` | `png/widget-d-1440-light.png` | as is | not blocking — tools proceed | — |
| S18 | Not sure → Ask a person | `widget.html?state=i` | `png/s18-not-sure-1440-light.png`, `-390-light.png` | new | Hand-over button + rule (§ 10.3) | — |
| S19 | Hand-over becomes a ticket | `widget.html?state=e` | `png/s19-escalated-1440-light.png` | wording update | Ticket card copy | — |
| S20 | Team reply in the chat | `widget.html?state=f` | `png/widget-f-1440-light.png` | as is | not blocking | — |
| S21 | Solved + "Was this helpful?" | `widget.html?state=g` | `png/widget-g-1440-light.png` | as is | not blocking | — |
| S22 | Over limits: leave a message + email | `widget.html?state=j&visitor=anon` | `png/s22-leave-message-1440-light.png`, `-390-light.png` | new | Out-of-budget fallback (§ 5.3 step 7) | — |
| S23 | dotsy.ai launcher (anonymous) + phone | `widget.html?state=a`, `?state=h` | `png/widget-a-1440-light.png`, `png/widget-h-1440-light.png` | as is | dotsy.ai embed (§ 13.1) | Keep the "Need a hand?" teaser bubble, or launcher only (pick: launcher only; the spec doesn't ask for a teaser)? |

## M3 — Learning loop

| # | Screen | File (state) | PNG | Kind | Blocks engineering on | Question |
|---|---|---|---|---|---|---|
| S24 | Slack: Monday weekly digest with gap drafts + auto-send offer | `m3-learning.html?state=digest` | `png/s24-weekly-digest-1440-light.png` | new | `digest` output fields | — |
| S25 | Slack: gap draft waiting for ✅, then published | `m3-learning.html?state=gap`, `?state=published` | `png/s25-gap-draft-1440-light.png`, `png/s25-gap-published-1440-light.png` | new | Approve-by-reaction flow for drafts | Approve gap drafts by ✅ in Slack (pick, same as replies) or in the dashboard help editor? |

## M4 — Support add-on for customers' sites

| # | Screen | File (state) | PNG | Kind | Blocks engineering on | Question |
|---|---|---|---|---|---|---|
| S26 | Support tab, add-on off: offer + preview | `m4-addon.html?state=off` | `png/s26-addon-off-1440-light.png` | new | Where Support lives (new sidebar item) | New "Support" sidebar item (pick) or a tab under Forms? |
| S27 | Choose Support or Support + AI, pay | `m4-addon.html?state=sheet` | `png/s27-addon-sheet-1440-light.png` | new | Billing catalog shape (one or two add-ons) | One add-on with an AI switch, or two tiers as § 11.6 proposes (shown)? |
| S28 | First day: setup checklist | `m4-inbox.html?state=empty` | `png/s28-inbox-first-day-1440-light.png` | new | not blocking | — |
| S29 | Inbox: list + conversation the AI handed over | `m4-inbox.html?state=inbox` | `png/s29-inbox-1440-light.png` (+ dark) | new | Inbox list/get fields, status words | — |
| S30 | Bug report + owner's AI agent draft, person sends | `m4-inbox.html?state=bug` | `png/s30-inbox-bug-draft-1440-light.png` | new | Draft/approve UI (§ 8.4) | — |
| S31 | Search across messages | `m4-inbox.html?state=search` | `png/s31-inbox-search-1440-light.png` | new | not blocking — search index proceeds | — |
| S32 | Reporting: 5 numbers + top questions | `m4-inbox.html?state=reporting` | `png/s32-reporting-1440-light.png` | new | Reporting fields | — |
| S33 | Settings: help button, AI on/off, email forward, retention, turn off | `m4-settings.html?state=settings` | `png/s33-settings-1440-light.png` | new | Settings fields + forward address format | — |
| S34 | Own AI key: copy-once secret, then provider only | `m4-settings.html?state=key`, `?state=keyset` | `png/s34-own-key-1440-light.png`, `png/s34-own-key-saved-1440-light.png` | new | not blocking — site secrets (spec 2.3) proceed | — |
| S35 | Visitor widget on a customer site: cited answer | `m4-visitor.html?state=answer` | `png/s35-visitor-answer-1440-light.png`, `-390-light.png` | new | Restyle tokens from the site (`--dw-*`) | Widget colours taken from the site automatically (pick) or picked by the owner in Settings → Look? |
| S36 | Visitor: not sure → email → team | `m4-visitor.html?state=notsure` | `png/s36-visitor-not-sure-1440-light.png`, `-390-light.png` | new | not blocking | — |
| S37 | Visitor: report a problem with screenshot | `m4-visitor.html?state=report` | `png/s37-visitor-report-1440-light.png`, `-390-light.png` | new | not blocking | — |
| S38 | Visitor: solved → 1–5 rating | `m4-visitor.html?state=csat` | `png/s38-visitor-rating-1440-light.png`, `-390-light.png` | new | CSAT scale | — |
| S39 | Email to a visitor from the site's own name, with rating | `m1-email.html?state=customer` | `png/s39-email-customer-1440-light.png`, `-390-light.png` | new | Per-site sender name | — |

## M2 v1 — Knowledge (dashboard)

What the chat learns from (spec § 10.4): the site's own published pages (automatic at publish) and **Snippets**
(private Q&A, optional read-more link, `internal` = never quoted). File: [`m2-knowledge.html`](m2-knowledge.html). Shell
reproduced from the current code (`top-bar.tsx`, `site-sidebar.tsx`, `sub-nav.tsx`, `customers/support-sub-nav.tsx`),
same as `../inbox/i18-support.html`. Placement pick: **A — a Knowledge view in Customers › Support** (third segment
after Conversations · Reporting); option B (Settings › Support) drawn as `?state=k1-settings`.

| # | Screen | File (state) | PNG | Kind | Blocks engineering on | Question |
|---|---|---|---|---|---|---|
| K1 | Knowledge: what the chat knows (published pages, snippets) + Test a question with cited sources | `m2-knowledge.html?state=k1`, `?state=k1-unsure` | `png/k1-knowledge-1440-light.png` (+ `-1440-dark`, `-390-light`), `png/k1-not-sure-1440-light.png` | new | Placement (route `customers/support/knowledge`), a test-mode chat turn that returns `{answer, sources[]}` and stores nothing (new endpoint) | A: Knowledge segment in Customers › Support (pick: fixing answers is weekly work next to conversations) or B: Settings › Support (`?state=k1-settings`)? Later sources (other websites, files, GitHub) left out until they ship (pick) or shown as disabled rows (`?state=k1-later`)? |
| K2 | Snippets list: search, Add snippet, Import/Export CSV, Internal badge, empty state | `m2-knowledge.html?state=k2`, `?state=k2-search`, `?state=k2-empty` | `png/k2-snippets-1440-light.png` (+ dark), `png/k2-search-1440-light.png`, `png/k2-empty-1440-light.png` | new | Snippet store fields `{question, answer, readMore?, internal, updated}`; list + CSV export | No "times used" column: needs per-answer source logging (M3 digest). Add it later (pick) or log from M2 v1? |
| K3 | Add / edit snippet sheet: question, answer, read-more link, Internal switch | `m2-knowledge.html?state=k3`, `?state=k3-edit` | `png/k3-add-snippet-1440-light.png` (+ `-390-light`), `png/k3-edit-internal-1440-light.png` | new | Save is live at once (no draft/publish), MCP `add_snippet` same fields | Snippets live on save (pick: they're never served, so publish adds nothing) or wait for Publish like pages? |
| K4 | CSV import: pick file, then N added / M skipped with row + reason | `m2-knowledge.html?state=k4-pick`, `?state=k4` | `png/k4-import-1440-light.png`, `png/k4-import-result-1440-light.png` | new | CSV columns `question, answer, read_more, internal`; duplicate rule; skipped-rows download | A question that already exists: skip and keep yours (pick, safe re-import) or replace it? |

Not drawn on purpose: per-snippet usage counts, "added by" (no stored author), source on/off switches, plan limits on
snippets (none enforced yet, rule 9).

## Superseded — don't review these

- `widget.html?state=1` (floating launcher menu in the dashboard): kept only as variant B for S1; on dotsy.ai the launcher is S23.
- `slack.html` "Daily digest" card → replaced by S24 (weekly, Monday). The daily one-liner is M0b's monitor check-in, not this digest.
- `slack.html` "Knowledge gap" card with Approve/Edit/Dismiss buttons → replaced by S25 (✅ reaction, changes in the thread).
- `customers.html` (dashboard part) → replaced by S28–S32. Its MCP agent panel stays as reference for `support_inbox`.
- `widget-2-marked`, `widget-see` PNGs: older variants of S2/S15, not current.
- `flow.html`: explainer only, nothing to approve.

## Wording changed in existing screens

- S19 (`widget.html?state=e`): "I've confirmed it's a bug and sent it to the team" → "That looks like a problem on our side, so I've sent it to the team" (the AI must not state a cause without a person's ✅, § 8.4).