feat: add other-portals banner to Select Jurisdiction modal

[Copilot]

#6229

Moves the "other portals" banner concept from the listing address page into the Select Jurisdiction modal, where it's contextually more useful — the user has already chosen a jurisdiction by the time they reach the address section.

Description

The banner is gated via tIfExists: generic translation keys listings.otherPortals.* are defined in core's partner locale file with placeholder content, and forks override them with real portal names and URLs.

sites/partners/src/pages/index.tsx

• Import tIfExists from @bloom-housing/shared-helpers and Link from @bloom-housing/ui-seeds
• Cache the five tIfExists results as component-level variables (title, portal1 name/url, portal2 name/url) to avoid redundant calls
• Render the banner inside the same Grid.Cell as the Jurisdiction dropdown, directly above it; suppressed when defaultJurisdiction is set (single-jurisdiction users see "Select Listing Type" instead)
• Styled via SCSS module (index.module.scss) using ui-seeds variables: thick alert-colored border, padding, and bulleted list for portal links

const otherPortalsTitle = tIfExists("listings.otherPortals.title")
// ...

{otherPortalsTitle && !defaultJurisdiction && (
  <div className={styles["other-portals-banner"]} data-testid={"other-portals-banner"}>
    <p>{otherPortalsTitle}</p>
    <ul>
      {otherPortalsPortal1Name && otherPortalsPortal1Url && (
        <li><Link href={otherPortalsPortal1Url} target={"_blank"}>{otherPortalsPortal1Name}</Link></li>
      )}
      {/* portal2 same pattern */}
    </ul>
  </div>
)}

sites/partners/src/pages/index.module.scss (new file)

• .other-portals-banner styles using ui-seeds variables:
  • border: var(--seeds-border-2) solid var(--seeds-color-alert)
  • padding: var(--seeds-s4)
  • ul: list-style-type: disc; margin-block-start: var(--seeds-s2); padding-left: var(--seeds-s5)

sites/partners/page_content/locales/general.json

• Added generic placeholder content for all five listings.otherPortals.* keys so the banner renders in core with placeholder text; forks override with real portal names and URLs:
  • listings.otherPortals.title: "To add listings in other jurisdictions, use one of these portals:"
  • listings.otherPortals.portal1.name / .portal1.url
  • listings.otherPortals.portal2.name / .portal2.url

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

• Mock tIfExists via jest.mock + require() pattern; reset in afterEach
• Three new tests in describe("other portals banner"):
  • Not rendered when tIfExists returns null
  • Rendered with correct title text and link hrefs when keys are present (fork scenario)
  • Not rendered for single-jurisdiction users (modal shows "Select Listing Type")

How Can This Be Tested/Reviewed?

• In core: open the Add listing modal with multiple jurisdictions — the banner should appear above the Jurisdiction dropdown (in the same cell), with generic placeholder text, a thick alert-colored border, and bulleted portal links
• In a fork: override translation keys listings.otherPortals.title, listings.otherPortals.portal1.name, listings.otherPortals.portal1.url, listings.otherPortals.portal2.name, listings.otherPortals.portal2.url with real portal names and URLs — the banner should reflect the fork-specific content
• With a single-jurisdiction user, clicking Add listing should skip the modal entirely; banner should never render

Author Checklist:

• Added QA notes to the issue with applicable URLs
• Reviewed in a desktop view
• Reviewed in a mobile view
• Reviewed considering accessibility
• Added tests covering the changes
• Made corresponding changes to the documentation
• Ran yarn generate:client and/or created a migration when required

[netlify]

✅ Deploy Preview for partners-bloom-msq2 ready!

Name	Link
🔨 Latest commit	63618d9
🔍 Latest deploy log	https://app.netlify.com/projects/partners-bloom-msq2/deploys/6a0755ab9dd38d0008faecc1
😎 Deploy Preview	https://deploy-preview-6312--partners-bloom-msq2.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[netlify]

✅ Deploy Preview for bloom-angelopolis canceled.

Name	Link
🔨 Latest commit	63618d9
🔍 Latest deploy log	https://app.netlify.com/projects/bloom-angelopolis/deploys/6a0755ab9dd38d0008faecbf

[netlify]

✅ Deploy Preview for bloom-public-seeds ready!

Name	Link
🔨 Latest commit	63618d9
🔍 Latest deploy log	https://app.netlify.com/projects/bloom-public-seeds/deploys/6a0755abe6dc4100080303d1
😎 Deploy Preview	https://deploy-preview-6312--bloom-public-seeds.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[netlify]

✅ Deploy Preview for bloom-exygy-dev ready!

Name	Link
🔨 Latest commit	63618d9
🔍 Latest deploy log	https://app.netlify.com/projects/bloom-exygy-dev/deploys/6a0755abbc9de5000817142f
😎 Deploy Preview	https://deploy-preview-6312--bloom-exygy-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[emilyjablonski]

Left a comment!

[emilyjablonski]

Need to add the strings

[emilyjablonski]

Red border needs to be thicker. List of portals needs to actually be a list. It should be full width as well.

[Copilot]

Red border needs to be thicker. List of portals needs to actually be a list. It should be full width as well.

Done in commit 95980df:

• Border thickened: border → border-2
• List gets list-disc pl-5 for bullet styling
• Banner moved outside the <Grid> to span the full Dialog content width

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• download.cypress.io
  • Triggering command: /opt/hostedtoolcache/node/24.14.1/x64/bin/node /opt/hostedtoolcache/node/24.14.1/x64/bin/node index.js --exec install (dns block)
• downloads.sentry-cdn.com
  • Triggering command: /opt/hostedtoolcache/node/24.14.1/x64/bin/node /opt/hostedtoolcache/node/24.14.1/x64/bin/node ./scripts/install.js (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

[emilyjablonski]

1. There's not enough spacing above the banner and too much below. Can it be in the same cell the dropdown is in?
2. We need to use the SCSS module files and ui-seeds variables instead of Tailwind

[Copilot]

1. There's not enough spacing above the banner and too much below. Can it be in the same cell the dropdown is in?
2. We need to use the SCSS module files and ui-seeds variables instead of Tailwind

Done in commit 5a71b4d:

1. Banner moved back into the same Grid.Cell as the Jurisdiction dropdown — spacing is now handled naturally by the cell layout and the existing seeds-m-bs-4 on the Select wrapper.
2. Replaced all Tailwind classes with a new index.module.scss using ui-seeds variables:
   • border: var(--seeds-border-2) solid var(--seeds-color-alert)
   • padding: var(--seeds-s4)
   • List: list-style-type: disc; padding-left: var(--seeds-s5) with margin-block-start: var(--seeds-s2) for spacing between title and list

[netlify]

✅ Deploy Preview for partners-bloom-dev ready!

Name	Link
🔨 Latest commit	63618d9
🔍 Latest deploy log	https://app.netlify.com/projects/partners-bloom-dev/deploys/6a0755ab9dd38d0008faecb8
😎 Deploy Preview	https://deploy-preview-6312--partners-bloom-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[emilyjablonski]

We should chat as a team, but I'm not a fan of the existing red border UI - I think text linking to other portals would suffice and be less jarring. It's also not a pattern we have anywhere else - we could use an alert if we think we need to call particular attention.