Active Tenant Dashboard

The Active Tenant Dashboard gives tenants a single, self-service view of everything related to their tenancy — from rent balances and upcoming payments to maintenance jobs, compliance certificates, and financial statements.

URL

/:company/accounts/tenant/:tenantId

The accounts list page links directly to this URL using the tenant's ID from the AgentOS platform.

Tabs

The dashboard is organised into five tabs, accessible via a sidebar on desktop and a dropdown menu on mobile.

1. Overview

The default landing tab. Displays:

KPI Cards

Card	Description
Current Property	Number of active tenancy properties and the property address
Outstanding Balance	Current rent balance, with a trend indicator if a balance is owed
Next Rent Due	Date of next scheduled rent payment, with amount and frequency
Active Jobs	Count of open maintenance jobs
Total Jobs	Lifetime count of all maintenance jobs
Certificates Expiring Soon	Number of compliance certificates due to expire

Current Tenancy Summary Card

Shows property address, rent amount and frequency, tenancy start/end dates, managing agent details, co-tenant names, and deposit information.

2. Tenancy

A paginated list of all tenancies (current and historical). Each tenancy record shows:

Property address and type
Managing agent
Co-tenants
Rent amount and frequency
Start and end dates
Deposit information

Supports pagination controls for navigating multiple tenancy records.

3. Maintenance

A paginated list of maintenance jobs associated with the tenant. Features:

Status filter pill buttons — filter by open, in-progress, completed, or all jobs
Per-job display: title, property, description, status badge, reported date, completed date, assigned contractor, and category

Status badges are colour-coded:

Amber — Open / Reported / Pending / In Progress / Active
Green — Completed / Closed / Resolved / Done
Red — Cancelled / Rejected

4. Certificates

Lists compliance certificates held for the tenant's property, including gas safety records, Energy Performance Certificates (EPC), Electrical Installation Condition Reports (EICR), and others.

Visual warnings highlight certificates that are expiring soon or have already expired
Document links are provided where available

5. Financials

A rent statement and transaction history. Features:

Date range filter to narrow the statement period
Summary cards showing opening balance, closing balance, total credits, and total debits
Full transaction table with individual line items

All monetary values are displayed using the company's configured currency symbol.

Loading & Error States

Skeleton Loading

While data is being fetched, the dashboard renders animated skeleton placeholders that match the layout of each section — KPI card grid, sidebar navigation, and content area — to prevent layout shift.

Error Handling

If any data fetch fails, an error banner is shown within the affected section. A Try Again button triggers a retry without requiring a full page reload.

Empty States

Every tab displays a dedicated empty state illustration and message when there is no data to show (e.g. no maintenance jobs, no certificates on record).

Responsive Layout

Viewport	Navigation style
Desktop (`md` and above)	Fixed sidebar with labelled navigation items
Mobile (below `md`)	Collapsed dropdown selector at the top of the content area

Technical Details

Routing

The page uses Next.js App Router dynamic segments:

src/app/[company]/accounts/tenant/[tenantId]/
├── page.tsx                    # Server component, metadata generation
├── tenant-dashboard-client.tsx # Client component, all tab logic
└── loading.tsx                 # Skeleton loading UI

The server page exports dynamic = "force-dynamic" to ensure correct behaviour with authentication.

Data Fetching

All data is fetched client-side via tRPC using the following endpoints:

Endpoint	Tab
`tenant.status`	Service availability check (all tabs)
`tenant.insights`	Overview
`tenant.tenancies`	Tenancy
`tenant.maintenanceJobs`	Maintenance
`tenant.certificates`	Certificates
`tenant.statements`	Financials

Queries use a staleTime of 60 seconds and retry up to 2 times on failure.

Currency

Currency symbols are sourced from the CompanyContext (useCompany()) so the correct symbol is displayed for each agency's configured region.

Service Availability

Before rendering any content, the dashboard checks tenant.status to confirm the AgentOS tenant service is available for the given company. If the service is unavailable, an appropriate message is shown instead of the dashboard.