Grid & List View Toggle for Tenancies and Properties
Grid & List View Toggle for Tenancies and Properties
Available from: v0.1.95
Agents and landlords with large portfolios can now switch between a card grid and a compact table view on the Tenancies and Properties list pages. The preference is remembered automatically.
Why This Exists
Card grids are great for browsing a small portfolio — each card surfaces address, status, and key dates at a comfortable size. However, when you are managing 100+ tenancies, cards at three-per-row with padded content become inefficient. Power users need to:
- Scan statuses and deposit amounts across many rows at once.
- Spot overdue end dates without scrolling through cards.
- Reach a specific tenancy quickly without pagination.
- Bulk-select records with minimal clicks.
The table view solves all of these use cases while keeping the card view intact for everyone else.
Switching Views
A toggle control (grid icon / list icon) sits in the toolbar row at the top of the Tenancies list and the Properties list.
- Click the grid icon to return to the card view.
- Click the list icon to switch to the table view.
Your selection is saved to localStorage under a per-page key, so the view you last used will be restored automatically the next time you visit that page — even after navigating away or refreshing.
Mobile behaviour: The card view is recommended on mobile. If a list-view preference is stored, it will still load, but the table may require horizontal scrolling on narrow screens.
Table View Columns
When the list view is active, each tenancy (or property) appears as a table row with the following columns:
| Column | What it shows |
|---|---|
| Address | Full property address |
| Status | Current tenancy or property status badge |
| Dates | Tenancy start date → end date |
| Deposit | Deposit amount held |
| Scheme | Deposit protection scheme |
| Actions | Per-row action menu (same actions as card view) |
Filters and Bulk Actions
Switching views does not affect filtering or bulk-selection behaviour:
FilterToolbar— all filters (status, date range, search) work identically in both views.BulkActionBar— checkboxes and bulk actions are available in the table view in the same way as the card view.
There is no need to reconfigure your filters when toggling between views.
Card View
The original card grid (grid gap-3 sm:grid-cols-2 lg:grid-cols-3) is unchanged. It remains the default for new users and is well-suited to:
- Portfolios with fewer properties.
- Landlords who prefer a visual, at-a-glance layout.
- Mobile and tablet usage.
Affected Pages
- Dashboard → Tenancies (
/dashboard/tenancies) - Dashboard → Properties (
/dashboard/properties)