import { getTranslations, setRequestLocale } from "next-intl/server";
import { redirect, notFound } from "next/navigation";
import { connectDB } from "@/lib/db";
import { Order } from "@/models/Order";
import { Client } from "@/models/Client";
import { OrderActivity } from "@/models/OrderActivity";
import { ClientPhotoFolder } from "@/models/ClientPhotoFolder";
import { OrderFeedback } from "@/models/OrderFeedback";
import { Link } from "@/i18n/navigation";
import { getSessionClientId } from "@/lib/auth";
import { getPriceState } from "@/lib/priceProposal";
import { getOrderChatMessagesByOrderId } from "@/lib/orderMessages";
import { PriceProposalClient } from "@/components/orders/PriceProposalClient";
import { ContractClient } from "@/components/orders/ContractClient";
import { ClientCancelOrderPanel } from "@/components/orders/ClientCancelOrderPanel";
import { OrderChat } from "@/components/orders/OrderChat";
import { clientSendOrderMessageAction } from "@/lib/actions/orders";
import { Contract } from "@/models/Contract";
import { Invoice } from "@/models/Invoice";
import { Reminder } from "@/models/Reminder";
import { PayOnlineButton } from "@/components/orders/PayOnlineButton";
import { DiscountCodeRedeem } from "@/components/orders/DiscountCodeRedeem";
import { AddAttachmentsForm } from "@/components/orders/AddAttachmentsForm";
import { getSettings } from "@/lib/settings";
import { isStripeConfigured } from "@/lib/stripe";
import { ORDER_TAG_COLORS, formatPaymentReference, formatEUR, formatDatePeriod, effectiveEventAddress, type OrderTag, formatDateLocale } from "@/lib/orderConstants";
import { buildGoogleCalendarUrl, buildOutlookCalendarUrl } from "@/lib/addToCalendarLinks";

export const dynamic = "force-dynamic";

