@qite/tide-booking-component 1.4.124 → 1.4.126

package/src/booking-wizard/settings-context.ts

@@ -1,64 +0,0 @@
-import React from 'react';
-import { Settings } from './types';
-
-interface WizardSettingsContextProps extends Settings {}
-
-const SettingsContext = React.createContext<WizardSettingsContextProps>({
-  language: 'nl-BE',
-  token: '',
-  generatePaymentUrl: false,
-  officeId: 1,
-  tagIds: [],
-  hideAgentSelection: false,
-  agentAdressId: undefined,
-  affiliateSlug: undefined,
-  productPath: '/',
-  basePath: '/boeken',
-  skipBasePathInRouting: false,
-  roomOptions: {
-    pathSuffix: '/'
-  },
-  flightOptions: {
-    pathSuffix: '/vluchten'
-  },
-  options: {
-    pathSuffix: '/opties',
-    reportPrintActionId: null
-  },
-  travellers: {
-    pathSuffix: '/reizigers',
-    travelersFirstStep: false,
-    showAllCountries: false
-  },
-  summary: {
-    pathSuffix: '/samenvatting',
-    checkboxes: null
-  },
-  confirmation: {
-    pathSuffix: '/bevestiging'
-  },
-  error: {
-    pathSuffix: '/mislukt'
-  },
-  companyContactEmail: 'info@tidesoftware.be',
-  companyContactPhone: '093362299',
-  showProductCardRating: false,
-  showSidebarDeposit: false,
-  sidebarHeaderComponent: null,
-  sidebarFooterComponent: null,
-  loaderComponent: null,
-  icons: null,
-  bookingOptions: {
-    b2b: {
-      entryStatus: 0
-    },
-    b2b2c: {
-      entryStatus: 0
-    },
-    b2c: {
-      entryStatus: 0
-    }
-  }
-});
-
-export default SettingsContext;

package/src/booking-wizard/store.ts

@@ -1,26 +0,0 @@
-import { Action, ThunkAction, configureStore } from '@reduxjs/toolkit';
-
-import apiSettingsReducer from './api-settings-slice';
-import bookingReducer from './features/booking/booking-slice';
-import priceDetailsReducer from './features/price-details/price-details-slice';
-import travelersFormReducer from './features/travelers-form/travelers-form-slice';
-import summaryReducer from './features/summary/summary-slice';
-import { useDispatch } from 'react-redux';
-
-export const store = configureStore({
-  reducer: {
-    booking: bookingReducer,
-    travelersForm: travelersFormReducer,
-    priceDetails: priceDetailsReducer,
-    summary: summaryReducer,
-    apiSettings: apiSettingsReducer
-  }
-});
-
-export type RootState = ReturnType<typeof store.getState>;
-
-export type AppThunk<ReturnType = void> = ThunkAction<ReturnType, RootState, unknown, Action<string>>;
-
-export type AppDispatch = typeof store.dispatch;
-
-export const useAppDispatch = () => useDispatch<AppDispatch>();

package/src/booking-wizard/types.ts

