import React from 'react';
import '@testing-library/jest-dom';
import { fireEvent, render, screen, waitFor, within } from '@testing-library/react';
import { ToastProvider } from './toast';
import { I18nProvider } from './i18n/I18nProvider';
import { api } from './api';
import { JobApplication } from './types';
import { MemoryRouter, Route, Routes, useLocation } from 'react-router-dom';

jest.mock('./api', () => ({
  api: {
    get: jest.fn(),
    patch: jest.fn(() => Promise.resolve({ data: {} })),
  },
  getApiErrorMessage: jest.fn((_error, fallback) => fallback),
}));

import KanbanBoard from './components/KanbanBoard';

const mockedApi = api as jest.Mocked<typeof api>;

function job(id: number, jobTitle: string, status: string, overrides: Partial<JobApplication> = {}): JobApplication {
  return {
    id,
    jobTitle,
    company: { id: 1, name: 'Acme' },
    companyId: 1,
    status,
    // Pre-application stages carry no applied date — that is the whole point of the split.
    dateApplied: null,
    savedAt: new Date('2026-07-01T00:00:00Z').toISOString(),
    daysSince: null,
    ...overrides,
  } as JobApplication;
}

function renderBoard(entry = '/kanban?source=board') {
  return render(
    <ToastProvider>
      <I18nProvider>
        <MemoryRouter initialEntries={[entry]}>
          <Routes>
            <Route path="/kanban" element={<KanbanBoard />} />
            <Route path="/jobs/:id" element={<div role="main">Job workspace <RouteState /></div>} />
          </Routes>
        </MemoryRouter>
      </I18nProvider>
    </ToastProvider>,
  );
}

function RouteState() {
  const location = useLocation();
  return <span>{String((location.state as { from?: string } | null)?.from)}</span>;
}

beforeEach(() => {
  jest.clearAllMocks();
  window.localStorage.clear();
});

test('the board collapses ten stages into the three agreed groups', async () => {
  mockedApi.get.mockResolvedValue({
    data: [
      job(1, 'Saved Role', 'Saved'),
      job(2, 'Preparing Role', 'Preparing'),
      job(3, 'Applied Role', 'Applied', { dateApplied: new Date('2026-07-02T00:00:00Z').toISOString(), daysSince: 15 }),
      job(4, 'Offer Role', 'Offer', { dateApplied: new Date('2026-07-02T00:00:00Z').toISOString(), daysSince: 15 }),
      job(5, 'Withdrawn Role', 'Withdrawn', { dateApplied: new Date('2026-07-02T00:00:00Z').toISOString(), daysSince: 15 }),
    ],
  } as any);

  renderBoard();

  await screen.findByText('Not Applied');
  expect(screen.getByText('Active')).toBeInTheDocument();
  expect(screen.getByText('Closed')).toBeInTheDocument();

  // Only the three groups — no "Other" column, because no custom statuses are present.
  expect(screen.queryByText('Other')).not.toBeInTheDocument();

  // Every job is placed, and grouping does not hide which stage it is actually in.
  expect(screen.getByText('Saved Role')).toBeInTheDocument();
  expect(screen.getByText('Withdrawn Role')).toBeInTheDocument();
  expect(screen.getByText('Withdrawn')).toBeInTheDocument();
  expect(screen.getByText('Preparing')).toBeInTheDocument();
  // Offer groups under Active even though it is a Success category on the backend.
  expect(screen.getByText('Offer')).toBeInTheDocument();
});

test('a custom status gets an Other column that is not a drop target', async () => {
  mockedApi.get.mockResolvedValue({
    data: [job(1, 'Odd Role', 'Take-home assignment')],
  } as any);

  renderBoard();

  await screen.findByText('Other');
  // Custom statuses survive rather than being coerced into a canonical stage.
  expect(screen.getByText('Take-home assignment')).toBeInTheDocument();
  fireEvent.dragStart(screen.getByText('Odd Role').closest('.MuiCard-root')!);
  const other = screen.getByRole('group', { name: 'Other column, not a drop target' });
  expect(other).toHaveAttribute('aria-disabled', 'true');
  expect(other).toHaveAttribute('data-drop-state', 'invalid');
});

test('loading and retryable error states replace the board', async () => {
  let rejectLoad!: (reason: unknown) => void;
  mockedApi.get.mockReturnValueOnce(new Promise((_resolve, reject) => { rejectLoad = reject; }) as any);
  renderBoard();

  expect(screen.getByRole('progressbar')).toBeInTheDocument();
  expect(screen.queryByRole('group', { name: 'Not Applied column' })).not.toBeInTheDocument();
  rejectLoad(new Error('offline'));

  expect(await screen.findByText('Unable to load the kanban board')).toBeInTheDocument();
  mockedApi.get.mockResolvedValueOnce({ data: [] } as any);
  fireEvent.click(screen.getByRole('button', { name: 'Retry' }));
  expect(await screen.findByRole('group', { name: 'Not Applied column' })).toBeInTheDocument();
});

