"use client"

import { Truck, Clock } from "lucide-react"
import { useDeliveryZones } from "@/hooks/use-delivery-zones"
import { LOCALITIES } from "@/lib/checkout-config"

/**
 * Cuánto cuesta el envío y cuánto tarda, **antes** de que el cliente arme el
 * carrito.
 *
 * Sustituye al viejo `EnvioGratisBanner`, que solo aparecía cuando TODAS las
 * zonas estaban en $0: fuera de la promoción, la web no decía nada de envío en
 * ninguna pantalla y el costo aparecía recién en el paso 3 de 5 del checkout,
 * después de pedir nombre, teléfono y cédula. Descubrir ahí que el envío suma
 * un 25% del pedido es el punto de abandono clásico de una app de delivery.
 *
 * Los números salen de la misma tabla con la que el servidor cobra
 * (`/api/delivery-zones`, editable en `/admin/dashboard/delivery`), nunca de
 * una constante del código. Si la tabla no carga, no se muestra nada: no
 * anunciar es mejor que anunciar un precio que el checkout no va a cobrar.
 */

interface InfoEnvioProps {
  sedeSlug: string
  className?: string
}

/** Minutos que menciona un texto tipo «20-30 min». */
function minutosDe(texto: string | undefined): number[] {
  if (!texto) return []
  return (texto.match(/\d+/g) ?? []).map(Number).filter((n) => n > 0)
}

export function InfoEnvio({ sedeSlug, className = "" }: InfoEnvioProps) {
  const { zonas, estado } = useDeliveryZones(sedeSlug)

  if (estado !== "ok" || zonas.length === 0) return null

  const costos = zonas.map((z) => Number(z.deliveryCost) || 0)
  const barato = Math.min(...costos)
  const caro = Math.max(...costos)
  const gratisTodas = caro === 0

  const minutos = zonas.flatMap((z) => minutosDe(z.estimatedTime))
  const desdeMin = minutos.length > 0 ? Math.min(...minutos) : null
  const hastaMin = minutos.length > 0 ? Math.max(...minutos) : null

  // «A toda La Guaira» solo se afirma si la tabla cubre las 8 zonas canónicas:
  // si el panel dejó menos, prometeríamos envíos que el checkout ya ni ofrece.
  const cubreTodaLaGuaira = LOCALITIES.every((canonica) =>
    zonas.some((z) => z.id === canonica.id || z.name === canonica.name)
  )

  const textoEnvio = gratisTodas
    ? cubreTodaLaGuaira
      ? "Envío gratis a toda La Guaira"
      : "Envío gratis en todas nuestras zonas"
    : barato === 0
      ? `Envío gratis desde algunas zonas · hasta $${caro.toFixed(2)}`
      : barato === caro
        ? `Envío $${barato.toFixed(2)}`
        : `Envío desde $${barato.toFixed(2)}`

  const textoTiempo =
    desdeMin === null
      ? null
      : hastaMin && hastaMin !== desdeMin
        ? `${desdeMin}-${hastaMin} min`
        : `${desdeMin} min`

  return (
    <div
      className={`flex flex-wrap items-center justify-center gap-x-4 gap-y-1 rounded-lg border px-4 py-2.5 text-center text-sm ${
        gratisTodas
          ? "border-green-300 bg-green-50 text-green-800 dark:border-green-700 dark:bg-green-950/40 dark:text-green-200"
          : "border-border bg-muted/50 text-foreground"
      } ${className}`}
    >
      <span className="flex items-center gap-1.5">
        <Truck
          className={`h-4 w-4 shrink-0 ${
            gratisTodas ? "text-green-600 dark:text-green-400" : "text-verde-bosque"
          }`}
        />
        <span className="font-bold">{textoEnvio}</span>
      </span>
      {textoTiempo && (
        <span className="flex items-center gap-1.5">
          <Clock
            className={`h-4 w-4 shrink-0 ${
              gratisTodas ? "text-green-600 dark:text-green-400" : "text-verde-bosque"
            }`}
          />
          <span>Entrega en {textoTiempo}</span>
        </span>
      )}
    </div>
  )
}