@qite/tide-booking-component 1.4.110 → 1.4.112

package/build/build-esm/src/booking-wizard/features/travelers-form/travelers-form.d.ts

@@ -1,4 +1,3 @@
 import React from 'react';
-interface TravelersFormProps {}
-declare const TravelersForm: React.FC<TravelersFormProps>;
+declare const TravelersForm: React.FC;
 export default TravelersForm;

package/build/build-esm/src/search-results/components/book-packaging-entry/index.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 import { SearchSeed } from '../../types';
 interface BookPackagingEntryProps {
   activeSearchSeed: SearchSeed | null;
+  isConfirmationPage?: boolean;
 }
 declare const BookPackagingEntry: React.FC<BookPackagingEntryProps>;
 export default BookPackagingEntry;

package/build/build-esm/src/search-results/store/search-results-slice.d.ts

@@ -45,6 +45,7 @@ export interface SearchResultsState {
   confirmedExcursionsByDay: Record<string, PackagingAccommodationResponse[]>;
   bookPackagingEntry: boolean;
   currentStep: number;
+  bookingNumber?: string;
 }
 export declare const setResults: import('@reduxjs/toolkit').ActionCreatorWithPayload<BookingPackageItem[], 'searchResults/setResults'>,
   setFilteredResults: import('@reduxjs/toolkit').ActionCreatorWithPayload<BookingPackageItem[], 'searchResults/setFilteredResults'>,
@@ -131,6 +132,7 @@ export declare const setResults: import('@reduxjs/toolkit').ActionCreatorWithPay
     'searchResults/clearConfirmedExcursionsForDay'
   >,
   setBookPackagingEntry: import('@reduxjs/toolkit').ActionCreatorWithPayload<boolean, 'searchResults/setBookPackagingEntry'>,
-  setCurrentStep: import('@reduxjs/toolkit').ActionCreatorWithPayload<number, 'searchResults/setCurrentStep'>;
+  setCurrentStep: import('@reduxjs/toolkit').ActionCreatorWithPayload<number, 'searchResults/setCurrentStep'>,
+  setBookingNumber: import('@reduxjs/toolkit').ActionCreatorWithPayload<string, 'searchResults/setBookingNumber'>;
 declare const _default: import('@reduxjs/toolkit').Reducer<SearchResultsState>;
 export default _default;

package/build/build-esm/src/search-results/types.d.ts

@@ -44,6 +44,9 @@ export interface SearchResultsConfiguration {
   };
   onBook?: (result: BookingPackage) => void;
   packagingEntry?: PackagingEntry | null;
+  generatePaymentUrl?: boolean;
+  entryStatus?: number;
+  customEntryStatusId?: number;
 }
 export type FilterType = 'checkbox' | 'toggle' | 'slider' | 'star-rating';
 export type FilterProperty =

package/build/build-esm/src/shared/booking/shared-confirmation.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+export interface SharedConfirmationTranslations {
+  MAIL_SUBJECT: string;
+  TITLE_TEXT_OPTION: string;
+  TITLE_TEXT_OFFER: string;
+  TITLE_TEXT_BOOKING: string;
+  MESSAGE_TEXT1: string;
+  MESSAGE_TEXT2_OFFER: string;
+  MESSAGE_TEXT2_BOOKING: string;
+  QUESTIONS_TEXT1: string;
+  QUESTIONS_TEXT2: string;
+  QUESTIONS_TEXT3: string;
+  QUESTIONS_ALT: string;
+}
+export interface SharedConfirmationProps {
+  bookingNumber?: string;
+  isOption?: boolean;
+  isOffer?: boolean;
+  translations: SharedConfirmationTranslations;
+  companyContactPhone?: string;
+  companyContactEmail?: string;
+  homeUrl?: string;
+}
+declare const SharedConfirmation: React.FC<SharedConfirmationProps>;
+export default SharedConfirmation;

package/build/build-esm/src/shared/booking/summary.d.ts

