Dashboards
Build custom dashboards with drag-and-drop widget grids. 33 widget types covering metrics, charts, tables, content blocks, and workflow embeds. Dashboards support date-range filtering, auto-refresh, global filters, and JSON import/export.
Creating Dashboards
- A default overview dashboard is provisioned when your workspace is created.
- Click + New Dashboard in the sidebar to create additional dashboards.
- Dashboards can be grouped into bases (folder containers) for organisation.
- Star dashboards to pin them to the top of the sidebar.
Adding Widgets
- Click the + Add Widget button in the dashboard toolbar.
- Choose a widget type from the palette (metrics, charts, tables, content).
- Configure the data source: select which entity to query (matters, tables, submissions, audit log, or accounting data).
- Set aggregation, grouping, and filters.
- Customise appearance: title, subtitle, colours, legend, sparklines.
- Position and resize the widget on the canvas by dragging.
Widget Types
| Category | Types |
|---|---|
| Metrics | metric, kpi_scorecard, gauge, sparkline, progress_bar, progress_ring, comparison, countdown |
| Charts | line_chart, bar_chart, area_chart, pie_chart, stacked_bar_chart, radar_chart, scatter_chart, funnel_chart, treemap_chart, heatmap, waterfall_chart, combo_chart |
| Tables & lists | table_grid, leaderboard, status_breakdown, activity_feed, pending_matters, pending_actions, team_workload |
| Content | text_block, image_block |
| Workflow | state_machine (matter phases), entity_embed (form / matter / table / document / workflow), widget_group (canvas group) |
Each widget binds data at the widget level. To customise a widget, use the Layers, Data, and Appearance tabs in the editor sidebar. The Appearance tab is generated from each widget's typed schema, so the controls you see are the controls that widget actually honours.
Canvas Controls
- Drag widgets to reposition them on the freeform pixel-based canvas.
- Resize by dragging the bottom-right handle.
- Snap to grid is enabled by default (20px grid) - hold Shift to disable temporarily.
- Zoom with Ctrl+scroll or the zoom controls in the toolbar.
- Pan with middle-click drag or by holding Space and dragging.
- Z-index - right-click a widget to bring to front or send to back.
Date Range and Filtering
- Use the date range picker in the toolbar to filter all widgets by time period.
- Presets: Last 7 days, 30 days, 90 days, This month, This quarter, Year to date, Custom.
- Global filters apply to all compatible widgets simultaneously.
- Each widget can also have its own per-widget filters.
Today Pending Actions Deck
The Today dashboard's Pending Actions card uses a custom CSS deck rather than Swiper. Slides are absolutely positioned, and inactive slides are hidden with opacity: 0; the section itself should not be used as an overflow: hidden mask because that clips the receipt card border.
The date-range chip is applied to pending actions as a bounded due-date window. Last 7 days, Last 30 days, and Last 90 days include work overdue within that many days and work due within the next same number of days. All time removes that due-date window. The default Due soon filter is separate and limits the deck to work due within the next seven days until the user clears or replaces it.
Keep these layout constraints in place when editing the deck:
- Prevent page-level horizontal scroll at the Today dashboard root with
overflow-x-hidden; do not make the matter column a horizontal scroll container or offset it with negative margins. - Clamp the Today dashboard root
scrollLeftto0. Hidden horizontal overflow can still be moved programmatically by focus or scroll APIs, leaving the card content visually offset. - Keep the active and previous-card states inside the matter column's content box. Off-left transforms, even on
opacity: 0slides, can enlarge scrollable overflow and make the active card appear left-clipped. - If a future design needs visible off-left motion, reserve the space outside the matter column first; do not fake it with a negative margin on the column itself.
- Do not use
scrollIntoView()inside the card body for active-step positioning. It can scroll horizontal ancestors as well as the intended vertical list. SetscrollTopon the intended vertical scroller instead. - Keep the matter deck in a lower stacking context than the right sidebar. Incoming cards may translate to the right during navigation, but they should pass behind the sidebar rail, not over it.
Import and Export
- Switch to JSON mode in the editor to view/edit the raw dashboard config.
- Export dashboards as
.jsonfiles to share or back up. - Import a JSON file to restore or clone a dashboard configuration.