"use client"; import { useCallback, useEffect, useState } from "react"; import { Spinner } from "../UI"; import { driverService } from "../../services/driver.service"; import { getStoredToken } from "../../lib/auth"; import { DriverReportPanel } from "../Driver_Report/driverReport"; import type { Driver } from "../../types/driver"; import { DRIVER_STATUS_MAP, DRIVER_CARD_TYPE_MAP, NATIONAL_ID_TYPE_MAP, } from "../../types/driver"; // ── Helpers ─────────────────────────────────────────────────────────────────── function fmtDate(iso?: string | null): string { if (!iso) return "—"; return new Date(iso).toLocaleDateString("ar-SA", { year: "numeric", month: "long", day: "numeric", }); } function isExpiringSoon(iso?: string | null): boolean { if (!iso) return false; const diff = new Date(iso).getTime() - Date.now(); return diff <= 90 * 86_400_000; } // ── Sub-components ──────────────────────────────────────────────────────────── function DetailRow({ label, value, mono = false, warn = false, }: { label: string; value: string; mono?: boolean; warn?: boolean; }) { return (
{label} {warn && value !== "—" ? "⚠ " : ""} {value}
); } function SectionHeading({ title }: { title: string }) { return (

{title}

); } // ── Photos section ──────────────────────────────────────────────────────────── function PhotoCard({ url, label, }: { url?: string | null; label: string; }) { const [imgError, setImgError] = useState(false); return (
{label}
{url && !imgError ? ( // eslint-disable-next-line @next/next/no-img-element {label} setImgError(true)} /> ) : ( )}
{url && !imgError && ( عرض الصورة ↗ )}
); } // ── Props ───────────────────────────────────────────────────────────────────── interface DriverDetailPanelProps { driverId: string; onClose: () => void; onEdit: (driver: Driver) => void; onDelete: (driver: Driver) => void; } // ── Component ───────────────────────────────────────────────────────────────── export function DriverDetailPanel({ driverId, onClose, onEdit, onDelete, }: DriverDetailPanelProps) { const [driver, setDriver] = useState(null); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); const [avatarError, setAvatarError] = useState(false); // Fetch driver data const loadDriver = useCallback(async () => { setLoading(true); setError(null); try { const token = getStoredToken(); const res = await driverService.getById(driverId, token); setDriver((res as unknown as { data: Driver }).data); } catch (err: unknown) { setError(err instanceof Error ? err.message : "تعذّر تحميل بيانات السائق."); } finally { setLoading(false); } }, [driverId]); useEffect(() => { loadDriver(); }, [loadDriver]); // Close on Escape key useEffect(() => { const h = (e: KeyboardEvent) => { if (e.key === "Escape") onClose(); }; window.addEventListener("keydown", h); return () => window.removeEventListener("keydown", h); }, [onClose]); const statusConfig = driver ? DRIVER_STATUS_MAP[driver.status] : null; return ( <> {/* Backdrop */}
{/* Slide-in panel */} ); }