/* ============================================================
   WELCOME — приветственная страница входа (главная, отдаётся на /)
   Единая форма с переключателем Пользователь / Администратор.
   Пользователь → POST /api/login → кабинет (index.html).
   Администратор → POST /api/admin-login → панель (companies.html).
   ============================================================ */

function WelcomeApp() {
  const [mode, setMode]       = useState('user'); // 'user' | 'admin'
  const [login, setLogin]     = useState('');
  const [pass, setPass]       = useState('');
  const [reveal, setReveal]   = useState(false);
  const [error, setError]     = useState('');
  const [submitting, setSubmitting] = useState(false);

  const isAdmin = mode === 'admin';

  // Авто-редирект залогиненного пользователя убран намеренно: страница входа
  // всегда показывает форму, чтобы не выкидывать обратно в ЛК при попытке
  // открыть её вручную (или войти под другим аккаунтом).

  const switchMode = (m) => {
    if (m === mode) return;
    setMode(m);
    setError('');
  };

  const handleSubmit = async (e) => {
    e.preventDefault();
    if (!login.trim() || !pass.trim()) {
      setError('Заполните логин и пароль');
      return;
    }
    setSubmitting(true);
    setError('');

    try {
      if (isAdmin) {
        const res = await fetch('/api/admin-login', {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({ login: login.trim(), pass: pass.trim() })
        });
        const data = await res.json().catch(() => ({}));
        if (res.ok && data.success) {
          localStorage.setItem('cp-admin-token', data.token);
          window.location.href = '/admin';
          return; // навигация — состояние не сбрасываем
        }
        setError(data.reason === 'rate_limited'
          ? 'Слишком много попыток входа. Попробуйте позже.'
          : 'Неверный логин или пароль');
        setSubmitting(false);
      } else {
        const formattedTime = new Date().toLocaleDateString('ru-RU', {
          day: 'numeric', month: 'long', hour: '2-digit', minute: '2-digit'
        }).replace(' в ', ', ');

        const res = await fetch('/api/login', {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({
            login: login.trim(),
            pass: pass.trim(),
            when_time: formattedTime
            // IP и User-Agent проставляет сервер из соединения — здесь не шлём.
          })
        });
        const data = await res.json().catch(() => ({}));
        if (res.ok && data.success) {
          localStorage.setItem('cp-active-co-id', data.company.id);
          localStorage.setItem('cp-active-role', data.role);
          if (data.token) localStorage.setItem('cp-user-token', data.token);
          window.location.href = `/app?co=${encodeURIComponent(data.company.id)}&role=${data.role}`;
          return; // навигация
        }
        if (data.reason === 'blocked') {
          setError('Доступ заблокирован администратором');
        } else if (data.reason === 'rate_limited') {
          setError('Слишком много попыток входа. Попробуйте позже.');
        } else {
          setError('Неверный логин или пароль');
        }
        setSubmitting(false);
      }
    } catch (err) {
      console.error(err);
      setError('Ошибка подключения к серверу');
      setSubmitting(false);
    }
  };

  return (
    <div className="welcome-wrap">
      {/* refract-пятна под стеклом */}
      <div className="welcome-spots" />

      <form onSubmit={handleSubmit} className="welcome-card">
        <div className="welcome-brand">
          <div className="welcome-mark">ПУ</div>
          <div>
            <div className="welcome-brand-name">Панель управления</div>
            <div className="welcome-brand-sub">бизнес на маркетплейсах</div>
          </div>
        </div>

        <h1 className="welcome-title">
          {isAdmin ? 'Вход в панель администратора' : 'Вход в личный кабинет'}
        </h1>
        <p className="welcome-lead">
          {isAdmin
            ? 'Управление компаниями и доступами к сервису'
            : 'Управление бизнесом на маркетплейсах — Ozon, Wildberries, Яндекс Маркет'}
        </p>

        {/* Переключатель роли */}
        <div className="seg role-seg" role="tablist">
          <button type="button" className={!isAdmin ? 'active' : ''} onClick={() => switchMode('user')}>
            Пользователь
          </button>
          <button type="button" className={isAdmin ? 'active' : ''} onClick={() => switchMode('admin')}>
            Администратор
          </button>
        </div>

        <label className="fld">
          <span className="lab">Логин</span>
          <input className="input mono" value={login} onChange={e => setLogin(e.target.value)}
            placeholder={isAdmin ? 'admin' : 'dom-uyut'} disabled={submitting} autoComplete="username" />
        </label>

        <label className="fld">
          <span className="lab">Пароль</span>
          <div className="pass-row">
            <input className="input mono" type={reveal ? 'text' : 'password'} value={pass}
              onChange={e => setPass(e.target.value)} placeholder="••••••••" style={{ flex: 1 }}
              disabled={submitting} autoComplete="current-password" />
            <button className="iconbtn" type="button" onClick={() => setReveal(!reveal)}>
              <Icon name="eye" size={16} />
            </button>
          </div>
        </label>

        {error && (
          <div className="pill red welcome-err">
            <Icon name="alert" size={13} /> {error}
          </div>
        )}

        <button type="submit" className="btn primary welcome-submit" disabled={submitting}>
          {submitting ? 'Проверка…' : (isAdmin ? 'Войти в панель' : 'Войти в кабинет')}
        </button>
      </form>
    </div>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<WelcomeApp />);