Service Charge Demands — Detail Page & PDF Generation
Service Charge Demands — Detail Page & PDF Generation
Every service charge demand has a dedicated detail page from which you can review the full demand breakdown, see payment status, and download or dispatch a branded PDF letter to the leaseholder.
Accessing a Demand
From Dashboard → Demands, click the View link in the actions column next to any demand. This opens the demand detail page at /dashboard/demands/[demandId].
You must be signed in to access demand detail pages.
Demand Detail Page
The detail page is organised into several sections.
Summary Cards
Four cards at the top of the page show the key financial figures:
| Card | Description |
|---|---|
| Amount Due | Total amount for this installment |
| Amount Paid | Amount received so far |
| Outstanding | Remaining balance (Amount Due − Amount Paid) |
| Due Date | Payment deadline |
Leaseholder Details
Displays the leaseholder's name, email address, unit number, and their apportionment percentage — the share of the total service charge budget attributable to this unit.
Block Details
Shows the block name and address, the budget's financial year, the installment schedule (Quarterly or Half-Yearly), and the service charge period (start and end dates).
Itemised Breakdown
A table listing each budget line item and its per-unit apportioned amount. The table totals to the installment amount charged on this demand.
Payment Details
Displayed when a client money account is linked to the block. Shows:
- Account Name — the ring-fenced client money account holder
- Bank — the bank holding the account
- Sort Code and Account Number — for bank transfer
- Payment Reference — the demand reference the leaseholder must quote
- QR Code — encodes the reference, amount, and due date; can be scanned by banking apps
Compliance note: Bank details are always sourced from the block's FCA-aligned ring-fenced Calmony client money account.
Timeline
Shows key dates in the demand lifecycle:
- Created — when the demand was generated
- Sent — when it was dispatched (if applicable)
- Paid — when full payment was received (if applicable)
Status
The demand's current status is shown as a badge next to the demand reference:
| Status | Meaning |
|---|---|
| Draft | Created but not yet sent to the leaseholder |
| Sent | Marked as dispatched |
| Paid | Fully paid |
| Partial | Partially paid |
| Overdue | Past due date with an outstanding balance |
| Cancelled | Demand cancelled |
Actions
Mark as Sent
Available on Draft demands only. Click Mark as Sent to update the demand status to sent and record a timestamped audit log entry with the acting user. The button is disabled while the request is in flight.
Download PDF
Click Download PDF to generate and download a branded PDF letter. The browser generates the PDF client-side (no server round-trip for the document itself) and automatically triggers a file download. The filename is the demand reference with forward slashes replaced by hyphens.
Branded PDF Letter
The downloaded PDF is a formal service charge demand letter suitable for sending to leaseholders. It contains the following sections:
Header — Agent Branding
- Organisation logo (if configured)
- Managing agent trading name and registered address
- Agent email address and phone number
- Issue date and demand reference (top-right)
Recipient & Property
- Leaseholder name and correspondence address (falls back to the unit/block address if no correspondence address is configured)
- Unit number and block name/address
Document Title
"SERVICE CHARGE DEMAND" with the financial year and installment number (e.g. Installment 2 of 4 (Quarterly)).
Summary Info Grid
A shaded row showing Reference, Due Date, Apportionment %, and Amount Due at a glance.
Itemised Breakdown Table
All line items from the budget with their apportioned amounts, using alternating row shading for readability. The total row shows the full installment amount.
Payment Details & QR Code
Bank account details side-by-side with a QR code. The QR code encodes the demand reference, amount in pence, and due date. Leaseholders can scan the QR code with a banking app or payment app to pre-fill the reference.
If no client money account is configured for the block, only the payment reference is shown.
Payment Notice
Instructs the leaseholder to pay by the due date and quote the demand reference. If a partial payment has already been made, the notice also shows the amount paid and the outstanding balance.
Regulatory Footer
Printed on every page:
- Company number and VAT number
- ARMA membership number (if active)
- RICS membership number (if active)
- FCA reference number (if configured)
- Client money protection scheme name (if configured)
All regulatory details are drawn from the managing agent profile. Configure them under Settings → Managing Agent.
Data Sources
The demand detail page and PDF pull data from five sources:
| Source | Data |
|---|---|
| Service Charge Demand | Reference, amounts, dates, status, leaseholder info, line items |
| Service Charge Budget | Financial year, period, installment schedule |
| Managing Agent Profile | Branding, address, contact details, regulatory memberships |
| Organisation | Name, logo URL, primary colour |
| Client Money Account | Bank sort code, account number, account name, bank name |
Technical Notes
- PDF generation is entirely client-side via
@react-pdf/renderer. TheDemandPdfDocumentcomponent is dynamically imported to prevent SSR errors. - QR code generation is client-side via
qrcode.react. The QR code is rendered into an off-screen canvas element, extracted as a PNG data URL, and embedded into the PDF as an image. - All monetary values are in pence (integer) throughout the data layer. Division by 100 and
.toFixed(2)formatting is applied at render time only. - Audit logging: the "Mark as Sent" action is recorded in the audit trail with the user ID and timestamp.