@@ -1,350 +0,0 @@
-import { BookingPackageFlight } from '@qite/tide-client/build/types';
-
-export interface Settings {
-  officeId: number;
-  token?: string;
-  bookingOptions: BookingOptions;
-  productPath: string;
-  basePath: string;
-  skipBasePathInRouting?: boolean;
-  roomOptions: {
-    isHidden?: boolean | null;
-    pathSuffix?: string | null;
-  };
-  flightOptions: {
-    isHidden?: boolean | null;
-    pathSuffix?: string | null;
-  };
-  options: {
-    pathSuffix: string;
-    showRoomOptions?: boolean | null;
-    reportPrintActionId?: number | null;
-  };
-  travellers: {
-    pathSuffix: string;
-    compactForm?: boolean;
-    formFields?: FormField[];
-    mainBookerFormFields?: FormField[];
-    countries?: Country[];
-    travelersFirstStep?: boolean;
-    showAllCountries?: boolean;
-  };
-  summary: {
-    pathSuffix: string;
-    checkboxes?: SummaryCheckbox[] | null;
-  };
-  confirmation: {
-    pathSuffix: string;
-  };
-  error: {
-    pathSuffix: string;
-  };
-  language: string;
-  includeFlights?: boolean;
-  generatePaymentUrl?: boolean;
-  skipPaymentWithAgent?: boolean;
-  paymentRedirectUrl?: string;
-  companyContactEmail: string;
-  companyContactPhone: string;
-  showProductCardRating: boolean;
-  showSidebarDeposit: boolean;
-  showCommission?: boolean;
-  sidebarHeaderComponent?: JSX.Element | null;
-  sidebarFooterComponent?: JSX.Element | null;
-  loaderComponent?: JSX.Element | null;
-  icons?: string | null;
-  tagIds?: number[];
-  agentRequired?: boolean;
-  hideAgentSelection?: boolean;
-  agentAdressId?: number;
-  affiliateSlug?: string;
-  enableVoucher?: boolean;
-  skipRouter?: boolean;
-  apiUrl?: string;
-  apiKey?: string;
-  hideTags?: boolean;
-  translationFiles?: {
-    language: string;
-    path: string;
-  }[];
-  /**
-   * URL of a JSON translation file that will be fetched at runtime and
-   * deep-merged over the built-in translations for the active language.
-   * The `{language}` token in the URL is replaced with the active language
-   * code, so a single setting can serve multiple languages by dropping files
-   * like `en-GB.json`, `nl-BE.json` side by side.
-   *
-   * Mirrors the same attribute on the booking-product self-contained build.
-   * Only the keys present in the host file are overridden; everything else
-   * falls back to the built-in translations. If the file 404s or fails to
-   * load, the component logs a warning and silently uses the built-ins.
-   *
-   * The self-contained wizard suppresses its initial render until this fetch
-   * resolves, so end users never see a flash of built-in copy.
-   */
-  customTranslationsUrl?: string;
-  accommodations?: AccommodationContent[];
-  regimes?: RegimeContent[];
-  accommodationViewId?: number;
-  isOffer?: boolean;
-  allowOption?: boolean;
-  customOptionStatus?: number;
-  customValidateText?: string;
-  showPricesPerPaxType?: boolean; // BasePrice split by pax type in summary and price details, show Price should be enabled
-}
-
-export interface FormField {
-  type: string;
-}
-
-export interface Country {
-  iso2: string;
-  name: string;
-  phonePrefix: string;
-}
-
-export interface BookingOptions {
-  b2b: BookingOptionsDetail;
-  b2b2c: BookingOptionsDetail;
-  b2c: BookingOptionsDetail;
-}
-
-export interface BookingOptionsDetail {
-  entryStatus: number;
-  customEntryStatusId?: number;
-  tagIds?: number[];
-}
-
-export interface SummaryCheckbox {
-  id: string;
-  text: string;
-  isSelected: boolean;
-}
-
-export interface Traveler {
-  id: number;
-  gender: string;
-  firstName: string;
-  lastName: string;
-  birthDate: string;
-  age?: number;
-}
-
-export interface Room {
-  adults: number;
-  children: number;
-  childAges: number[];
-  accommodationCode?: string;
-  regimeCode?: string;
-}
-
-export interface FlightInfo {
-  outwardCode: string;
-  outwardAirlines: string[] | null;
-  outwardNumbers: string[];
-  outwardFareCode: string | null;
-  outwardMarketingName: string | null;
-  outwardClass: string;
-  outwardDepartureDate: string | null;
-  outwardArrivalDate: string | null;
-  returnCode: string;
-  returnAirlines: string[] | null;
-  returnNumbers: string[];
-  returnFareCode: string | null;
-  returnMarketingName: string | null;
-  returnClass: string;
-  returnDepartureDate: string | null;
-  returnArrivalDate: string | null;
-  luggageIncluded: boolean; // used to get correct flight from amadeus
-}
-
-export interface TravelersFormValues {
-  rooms: TravelersFormRoomValues[];
-  startDate?: string;
-  mainBookerId: number;
-  street: string;
-  houseNumber: string;
-  box: string;
-  zipCode: string;
-  place: string;
-  country: string;
-  phone: string;
-  email: string;
-  emailConfirmation: string;
-  travelAgentId: number;
-  travelAgentName: string;
-}
-
-export interface TravelersFormRoomValues {
-  adults: Traveler[];
-  children: Traveler[];
-}
-
-export interface ProductAttributes {
-  productCode: string;
-  productName: string;
-}
-
-export interface BookingAttributes {
-  startDate: string;
-  endDate: string;
-  catalogueId: number;
-  rooms: Room[];
-  flight: FlightInfo | null;
-  tourCode: string | null;
-  allotmentName: string | null;
-  allotmentIds: number[];
-  includeFlights?: boolean;
-  flightRouteId?: string | null;
-  vendorConfigurationId?: number | null;
-  searchConfigurationId?: number | null;
-  productCode?: string;
-  productName?: string;
-}
-
-export interface FlightLine {
-  departureAirportIata?: string;
-  departureAirportDescription?: string;
-  departureDate?: string;
-  departureTime?: string;
-  arrivalAirportIata?: string;
-  arrivalAirportDescription?: string;
-  arrivalDate?: string;
-  arrivalTime?: string;
-  airlineIata?: string;
-  airlineDescription?: string;
-  airlineNumber?: string;
-  travelClass?: string;
-  number?: string;
-  airlineCode?: string;
-}
-
-export interface AccommodationContent {
-  code: string;
-  title: string;
-  imageUrl: string;
-  usps: string[];
-  description: string | undefined;
-}
-
-export interface RegimeContent {
-  code: string;
-  title: string;
-}
-
-export interface SelectableRoom {
-  index: number;
-  selected: SelectableRoomAccommodation;
-  alternatives: SelectableRoomAccommodation[];
-}
-
-export interface SelectableRoomAccommodation {
-  code: string;
-  regimeCode: string;
-  from: string;
-  to: string;
-  price: number;
-  regimes: SelectableRoomRegime[];
-  title: string;
-  image: string | undefined;
-  usps: string[];
-  description: string | undefined;
-  viewHtml: string | undefined;
-}
-
-export interface SelectableRoomRegime {
-  code: string;
-  title: string;
-  price: number;
-}
-
-export interface GroupedFlights {
-  isSelected: boolean;
-  price: number;
-
-  outward: GroupedFlightDetails;
-  return: GroupedFlightDetails;
-
-  selectedOutward: BookingPackageFlight;
-  selectedReturn: BookingPackageFlight;
-}
-
-export interface GroupedFlightDetails {
-  airlineCode: string;
-  airline: string;
-  departureDate: string;
-  departureTime: string;
-  departureAirportCode: string;
-  departureAirport: string;
-  arrivalDate: string;
-  arrivalTime: string;
-  arrivalAirport: string;
-  changeDurationMinutes: number;
-  travelDurationMinutes: number;
-  travelDuration: string;
-  numberOfStops: number;
-  isNextDay: boolean;
-  travelClass: string;
-  flightLines: GroupedFlightLine[];
-}
-
-export interface GroupedFlightLine {
-  airline: string;
-  number: string;
-  departureDate: string;
-  departureTime: string;
-  departureAirport: string;
-  arrivalDate: string;
-  arrivalTime: string;
-  arrivalAirport: string;
-  travelDuration: string;
-  waitDuration: string | undefined;
-}
-
-export interface FlightFilterOptions {
-  airports: FlightFilterOption[];
-  airlines: FlightFilterOption[];
-  numberOfStops: FlightFilterOption[];
-  outward: FlightDirectionFilter;
-  return: FlightDirectionFilter;
-}
-
-export interface FlightFilterOption {
-  value: string;
-  label: string;
-  count: number;
-  isSelected: boolean;
-}
-
-export interface FlightDirectionFilter {
-  departurePeriod: FlightFilterOption[];
-  travelDuration: TimeRangeFilter;
-  changeDuration: TimeRangeFilter;
-}
-
-export interface TimeRangeFilter {
-  min: number;
-  max: number;
-
-  selectedMin: number;
-  selectedMax: number;
-}
-
-export interface RoomTraveler {
-  id: number;
-  age: number;
-}
-
-export interface PricePerPaxType {
-  paxType: string;
-  pricePerPaxType: number;
-  numberOfPax: number;
-  details: PriceDetailsPerPaxType[];
-}
-
-export interface PriceDetailsPerPaxType {
-  numberOfPax: number;
-  description: string;
-  price: number;
-  paxIds: number[];
-}

