fix: apply button

Author: jimlin-sfgov

app/javascript/__tests__/modules/listingDetailsAside/ListingDetailsApply.test.tsx

@@ -1,12 +1,13 @@
 import React from "react"
 import { render, screen } from "@testing-library/react"
 import { MemoryRouter } from "react-router"
+import { useAuth } from "@clerk/clerk-react"
 import { ListingDetailsApply } from "../../../modules/listingDetailsAside/ListingDetailsApply"
 import { openSaleListing } from "../../data/RailsSaleListing/listing-sale-open"
 import { closedRentalListing } from "../../data/RailsRentalListing/listing-rental-closed"
 import { habitatListing } from "../../data/RailsSaleListing/listing-sale-habitat"
 import { setupUserContext } from "../../__util__/accountUtils"
-import { getAddProfilePath } from "../../../util/routeUtil"
+import { getAddProfilePath, getSignInPath } from "../../../util/routeUtil"
 import { useFeatureFlag } from "../../../hooks/useFeatureFlag"
 import { UNLEASH_FLAG } from "../../../modules/constants"
 
@@ -68,6 +69,17 @@ describe("ListingDetailsApply", () => {
       }))
     })
 
+    it("redirects signed out users to sign in", () => {
+      setupUserContext({ loggedIn: false })
+
+      render(<ListingDetailsApply listing={openSaleListing} />)
+
+      expect(screen.getByRole("link", { name: /apply online/i })).toHaveAttribute(
+        "href",
+        getSignInPath()
+      )
+    })
+
     it("redirects signed in users without a completed profile to the add profile page", () => {
       setupUserContext({ loggedIn: true, hasProfile: false })
 
@@ -78,5 +90,44 @@ describe("ListingDetailsApply", () => {
         getAddProfilePath()
       )
     })
+
+    it("does not render apply online while signed-in profile state is still loading", () => {
+      const context = setupUserContext({ loggedIn: true, hasProfile: false })
+      context.initialStateLoaded = false
+      ;(useAuth as jest.Mock).mockReturnValue({
+        isLoaded: true,
+        isSignedIn: true,
+      })
+
+      render(<ListingDetailsApply listing={openSaleListing} />)
+
+      expect(screen.queryByRole("link", { name: /apply online/i })).toBeNull()
+    })
+
+    it("uses the listing application link for signed in users with a profile", () => {
+      setupUserContext({ loggedIn: true, hasProfile: true })
+      ;(useAuth as jest.Mock).mockReturnValue({
+        isLoaded: true,
+        isSignedIn: true,
+      })
+
+      render(<ListingDetailsApply listing={openSaleListing} />)
+
+      expect(screen.getByRole("link", { name: /apply online/i }).getAttribute("href")).toBe(
+        `/listings/${openSaleListing.listingID}/apply-welcome/intro`
+      )
+    })
+
+    it("does not render apply online while Clerk auth is loading", () => {
+      setupUserContext({ loggedIn: false })
+      ;(useAuth as jest.Mock).mockReturnValue({
+        isLoaded: false,
+        isSignedIn: false,
+      })
+
+      render(<ListingDetailsApply listing={openSaleListing} />)
+
+      expect(screen.queryByRole("link", { name: /apply online/i })).toBeNull()
+    })
   })
 })

app/javascript/__tests__/pages/SignInFlow.test.tsx

@@ -10,10 +10,9 @@ import {
   restoreWindowLocation,
 } from "../__util__/renderUtils"
 import { setupUserContext } from "../__util__/accountUtils"
-import { AUTH_FLOW } from "../../modules/constants"
+import { AUTH_FLOW, UNLEASH_FLAG } from "../../modules/constants"
 import { authorizeHousingCounselor, getProfile } from "../../api/authApiService"
 import { useFeatureFlag } from "../../hooks/useFeatureFlag"
-import { UNLEASH_FLAG } from "../../modules/constants"
 
 jest.mock("../../hooks/useFeatureFlag", () => ({
   useFeatureFlag: jest.fn(() => ({

app/javascript/modules/listingDetailsAside/ListingDetailsApply.tsx

@@ -81,16 +81,13 @@ const ApplyButton = ({ href }: { href: string }) => (
 const ClerkApplyOnlineButton = ({ applyLink }: { applyLink: string }) => {
   const { isLoaded, isSignedIn } = useAuth()
   const { profile, initialStateLoaded } = useContext(UserContext)
-  let redirectOrApplyUrl = ""
-  if (isLoaded && isSignedIn && initialStateLoaded && profile) {
-    redirectOrApplyUrl = applyLink
-  } else if (isLoaded && !isSignedIn) {
-    redirectOrApplyUrl = getSignInPath()
-  } else if (isLoaded && isSignedIn && initialStateLoaded && !profile) {
-    redirectOrApplyUrl = getAddProfilePath()
-  }
 
-  return <ApplyButton href={redirectOrApplyUrl} />
+  if (isLoaded && isSignedIn && profile) return <ApplyButton href={applyLink} />
+  if (isLoaded && !isSignedIn) return <ApplyButton href={getSignInPath()} />
+  if (isLoaded && isSignedIn && initialStateLoaded && !profile)
+    return <ApplyButton href={getAddProfilePath()} />
+
+  return null
 }
 
 /**