Skip to main content

Quote System Overview

The quote calculator system provides real-time project estimation and lead capture.

Components​

Frontend​

  • QuoteCalculator Component - Main React component
  • Multi-step form interface
  • Real-time price calculation
  • Form validation

Backend​

  • Tracking API (/api/quote/track) - Real-time interaction tracking
  • Submission API (/api/quote/submit) - Form submission handler

Data Flow​

  1. User interacts with calculator
  2. Selections tracked via /api/quote/track
  3. User submits form
  4. Data validated and processed
  5. Contact created in HubSpot
  6. PDF generated
  7. Email sent (optional)
  8. Data saved to Sanity

Features​

  • Real-time price estimation
  • Multi-currency support
  • Country-specific pricing
  • Session tracking
  • Privacy-compliant tracking
  • PDF quote generation
  • HubSpot CRM integration

Next Steps​