@propriety/court-calendar 0.0.0

package/src/_components/List/CalendarList.tsx

@@ -0,0 +1,288 @@
+import { getCountyName, getTownshipName } from '@/helpers/munis';
+import { HearingType, Lifecycle, type Case, type CourtDate } from '@/types';
+import { DataGrid, type GridColDef } from '@mui/x-data-grid';
+import FirstSecondChairIcons from '../Shared/FirstSecondChairIcons';
+import { isCaseSettled } from '@/helpers/cases';
+import { isVillageDate } from '@/helpers/courtDates';
+
+export default function CalendarList({
+    filteredDates,
+    setSelectedDate,
+    currentDate,
+    onUpdateChair,
+    allCases,
+}: {
+    filteredDates: CourtDate[];
+    setSelectedDate: (date: CourtDate) => void;
+    currentDate: Date;
+    onUpdateChair?: (courtDateId: number, position: 'first' | 'second', userId: number | null) => void;
+    allCases: Record<string, Case[]>;
+}) {
+    const countyColors: Record<string, string> = {
+        Blank: '#c4c4c4',
+        Suffolk: '#faa1f1',
+        Sullivan: '#00c875',
+        Westchester: '#df2f4a',
+        Ulster: '#225091',
+        Columbia: '#9d50dd',
+        Rockland: '#037f4c',
+        Putnam: '#579bfc',
+        Nassau: '#cab641',
+        Greene: '#9cd326',
+        Dutchess: '#ffcb00',
+        Orange: '#ff6d3b',
+        Delaware: '#bb3354',
+    };
+
+    const typeColors: Record<string, string> = {
+        'Court Dates': '#216edf',
+        Negotiations: '#33d391',
+    };
+
+    const statusColors: Record<string, string> = {
+        Blank: '#c4c4c4', // default
+        Reviewing: '#fdab3d', // dateCompleted not set
+        Scheduled: '#216edf', // Lifecycle.SCHEDULED or Lifecycle.ASSIGNED
+        'NYSCEF Uploaded': '#037f4c', // Status.UPLOADED
+        Adjourned: '#faa1f1', // isAdjourned true
+        'Settled/Decision': '#df2f4a', // isCaseSettled true
+    };
+
+    function determineStatus(date: CourtDate): string {
+        let allSettled = true;
+        let allReviewed = true;
+        for (const caseItem of allCases[date.CourtDateID] || []) {
+            if (allSettled && !isCaseSettled(caseItem, isVillageDate(date.MuniCode))) {
+                allSettled = false;
+            }
+            if (allReviewed && caseItem.DateCompleted === null) {
+                allReviewed = false;
+            }
+        }
+
+        if (!allReviewed) return 'Reviewing';
+        if (allSettled) return 'Settled/Decision';
+        if (date.Lifecycle === Lifecycle.UPLOADED) return 'NYSCEF Uploaded';
+        if (date.Lifecycle === Lifecycle.ADJOURNED) return 'Adjourned';
+        if (date.Lifecycle === Lifecycle.SCHEDULED || date.Lifecycle === Lifecycle.ASSIGNED) return 'Scheduled';
+
+        return 'Blank';
+    }
+
+    function determineLocation(date: CourtDate): string {
+        if (date.Type === HearingType.IN_PERSON) return 'In Person';
+        if (date.Type === HearingType.UNKNOWN) return 'Unknown';
+        return 'Virtual';
+    }
+
+    const locationColors: Record<string, string> = {
+        Virtual: 'var(--fc-event-virtual-color)',
+        'In Person': 'var(--fc-event-inperson-color)',
+        Unknown: 'var(--fc-event-unknown-color)',
+    };
+
+    const columns: GridColDef[] = [
+        {
+            field: 'township',
+            headerName: 'Municipality',
+            width: 150,
+            disableColumnMenu: true,
+        },
+        {
+            field: 'county',
+            headerName: 'County',
+            width: 125,
+            disableColumnMenu: true,
+            renderCell: (params) => {
+                const county = params.value as string;
+                const color = countyColors[county] || '#c4c4c4';
+                return (
+                    <span
+                        style={{
+                            backgroundColor: color,
+                            color: '#fff',
+                            padding: '4px 8px',
+                            borderRadius: '4px',
+                            fontWeight: 'bold',
+                            border: `1px solid`,
+                        }}
+                    >
+                        {county}
+                    </span>
+                );
+            },
+        },
+        {
+            field: 'type',
+            headerName: 'Type',
+            width: 125,
+            disableColumnMenu: true,
+            renderCell: (params) => {
+                const type = params.value as string;
+                const color = typeColors[type] || '#c4c4c4';
+                return (
+                    <span
+                        style={{
+                            backgroundColor: color,
+                            color: '#fff',
+                            padding: '4px 8px',
+                            borderRadius: '4px',
+                            fontWeight: 'bold',
+                            border: `1px solid`,
+                        }}
+                    >
+                        {type}
+                    </span>
+                );
+            },
+        },
+        {
+            field: 'district',
+            headerName: 'District',
+            width: 75,
+            disableColumnMenu: true,
+        },
+        {
+            field: 'numCases',
+            headerName: '# Cases',
+            width: 75,
+            disableColumnMenu: true,
+        },
+        {
+            field: 'courtDate',
+            headerName: 'Court Date',
+            width: 125,
+            disableColumnMenu: true,
+            valueFormatter: (params: Date) => {
+                const date = new Date(params);
+                return date.toLocaleDateString();
+            },
+        },
+        {
+            field: 'status',
+            headerName: 'Status',
+            width: 150,
+            disableColumnMenu: true,
+            renderCell: (params) => {
+                const status = params.value as string;
+                const color = statusColors[status] || '#c4c4c4';
+                return (
+                    <span
+                        style={{
+                            backgroundColor: color,
+                            color: '#fff',
+                            padding: '4px 8px',
+                            borderRadius: '4px',
+                            fontWeight: 'bold',
+                            border: `1px solid`,
+                        }}
+                    >
+                        {status}
+                    </span>
+                );
+            },
+        },
+        {
+            field: 'assigned',
+            headerName: 'Assigned',
+            width: 125,
+            disableColumnMenu: true,
+            renderCell: (params) => {
+                const assigned = params.value as {
+                    user1ID: number | null;
+                    user2ID: number | null;
+                    courtDateId: number;
+                };
+                return (
+                    <FirstSecondChairIcons
+                        user1ID={assigned.user1ID}
+                        user2ID={assigned.user2ID}
+                        onUpdateChair={
+                            onUpdateChair
+                                ? (position, userId) => onUpdateChair(assigned.courtDateId, position, userId)
+                                : undefined
+                        }
+                    />
+                );
+            },
+        },
+        {
+            field: 'uploadDeadline',
+            headerName: 'Upload Deadline',
+            width: 125,
+            disableColumnMenu: true,
+            valueFormatter: (params: Date) => {
+                const date = new Date(params);
+                return date.toLocaleDateString();
+            },
+        },
+        {
+            field: 'location',
+            headerName: 'Location',
+            width: 125,
+            disableColumnMenu: true,
+            renderCell: (params) => {
+                const location = params.value as string;
+                const color = locationColors[location] || '#c4c4c4';
+                return (
+                    <span
+                        style={{
+                            backgroundColor: color,
+                            color: '#fff',
+                            padding: '4px 8px',
+                            borderRadius: '4px',
+                            fontWeight: 'bold',
+                            border: `1px solid`,
+                        }}
+                    >
+                        {location}
+                    </span>
+                );
+            },
+        },
+    ];
+
+    const rows = filteredDates
+        .filter((date) => {
+            if (!date.CourtDate) return false;
+            const courtDate = new Date(date.CourtDate);
+            return (
+                courtDate.getMonth() === currentDate.getMonth() && courtDate.getFullYear() === currentDate.getFullYear()
+            );
+        })
+        .map((date) => ({
+            id: date.CourtDateID,
+            township: getTownshipName(date.MuniCode),
+            county: getCountyName(date.MuniCode),
+            type: 'Court Dates', // TODO support negotiations
+            district: date.MuniCode,
+            numCases: date.CourtCases,
+            courtDate: date.CourtDate,
+            status: determineStatus(date),
+            assigned: { user1ID: date.FirstChair, user2ID: date.SecondChair, courtDateId: date.CourtDateID },
+            uploadDeadline: date.UploadDeadline,
+            location: determineLocation(date),
+        }));
+
+    return (
+        <div style={{ height: 600, width: '100%' }}>
+            <DataGrid
+                rows={rows}
+                columns={columns}
+                className='themed'
+                initialState={{
+                    sorting: {
+                        sortModel: [{ field: 'courtDate', sort: 'asc' }],
+                    },
+                }}
+                onRowClick={(params) => {
+                    const selected = filteredDates.find((date) => date.CourtDateID === params.id);
+                    if (selected) {
+                        setSelectedDate(selected);
+                    }
+                }}
+                getRowClassName={() => 'ccalendar-list-row'}
+            />
+        </div>
+    );
+}