feat: add collection filtering

Author: VariableVic

src/app/api/products/route.ts

@@ -2,39 +2,114 @@ import { NextResponse, NextRequest } from "next/server"
 import getPrices from "@lib/util/get-product-prices"
 
 import { initialize as initializeProductModule } from "@medusajs/product"
-import { FilterableProductProps } from "@medusajs/types/dist/product/common"
+import {
+  FilterableProductProps,
+  ProductDTO,
+} from "@medusajs/types/dist/product/common"
+import { notFound } from "next/navigation"
 
 export async function GET(request: NextRequest) {
+  const queryParams = Object.fromEntries(request.nextUrl.searchParams)
+
+  const { collection_id } = queryParams
+
+  if (collection_id) {
+    const response = await getProductsByCollectionId(queryParams)
+
+    if (!response) {
+      return notFound()
+    }
+
+    return NextResponse.json(response)
+  }
+
+  const response = await getProducts(queryParams)
+
+  if (!response) {
+    return notFound()
+  }
+
+  return NextResponse.json(response)
+}
+
+async function getProductsByCollectionId(queryParams: Record<string, any>) {
   const productService = await initializeProductModule()
 
-  const { id, limit, offset, cart_id } = Object.fromEntries(
-    request.nextUrl.searchParams
+  const { limit, offset, cart_id, collection_id } = queryParams
+
+  const collectionIds = collection_id.split(",")
+
+  const data = await productService.listCollections(
+    { id: collectionIds },
+    {
+      relations: [
+        "products",
+        "products.variants",
+        "products.tags",
+        "products.status",
+        "products.collection",
+      ],
+    }
+  )
+
+  const products = data.map((c) => c.products).flat() as ProductDTO[]
+
+  if (!products) return []
+
+  const publishedProducts = filterPublishedProducts(products)
+
+  const count = publishedProducts.length
+
+  const page = publishedProducts.slice(
+    parseInt(offset),
+    parseInt(offset) + parseInt(limit)
   )
 
+  const productsWithPrices = await getPrices(page, cart_id)
+
+  const nextPage = parseInt(offset) + parseInt(limit)
+
+  return {
+    products: productsWithPrices,
+    count,
+    nextPage: count > nextPage ? nextPage : null,
+  }
+}
+
+async function getProducts(params: Record<string, any>) {
+  const productService = await initializeProductModule()
+  const { id, limit, offset, cart_id } = params
+
   const filters = {} as FilterableProductProps
 
   if (id) {
     filters.id = id.split(",")
   }
 
   const [data, count] = await productService.listAndCount(filters, {
-    relations: ["variants", "variants", "tags", "status"],
+    relations: ["variants", "variants", "tags", "status", "collection"],
     take: parseInt(limit) || 100,
     skip: parseInt(offset) || 0,
     withDeleted: false,
   })
 
-  const publishedProducts = data.filter(
-    (product) => product.status === "published"
-  )
+  if (!data) {
+    return []
+  }
+
+  const publishedProducts = filterPublishedProducts(data)
 
   const productsWithPrices = await getPrices(publishedProducts, cart_id)
 
   const nextPage = parseInt(offset) + parseInt(limit)
 
-  return NextResponse.json({
+  return {
     products: productsWithPrices,
     count,
     nextPage: count > nextPage ? nextPage : null,
-  })
+  }
+}
+
+function filterPublishedProducts(products: ProductDTO[]) {
+  return products.filter((product) => product.status === "published")
 }

src/lib/util/get-product-prices.ts

@@ -14,9 +14,12 @@ export default async function getVariants(data: ProductDTO[], cartId?: string) {
   // Map of variant id to variant object
   const variantsById = new Map<string, Record<string, any>>()
 
+  const productIds = data.map((p) => p.id)
+
   const query = {
+    id: productIds,
     expand: "variants,variants.prices,variants.options",
-  } as Record<string, string>
+  } as Record<string, any>
 
   if (cartId) {
     query.cart_id = cartId

src/modules/products/components/option-select/index.tsx

@@ -16,12 +16,8 @@ const OptionSelect: React.FC<OptionSelectProps> = ({
   updateOption,
   title,
 }) => {
-  console.log({ option })
-
   const filteredOptions = option.values.map((v) => v.value).filter(onlyUnique)
 
-  console.log({ filteredOptions })
-
   return (
     <div className="flex flex-col gap-y-3">
       <span className="text-base-semi">Select {title}</span>