import { parseTheme } from "@ax/helpers";
import FinalStep from "@ax/modules/Sites/SitesList/WelcomeModal/FinalStep";
import globalTheme from "@ax/themes/theme.json";

import { cleanup, fireEvent, render, screen } from "@testing-library/react";
import { ThemeProvider } from "styled-components";

afterEach(cleanup);

const mockRoles = [
	{
		id: 1,
		name: "Editor",
		hex: "#aabbcc",
		description: "Editor role",
		permissions: {} as any,
		active: true,
		users: [],
	},
	{
		id: 2,
		name: "Viewer",
		hex: "#ddeeff",
		description: "Viewer role",
		permissions: {} as any,
		active: true,
		users: [],
	},
	{
		id: 3,
		name: "Administrator",
		hex: "#ff0000",
		description: "Administrator role",
		permissions: {} as any,
		active: true,
		users: [],
	},
	{
		id: 4,
		name: "Webmaster",
		hex: "#00ff00",
		description: "Webmaster role",
		permissions: {} as any,
		active: true,
		users: [],
	},
	{
		id: 5,
		name: "SEO Validator",
		hex: "#0000ff",
		description: "SEO Validator role",
		permissions: {} as any,
		active: true,
		users: [],
	},
];

const mockSites = [
	{ id: 1, name: "Site 1", smallAvatar: null } as any,
	{ id: 2, name: "Site 2", smallAvatar: null } as any,
];

const renderFinalStep = (props = {}) =>
	render(
		<ThemeProvider theme={parseTheme(globalTheme)}>
			<FinalStep
				isSuperAdmin={false}
				userRoles={[]}
				roles={mockRoles}
				sites={mockSites}
				onClose={jest.fn()}
				onViewProfile={jest.fn()}
				{...props}
			/>
		</ThemeProvider>,
	);

describe("FinalStep rendering", () => {
	it("should render View profile and Start Using Griddo buttons", () => {
		renderFinalStep();
		expect(screen.getByText("View profile")).toBeTruthy();
		expect(screen.getByText("Start Using Griddo")).toBeTruthy();
	});
});

describe("FinalStep learn items", () => {
	it("should show Administrator learn items when isSuperAdmin is true", () => {
		renderFinalStep({ isSuperAdmin: true });
		expect(screen.getByText("Create sites")).toBeTruthy();
		expect(screen.getByText("Create Add-ons")).toBeTruthy();
	});

	it("should show Editor learn items when user has Editor role", () => {
		renderFinalStep({
			isSuperAdmin: false,
			userRoles: [{ siteId: 1, roles: [1] }],
		});
		expect(screen.getByText("Add and manage Images")).toBeTruthy();
		expect(screen.getByText("Work with AI")).toBeTruthy();
	});

	it("should show Viewer learn items when user has Viewer role", () => {
		renderFinalStep({
			isSuperAdmin: false,
			userRoles: [{ siteId: 1, roles: [2] }],
		});
		expect(screen.getByText("View pages")).toBeTruthy();
	});

	it("should fall back to Editor items when role has no matching learn items", () => {
		// Create a role that has no matching LEARN_ITEMS (id=99)
		const rolesWithUnmapped = [
			...mockRoles,
			{ id: 99, name: "UnmappedRole", hex: "#ffffff", description: "", permissions: {} as any, active: true, users: [] },
		];
		renderFinalStep({
			isSuperAdmin: false,
			userRoles: [{ siteId: 1, roles: [99] }],
			roles: rolesWithUnmapped,
		});
		// Should fall back to Editor items
		expect(screen.getByText("Add and manage Images")).toBeTruthy();
	});

	it("should show Webmaster learn items when user has Webmaster role", () => {
		renderFinalStep({
			isSuperAdmin: false,
			userRoles: [{ siteId: 1, roles: [4] }],
		});
		expect(screen.getByText("Work with Categories")).toBeTruthy();
	});

	it("should show SEO Validator learn items when user has SEO Validator role", () => {
		renderFinalStep({
			isSuperAdmin: false,
			userRoles: [{ siteId: 1, roles: [5] }],
		});
		expect(screen.getByText("Manage SEO")).toBeTruthy();
		expect(screen.getByText("Preview your SEO")).toBeTruthy();
	});
});

describe("FinalStep events", () => {
	it("should call onClose when Start Using Griddo is clicked", () => {
		const onClose = jest.fn();
		renderFinalStep({ onClose });
		fireEvent.click(screen.getByText("Start Using Griddo"));
		expect(onClose).toHaveBeenCalledTimes(1);
	});

	it("should call onViewProfile when View profile is clicked", () => {
		const onViewProfile = jest.fn();
		renderFinalStep({ onViewProfile });
		fireEvent.click(screen.getByText("View profile"));
		expect(onViewProfile).toHaveBeenCalledTimes(1);
	});
});
