Reports Dashboard Page
Component Detail
User Interface
medium complexity
frontend
2
Dependencies
0
Dependents
2
Entities
0
Integrations
Description
Server-side rendered Next.js page providing coordinators and organization administrators with aggregated team activity views. Displays summary stat cards for key metrics (total hours, contacts reached, activities performed), a sortable and filterable data table for detailed drill-down, and chart visualizations (bar and line) rendered client-side via Recharts. Includes filter controls for date range, local association, activity type, and individual peer mentor selection.
reports-dashboard-page
Responsibilities
- Render summary stat cards with aggregated team metrics
- Display sortable, filterable data table of team activities
- Render bar and line chart visualizations using Recharts
- Provide filter controls for date range, association, activity type, and peer mentor
- Enforce role-based view scoping (coordinator sees association, org admin sees full organization)
Interfaces
renderDashboard(filters: ReportFilters)
onFilterChange(filterType: string, value: any)
onDateRangeSelect(start: Date, end: Date)
onAssociationFilter(associationId: string)
onPeerMentorFilter(userId: string)
onActivityTypeFilter(type: string)
onSortChange(column: string, direction: SortDirection)
onPageChange(page: number)
onExportClick(format: ExportFormat)
renderStatCards(stats: TeamStats)
renderCharts(data: ChartData[])
Relationships
Dependencies (2)
Components this component depends on
Related Data Entities (2)
Data entities managed by this component