import React from "react";
import { render, screen } from "@testing-library/react";
import "@testing-library/jest-dom";
import LangSwitcher from "@/components/LangSwitcher";

// Mock usePathname
const mockUsePathname = jest.fn();
jest.mock("next/navigation", () => ({
  usePathname: () => mockUsePathname(),
}));

describe("LangSwitcher Component", () => {
  beforeEach(() => {
    mockUsePathname.mockReset();
  });

  describe("Basic Rendering", () => {
    it("should render both language options", () => {
      mockUsePathname.mockReturnValue("/en");
      render(<LangSwitcher lang="en" />);

      expect(screen.getByText("EN")).toBeInTheDocument();
      expect(screen.getByText("AR")).toBeInTheDocument();
    });

    it("should highlight current language", () => {
      mockUsePathname.mockReturnValue("/en/about");
      render(<LangSwitcher lang="en" />);

      const enLink = screen.getByText("EN");
      expect(enLink).toHaveClass("bg-brand-green", "text-white");
    });

    it("should not highlight non-current language", () => {
      mockUsePathname.mockReturnValue("/en/about");
      render(<LangSwitcher lang="en" />);

      const arLink = screen.getByText("AR");
      expect(arLink).not.toHaveClass("bg-brand-green", "text-white");
    });
  });

  describe("URL Generation", () => {
    it("should generate correct URL for root path", () => {
      mockUsePathname.mockReturnValue("/en");
      render(<LangSwitcher lang="en" />);

      const arLink = screen.getByText("AR");
      expect(arLink.closest("a")).toHaveAttribute("href", "/ar");
    });

    it("should preserve path when switching language", () => {
      mockUsePathname.mockReturnValue("/en/about");
      render(<LangSwitcher lang="en" />);

      const arLink = screen.getByText("AR");
      expect(arLink.closest("a")).toHaveAttribute("href", "/ar/about");
    });

    it("should handle nested paths", () => {
      mockUsePathname.mockReturnValue("/en/industries/healthcare");
      render(<LangSwitcher lang="en" />);

      const arLink = screen.getByText("AR");
      expect(arLink.closest("a")).toHaveAttribute(
        "href",
        "/ar/industries/healthcare",
      );
    });

    it("should handle paths with query parameters", () => {
      mockUsePathname.mockReturnValue("/en/pricing");
      render(<LangSwitcher lang="en" />);

      const arLink = screen.getByText("AR");
      expect(arLink.closest("a")).toHaveAttribute("href", "/ar/pricing");
    });
  });

  describe("Arabic Language", () => {
    it("should highlight Arabic when current", () => {
      mockUsePathname.mockReturnValue("/ar/about");
      render(<LangSwitcher lang="ar" />);

      const arLink = screen.getByText("AR");
      expect(arLink).toHaveClass("bg-brand-green", "text-white");
    });

    it("should generate correct EN URL from AR page", () => {
      mockUsePathname.mockReturnValue("/ar/contact");
      render(<LangSwitcher lang="ar" />);

      const enLink = screen.getByText("EN");
      expect(enLink.closest("a")).toHaveAttribute("href", "/en/contact");
    });
  });

  describe("Edge Cases", () => {
    it("should handle empty pathname", () => {
      mockUsePathname.mockReturnValue("");
      render(<LangSwitcher lang="en" />);

      const arLink = screen.getByText("AR");
      expect(arLink.closest("a")).toHaveAttribute("href", "/ar");
    });

    it("should handle null pathname", () => {
      mockUsePathname.mockReturnValue(null);
      render(<LangSwitcher lang="en" />);

      const arLink = screen.getByText("AR");
      expect(arLink.closest("a")).toHaveAttribute("href", "/ar");
    });

    it("should remove duplicate language prefix", () => {
      mockUsePathname.mockReturnValue("/en/en/about");
      render(<LangSwitcher lang="en" />);

      const arLink = screen.getByText("AR");
      expect(arLink.closest("a")).toHaveAttribute("href", "/ar/en/about");
    });
  });

  describe("Accessibility", () => {
    it("should render as links", () => {
      mockUsePathname.mockReturnValue("/en");
      render(<LangSwitcher lang="en" />);

      const links = screen.getAllByRole("link");
      expect(links).toHaveLength(2);
    });

    it("should have proper link structure", () => {
      mockUsePathname.mockReturnValue("/en/about");
      render(<LangSwitcher lang="en" />);

      const enLink = screen.getByText("EN").closest("a");
      const arLink = screen.getByText("AR").closest("a");

      expect(enLink).toHaveAttribute("href");
      expect(arLink).toHaveAttribute("href");
    });
  });

  describe("Styling", () => {
    it("should have rounded borders", () => {
      mockUsePathname.mockReturnValue("/en");
      const { container } = render(<LangSwitcher lang="en" />);

      const wrapper = container.firstChild;
      expect(wrapper).toHaveClass("rounded");
    });

    it("should apply transition classes", () => {
      mockUsePathname.mockReturnValue("/en");
      render(<LangSwitcher lang="en" />);

      const enLink = screen.getByText("EN");
      expect(enLink).toHaveClass("transition-colors");
    });
  });
});
