import { useOrganizations } from '@features/admin'
import styles from './LegalEntitiesTable.module.css'

const STATUS_LABELS: Record<string, string> = {
  active: 'Активно',
  blocked: 'Заблокировано',
  inactive: 'Неактивно',
}

function formatDate(value: string | null): string {
  if (!value) return '—'
  const d = new Date(value)
  if (Number.isNaN(d.getTime())) return '—'
  return d.toLocaleDateString('ru-RU')
}

export function LegalEntitiesTable() {
  const { data, isLoading, isError } = useOrganizations()

  if (isLoading) {
    return <div className={styles.tableWrap}><div className={styles.state}>Загрузка...</div></div>
  }

  if (isError) {
    return (
      <div className={styles.tableWrap}>
        <div className={styles.state}>Не удалось загрузить список юридических лиц</div>
      </div>
    )
  }

  if (!data || data.items.length === 0) {
    return (
      <div className={styles.tableWrap}>
        <div className={styles.state}>Юридические лица ещё не добавлены</div>
      </div>
    )
  }

  return (
    <div className={styles.tableWrap}>
      <table className={styles.table}>
        <thead>
          <tr>
            <th>Название</th>
            <th>ИНН</th>
            <th>КПП</th>
            <th>Контактное лицо</th>
            <th>Телефон</th>
            <th>Статус</th>
            <th>KYC</th>
            <th>Создано</th>
          </tr>
        </thead>
        <tbody>
          {data.items.map((org) => (
            <tr key={org.id}>
              <td>
                <span className={styles.name}>{org.name}</span>
                {org.short_name && <span className={styles.subname}>{org.short_name}</span>}
              </td>
              <td className={styles.mono}>{org.inn}</td>
              <td className={styles.mono}>{org.kpp ?? '—'}</td>
              <td>{org.contact_person ?? '—'}</td>
              <td className={styles.mono}>{org.contact_phone ?? '—'}</td>
              <td>
                <span className={styles.status}>{STATUS_LABELS[org.status] ?? org.status}</span>
              </td>
              <td>
                <span className={`${styles.kyc} ${org.kyc_verified ? styles.kycOk : styles.kycNo}`}>
                  {org.kyc_verified ? 'Да' : 'Нет'}
                </span>
              </td>
              <td>{formatDate(org.created_at)}</td>
            </tr>
          ))}
        </tbody>
      </table>
    </div>
  )
}