crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-23 04:36:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

✨ feat: sort products list

Browse Source 
:%s
This commit is contained in:
lytrankieio123
2021-10-06 17:49:41 +07:00
parent a91417eca9
commit fb375ed4e8
2 changed files with 45 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/modules/product-list/ProductListFilter/ProductListFilter.tsx
View File

@@ -7,7 +7,7 @@ import BreadcrumbCommon from 'src/components/common/BreadcrumbCommon/BreadcrumbC
import SkeletonImage from 'src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage' import SkeletonImage from 'src/components/common/SkeletonCommon/SkeletonImage/SkeletonImage'
import { useSearchProducts } from 'src/components/hooks/product' import { useSearchProducts } from 'src/components/hooks/product'
import { DEFAULT_PAGE_SIZE, QUERY_KEY, QUERY_SPLIT_SEPERATOR, ROUTE } from 'src/utils/constanst.utils' import { DEFAULT_PAGE_SIZE, QUERY_KEY, QUERY_SPLIT_SEPERATOR, ROUTE } from 'src/utils/constanst.utils'
import { getFacetIdsFromCodes, getPageFromQuery } from 'src/utils/funtion.utils' import { getFacetIdsFromCodes, getPageFromQuery, getProductSortParamFromQuery } from 'src/utils/funtion.utils'
import s from './ProductListFilter.module.scss' import s from './ProductListFilter.module.scss'
import ProductsMenuNavigationTablet from './ProductsMenuNavigationTablet/ProductsMenuNavigationTablet' import ProductsMenuNavigationTablet from './ProductsMenuNavigationTablet/ProductsMenuNavigationTablet'
import ProductSort from './ProductSort/ProductSort' import ProductSort from './ProductSort/ProductSort'
@@ -64,6 +64,12 @@ const ProductListFilter = ({ facets, collections, products, total }: ProductList
const page = getPageFromQuery(router.query[QUERY_KEY.PAGE] as string) const page = getPageFromQuery(router.query[QUERY_KEY.PAGE] as string)
query.input.skip = page * DEFAULT_PAGE_SIZE query.input.skip = page * DEFAULT_PAGE_SIZE
const sortQuery = router.query[QUERY_KEY.SORTBY] as string
if (sortQuery) {
query.input.sort = getProductSortParamFromQuery(sortQuery)
}
// collections // collections
const categoryQuery = router.query[QUERY_KEY.CATEGORY] as string const categoryQuery = router.query[QUERY_KEY.CATEGORY] as string
if (categoryQuery) { if (categoryQuery) {

41
src/utils/funtion.utils.ts
View File

@@ -1,7 +1,7 @@
import { Facet } from "@commerce/types/facet"; import { Facet } from "@commerce/types/facet";
import { FacetValue } from './../../framework/vendure/schema.d'; import { FacetValue, SearchResultSortParameter } from './../../framework/vendure/schema.d';
import { CODE_FACET_DISCOUNT, CODE_FACET_FEATURED, CODE_FACET_FEATURED_VARIANT } from "./constanst.utils"; import { CODE_FACET_DISCOUNT, CODE_FACET_FEATURED, CODE_FACET_FEATURED_VARIANT, PRODUCT_SORT_OPTION_VALUE } from "./constanst.utils";
import { PromiseWithKey } from "./types.utils"; import { PromiseWithKey, SortOrder } from "./types.utils";
export function isMobile() { export function isMobile() {
return window.innerWidth < 768 return window.innerWidth < 768
@@ -20,6 +20,41 @@ export function getPageFromQuery(pageQuery: string) {
return page return page
} }
export function getProductSortParamFromQuery(query: string) {
let rs = {} as SearchResultSortParameter
switch (query) {
case PRODUCT_SORT_OPTION_VALUE.NAME_ASC:
rs = {
name: SortOrder.Asc
}
break;
case PRODUCT_SORT_OPTION_VALUE.NAME_DESC:
rs = {
name: SortOrder.Desc
}
break;
case PRODUCT_SORT_OPTION_VALUE.PRICE_ASC:
rs = {
price: SortOrder.Asc
}
break;
case PRODUCT_SORT_OPTION_VALUE.PRICE_DESC:
rs = {
price: SortOrder.Desc
}
break;
default:
break;
}
return rs
}
export function removeItem<T>(arr: Array<T>, value: T): Array<T> { export function removeItem<T>(arr: Array<T>, value: T): Array<T> {
const index = arr.indexOf(value); const index = arr.indexOf(value);
if (index > -1) { if (index > -1) {