Skip to main content

Documentation Index

Fetch the complete documentation index at: https://grantmaster.dev/llms.txt

Use this file to discover all available pages before exploring further.

Engineering reference: For service contracts, EventBus events, and data-layer details see src/features/dashboard/dashboard.md.

Dashboard

Overview

The dashboard feature manages role-based dashboard template editing — allowing administrators to configure which widgets appear for each role, in what layout, and whether those templates propagate to existing user dashboards. Individual widget implementations live in features/widgets/. The dashboard feature owns the template editor UI that assembles, reorders, and saves widget configurations per role. Entry point: DashboardTabs.tsx — serves as the page container with tabs for template roles.

Data Model

Firestore Collections

Dashboard template configurations are persisted in the organizations settings/config collection. The specific document path is managed by the widget system.
CollectionDocument typeDescription
organizations/{id}/config/dashboardTemplatesDashboardTemplatePer-role widget layout configurations

Key TypeScript Types

// Template editor modal state
interface DashboardTemplateEditorModalState {
  applyToExisting: boolean;          // Whether saving also overwrites existing user dashboards
  showAddWidgetModal: boolean;       // Controls the widget picker modal
}
The broader DashboardTemplate and Widget types are owned by features/widgets.

Key Behaviors

Template Editor

DashboardTemplateEditor (in components/DashboardTemplateEditor/) is the main editing surface. It consists of:
  • RoleTabsSection — tab strip for selecting which role’s template to edit (admin, manager, member, auditor, etc.)
  • TemplateCanvasSection — drag-and-drop canvas of current widgets for the selected role
  • AddWidgetModal — widget picker that lets admins browse and add widgets to the template
  • ActionsSection — save/discard actions, including the “apply to existing dashboards” toggle
DashboardTemplateEditorContext holds the editor’s full in-progress state (selected role, current layout, dirty flag) and is scoped to the editor session.

Apply to Existing

When saving a template, the applyToExisting flag (managed by useDashboardTemplateEditorModalState) controls whether the saved layout is also pushed to all existing user dashboards that use that role’s template, or only affects new users going forward.

Tab Structure

DashboardTabs.tsx is the top-level page component. It provides tab navigation between role templates (not rendered via tab content prop — follows the PageTabs pattern where content is rendered externally).

Service Contract

Component/HookOwnsKey interface
DashboardTemplateEditorContextIn-progress editor stateSelected role, widget list, dirty state, save/discard
useDashboardTemplateEditorModalStateModal UI stateapplyToExisting, showAddWidgetModal
ModalStateContextModal open/close stateShared between editor components
Persistence operations (saving template to Firestore) are delegated to the widgets feature’s service layer.

Events

Emitted

None. Template saves are direct Firestore writes; no EventBus events are emitted by this feature.

Consumed

None.

Dependencies

Depends on:
  • features/widgets — widget types, widget catalog, persistence service
  • contexts/TenantContext — current organization for scoping templates
  • contexts/RBACContext — role list for tab generation
Depended on by:
  • App shell routing — DashboardTabs is a route-level page component

File Structure

dashboard/
├── DashboardTabs.tsx                        # Page-level tab container
├── components/
│   └── DashboardTemplateEditor/
│       ├── ActionsSection.tsx               # Save/discard + apply-to-existing controls
│       ├── AddWidgetModal.tsx               # Widget picker modal
│       ├── DashboardTemplateEditorContext.tsx # Editor session state
│       ├── ModalStateContext.tsx            # Add-widget modal open/close
│       ├── RoleTabsSection.tsx              # Role selector tabs
│       ├── TemplateCanvasSection.tsx        # Widget layout canvas
│       └── index.tsx                        # Composed editor export
├── hooks/
│   └── useDashboardTemplateEditorModalState.ts
└── index.ts