Find Care (Marketplace)

Search, filter and compare independently vetted clinics side by side.

<!-- GENERATED FILE. Do not edit by hand. Source: components/help/content/. Run npm run gen:docs. -->

Purpose & Business Context

Find Care is the public marketplace, the heart of the buying decision. A prospective patient needs to discover which vetted clinics can perform their procedure, in which country, at what indicative price, and how they compare on rating and accreditation, all without signing in and without contacting anyone first.

Commercially it is the primary conversion engine of the site. Letting visitors search, filter and compare freely builds the confidence that turns a browser into a lead: every card's call to action routes into the quote flow, so an unhurried comparison ends in a warm, high-intent enquiry rather than a cold form fill.

Screen Overview

A server-rendered page that wraps the shared chrome and a teal page hero around the client-side ClinicExplorer, the same marketplace engine reused inside the patient portal's Find Care screen. The hero shows headline network stats; below it the explorer provides a match wizard, a filter toolbar, a results count, a responsive grid of clinic cards, and a sticky compare bar.

The page is statically exportable: ?specialty= and ?country= deep links (used by the Treatments page) are read client-side, so arriving from a treatment card pre-filters the grid to that specialty.

Controls & Components

• Page hero: eyebrow, title, subtitle and three stats (accredited facilities, destination countries, patients coordinated).
• Find your match wizard: quick selects for treatment area, destination and budget plus a Find matches button that pre-fills the toolbar.
• Filter toolbar: free-text search, plus Specialty, Destination, Accreditation, Maximum price and Sort dropdowns.
• Results count: '<n> clinics, select up to 3 to compare'.
• Clinic cards: each shows name, location, verified-review stars, accreditation badges, specialties, an indicative From price with savings percent, lead time, a Compare toggle and a Request quote button.
• Compare bar: appears once a clinic is selected; shows pills, a Clear action and a Compare <n> button (enabled at two or more).
• Compare table: a side-by-side modal opened from Compare; dismissed by the scrim or the X.

Field Definitions

• Specialty / Treatment area: The clinical specialty filter, for example Cardiac Surgery or Dental Care. The wizard's treatment area applies the same Specialty filter on the toolbar.
• Destination: The country a clinic is in. Options are the distinct countries present in the vetted network, sorted alphabetically.
• Accreditation: A quality credential a clinic holds, for example JCI, ISO 9001 or NABH.
• Maximum price / Budget: An upper bound on a clinic's indicative From price. Buckets are Any, under $2,000, $5,000, $10,000 and $20,000.
• Sort: Ordering of results: Top rated (default), Lowest price, Biggest savings, or Most reviewed.
• From (price): The clinic's indicative starting price in USD. Always indicative, never a guaranteed quote.
• Savings %: Approximate saving versus the clinic's reference home market, shown beside the price with a down-trend arrow.
• Verified reviews: A blended star rating and total count aggregated from verified-transaction sources.

User Actions & Workflows

1. Optionally use Find your match: pick a treatment area, destination and budget, then press Find matches to pre-fill the filters.
2. Refine with the toolbar: type a clinic, city or specialty, or adjust the Specialty, Destination, Accreditation, Maximum price and Sort dropdowns.
3. Press Compare on a card to add it to your selection; you can select up to three.
4. When two or three are selected, press Compare <n> in the sticky bar to open the side-by-side table.
5. Read the comparison, then press Request quote on your preferred clinic to start the quote flow.

Navigation & Relationships

Reached from: the Find Care item in the primary nav, the hero button on the Home page, and View clinics links on Treatment cards (which deep-link with ?specialty=).

Leads to: the patient portal quote flow (/portal) via every card's Request quote button, so a comparison becomes a coordinated enquiry.

Shares its engine with: the portal's Find Care screen. Both render the same ClinicExplorer; only the surrounding shell and the card call to action differ.

Business Rules & Constraints

• Comparison is capped at three clinics; selecting a fourth is ignored until you remove one.
• The Compare button is disabled until at least two clinics are selected.
• Filters combine with AND logic; an empty result set shows guidance to widen destination or budget.
• All clinics shown are independently vetted partners; prices and savings are indicative and confirmed only after a medical review.
• Public screen: no sign-in is needed to search, filter or compare; sign-in begins only when a quote is requested.

Data Dependencies

The hero reads network (facilities, destination countries, patients coordinated). The explorer reads clinics, specialties and the derived clinicCountries from lib/data, and each card draws its reviews, accreditations, pricing and savings from the Clinic schema.

• network: hero stats
• clinics: the vetted clinic catalogue
• specialties: specialty filter options
• clinicCountries: destination filter options (derived from clinics)

Error Handling & Edge Cases

• No matches: the grid is replaced by 'No clinics match those filters yet. Try widening your destination or budget.'
• Over-selection: attempting a fourth comparison clinic is silently capped at three.
• Compare disabled: with fewer than two selected, the Compare button is greyed and not clickable.
• Deep links: an unknown ?specialty= or ?country= value falls back to showing all clinics rather than erroring.
• Mobile: the toolbar dropdowns and the card grid reflow to a single column; the compare bar stays reachable at the bottom.

User Roles & Permissions

• Public (no sign-in required): Anyone can search, filter, match and compare clinics. Signed-out visitors browse the marketplace freely.
• Request quote: Pressing a card's call to action leads into the authentication flow and the patient portal, where the quote is coordinated.

Related Features & Functionalities

The Treatments page (which deep-links here per specialty), the Pricing page (which itemises what a clinic's From price covers), the Quality page (which explains the accreditations shown on each card), and the portal's Find Care screen that shares this exact engine.

Flow & Screenshots

flowchart LR
  FindCare[Find Care] --> Hero[Page hero]
  FindCare --> Match[Find your match]
  Match --> Toolbar[Filter toolbar]
  FindCare --> Toolbar
  Toolbar --> Cards[Clinic cards]
  Cards -->|Compare| Bar[Compare bar]
  Bar -->|Compare 2-3| Table[Comparison table]
  Cards -->|Request quote| Portal[Patient portal]

Guided Walkthrough Steps

The in-app walkthrough for this screen has 5 steps (auto-advances every 5 seconds; Prev / Pause / Next; click outside to exit):

1. The marketplace ([data-tour="findcare.hero"])

Find and compare independently vetted clinics by procedure, destination, price and accreditation. The stats here summarise the whole network.

1. Search, filter and compare ([data-tour="findcare.explorer"])

This is the live marketplace engine. Use the match wizard and the filter toolbar to narrow the list, then compare clinics side by side.

1. Browse by topic ([data-tour="site.nav"])

Prefer to start from a treatment or a destination? The top nav jumps you to Treatments, Pricing, Quality and Destinations, all of which feed back into this marketplace.

1. Turning a match into a quote ([data-tour="site.cta"])

Every clinic card has a Request quote action. It leads into Get started and the patient portal, where your enquiry is coordinated. Browsing here needs no account.

1. Help is always here ([data-tour="topbar.help"])

Open this Help button on any public page for documentation, and press Play to replay a walkthrough like this one.