update home page to only show in stock items

Author: Steph Dietz

frontend/app/actions.ts

@@ -35,12 +35,12 @@ const fetchQuery = async ({ query, variables }: FetchQueryProps) => {
 export async function searchProducts(
   query: string,
   maxItems: number,
-  thresholdStars: number
+  thresholdStars: number,
+  inStockOnly: boolean = false
 ) {
-  console.log("Basic search", query, maxItems, thresholdStars);
   const graphqlQuery = `
-query searchProducts($query: String!, $maxItems: Int!, $thresholdStars: Float!) {
-  searchProducts(query: $query, maxItems: $maxItems, thresholdStars: $thresholdStars) {
+query searchProducts($query: String!, $maxItems: Int!, $thresholdStars: Float!, $inStockOnly: Boolean!) {
+  searchProducts(query: $query, maxItems: $maxItems, thresholdStars: $thresholdStars, inStockOnly: $inStockOnly) {
   searchObjs {
     product {
       name
@@ -63,6 +63,7 @@ query searchProducts($query: String!, $maxItems: Int!, $thresholdStars: Float!)
       query,
       maxItems,
       thresholdStars,
+      inStockOnly,
     },
   });
 

frontend/app/components/carousel.tsx

@@ -4,11 +4,7 @@ import { Suspense } from "react";
 import { TileSkeleton } from "./skeletons";
 
 export async function Carousel() {
-  const response = await searchProducts(
-    "Items in the Stuffed Animals & Plush Toys category",
-    7,
-    1,
-  );
+  const response = await searchProducts("Top rated toys", 15, 1, true);
 
   const products = response?.data?.searchProducts?.searchObjs || [];
   // Purposefully duplicating products to make the carousel loop and not run out of products on wide screens.

frontend/app/components/grid.tsx

@@ -42,6 +42,7 @@ export async function ThreeItemGrid() {
     "Items that people of all ages would enjoy",
     3,
     1,
+    true
   );
 
   const topThreeProducts = response?.data?.searchProducts?.searchObjs || [];