"use client"; import { useEffect, useState } from "react"; import { useParams, useRouter } from "next/navigation"; import { Alert } from "@/src/Components/UI"; import { Toast } from "@/src/Components/Client/Toast"; import { useClientAddresses } from "@/src/hooks/useClientAddresses"; import { clientService } from "@/src/services/client.service"; import { getStoredToken } from "@/src/lib/auth"; import type { Client, ClientAddress, ClientAddressFormData, } from "@/src/types/client"; import { AddressFormModal } from "@/src/Components/Client/Addressformmodal"; import { DeleteConfirmModal } from "@/src/Components/Client/Deleteconfirmmodal"; // ── Helpers ──────────────────────────────────────────────────────────────── /** Returns a context-appropriate emoji for each common address label */ function labelIcon(label: string): string { const map: Record = { "فوترة": "💳", "شحن": "📦", "المقر الرئيسي": "🏢", "فرع": "🏬", "مستودع": "🏭", billing: "💳", shipping: "📦", "head office": "🏢", branch: "🏬", warehouse: "🏭", }; return map[label.toLowerCase()] ?? "📍"; } // ── Address card sub-component ───────────────────────────────────────────── // Mirrors the AddressCard in the old page — kept co-located because it's only used here. interface AddressCardProps { address: ClientAddress; onEdit: () => void; onDelete: () => void; onMakePrimary: () => void; } function AddressCard({ address, onEdit, onDelete, onMakePrimary }: AddressCardProps) { return (
{/* Label row */}
{address.label}
{address.isPrimary && ( رئيسي )}
{/* Address lines */}

{address.street}

{address.city}، {address.state} {address.postalCode}

{address.country}

{/* Actions */}
تعديل {!address.isPrimary && ( تعيين كرئيسي )} حذف
); } function ActionBtn({ onClick, color, bg, border, style, children, }: { onClick: () => void; color: string; bg: string; border: string; style?: React.CSSProperties; children: React.ReactNode; }) { return ( ); } // ── Page ─────────────────────────────────────────────────────────────────── export default function ClientAddressesPage() { const params = useParams(); const router = useRouter(); const clientId = params?.clientId as string; console.log('clientId:', params.clientId); // شوف إيه اللي بيجي // ── Parent client meta ─────────────────────────────────────────────────── const [client, setClient] = useState(null); const [clientLoading, setClientLoading] = useState(true); useEffect(() => { if (!clientId) return; setClientLoading(true); clientService .getById(clientId, getStoredToken()) .then((res) => setClient(res.data)) .catch(() => router.replace("/clients")) .finally(() => setClientLoading(false)); }, [clientId, router]); // ── Address CRUD hook ──────────────────────────────────────────────────── const { addresses, loading: addrLoading, error, notification, clearError, createAddress, updateAddress, deleteAddress, makePrimary, } = useClientAddresses(clientId ?? ""); // ── Modal state (mirrors UsersPage pattern) ────────────────────────────── // false = closed | null = create mode | ClientAddress = edit mode const [formTarget, setFormTarget] = useState(false); const [deleteTarget, setDeleteTarget] = useState(null); const [deleting, setDeleting] = useState(false); // ── Handlers ───────────────────────────────────────────────────────────── const handleFormSubmit = async ( data: ClientAddressFormData, isNew: boolean ): Promise => { if (isNew) return createAddress(data); return updateAddress((formTarget as ClientAddress).id, data); }; const handleDeleteConfirm = async () => { if (!deleteTarget || deleting) return; setDeleting(true); const ok = await deleteAddress(deleteTarget.id); setDeleting(false); if (ok) setDeleteTarget(null); }; // ── Guard: wait for router + client ───────────────────────────────────── if (!clientId || clientLoading) { return (
); } // ── Render ──────────────────────────────────────────────────────────────── return ( <> {/* Global success / error toast */} {/* Create / Edit address modal */} {formTarget !== false && ( setFormTarget(false)} onSubmit={handleFormSubmit} /> )} {/* Delete confirmation — reuses the same DeleteConfirmModal shape */} {deleteTarget && ( { if (!deleting) setDeleteTarget(null); }} onConfirm={handleDeleteConfirm} /> )}
{/* ── Page header ── */}
{/* Back link */}

إدارة العناوين

{client ? `${client.name} — العناوين` : "العناوين"}

إجمالي{" "} {addresses.length} {" "} عنوان

{/* Add address button */}
{/* Client info strip */} {client && (
{client.name} {client.email} {client.phone} {client.taxId && ( {client.taxId} )}
)}
{/* General load error */} {error && } {/* Address grid */} {addrLoading ? (
جارٍ التحميل…
) : addresses.length === 0 ? (

📍

لا توجد عناوين بعد

أضف عنواناً واحداً على الأقل حتى يتمكن العميل من استقبال الشحنات والفواتير.

) : (
{addresses.map((addr) => ( setFormTarget(addr)} onDelete={() => setDeleteTarget(addr)} onMakePrimary={() => makePrimary(addr.id)} /> ))}
)}
); }