fix: move non-regulated selection to jurisdiction modal

sites/partners/__tests__/components/listings/PaperListingForm/sections/ListingIntro.test.tsx

@@ -1,10 +1,10 @@
 import React from "react"
 import "@testing-library/jest-dom"
 import { setupServer } from "msw/node"
-import userEvent from "@testing-library/user-event"
-import { screen, within } from "@testing-library/react"
+import { screen } from "@testing-library/react"
 import { FormProviderWrapper, mockNextRouter, render } from "../../../../testUtils"
 import ListingIntro from "../../../../../src/components/listings/PaperListingForm/sections/ListingIntro"
+import { EnumListingListingType } from "@bloom-housing/shared-helpers/src/types/backend-swagger"
 
 const server = setupServer()
 
@@ -112,16 +112,14 @@ describe("ListingIntro", () => {
       </FormProviderWrapper>
     )
 
-    expect(
-      screen.queryByRole("group", { name: "What kind of listing is this?" })
-    ).not.toBeInTheDocument()
+    expect(screen.queryAllByText("What kind of listing is this?")).toHaveLength(0)
     expect(screen.getByRole("textbox", { name: /^housing developer$/i })).toBeInTheDocument()
     expect(
       screen.queryByRole("textbox", { name: /^property management account$/i })
     ).not.toBeInTheDocument()
   })
 
