import { describe, it, expect, beforeEach, vi } from "vitest";
import { renderHook, waitFor } from "@testing-library/react";
import React from "react";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { useTranslation } from "@/lib/hooks/use-translation";
import { useAuthStore } from "@/lib/store/auth-store";

// Mock the API client
vi.mock("@/lib/api/client", () => ({
  publicApi: {
    cms: vi.fn().mockResolvedValue({ data: [] }),
    cmsBulk: vi.fn().mockResolvedValue({ data: {} }),
  },
}));

function createWrapper() {
  const queryClient = new QueryClient({
    defaultOptions: { queries: { retry: false } },
  });
  return function Wrapper({ children }: { children: React.ReactNode }) {
    return (
      <QueryClientProvider client={queryClient}>
        {children}
      </QueryClientProvider>
    );
  };
}

describe("useTranslation hook", () => {
  beforeEach(() => {
    useAuthStore.setState({ language: "en" });
    vi.clearAllMocks();
  });

  it("returns t function, language, and isLoading", async () => {
    const { result } = renderHook(() => useTranslation("COMMON"), {
      wrapper: createWrapper(),
    });

    expect(result.current.t).toBeTypeOf("function");
    expect(result.current.language).toBe("en");
    expect(typeof result.current.isLoading).toBe("boolean");
  });

  it("t() returns fallback when no CMS data", async () => {
    const { result } = renderHook(() => useTranslation("COMMON"), {
      wrapper: createWrapper(),
    });

    await waitFor(() => {
      expect(result.current.isLoading).toBe(false);
    });

    // Static JSON has "Save" for COMMON.buttons.save in en
    const val = result.current.t("buttons.save", "FallbackSave");
    // Should return either static JSON or fallback
    expect(typeof val).toBe("string");
    expect(val.length).toBeGreaterThan(0);
  });

  it("t() returns key when no fallback and no data", async () => {
    const { result } = renderHook(() => useTranslation("COMMON"), {
      wrapper: createWrapper(),
    });

    await waitFor(() => {
      expect(result.current.isLoading).toBe(false);
    });

    const val = result.current.t("nonexistent.key");
    expect(val).toBe("nonexistent.key");
  });

  it("handles multi-section with 3-part key", async () => {
    const { result } = renderHook(
      () => useTranslation(["COMMON", "STATUS_LABELS"]),
      { wrapper: createWrapper() }
    );

    await waitFor(() => {
      expect(result.current.isLoading).toBe(false);
    });

    // With static fallback, COMMON.buttons.save should return "Save"
    const val = result.current.t("COMMON.buttons.save", "Fallback");
    expect(typeof val).toBe("string");
  });

  it("reflects language changes from auth store", async () => {
    const { result, rerender } = renderHook(() => useTranslation("COMMON"), {
      wrapper: createWrapper(),
    });

    expect(result.current.language).toBe("en");

    useAuthStore.setState({ language: "hi" });
    rerender();

    expect(result.current.language).toBe("hi");
  });

  it("single section uses 2-part key format", async () => {
    const { result } = renderHook(() => useTranslation("COMMON"), {
      wrapper: createWrapper(),
    });

    await waitFor(() => {
      expect(result.current.isLoading).toBe(false);
    });

    // 2-part key for single section
    const val = result.current.t("buttons.save", "Save");
    expect(val).toBeTruthy();
  });
});