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

fix broken PLP page

Browse Source 
Signed-off-by: Chloe <pinkcloudvnn@gmail.com>
This commit is contained in:
Chloe 2024-06-22 15:21:30 +07:00
parent 8333eb36fc
commit 7015d1caef
No known key found for this signature in database
GPG Key ID: CFD53CE570D42DF5
5 changed files with 23 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -44,7 +44,8 @@ async function CategoryPage({
searchParams?: { [key: string]: string | string[] | undefined }; searchParams?: { [key: string]: string | string[] | undefined };
}) { }) {
const { products, filters, pageInfo } = await getProductsInCollection({ const { products, filters, pageInfo } = await getProductsInCollection({
searchParams searchParams,
collection: params.collection
}); });
return ( return (
@ -65,7 +66,7 @@ async function CategoryPage({
<ProductsList <ProductsList
initialProducts={products} initialProducts={products}
pageInfo={pageInfo} pageInfo={pageInfo}
page="collection" collection={params.collection}
searchParams={searchParams} searchParams={searchParams}
key={JSON.stringify(searchParams)} key={JSON.stringify(searchParams)}
/> />
@ -95,7 +96,10 @@ export default async function CategorySearchPage(props: {
fallback={<FiltersListPlaceholder />} fallback={<FiltersListPlaceholder />}
key={`filters-${props.params.collection}`} key={`filters-${props.params.collection}`}
> >
<FiltersContainer searchParams={props.searchParams} /> <FiltersContainer
searchParams={props.searchParams}
collection={props.params.collection}
/>
<HelpfulLinks collection={props.params.collection} /> <HelpfulLinks collection={props.params.collection} />
</Suspense> </Suspense>
</aside> </aside>

1
app/search/page.tsx
View File

@ -41,7 +41,6 @@ export default async function SearchPage({
initialProducts={products} initialProducts={products}
pageInfo={pageInfo} pageInfo={pageInfo}
searchParams={searchParams} searchParams={searchParams}
page="search"
/> />
</Grid> </Grid>
) : null} ) : null}

6
components/layout/products-list/actions.ts
View File

@ -64,14 +64,16 @@ const constructFilterInput = (filters: {
export const getProductsInCollection = async ({ export const getProductsInCollection = async ({
searchParams, searchParams,
afterCursor afterCursor,
collection
}: { }: {
searchParams?: { searchParams?: {
[key: string]: string | string[] | undefined; [key: string]: string | string[] | undefined;
}; };
afterCursor?: string; afterCursor?: string;
collection?: string;
}) => { }) => {
const { sort, q, collection, ...rest } = searchParams as { [key: string]: string }; const { sort, q, ...rest } = 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 filtersInput = constructFilterInput(rest); const filtersInput = constructFilterInput(rest);

14
components/layout/products-list/index.tsx
View File

@ -13,7 +13,7 @@ const ProductsList = ({
initialProducts, initialProducts,
pageInfo, pageInfo,
searchParams, searchParams,
page collection
}: { }: {
initialProducts: Product[]; initialProducts: Product[];
pageInfo: { pageInfo: {
@ -21,7 +21,7 @@ const ProductsList = ({
hasNextPage: boolean; hasNextPage: boolean;
}; };
searchParams?: { [key: string]: string | string[] | undefined }; searchParams?: { [key: string]: string | string[] | undefined };
page: 'search' | 'collection'; collection?: string;
}) => { }) => {
const [products, setProducts] = useState(initialProducts); const [products, setProducts] = useState(initialProducts);
const [_pageInfo, setPageInfo] = useState(pageInfo); const [_pageInfo, setPageInfo] = useState(pageInfo);
@ -31,13 +31,13 @@ const ProductsList = ({
try { try {
const params = { const params = {
searchParams, searchParams,
afterCursor: _pageInfo.endCursor afterCursor: _pageInfo.endCursor,
collection
}; };
setIsLoading(true); setIsLoading(true);
const { products, pageInfo } = const { products, pageInfo } = collection
page === 'collection' ? await getProductsInCollection(params)
? await getProductsInCollection(params) : await searchProducts(params);
: await searchProducts(params);
setProducts((prev) => [...prev, ...products]); setProducts((prev) => [...prev, ...products]);
setPageInfo({ setPageInfo({

7
components/layout/search/filters/filters-container.tsx
View File

@ -2,12 +2,15 @@ import { getProductsInCollection } from 'components/layout/products-list/actions
import FiltersList from './filters-list'; import FiltersList from './filters-list';
const FiltersContainer = async ({ const FiltersContainer = async ({
searchParams searchParams,
collection
}: { }: {
searchParams?: { [key: string]: string | string[] | undefined }; searchParams?: { [key: string]: string | string[] | undefined };
collection: string;
}) => { }) => {
const { filters } = await getProductsInCollection({ const { filters } = await getProductsInCollection({
searchParams searchParams,
collection
}); });
return <FiltersList filters={filters} defaultOpen={false} />; return <FiltersList filters={filters} defaultOpen={false} />;