-  it("should not render the ListingIntro section with regulated fields when feature flag is on", async () => {
+  it("should render the ListingIntro section with regulated fields when feature flag is on and listing is not non-regulated", () => {
     render(
       <FormProviderWrapper>
         <ListingIntro
@@ -137,42 +135,48 @@ describe("ListingIntro", () => {
 
     expect(screen.getByRole("heading", { level: 2, name: "Listing intro" })).toBeInTheDocument()
 
+    expect(screen.getByText("What kind of listing is this?")).toBeInTheDocument()
+    expect(screen.getByText("Regulated")).toBeInTheDocument()
+
+    expect(screen.getByRole("textbox", { name: /^housing developer$/i })).toBeInTheDocument()
     expect(
-      await screen.findByRole("group", { name: "What kind of listing is this?" })
-    ).toBeInTheDocument()
-    const requlatedListingOption = screen.getByRole("radio", { name: /^regulated$/i })
-    const nonRequlatedListingOption = screen.getByRole("radio", { name: /^non-regulated$/i })
-    expect(requlatedListingOption).toBeInTheDocument()
-    expect(requlatedListingOption).toBeChecked()
-    expect(nonRequlatedListingOption).toBeInTheDocument()
-    expect(nonRequlatedListingOption).not.toBeChecked()
+      screen.queryByRole("textbox", { name: /^property management account$/i })
+    ).not.toBeInTheDocument()
 
-    let ebllQuestionLabel = screen.queryByRole("group", {
-      name: "Has this property received HUD EBLL clearance?",
-    })
+    expect(
+      screen.queryAllByRole("group", {
+        name: "Has this property received HUD EBLL clearance?",
+      })
+    ).toHaveLength(0)
+  })
 
-    ebllQuestionLabel = screen.queryByRole("group", {
-      name: "Has this property received HUD EBLL clearance?",
-    })
-    expect(ebllQuestionLabel).not.toBeInTheDocument()
+  it("should render the ListingIntro section with non-regulated fields when feature flag is on and listing is non-regulated", () => {
+    render(
+      <FormProviderWrapper values={{ listingType: EnumListingListingType.nonRegulated }}>
+        <ListingIntro
+          requiredFields={[]}
+          enableNonRegulatedListings={true}
+          enableHousingDeveloperOwner={false}
+          enableListingFileNumber={false}
+          jurisdictionName={"JurisdictionA"}
+          listingId={"1234"}
+        />
+      </FormProviderWrapper>
+    )
+
+    expect(screen.getByRole("heading", { level: 2, name: "Listing intro" })).toBeInTheDocument()
 
-    await userEvent.click(nonRequlatedListingOption)
+    expect(screen.getByText("What kind of listing is this?")).toBeInTheDocument()
+    expect(screen.getByText("Non-regulated")).toBeInTheDocument()
 
     expect(
       screen.getByRole("textbox", { name: /^property management account$/i })
     ).toBeInTheDocument()
-    expect(screen.queryByRole("textbox", { name: /^housing developer$/i })).not.toBeInTheDocument()
-
-    ebllQuestionLabel = screen.queryByRole("group", {
-      name: "Has this property received HUD EBLL clearance?",
-    })
-    expect(ebllQuestionLabel).toBeInTheDocument()
-    const ebllQuestionContainer = ebllQuestionLabel.parentElement
-    const ebllYesOption = within(ebllQuestionContainer).getByRole("radio", { name: /^yes$/i })
-    const ebllNoOption = within(ebllQuestionContainer).getByRole("radio", { name: /^no$/i })
-    expect(ebllYesOption).toBeInTheDocument()
-    expect(ebllYesOption).not.toBeChecked()
-    expect(ebllNoOption).toBeInTheDocument()
-    expect(ebllNoOption).toBeChecked()
+
+    expect(
+      screen.getByRole("group", {
+        name: "Has this property received HUD EBLL clearance?",
+      })
+    ).toBeInTheDocument()
   })
 })

sites/partners/__tests__/pages/listings/index.test.tsx

@@ -1,6 +1,6 @@
 import React from "react"
 import { AuthContext, MessageProvider } from "@bloom-housing/shared-helpers"
-import { fireEvent, screen, waitFor } from "@testing-library/react"
+import { fireEvent, screen, waitFor, within } from "@testing-library/react"
 import userEvent from "@testing-library/user-event"
 import { act } from "react-dom/test-utils"
 import { rest } from "msw"
@@ -520,22 +520,7 @@ describe("listings", () => {
         return res(
           ctx.json({
             id: "user1",
-            roles: { id: "user1", isAdmin: true, isPartner: false },
-          })
-        )
-      }),
-      rest.post("http://localhost:3100/auth/token", (_req, res, ctx) => {
-        return res(ctx.json(""))
-      })
-    )
-
-    render(
-      <AuthContext.Provider
-        value={{
-          initialStateLoaded: true,
-          profile: {
-            ...mockUser,
-            userRoles: { isAdmin: true, isPartner: false },
+            userRoles: { id: "user1", isAdmin: true, isPartner: false },
             jurisdictions: [
               {
                 id: "id1",
@@ -548,15 +533,16 @@ describe("listings", () => {
                 featureFlags: [],
               } as Jurisdiction,
             ],
-          },
-          doJurisdictionsHaveFeatureFlagOn: (featureFlag) =>
-            mockJurisdictionsHaveFeatureFlagOn(featureFlag, false, false),
-        }}
-      >
-        <ListingsList />
-      </AuthContext.Provider>
+          })
+        )
+      }),
+      rest.post("http://localhost:3100/auth/token", (_req, res, ctx) => {
+        return res(ctx.json(""))
+      })
     )
 
+    render(<ListingsList />)
+
     const addListingButton = await screen.findByRole("button", { name: "Add listing" })
     expect(addListingButton).toBeInTheDocument()
     await userEvent.click(addListingButton)
@@ -565,7 +551,7 @@ describe("listings", () => {
       screen.getByRole("heading", { level: 1, name: "Select jurisdiction" })
     ).toBeInTheDocument()
     expect(
-      screen.getByText("Once you create this listing, the jurisdiction cannot be changed.")
+      screen.getByText("Once you create this listing, this selection cannot be changed.")
     ).toBeInTheDocument()
 
     expect(screen.getByRole("option", { name: "JurisdictionA" })).toBeInTheDocument()
@@ -582,7 +568,7 @@ describe("listings", () => {
     })
   })
 
