Compliance Dashboard: Smarter Regulatory Banner & Responsive Portfolio Table

Release: v0.1.190

Overview

This release improves two key areas of the Compliance Dashboard:

The Regulatory Updates Banner can now be dismissed per-update, with the dismissed state persisted across sessions via localStorage.
The compliance portfolio table gains a responsive card-list layout so it remains usable on tablet viewports without horizontal overflow.

Regulatory Updates Banner — Dismiss & Acknowledge

The problem

The RegulatoryUpdatesBanner rendered at the top of compliance-dashboard.tsx on every page visit, regardless of whether the user had already read the update. Because regulatory updates don't change daily, this created a "cry wolf" effect: users learned to ignore a banner that was always present, meaning genuinely new updates would be missed.

There was no visible dismiss or acknowledge mechanism on the banner itself (the ComplianceHelpPanel had article-level read state, but the banner did not).

What's new

Feature	Detail
Dismiss button	Each banner instance now carries a dismiss / acknowledge control visible directly on the banner.
localStorage persistence	Dismissed update IDs are stored in `localStorage`, keyed by update version or date. The dismissed state survives page reloads and new browser sessions on the same device.
Conditional rendering	The banner is rendered only when there are updates whose IDs are not present in the dismissed set. A fully-acknowledged user sees no banner until a new update is published.

How it works

User visits compliance page
        │
        ▼
RegulatoryUpdatesBanner reads localStorage
        │
        ├─ Dismissed IDs match all current updates? → Banner hidden
        │
        └─ New / undismissed update found? → Banner shown
                │
                └─ User clicks Dismiss → update ID written to localStorage → Banner hidden

Key behaviour details

Storage key format: Keyed by update version or date (e.g. regulatory-update-dismissed:2025-07-15) so each distinct update maintains its own dismissed flag.
No server-side state required: Persistence is entirely client-side via localStorage. This means dismissed state is per-device/per-browser, not per-account. Users on multiple devices will see the banner again on a new device until they dismiss it there too.
New update resets visibility: Publishing a new regulatory update with a new version/date key will surface the banner again for all users, even those who dismissed the previous one.

Compliance Portfolio Table — Responsive Card-List Fallback

The problem

The compliance portfolio table is wide by nature (multiple columns for tenancy, status, critical count, actions, etc.) and sits inside an lg:col-span-3 grid column. On tablet viewports (768–1024 px) the grid collapses to a single column, meaning the full-width table overflows horizontally. Users had to scroll sideways with no indication of what lay off-screen.

This is a significant usability gap for property managers and agents who frequently work on tablets in the field or during inspections.

What's new

Below the md breakpoint, the portfolio table is replaced by a card-list layout: each tenancy renders as a vertically-stacked card row showing all the same data fields in a readable, single-column format.
At md and above, the full table layout is retained for density and scannability.
Horizontal overflow is eliminated at tablet widths.

Layout summary

Viewport	Layout
< 768 px (mobile)	Card-list view
768–1024 px (tablet)	Card-list view
> 1024 px (desktop)	Full table view

Sticky Compliance Summary Bar (Recommended)

The release notes also surface a recommendation for a sticky compliance summary bar that shows the critical-issue count and remains pinned as users scroll through a long portfolio table. This ensures the most important signal — how many tenancies have critical issues — is never scrolled out of view during a review session.

This is flagged as a forward-looking improvement to be tracked for a follow-up release.

Summary

Area	Change
Regulatory Updates Banner	Per-update dismiss with localStorage persistence
Banner rendering	Conditional — hidden when all updates are dismissed
Portfolio table (< md)	Card-list fallback replaces overflow table
Sticky summary bar	Recommended for future implementation