crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-13 13:17:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Re-use filter for live products only

Browse Source
This commit is contained in:
Samantha Kellow 2023-09-15 19:51:56 +01:00
parent 88228a8dc2
commit da4216f6f3
4 changed files with 21 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/page.tsx
View File

@ -2,7 +2,7 @@ import { Carousel } from 'components/carousel';
import Grid from 'components/grid'; import Grid from 'components/grid';
import Footer from 'components/layout/footer'; import Footer from 'components/layout/footer';
import ProductGridItems from 'components/layout/product-grid-items'; import ProductGridItems from 'components/layout/product-grid-items';
import { getProducts } from 'lib/shopify'; import { getLiveProducts } from 'lib/utils';
import { Suspense } from 'react'; import { Suspense } from 'react';
export const runtime = 'edge'; export const runtime = 'edge';
@ -15,8 +15,7 @@ export const metadata = {
}; };
export default async function HomePage() { export default async function HomePage() {
const products = await getProducts({}); const liveProducts = await getLiveProducts({});
const liveProducts = products.filter((product) => !product.tags.includes('hidden-product'))
return ( return (
<> <>
@ -24,7 +23,7 @@ export default async function HomePage() {
<Carousel /> <Carousel />
{liveProducts.length > 0 ? ( {liveProducts.length > 0 ? (
<Grid className="grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 m-6"> <Grid className="grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 m-6">
<ProductGridItems products={products} /> <ProductGridItems products={liveProducts} />
</Grid> </Grid>
) : null} ) : null}
<Suspense> <Suspense>

5
app/search/[collection]/page.tsx
View File

@ -1,10 +1,11 @@
import { getCollection, getCollectionProducts } from 'lib/shopify'; import { getCollection } from 'lib/shopify';
import { Metadata } from 'next'; import { Metadata } from 'next';
import { notFound } from 'next/navigation'; import { notFound } from 'next/navigation';
import Grid from 'components/grid'; import Grid from 'components/grid';
import ProductGridItems from 'components/layout/product-grid-items'; import ProductGridItems from 'components/layout/product-grid-items';
import { defaultSort, sorting } from 'lib/constants'; import { defaultSort, sorting } from 'lib/constants';
import { getLiveCollectionProducts } from 'lib/utils';
export const runtime = 'edge'; export const runtime = 'edge';
@ -33,7 +34,7 @@ export default async function CategoryPage({
}) { }) {
const { sort } = searchParams as { [key: string]: string }; const { sort } = searchParams as { [key: string]: string };
const { sortKey, reverse } = sorting.find((item) => item.slug === sort) || defaultSort; const { sortKey, reverse } = sorting.find((item) => item.slug === sort) || defaultSort;
const products = await getCollectionProducts({ collection: params.collection, sortKey, reverse }); const products = await getLiveCollectionProducts({ collection: params.collection, sortKey, reverse });
return ( return (
<section> <section>

4
app/search/page.tsx
View File

@ -1,7 +1,7 @@
import Grid from 'components/grid'; import Grid from 'components/grid';
import ProductGridItems from 'components/layout/product-grid-items'; import ProductGridItems from 'components/layout/product-grid-items';
import { defaultSort, sorting } from 'lib/constants'; import { defaultSort, sorting } from 'lib/constants';
import { getProducts } from 'lib/shopify'; import { getLiveProducts } from 'lib/utils';
export const runtime = 'edge'; export const runtime = 'edge';
@ -18,7 +18,7 @@ export default async function SearchPage({
const { sort, q: searchValue } = searchParams as { [key: string]: string }; const { sort, q: searchValue } = searchParams as { [key: string]: string };
const { sortKey, reverse } = sorting.find((item) => item.slug === sort) || defaultSort; const { sortKey, reverse } = sorting.find((item) => item.slug === sort) || defaultSort;
const products = await getProducts({ sortKey, reverse, query: searchValue }); const products = await getLiveProducts({ sortKey, reverse, query: searchValue });
const resultsText = products.length > 1 ? 'results' : 'result'; const resultsText = products.length > 1 ? 'results' : 'result';
return ( return (

13
lib/utils.ts
View File

@ -1,4 +1,5 @@
import { ReadonlyURLSearchParams } from 'next/navigation'; import { ReadonlyURLSearchParams } from 'next/navigation';
import { getCollectionProducts, getProducts } from './shopify';
export const createUrl = (pathname: string, params: URLSearchParams | ReadonlyURLSearchParams) => { export const createUrl = (pathname: string, params: URLSearchParams | ReadonlyURLSearchParams) => {
const paramsString = params.toString(); const paramsString = params.toString();
@ -6,3 +7,15 @@ export const createUrl = (pathname: string, params: URLSearchParams | ReadonlyUR
return `${pathname}${queryString}`; return `${pathname}${queryString}`;
}; };
export async function getLiveProducts(query: Parameters<typeof getProducts>[0]) {
const products = await getProducts(query);
const liveProducts = products.filter((product) => !product.tags.includes('hidden-product'));
return liveProducts;
}
export async function getLiveCollectionProducts(query: Parameters<typeof getCollectionProducts>[0]) {
const products = await getCollectionProducts(query);
const liveProducts = products.filter((product) => !product.tags.includes('hidden-product'));
return liveProducts;
}