MolinoPro

fareharbor-flow-mappings

Master Codebase Guidebook
Markdown + HTML Dev-Docs Renderer - Frontend Client Module

Default Index
Open README.md
Root: README.md_PRD
Milestones
H1FareHarbor Booking Flow ID Mapping

Copy this CSV into Google Sheets: dev-docs/_PRD/fareharbor-flow-mappings.csv

H2Current State
H3Confirmed Mappings (Live)
Item IDItem NameCity/RegionFlow IDFlow NameTypeSection
617917Córdoba Guided TourCórdoba1361158Main Experience FlowexperienceTripFeaturedCitiesSection
617919Granada Alhambra TourGranada1361158Main Experience FlowexperienceTripFeaturedCitiesSection
618992Full Journey BundleAndalusia (multi-city)1361158Group Trip FlowtripTripFeaturedTripsSection
1362489Full Items CatalogueAll1362489Catalogue BrowselandingFareHarborIsland
1610878Alternative Flow AAll1610878Secondary Flowlanding-
1610879Alternative Flow BAll1610879Secondary Flowlanding-
1610876Córdoba Specific FlowCórdoba1610876City-SpecificcityTripFeaturedCitiesSection
1610877Granada Specific FlowGranada1610877City-SpecificcityTripFeaturedCitiesSection
H3Missing Mappings (Need Real IDs)
Item IDItem NameCityFlow IDTypePriority
[NEED]Madrid City TourMadrid[NEED]experienceHIGH
[NEED]Málaga ExperienceMálaga[NEED]experienceHIGH
[NEED]Sevilla Alcázar TourSevilla[NEED]experienceHIGH
[NEED]Group Trip DepartureVaries[NEED]tripMEDIUM
[NEED]Private Custom TourCustom[NEED]tripMEDIUM
H2How to Find Flow IDs
  1. Log into FareHarbor Dashboard: https://fareharbor.com/merchant/alandalus-experience/
  2. Navigate to Items → Select item → AdvancedFlow IDs
  3. Or go to Flows to see all configured flows
  4. The embed URL format: https://fareharbor.com/embeds/book/{account}/?flow={flowId}&full-items=yes
H2Component Mapping
ComponentFileUses Flow IDs
FareHarborBookingCardapp/experiences/FareHarborBookingCard.tsxitemId + flowId props
FHBookingButtonapp/(home)/studio/components/fareharbor/FHBookingButton.tsxflowId prop
FHLightframeButtonapp/(home)/studio/components/fareharbor/FHLightframeButton.tsxflowId prop
TripFeaturedCitiesSectionapp/trips/components/sections/TripFeaturedCitiesSection.tsxcity.bookingHref
TripFeaturedExperiencesSectionapp/trips/components/sections/TripFeaturedExperiencesSection.tsxexperience.bookingHref
FareHarborIslandapp/trips/ae-lander-v2/sections/FareHarborIsland.tsxscriptSrc
H2Notes
  • All components load the same lightframe script: https://fareharbor.com/embeds/api/v1/?autolightframe=yes
  • The data-fh-account attribute should always be alandalus-experience
  • When data-fh-item-id is present, the lightframe opens directly to that item
  • When data-fh-flow-id is present, it controls which booking flow UI is shown
  • If both are missing, it falls back to the full items catalogue