import { useTranslation } from '@/hooks/use-translation'; import React from 'react'; import { Head, Link } from '@inertiajs/react'; import AppLayout from '@/layouts/app-layout'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; import { Badge } from '@/components/ui/badge'; import { Users, CalendarDays, FileText, ChevronRight } from 'lucide-react'; interface CommitteeMember { id: number; first_name: string; last_name: string; pivot?: { title?: string; term_start_date?: string; term_end_date?: string; }; } interface Committee { id: number; name: string; description?: string; members: CommitteeMember[]; meetings_count: number; upcoming_meetings_count: number; pivot?: { title?: string; term_start_date?: string; term_end_date?: string; }; } interface Props { committees: Committee[]; } export default function MyCommittees({ committees }: Readonly) { const { t } = useTranslation(); return (

{t('My Committees')}

{t('Committees you are a member of')}

{committees.length > 0 ? (

{committees.map((committee) => { const isActive = !committee.pivot?.term_end_date || new Date(committee.pivot.term_end_date) >= new Date(); return (

{committee.name} {committee.description && ( {committee.description} )}

{isActive ? 'Active' : 'Expired'}

{committee.pivot?.title && (

{t('Your Role:')}{' '} {committee.pivot.title}

)}

{committee.members.length}

{t('Members')}

{committee.upcoming_meetings_count}

{t('Upcoming')}

{committee.meetings_count}

{t('Total Mtgs')}

); })}

) : (

{t('You are not currently a member of any committees')}

)}

); }