test('loading and retry controls follow the selected Bokmål locale', async () => {
  window.localStorage.setItem('uiLanguage', 'nb-NO');
  mockedApi.get.mockRejectedValueOnce(new Error('offline'));

  renderBoard();

  expect(await screen.findByText('Kunne ikke laste kanban-tavlen')).toBeInTheDocument();
  expect(screen.getByRole('button', { name: 'Prøv igjen' })).toBeInTheDocument();
});

test('dropping onto a group applies that group entry stage', async () => {
  mockedApi.get.mockResolvedValue({ data: [job(7, 'Saved Role', 'Saved')] } as any);

  renderBoard();

  const card = await screen.findByText('Saved Role');
  const column = screen.getByText('Active').closest('div')!.parentElement!.parentElement!;

  fireEvent.dragStart(card.closest('.MuiCard-root')!);
  expect(card.closest('.MuiCard-root')!.querySelector('[role="button"]')).toHaveAttribute('aria-pressed', 'true');
  fireEvent.dragEnter(column);
  expect(column).toHaveAttribute('data-drop-state', 'active');
  fireEvent.dragOver(column);
  fireEvent.drop(column);

  // A group is not a status, so a coarse drag applies the group's entry stage.
  await waitFor(() => expect(mockedApi.patch).toHaveBeenCalledWith('/jobapplications/7/status', { status: 'Applied' }));
});

test('keyboard pickup and drop moves a card to a valid column', async () => {
  mockedApi.get.mockResolvedValue({ data: [job(11, 'Keyboard Role', 'Saved')] } as any);
  renderBoard();

  const card = (await screen.findByText('Keyboard Role')).closest('.MuiCard-root')!;
  const control = card.querySelector('[role="button"]')!;
  fireEvent.keyDown(control, { key: ' ' });
  expect(control).toHaveAttribute('aria-pressed', 'true');

  const column = screen.getByRole('group', { name: 'Active column' });
  fireEvent.focus(column);
  fireEvent.keyDown(column, { key: 'Enter' });

  await waitFor(() => expect(mockedApi.patch).toHaveBeenCalledWith('/jobapplications/11/status', { status: 'Applied' }));
  expect(await screen.findByText('Job moved to Applied.')).toBeInTheDocument();
});

test('a failed move keeps the card and reports a retryable error', async () => {
  mockedApi.get.mockResolvedValue({ data: [job(12, 'Failed Move Role', 'Saved')] } as any);
  mockedApi.patch.mockRejectedValueOnce(new Error('offline'));
  renderBoard();

  const card = (await screen.findByText('Failed Move Role')).closest('.MuiCard-root')!;
  const column = screen.getByRole('group', { name: 'Active column' });
  fireEvent.dragStart(card);
  fireEvent.dragOver(column);
  fireEvent.drop(column);

  expect(await screen.findByText('Unable to move this job right now.')).toBeInTheDocument();
  expect(screen.getByText('Failed Move Role')).toBeInTheDocument();
});

test('the card menu offers precise stages grouped by section', async () => {
  mockedApi.get.mockResolvedValue({ data: [job(9, 'Saved Role', 'Saved')] } as any);

  renderBoard();

  await screen.findByText('Saved Role');
  fireEvent.click(screen.getByRole('button', { name: 'Quick status: Saved Role' }));

  const menu = await screen.findByRole('menu');
  // Drag is coarse; the menu is where Ghosted and Withdrawn are reachable at all.
  expect(within(menu).getByText(/Ghosted/)).toBeInTheDocument();
  expect(within(menu).getByText(/Withdrawn/)).toBeInTheDocument();
  // The job's own current stage is not offered as a target.
  expect(within(menu).queryByText(/Set status: Saved/)).not.toBeInTheDocument();
});

test('full-board population keeps jobs beyond the table page and offers a separate table link', async () => {
  mockedApi.get.mockResolvedValue({ data: Array.from({ length: 27 }, (_, index) => job(index + 1, `Role ${index}`, index === 26 ? 'Take-home assignment' : 'Saved')) } as any);
  renderBoard();
  expect(await screen.findByText('Role 26')).toBeVisible();
  expect(screen.getAllByRole('button', { name: /Press Space to pick up/ })).toHaveLength(27);
  expect(mockedApi.get).toHaveBeenCalledWith('/jobapplications/board', expect.objectContaining({ params: expect.objectContaining({ includeDeleted: false }) }));
  expect(screen.queryByRole('link', { name: /Job Applications/ })).not.toBeInTheDocument();
});

