mirror of
https://github.com/vercel/commerce.git
synced 2025-07-23 04:36:49 +00:00
@@ -59,7 +59,7 @@ async function CategoryPage({
|
||||
<MobileFilters filters={filters} menu={<SubMenu collection={params.collection} />} />
|
||||
<SortingMenu />
|
||||
</div>
|
||||
<Grid className="grid-cols-1 sm:grid-cols-2 sm:gap-x-8 lg:grid-cols-3">
|
||||
<Grid className="hide-scrollbar max-h-[1000px] grid-cols-1 overflow-y-auto sm:grid-cols-2 sm:gap-x-8 lg:grid-cols-3">
|
||||
{products.length === 0 ? (
|
||||
<p className="py-3 text-lg">{`No products found in this collection`}</p>
|
||||
) : (
|
||||
@@ -81,38 +81,43 @@ export default async function CategorySearchPage(props: {
|
||||
searchParams?: { [key: string]: string | string[] | undefined };
|
||||
}) {
|
||||
return (
|
||||
<div className="grid lg:grid-cols-3 lg:gap-x-10 xl:grid-cols-4">
|
||||
<aside className="hidden lg:block">
|
||||
<div className="mb-5">
|
||||
<Suspense fallback={<YMMFiltersPlaceholder />}>
|
||||
<YMMFilters />
|
||||
<>
|
||||
<div className="grid lg:grid-cols-3 lg:gap-x-10 xl:grid-cols-4">
|
||||
<aside className="hidden lg:block">
|
||||
<div className="mb-5">
|
||||
<Suspense fallback={<YMMFiltersPlaceholder />}>
|
||||
<YMMFilters />
|
||||
</Suspense>
|
||||
</div>
|
||||
|
||||
<SubMenu collection={props.params.collection} />
|
||||
<h3 className="sr-only">Filters</h3>
|
||||
<Suspense
|
||||
fallback={<FiltersListPlaceholder />}
|
||||
key={`filters-${props.params.collection}`}
|
||||
>
|
||||
<FiltersContainer searchParams={props.searchParams} />
|
||||
<HelpfulLinks collection={props.params.collection} />
|
||||
</Suspense>
|
||||
</aside>
|
||||
<div className="lg:col-span-2 xl:col-span-3">
|
||||
<div className="mb-2">
|
||||
<Suspense fallback={<BreadcrumbHome />} key={`breadcrumb-${props.params.collection}`}>
|
||||
<Breadcrumb type="collection" handle={props.params.collection} />
|
||||
</Suspense>
|
||||
</div>
|
||||
<Suspense fallback={<HeaderPlaceholder />} key={`header-${props.params.collection}`}>
|
||||
<Header collection={props.params.collection} />
|
||||
</Suspense>
|
||||
|
||||
<Suspense
|
||||
fallback={<ProductsGridPlaceholder />}
|
||||
key={`products-${props.params.collection}`}
|
||||
>
|
||||
<CategoryPage {...props} />
|
||||
</Suspense>
|
||||
</div>
|
||||
|
||||
<SubMenu collection={props.params.collection} />
|
||||
<h3 className="sr-only">Filters</h3>
|
||||
<Suspense fallback={<FiltersListPlaceholder />} key={`filters-${props.params.collection}`}>
|
||||
<FiltersContainer searchParams={props.searchParams} />
|
||||
<HelpfulLinks collection={props.params.collection} />
|
||||
</Suspense>
|
||||
</aside>
|
||||
<div className="lg:col-span-2 xl:col-span-3">
|
||||
<div className="mb-2">
|
||||
<Suspense fallback={<BreadcrumbHome />} key={`breadcrumb-${props.params.collection}`}>
|
||||
<Breadcrumb type="collection" handle={props.params.collection} />
|
||||
</Suspense>
|
||||
</div>
|
||||
<Suspense fallback={<HeaderPlaceholder />} key={`header-${props.params.collection}`}>
|
||||
<Header collection={props.params.collection} />
|
||||
</Suspense>
|
||||
|
||||
<Suspense
|
||||
fallback={<ProductsGridPlaceholder />}
|
||||
key={`products-${props.params.collection}`}
|
||||
>
|
||||
<CategoryPage {...props} />
|
||||
</Suspense>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
Reference in New Issue
Block a user