@taximiami/multisite-adapter

Configuration adapter for TwelveTransfers multisite integration with @taximiami packages.

Installation

npm install @taximiami/multisite-adapter @taximiami/booking-form @taximiami/services @taximiami/types

Quick Start

1. Create .env file in your site directory

# Required
PUBLIC_BOOKING_API=https://twelve-booking-api.robert-7dc.workers.dev
PUBLIC_GOOGLE_MAPS_API_KEY=AIzaSyD4_hto-bQojMtocuj2XFDTxHHcDi1ANzM
PUBLIC_STRIPE_KEY=pk_live_MuCj2ZcE7A0pQfrN7k3p4Sso00TG3YdMMb

# Optional - Dify Chat
PUBLIC_DIFY_API_KEY=app-anmUp7QBBZL7Sh8Xn6noNS0D
PUBLIC_DIFY_WORKER_URL=https://dify-chat-proxy-miami.robert-7dc.workers.dev

2. Initialize in your Astro component

---
import { initializeForAstro, getClientConfig } from '@taximiami/multisite-adapter/astro';
import BookingWidget from '../components/BookingWidget';

// Initialize services on server
initializeForAstro();

// Get config for client components
const clientConfig = getClientConfig();
---

<BookingWidget config={clientConfig} client:load />

3. Use in React component

import { BookingProvider, BookingForm } from '@taximiami/booking-form';
import { createBookingConfig } from '@taximiami/multisite-adapter';

export function BookingWidget({ config }) {
  const bookingConfig = createBookingConfig(config);

  return (
    <BookingProvider config={bookingConfig}>
      <BookingForm onComplete={handleComplete} />
    </BookingProvider>
  );
}

Environment Variables

| Variable | Required | Description | |----------|----------|-------------| | PUBLIC_BOOKING_API | Yes | Booking API URL | | PUBLIC_GOOGLE_MAPS_API_KEY | Yes | Google Maps API key | | PUBLIC_STRIPE_KEY | Yes | Stripe publishable key | | PUBLIC_DIFY_API_KEY | No | Dify API key for chat | | PUBLIC_DIFY_WORKER_URL | No | Dify proxy worker URL | | PUBLIC_SITE_ID | No | Site identifier | | PUBLIC_SITE_NAME | No | Site display name |

API Reference

Main Functions

initializeFromEnv()

Initialize @taximiami/services from environment variables.

import { initializeFromEnv } from '@taximiami/multisite-adapter';
initializeFromEnv();

createBookingConfig(siteConfig?)

Create a BookingConfig for BookingProvider.

import { createBookingConfig } from '@taximiami/multisite-adapter';
const config = createBookingConfig({
  siteId: 'miami-airport-taxi',
  siteName: 'Miami Airport Taxi',
});

createDifyChatConfig(overrides?)

Create config for DifyChatProvider.

import { createDifyChatConfig } from '@taximiami/multisite-adapter';
const chatConfig = createDifyChatConfig();

Astro Helpers

initializeForAstro()

Initialize in Astro frontmatter.

getClientConfig()

Get serializable config for client components.

getSiteIdFromAstro(Astro)

Extract site ID from Astro context.

getSessionId(Astro)

Get session ID from URL query (?session=xxx).

TypeScript Support

Add type declarations to your env.d.ts:

/// <reference types="astro/client" />

interface ImportMetaEnv {
  readonly PUBLIC_BOOKING_API: string;
  readonly PUBLIC_GOOGLE_MAPS_API_KEY: string;
  readonly PUBLIC_STRIPE_KEY: string;
  readonly PUBLIC_DIFY_API_KEY?: string;
  readonly PUBLIC_DIFY_WORKER_URL?: string;
  readonly PUBLIC_SITE_ID?: string;
  readonly PUBLIC_SITE_NAME?: string;
}

interface ImportMeta {
  readonly env: ImportMetaEnv;
}

Migration from TwelveTransfers Shared Code

Before (direct env access)

const API_BASE = import.meta.env.PUBLIC_BOOKING_API;
const response = await fetch(`${API_BASE}/car-types`);

After (using adapter)

import { initializeFromEnv } from '@taximiami/multisite-adapter';
import { getVehicleTypes } from '@taximiami/services';

initializeFromEnv();
const vehicles = await getVehicleTypes();

Before (custom booking form)

import Step1Locations from '@/components/booking/Step1Locations';
// ... manual step orchestration

After (using @taximiami/booking-form)

import { BookingProvider, BookingForm } from '@taximiami/booking-form';
import { createBookingConfig } from '@taximiami/multisite-adapter';

<BookingProvider config={createBookingConfig()}>
  <BookingForm onComplete={handleComplete} />
</BookingProvider>

Related Packages

• @taximiami/booking-form - 6-step booking wizard + PaymentForm
• @taximiami/services - Booking & flight API services
• @taximiami/types - TypeScript definitions
• @taximiami/ui - UI component library
• @taximiami/dify-chat - AI chat widget

License

MIT