Skip to content

Commit 3914552

Browse files
MartinBraquetMartinBraquet
committed
Refactor orientation filter implementation for improved structure and clarity
1 parent 4ce0096 commit 3914552

5 files changed

Lines changed: 74 additions & 73 deletions

File tree

‎android/app/build.gradle‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,8 @@ android {
1111
applicationId "com.compassconnections.app"
1212
minSdkVersion rootProject.ext.minSdkVersion
1313
targetSdkVersion rootProject.ext.targetSdkVersion
14-
versionCode 111
15-
versionName "1.26.0"
14+
versionCode 112
15+
versionName "1.27.0"
1616
testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
1717
aaptOptions {
1818
// Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.

‎web/components/filters/filters.tsx‎

Lines changed: 21 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ import {IncompleteProfilesToggle} from 'web/components/filters/incomplete-profil
2424
import {InterestFilter, InterestFilterText} from 'web/components/filters/interest-filter'
2525
import {LanguageFilter, LanguageFilterText} from 'web/components/filters/language-filter'
2626
import {MbtiFilter, MbtiFilterText} from 'web/components/filters/mbti-filter'
27+
import {OrientationFilter, OrientationFilterText} from 'web/components/filters/orientation-filter'
2728
import {PoliticalFilter, PoliticalFilterText} from 'web/components/filters/political-filter'
2829
import {
2930
RelationshipStatusFilter,
@@ -50,7 +51,6 @@ import {HasKidsFilter, HasKidsLabel} from './has-kids-filter'
5051
import {LastActiveFilter, LastActiveFilterText} from './last-active-filter'
5152
import {LocationFilter, LocationFilterProps, LocationFilterText} from './location-filter'
5253
import {MyMatchesToggle} from './my-matches-toggle'
53-
import {OrientationFilter, OrientationFilterText} from './orientation-filter'
5454
import {PsychedelicsFilter, PsychedelicsFilterText} from './psychedelics-filter'
5555
import {RelationshipFilter, RelationshipFilterText} from './relationship-filter'
5656
import {SmokerFilter, SmokerFilterText} from './smoker-filter'
@@ -329,24 +329,6 @@ function Filters(props: {
329329
<GenderFilter filters={filters} updateFilter={updateFilter} profile={youProfile} />
330330
</FilterSection>
331331

332-
{/* ORIENTATION - Always visible */}
333-
<FilterSection
334-
title={t('profile.optional.orientation', 'Orientation')}
335-
openFilter={openFilter}
336-
setOpenFilter={setOpenFilter}
337-
isActive={hasAny((filters as any).orientation || undefined)}
338-
selection={
339-
<OrientationFilterText options={(filters as any).orientation as string[] | undefined} />
340-
}
341-
>
342-
<OrientationFilter
343-
filters={filters}
344-
updateFilter={updateFilter}
345-
profile={youProfile}
346-
className={''}
347-
/>
348-
</FilterSection>
349-
350332
{/* ACCORDION GROUPS */}
351333

352334
{/* Relationship Group */}
@@ -366,7 +348,7 @@ function Filters(props: {
366348
selection={
367349
<RelationshipStatusFilterText
368350
options={filters.relationship_status as string[]}
369-
defaultLabel={t('filter.relationship_status.any', 'Any')}
351+
defaultLabel={t('filter.relationship_status.any', 'Any status')}
370352
// highlightedClass={
371353
// hasAny(filters.relationship_status || undefined)
372354
// ? 'text-primary-600'
@@ -378,6 +360,25 @@ function Filters(props: {
378360
<RelationshipStatusFilter filters={filters} updateFilter={updateFilter} />
379361
</FilterSection>
380362

363+
<FilterSection
364+
title={t('profile.optional.orientation', 'Orientation')}
365+
openFilter={openFilter}
366+
setOpenFilter={setOpenFilter}
367+
isActive={hasAny((filters as any).orientation || undefined)}
368+
selection={
369+
<OrientationFilterText
370+
options={(filters as any).orientation as string[] | undefined}
371+
/>
372+
}
373+
>
374+
<OrientationFilter
375+
filters={filters}
376+
updateFilter={updateFilter}
377+
profile={youProfile}
378+
className={''}
379+
/>
380+
</FilterSection>
381+
381382
{/* Romantic Style */}
382383
<FilterSection
383384
title={t('profile.romantic.style', 'Style')}

‎web/components/filters/relationship-status-filter.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export function RelationshipStatusFilterText(props: {
1616
const t = useT()
1717
const length = (options ?? []).length
1818

19-
const label = defaultLabel || t('filter.any', 'Any')
19+
const label = defaultLabel || t('filter.any', 'Any Status')
2020

2121
if (!options || length < 1) {
2222
return <span className={clsx('text-semibold', highlightedClass)}>{label}</span>

‎web/components/filters/romantic-filter.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export function RomanticFilterText(props: {
1818
if (!relationship || length < 1) {
1919
return (
2020
<span className={clsx('text-semibold', highlightedClass)}>
21-
{t('filter.any_relationship', 'Any relationship')}
21+
{t('filter.any_relationship', 'Any relationship style')}
2222
</span>
2323
)
2424
}

‎web/components/optional-profile-form.tsx‎

Lines changed: 49 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -463,55 +463,6 @@ export const OptionalProfileUserForm = (props: {
463463
</Col>
464464
</Row>
465465

466-
<Row className={'items-center gap-2'}>
467-
<Col className={'gap-1'}>
468-
<label className={clsx(labelClassName)}>
469-
{t('profile.optional.orientation', 'Sexual orientation')}
470-
</label>
471-
<MultiCheckbox
472-
choices={
473-
Object.fromEntries(
474-
Object.entries(ORIENTATION_CHOICES).filter(
475-
([, v]) =>
476-
showAllOrientations ||
477-
DEFAULT_ORIENTATIONS.includes(v as any) ||
478-
(profile['orientation'] ?? []).includes(v),
479-
),
480-
) as any
481-
}
482-
selected={profile['orientation'] ?? []}
483-
translationPrefix={'profile.orientation'}
484-
onChange={(selected) => setProfile('orientation', selected)}
485-
/>
486-
{!showAllOrientations && (
487-
<button
488-
type="button"
489-
className="text-primary-600 mt-1 text-sm"
490-
onClick={() => setShowAllOrientations(true)}
491-
>
492-
{t('profile.orientation.show_more', 'Show more options')}
493-
</button>
494-
)}
495-
{showAllOrientations && (
496-
<>
497-
<p className="mt-1">{t('profile.optional.details', 'Details')}</p>
498-
<Input
499-
type="text"
500-
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
501-
setProfile('orientation_details', e.target.value)
502-
}
503-
className={'w-full sm:w-[700px]'}
504-
value={(profile as any)['orientation_details'] ?? undefined}
505-
placeholder={t(
506-
'profile.orientation.details_placeholder',
507-
'Any details about your sexual orientation…',
508-
)}
509-
/>
510-
</>
511-
)}
512-
</Col>
513-
</Row>
514-
515466
<Col className={clsx(colClassName)}>
516467
<label className={clsx(labelClassName)}>{t('profile.optional.age', 'Age')}</label>
517468
<Input
@@ -799,6 +750,55 @@ export const OptionalProfileUserForm = (props: {
799750

800751
{lookingRelationship && (
801752
<>
753+
<Row className={'items-center gap-2'}>
754+
<Col className={'gap-1'}>
755+
<label className={clsx(labelClassName)}>
756+
{t('profile.optional.orientation', 'Orientation')}
757+
</label>
758+
<MultiCheckbox
759+
choices={
760+
Object.fromEntries(
761+
Object.entries(ORIENTATION_CHOICES).filter(
762+
([, v]) =>
763+
showAllOrientations ||
764+
DEFAULT_ORIENTATIONS.includes(v as any) ||
765+
(profile['orientation'] ?? []).includes(v),
766+
),
767+
) as any
768+
}
769+
selected={profile['orientation'] ?? []}
770+
translationPrefix={'profile.orientation'}
771+
onChange={(selected) => setProfile('orientation', selected)}
772+
/>
773+
{!showAllOrientations && (
774+
<button
775+
type="button"
776+
className="text-primary-600 mt-1 text-sm"
777+
onClick={() => setShowAllOrientations(true)}
778+
>
779+
{t('profile.orientation.show_more', 'Show more options')}
780+
</button>
781+
)}
782+
{showAllOrientations && (
783+
<>
784+
<p className="mt-1">{t('profile.optional.details', 'Details')}</p>
785+
<Input
786+
type="text"
787+
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
788+
setProfile('orientation_details', e.target.value)
789+
}
790+
className={'w-full sm:w-[700px]'}
791+
value={(profile as any)['orientation_details'] ?? undefined}
792+
placeholder={t(
793+
'profile.orientation.details_placeholder',
794+
'Any details about your sexual orientation…',
795+
)}
796+
/>
797+
</>
798+
)}
799+
</Col>
800+
</Row>
801+
802802
<Col className={clsx(colClassName)}>
803803
<label className={clsx(labelClassName)}>
804804
{t('profile.optional.relationship_style', 'Relationship style')}

0 commit comments

Comments
 (0)