import { Shield, ShieldAlert, ShieldBan, ShieldCheck, ShieldHalf } from 'lucide-react'
import type { LucideIcon } from 'lucide-react'

import { CodeChip } from '@/components/CodeChip'
import { StatusBadge } from '@/components/StatusBadge'
import type { StatusTone } from '@/components/StatusBadge'
import { Item, ItemActions, ItemContent } from '@/components/ui/item'
import { formatNumber } from '@/lib/format'
import { t } from '@/lib/i18n'
import type { TranslationKey } from '@/lib/i18n'

export interface AccessibleProperty {
  property_uri: string
  permission: string
}

/**
 * Los niveles de permiso que devuelve Search Console, con su dibujo.
 *
 * Estaban escritos dos veces —el mismo `PERMISSIONS` en Configuración y en el
 * recorrido— y este componente pasa a ser su dueño único.
 *
 * Se muestran porque **no son intercambiables**: con cualquiera que no sea
 * propietario la inspección de URLs devuelve error y Google no explica por qué.
 * Una lista de propiedades sin el permiso al lado se lee como «esto ya funciona»
 * cuando puede no funcionar.
 *
 * Los cuatro tienen icono propio y no sólo tono, porque un permiso insuficiente
 * y uno inexistente se resuelven distinto y en escala de grises tienen que
 * seguir siendo dos cosas (RT-04).
 */
const PERMISSIONS: Record<string, { icon: LucideIcon; tone: StatusTone }> = {
  siteOwner: { icon: ShieldCheck, tone: 'positive' },
  siteFullUser: { icon: ShieldHalf, tone: 'attention' },
  siteRestrictedUser: { icon: ShieldAlert, tone: 'attention' },
  siteUnverifiedUser: { icon: ShieldBan, tone: 'attention' },
}

/**
 * El permiso que Google devolvió, para uno que todavía no está en el mapa.
 *
 * Sin traducción se muestra tal cual lo nombró Google: inventarle un nombre en
 * español a un permiso que no conocemos es afirmar qué permite.
 */
function permissionOf(permission: string) {
  const known = PERMISSIONS[permission]
  if (!known) return { word: permission, icon: Shield, tone: 'neutral' as StatusTone }
  return { ...known, word: t(`permission.${permission}` as TranslationKey) }
}

interface Props {
  properties: AccessibleProperty[]
  /**
   * Si se explica la consecuencia de que alguna no sea de propietario.
   *
   * Va donde la lista describe lo que hoy alcanza la conexión, y no donde
   * describe lo que acaba de conseguirse: en medio de un paso del recorrido, la
   * advertencia compite con la comprobación que la persona vino a hacer.
   */
  showWarning?: boolean
}

/**
 * Lo que la cuenta de servicio puede leer hoy, con el permiso de cada propiedad.
 *
 * Reemplaza `AccessibleProperties` de Configuración y `ReachedProperties` del
 * recorrido, que eran la misma `<ul className="divide-y rounded-lg border">`
 * escrita dos veces con el mismo mapa de permisos duplicado al lado.
 *
 * Es una lista de verdad —`<ul>` / `<li>`— y no una pila de cajas: un lector de
 * pantalla anuncia cuántas propiedades hay antes de leer la primera, que es la
 * única forma de saber si la conexión alcanza el sitio entero o una parte.
 */
export function AccessiblePropertyList({ properties, showWarning = false }: Props) {
  const withoutOwnerPermission = properties.filter((p) => p.permission !== 'siteOwner')

  return (
    <div className="flex flex-col gap-2">
      <ul className="flex flex-col gap-2">
        {properties.map((property) => {
          const permission = permissionOf(property.permission)

          return (
            <li key={property.property_uri}>
              <Item variant="outline">
                <ItemContent className="min-w-0">
                  <CodeChip value={property.property_uri} />
                </ItemContent>
                <ItemActions>
                  <StatusBadge tone={permission.tone} icon={permission.icon}>
                    {permission.word}
                  </StatusBadge>
                </ItemActions>
              </Item>
            </li>
          )
        })}
      </ul>

      {showWarning && withoutOwnerPermission.length > 0 ? (
        <p className="text-muted-foreground text-sm text-pretty">
          {t('property.notOwner', {
            count: withoutOwnerPermission.length,
            total: formatNumber(withoutOwnerPermission.length),
          })}{' '}
          {t('property.notOwner.consequence')}
        </p>
      ) : null}
    </div>
  )
}