6.5 KiB
Epic 7: Client Dashboard
Epic Goal
Create a client portal where logged-in clients can view their consultations, case timelines, profile information, and book new consultations.
Epic Description
Business Context
Clients need a simple, intuitive interface to access their information and services. They can view (but not modify) their profile, see upcoming and past consultations, track case progress through timelines, and request new consultations.
Technical Context
- Access: Authenticated clients only
- Capabilities: Read-mostly (can only submit bookings)
- Restrictions: Cannot edit profile, cancel bookings, or comment
- Design: Mobile-friendly, professional
Success Criteria
- Client overview dashboard
- View upcoming and past consultations
- Download calendar files
- View case timelines (read-only)
- View profile information
- Submit new booking requests
- Booking limit enforcement (1 per day)
- Responsive mobile design
Stories
Story 7.1: Client Dashboard Overview
Description: Main dashboard page for clients showing key information at a glance.
Acceptance Criteria:
- Welcome message with client name
- Upcoming Consultations Widget:
- Next consultation date/time
- Type (free/paid)
- Status
- Quick link to details
- Active Cases Widget:
- Count of active timelines
- Latest update preview
- Link to full list
- Recent Updates Widget:
- Last 3 timeline updates (across all cases)
- Case name and date
- Link to full timeline
- Booking Status Widget:
- Pending booking requests
- Daily booking limit indicator
- Quick book button
- Clean, card-based layout
- Bilingual content
Technical Notes:
- Scoped to authenticated user's data only
- Use Livewire components for widgets
- Mobile-first responsive design
Story 7.2: My Consultations View
Description: List of all client's consultations (upcoming and past).
Acceptance Criteria:
- Upcoming Consultations Section:
- Date and time
- Consultation type (free/paid)
- Status (approved/pending)
- Payment status (for paid)
- Download .ics calendar file button
- Pending Requests Section:
- Submitted bookings awaiting approval
- Submission date
- Problem summary preview
- Status: "Pending Review"
- Past Consultations Section:
- Historical consultations
- Status (completed/cancelled/no-show)
- Date and type
- Visual status indicators
- Sort by date (default: newest first for past)
- Pagination if many consultations
- No edit/cancel capabilities
Technical Notes:
- Filter by authenticated user
- Group by status categories
- Calendar download from Epic 3
Story 7.3: My Cases/Timelines View
Description: List and detail view of client's case timelines.
Acceptance Criteria:
- Active Cases Section:
- List of active timelines
- Case name and reference
- Last update date
- Update count
- "View" button
- Archived Cases Section:
- Clearly separated from active
- Different visual styling (muted)
- Still accessible for viewing
- Individual Timeline View:
- Case name and reference
- Status badge (active/archived)
- All updates in chronological order
- Each update shows:
- Date and time
- Update content
- Read-only (no interactions)
- Back to cases list navigation
- Responsive layout
Technical Notes:
- Reuse components from Epic 4
- Read-only view only
- Proper date formatting per locale
Story 7.4: My Profile View
Description: Display client's profile information (read-only).
Acceptance Criteria:
- Individual Client Profile:
- Full name
- National ID
- Email address
- Phone number
- Preferred language
- Account created date
- Company Client Profile:
- Company name
- Registration number
- Contact person name
- Contact person ID
- Email address
- Phone number
- Preferred language
- Account created date
- Account type indicator
- No edit capabilities
- Message: "Contact admin to update your information"
- Logout button
Technical Notes:
- Display based on user_type
- Mask sensitive data if needed (e.g., partial ID)
Story 7.5: New Booking Interface
Description: Interface for clients to submit new consultation booking requests.
Acceptance Criteria:
- Quick access from dashboard
- Calendar view showing available dates
- Available time slots for selected date
- Booking Form:
- Selected date/time (display)
- Problem summary (required, textarea)
- Submit button
- Validation:
- Enforce 1 booking per day limit
- Show warning if already booked that day
- Prevent booking on unavailable slots
- Confirmation before submission
- Success message with "Pending Review" status
- Redirect to consultations list
Technical Notes:
- Reuse availability calendar from Epic 3
- Client-side validation + server-side enforcement
- Check existing bookings for same day
Story 7.6: Booking Limit Indicator
Description: Visual indicator of client's booking status and limits.
Acceptance Criteria:
- Show on dashboard and booking page
- Display current booking status:
- "You can book a consultation today"
- "You already have a booking for today"
- "You have a pending request for [date]"
- Calendar shows booked days as unavailable
- Clear messaging about 1-per-day limit
- Bilingual messages
Technical Notes:
- Query consultations for user
- Consider future bookings in calculation
Dependencies
| Epic | Dependency |
|---|---|
| Epic 1 | Authentication, base UI |
| Epic 2 | User accounts (client data) |
| Epic 3 | Consultation data, booking interface |
| Epic 4 | Timeline data |
Risks & Mitigations
| Risk | Impact | Mitigation |
|---|---|---|
| Confusion over read-only restrictions | Medium | Clear messaging, contact admin prompts |
| Mobile usability issues | Medium | Thorough mobile testing |
| Booking limit bypass attempts | Low | Server-side validation always |
Definition of Done
- All stories completed with acceptance criteria met
- Dashboard displays accurate data
- Consultations list works correctly
- Timelines display read-only
- Profile shows correct information
- Booking limit enforced
- Calendar files downloadable
- Mobile responsive verified
- Bilingual support verified
- Code formatted with Pint