1. Examples
  2. States

Operational States

The non-happy-path surfaces B2B apps actually need

Empty vs no-results, loading, error, permission, activity history, files, and system notifications all in one place.

No saved views

This is the create-first empty state. Use it when a user has not configured anything yet.

No records matched these filters

This is intentionally quieter than the empty state. The system has data, but this particular query did not find any.

Refreshing the review queue

Use a clear loading state for longer-running data refreshes instead of leaving a blank card.

Permission and Locked States

Finance Manager role required

This action is available only to users who can approve exports above $50,000.

Record is locked for nightly sync

Use the locked state for records that are temporarily unavailable because another process owns them.

Toasts and Side Feedback

An inline auto-refresh widget works well on queue and review pages where fresh data matters but the control should stay out of the main action area.

Queue refresh in 300s

View saved

The shared queue filter is now available to the AP Team.

Background import still running

Use ephemeral notifications for asynchronous work that succeeded, failed, or is still in motion.

Activity Timeline

Imported from OpenPay

System
8:13 AM Nightly sync Sam McAravey

The payload normalized successfully and routed to the Needs Review queue.

Waiver verification still pending

Review
8:19 AM Compliance rule

This timeline variant works better than a plain list once actor, timestamp, and status all matter together.

Assigned to AP Team

Queue
8:22 AM Routing rule

Use this for audit-heavy pages where the sequence of events matters as much as the final state.

Files and Documents

Drop waivers or billing support here

Use this for document-centric flows where operators collect several files before submission.

conditional-waiver-march.pdf

PDF • 1.8 MB • uploaded 8:28 AM

Verified

insurance-certificate.pdf

PDF • 420 KB • expires in 14 days

Expiring