import "@testing-library/jest-dom";
import "whatwg-fetch";
import React from "react";
import { render } from "@testing-library/react";
import { ToastProvider } from "@/components/Toast";

// Mock Next.js router
jest.mock("next/navigation", () => ({
  useRouter() {
    return {
      push: jest.fn(),
      replace: jest.fn(),
      prefetch: jest.fn(),
      back: jest.fn(),
      pathname: "/",
      query: {},
      asPath: "/",
    };
  },
  usePathname() {
    return "/";
  },
  useSearchParams() {
    return new URLSearchParams();
  },
  notFound: jest.fn(),
}));

// Mock next-intl (ESM) for Jest
jest.mock("next-intl", () => ({
  useLocale: () => "en",
  useTranslations:
    (namespace?: string) =>
    (key: string) => {
      if (namespace === "nav") {
        const map: Record<string, string> = {
          home: "Home",
          about: "About",
          projects: "Projects",
          contact: "Contact",
        };
        return map[key] || key;
      }
      if (namespace === "common") {
        const map: Record<string, string> = {
          backToHome: "Back to Home",
          backToProjects: "Back to Projects",
        };
        return map[key] || key;
      }
      return key;
    },
  NextIntlClientProvider: ({ children }: { children: React.ReactNode }) =>
    React.createElement(React.Fragment, null, children),
}));

// Mock next/link
jest.mock("next/link", () => {
  return function Link({
    children,
    href,
  }: {
    children: React.ReactNode;
    href: string;
  }) {
    return React.createElement("a", { href }, children);
  };
});

// Mock next/image
jest.mock("next/image", () => {
  return function Image({
    src,
    alt,
    ...props
  }: React.ImgHTMLAttributes<HTMLImageElement>) {
    return React.createElement("img", { src, alt, ...props });
  };
});

// Mock react-responsive-masonry if it's used
jest.mock("react-responsive-masonry", () => {
  const MasonryComponent = function Masonry({
    children,
  }: {
    children: React.ReactNode;
  }) {
    return React.createElement("div", { "data-testid": "masonry" }, children);
  };

  const ResponsiveMasonryComponent = function ResponsiveMasonry({
    children,
  }: {
    children: React.ReactNode;
  }) {
    return React.createElement(
      "div",
      { "data-testid": "responsive-masonry" },
      children,
    );
  };

  return {
    __esModule: true,
    default: MasonryComponent,
    ResponsiveMasonry: ResponsiveMasonryComponent,
  };
});

// Custom render function with ToastProvider
const customRender = (ui: React.ReactElement, options = {}) =>
  render(ui, {
    wrapper: ({ children }) =>
      React.createElement(ToastProvider, null, children),
    ...options,
  });

// Re-export everything
export * from "@testing-library/react";
export { customRender as render };