import React from "react";
import { renderToStaticMarkup } from "react-dom/server";
import { describe, expect, it } from "vitest";
import { OtpLoginForm } from "./OtpLoginForm";

const baseProps = {
  email: "skylanguage@yandex.ru",
  setEmail: () => {},
  roleHint: "manager",
  setRoleHint: () => {},
  otp: "",
  setOtp: () => {},
  isOtpSent: false,
  isLoading: false,
  isDemoMode: false,
  onRequestOtp: () => {},
  onVerifyOtp: () => {},
  error: "",
};

describe("OtpLoginForm", () => {
  it("describes the real OTP flow without production role selection", () => {
    const markup = renderToStaticMarkup(<OtpLoginForm {...baseProps} />).toLowerCase();

    expect(markup).toContain("введите email");
    expect(markup).toContain("доступ определяется учетной записью");
    expect(markup).not.toContain("роль для демо-режима");
  });

  it("keeps the demo hint visible only in demo mode", () => {
    const markup = renderToStaticMarkup(
      <OtpLoginForm {...baseProps} isDemoMode={true} />,
    ).toLowerCase();

    expect(markup).toContain("демо-режим активен");
    expect(markup).toContain("роль для демо-режима");
  });

  it("tells operators to check inbox and spam after OTP is sent", () => {
    const markup = renderToStaticMarkup(
      <OtpLoginForm {...baseProps} isOtpSent={true} />,
    ).toLowerCase();

    expect(markup).toContain("входящие");
    expect(markup).toContain("спам");
  });

  it("shows unknown-email admin-help message when error matches", () => {
    const markup = renderToStaticMarkup(
      <OtpLoginForm {...baseProps} error="Email не найден в системе. Обратитесь к администратору." />,
    ).toLowerCase();

    expect(markup).toContain("обратитесь к администратору");
  });
});