export default async function OrderDetailPage({
  params,
  searchParams,
}: {
  params: Promise<{ locale: string; orderId: string }>;
  searchParams: Promise<{ payment?: string }>;
}) {
  const { locale, orderId } = await params;
  const { payment } = await searchParams;
  setRequestLocale(locale);
  const t = await getTranslations({ locale, namespace: "orders" });

  const clientId = await getSessionClientId();
  if (!clientId) redirect(`/${locale}/login`);

  await connectDB();
  const order = await Order.findById(orderId).lean();
  if (!order || String(order.clientId) !== clientId) notFound();

  const client = await Client.findById(clientId).lean();
  const { state, history } = await getPriceState(orderId);
  const contract = await Contract.findOne({ orderId }).lean();
  const activities = await OrderActivity.find({ orderId }).sort({ createdAt: -1 }).lean();
  const messagesByOrderId = await getOrderChatMessagesByOrderId([orderId]);
  const messages = messagesByOrderId.get(orderId) ?? [];
  const invoice = await Invoice.findOne({ orderId }).lean();
  // Nur für diesen Auftrag zugewiesene UND freigegebene Ordner — nicht per
  // clientId (das würde auch Ordner aus anderen Aufträgen dieses Kunden
  // zeigen, siehe entsprechende Filterung auf der Admin-Auftragsseite).
  const photoFolders = await ClientPhotoFolder.find({ orderId: order._id, released: true }).sort({ sortOrder: 1 }).lean();
  const reminders = invoice ? await Reminder.find({ invoiceId: invoice._id }).sort({ createdAt: 1 }).lean() : [];
  // "done_dropped" ist eine Absage, keine erfolgreiche Fertigstellung — dafür
  // gibt es schon den separaten Stornierungs-Hinweis (ClientCancelOrderPanel).
  const isCompleted = order.tag === "done_phase1" || order.tag === "done_posted";
  const feedback = isCompleted ? await OrderFeedback.findOne({ orderId }).lean() : null;
  const assignedStaff = order.assignedStaffId ? await Client.findById(order.assignedStaffId).select("name avatarPath").lean() : null;
  const settings = await getSettings();
  const onlinePaymentAvailable = settings.paymentSettings?.enabled && isStripeConfigured();

  const canCancel = !order.rejected && !order.tag.startsWith("done_");

  const shootDate = order.shootDate ? new Date(order.shootDate) : null;
  const shootEndDate = order.shootEndDate ? new Date(order.shootEndDate) : null;
  const appointmentAddress = effectiveEventAddress(order);
  const calendarLinks = shootDate
    ? {
        google: buildGoogleCalendarUrl({
          title: `${order.characterOrConcept} — Rakku Photography`,
          start: shootDate,
          end: shootEndDate,
          location: appointmentAddress,
        }),
        outlook: buildOutlookCalendarUrl({
          title: `${order.characterOrConcept} — Rakku Photography`,
          start: shootDate,
          end: shootEndDate,
          location: appointmentAddress,
        }),
        ics: `/api/orders/${order._id}/calendar.ics`,
      }
    : null;

  return (
    <div>
      <div className="grid grid-cols-1 items-start gap-6 lg:grid-cols-[1fr_20rem]">
        <div className="flex flex-col gap-6">
          <div>
            <span
              className="inline-block text-xs uppercase tracking-[0.35em] border rounded-full px-2.5 py-1"
              style={{
                borderColor: `${ORDER_TAG_COLORS[order.tag as OrderTag]}66`,
                color: ORDER_TAG_COLORS[order.tag as OrderTag],
              }}
            >
              {t(`orderTags.${order.tag}`)}
            </span>
            <h1 className="rk-wordmark mt-3 text-2xl">{order.characterOrConcept}</h1>
            <p className="mt-1 text-[0.65rem] font-mono text-[var(--rk-ink-muted)]">{formatPaymentReference(String(order._id))}</p>
            <p className="mt-2 text-sm text-[var(--rk-ink-muted)]">
              {t(`shootingTypes.${order.shootingType}`)}
              {order.eventLocation ? ` · ${order.eventLocation}` : ""}
              {order.datePeriod ? ` · ${formatDatePeriod(order.datePeriod, locale === "en" ? "en" : "de")}` : ""}
            </p>
            {assignedStaff && (
              <p className="mt-2 flex items-center gap-2 text-sm text-[var(--rk-ink-muted)]">
                {assignedStaff.avatarPath && (
                  // eslint-disable-next-line @next/next/no-img-element
                  <img
                    src={`/api/avatars/${assignedStaff._id}/${assignedStaff.avatarPath}`}
                    alt=""
                    className="w-5 h-5 rounded-full object-cover border border-white/15"
                  />
                )}
                {t("assignedStaff", { name: assignedStaff.name })}
              </p>
            )}
            <a
              href={`/${locale}/account/new-order?fromOrderId=${order._id}`}
              className="mt-3 inline-block text-xs border border-white/30 rounded-full px-3.5 py-1.5 hover:border-white transition-colors"
            >
              {t("bookAgain")}
            </a>
          </div>

          {isCompleted && (
            <div className="border border-emerald-400/30 bg-emerald-400/5 rounded-xl p-5">
              <p className="text-xs uppercase tracking-[0.1em] text-emerald-400 mb-2">✓ {t("completedTitle")}</p>
              <p className="text-sm text-[var(--rk-ink-muted)]">{t("completedText")}</p>
              {feedback && !feedback.submitted && (
                <a
                  href={`/${locale}/feedback/${feedback.token}`}
                  className="mt-3 inline-block text-xs border border-emerald-400/40 text-emerald-400 rounded-full px-4 py-2 hover:border-emerald-400 hover:bg-emerald-400/10 transition-colors"
                >
                  {t("leaveFeedback")}
                </a>
              )}
              {feedback?.submitted && (
                <p className="mt-3 text-xs text-[var(--rk-ink-muted)]">{t("feedbackThanks")}</p>
              )}
            </div>
          )}

          <div className="rounded-xl border border-white/10 bg-[var(--rk-surface)] p-5">
            <p className="text-xs uppercase tracking-[0.1em] text-[var(--rk-ink-muted)] mb-3">{t("detailsTitle")}</p>
            <dl className="grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-2 text-sm">
              <Row label={t("compensationType")} value={order.compensationType === "tfp" ? t("compensationTfp") : t("compensationPaid")} />
              <Row label={t("eventLocation")} value={order.eventLocation} />
              <Row label={t("datePeriod")} value={order.datePeriod ? formatDatePeriod(order.datePeriod, locale === "en" ? "en" : "de") : ""} />
              <Row label={t("instagramHandle")} value={order.instagramHandle} />
              <Row label={t("discordHandle")} value={order.discordHandle} />
              <Row label={t("receivedAt")} value={new Date(order.createdAt).toLocaleString(locale === "en" ? "en-GB" : "de-DE")} />
            </dl>
          </div>

          {shootDate && calendarLinks && (
            <div className="rounded-xl border border-white/10 bg-[var(--rk-surface)] p-5">
              <p className="text-xs uppercase tracking-[0.1em] text-[var(--rk-ink-muted)] mb-3">{t("appointmentTitle")}</p>
              <p className="text-sm">
                {shootDate.toLocaleDateString(locale === "en" ? "en-GB" : "de-DE", { dateStyle: "long" })}
                {" · "}
                {shootDate.toLocaleTimeString(locale === "en" ? "en-GB" : "de-DE", { hour: "2-digit", minute: "2-digit" })}
                {shootEndDate
                  ? `–${shootEndDate.toLocaleTimeString(locale === "en" ? "en-GB" : "de-DE", { hour: "2-digit", minute: "2-digit" })}`
                  : ""}
              </p>
              {appointmentAddress && (
                <p className="mt-1 text-sm text-[var(--rk-ink-muted)] whitespace-pre-line">📍 {appointmentAddress}</p>
              )}
              <details className="mt-3">
                <summary className="text-xs cursor-pointer text-[var(--rk-ink-muted)] hover:text-[var(--rk-ink)] transition-colors">
                  {t("addToCalendar")}
                </summary>
                <div className="mt-2 flex flex-wrap gap-2">
                  <a
                    href={calendarLinks.google}
                    target="_blank"
                    rel="noopener noreferrer"
                    className="text-xs border border-white/30 rounded-lg px-3 py-1.5 hover:border-white transition-colors"
                  >
                    {t("addToCalendarGoogle")}
                  </a>
                  <a
                    href={calendarLinks.outlook}
                    target="_blank"
                    rel="noopener noreferrer"
                    className="text-xs border border-white/30 rounded-lg px-3 py-1.5 hover:border-white transition-colors"
                  >
                    {t("addToCalendarOutlook")}
                  </a>
                  <a
                    href={calendarLinks.ics}
                    className="text-xs border border-white/30 rounded-lg px-3 py-1.5 hover:border-white transition-colors"
                  >
                    {t("addToCalendarIcs")}
                  </a>
                </div>
              </details>
            </div>
          )}

          {photoFolders.length > 0 && (
            <div className="rounded-xl border border-white/10 bg-[var(--rk-surface)] p-5">
              <p className="text-xs uppercase tracking-[0.1em] text-[var(--rk-ink-muted)] mb-3">{t("photosTitle")}</p>
              <div className="flex flex-col gap-2">
                {photoFolders.map((f) => (
                  <Link
                    key={String(f._id)}
                    href={`/account/photos/${f._id}`}
                    className="flex items-center justify-between gap-3 text-sm border border-white/10 rounded-lg px-3 py-2.5 hover:border-white/30 transition-colors"
                  >
                    <span className="truncate">📁 {f.label || f.nextcloudPath}</span>
                    <span className="text-xs text-[var(--rk-ink-muted)] shrink-0">
                      {formatDateLocale(new Date(f.assignedAt), locale)}
                    </span>
                  </Link>
                ))}
              </div>
            </div>
          )}

          <PriceProposalClient orderId={String(order._id)} phase={state.phase} history={history} />

          <DiscountCodeRedeem
            orderId={String(order._id)}
            hasPriceProposal={state.phase !== "none"}
            discountCode={order.discountCode}
            discountAmount={order.discountAmount}
            manualDiscountAmount={order.manualDiscountAmount}
            manualDiscountNote={order.manualDiscountNote}
            latestAmount={history.length ? history[history.length - 1].amount : 0}
            showPayable={state.phase === "agreed"}
          />

          {order.compensationType === "paid" && state.phase === "agreed" && (
            <div className="rounded-xl border border-white/10 bg-[var(--rk-surface)] p-5">
              <p className="text-xs uppercase tracking-[0.1em] text-[var(--rk-ink-muted)] mb-3">{t("paymentTitle")}</p>
              <span
                className={`text-xs uppercase tracking-[0.1em] border rounded-full px-2.5 py-1 ${
                  order.paid ? "border-emerald-400/40 text-emerald-400" : "border-amber-400/40 text-amber-400"
                }`}
              >
                {order.paid ? t("paymentPaid") : t("paymentOpen")}
              </span>
              {order.paid && order.paymentMethod && (
                <span className="ml-2 text-xs text-[var(--rk-ink-muted)]">
                  {t(`paymentMethods.${order.paymentMethod}`)}
                </span>
              )}
              {!order.paid && (
                <p className="mt-3 text-sm text-[var(--rk-ink-muted)]">
                  {t("paymentReferenceHint")}{" "}
                  <span className="text-[var(--rk-ink)] font-mono">{formatPaymentReference(String(order._id))}</span>
                </p>
              )}
              {!order.paid && payment === "success" && (
                <p className="mt-3 text-sm text-amber-400">{t("payOnlineProcessing")}</p>
              )}
              {!order.paid && onlinePaymentAvailable && (
                <PayOnlineButton
                  orderId={String(order._id)}
                  depositAmount={order.depositAmount || 0}
                  depositPaid={order.depositPaid}
                />
              )}
              {invoice && (
                <div className="mt-3 flex items-center justify-between gap-3 border-t border-white/10 pt-3">
                  <span className="text-sm text-[var(--rk-ink-muted)]">
                    {t("invoiceTitle")} {invoice.number} · {formatEUR(invoice.totalAmount)}
                  </span>
                  <a
                    href={`/api/invoices/${invoice._id}/pdf`}
                    target="_blank"
                    rel="noopener noreferrer"
                    className="text-xs border border-white/30 rounded-lg px-3 py-1.5 hover:border-white transition-colors shrink-0"
                  >
                    {t("invoiceDownload")}
                  </a>
                </div>
              )}
              {reminders.length > 0 && (
                <div className="mt-3 border-t border-white/10 pt-3 flex flex-col gap-2">
                  {reminders.map((r) => (
                    <div key={String(r._id)} className="flex items-center justify-between gap-3">
                      <span className="text-sm text-amber-400">
                        {t(r.level === 1 ? "reminderLevel1" : "reminderLevelN", { level: r.level - 1 })}
                        <span className="ml-2 text-xs text-[var(--rk-ink-muted)]">
                          {formatDateLocale(new Date(r.createdAt), locale)} ·{" "}
                          {new Intl.NumberFormat(locale === "en" ? "en-GB" : "de-DE", { style: "currency", currency: "EUR" }).format(
                            r.amountDue
                          )}
                        </span>
                      </span>
                      <a
                        href={`/api/reminders/${r._id}/pdf`}
                        target="_blank"
                        rel="noopener noreferrer"
                        className="text-xs border border-white/30 rounded-lg px-3 py-1.5 hover:border-white transition-colors shrink-0"
                      >
                        {t("invoiceDownload")}
                      </a>
                    </div>
                  ))}
                </div>
              )}
            </div>
          )}

          {contract && contract.status !== "draft" && (
            <ContractClient
              locale={locale}
              clientName={client?.name || ""}
              contract={{
                id: String(contract._id),
                type: contract.type,
                status: contract.status,
                isMinor: contract.type === "tfp" && Boolean(contract.tfpData?.isMinor),
                guardianCount: contract.type === "tfp" ? contract.tfpData?.guardians?.length ?? 0 : 0,
              }}
            />
          )}

          {(order.ideaMood || order.additionalNotes) && (
            <div className="border border-white/10 rounded-xl p-5 text-sm text-[var(--rk-ink-muted)] whitespace-pre-line">
              {order.ideaMood}
              {order.ideaMood && order.additionalNotes ? "\n\n" : ""}
              {order.additionalNotes}
            </div>
          )}

          {order.attachments.length > 0 && (
            <div className="flex flex-wrap gap-2">
              {order.attachments.map((att) => (
                <a
                  key={att.storedName}
                  href={`/api/files/${order._id}/${att.storedName}`}
                  target="_blank"
                  rel="noopener noreferrer"
                  className="text-xs border border-white/15 rounded-full px-3 py-1 hover:border-white/50 transition-colors"
                >
                  📎 {att.filename}
                </a>
              ))}
            </div>
          )}

          {!order.rejected && !order.archived && (
            <AddAttachmentsForm orderId={String(order._id)} />
          )}

          <ClientCancelOrderPanel
            orderId={String(order._id)}
            rejected={order.rejected}
            rejectedBy={order.rejectedBy}
            rejectionReason={order.rejectionReason}
            rejectionNote={order.rejectionNote}
            canCancel={canCancel}
          />

          {activities.length > 0 && (
            <details className="rounded-xl border border-white/10 bg-[var(--rk-surface)] p-5">
              <summary className="text-xs uppercase tracking-[0.1em] text-[var(--rk-ink-muted)] cursor-pointer">
                {t("historyTitle")} ({activities.length})
              </summary>
              <ul className="mt-3 flex flex-col gap-1.5">
                {activities.map((a) => (
                  <li key={String(a._id)} className="text-xs text-[var(--rk-ink-muted)]">
                    <span className="text-[var(--rk-ink)]">
                      {new Date(a.createdAt).toLocaleString(locale === "en" ? "en-GB" : "de-DE")}
                    </span>{" "}
                    — {a.message}
                  </li>
                ))}
              </ul>
            </details>
          )}
        </div>

        <div className="border border-white/10 rounded-xl p-5 lg:sticky lg:top-32">
          <OrderChat
            entityId={String(order._id)}
            messages={messages}
            viewerId={clientId}
            sendAction={clientSendOrderMessageAction}
            labels={{
              title: t("chatTitle"),
              placeholder: t("chatPlaceholder"),
              send: t("chatSend"),
              empty: t("chatEmpty"),
            }}
          />
        </div>
      </div>
    </div>
  );
}

function Row({ label, value }: { label: string; value?: string }) {
  if (!value) return null;
  return (
    <div>
      <dt className="text-[var(--rk-ink-muted)] uppercase tracking-[0.08em] text-[0.65rem]">{label}</dt>
      <dd className="mt-0.5 whitespace-pre-line">{value}</dd>
    </div>
  );
}