# Demo Walkthrough Guide — Mutare Primary School Portal

This walkthrough provides a step-by-step presentation script you can use when demoing the NextGen School Management System to a primary school Headmaster.

---

## Preparation: Reset and Seed the Database

Before starting the demo, run the demo seeding script to populate the system with realistic data:
```bash
# Navigate to the repo root
cd C:\Users\fchin\Documents\AfricaAlert\africa-alert-pwa

# Execute the demo seed script
node demo/seed.js
```

This populates the system with **Mutare Primary School** details, including Grade 1 to 7 class groups, ZIMSEC primary subjects, realistic fee balances, announcements, and calendar events.

---

## Demo Script Steps

### Step 1: Secure Authentication
1. Open the browser to the portal login page: `http://localhost:3000/login`.
2. **Key Talking Point**: Explain that the system is fully secure and role-aware, enforcing strict authenticated access only.
3. Click the **Demo Profile** dropdown. Select **SCHOOL ADMIN** (fills in `admin@mutareprimary.ac.zw`).
4. Click **Secure Authorization** to log in.

---

### Step 2: The Communication Hub (Notice Board)
1. In the sidebar, click **Notice Board**.
2. **Key Talking Point**: Showcase the clean, modern card layout. Point out the **ZIMSEC Grade 7 Registration Fee Notice** (targeted at Parents) and the **Sanitation Measures Update** (marked with a solid red pill and warning icon for "Emergency").
3. Click **Create Notification** (top right).
4. Fill in the Form:
   - **Notification Header**: `Grade 7 Graduation Ceremony Dates`
   - **Intel Content**: `We are pleased to announce that the end-of-year Grade 7 graduation ceremony will be held on December 4th. Graduation fees must be settled by October.`
   - **Category**: `Administration`
   - **Priority**: `Normal`
   - **Audience**: `Parents`
   - **Expiry Date**: Select next Monday (e.g. `2026-07-20`).
5. Click **Finalize**.
6. **Key Talking Point**: Point out how the notice board updates instantly, displaying the new graduation announcement with a badge that says `Expires: 2026-07-20`. Show how easily admins can publish target bulletins.

---

### Step 3: Finance and Fee Collection (Bursar view)
1. Log out by clicking the profile at the bottom and clicking log out, or select the **Bursar** demo profile on the login screen (`bursar@mutareprimary.ac.zw`).
2. Navigate to **Finance Dashboard**.
3. **Key Talking Point**: Explain how fee collection handles Zimbabwean school structures. Show the tuition billing for `Nyasha Moyo` ($250.00 billed, $150.00 paid, status: `partial`) and `Tatenda Banda` ($250.00 outstanding, status: `unpaid`).
4. Explain how Paynow integration facilitates seamless online payments that instantly reconcile back to the student records.

---

### Step 4: The Headmaster/Principal Overview
1. Log in using the **PRINCIPAL** demo profile (`headmaster@mutareprimary.ac.zw`).
2. Navigate to **Reports** page.
3. **Key Talking Point**: Point out the **Student Population Trend** area chart. Explain that this dashboard gives the Head a real-time overview of active registrations, completion metrics, and growth trends. Highlight the small note stating `Phase 2 will add real series` to demonstrate how the platform is continuously expanding.

---

### Step 5: Data Integrity (Sync Core)
1. Log in as the **SYSTEMS ADMIN** demo profile (`sysadmin@school.com`).
2. Navigate to **Sync Logs** (or `System Logs`).
3. **Key Talking Point**: Explain that the application is **offline-first**. Teachers in classrooms can take attendance and write grades without internet. Once the school network is online, the sync engine pushes local records to the secure cloud back-end automatically. Show the logs tracking table names and sync states.