@@ -0,0 +1,43 @@
+import React, { ReactNode } from 'react';
+import { SummaryCheckbox, TravelersFormValues } from '../../booking-wizard/types';
+export interface SummaryNotification {
+  id: number;
+  title?: string | null;
+  description?: string | null;
+  hasToBeConfirmed?: boolean;
+  isConfirmed?: boolean;
+}
+export interface SummaryVoucherState {
+  code?: string;
+  isValidated?: boolean;
+  isValid?: boolean;
+}
+export interface SharedSummaryProps {
+  translations: any;
+  travelerFormValues: TravelersFormValues;
+  checkboxes?: SummaryCheckbox[] | null;
+  notifications?: SummaryNotification[] | null;
+  remarks?: string;
+  voucher?: SummaryVoucherState;
+  voucherCodes?: string[];
+  enableVoucher?: boolean;
+  allowOption?: boolean;
+  isOffer?: boolean;
+  customValidateText?: string;
+  isSubmitting?: boolean;
+  userValidated?: boolean;
+  renderOptions: () => ReactNode;
+  renderPreviousButton: () => ReactNode;
+  renderLoader?: () => ReactNode;
+  onSubmit: React.FormEventHandler<HTMLFormElement>;
+  onRemarksChange?: (text: string) => void;
+  onCheckboxesChange?: (checkboxes: SummaryCheckbox[]) => void;
+  onNotificationsChange?: (notifications: SummaryNotification[]) => void;
+  onVoucherChange?: (voucher: SummaryVoucherState) => void;
+  onValidateVoucher?: () => void;
+  onAddVoucher?: React.MouseEventHandler<HTMLButtonElement>;
+  onRemoveVoucher?: (code: string) => void;
+  onUserValidatedChange?: (isValid: boolean) => void;
+}
+declare const SharedSummary: React.FC<SharedSummaryProps>;
+export default SharedSummary;

package/build/build-esm/src/shared/booking/travelers-form.d.ts

@@ -0,0 +1,93 @@
+import React, { ReactNode } from 'react';
+import { FormikProps } from 'formik';
+import { Country, RoomTraveler, Traveler, TravelersFormValues } from '../../booking-wizard/types';
+import { CountryItem, PackagingEntry, PackagingEntryPax } from '@qite/tide-client';
+export type TravelersFormField = {
+  type: string;
+};
+export type AgentOption = {
+  id: number | string;
+  name: string;
+  postalCode?: string;
+  location?: string;
+};
+export type TypeAheadOption = {
+  key: string;
+  value: string;
+  text: string;
+};
+export interface SharedTravelersSettings {
+  countries?: Country[];
+  formFields?: TravelersFormField[];
+  mainBookerFormFields?: TravelersFormField[];
+}
+export interface SharedTravelersFormProps {
+  formik: FormikProps<TravelersFormValues>;
+  translations: any;
+  travellersSettings?: SharedTravelersSettings;
+  countries?: CountryItem[];
+  agents?: AgentOption[];
+  bookingType?: string;
+  agentAdressId?: number;
+  travelersFirstStep?: boolean;
+  isUnavailable?: boolean;
+  useCompactForm?: boolean;
+  showAllCountries?: boolean;
+  showAgentSelection?: boolean;
+  initialShowAgents?: boolean;
+  renderPreviousButton?: () => ReactNode;
+  onBookingTypeChange?: (bookingType: string) => void;
+}
+export declare function createTraveler(
+  traveler: RoomTraveler,
+  followNumber: {
+    number: number;
+  },
+  personTranslation?: string,
+  isCompact?: boolean
+): Traveler;
+export declare function createInitialValuesFromRooms(
+  formRooms: {
+    adults: RoomTraveler[];
+    children: RoomTraveler[];
+  }[],
+  startDate?: string,
+  agentAdressId?: number,
+  personTranslation?: string,
+  isCompact?: boolean
+): TravelersFormValues;
+export declare function createInitialValuesFromEditablePackagingEntry(editablePackagingEntry: PackagingEntry, agentAdressId?: number): TravelersFormValues;
+export declare function applyTravelersFormValuesToEditablePackagingEntry(
+  editablePackagingEntry: PackagingEntry,
+  values: TravelersFormValues
+): {
+  pax: PackagingEntryPax[];
+  address: {
+    street: string;
+    houseNumber: string;
+    box: string;
+    zipCode: string;
+    place: string;
+    country: string;
+    travelAgentId: number;
+    phone: string;
+    email: string;
+    remarks?: string;
+  };
+  language?: string;
+  transactionId: string;
+  magicLink?: string;
+  dossierNumber: string;
+  bookingDate?: string | null;
+  price: number;
+  depositAmount: number;
+  rooms: import('@qite/tide-client').PackagingEntryRoom[];
+  lines: import('@qite/tide-client').PackagingEntryLine[];
+  status: import('@qite/tide-client').EntryStatus;
+  customStatusId?: number;
+  redirectUrl?: string;
+  returnPaymentUrl?: boolean;
+  remarks?: string;
+};
+declare const SharedTravelersForm: React.FC<SharedTravelersFormProps>;
+export default SharedTravelersForm;