package/src/booking-wizard/use-offer-printer.ts

@@ -1,108 +0,0 @@
-import { useCallback, useContext, useState } from 'react';
-import SettingsContext from './settings-context';
-import { buildTideClientConfig } from '../shared/utils/tide-api-utils';
-import { book, print } from '@qite/tide-client';
-
-import type {
-  BookingPackage,
-  BookingPackageBookRequest,
-  BookingPackageDossier,
-  BookingPackageRequest,
-  AgentPrintActionRequest,
-  Pax,
-  BookingPackagePax
-} from '@qite/tide-client/build/types';
-
-export interface UseOfferPrinterArgs {
-  bookingPackage?: BookingPackage;
-  getPax: () => Pax[] | undefined;
-  tagIds?: number[];
-  printActionId?: number | null;
-  onPrinted?: (pdfUrl: string) => void;
-}
-
-export function useOfferPrinter({ bookingPackage, getPax, tagIds = [], printActionId = null, onPrinted }: UseOfferPrinterArgs) {
-  const settings = useContext(SettingsContext);
-  if (!settings) throw new Error('useOfferPrinter must be used inside <BookingWizard>');
-
-  const { language, officeId } = settings;
-  const agentId = (settings as any).agentAdressId;
-
-  if (typeof agentId !== 'number' || agentId <= 0) {
-    throw new Error('Missing agentAdressId in wizard settings');
-  }
-
-  const [stage, setStage] = useState<'idle' | 'creating' | 'printing'>('idle');
-  const loading = stage !== 'idle';
-
-  const createOffer = useCallback(async (): Promise<BookingPackageDossier> => {
-    const paxRaw = getPax();
-    if (!bookingPackage || !paxRaw?.length) {
-      throw new Error('Missing booking package or pax');
-    }
-
-    const pax = paxRaw as unknown as BookingPackagePax[];
-
-    const request: BookingPackageRequest<BookingPackageBookRequest> = {
-      officeId,
-      agentId,
-      payload: {
-        package: bookingPackage,
-        status: 0,
-        pax,
-        nonTravelPax: [],
-        notifications: [],
-        tagIds,
-        customerRequests: []
-      }
-    };
-
-    const cfg = buildTideClientConfig();
-    return book(cfg, request, undefined, language);
-  }, [agentId, bookingPackage, getPax, language, officeId, tagIds]);
-
-  const languageData = [
-    { code: 'nl-BE', tideId: 1 },
-    { code: 'fr-BE', tideId: 2 },
-    { code: 'en-GB', tideId: 3 }
-  ];
-
-  function getTideLanguageId(code: string) {
-    return languageData.find((l) => l.code === code)?.tideId || 1;
-  }
-
-  const printOffer = useCallback(
-    async (offer: BookingPackageDossier) => {
-      const cfg = buildTideClientConfig();
-
-      const req: AgentPrintActionRequest = {
-        id: printActionId ?? 0,
-        dossierNumber: (offer as any).dossierNumber ?? (offer as any).number,
-        languageId: getTideLanguageId(language)
-      };
-
-      const res = await print(cfg, req);
-      const buf = await res.arrayBuffer();
-      const url = URL.createObjectURL(new Blob([buf], { type: 'application/pdf' }));
-      onPrinted?.(url);
-      window.open(url);
-    },
-    [language, onPrinted]
-  );
-
-  const handlePrint = useCallback(async () => {
-    try {
-      setStage('creating');
-      const offer = await createOffer();
-      setStage('printing');
-      await printOffer(offer);
-    } catch (err) {
-      console.error('Offer print failed:', err);
-      throw err;
-    } finally {
-      setStage('idle');
-    }
-  }, [createOffer, printOffer]);
-
-  return { handlePrint, loading, stage };
-}

