"use client";

import { createContext, useCallback, useContext, useMemo, useState } from "react";
import { useSearchParams } from "next/navigation";
import { useTranslations } from "next-intl";
import { useDispatch, useSelector } from "react-redux";
import { usePathname } from "next/navigation";
import type { AppDispatch, RootState } from "@/store/store";
import { clearSearchResults, getSearchProducts } from "@/store/slices/search-products-slice";

interface SearchContextType {
  // State
  isLoading: boolean;
  searchResults: any[];
  totalCount: number;
  hasMore: boolean;
  minPrice: number | null;
  maxPrice: number | null;
  filteredCategories: any[];

  // Functions
  submitSearch: (query: string) => Promise<any>;
  setSearchQuery: (query: string) => void; // URL only (no fetch)
  clearResults: () => void;
}

const SearchContext = createContext<SearchContextType | null>(null);

export function SearchProvider({ children }: { children: React.ReactNode }) {
  const searchParams = useSearchParams();
  const t = useTranslations();
  const pathname = usePathname();
  const dispatch = useDispatch<AppDispatch>();

  const currentLocale = (pathname?.split("/")?.[1] || "ar").trim() || "ar";

  const {
    products: searchResults,
    categories: filteredCategories,
    totalCount,
    minPrice,
    maxPrice,
    isLoading,
  } = useSelector((state: RootState) => state.searchProducts);

  // Get current search query from URL
  const currentQuery = searchParams?.get("q") || "";
  const currentCategory = searchParams?.get("category") || "";

  // Set search query (updates URL)
  const setSearchQuery = useCallback((query: string) => {
    const params = new URLSearchParams(searchParams || undefined);
    if (query.trim()) {
      params.set("q", query);
    } else {
      params.delete("q");
    }
    // Update URL without page reload
    window.history.pushState(null, "", `?${params.toString()}`);
  }, [searchParams]);

  const submitSearch = useCallback(
    async (query: string) => {
      const q = String(query || "").trim();
      setSearchQuery(q);

      if (!q) {
        dispatch(clearSearchResults());
        return null;
      }

      const action = await dispatch(
        getSearchProducts({
          query: q,
          category: currentCategory || undefined,
          locale: currentLocale,
        }) as any
      );

      if (action?.error) {
        console.error("Search thunk error:", action.error);
        return null;
      }

      return action?.payload ?? null;
    },
    [dispatch, setSearchQuery, currentCategory, currentLocale]
  );

  // Clear results
  const clearResults = useCallback(() => {
    dispatch(clearSearchResults());
    setSearchQuery("");
  }, [dispatch, setSearchQuery]);

  // Memoize context value
  const contextValue = useMemo<SearchContextType>(() => ({
    // State
    isLoading,
    searchResults,
    totalCount,
    hasMore: (searchResults?.length || 0) === 12,
    minPrice,
    maxPrice,
    filteredCategories,

    // Functions
    submitSearch,
    setSearchQuery,
    clearResults,
  }), [
    isLoading,
    searchResults,
    totalCount,
    minPrice,
    maxPrice,
    filteredCategories,
    submitSearch,
    setSearchQuery,
    clearResults,
  ]);

  return (
    <SearchContext.Provider value={contextValue}>
      {children}
    </SearchContext.Provider>
  );
}

export function useSearchContext() {
  const context = useContext(SearchContext);
  if (!context) {
    throw new Error("useSearchContext must be used within SearchProvider");
  }
  return context;
}