test('keyboard Escape cancels movement without a write and successful movement restores card focus', async () => {
  mockedApi.get.mockResolvedValue({ data: [job(11, 'Keyboard Role', 'Saved')] } as any);
  renderBoard();
  const control = await screen.findByRole('button', { name: /^Keyboard Role.*Press Space to pick up/ });
  fireEvent.keyDown(control, { key: ' ' });
  fireEvent.keyDown(control, { key: 'Escape' });
  expect(mockedApi.patch).not.toHaveBeenCalled();
  fireEvent.keyDown(control, { key: ' ' });
  const column = screen.getByRole('group', { name: 'Active column' });
  fireEvent.focus(column);
  fireEvent.keyDown(column, { key: 'Enter' });
  await waitFor(() => expect(mockedApi.patch).toHaveBeenCalledWith('/jobapplications/11/status', { status: 'Applied' }));
  await waitFor(() => expect(screen.getByRole('button', { name: /^Keyboard Role/ })).toHaveFocus());
});

test('opening a card preserves its board return route and does not mutate status', async () => {
  mockedApi.get.mockResolvedValue({ data: [job(8, 'Open Role', 'Saved')] } as any);
  renderBoard();
  fireEvent.keyDown(await screen.findByRole('button', { name: /^Open Role.*Press Space to pick up/ }), { key: 'Enter' });
  expect(await screen.findByText('Job workspace')).toBeVisible();
  expect(screen.getByText('/kanban?source=board')).toBeVisible();
  expect(mockedApi.patch).not.toHaveBeenCalled();
});

test('keyboard activation of the exact-status menu does not open the job', async () => {
  mockedApi.get.mockResolvedValue({ data: [job(9, 'Menu Role', 'Saved')] } as any);
  renderBoard();
  const menuButton = await screen.findByRole('button', { name: 'Quick status: Menu Role' });
  fireEvent.keyDown(menuButton, { key: 'Enter' });
  fireEvent.click(menuButton);
  expect(await screen.findByRole('menu')).toBeVisible();
  expect(screen.queryByText('Job workspace')).not.toBeInTheDocument();
});

test('Board sends the shared logical URL query, excluding Table paging and client ownership fields', async () => {
  mockedApi.get.mockResolvedValue({ data: [] } as any);
  renderBoard('/kanban?q=Board&status=Custom%20review&companyId=7&location=Troms%C3%B8&needsFollowUp=1&readiness=interview&includeDeleted=1&sortBy=jobTitle&sortDir=asc&page=3&pageSize=999&userId=other');
  await screen.findByRole('group', { name: 'Not Applied column' });
  expect(mockedApi.get).toHaveBeenCalledWith('/jobapplications/board', { params: {
    q: 'Board', status: 'Custom review', companyId: 7, location: 'Tromsø', needsFollowUp: true,
    readiness: 'interview', includeDeleted: true, sortBy: 'jobTitle', sortDir: 'asc',
  } });
  // The shared workspace owns the view switch; this renderer only loads the supplied query.
});

test('a successful filtered move reloads membership and focuses the board when the job leaves it', async () => {
  mockedApi.get.mockResolvedValueOnce({ data: [job(11, 'Filtered Role', 'Saved')] } as any)
    .mockResolvedValueOnce({ data: [] } as any);
  renderBoard('/kanban?status=Saved');
  fireEvent.keyDown(await screen.findByRole('button', { name: /^Filtered Role/ }), { key: ' ' });
  fireEvent.keyDown(screen.getByRole('group', { name: 'Active column' }), { key: 'Enter' });
  await waitFor(() => expect(mockedApi.get).toHaveBeenCalledTimes(2));
  await waitFor(() => expect(screen.queryByText('Filtered Role')).not.toBeInTheDocument());
  await waitFor(() => expect(screen.getByRole('group', { name: 'Not Applied column' })).toHaveFocus());
  expect(mockedApi.get).toHaveBeenLastCalledWith('/jobapplications/board', { params: expect.objectContaining({ status: 'Saved' }) });
});

test('a committed move followed by a failed query hides stale membership until retry succeeds', async () => {
  mockedApi.get.mockResolvedValueOnce({ data: [job(11, 'Filtered Role', 'Saved')] } as any)
    .mockRejectedValueOnce(new Error('read failed')).mockResolvedValueOnce({ data: [] } as any);
  renderBoard('/kanban?status=Saved');
  fireEvent.click(await screen.findByRole('button', { name: 'Quick status: Filtered Role' }));
  fireEvent.click(await screen.findByRole('menuitem', { name: 'Set Applied' }));
  expect(await screen.findByText('Unable to load the kanban board')).toBeVisible();
  expect(screen.queryByText('Filtered Role')).not.toBeInTheDocument();
  fireEvent.click(screen.getByRole('button', { name: 'Retry' }));
  expect(await screen.findByRole('group', { name: 'Not Applied column' })).toBeVisible();
  expect(mockedApi.patch).toHaveBeenCalledTimes(1); // retry only the read, never replay the write
});