package/src/content/components/LanguageSwitcher.tsx

@@ -1,158 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-
-type Lang = { code: string; label: string };
-
-interface LanguageSwitcherProps {
-  value?: string;
-  languages?: Lang[];
-  onChange?: (code: string) => void;
-}
-
-const DEFAULT_LANGUAGES: Lang[] = [
-  { code: 'EN', label: 'English' },
-  { code: 'NL', label: 'Nederlands' },
-  { code: 'FR', label: 'Français' },
-  { code: 'DE', label: 'Deutsch' }
-];
-
-const LanguageSwitcher: React.FC<LanguageSwitcherProps> = ({ value = 'EN', languages = DEFAULT_LANGUAGES, onChange }) => {
-  const [open, setOpen] = useState(false);
-  const [current, setCurrent] = useState(value);
-  const rootRef = useRef<HTMLDivElement | null>(null);
-  const buttonRef = useRef<HTMLButtonElement | null>(null);
-  const menuId = 'language-switcher-menu';
-
-  // Keep in sync if parent controls value
-  useEffect(() => setCurrent(value), [value]);
-
-  // Close on outside click
-  useEffect(() => {
-    const onPointerDown = (e: PointerEvent) => {
-      if (!open) return;
-      const target = e.target as Node;
-      if (rootRef.current && !rootRef.current.contains(target)) setOpen(false);
-    };
-    window.addEventListener('pointerdown', onPointerDown);
-    return () => window.removeEventListener('pointerdown', onPointerDown);
-  }, [open]);
-
-  // Close on ESC
-  useEffect(() => {
-    const onKeyDown = (e: KeyboardEvent) => {
-      if (!open) return;
-      if (e.key === 'Escape') {
-        setOpen(false);
-        buttonRef.current?.focus();
-      }
-    };
-    window.addEventListener('keydown', onKeyDown);
-    return () => window.removeEventListener('keydown', onKeyDown);
-  }, [open]);
-
-  const selectLang = (code: string) => {
-    setCurrent(code);
-    onChange?.(code);
-    setOpen(false);
-    buttonRef.current?.focus();
-  };
-
-  const onButtonKeyDown: React.KeyboardEventHandler<HTMLButtonElement> = (e) => {
-    if (e.key === 'Enter' || e.key === ' ') {
-      e.preventDefault();
-      setOpen((v) => !v);
-    }
-    if (e.key === 'ArrowDown') {
-      e.preventDefault();
-      setOpen(true);
-      // focus first option next tick
-      requestAnimationFrame(() => {
-        rootRef.current?.querySelector<HTMLButtonElement>('[role="menuitemradio"]')?.focus();
-      });
-    }
-  };
-
-  const onMenuKeyDown: React.KeyboardEventHandler<HTMLDivElement> = (e) => {
-    const items = Array.from(rootRef.current?.querySelectorAll<HTMLButtonElement>('[role="menuitemradio"]') ?? []);
-    if (!items.length) return;
-
-    const idx = items.indexOf(document.activeElement as HTMLButtonElement);
-
-    if (e.key === 'ArrowDown') {
-      e.preventDefault();
-      items[(idx + 1 + items.length) % items.length].focus();
-    } else if (e.key === 'ArrowUp') {
-      e.preventDefault();
-      items[(idx - 1 + items.length) % items.length].focus();
-    } else if (e.key === 'Home') {
-      e.preventDefault();
-      items[0].focus();
-    } else if (e.key === 'End') {
-      e.preventDefault();
-      items[items.length - 1].focus();
-    }
-  };
-
-  return (
-    <div className="nav__subnav__languages" ref={rootRef}>
-      {/* <svg
-        className="nav__subnav__languages__icon"
-        xmlns="http://www.w3.org/2000/svg"
-        width="16"
-        height="16"
-        fill="currentColor"
-        viewBox="0 0 16 16"
-        aria-hidden="true"
-      >
-        <path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8zm8-7a7 7 0 0 0-6.468 4.146h12.936A7 7 0 0 0 8 1zm-6.218 5.5a13.334 13.334 0 0 1 .664-1.75H13.55c.24.56.42 1.17.528 1.75H1.782zm-.57 1.5h13.576a13.334 13.334 0 0 1-.664 1.75H2.208a13.334 13.334 0 0 1-.664-1.75zm.57 3.5c.796 2.07 2.39 3.5 4.22 3.5s3.424-1.43 4.22-3.5H1.782zM8 15a7 7 0 0 0 6.468-4.146H1.532A7 7 0 0 0 8 15z" />
-      </svg> */}
-
-      <button
-        ref={buttonRef}
-        type="button"
-        className="nav__subnav__languages__button"
-        aria-haspopup="menu"
-        aria-expanded={open}
-        aria-controls={menuId}
-        onClick={() => setOpen((v) => !v)}
-        onKeyDown={onButtonKeyDown}>
-        <span className="nav__subnav__languages__value">{current}</span>
-        <svg
-          className="nav__subnav__languages__chevron"
-          xmlns="http://www.w3.org/2000/svg"
-          width="14"
-          height="14"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth="2"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          aria-hidden="true">
-          <path d="m6 9 6 6 6-6" />
-        </svg>
-      </button>
-
-      <div
-        id={menuId}
-        className={`nav__subnav__languages__dropdown ${open ? 'is-open' : ''}`}
-        role="menu"
-        aria-label="Select language"
-        onKeyDown={onMenuKeyDown}>
-        {languages.map((l) => (
-          <button
-            key={l.code}
-            type="button"
-            className={`nav__subnav__languages__option ${l.code === current ? 'is-active' : ''}`}
-            role="menuitemradio"
-            aria-checked={l.code === current}
-            onClick={() => selectLang(l.code)}>
-            <span className="nav__subnav__languages__option__code">{l.code}</span>
-            <span className="nav__subnav__languages__option__label">{l.label}</span>
-          </button>
-        ))}
-      </div>
-    </div>
-  );
-};
-
-export default LanguageSwitcher;