Home Dashboard

Student Switcher

The home screen's top section shows the currently selected student. If a parent has multiple children linked, a dropdown or horizontal list allows switching between students. The entire dashboard refreshes to show data for the selected student.

// lib/modules/home/view/home_screen.dart
class HomeScreen extends ConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final selectedStudent = ref.watch(selectedStudentProvider);
    final studentList = ref.watch(studentListProvider);

    return Column(
      children: [
        // Student switcher strip
        StudentSwitcher(
          students: studentList,
          selected: selectedStudent,
          onChanged: (student) {
            ref.read(selectedStudentProvider.notifier).state = student;
            // Refetch all data for new student
            ref.invalidate(attendanceProvider);
            ref.invalidate(examResultsProvider);
            ref.invalidate(feeBalanceProvider);
          },
        ),
        // Dashboard content
        Expanded(child: DashboardContent(student: selectedStudent)),
      ],
    );
  }
}

Quick Tiles

Below the student switcher is a grid of quick-access tiles, each navigating to a feature module:

Tile	Icon	Navigates To
Attendance	Icons.calendar_today	Attendance
Results	Icons.assessment	Exams
Fees	Icons.account_balance_wallet	Fees
Announcements	Icons_campaign	Announcements
Timetable	Icons.schedule	Timetable
Leave	Icons.event_busy	Leaves
Messages	Icons.message	Messages
Teachers	Icons.school	Teachers

Dashboard Content

The main body shows:

• Latest Attendance — today's attendance status or most recent day's status
• Upcoming Exams — next exam date + subject (if any)
• Fee Balance — outstanding amount with a "Pay Now" CTA if > 0
• Recent Announcement — most recent announcement title + time
• Upcoming Events — next 2-3 events from the calendar

Each section has a "View All" link that navigates to the respective module.

Loading & Error States

// All providers follow this pattern
final attendanceProvider = FutureProvider.autoDispose<AttendanceRecord>((ref) async {
  final student = ref.watch(selectedStudentProvider);
  return ref.read(attendanceRepositoryProvider).getAttendance(student.id);
});

// In the UI
attendance.when(
  data: (record) => AttendanceCard(record: record),
  loading: () => const ShimmerCard(),
  error: (e, _) => ErrorCard(message: e.toString(), onRetry: () => ref.invalidate(attendanceProvider)),
);