From 534770182feb4c990dd8565f460d972f1d1a3d50 Mon Sep 17 00:00:00 2001 From: Josh Chou <626661+josh-chou@users.noreply.github.com> Date: Wed, 7 May 2025 15:33:07 -0700 Subject: [PATCH 1/3] fix: change where button links to, add new label behind feature flag --- app/assets/json/translations/react/en.json | 1 + app/javascript/modules/listings/BuyHeader.tsx | 10 ++++++++-- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/app/assets/json/translations/react/en.json b/app/assets/json/translations/react/en.json index cf47b2501..3e71d06bd 100644 --- a/app/assets/json/translations/react/en.json +++ b/app/assets/json/translations/react/en.json @@ -1589,6 +1589,7 @@ "saleDirectory.hoaDues": "HOA Dues", "saleDirectory.price": "Sales Price", "saleDirectory.seeTheListings": "See the listings", + "saleDirectory.seeHomesForSale": "See homes for sale", "saleDirectory.title": "Buy affordable housing", "seeTheUnit.makeAnAppointment": "Make an appointment", "seeTheUnit.requestATour": "Call, email, or text to request a tour.", diff --git a/app/javascript/modules/listings/BuyHeader.tsx b/app/javascript/modules/listings/BuyHeader.tsx index 5e4d382f2..42b8d742e 100644 --- a/app/javascript/modules/listings/BuyHeader.tsx +++ b/app/javascript/modules/listings/BuyHeader.tsx @@ -27,6 +27,10 @@ const DalpHeader = () => { const BuyHeader = () => { const { unleashFlag: dalpDirectoryEnabled } = useFeatureFlag("temp.webapp.directory.dalp", false) + const { unleashFlag: translationsReady } = useFeatureFlag( + "temp.webapp.listings.sales.seeHomesForSale", + false + ) return (
@@ -35,8 +39,10 @@ const BuyHeader = () => {
{/* TODO: Switch this back to LinkButton or button once this issue is resolvedhttps://github.com/bloom-housing/bloom/issues/2324 */} - - {t("saleDirectory.seeTheListings")} + + {translationsReady + ? t("saleDirectory.seeHomesForSale") + : t("saleDirectory.seeTheListings")}
From 979bd63808d91780b8d74e7b2e7e5d945be01db7 Mon Sep 17 00:00:00 2001 From: Josh Chou <626661+josh-chou@users.noreply.github.com> Date: Thu, 8 May 2025 16:18:04 -0700 Subject: [PATCH 2/3] test: update tests and snapshots --- .../modules/listings/BuyHeader.test.tsx | 32 ++++- .../__snapshots__/BuyHeader.test.tsx.snap | 123 +++++++++++++++++- .../__snapshots__/ForSale.test.tsx.snap | 4 +- 3 files changed, 152 insertions(+), 7 deletions(-) diff --git a/app/javascript/__tests__/modules/listings/BuyHeader.test.tsx b/app/javascript/__tests__/modules/listings/BuyHeader.test.tsx index ad9809713..799b9225d 100644 --- a/app/javascript/__tests__/modules/listings/BuyHeader.test.tsx +++ b/app/javascript/__tests__/modules/listings/BuyHeader.test.tsx @@ -1,9 +1,36 @@ import React from "react" import { render } from "@testing-library/react" import BuyHeader from "../../../modules/listings/BuyHeader" +import { useFeatureFlag } from "../../../hooks/useFeatureFlag" + +jest.mock("../../../hooks/useFeatureFlag", () => ({ + useFeatureFlag: jest.fn(), +})) describe("BuyHeader", () => { - it("renders BuyHeader component", () => { + it("renders BuyHeader component with See the listings button", async () => { + ;(useFeatureFlag as jest.Mock).mockReturnValue({ flagsReady: true, unleashFlag: false }) + window.matchMedia = jest.fn().mockImplementation((query) => { + return { + matches: true, + media: query, + onchange: null, + addListener: jest.fn(), + removeListener: jest.fn(), + addEventListener: jest.fn(), + removeEventListener: jest.fn(), + dispatchEvent: jest.fn(), + } + }) + + const { findByText, asFragment } = render() + + expect(asFragment()).toMatchSnapshot() + expect(await findByText("See the listings")).toBeDefined() + }) + + it("renders BuyHeader component with See homes for sale button", async () => { + ;(useFeatureFlag as jest.Mock).mockReturnValue({ flagsReady: true, unleashFlag: true }) window.matchMedia = jest.fn().mockImplementation((query) => { return { matches: true, @@ -17,8 +44,9 @@ describe("BuyHeader", () => { } }) - const { asFragment } = render() + const { findByText, asFragment } = render() expect(asFragment()).toMatchSnapshot() + expect(await findByText("See homes for sale")).toBeDefined() }) }) diff --git a/app/javascript/__tests__/modules/listings/__snapshots__/BuyHeader.test.tsx.snap b/app/javascript/__tests__/modules/listings/__snapshots__/BuyHeader.test.tsx.snap index a51bd7575..48cf0b3e9 100644 --- a/app/javascript/__tests__/modules/listings/__snapshots__/BuyHeader.test.tsx.snap +++ b/app/javascript/__tests__/modules/listings/__snapshots__/BuyHeader.test.tsx.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`BuyHeader renders BuyHeader component 1`] = ` +exports[`BuyHeader renders BuyHeader component with See homes for sale button 1`] = `
- See the listings + See homes for sale
`; + +exports[`BuyHeader renders BuyHeader component with See the listings button 1`] = ` + +
+
+
+

+ Buy affordable housing +

+
+ + See the listings + +
+
+
+

+ Before applying +

+

+ Make sure you: +

+
    +
  1. + Haven't owned residential property in the past 3 years +
    2. +
  2. + + Meet our + + income requirements + + +
    3. +
  3. + + Complete + + homebuyer education + + +
    4. +
  4. + + Get pre-approved for a mortgage loan by a + + lender on our list + + +
    5. +
  5. + Have enough in savings for closing costs and downpayment +
    6. +
+
+ + Read + + our full list of requirements + + for more details. + +
+
+
+
+
+
+ +`; diff --git a/app/javascript/__tests__/pages/listings/__snapshots__/ForSale.test.tsx.snap b/app/javascript/__tests__/pages/listings/__snapshots__/ForSale.test.tsx.snap index 6d6cf1791..9432479e6 100644 --- a/app/javascript/__tests__/pages/listings/__snapshots__/ForSale.test.tsx.snap +++ b/app/javascript/__tests__/pages/listings/__snapshots__/ForSale.test.tsx.snap @@ -249,9 +249,9 @@ exports[`For Sale renders ForSale component 1`] = ` > - See the listings + See homes for sale
Date: Thu, 8 May 2025 16:36:08 -0700 Subject: [PATCH 3/3] chore: alphabet ordering --- app/assets/json/translations/react/en.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/json/translations/react/en.json b/app/assets/json/translations/react/en.json index 3e71d06bd..6b5866b22 100644 --- a/app/assets/json/translations/react/en.json +++ b/app/assets/json/translations/react/en.json @@ -1588,8 +1588,8 @@ "saleDirectory.getHelp.visitMohcdPrograms": "Visit the MOHCD Affordable Homebuyer Programs page to learn more.", "saleDirectory.hoaDues": "HOA Dues", "saleDirectory.price": "Sales Price", - "saleDirectory.seeTheListings": "See the listings", "saleDirectory.seeHomesForSale": "See homes for sale", + "saleDirectory.seeTheListings": "See the listings", "saleDirectory.title": "Buy affordable housing", "seeTheUnit.makeAnAppointment": "Make an appointment", "seeTheUnit.requestATour": "Call, email, or text to request a tour.",