Prospect Tenant Portal — Looking to Rent
Prospect Tenant Portal — Looking to Rent
The Prospect Tenant Portal is a five-tab self-service dashboard for tenants who are actively looking to rent a property. It gives prospect tenants full visibility of matching properties, their search preferences, scheduled viewings, and their application profile — all without needing to contact their letting agency.
Accessing the Portal
The portal is available at:
/:company/accounts/tenant/:tenantId/prospect
Tenants with an existing account can also reach it via the "Looking to Rent" button in the tenant dashboard header.
Dashboard Tabs
Overview
The Overview tab is the default landing screen. It displays:
- KPI cards summarising:
- Total available properties
- Properties matching the tenant's saved preferences
- Upcoming viewings count
- Preference setup status
- Matching properties grid — a curated list of properties that match the tenant's saved preferences
- Upcoming viewings list — the next scheduled viewings at a glance
- Quick-action buttons to navigate to Property Search or Preferences
Property Search
The Property Search tab lets tenants browse all advertised properties from the agency.
- Paginated property cards — each card shows:
- Property image
- Address and postcode
- Rent amount and frequency
- Bedrooms, bathrooms, and reception rooms
- Property type and furnished status
- Available date
- Inline "Book Viewing" button on each card opens the Schedule Viewing Modal
Preferences
The Preferences tab displays the tenant's current search criteria and allows them to update these in place.
Preference fields include:
| Field | Description |
|---|---|
| Bedrooms | Minimum number of bedrooms required |
| Rent range | Minimum and maximum monthly rent |
| Areas | Preferred locations or postcodes |
| Property types | e.g. flat, house, studio |
| Furnished preference | Furnished, unfurnished, or either |
| Pets | Whether the tenant has pets |
| Dependants | Number of dependants |
| Move-in date | Target move-in date |
Viewings
The Viewings tab shows all viewings — upcoming and historical — associated with the tenant.
Each viewing entry displays:
- Property address
- Scheduled date and time
- Status badge — colour-coded:
- 🟢 Confirmed / Booked / Scheduled
- 🟡 Pending / Requested
- 🔴 Cancelled / Declined
- 🔵 Completed / Attended
- Agent name and contact information
Application
The Application tab provides a read-only view of the tenant's application profile as held by the agency. It is divided into three sections:
- Personal information — name, date of birth, nationality
- Contact details — phone number, email address, current address
- Employment & income — employer name, job title, annual income
This tab is read-only. To update application details, tenants should contact their agent directly.
Schedule Viewing Modal
The Schedule Viewing Modal can be opened from both the Overview and Property Search tabs via the "Book Viewing" button on any property card.
The modal includes:
- Property address (pre-filled, read-only)
- Date picker — select a preferred viewing date
- Time picker — select a preferred viewing time
- Notes field — optional free-text message to the agent
- Submit — sends the viewing request to the agency via the existing
tenant.scheduleViewingtRPC procedure
Navigation
- The tenant dashboard header includes a "Looking to Rent" link button that navigates directly to the prospect portal.
- Inside the prospect portal, a breadcrumb trail links back to:
- Accounts list
- Tenant dashboard
- Current portal page
- On desktop, a sidebar lists all five tabs.
- On mobile, tabs are accessible via a dropdown selector.
Technical Reference
Route
/:company/accounts/tenant/:tenantId/prospect
Page Metadata
The page title is dynamically set to:
Looking to Rent — {company} — myProp Portal
tRPC Procedures Used
The portal consumes the following existing tenant.* tRPC procedures — no new backend endpoints were introduced:
| Procedure | Used by |
|---|---|
tenant.preferences | Preferences tab, Overview KPI cards |
tenant.advertisedProperties | Property Search tab, Overview matching grid |
tenant.viewings | Viewings tab, Overview upcoming viewings |
tenant.applicationProfile | Application tab |
tenant.scheduleViewing | Schedule Viewing Modal |
Loading State
A skeleton loading screen (loading.tsx) is shown while the server component fetches initial data, supporting Next.js streaming SSR. The skeleton mirrors the layout of the Overview tab, including KPI cards and property card placeholders.
Responsive & Theming
- Mobile-first responsive layout
- Dark mode fully supported across all tabs and components
- Follows the existing myProp design system (KPI cards, error banners, empty states, pagination)