import {useShopActionQuery} from '../../internal/reactQuery'
import {useShopActions} from '../../internal/useShopActions'
import {DataHookOptionsBase, DataHookReturnsBase, Product} from '../../types'

export interface UseProductsParams extends DataHookOptionsBase {
  /**
   * The product IDs to fetch.
   */
  ids: string[]
}

export interface UseProductsReturns extends DataHookReturnsBase {
  /**
   * The products returned from the query.
   */
  products: Product[] | null
}

export const useProducts = (params: UseProductsParams): UseProductsReturns => {
  const {getProducts} = useShopActions()
  const {skip = false, ...restParams} = params

  const {data, ...rest} = useShopActionQuery(
    ['products', restParams],
    getProducts,
    restParams,
    {skip}
  )

  return {
    ...rest,
    products: data,
  }
}

/**
 * The `useProducts` hook efficiently fetches multiple products in a single batched request. Takes an array of product IDs and returns complete product data. Ideal for product grids, carousels, or any UI displaying multiple products. All products share a single query cache entry, making this more efficient than multiple `useProduct()` calls. The entire query refetches if any ID in the array changes.
 * @publicDocs
 */
export type UseProductsGeneratedType = (
  params: UseProductsParams
) => UseProductsReturns