"use client";

import { Ban, PackageCheck } from "lucide-react";
import { Alert } from "@/components/ui/alert";
import { useI18n, useT } from "@/i18n";
import { formatCurrency, formatDateTime } from "@/lib/format";
import type { Order } from "@/types/order";

/**
 * How this order ended, at the top of the screen, in the colour of the answer.
 *
 * One component rather than two, because an order ends exactly once: a cancelled order and a
 * delivered one are the same question answered differently, and keeping them together is what
 * makes it impossible for a screen to claim both at the same time.
 *
 * Only the two settled endings are drawn. An order still moving says so through its status
 * badge and its timeline, and a banner repeating that would be noise on every screen that is
 * doing fine.
 */
export function OrderOutcome({ order }: { order: Order }) {
  const t = useT();
  const { locale } = useI18n();

  if (order.status === "cancelled" || order.cancelled_at) {
    return (
      <Alert
        variant="destructive"
        icon={Ban}
        title={
          order.cancelled_at
            ? t("orders.cancelled.titleAt", { at: formatDateTime(order.cancelled_at, locale) })
            : t("orders.cancelled.title")
        }
      >
        {order.cancel_reason ?? t("orders.cancelled.noReason")}
      </Alert>
    );
  }

  if (order.status === "delivered") {
    return <DeliveredNotice order={order} />;
  }

  return null;
}

/**
 * The green one.
 *
 * It answers the two questions somebody opens a finished order to settle — who handed it over,
 * and what came back with them — rather than restating the word "delivered", which the status
 * badge two lines above already says.
 */
function DeliveredNotice({ order }: { order: Order }) {
  const t = useT();
  const { locale } = useI18n();

  /*
   * The order carries no `delivered_at` column: the timeline is where a status change is
   * recorded, so that is where the time comes from. Absent on a record written before the
   * timeline existed, and the banner still shows — that it was delivered is the point, and
   * the hour is the detail.
   */
  const deliveredAt = order.history?.find((step) => step.status === "delivered")?.created_at ?? null;

  const parts: string[] = [];

  if (order.driver?.name) {
    parts.push(t("orders.delivered.byCaptain", { name: order.driver.name }));
  }

  /*
   * What the captain actually took, not what the order asked for — those two disagree often
   * enough that the difference has its own line in the money card. Zero is a real answer and
   * is shown; null means nobody recorded one, which is not the same thing and is left out.
   */
  if (order.amount_collected !== null && order.amount_collected !== undefined) {
    parts.push(
      t("orders.delivered.collected", {
        amount: formatCurrency(order.amount_collected, order.currency, locale),
      }),
    );
  } else if (order.payment_method === "prepaid") {
    parts.push(t("orders.delivered.nothingToCollect"));
  }

  return (
    <Alert
      variant="success"
      icon={PackageCheck}
      title={
        deliveredAt
          ? t("orders.delivered.titleAt", { at: formatDateTime(deliveredAt, locale) })
          : t("orders.delivered.title")
      }
    >
      {parts.length > 0 ? parts.join(" ") : t("orders.delivered.body")}
    </Alert>
  );
}