Updates recommended products to use ProductGridItems component (#975)

This commit is contained in:
Stephanie Dietz
2023-04-20 11:27:18 -05:00
committed by GitHub
parent a677c17f78
commit acb4ff400b
5 changed files with 56 additions and 72 deletions

View File

@@ -2,7 +2,8 @@ import { getCollection, getCollectionProducts } from 'lib/shopify';
import { Metadata } from 'next';
import { notFound } from 'next/navigation';
import SearchResults from 'components/layout/search/results';
import Grid from 'components/grid';
import ProductGridItems from 'components/layout/product-grid-items';
export const runtime = 'edge';
@@ -36,11 +37,14 @@ export default async function CategoryPage({ params }: { params: { collection: s
return (
<section>
{/* @ts-expect-error Server Component */}
<SearchResults products={products} />
{products.length === 0 ? (
<p className="py-3 text-lg">{`No products found in this collection`}</p>
) : null}
) : (
<Grid className="grid-cols-2 lg:grid-cols-3">
{/* @ts-expect-error Server Component */}
<ProductGridItems products={products} />
</Grid>
)}
</section>
);
}

View File

@@ -1,4 +1,5 @@
import SearchResults from 'components/layout/search/results';
import Grid from 'components/grid';
import ProductGridItems from 'components/layout/product-grid-items';
import { defaultSort, sorting } from 'lib/constants';
import { getProducts } from 'lib/shopify';
@@ -22,20 +23,20 @@ export default async function SearchPage({
return (
<>
{searchValue &&
(products.length > 0 ? (
<p>
{`Showing ${products.length} ${resultsText} for `}
<span className="font-bold">&quot;{searchValue}&quot;</span>
</p>
) : (
<p>
{'There are no products that match '}
<span className="font-bold">&quot;{searchValue}&quot;</span>
</p>
))}
{/* @ts-expect-error Server Component */}
<SearchResults products={products} />
{searchValue ? (
<p>
{products.length === 0
? 'There are no products that match '
: `Showing ${products.length} ${resultsText} for `}
<span className="font-bold">&quot;{searchValue}&quot;</span>
</p>
) : null}
{products.length > 0 ? (
<Grid className="grid-cols-2 lg:grid-cols-3">
{/* @ts-expect-error Server Component */}
<ProductGridItems products={products} />
</Grid>
) : null}
</>
);
}