400 lines
14 KiB
Markdown
400 lines
14 KiB
Markdown
# Pilot Analytics Dashboard - Quick Reference Summary
|
|
|
|
**Project Name:** Pilot Analytics Dashboard
|
|
**Duration:** 4-5 weeks (22-27 working days)
|
|
**Target Go-Live:** Late May 2026
|
|
**Team:** Frontend (8 days setup + core delivery) + Backend parallel (8-13 days if needed)
|
|
|
|
## Source Files
|
|
|
|
This quick reference is derived from the following source files:
|
|
|
|
- Primary: `Pilot_Dashboard_PO_Brief_v1.md` (v1.5)
|
|
- Primary: `Pilot_Dashboard_Requirements_v1.md` (v1.5)
|
|
- Supporting: `plan-pilotAnalyticsDashboard.prompt.md`
|
|
- Supporting: `Pilot-Dashboard-UI-UX-Design-Specification.md`
|
|
- Supporting visual reference: `Sample Pilot Dashboard.png` and the PyQt mockup
|
|
|
|
When source documents conflict, the v1.5 PO brief and v1.5 technical requirements take precedence.
|
|
|
|
---
|
|
|
|
## At a Glance
|
|
|
|
```
|
|
┌─────────────────────────────────────────────────────────────────┐
|
|
│ TOTAL PROJECT TIMELINE │
|
|
├─────────────────────────────────────────────────────────────────┤
|
|
│ │
|
|
│ Week 1: Phase 1 (Foundation) ████░░░░░░░░░░░ [Days 1-5] │
|
|
│ Week 2: Phase 2 (Core UI) ███████░░░░░░░░░░ [Days 6-12] │
|
|
│ Week 3: Phase 3 (Analytics) ██████░░░░░░░░░░░ [Days 13-20] │
|
|
│ Week 4: Phase 4 (QA+Release) ████░░░░░░░░░░░░ [Days 21-27] │
|
|
│ Week 5: UAT & Fix ██░░░░░░░░░░░░░░░ [Days 28-30] │
|
|
│ │
|
|
└─────────────────────────────────────────────────────────────────┘
|
|
```
|
|
|
|
---
|
|
|
|
## Four Phases Overview
|
|
|
|
| Phase | Focus | Duration | Key Deliverable | Risk Level |
|
|
|-------|-------|----------|-----------------|------------|
|
|
| **Phase 1** | Foundation, API contracts, role branching | 5-6 days | Service layer + mock data + spec | Low |
|
|
| **Phase 2** | Core UI (layout, KPI, active jobs) | 7-8 days | Responsive dashboard shell | Medium |
|
|
| **Phase 3** | Charts, indicators, i18n, error handling | 6-8 days | Full-featured dashboard | Medium |
|
|
| **Phase 4** | Testing, integration, release prep | 4-5 days | Production-ready build | Low |
|
|
|
|
---
|
|
|
|
## Key Milestones
|
|
|
|
| Milestone | Date | Criteria |
|
|
|-----------|------|----------|
|
|
| **M1: Service Layer Ready** | EOW 1 (May 2) | All 5 endpoints spec'd, mocks created, service layer tested |
|
|
| **M2: UI Complete** | EOW 2 (May 9) | KPI, summary, active jobs, responsive tested |
|
|
| **M3: Analytics Complete** | EOW 3 (May 16) | Charts, indicators, i18n, error states all working |
|
|
| **M4: QA Complete** | EOW 4 (May 23) | E2E tests pass, cross-browser OK, performance audit complete |
|
|
| **M5: Release Ready** | Mid-May 28 | Staging deployment, UAT approved, release notes ready |
|
|
|
|
---
|
|
|
|
## Phase Breakdown (Quick View)
|
|
|
|
### Phase 1: Foundation (Days 1-6)
|
|
**Tasks:** 7
|
|
**Components:** 0 (service layer only)
|
|
**Deliverables:** Dashboard service, mock data, backend spec
|
|
```
|
|
Day 1: Extend JobStatus enum
|
|
Days 2-3: Dashboard service + contracts
|
|
Day 4: Role-based home branching
|
|
Days 5-6: Backend API spec
|
|
```
|
|
|
|
### Phase 2: Core UI (Days 7-14)
|
|
**Tasks:** 11
|
|
**Components:** 3 (KPI card, summary, active jobs)
|
|
**Deliverables:** Responsive layout, all primary sections
|
|
```
|
|
Day 7: Layout shell
|
|
Days 8-9: KPI + summary strips
|
|
Days 10-12: Active jobs panel with interactions
|
|
Days 13-14: Responsive + accessibility testing
|
|
```
|
|
|
|
### Phase 3: Analytics & Polish (Days 15-22)
|
|
**Tasks:** 12
|
|
**Components:** 2 new (charts, indicators) + refinements
|
|
**Deliverables:** Charting, performance metrics, full i18n, error handling
|
|
```
|
|
Days 15-16: Charts + date range control
|
|
Days 17-18: Performance indicators (XT, altitude)
|
|
Days 19-20: Loading/empty/error states
|
|
Days 21-22: i18n localization (EN/PT/ES)
|
|
```
|
|
|
|
### Phase 4: QA & Release (Days 23-27)
|
|
**Tasks:** 9
|
|
**Components:** 0 (QA & testing focus)
|
|
**Deliverables:** Tested, documented, production build
|
|
```
|
|
Days 23-24: Integration & E2E testing
|
|
Days 25-26: Cross-browser + perf testing
|
|
Day 27: Documentation & release prep
|
|
```
|
|
|
|
---
|
|
|
|
## File Structure (Expected)
|
|
|
|
```
|
|
src/app/dashboard/
|
|
├── dashboard.component.ts (updated: role branching)
|
|
├── dashboard.component.html (updated: template branching)
|
|
├── dashboard.component.css (minimal changes)
|
|
│
|
|
├── pilot-dashboard/ (NEW FOLDER)
|
|
│ ├── pilot-dashboard.component.ts (main container)
|
|
│ ├── pilot-dashboard.component.html
|
|
│ └── pilot-dashboard.component.scss
|
|
│
|
|
└── components/ (NEW FOLDER)
|
|
├── kpi-card/
|
|
│ ├── kpi-card.component.ts
|
|
│ ├── kpi-card.component.html
|
|
│ └── kpi-card.component.scss
|
|
│
|
|
├── daily-summary/
|
|
│ ├── daily-summary.component.ts
|
|
│ ├── daily-summary.component.html
|
|
│ └── daily-summary.component.scss
|
|
│
|
|
├── operations-today/
|
|
│ ├── operations-today.component.ts
|
|
│ ├── operations-today.component.html
|
|
│ └── operations-today.component.scss
|
|
│
|
|
├── active-jobs/
|
|
│ ├── active-jobs.component.ts
|
|
│ ├── job-row.component.ts
|
|
│ ├── active-jobs.component.html
|
|
│ └── active-jobs.component.scss
|
|
│
|
|
├── hours-chart/
|
|
│ ├── hours-chart.component.ts
|
|
│ ├── hours-chart.component.html
|
|
│ └── hours-chart.component.scss
|
|
│
|
|
├── hectares-chart/
|
|
│ ├── hectares-chart.component.ts
|
|
│ ├── hectares-chart.component.html
|
|
│ └── hectares-chart.component.scss
|
|
│
|
|
├── date-range-selector/
|
|
│ ├── date-range-selector.component.ts
|
|
│ ├── date-range-selector.component.html
|
|
│ └── date-range-selector.component.scss
|
|
│
|
|
├── xt-error-indicator/
|
|
│ ├── xt-error-indicator.component.ts
|
|
│ ├── xt-error-indicator.component.html
|
|
│ └── xt-error-indicator.component.scss
|
|
│
|
|
└── altitude-indicator/
|
|
├── altitude-indicator.component.ts
|
|
├── altitude-indicator.component.html
|
|
└── altitude-indicator.component.scss
|
|
|
|
src/app/domain/
|
|
├── models/
|
|
│ └── pilot-dashboard.model.ts (NEW: TS interfaces)
|
|
│
|
|
└── services/
|
|
└── pilot-dashboard.service.ts (NEW: API service)
|
|
└── pilot-dashboard.service.spec.ts (NEW: tests)
|
|
|
|
src/app/shared/
|
|
├── mock/
|
|
│ └── pilot-dashboard-mock.ts (NEW: mock data)
|
|
│
|
|
└── global.ts (UPDATED: JobStatus enum)
|
|
|
|
docs/
|
|
├── PILOT_DASHBOARD_ROADMAP.md (THIS FILE)
|
|
├── PILOT_DASHBOARD_TASK_CHECKLIST.md
|
|
└── PILOT_DASHBOARD_API_SPEC.md (NEW: backend contract)
|
|
```
|
|
|
|
---
|
|
|
|
## Total Code Changes Summary
|
|
|
|
| Category | Lines Changed | Impact |
|
|
|----------|----------------|--------|
|
|
| **New TypeScript** | ~1500-2000 | 8-10 new component classes + service |
|
|
| **New Templates** | ~800-1200 | HTML for 8 components |
|
|
| **New Styles** | ~600-800 | SCSS for responsive layout + indicators |
|
|
| **Updated Files** | ~150-200 | global.ts, dashboard.component.* |
|
|
| **Tests** | ~1000-1500 | Jasmine specs for service + components |
|
|
| **Documentation** | ~500 | API spec + user guide + comments |
|
|
| **Total** | **~4500-6700** | 12-18 feature files + 2-3 updated files |
|
|
|
|
---
|
|
|
|
## PR Strategy (4 PRs Total)
|
|
|
|
| PR | Phase | Files Changed | Commits | Review Focus |
|
|
|----|-------|----------------|---------|--------------|
|
|
| **PR1** | Foundation | 5-10 files | 4 commits | Service layer, constants, role gating |
|
|
| **PR2** | Core UI | 15-20 files | 3 commits | Layout, KPI, active jobs, responsive |
|
|
| **PR3** | Analytics | 10-15 files | 3 commits | Charts, indicators, i18n, error handling |
|
|
| **PR4** | Release | 5-10 files | 3 commits | Tests, docs, final polish, build |
|
|
|
|
---
|
|
|
|
## Success Criteria Checklist
|
|
|
|
**Functionality:**
|
|
- [ ] Pilot users see new dashboard (role isolation works)
|
|
- [ ] Non-pilots see original disclaimer (backward compatible)
|
|
- [ ] All 5 API endpoints wired and displaying data
|
|
- [ ] Active jobs clickable → navigate to job detail
|
|
- [ ] Charts render with date range control
|
|
- [ ] Performance indicators show correct color bands
|
|
- [ ] i18n works (EN, PT, ES selectable)
|
|
|
|
**Quality:**
|
|
- [ ] No console errors or warnings
|
|
- [ ] Performance audit completed
|
|
- [ ] Mobile responsive (320px - 1920px)
|
|
- [ ] Cross-browser (Chrome, Safari, Firefox, Edge)
|
|
- [ ] Accessibility: WCAG AA compliant
|
|
- [ ] Appropriate dashboard test coverage added
|
|
|
|
**Release Readiness:**
|
|
- [ ] Production build succeeds for all locales
|
|
- [ ] No breaking changes to existing features
|
|
- [ ] Documentation complete (user guide + tech docs)
|
|
- [ ] Release notes published
|
|
- [ ] Staging deployment successful
|
|
|
|
---
|
|
|
|
## Top Risks & Mitigations
|
|
|
|
| Risk | Probability | Impact | Mitigation |
|
|
|------|-------------|--------|-----------|
|
|
| Backend endpoints not ready | Medium | Phase 4 blocked | Use mock data through Phase 3; swap at integration |
|
|
| i18n extraction tool issues | Low | Phase 3 delayed | Pre-test localization workflow in Phase 1 |
|
|
| Chart library compatibility | Low | Phase 3 blocked | Verify chart.js 2.9.3 + PrimeNG 9 integration early |
|
|
| Mobile responsive issues late | Medium | Phase 4 delayed | Test mobile throughout Phase 2, not at end |
|
|
| Job detail route not working | Low | Phase 2 blocker | E2E test navigation at end of Phase 2 |
|
|
| Status enum break existing jobs | High | Regression | Coordinate with backend; test all statuses |
|
|
|
|
---
|
|
|
|
## Communication Plan
|
|
|
|
**Daily Standup:**
|
|
- 10 mins, same time each day
|
|
- Report: completed, in-progress, blockers
|
|
- Update task checklist
|
|
|
|
**Weekly Demo (Friday EOD):**
|
|
- Show completed phase sections to PO/team
|
|
- Gather feedback for next phase
|
|
- Update roadmap if needed
|
|
|
|
**Backend Sync (if parallel):**
|
|
- Mon & Thu: align on API spec and integration readiness
|
|
- Verify mock data contracts match backend plan
|
|
|
|
---
|
|
|
|
## Development Setup Checklist
|
|
|
|
- [ ] Clone repo / pull latest
|
|
- [ ] `npm install` dependencies
|
|
- [ ] `ng serve` runs without errors
|
|
- [ ] Verify existing tests pass: `ng test`
|
|
- [ ] Read PILOT_DASHBOARD_API_SPEC.md (when created in Phase 1)
|
|
- [ ] Review requirements docs in `/attachments/`
|
|
- [ ] Have Pilot Dashboard UI mockup open (reference)
|
|
- [ ] Setup code editor: prettier, tslint extensions
|
|
- [ ] Create feature branch: `git checkout -b feature/pilot-dashboard`
|
|
|
|
---
|
|
|
|
## Key Decisions Made (Frozen for Phase 1)
|
|
|
|
1. **Active Jobs Display:** UI states are NEW, IN PROGRESS, COMPLETED, where IN PROGRESS groups READY, DOWNLOADED, and SPRAYED backend states.
|
|
2. **Altitude Priority:** sprayHeight → radarAlt → no-data state
|
|
3. **Operations Today:** Distance and spray volume only in Phase 1; Flights Today is excluded due to unreliable source data.
|
|
4. **i18n:** EN/PT/ES from day 1
|
|
5. **Charts:** PrimeNG p-chart (wraps chart.js 2.9.3)
|
|
6. **Status Colors:** Blue (NEW), Yellow (IN PROGRESS), Green (COMPLETED)
|
|
|
|
---
|
|
|
|
## Quick Start Commands
|
|
|
|
```bash
|
|
# Clone and setup
|
|
git clone <repo>
|
|
cd client
|
|
npm install
|
|
|
|
# Development
|
|
npm start # http://localhost:4200
|
|
|
|
# Testing
|
|
ng test # Unit tests
|
|
ng test --code-coverage
|
|
ng lint
|
|
|
|
# Build
|
|
ng build --prod --localize # Production + all locales
|
|
|
|
# i18n workflow
|
|
npm run sync-i18n # Extract + merge
|
|
|
|
# Useful for reference
|
|
cat docs/PILOT_DASHBOARD_ROADMAP.md # Detailed roadmap
|
|
cat docs/PILOT_DASHBOARD_TASK_CHECKLIST.md # Detailed tasks
|
|
cat docs/PILOT_DASHBOARD_API_SPEC.md # Backend contract (Phase 1.6)
|
|
```
|
|
|
|
---
|
|
|
|
## Related Documents
|
|
|
|
- **docs/PILOT_DASHBOARD_ROADMAP.md** ← Full detailed roadmap
|
|
- **docs/PILOT_DASHBOARD_TASK_CHECKLIST.md** ← Day-by-day task checklist
|
|
- **Pilot_Dashboard_PO_Brief_v1.md** ← Business requirements (in attachments)
|
|
- **Pilot_Dashboard_Requirements_v1.md** ← Technical spec (in attachments)
|
|
- **Pilot-Dashboard-UI-UX-Design-Specification.md** ← Design rules (in attachments)
|
|
- **Sample Pilot Dashboard.png** ← Reference mockup (in attachments)
|
|
|
|
---
|
|
|
|
## Verification Checklist (End of Each Phase)
|
|
|
|
### End of Phase 1
|
|
- [ ] Service layer complete and tested
|
|
- [ ] Mock data provider ready
|
|
- [ ] Backend API spec documented and approved
|
|
- [ ] Role branching working (pilot sees placeholder, others see disclaimer)
|
|
- [ ] All Phase 1 PRs merged
|
|
|
|
### End of Phase 2
|
|
- [ ] All UI sections render correctly
|
|
- [ ] Layout responsive on all breakpoints
|
|
- [ ] KPI cards, summary, operations, active jobs all visible
|
|
- [ ] Job row clicks navigate to job detail
|
|
- [ ] Accessibility audit passed
|
|
- [ ] All Phase 2 PRs merged
|
|
|
|
### End of Phase 3
|
|
- [ ] Charts render and respond to date range changes
|
|
- [ ] Performance indicators show data with correct thresholds
|
|
- [ ] i18n working (all 3 languages)
|
|
- [ ] Error and loading states display correctly
|
|
- [ ] No console errors
|
|
- [ ] All Phase 3 PRs merged
|
|
|
|
### End of Phase 4
|
|
- [ ] Integration testing passed
|
|
- [ ] Cross-browser testing passed
|
|
- [ ] E2E tests passed
|
|
- [ ] Performance audit completed
|
|
- [ ] Production build succeeds for all locales
|
|
- [ ] Documentation complete
|
|
- [ ] All Phase 4 PRs merged
|
|
- [ ] Ready for staging deployment
|
|
|
|
---
|
|
|
|
## Effort Distribution
|
|
|
|
```
|
|
Foundation & Contracts: 22% (5-6 days)
|
|
├─ Service layer, models, role gating
|
|
|
|
Core UI Delivery: 30% (7-8 days)
|
|
├─ Layout, KPI, summary, active jobs
|
|
|
|
Analytics & Polish: 28% (6-8 days)
|
|
├─ Charts, indicators, i18n, error handling
|
|
|
|
QA & Release: 20% (4-5 days)
|
|
├─ Testing, documentation, build prep
|
|
```
|
|
|
|
---
|
|
|
|
**Status:** Ready to Start
|
|
**Created:** April 28, 2026
|
|
**Last Updated:** April 28, 2026
|