Feature Spec Report for mock-support-desk

Branch: feature/mock-report-ui · Build: 128 · Commit: abc1234 · Pull request: #42

Branch: main · Build: 234 · Commit: 0bbfda9

Generated 15th January 2026 at 12:30.

Specification layers

Context

Architecture, design, and domain vocabulary

3 documents4/4 covered2 open items

Support desk

Modelactive

SUPPORT Support desk

active

Define the shared vocabulary for a small customer support workflow.

SUPPORT-M001: Ticket covered 1

A customer request that needs a response from an agent.

SUPPORT-M002: Agent covered 1

A team member who reviews tickets and sends replies.

SUPPORT-M003: Priority covered 1

A visible urgency label used to sort the queue.

Rules

  • SUPPORT-M-R001: Tickets keep a stable public reference. covered by direct test 1

Spec context

Model Diagram line 32

erDiagram
      AGENT ||--o{ TICKET : handles
      TICKET }o--|| PRIORITY : has

Open Questions line 40

  • SUPPORT-Q001: Should permission tables have optional coverage checks later?

Assumptions line 44

  • SUPPORT-A001: Review notes are shown in reports as informational context.

Permissions line 48

  • Agents can view assigned tickets.
  • Leads can reassign tickets.

Coverage recommendation: enforceable API and permission behavior should also be captured as rules and scenarios so tests can reference stable IDs.

Support platform

Stack accepted

Define the minimal technical platform for the support desk mock.

Stack

Runtime

  • TypeScript for application and test code
  • Browser-rendered HTML reports

Context

The mock report must run without external application services.

Rationale

Keep report examples deterministic and easy to publish.

Consequences

Mock data and screenshots are stored with the fixture.

Support desk experience

Design draft

Define the visual direction demonstrated by the support desk mock.

Design

The interface keeps ticket context and reply actions close together.

Navigation

Keep the inbox and active ticket within one interaction context.

Principles

  • Make ticket status easy to scan
  • Keep the primary reply action obvious

Layout

Use a ticket list beside the active conversation on wider screens.

Interaction

Opening a ticket preserves the agent's position in the list.

Visual style

Use restrained surfaces with clear status accents.

Delivery surfaces

User-visible applications and workflows

2 documents5/7 covered

Ticket inbox

active
test playwrightscreenshots optional

Let agents find the next ticket to work on without losing context.

Rules

  • SUPPORT-INBOX-R001: The inbox MUST show open tickets first. covered by SUPPORT-INBOX-S001 1
  • SUPPORT-INBOX-R002: The inbox SHOULD highlight high priority tickets. covered by SUPPORT-INBOX-S001 1

Scenarios

SUPPORT-INBOX-S001: Agent reviews the queue covered 1

Rules covered by this scenario: SUPPORT-INBOX-R001 SUPPORT-INBOX-R002

Given an agent has open tickets line 27 no screenshot captured

When they open the inbox line 28 screen changed · screenshot captured

Inbox with priority badges
Inbox with priority badges

Then open tickets are listed by age with priority badges line 29 same screen as line 28

Ticket replies

active
test playwrightscreenshots optional

Help agents answer a customer without leaving the ticket.

Rules

  • SUPPORT-REPLY-R001: The reply composer MUST preserve unsent text. covered by SUPPORT-REPLY-S001 1
  • SUPPORT-REPLY-R002: Saved replies SHOULD be reusable across tickets. missing coverage

Scenarios

SUPPORT-REPLY-S001: Agent drafts a reply covered 1

Rules covered by this scenario: SUPPORT-REPLY-R001

Given an agent has selected a ticket line 27 no screenshot captured

When they write a reply line 28 screen changed · screenshot captured

Reply composer with suggested answer
Reply composer with suggested answer

Then the draft remains visible line 29 same screen as line 28

SUPPORT-REPLY-S002: Agent sends a saved reply missing coverage

Rules covered by this scenario: none referenced

Given an agent has selected a ticket line 35 no screenshot captured

When they choose a saved reply line 36 no screenshot captured

Then the composer is filled with reusable text line 37 no screenshot captured