Annual fitness review

The annual fitness review packet is the year on a page. It renders at /demo/principal/annual-reviews/[arId] and aggregates everything the principal has accumulated about one AR over the supervision year into a single scrolling document. SUP 12.6A under PS22/11 raised the standard for what this document needs to contain. The packet is built to that standard.

Live (Heritage’s Pemberton Mortgages): lending-agent-oversight.vercel.app/demo/principal/annual-reviews/heritage-ar-001.

What’s on the screen

The packet runs as one long scroll, organised into seven sections. Each section opens with a magazine-style header — an oversized Fraunces section number (01, 02, …), an h2 title at display scale, and a 01 / 07-style position marker on the right, separated from the body by a hairline rule. The pacing gives the long packet the rhythm a board document deserves and survives the browser’s PDF export cleanly.

A sticky anchor rail on the left (lg: only, hidden in print) lists the seven sections and scroll-syncs to the active one. Click any section to scroll into view smoothly.

Back link ← Annual reviews.
Title in Fraunces: Annual fitness review · [Trading name].
Subtitle: Period: [date] to [date] · Supervised by [Principal firm].
Right-side: Export as PDF button. Triggers window.print() on click; a print:hidden rule on the chrome, the section anchor rail, and the export button itself collapses them for the printed output. The browser handles the PDF save dialog. Production offers an alternative server-side renderer with an embedded organisation logo and SHA-256 hash footer.

1. AR overview and key facts

The same key-facts grid the AR detail Overview tab shows. Trading name, legal name, FRN, type, status, appointed on, primary contact, headquarters. Self-employed and Important Business Service flags (where set).

Permissions list with grant dates.

Controllers and senior management current snapshot, with any changes during the year flagged.

2. Risk trajectory

A 12-month line chart of the AR’s risk score, one data point per month. Banded background tints (low / moderate / elevated / high / critical) so the reader can see where the trajectory sat each month. Annotations mark notable events: breach filed, file review closed with a fail, MI anomaly score above the firm-wide median.

Below the chart: a one-paragraph commentary auto-generated from the trajectory (“Risk score rose from Moderate to High in Q3, driven primarily by a serious conduct breach in August and two failed file reviews in September.”).

3. Breach summary

A table of every breach filed in the period, with severity, category, customer impact, root-cause taxonomy, FCA notification status, resolution status, and date.

Below the table: a small severity histogram (count by low / moderate / serious / critical), and a category histogram. Patterns become legible at a glance.

4. File review summary

The list of file reviews closed in the period. Each row: case reference, sample reason, score, finding count, root-cause taxonomy, reviewer.

Below the list: aggregate stats. Mean score, pass rate, fail rate, advisory rate. Trend versus prior year.

5. MI return trend

A small-multiples chart: four mini line charts showing volume, complaints, breaches, conduct events across the 4 quarters of the year. Each with a comparison line for the prior year where the prior year exists.

Below the charts: the principal’s commentary box, free-text, editable inline.

6. Conduct events log

Reverse-chronological list of conduct events in the period. Senior departures, controllership changes, certification expiries, training-competence flags. Each row links to the underlying source where applicable.

7. Vulnerable customer evidence

A short section (FG21/1) with three numbers: identification rate, recorded adjustments, complaints from vulnerable cohorts. Brief commentary.

8. Consumer Duty board feed

A subsection feeding the principal’s Consumer Duty board report (PRIN 2A and FG22/5). Three to five sentences summarising the AR’s outcomes for retail customers across the year, with a flag where the AR has materially affected the principal’s outcomes.

9. Director sign-off panel

A card at the bottom with three states.

Unsigned. Free-text reviewer notes, a Director name input, an attestation checkbox (“I confirm I have reviewed the AR’s fitness for the period above and conclude [Pass / Pass with conditions / Refer for further review].”), a verdict select, and a Sign off primary button.
Signed. Reviewer notes locked. Director name, verdict, signed-at timestamp visible. A small chain icon links to the audit-chain entry. The Sign off button is replaced by an outline Reopen for amendment button (rarely used, audit-chained).
Refer for further review. A banner reads “This AR has been referred for further review. The next packet is due [date].” with a CTA to open a follow-up review case.

States

Loading. Server-rendered with the year of fixtures. Charts hydrate client-side. Reduced motion skips chart-line draw animations.
Insufficient history. If the AR has been appointed for less than 12 months, the chart shortens to “appointed-on to today” and the section header reads Risk trajectory · [N] months. The packet still renders.
Action-pending (sign-off). Primary button spins for 600ms, then transitions to the signed state. The signed-at timestamp populates from the demo’s FIXED_NOW.
Already signed. As above. Reopening prompts a confirmation modal.
Error. Per-section error boundaries; one section failing does not break the rest of the packet.

Print and export

The packet ships with a print stylesheet that strips the chrome, expands all interactive elements to their static form, and paginates cleanly. The Print packet button triggers window.print(). The Export PDF button is deferred to the production build, where it routes server-side to a headless renderer.

Responsive behaviour

Mobile (< 640px). All sections stack. Charts shrink to full-width with 200px height. Sign-off panel pinned to the bottom on scroll.
Tablet (640-1024px). Charts at full width with 280px height. Two-column grids degrade to one column.
Desktop (> 1024px). Max-width 1024px container, padded 32px. Print stylesheet matches desktop layout.

Components

components/principal/annual-review-packet.tsx (top-level)
components/principal/annual-review-section.tsx (reusable section wrapper)
Subcomponents reuse breach-severity-badge.tsx, risk-band-badge.tsx, sparkline.tsx, and chart primitives.

How this connects to the rest of the demo

Walkthrough step 10 anchors here. Signing off completes the loop.
The KPI tile “Annual reviews due this month” on the principal home deep-links into the packet list at /demo/principal/annual-reviews, then into the per-AR packet.
The trajectory, breach summary, and file review summary all read from the same fixtures that drive AR detail. Closing a file review updates this packet on the next render.
For the regulatory mapping of SUP 12.6A and PS22/11 enhanced principal oversight, see Regulatory · PS22/11.