Skip to content

Commit f15ae0c

Browse files
emilyjablonskiemilyjablonski
authored
fix: feature flag filter sections (#5993)
1 parent 899ff3c commit f15ae0c

File tree

6 files changed

+416
-133
lines changed

6 files changed

+416
-133
lines changed

‎sites/public/__tests__/components/browse/FilterDrawer.test.tsx‎

Lines changed: 124 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,13 @@ import {
99
MultiselectQuestionsApplicationSectionEnum,
1010
MultiselectQuestionsStatusEnum,
1111
} from "@bloom-housing/shared-helpers/src/types/backend-swagger"
12+
import {
13+
defaultListingFeaturesConfiguration,
14+
expandedListingFeaturesConfiguration,
15+
} from "@bloom-housing/shared-helpers/__tests__/testHelpers"
1216
import { mockNextRouter, render } from "../../testUtils"
1317
import { FilterDrawer } from "../../../src/components/browse/FilterDrawer"
1418
import { FilterData } from "../../../src/components/browse/FilterDrawerHelpers"
15-
import { defaultListingFeaturesConfiguration } from "@bloom-housing/shared-helpers/__tests__/testHelpers"
1619

1720
describe("FilterDrawer", () => {
1821
beforeEach(() => {
@@ -67,6 +70,9 @@ describe("FilterDrawer", () => {
6770
filterState={{}}
6871
multiselectData={mockMultiselect}
6972
activeFeatureFlags={[
73+
FeatureFlagEnum.enableIsVerified,
74+
FeatureFlagEnum.enableHomeType,
75+
FeatureFlagEnum.enableSection8Question,
7076
FeatureFlagEnum.enableRegions,
7177
FeatureFlagEnum.enableAccessibilityFeatures,
7278
FeatureFlagEnum.enableParkingType,
@@ -249,6 +255,9 @@ describe("FilterDrawer", () => {
249255
filterState={filterState}
250256
multiselectData={mockMultiselect}
251257
activeFeatureFlags={[
258+
FeatureFlagEnum.enableIsVerified,
259+
FeatureFlagEnum.enableHomeType,
260+
FeatureFlagEnum.enableSection8Question,
252261
FeatureFlagEnum.enableRegions,
253262
FeatureFlagEnum.enableAccessibilityFeatures,
254263
FeatureFlagEnum.enableParkingType,
@@ -490,4 +499,118 @@ describe("FilterDrawer", () => {
490499

491500
expect(screen.getByRole("group", { name: "Region" })).toBeInTheDocument()
492501
})
502+
503+
it("should not show confirmed listings section when isVerified flag is off", () => {
504+
render(
505+
<FilterDrawer
506+
isOpen={true}
507+
onClose={() => {}}
508+
onSubmit={() => {}}
509+
onClear={() => {}}
510+
filterState={{}}
511+
multiselectData={mockMultiselect}
512+
activeFeatureFlags={[]}
513+
listingFeaturesConfiguration={defaultListingFeaturesConfiguration}
514+
/>
515+
)
516+
517+
expect(screen.queryByRole("group", { name: "Confirmed listings" })).not.toBeInTheDocument()
518+
expect(
519+
screen.queryByRole("checkbox", { name: "Only show listings confirmed by property" })
520+
).not.toBeInTheDocument()
521+
})
522+
523+
it("should not show home type section when homeType flag is off", () => {
524+
render(
525+
<FilterDrawer
526+
isOpen={true}
527+
onClose={() => {}}
528+
onSubmit={() => {}}
529+
onClear={() => {}}
530+
filterState={{}}
531+
multiselectData={mockMultiselect}
532+
activeFeatureFlags={[]}
533+
listingFeaturesConfiguration={defaultListingFeaturesConfiguration}
534+
/>
535+
)
536+
537+
expect(screen.queryByRole("group", { name: "Home type" })).not.toBeInTheDocument()
538+
expect(screen.queryByRole("checkbox", { name: "Apartment" })).not.toBeInTheDocument()
539+
})
540+
541+
it("should not show parking types section when parkingType flag is off", () => {
542+
render(
543+
<FilterDrawer
544+
isOpen={true}
545+
onClose={() => {}}
546+
onSubmit={() => {}}
547+
onClear={() => {}}
548+
filterState={{}}
549+
multiselectData={mockMultiselect}
550+
activeFeatureFlags={[]}
551+
listingFeaturesConfiguration={defaultListingFeaturesConfiguration}
552+
/>
553+
)
554+
555+
expect(screen.queryByRole("group", { name: "Parking types" })).not.toBeInTheDocument()
556+
expect(screen.queryByRole("checkbox", { name: "Garage" })).not.toBeInTheDocument()
557+
})
558+
559+
it("should not show section 8 checkbox when section8 flag is off", () => {
560+
render(
561+
<FilterDrawer
562+
isOpen={true}
563+
onClose={() => {}}
564+
onSubmit={() => {}}
565+
onClear={() => {}}
566+
filterState={{}}
567+
multiselectData={mockMultiselect}
568+
activeFeatureFlags={[]}
569+
listingFeaturesConfiguration={defaultListingFeaturesConfiguration}
570+
/>
571+
)
572+
573+
expect(screen.getByRole("group", { name: "Rent" })).toBeInTheDocument()
574+
expect(
575+
screen.queryByRole("checkbox", { name: "Accepts Section 8 Housing Choice Vouchers" })
576+
).not.toBeInTheDocument()
577+
})
578+
579+
it("should not show accessibility section when accessibility flag is off", () => {
580+
render(
581+
<FilterDrawer
582+
isOpen={true}
583+
onClose={() => {}}
584+
onSubmit={() => {}}
585+
onClear={() => {}}
586+
filterState={{}}
587+
multiselectData={mockMultiselect}
588+
activeFeatureFlags={[]}
589+
listingFeaturesConfiguration={defaultListingFeaturesConfiguration}
590+
/>
591+
)
592+
593+
expect(screen.queryByRole("group", { name: "Accessibility features" })).not.toBeInTheDocument()
594+
expect(screen.queryByLabelText("Wheelchair ramp")).not.toBeInTheDocument()
595+
})
596+
597+
it("should show accessibility section and category groups when accessibility flag is on", () => {
598+
render(
599+
<FilterDrawer
600+
isOpen={true}
601+
onClose={() => {}}
602+
onSubmit={() => {}}
603+
onClear={() => {}}
604+
filterState={{}}
605+
multiselectData={mockMultiselect}
606+
activeFeatureFlags={[FeatureFlagEnum.enableAccessibilityFeatures]}
607+
listingFeaturesConfiguration={expandedListingFeaturesConfiguration}
608+
/>
609+
)
610+
611+
expect(screen.getByRole("group", { name: "Accessibility features" })).toBeInTheDocument()
612+
expect(screen.getByRole("group", { name: "Mobility" })).toBeInTheDocument()
613+
expect(screen.getByRole("group", { name: "Bathroom" })).toBeInTheDocument()
614+
expect(screen.getByLabelText("Wheelchair ramp")).toBeInTheDocument()
615+
})
493616
})

‎sites/public/__tests__/components/browse/FilterDrawerHelpers.test.tsx‎

Lines changed: 61 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import React from "react"
22
import { screen } from "@testing-library/dom"
3+
import userEvent from "@testing-library/user-event"
4+
import { useForm } from "react-hook-form"
35
import {
46
FilterAvailabilityEnum,
57
HomeTypeEnum,
@@ -8,6 +10,12 @@ import {
810
UnitTypeEnum,
911
} from "@bloom-housing/shared-helpers/src/types/backend-swagger"
1012
import {
13+
defaultListingFeaturesConfiguration,
14+
expandedListingFeaturesConfiguration,
15+
} from "@bloom-housing/shared-helpers/__tests__/testHelpers"
16+
import { t } from "@bloom-housing/ui-components"
17+
import {
18+
AccessibilitySection,
1119
buildDefaultFilterFields,
1220
CheckboxGroup,
1321
decodeQueryToFilterData,
@@ -22,9 +30,6 @@ import {
2230
SearchSection,
2331
} from "../../../src/components/browse/FilterDrawerHelpers"
2432
import { mockNextRouter, render } from "../../testUtils"
25-
import { useForm } from "react-hook-form"
26-
import { t } from "@bloom-housing/ui-components"
27-
import userEvent from "@testing-library/user-event"
2833

2934
describe("filter drawer helpers", () => {
3035
const emptyFormData: FilterData = {
@@ -791,6 +796,7 @@ describe("filter drawer helpers", () => {
791796
setError={setError}
792797
clearErrors={clearErrors}
793798
errors={errors}
799+
enableSection8={true}
794800
/>
795801
)
796802
}
@@ -817,6 +823,7 @@ describe("filter drawer helpers", () => {
817823
setError={setError}
818824
clearErrors={clearErrors}
819825
errors={errors}
826+
enableSection8={true}
820827
/>
821828
)
822829
}
@@ -906,4 +913,55 @@ describe("filter drawer helpers", () => {
906913
expect(screen.getByText("Enter full or partial listing name")).toBeInTheDocument()
907914
})
908915
})
916+
917+
describe("AccessibilitySection", () => {
918+
beforeEach(() => {
919+
mockNextRouter()
920+
})
921+
922+
const CategorizedAccessibilitySection = () => {
923+
// eslint-disable-next-line @typescript-eslint/unbound-method
924+
const { register } = useForm()
925+
926+
return (
927+
<AccessibilitySection
928+
register={register}
929+
filterState={{}}
930+
listingFeaturesConfiguration={expandedListingFeaturesConfiguration}
931+
/>
932+
)
933+
}
934+
935+
const FlatAccessibilitySection = () => {
936+
// eslint-disable-next-line @typescript-eslint/unbound-method
937+
const { register } = useForm()
938+
939+
return (
940+
<AccessibilitySection
941+
register={register}
942+
filterState={{ [ListingFilterKeys.listingFeatures]: { wheelchairRamp: true } }}
943+
listingFeaturesConfiguration={defaultListingFeaturesConfiguration}
944+
/>
945+
)
946+
}
947+
948+
it("should render parent section and category groups when categories exist", () => {
949+
render(<CategorizedAccessibilitySection />)
950+
951+
expect(screen.getByRole("group", { name: "Accessibility features" })).toBeInTheDocument()
952+
expect(screen.getByRole("group", { name: "Mobility" })).toBeInTheDocument()
953+
expect(screen.getByRole("group", { name: "Bathroom" })).toBeInTheDocument()
954+
expect(screen.getByLabelText("Wheelchair ramp")).toBeInTheDocument()
955+
expect(screen.getByLabelText("Roll-in showers")).toBeInTheDocument()
956+
expect(screen.queryAllByRole("group", { name: "Accessibility features" })).toHaveLength(1)
957+
})
958+
959+
it("should render fallback accessibility checkbox group when categories are absent", () => {
960+
render(<FlatAccessibilitySection />)
961+
962+
expect(screen.getAllByRole("group", { name: "Accessibility features" })).toHaveLength(1)
963+
expect(screen.queryByRole("group", { name: "Mobility" })).not.toBeInTheDocument()
964+
expect(screen.getByRole("checkbox", { name: "Wheelchair ramp" })).toBeChecked()
965+
})
966+
})
909967
})

‎sites/public/__tests__/components/browse/ListingBrowse.test.tsx‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -571,6 +571,14 @@ describe("<ListingBrowse>", () => {
571571
name: FeatureFlagEnum.enableListingFiltering,
572572
active: true,
573573
} as FeatureFlag,
574+
{
575+
name: FeatureFlagEnum.enableIsVerified,
576+
active: true,
577+
} as FeatureFlag,
578+
{
579+
name: FeatureFlagEnum.enableHomeType,
580+
active: true,
581+
} as FeatureFlag,
574582
],
575583
}
576584
render(

‎sites/public/src/components/browse/FilterDrawer.module.scss‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,4 +21,15 @@
2121
font-weight: 400;
2222
padding-bottom: 0;
2323
}
24+
25+
.accessibility-category-groups {
26+
.filter-section {
27+
border-block-end-width: 0;
28+
padding-block-end: 0;
29+
}
30+
}
31+
32+
.parent-label {
33+
font-size: var(--seeds-type-heading-size-md);
34+
}
2435
}

0 commit comments

Comments
 (0)