Skip to content

Commit 330c4ce

Browse files
feat: translate language, level and availability dropdown options (#399)
1 parent 1e2bcec commit 330c4ce

File tree

3 files changed

+220
-37
lines changed

3 files changed

+220
-37
lines changed

packages/catalog-search/src/CurrentRefinements.jsx

Lines changed: 2 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -6,41 +6,21 @@ import classNames from 'classnames';
66
import { Badge, Button } from '@openedx/paragon';
77
import { CloseSmall } from '@openedx/paragon/icons';
88
import { connectCurrentRefinements } from 'react-instantsearch-dom';
9-
import { FormattedMessage, defineMessages, useIntl } from '@edx/frontend-platform/i18n';
9+
import { FormattedMessage, useIntl } from '@edx/frontend-platform/i18n';
1010

1111
import ClearCurrentRefinements from './ClearCurrentRefinements';
1212

1313
import {
1414
QUERY_PARAMS_TO_IGNORE,
1515
NUM_CURRENT_REFINEMENTS_TO_DISPLAY,
1616
STYLE_VARIANTS,
17-
LEARNING_TYPE_PATHWAY,
18-
LEARNING_TYPE_COURSE,
19-
LEARNING_TYPE_PROGRAM,
2017
} from './data/constants';
2118
import {
2219
useActiveRefinementsAsFlatArray,
2320
} from './data/hooks';
2421
import { SearchContext } from './SearchContext';
2522
import { removeFromRefinementArray, deleteRefinementAction } from './data/actions';
26-
27-
const messages = defineMessages({
28-
[LEARNING_TYPE_COURSE]: {
29-
id: 'search.facetFilters.filterTitle.course',
30-
defaultMessage: 'Course',
31-
description: 'Title for the course filter.',
32-
},
33-
[LEARNING_TYPE_PROGRAM]: {
34-
id: 'search.facetFilters.filterTitle.program',
35-
defaultMessage: 'Program',
36-
description: 'Title for the program filter.',
37-
},
38-
[LEARNING_TYPE_PATHWAY]: {
39-
id: 'search.facetFilters.filterTitle.pathway',
40-
defaultMessage: 'Pathway',
41-
description: 'Title for the pathway filter.',
42-
},
43-
});
23+
import messages from './messages';
4424

4525
export const CurrentRefinementsBase = ({ items, variant }) => {
4626
if (!items || !items.length) {

packages/catalog-search/src/FacetItem.jsx

Lines changed: 21 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3,22 +3,27 @@ import PropTypes from 'prop-types';
33
import { Badge, Input, Dropdown } from '@openedx/paragon';
44
import classNames from 'classnames';
55

6+
import { useIntl } from '@edx/frontend-platform/i18n';
67
import { STYLE_VARIANTS } from './data/constants';
8+
import messages from './messages';
79

810
const FacetItem = ({
911
handleInputOnChange, item, isChecked, variant, showBadge,
10-
}) => (
11-
<Dropdown.Item as="label" className="mb-0 py-3 d-flex align-items-center">
12-
<Input
13-
type="checkbox"
14-
checked={isChecked}
15-
onChange={() => handleInputOnChange(item)}
16-
className="facet-item position-relative mr-2 mb-2"
17-
/>
18-
<span className={classNames('facet-item-label', { 'is-refined': isChecked })}>
19-
{item.label}
20-
</span>
21-
{showBadge && (
12+
}) => {
13+
const intl = useIntl();
14+
15+
return (
16+
<Dropdown.Item as="label" className="mb-0 py-3 d-flex align-items-center">
17+
<Input
18+
type="checkbox"
19+
checked={isChecked}
20+
onChange={() => handleInputOnChange(item)}
21+
className="facet-item position-relative mr-2 mb-2"
22+
/>
23+
<span className={classNames('facet-item-label', { 'is-refined': isChecked })}>
24+
{messages[item.label] ? intl.formatMessage(messages[item.label]) : item.label}
25+
</span>
26+
{showBadge && (
2227
<Badge
2328
pill
2429
className={classNames(
@@ -28,9 +33,10 @@ const FacetItem = ({
2833
>
2934
{item.count}
3035
</Badge>
31-
)}
32-
</Dropdown.Item>
33-
);
36+
)}
37+
</Dropdown.Item>
38+
);
39+
};
3440

3541
FacetItem.defaultProps = {
3642
variant: STYLE_VARIANTS.inverse,
Lines changed: 197 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,197 @@
1+
import { defineMessages } from '@edx/frontend-platform/i18n';
2+
import {
3+
LEARNING_TYPE_PATHWAY,
4+
LEARNING_TYPE_COURSE,
5+
LEARNING_TYPE_PROGRAM,
6+
} from './data/constants';
7+
8+
const AVAILABILITY_AVAILABLE_NOW = 'Available Now';
9+
const AVAILABILITY_UPCOMING = 'Upcoming';
10+
const AVAILABILITY_STARTING_SOON = 'Starting Soon';
11+
const AVAILABILITY_ARCHIVED = 'Archived';
12+
13+
const LEVEL_INTRODUCTORY = 'Introductory';
14+
const LEVEL_INTERMEDIATE = 'Intermediate';
15+
const LEVEL_ADVANCED = 'Advanced';
16+
17+
const LANGUAGE_ENGLISH = 'English';
18+
const LANGUAGE_SPANISH = 'Spanish';
19+
const LANGUAGE_FRENCH = 'French';
20+
const LANGUAGE_ITALIAN = 'Italian';
21+
const LANGUAGE_ARABIC = 'Arabic';
22+
const LANGUAGE_CHINESE_MANDARIN = 'Chinese - Mandarin';
23+
const LANGUAGE_GERMAN = 'German';
24+
const LANGUAGE_CHINESE_CHINA = 'Chinese - China';
25+
const LANGUAGE_PORTUGUESE = 'Portuguese';
26+
const LANGUAGE_CHINESE_SIMPLIFIED = 'Chinese - Simplified';
27+
const LANGUAGE_JAPANESE = 'Japanese';
28+
const LANGUAGE_RUSSIAN = 'Russian';
29+
const LANGUAGE_URDU = 'Urdu';
30+
const LANGUAGE_BENGALI = 'Bengali';
31+
const LANGUAGE_DUTCH = 'Dutch';
32+
const LANGUAGE_FARSI = 'Farsi';
33+
const LANGUAGE_HINDI = 'Hindi';
34+
const LANGUAGE_HUNGARIAN = 'Hungarian';
35+
const LANGUAGE_MALDIVIAN = 'Maldivian';
36+
const LANGUAGE_SINHALESE = 'Sinhalese';
37+
const LANGUAGE_TIBETAN = 'Tibetan';
38+
39+
const messages = defineMessages({
40+
[LEARNING_TYPE_COURSE]: {
41+
id: 'search.facetFilters.filterTitle.course',
42+
defaultMessage: 'Course',
43+
description: 'Title for the course filter.',
44+
},
45+
[LEARNING_TYPE_PROGRAM]: {
46+
id: 'search.facetFilters.filterTitle.program',
47+
defaultMessage: 'Program',
48+
description: 'Title for the program filter.',
49+
},
50+
[LEARNING_TYPE_PATHWAY]: {
51+
id: 'search.facetFilters.filterTitle.pathway',
52+
defaultMessage: 'Pathway',
53+
description: 'Title for the pathway filter.',
54+
},
55+
[AVAILABILITY_AVAILABLE_NOW]: {
56+
id: 'search.facetFilters.availability.availableNow',
57+
defaultMessage: 'Available Now',
58+
description: 'Option label for the available now filter.',
59+
},
60+
[AVAILABILITY_UPCOMING]: {
61+
id: 'search.facetFilters.availability.upcoming',
62+
defaultMessage: 'Upcoming',
63+
description: 'Option label for the upcoming filter.',
64+
},
65+
[AVAILABILITY_STARTING_SOON]: {
66+
id: 'search.facetFilters.availability.startingSoon',
67+
defaultMessage: 'Starting Soon',
68+
description: 'Option label for the starting soon filter.',
69+
},
70+
[AVAILABILITY_ARCHIVED]: {
71+
id: 'search.facetFilters.availability.archived',
72+
defaultMessage: 'Archived',
73+
description: 'Option label for the archived filter.',
74+
},
75+
[LEVEL_INTRODUCTORY]: {
76+
id: 'search.facetFilters.level.introductory',
77+
defaultMessage: 'Introductory',
78+
description: 'Option label for the introductory filter.',
79+
},
80+
[LEVEL_INTERMEDIATE]: {
81+
id: 'search.facetFilters.level.intermediate',
82+
defaultMessage: 'Intermediate',
83+
description: 'Option label for the intermediate filter.',
84+
},
85+
[LEVEL_ADVANCED]: {
86+
id: 'search.facetFilters.level.advanced',
87+
defaultMessage: 'Advanced',
88+
description: 'Option label for the advanced filter.',
89+
},
90+
[LANGUAGE_ENGLISH]: {
91+
id: 'search.facetFilters.language.english',
92+
defaultMessage: 'English',
93+
description: 'Option label for the english language filter.',
94+
},
95+
[LANGUAGE_SPANISH]: {
96+
id: 'search.facetFilters.language.spanish',
97+
defaultMessage: 'Spanish',
98+
description: 'Option label for the spanish language filter.',
99+
},
100+
[LANGUAGE_FRENCH]: {
101+
id: 'search.facetFilters.language.french',
102+
defaultMessage: 'French',
103+
description: 'Option label for the french language filter.',
104+
},
105+
[LANGUAGE_ITALIAN]: {
106+
id: 'search.facetFilters.language.italian',
107+
defaultMessage: 'Italian',
108+
description: 'Option label for the italian language filter.',
109+
},
110+
[LANGUAGE_ARABIC]: {
111+
id: 'search.facetFilters.language.arabic',
112+
defaultMessage: 'Arabic',
113+
description: 'Option label for the arabic language filter.',
114+
},
115+
[LANGUAGE_CHINESE_MANDARIN]: {
116+
id: 'search.facetFilters.language.chineseMandarin',
117+
defaultMessage: 'Chinese - Mandarin',
118+
description: 'Option label for the chinese mandarin language filter.',
119+
},
120+
[LANGUAGE_GERMAN]: {
121+
id: 'search.facetFilters.language.german',
122+
defaultMessage: 'German',
123+
description: 'Option label for the german language filter.',
124+
},
125+
[LANGUAGE_CHINESE_CHINA]: {
126+
id: 'search.facetFilters.language.chineseChina',
127+
defaultMessage: 'Chinese - China',
128+
description: 'Option label for the chinese language filter.',
129+
},
130+
[LANGUAGE_PORTUGUESE]: {
131+
id: 'search.facetFilters.language.portuguese',
132+
defaultMessage: 'Portuguese',
133+
description: 'Option label for the portuguese language filter.',
134+
},
135+
[LANGUAGE_CHINESE_SIMPLIFIED]: {
136+
id: 'search.facetFilters.language.chineseSimplified',
137+
defaultMessage: 'Chinese - Simplified',
138+
description: 'Option label for the chinese simplified language filter.',
139+
},
140+
[LANGUAGE_JAPANESE]: {
141+
id: 'search.facetFilters.language.japanese',
142+
defaultMessage: 'Japanese',
143+
description: 'Option label for the japanese language filter.',
144+
},
145+
[LANGUAGE_RUSSIAN]: {
146+
id: 'search.facetFilters.language.russian',
147+
defaultMessage: 'Russian',
148+
description: 'Option label for the russian language filter.',
149+
},
150+
[LANGUAGE_URDU]: {
151+
id: 'search.facetFilters.language.urdu',
152+
defaultMessage: 'Urdu',
153+
description: 'Option label for the urdu language filter.',
154+
},
155+
[LANGUAGE_BENGALI]: {
156+
id: 'search.facetFilters.language.bengali',
157+
defaultMessage: 'Bengali',
158+
description: 'Option label for the bengali language filter.',
159+
},
160+
[LANGUAGE_DUTCH]: {
161+
id: 'search.facetFilters.language.dutch',
162+
defaultMessage: 'Dutch',
163+
description: 'Option label for the dutch language filter.',
164+
},
165+
[LANGUAGE_FARSI]: {
166+
id: 'search.facetFilters.language.farsi',
167+
defaultMessage: 'Farsi',
168+
description: 'Option label for the farsi language filter.',
169+
},
170+
[LANGUAGE_HINDI]: {
171+
id: 'search.facetFilters.language.hindi',
172+
defaultMessage: 'Hindi',
173+
description: 'Option label for the hindi language filter.',
174+
},
175+
[LANGUAGE_HUNGARIAN]: {
176+
id: 'search.facetFilters.language.hungarian',
177+
defaultMessage: 'Hungarian',
178+
description: 'Option label for the hungarian language filter.',
179+
},
180+
[LANGUAGE_MALDIVIAN]: {
181+
id: 'search.facetFilters.language.maldivian',
182+
defaultMessage: 'Maldivian',
183+
description: 'Option label for the maldivian language filter.',
184+
},
185+
[LANGUAGE_SINHALESE]: {
186+
id: 'search.facetFilters.language.sinhalese',
187+
defaultMessage: 'Sinhalese',
188+
description: 'Option label for the sinhalese language filter.',
189+
},
190+
[LANGUAGE_TIBETAN]: {
191+
id: 'search.facetFilters.language.tibetan',
192+
defaultMessage: 'Tibetan',
193+
description: 'Option label for the tibetan language filter.',
194+
},
195+
});
196+
197+
export default messages;

0 commit comments

Comments
 (0)