import { useQuery } from '@tanstack/react-query';
import type { VendorCardData } from '@/components/ui/domain/VendorCard';
import type { OpeningHoursValue } from '@/components/ui/domain/OpeningHoursFilter';
import type { StoresSortBy } from '@/lib/url/codecs/storesCodec';
import { serializeStoresHoursParam } from '@/lib/url/codecs/storesCodec';

export interface StoreFilters {
  city?: string;
  query?: string;
  lat?: number;
  lng?: number;
  businessTypeId?: string;
  hours: OpeningHoursValue;
  sortBy: StoresSortBy;
}

export interface StoresResponse {
  ok: boolean;
  stores: VendorCardData[];
  nextCursor: string | null;
  totalPages: number;
  totalCount: number;
  filters: {
    cities: string[];
    businessTypes: { id: string; nameHe: string; nameEn: string }[];
  };
}

async function fetchStores(
  filters: StoreFilters,
  page: number,
  perPage: number,
): Promise<StoresResponse> {
  const params = new URLSearchParams();
  if (filters.city) params.set('city', filters.city);
  if (filters.query) params.set('query', filters.query);
  if (filters.businessTypeId) params.set('businessTypeId', filters.businessTypeId);
  const hours = serializeStoresHoursParam(filters.hours);
  if (hours) params.set('open', hours);
  if (filters.sortBy !== 'rating') params.set('sort', filters.sortBy);
  if (filters.lat !== undefined) params.set('lat', String(filters.lat));
  if (filters.lng !== undefined) params.set('lng', String(filters.lng));
  params.set('page', String(page));
  params.set('limit', String(perPage));

  const res = await fetch(`/api/stores?${params.toString()}`);
  if (!res.ok) throw new Error(`Failed to load stores (${res.status})`);
  return res.json() as Promise<StoresResponse>;
}

export function useStores(
  filters: StoreFilters,
  page: number,
  perPage = 10,
  initialData?: StoresResponse,
) {
  return useQuery({
    queryKey: ['stores', filters, page, perPage],
    queryFn: () => fetchStores(filters, page, perPage),
    initialData,
    staleTime: 0,
    placeholderData: (previous) => previous,
  });
}
