skill-elder-detail-cards

┌─────────────────────────────────────────┐
│  [Avatar circle]  Martha Williams       │
│                   86 years old    [●]   │  ← Active indicator (green dot)
│                                         │
│  Tasks: 3 remaining · 5 completed      │
│  Meds: 4/6 logged │ Meals: 2/3        │
│                                         │
│  Member Emails:                         │
│  · john.smith@email.com                 │
│  · mary.williams@email.com              │
│                                         │
│  [View Care Details →]                  │
└─────────────────────────────────────────┘

┌─────────────────────────────────────────┐
│  [FileCheck icon]  End of Day Reports   │
│                                         │
│  Auto-sent daily at 7 PM PST to        │
│  member emails listed above.            │
│                                         │
│  Last sent: Jan 22, 2026 · 7:02 PM     │
│  Status: ✓ Delivered (2 recipients)    │
│                                         │
│  Next report: Today at 7:00 PM         │
└─────────────────────────────────────────┘

'use client';

interface ElderDetailCardProps {
  elder: Elder;
  taskStats: {
    remaining: number;
    completed: number;
    medsLogged: number;
    medsTotal: number;
    mealsLogged: number;
    mealsTotal: number;
  };
  isActive?: boolean;  // Currently selected elder for this caregiver
  onViewDetails?: (elderId: string) => void;
}

// Display:
// - Avatar: first letter of name in colored circle (40px)
// - Name: 16px semibold
// - Age: calculated from elder.dateOfBirth, "~86 years old"
// - Active indicator: green dot (8px) top-right if isActive
// - Task stats: two lines showing completion
// - Member emails: from elder.reportRecipients[].email
// - "View Care Details" link → /dashboard/daily-care?elderId={id}

'use client';

interface EndOfDayReportsCardProps {
  elders: Elder[];  // All elders for this caregiver (to get recipient emails)
  caregiverId: string;
}

// Data fetching:
// Query `mail` collection for latest document where:
//   - to includes any of the reportRecipients emails
//   - createdAt is within last 24 hours
//   - template.name matches daily report template

// Display:
// - Green-themed card (bg-green-50, border-green-200)
// - FileCheck icon (green)
// - Title: "End of Day Reports"
// - Subtitle: "Auto-sent daily at 7 PM PST to member emails listed above."
// - Last sent: timestamp from mail collection
// - Status: "Delivered" (if mail.delivery.state === 'SUCCESS'), "Pending", "Failed"
// - Recipient count: total unique emails across all elders
// - Next report: "Today at 7:00 PM" or "Tomorrow at 7:00 PM" (based on current time)

Purpose: Super admin's view when they tap a caregiver from the team list

Layout:
1. Caregiver header (name, avatar, shift time)
2. "Your Elders" section heading
3. ElderDetailCard × 3 (for each assigned elder)
4. EndOfDayReportsCard (below elder cards)
5. VoiceInputArea (for super admin to dictate notes about this caregiver)
6. Quick action chips (specific to this context)

Data flow:
- caregiverId from route params or navigation state
- Fetch caregiver_assignments where caregiverId matches
- Fetch elder details for each assignment
- Fetch today's medication_logs for each elder
- Fetch latest mail document for report status

function getElderTaskStats(elderId: string, medications: Medication[], logs: MedicationLog[]): TaskStats {
  const elderMeds = medications.filter(m => m.elderId === elderId);
  const todayLogs = logs.filter(l =>
    l.elderId === elderId &&
    isToday(l.loggedAt)
  );

  const medsTotal = elderMeds.reduce((sum, m) => sum + (m.frequency.times?.length || 1), 0);
  const medsLogged = todayLogs.length;

  // Meals: check diet_entries for today
  // const mealsLogged = ... (from existing diet logging)

  return {
    remaining: medsTotal - medsLogged,
    completed: medsLogged,
    medsLogged,
    medsTotal,
    mealsLogged: mealsLogged || 0,
    mealsTotal: 3, // breakfast, lunch, dinner
  };
}

// Query the mail collection for latest report
async function getLastReportStatus(recipientEmails: string[]) {
  const mailRef = collection(db, 'mail');
  const q = query(
    mailRef,
    where('to', 'array-contains-any', recipientEmails),
    orderBy('createdAt', 'desc'),
    limit(1)
  );

  const snapshot = await getDocs(q);
  if (snapshot.empty) return null;

  const mailDoc = snapshot.docs[0].data();
  return {
    sentAt: mailDoc.createdAt?.toDate(),
    status: mailDoc.delivery?.state || 'PENDING',
    recipientCount: mailDoc.to?.length || 0,
  };
}