package/build/build-esm/src/shared/utils/booking-summary.d.ts

@@ -0,0 +1 @@
+export declare const renderEditablePackagingEntrySummaryOptions: (editablePackagingEntry: any, priceDetails: any, translations: any) => any;

package/build/build-esm/src/shared/utils/localization-util.d.ts

@@ -354,6 +354,7 @@ export declare const getTranslations: (language: string) => {
     DEPARTURE_ASC: string;
     FILTERS: string;
     SHOW_ITINERARY: string;
+    VIEW_BOOKING: string;
     ITINERARY_TITLE: string;
     DOSSIER_NUMBER: string;
     PACKAGE_PRICE_PER_PERSON: string;
@@ -388,6 +389,11 @@ export declare const getTranslations: (language: string) => {
     DURATION_DESC: string;
     TRAVEL_GROUP: string;
     EXCURSION: string;
+    LOADING_EXCURSIONS: string;
+    LOADING_FLIGHTS: string;
+    LOADING_ACCOMMODATIONS: string;
+    LOADING_ITINERARY: string;
+    LOADING_OPTIONS: string;
   };
   ITINERARY: {
     DAY: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qite/tide-booking-component",
-  "version": "1.4.110",
+  "version": "1.4.112",
   "description": "React Booking wizard & Booking product component for Tide",
   "main": "build/build-cjs/index.js",
   "types": "build/build-cjs/src/index.d.ts",
@@ -29,7 +29,7 @@
   "devDependencies": {
     "@jsonurl/jsonurl": "^1.1.4",
     "@popperjs/core": "^2.10.2",
-    "@qite/tide-client": "^1.1.167",
+    "@qite/tide-client": "^1.1.172",
     "@reduxjs/toolkit": "^2.8.2",
     "@rollup/plugin-commonjs": "^19.0.1",
     "@rollup/plugin-json": "^4.1.0",

package/src/booking-wizard/components/step-indicator.tsx

@@ -2,7 +2,7 @@ import React, { useContext } from 'react';
 import { useSelector } from 'react-redux';
 import { selectTranslations, selectTravelersFirstStep } from '../features/booking/selectors';
 import SettingsContext from '../settings-context';
-import SharedStepIndicators from '../../shared/booking/StepIndicators';
+import SharedStepIndicators from '../../shared/booking/step-indicators';
 
 interface StepIndicatorsProps {
   currentStep: number;

package/src/booking-wizard/components/step-route.tsx

@@ -1,6 +1,6 @@
 import React, { useContext } from 'react';
 import StepIndicators from './step-indicator';
-import BookingPanel from '../../shared/booking/BookingPanel';
+import BookingPanel from '../../shared/booking/booking-panel';
 import SettingsContext from '../settings-context';
 import { useSelector } from 'react-redux';
 import { selectTranslations, selectTravelersFirstStep } from '../features/booking/selectors';

package/src/booking-wizard/features/confirmation/confirmation.tsx

@@ -1,16 +1,12 @@
 import React, { useContext, useEffect } from 'react';
 import { selectBookingNumber, selectBookingQueryString, selectIsOption, selectTranslations } from '../booking/selectors';
-
-import Message from '../../components/message';
 import SettingsContext from '../../settings-context';
 import { useSelector } from 'react-redux';
-import Icon from '../../../shared/components/icon';
 import { useAppDispatch } from '../../store';
 import { setCurrentStep } from '../booking/booking-slice';
 import { OPTIONS_FORM_STEP } from '../booking/constants';
-import { format } from '../../../shared/utils/localization-util';
 import { useNavigate } from 'react-router';
-import { book } from '@qite/tide-client';
+import SharedConfirmation from '../../../shared/booking/shared-confirmation';
 
 interface ConfirmationProps {}
 
@@ -22,6 +18,7 @@ const Confirmation: React.FC<ConfirmationProps> = () => {
   const bookingNumber = useSelector(selectBookingNumber);
   const bookingQueryString = useSelector(selectBookingQueryString);
   const isOption = useSelector(selectIsOption);
+  const translations = useSelector(selectTranslations);
 
   useEffect(() => {
     if (!bookingNumber) {
@@ -33,57 +30,16 @@ const Confirmation: React.FC<ConfirmationProps> = () => {
     }
   }, [bookingNumber]);
 
-  const translations = useSelector(selectTranslations);
-  const encodedMailSubject = encodeURI(translations.CONFIRMATION.MAIL_SUBJECT);
-
-  const titleText = isOption
-    ? format(translations.CONFIRMATION.TITLE_TEXT_OPTION, [bookingNumber])
-    : settings.isOffer
-    ? format(translations.CONFIRMATION.TITLE_TEXT_OFFER, [bookingNumber])
-    : format(translations.CONFIRMATION.TITLE_TEXT_BOOKING, [bookingNumber]);
-
   return (
-    <div className="form form__booking--message" id="booking--confirmation">
-      <div className="form__region">
-        <div className="form__row">
-          <div className="form__group">
-            <Message
-              type="success"
-              title={titleText}
-              actionComponent={
-                <div className="sm">
-                  <a href={`tel://${settings.companyContactPhone}`} className="sm__icon">
-                    <Icon name="tel" />
-                  </a>
-                  <a href={`mailto://${settings.companyContactEmail}`} className="sm__icon">
-                    <Icon name="mail" />
-                  </a>
-                  <a href="/" className="sm__icon">
-                    <Icon name="home" />
-                  </a>
-                </div>
-              }>
-              {!isOption ? (
-                <>
-                  <p>
-                    {translations.CONFIRMATION.MESSAGE_TEXT1}
-                    <br />
-                    {settings.isOffer ? translations.CONFIRMATION.MESSAGE_TEXT2_OFFER : translations.CONFIRMATION.MESSAGE_TEXT2_BOOKING}
-                  </p>
-                  <p>
-                    {translations.CONFIRMATION.QUESTIONS_TEXT1}{' '}
-                    <a href={`mailto:${settings.companyContactEmail}?subject=${encodedMailSubject}`} title={translations.CONFIRMATION.QUESTIONS_ALT}>
-                      {translations.CONFIRMATION.QUESTIONS_TEXT2}
-                    </a>
-                    {translations.CONFIRMATION.QUESTIONS_TEXT3}
-                  </p>
-                </>
-              ) : undefined}
-            </Message>
-          </div>
-        </div>
-      </div>
-    </div>
+    <SharedConfirmation
+      bookingNumber={bookingNumber}
+      isOption={isOption}
+      isOffer={settings.isOffer}
+      translations={translations.CONFIRMATION}
+      companyContactPhone={settings.companyContactPhone}
+      companyContactEmail={settings.companyContactEmail}
+      homeUrl={settings.basePath || '/'}
+    />
   );
 };
 

package/src/booking-wizard/features/sidebar/index.tsx

@@ -28,7 +28,7 @@ import { useSelector } from 'react-redux';
 
 import React from 'react';
 import SettingsContext from '../../settings-context';
-import SharedSidebar from '../../../shared/booking/Sidebar';
+import SharedSidebar from '../../../shared/booking/shared-sidebar';
 import { selectBookingAttributes } from '../booking/selectors';
 import { useContext } from 'react';
 

package/src/booking-wizard/features/summary/summary.tsx

@@ -1,6 +1,6 @@
 import { book, validateVoucher, EntryStatus } from '@qite/tide-client';
 import { BookingPackageRequest, BookingPackageVoucherRequest, ServiceType } from '@qite/tide-client';
-import { Link, useNavigate, useLocation } from 'react-router-dom';
+import { Link, useNavigate } from 'react-router-dom';
 import { compact, findIndex, isEmpty, isNil, uniqBy } from 'lodash';
 import React, { useContext, useEffect, useState } from 'react';
 import { useSelector } from 'react-redux';