import { useState } from 'react'
import { PrimaryButton } from '@shared/ui'
import styles from './RegisterForm.module.css'

const DOCS_EMAIL = 'support@elcsa.ru'

const REQUIRED_DOCUMENTS = [
  'Устав организации в действующей редакции',
  'Решение (протокол) о создании организации и о назначении руководителя',
  'Выписка по расчётному счёту из банка за последние шесть месяцев',
  'Выписка из Единого государственного реестра юридических лиц (ЕГРЮЛ)',
  'Идентификатор электронного документооборота (ЭДО)',
  'Реквизиты расчётного счёта: номер Р/С, БИК и наименование банка',
]

export function LegalRegisterInfo() {
  const [sent, setSent] = useState(false)

  if (sent) {
    return (
      <div className={styles.legalDone}>
        <h2 className={styles.legalDoneTitle}>Спасибо!</h2>
        <p className={styles.legalDoneText}>
          Мы получили уведомление об отправке документов. После проверки мы свяжемся с вами
          по указанному адресу электронной почты.
        </p>
      </div>
    )
  }

  return (
    <div className={styles.legalInfo}>
      <p className={styles.legalIntro}>
        Для регистрации юридического лица отправьте перечисленные ниже документы на нашу
        электронную почту. После проверки мы свяжемся с вами для завершения регистрации.
      </p>

      <div className={styles.docsBlock}>
        <span className={styles.docsLabel}>Необходимые документы</span>
        <ul className={styles.docsList}>
          {REQUIRED_DOCUMENTS.map((doc) => (
            <li key={doc}>{doc}</li>
          ))}
        </ul>
      </div>

      <div className={styles.emailBlock}>
        <span className={styles.docsLabel}>Адрес для отправки документов</span>
        <a href={`mailto:${DOCS_EMAIL}`} className={styles.emailLink}>
          {DOCS_EMAIL}
        </a>
      </div>

      <div className={styles.submitWrapper}>
        <PrimaryButton label="Документы отправлены" type="button" onClick={() => setSent(true)} />
      </div>
    </div>
  )
}
