/
OrderBy.js
85 lines (78 loc) · 2.02 KB
/
OrderBy.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
import PropTypes from 'prop-types'
import React, { useMemo } from 'react'
import { useIntl } from 'react-intl'
import SelectionListOrderBy from './components/SelectionListOrderBy'
export const SORT_OPTIONS = [
{
value: '',
label: 'store/ordenation.relevance',
},
{
value: 'OrderByTopSaleDESC',
label: 'store/ordenation.sales',
},
{
value: 'OrderByReleaseDateDESC',
label: 'store/ordenation.release.date',
},
{
value: 'OrderByBestDiscountDESC',
label: 'store/ordenation.discount',
},
{
value: 'OrderByPriceDESC',
label: 'store/ordenation.price.descending',
},
{
value: 'OrderByPriceASC',
label: 'store/ordenation.price.ascending',
},
{
value: 'OrderByNameASC',
label: 'store/ordenation.name.ascending',
},
{
value: 'OrderByNameDESC',
label: 'store/ordenation.name.descending',
},
]
const OrderBy = ({
orderBy,
message,
specificationOptions = [],
hiddenOptions = [],
showOrderTitle = true,
}) => {
const intl = useIntl()
const sortingOptions = useMemo(() => {
return SORT_OPTIONS.concat(specificationOptions)
.filter(option => !hiddenOptions.includes(option.value) && option.label)
.map(({ value, label }) => {
return {
value,
label: intl.formatMessage({ id: label }),
}
})
}, [intl, hiddenOptions, specificationOptions])
return (
<SelectionListOrderBy
orderBy={orderBy}
message={message}
options={sortingOptions}
showOrderTitle={showOrderTitle}
/>
)
}
OrderBy.propTypes = {
/** Which sorting option is selected. */
orderBy: PropTypes.string,
/** Specification sorting options to be displayed in the list */
specificationOptions: PropTypes.arrayOf(PropTypes.object),
/** Options to be hidden. (e.g. `["OrderByNameASC", "OrderByNameDESC"]`) */
hiddenOptions: PropTypes.arrayOf(PropTypes.string),
/** Message to be displayed */
message: PropTypes.string,
/** Show or hide order title */
showOrderTitle: PropTypes.bool,
}
export default OrderBy