Skip to content

Commit 632cc58

Browse files
MartinBraquetMartinBraquet
committed
Add icons
1 parent e565a6c commit 632cc58

File tree

2 files changed

+92
-88
lines changed

2 files changed

+92
-88
lines changed

‎web/components/filters/desktop-filters.tsx‎

Lines changed: 90 additions & 86 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,8 @@ import {RomanticFilter, RomanticFilterText} from "web/components/filters/romanti
2323
import {FaHeart} from "react-icons/fa";
2424
import {DietFilter, DietFilterText} from "web/components/filters/diet-filter";
2525
import {PoliticalFilter, PoliticalFilterText} from "web/components/filters/political-filter";
26+
import {GiFruitBowl} from "react-icons/gi";
27+
import {RiScales3Line} from "react-icons/ri";
2628

2729
export function DesktopFilters(props: {
2830
filters: Partial<FilterFields>
@@ -200,95 +202,95 @@ export function DesktopFilters(props: {
200202
menuWidth="w-50"
201203
/>
202204

203-
{/* WANTS KIDS */}
204-
<DropdownMenu
205-
items={[
206-
{
207-
name: wantsKidsLabelsWithIcon.no_preference.name,
208-
icon: wantsKidsLabelsWithIcon.no_preference.icon,
209-
onClick: () => {
210-
updateFilter({
211-
wants_kids_strength: wantsKidsLabelsWithIcon.no_preference.strength,
212-
})
213-
},
214-
},
215-
{
216-
name: wantsKidsLabelsWithIcon.wants_kids.name,
217-
icon: wantsKidsLabelsWithIcon.wants_kids.icon,
218-
onClick: () => {
219-
updateFilter({
220-
wants_kids_strength: wantsKidsLabelsWithIcon.wants_kids.strength,
221-
})
222-
},
223-
},
224-
{
225-
name: wantsKidsLabelsWithIcon.doesnt_want_kids.name,
226-
icon: wantsKidsLabelsWithIcon.doesnt_want_kids.icon,
227-
onClick: () => {
228-
updateFilter({
229-
wants_kids_strength: wantsKidsLabelsWithIcon.doesnt_want_kids.strength,
230-
})
231-
},
232-
},
233-
]}
234-
closeOnClick
235-
buttonClass={'!text-ink-600 !hover:!text-ink-600'}
236-
buttonContent={(open: boolean) => (
237-
<DropdownButton
238-
content={
239-
<KidsLabel
240-
strength={
241-
filters.wants_kids_strength ??
242-
wantsKidsLabelsWithIcon.no_preference.strength
243-
}
244-
highlightedClass={open ? 'text-primary-500' : ''}
245-
/>
246-
}
247-
open={open}
205+
{/* WANTS KIDS */}
206+
<DropdownMenu
207+
items={[
208+
{
209+
name: wantsKidsLabelsWithIcon.no_preference.name,
210+
icon: wantsKidsLabelsWithIcon.no_preference.icon,
211+
onClick: () => {
212+
updateFilter({
213+
wants_kids_strength: wantsKidsLabelsWithIcon.no_preference.strength,
214+
})
215+
},
216+
},
217+
{
218+
name: wantsKidsLabelsWithIcon.wants_kids.name,
219+
icon: wantsKidsLabelsWithIcon.wants_kids.icon,
220+
onClick: () => {
221+
updateFilter({
222+
wants_kids_strength: wantsKidsLabelsWithIcon.wants_kids.strength,
223+
})
224+
},
225+
},
226+
{
227+
name: wantsKidsLabelsWithIcon.doesnt_want_kids.name,
228+
icon: wantsKidsLabelsWithIcon.doesnt_want_kids.icon,
229+
onClick: () => {
230+
updateFilter({
231+
wants_kids_strength: wantsKidsLabelsWithIcon.doesnt_want_kids.strength,
232+
})
233+
},
234+
},
235+
]}
236+
closeOnClick
237+
buttonClass={'!text-ink-600 !hover:!text-ink-600'}
238+
buttonContent={(open: boolean) => (
239+
<DropdownButton
240+
content={
241+
<KidsLabel
242+
strength={
243+
filters.wants_kids_strength ??
244+
wantsKidsLabelsWithIcon.no_preference.strength
245+
}
246+
highlightedClass={open ? 'text-primary-500' : ''}
247+
/>
248+
}
249+
open={open}
250+
/>
251+
)}
252+
menuItemsClass={'bg-canvas-50'}
253+
menuWidth="w-48"
248254
/>
249-
)}
250-
menuItemsClass={'bg-canvas-50'}
251-
menuWidth="w-48"
252-
/>
253255

254-
{/* HAS KIDS */}
255-
<DropdownMenu
256-
items={[
257-
{
258-
name: hasKidsLabels.no_preference.name,
259-
onClick: () => {
260-
updateFilter({has_kids: hasKidsLabels.no_preference.value})
261-
},
262-
},
263-
{
264-
name: hasKidsLabels.doesnt_have_kids.name,
265-
onClick: () => {
266-
updateFilter({has_kids: hasKidsLabels.doesnt_have_kids.value})
267-
},
268-
},
269-
{
270-
name: hasKidsLabels.has_kids.name,
271-
onClick: () => {
272-
updateFilter({has_kids: hasKidsLabels.has_kids.value})
273-
},
274-
},
275-
]}
276-
closeOnClick
277-
buttonClass={'!text-ink-600 !hover:!text-ink-600'}
278-
buttonContent={(open: boolean) => (
279-
<DropdownButton
280-
content={
281-
<HasKidsLabel
282-
has_kids={filters.has_kids ?? -1}
283-
highlightedClass={open ? 'text-primary-500' : ''}
284-
/>
285-
}
286-
open={open}
256+
{/* HAS KIDS */}
257+
<DropdownMenu
258+
items={[
259+
{
260+
name: hasKidsLabels.no_preference.name,
261+
onClick: () => {
262+
updateFilter({has_kids: hasKidsLabels.no_preference.value})
263+
},
264+
},
265+
{
266+
name: hasKidsLabels.doesnt_have_kids.name,
267+
onClick: () => {
268+
updateFilter({has_kids: hasKidsLabels.doesnt_have_kids.value})
269+
},
270+
},
271+
{
272+
name: hasKidsLabels.has_kids.name,
273+
onClick: () => {
274+
updateFilter({has_kids: hasKidsLabels.has_kids.value})
275+
},
276+
},
277+
]}
278+
closeOnClick
279+
buttonClass={'!text-ink-600 !hover:!text-ink-600'}
280+
buttonContent={(open: boolean) => (
281+
<DropdownButton
282+
content={
283+
<HasKidsLabel
284+
has_kids={filters.has_kids ?? -1}
285+
highlightedClass={open ? 'text-primary-500' : ''}
286+
/>
287+
}
288+
open={open}
289+
/>
290+
)}
291+
menuItemsClass="bg-canvas-50"
292+
menuWidth="w-40"
287293
/>
288-
)}
289-
menuItemsClass="bg-canvas-50"
290-
menuWidth="w-40"
291-
/>
292294

293295
</>
294296
}
@@ -300,6 +302,7 @@ export function DesktopFilters(props: {
300302
open={open}
301303
content={
302304
<Row className="items-center gap-1">
305+
<GiFruitBowl className="h-4 w-4"/>
303306
<DietFilterText
304307
options={
305308
filters.diet as
@@ -326,6 +329,7 @@ export function DesktopFilters(props: {
326329
open={open}
327330
content={
328331
<Row className="items-center gap-1">
332+
<RiScales3Line className="h-4 w-4"/>
329333
<PoliticalFilterText
330334
options={
331335
filters.political_beliefs as

‎web/components/filters/mobile-filters.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -198,7 +198,7 @@ function MobileFilters(props: {
198198
filters.wants_kids_strength != null &&
199199
filters.wants_kids_strength !== -1
200200
}
201-
icon={<WantsKidsIcon strength={filters.wants_kids_strength ?? -1}/>}
201+
// icon={<WantsKidsIcon strength={filters.wants_kids_strength ?? -1}/>}
202202
selection={
203203
<KidsLabel
204204
strength={filters.wants_kids_strength ?? -1}
@@ -221,7 +221,7 @@ function MobileFilters(props: {
221221
openFilter={openFilter}
222222
setOpenFilter={setOpenFilter}
223223
isActive={filters.has_kids != null && filters.has_kids !== -1}
224-
icon={<FaChild className="text-ink-900 h-4 w-4"/>}
224+
// icon={<FaChild className="text-ink-900 h-4 w-4"/>}
225225
selection={
226226
<HasKidsLabel
227227
has_kids={filters.has_kids ?? -1}

0 commit comments

Comments
 (0)