import { MantineProvider } from "@mantine/core";
import { render, screen, waitFor } from "@testing-library/react";
import type { FC } from "react";
import { MemoryRouter, useLocation, useNavigate } from "react-router";
import { describe, expect, it, vi } from "vitest";
import { RouteErrorBoundary } from "./RouteErrorBoundary";

let authenticated = false;
vi.mock("@/features/auth", () => ({
	useAuth: () => ({ user: authenticated ? {} : null }),
}));

const ThrowingRoute: FC = () => {
	throw new Error("test route failure");
};

const HealthyRoute: FC = () => {
	return (
		<div>
			{useLocation().pathname === "/healthy" ? (
				"healthy route"
			) : (
				<ThrowingRoute />
			)}
		</div>
	);
};

const RouteHarness: FC = () => {
	const navigate = useNavigate();

	return (
		<>
			<button type="button" onClick={() => navigate("/healthy")}>
				go healthy
			</button>
			<RouteErrorBoundary>
				<HealthyRoute />
			</RouteErrorBoundary>
		</>
	);
};

function renderBoundary(path: string) {
	return render(
		<MantineProvider>
			<MemoryRouter initialEntries={[path]}>
				<RouteHarness />
			</MemoryRouter>
		</MantineProvider>,
	);
}

describe("RouteErrorBoundary", () => {
	it("offers login after a public route error without error details", () => {
		authenticated = false;
		renderBoundary("/login");
		expect(document.title).toBe("Не удалось открыть страницу — WealthLedger");
		expect(screen.getByRole("link", { name: "Продолжить" })).toHaveAttribute(
			"href",
			"/login",
		);
		expect(screen.queryByText("test route failure")).not.toBeInTheDocument();
	});

	it("offers accounts after a protected route error and resets on navigation", async () => {
		authenticated = true;
		renderBoundary("/accounts");
		screen.getByRole("button", { name: "go healthy" }).click();
		await waitFor(() =>
			expect(screen.getByText("healthy route")).toBeInTheDocument(),
		);
	});
});