import Link from "next/link";

export function ProfileSection({
  title,
  children,
}: {
  title: string;
  children: React.ReactNode;
}) {
  return (
    <section className="rounded-lg border border-neutral-200 bg-white p-5">
      <h2 className="mb-3 text-lg font-semibold">{title}</h2>
      {children}
    </section>
  );
}

export function ProfileTable({
  headers,
  rows,
}: {
  headers: string[];
  rows: React.ReactNode[][];
}) {
  return (
    <div className="overflow-x-auto">
      <table className="min-w-full text-sm">
        <thead>
          <tr className="bg-neutral-50 text-neutral-600">
            {headers.map((h) => (
              <th key={h} className="px-2 py-2 text-right">
                {h}
              </th>
            ))}
          </tr>
        </thead>
        <tbody>
          {rows.length === 0 ? (
            <tr>
              <td
                colSpan={headers.length}
                className="px-2 py-4 text-center text-neutral-500"
              >
                لا توجد بيانات
              </td>
            </tr>
          ) : (
            rows.map((row, idx) => (
              <tr key={idx} className="border-t border-neutral-100">
                {row.map((cell, i) => (
                  <td key={i} className="px-2 py-2">
                    {cell}
                  </td>
                ))}
              </tr>
            ))
          )}
        </tbody>
      </table>
    </div>
  );
}

export function ProfileLink({
  href,
  children,
}: {
  href: string;
  children: React.ReactNode;
}) {
  return (
    <Link href={href} className="text-[var(--accent)] hover:underline">
      {children}
    </Link>
  );
}

export function formatDate(value?: Date | string) {
  if (!value) return "—";
  return new Date(value).toLocaleString("ar-SA");
}

/** Populated company ref or raw ObjectId */
export function resolvePopulatedCompany(
  companyId: unknown
): { id: string; nameAr?: string; nameEn?: string } | null {
  if (!companyId) return null;
  if (typeof companyId === "object" && companyId !== null) {
    const doc = companyId as { _id?: unknown; nameAr?: string; nameEn?: string };
    if (doc._id != null) {
      return { id: String(doc._id), nameAr: doc.nameAr, nameEn: doc.nameEn };
    }
  }
  return { id: String(companyId) };
}

/** Populated Mongoose ref or raw ObjectId string */
export function resolvePopulatedCampaign(
  campaignId: unknown
): { id: string; name?: string } | null {
  if (!campaignId) return null;
  if (typeof campaignId === "object" && campaignId !== null) {
    const doc = campaignId as { _id?: unknown; name?: string };
    if (doc._id != null) {
      return { id: String(doc._id), name: doc.name };
    }
  }
  return { id: String(campaignId) };
}
