Data management

Table and CRUD patterns

Advanced table grammar: saved views, sorting, column visibility, CRUD, bulk actions and state recovery.

Advanced specimen
Pattern

Saved views

Persist mental models: executive, risk, billing and custom operational slices.

Pattern

Sorting

Use aria-sort and visible direction. Sorting is table state, not decoration.

Pattern

Column visibility

Let users reduce density without losing row actions or recovery paths.

Pattern

Bulk actions

Selection reveals a toolbar with count, clear and confirmation for destructive work.

Pattern

CRUD surfaces

Add/edit use form sheets; delete uses confirmation; view preserves list context.

Pattern

State coverage

Loading, empty, no-results and recoverable errors are part of the component contract.

Customer risk table

Desktop table with mobile-friendly cards and visible row actions.

5 rows

Executive view

Lifecycle, risk and owner for leadership review. Sorted by customer ascending.

Scale · Mateo Silva

Pending

Risk level: Medium

Team · Iris Vega

Suspended

Risk level: High

Enterprise · Nora Chen

Active

Risk level: Low

Enterprise · Ana Lopez

Active

Risk level: Low

Scale · Theo Ruiz

Active

Risk level: Medium

Loading state

Use skeleton rows or a contained spinner when data is refreshing without hiding table structure.

Empty state

Explain what creates the first record and keep the primary Add action nearby.

No results

Keep filters visible and offer a clear path back to the saved view.

Recoverable error

State what failed, preserve current data if safe, and provide retry instead of a blank table.