import { describe, it, expect } from 'vitest';
import { screen } from '@testing-library/react';
import { Routes, Route } from 'react-router-dom';
import userEvent from '@testing-library/user-event';
import { http, HttpResponse } from 'msw';
import { server } from '../test/server';
import { RegisterPage } from './RegisterPage';
import { renderWithProviders } from '../test/test-utils';

const API = '/api/v1';

describe('RegisterPage', () => {
  it('renders registration form', async () => {
    server.use(http.post(`${API}/auth/refresh`, () => new HttpResponse(null, { status: 401 })));
    renderWithProviders(<RegisterPage />, { route: '/register' });
    expect(await screen.findByText('Регистрация')).toBeInTheDocument();
    expect(screen.getByPlaceholderText('Иван Иванов')).toBeInTheDocument();
    expect(screen.getByPlaceholderText('email@example.com')).toBeInTheDocument();
  });

  it('shows password mismatch error', async () => {
    server.use(http.post(`${API}/auth/refresh`, () => new HttpResponse(null, { status: 401 })));
    const user = userEvent.setup();
    renderWithProviders(<RegisterPage />, { route: '/register' });

    await screen.findByText('Регистрация');

    await user.type(screen.getByPlaceholderText('email@example.com'), 'test@test.com');
    await user.type(screen.getByPlaceholderText('Минимум 6 символов'), 'password1');
    await user.type(screen.getByPlaceholderText('Повторите пароль'), 'password2');
    await user.click(screen.getByRole('button', { name: 'Зарегистрироваться' }));

    expect(await screen.findByText('Пароли не совпадают')).toBeInTheDocument();
  });

  it('redirects on successful registration', async () => {
    server.use(http.post(`${API}/auth/refresh`, () => new HttpResponse(null, { status: 401 })));
    const user = userEvent.setup();
    renderWithProviders(
      <Routes>
        <Route path="/register" element={<RegisterPage />} />
        <Route path="/" element={<div>Home Page</div>} />
      </Routes>,
      { route: '/register' },
    );

    await screen.findByText('Регистрация');

    await user.type(screen.getByPlaceholderText('email@example.com'), 'test@test.com');
    await user.type(screen.getByPlaceholderText('Минимум 6 символов'), 'password');
    await user.type(screen.getByPlaceholderText('Повторите пароль'), 'password');
    await user.click(screen.getByRole('button', { name: 'Зарегистрироваться' }));

    await screen.findByText('Home Page');
  });

  it('shows error on failed registration', async () => {
    server.use(
      http.post(`${API}/auth/refresh`, () => new HttpResponse(null, { status: 401 })),
      http.post(
        `${API}/auth/register`,
        () => new HttpResponse(null, { status: 409, statusText: 'Conflict' }),
      ),
    );
    const user = userEvent.setup();
    renderWithProviders(<RegisterPage />, { route: '/register' });

    await screen.findByText('Регистрация');

    await user.type(screen.getByPlaceholderText('email@example.com'), 'existing@test.com');
    await user.type(screen.getByPlaceholderText('Минимум 6 символов'), 'password');
    await user.type(screen.getByPlaceholderText('Повторите пароль'), 'password');
    await user.click(screen.getByRole('button', { name: 'Зарегистрироваться' }));

    expect(await screen.findByText(/Ошибка API/)).toBeInTheDocument();
  });
});