-  it("should not open add listing modal if user has access to only one jurisdiction", async () => {
+  it("should open add listing modal if user has access to one jurisdiction and enableNonRegulatedListings", async () => {
     window.URL.createObjectURL = jest.fn()
     document.cookie = "access-token-available=True"
     const { pushMock } = mockNextRouter()
@@ -597,7 +583,20 @@ describe("listings", () => {
         return res(
           ctx.json({
             id: "user1",
-            roles: { id: "user1", isAdmin: true, isPartner: false },
+            userRoles: { id: "user1", isAdmin: true, isPartner: false },
+            jurisdictions: [
+              {
+                id: "id1",
+                name: "JurisdictionA",
+                featureFlags: [
+                  {
+                    id: "id_1",
+                    name: FeatureFlagEnum.enableNonRegulatedListings,
+                    active: true,
+                  },
+                ],
+              } as Jurisdiction,
+            ],
           })
         )
       }),
@@ -606,29 +605,166 @@ describe("listings", () => {
       })
     )
 
-    render(
-      <AuthContext.Provider
-        value={{
-          initialStateLoaded: true,
-          profile: {
-            ...mockUser,
-            userRoles: { isAdmin: true, isPartner: false },
+    render(<ListingsList />)
+
+    const addListingButton = await screen.findByRole("button", { name: "Add listing" })
+    expect(addListingButton).toBeInTheDocument()
+    await userEvent.click(addListingButton)
+
+    expect(
+      screen.getByRole("heading", { level: 1, name: "Select Listing Type" })
+    ).toBeInTheDocument()
+    expect(
+      screen.getByText("Once you create this listing, this selection cannot be changed.")
+    ).toBeInTheDocument()
+
+    const listingTypeRadioGroup = screen.getByRole("group", {
+      name: "What kind of listing is this?",
+    })
+    expect(listingTypeRadioGroup).toBeInTheDocument()
+    expect(
+      within(listingTypeRadioGroup).getByRole("radio", { name: "Regulated" })
+    ).toBeInTheDocument()
+    expect(
+      within(listingTypeRadioGroup).getByRole("radio", { name: "Non-regulated" })
+    ).toBeInTheDocument()
+
+    await userEvent.click(screen.getByRole("radio", { name: "Non-regulated" }))
+
+    await userEvent.click(screen.getByRole("button", { name: "Get started" }))
+    await waitFor(() => {
+      expect(pushMock).toHaveBeenCalledWith({
+        pathname: "/listings/add",
+        query: { jurisdictionId: "id1", nonRegulated: true },
+      })
+    })
+  })
+
+  it("should open add listing modal if user has access to multiple jurisdictions and enableNonRegulatedListings", async () => {
+    window.URL.createObjectURL = jest.fn()
+    document.cookie = "access-token-available=True"
+    const { pushMock } = mockNextRouter()
+    server.use(
+      rest.get("http://localhost:3100/listings", (_req, res, ctx) => {
+        return res(ctx.json({ items: [listing], meta: { totalItems: 1, totalPages: 1 } }))
+      }),
+      rest.get("http://localhost/api/adapter/listings", (_req, res, ctx) => {
+        return res(ctx.json({ items: [listing], meta: { totalItems: 1, totalPages: 1 } }))
+      }),
+      rest.get("http://localhost/api/adapter/user", (_req, res, ctx) => {
+        return res(
+          ctx.json({
+            id: "user1",
+            userRoles: { id: "user1", isAdmin: true, isPartner: false },
             jurisdictions: [
               {
                 id: "id1",
                 name: "JurisdictionA",
                 featureFlags: [],
               } as Jurisdiction,
+              {
+                id: "id2",
+                name: "JurisdictionB",
+                featureFlags: [
+                  {
+                    id: "id_1",
+                    name: FeatureFlagEnum.enableNonRegulatedListings,
+                    active: true,
+                  },
+                ],
+              } as Jurisdiction,
             ],
-          },
-          doJurisdictionsHaveFeatureFlagOn: (featureFlag) =>
-            mockJurisdictionsHaveFeatureFlagOn(featureFlag, false, false),
-        }}
-      >
-        <ListingsList />
-      </AuthContext.Provider>
+          })
+        )
+      }),
+      rest.post("http://localhost:3100/auth/token", (_req, res, ctx) => {
+        return res(ctx.json(""))
+      })
     )
 
+    render(<ListingsList />)
+
+    const addListingButton = await screen.findByRole("button", { name: "Add listing" })
+    expect(addListingButton).toBeInTheDocument()
+    await userEvent.click(addListingButton)
+
+    expect(
+      screen.getByRole("heading", { level: 1, name: "Select jurisdiction" })
+    ).toBeInTheDocument()
+    expect(
+      screen.getByText("Once you create this listing, this selection cannot be changed.")
+    ).toBeInTheDocument()
+
+    // Listing type question not there without a jurisdiction selected
+    expect(
+      screen.queryAllByRole("group", {
+        name: "What kind of listing is this?",
+      })
+    ).toHaveLength(0)
+
+    // select the jurisdiction without the enableNonRegulatedListings and question shouldn't exist
+    await userEvent.selectOptions(screen.getByLabelText("Jurisdiction"), "JurisdictionA")
+    expect(
+      screen.queryAllByRole("group", {
+        name: "What kind of listing is this?",
+      })
+    ).toHaveLength(0)
+
+    // select the jurisdiction with the enableNonRegulatedListings and question should exist
+    await userEvent.selectOptions(screen.getByLabelText("Jurisdiction"), "JurisdictionB")
+    const listingTypeRadioGroup = screen.getByRole("group", {
+      name: "What kind of listing is this?",
+    })
+    expect(
+      within(listingTypeRadioGroup).getByRole("radio", { name: "Regulated" })
+    ).toBeInTheDocument()
+    expect(
+      within(listingTypeRadioGroup).getByRole("radio", { name: "Non-regulated" })
+    ).toBeInTheDocument()
+
+    await userEvent.click(screen.getByRole("button", { name: "Get started" }))
+    // Since Regulated is selected by default the nonRegulated flag is not passed to the next page
+    await waitFor(() => {
+      expect(pushMock).toHaveBeenCalledWith({
+        pathname: "/listings/add",
+        query: { jurisdictionId: "id2" },
+      })
+    })
+  })
+
+  it("should not open add listing modal if user has access to only one jurisdiction and no enableNonRegulatedListings", async () => {
+    window.URL.createObjectURL = jest.fn()
+    document.cookie = "access-token-available=True"
+    const { pushMock } = mockNextRouter()
+    server.use(
+      rest.get("http://localhost:3100/listings", (_req, res, ctx) => {
+        return res(ctx.json({ items: [listing], meta: { totalItems: 1, totalPages: 1 } }))
+      }),
+      rest.get("http://localhost/api/adapter/listings", (_req, res, ctx) => {
+        return res(ctx.json({ items: [listing], meta: { totalItems: 1, totalPages: 1 } }))
+      }),
+      rest.get("http://localhost/api/adapter/user", (_req, res, ctx) => {
+        return res(
+          ctx.json({
+            id: "user1",
+            userRoles: { id: "user1", isAdmin: true, isPartner: false },
+            jurisdictions: [
+              {
+                id: "id1",
+                name: "JurisdictionA",
+                featureFlags: [],
+              } as Jurisdiction,
+            ],
+          })
+        )
+      }),
+      rest.post("http://localhost:3100/auth/token", (_req, res, ctx) => {
+        return res(ctx.json(""))
+      })
+    )
+
+    render(<ListingsList />)
+
     const addListingButton = await screen.findByRole("button", { name: "Add listing" })
     expect(addListingButton).toBeInTheDocument()
     await userEvent.click(addListingButton)