@qite/tide-booking-component 1.4.124 → 1.4.126

package/src/booking-wizard/features/booking/selectors.ts

@@ -1,411 +0,0 @@
-import JsonURL from '@jsonurl/jsonurl';
-import { Gender } from '@qite/tide-client';
-import { BookingPackageAddress, BookingPackageBookRequest, BookingPackagePax, BookingPackageRequest } from '@qite/tide-client/build/types';
-import { createSelector } from '@reduxjs/toolkit';
-import { format, parseISO } from 'date-fns';
-import { omit } from 'lodash';
-import { getTranslations } from '../../../shared/utils/localization-util';
-import { RootState } from '../../store';
-import { FlightInfo, Room, Traveler } from '../../types';
-import { selectNotifications } from '../price-details/price-details-slice';
-import { selectAgentId, selectTravelersFormValues } from '../travelers-form/travelers-form-slice';
-
-export const selectHasMounted = (state: RootState) => state.booking.hasMounted;
-
-export const selectIsFetching = (state: RootState) => state.booking.isFetching;
-
-export const selectCurrentStep = (state: RootState) => state.booking.currentStep;
-
-export const selectGeneratePaymentUrl = (state: RootState) => state.booking.generatePaymentUrl;
-
-export const selectSkipPaymentWithAgent = (state: RootState) => state.booking.skipPaymentWithAgent;
-
-export const selectIsFetchingProductOptions = (state: RootState) => state.booking.isBusy;
-
-export const selectDepartureFlight = (state: RootState) => state.booking.package?.outwardFlights?.find((x) => x.isSelected);
-
-export const selectReturnFlight = (state: RootState) => state.booking.package?.returnFlights?.find((x) => x.isSelected);
-
-export const selectPackageRooms = (state: RootState) => state.booking.package?.options.find((x) => x.isSelected)?.rooms;
-
-export const selectIncludedServiceTypes = (state: RootState) => selectActiveOption(state)?.includedServiceTypes;
-
-export const selectAvailabilities = (state: RootState) => state.booking.package?.options.find((x) => x.isSelected)?.availabilities;
-
-export const selectPackageTags = (state: RootState) => state.booking.package?.tags;
-
-export const selectIsOnRequest = (state: RootState) => state.booking.package?.options.find((x) => x.isSelected)?.isOnRequest;
-
-export const selectPackageOptionUnits = (state: RootState) => state.booking.package?.options.find((x) => x.isSelected)?.optionUnits;
-
-export const selectPackageOptionPax = (state: RootState) => state.booking.package?.options.find((x) => x.isSelected)?.optionPax;
-
-export const selectPackageGroups = (state: RootState) => state.booking.package?.options.find((x) => x.isSelected)?.groups;
-
-export const selectPackageDetails = (state: RootState) => state.booking.package;
-
-export const selectPackageFlights = (state: RootState) => ({
-  outward: state.booking.package?.outwardFlights,
-  return: state.booking.package?.returnFlights
-});
-
-export const selectFlightMetaData = (state: RootState) => state.booking.package?.flightInfo.metaData;
-
-export const selectActiveOption = (state: RootState) => state.booking.package?.options.find((x) => x.isSelected);
-
-export const selectPackageAirlineGroups = createSelector(
-  selectActiveOption,
-  selectDepartureFlight,
-  selectReturnFlight,
-  (option, departureFlight, returnFlight) =>
-    option?.airlineGroups.filter((x) => x.flightIds.includes(departureFlight?.entryLineGuid ?? '') || x.flightIds.includes(returnFlight?.entryLineGuid ?? ''))
-);
-
-export const selectPackageAirportGroups = createSelector(
-  selectActiveOption,
-  selectDepartureFlight,
-  selectReturnFlight,
-  (option, departureFlight, returnFlight) =>
-    option?.airportGroups.filter((x) => x.flightIds.includes(departureFlight?.entryLineGuid ?? '') || x.flightIds.includes(returnFlight?.entryLineGuid ?? ''))
-);
-
-export const selectRoomOptionDepartureFlightsMetaData = createSelector(selectActiveOption, selectFlightMetaData, (ativeOption, flightMetaData) => {
-  const roomOptions = ativeOption?.rooms.map((r) => r.options.filter((o) => o.isSelected).shift());
-  return roomOptions?.map((ro) => flightMetaData?.find((f) => f.entryLineGuid === ro?.entryLineGuid)?.flightMetaData).filter((f) => f !== undefined) ?? [];
-});
-
-export const selectRoomOptionReturnFlightsMetaData = createSelector(selectActiveOption, selectFlightMetaData, (ativeOption, flightMetaData) => {
-  const selectedRoomOptions = ativeOption?.rooms.map((r) => r.options.filter((o) => o.isSelected));
-  // check if there are return flights selected
-  if (selectedRoomOptions?.some((ro) => ro.length > 1)) {
-    const roomOptions = ativeOption?.rooms.map((r) =>
-      r.options
-        .filter((o) => o.isSelected)
-        .reverse()
-        .shift()
-    );
-    return roomOptions?.map((ro) => flightMetaData?.find((f) => f.entryLineGuid === ro?.entryLineGuid)?.flightMetaData).filter((f) => f !== undefined) ?? [];
-  }
-  return undefined;
-});
-
-export const selectApiSettings = (state: RootState) => state.apiSettings;
-
-export const selectIsUnavailable = (state: RootState) => state.booking.isUnavailable;
-
-export const selectRequestRooms = (state: RootState) => state.booking.package?.options.find((x) => x.isSelected)?.requestRooms;
-
-export const selectOfficeId = (state: RootState) => state.booking.officeId;
-
-export const selectLanguageCode = (state: RootState) => state.booking.languageCode;
-
-export const selectCurrencyCode = (state: RootState) => state.booking.package?.currencyCode ?? 'EUR';
-
-export const selectDefaultStaticTranslations = (state: RootState) => getTranslations(state.booking.languageCode) as Record<string, any>;
-
-export const selectLanguage = (state: RootState) => state.booking.languageCode;
-
-export const selectAllDynamicTranslations = (state: RootState) => state.booking.translations;
-
-export const selectDynamicTranslations = createSelector([selectAllDynamicTranslations, selectLanguage], (allDynamicTranslations, language) => {
-  return allDynamicTranslations?.find((x) => x.language == language)?.value ?? {};
-});
-
-export const selectTranslations = createSelector(
-  [selectDefaultStaticTranslations, selectDynamicTranslations],
-  (defaultStaticTranslations, dynamicTranslations) => {
-    const merged = {} as Record<string, any>;
-
-    for (const key of Array.from(new Set([...Object.keys(defaultStaticTranslations), ...Object.keys(dynamicTranslations)]))) {
-      merged[key] = {
-        ...(defaultStaticTranslations[key] || {}),
-        ...(dynamicTranslations[key] || {})
-      };
-    }
-
-    return merged;
-  }
-);
-
-export const selectBookingOptions = (state: RootState) => state.booking.bookingOptions;
-
-export const selectBookingType = (state: RootState) => state.booking.bookingType;
-
-export const selectTagIds = (state: RootState) => state.booking.tagIds;
-
-export const selectAgentAdressId = (state: RootState) => state.booking.agentAdressId;
-
-export const selectProductAttributes = (state: RootState) => state.booking.productAttributes;
-
-export const selectBookingAttributes = (state: RootState) => state.booking.bookingAttributes;
-
-export const selectBookingNumber = (state: RootState) => state.booking.bookingNumber;
-
-export const selectIsOption = (state: RootState) => state.booking.isOption;
-
-export const selectBookingRooms = (state: RootState) => state.booking.bookingAttributes?.rooms;
-
-export const selectBookingRemarks = (state: RootState) => state.booking.remarks;
-
-export const selectVoucherCodes = (state: RootState) => state.booking.voucherCodes;
-
-export const selectCalculateDeposit = (state: RootState) => state.booking.calculateDeposit;
-
-export const selectShowCommission = (state: RootState) => state.booking.showCommission;
-
-export const selectIsRetry = (state: RootState) => state.booking.isRetry;
-
-export const selectStartDate = (state: RootState) => state.booking.package?.options.find((x) => x.isSelected)?.fromDate;
-
-export const selectAgents = (state: RootState) => state.booking.agents;
-
-export const selectCountries = (state: RootState) => state.booking.countries;
-
-export const selectProductCode = (state: RootState) => state.booking.productAttributes?.productCode;
-
-export const selectAccommodationCodes = (state: RootState) => {
-  const accommodationCodes: string[] = [];
-  state.booking.package?.options.forEach((o) => {
-    o.rooms.forEach((r) =>
-      r.options.forEach((ro) => {
-        if (!accommodationCodes.some((y) => y === ro.accommodationCode)) {
-          accommodationCodes.push(ro.accommodationCode);
-        }
-      })
-    );
-  });
-  return accommodationCodes;
-};
-
-export const selectAccommodationViews = (state: RootState) => state.booking.accommodationViews;
-
-export const selectBookingQuery = (state: RootState) => {
-  const bookingAttributes = state.booking.bookingAttributes;
-
-  if (!bookingAttributes) {
-    return undefined;
-  }
-
-  const params: Record<string, string> = {};
-  Object.entries(bookingAttributes).forEach(([key, value]) => {
-    if (key === 'startDate' || key === 'endDate') {
-      value = format(parseISO(value), 'yyyy-MM-dd');
-    }
-
-    if (key === 'rooms') {
-      value = JsonURL.stringify(
-        (value as Room[]).map((room) => omit(room, ['children'])),
-        {
-          AQF: true
-        }
-      );
-    }
-
-    if (key === 'allotmentIds' && !value.length) {
-      value = undefined;
-    }
-
-    if (key === 'flight' && value) {
-      var flightInfo = value as FlightInfo;
-      value = JsonURL.stringify(flightInfo, { AQF: true });
-    }
-
-    if (value) {
-      params[key] = value;
-    }
-  });
-
-  return params;
-};
-
-export const selectBookingQueryString = createSelector(selectBookingQuery, (params) => {
-  if (!params) {
-    return undefined;
-  }
-
-  return Object.keys(params)
-    .filter((key) => typeof params[key] !== 'undefined')
-    .map((key) => `${key}=${params[key]}`)
-    .join('&');
-});
-
-export const selectMainBookerId = createSelector(selectTravelersFormValues, (formValues) => formValues?.mainBookerId);
-
-export const selectBookingPackagePax = createSelector(selectTravelersFormValues, (formValues) => {
-  var pax: BookingPackagePax[] = [];
-
-  formValues?.rooms.forEach((r) =>
-    r.adults.forEach((x) => {
-      const adultPax = buildPax(x, formValues?.mainBookerId);
-
-      if (adultPax.isMainBooker) {
-        adultPax.mobilePhone = formValues?.phone;
-        adultPax.email = formValues?.email;
-      }
-
-      pax.push(adultPax);
-    })
-  );
-
-  formValues?.rooms.forEach((r) =>
-    r.children.forEach((x) => {
-      pax.push(buildPax(x));
-    })
-  );
-
-  return pax;
-});
-
-export const selectBookingAddress = createSelector(selectTravelersFormValues, selectBookingPackagePax, selectBookingType, (formValues, pax, bookingType) => {
-  const mainBooker = pax.find((x) => x.isMainBooker);
-  if (!mainBooker || bookingType == 'b2b') return undefined;
-
-  return {
-    name: `${mainBooker.firstName} ${mainBooker.lastName}`,
-    street: formValues?.street,
-    number: formValues?.houseNumber,
-    box: formValues?.box,
-    postalCode: formValues?.zipCode,
-    location: formValues?.place,
-    country: formValues?.country,
-    mobilePhone: formValues?.phone,
-    email: formValues?.email
-  } as BookingPackageAddress;
-});
-
-export const selectBookingPackageRequest = createSelector(selectOfficeId, selectAgentId, selectAgentAdressId, (officeId, agentId, agentAdressId) => {
-  const agencyId = (agentId ?? agentAdressId ?? 0) > 0 ? agentId ?? agentAdressId : null;
-
-  return {
-    officeId: officeId,
-    agentId: agencyId,
-    payload: null
-  } as BookingPackageRequest<any>;
-});
-
-export const selectBookingPackageBookRequest = createSelector(
-  selectBookingPackageRequest,
-  selectBookingOptions,
-  selectBookingType,
-  selectBookingPackagePax,
-  selectBookingAddress,
-  selectPackageDetails,
-  selectCalculateDeposit,
-  selectShowCommission,
-  selectAgentId,
-  selectGeneratePaymentUrl,
-  selectSkipPaymentWithAgent,
-  selectNotifications,
-  selectTagIds,
-  selectBookingRemarks,
-  selectVoucherCodes,
-  (
-    bookingPackageRequest: BookingPackageRequest<BookingPackageBookRequest>,
-    bookingOptions,
-    bookingType,
-    pax,
-    address,
-    packageDetails,
-    calculateDeposit,
-    showCommission,
-    agentId,
-    generatePaymentUrl,
-    skipPaymentWithAgent,
-    notifications,
-    tagIds,
-    remarks,
-    voucherCodes
-  ) => {
-    if (!packageDetails) return null;
-
-    let returnPaymentUrl = false;
-
-    if (generatePaymentUrl && (!skipPaymentWithAgent || (agentId ?? 0) == 0)) {
-      returnPaymentUrl = true;
-    }
-
-    var entryStatus = 0;
-    var customEntryStatusId = undefined;
-
-    switch (bookingType) {
-      case 'b2b':
-        if (bookingOptions.b2b.tagIds && bookingOptions.b2b.tagIds.length > 0) {
-          tagIds = tagIds?.concat(bookingOptions.b2b.tagIds);
-        }
-        if (bookingOptions.b2b.entryStatus) {
-          entryStatus = bookingOptions.b2b.entryStatus;
-        }
-        if (bookingOptions.b2b.customEntryStatusId) {
-          customEntryStatusId = bookingOptions.b2b.customEntryStatusId;
-        }
-        break;
-      case 'b2b2c':
-        if (bookingOptions.b2b2c.tagIds && bookingOptions.b2b2c.tagIds.length > 0) {
-          tagIds = tagIds?.concat(bookingOptions.b2b2c.tagIds);
-        }
-        if (bookingOptions.b2b2c.entryStatus) {
-          entryStatus = bookingOptions.b2b2c.entryStatus;
-        }
-        if (bookingOptions.b2b2c.customEntryStatusId) {
-          customEntryStatusId = bookingOptions.b2b2c.customEntryStatusId;
-        }
-        break;
-      default:
-        if (bookingOptions.b2c.tagIds && bookingOptions.b2c.tagIds.length > 0) {
-          tagIds = tagIds?.concat(bookingOptions.b2c.tagIds);
-        }
-        if (bookingOptions.b2c.entryStatus) {
-          entryStatus = bookingOptions.b2c.entryStatus;
-        }
-        if (bookingOptions.b2c.customEntryStatusId) {
-          customEntryStatusId = bookingOptions.b2c.customEntryStatusId;
-        }
-        break;
-    }
-
-    bookingPackageRequest.payload = {
-      package: packageDetails,
-      status: entryStatus,
-      customStatusId: customEntryStatusId,
-      address: address,
-      pax: pax?.length != 0 ? pax : packageDetails.options[0].requestRooms.flatMap((x) => x.pax),
-      nonTravelPax: [],
-      calculateDeposit: calculateDeposit,
-      showCommission: showCommission,
-      returnPaymentUrl: returnPaymentUrl,
-      notifications: notifications,
-      tagIds: tagIds,
-      remarks: remarks,
-      voucherCodes: voucherCodes,
-      customerRequests: []
-    };
-
-    return bookingPackageRequest;
-  }
-);
-
-export const selectTravelersFirstStep = (state: any) => state.booking.travelersFirstStep;
-
-const buildPax = (traveler: Traveler, mainBookerId?: number) => {
-  return {
-    id: traveler.id,
-    gender: parseGender(traveler.gender),
-    firstName: traveler.firstName,
-    lastName: traveler.lastName,
-    dateOfBirth: traveler.birthDate,
-    age: traveler.birthDate ? null : traveler.age,
-    isMainBooker: traveler.id == mainBookerId
-  } as BookingPackagePax;
-};
-
-const parseGender = (gender: string): number => {
-  switch (gender) {
-    case 'm':
-      return Gender.male;
-    case 'f':
-      return Gender.female;
-    case 'x':
-    default:
-      return Gender.other;
-  }
-};

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

@@ -1,46 +0,0 @@
-import React, { useContext, useEffect } from 'react';
-import { selectBookingNumber, selectBookingQueryString, selectIsOption, selectTranslations } from '../booking/selectors';
-import SettingsContext from '../../settings-context';
-import { useSelector } from 'react-redux';
-import { useAppDispatch } from '../../store';
-import { setCurrentStep } from '../booking/booking-slice';
-import { OPTIONS_FORM_STEP } from '../booking/constants';
-import { useNavigate } from 'react-router';
-import SharedConfirmation from '../../../shared/booking/shared-confirmation';
-
-interface ConfirmationProps {}
-
-const Confirmation: React.FC<ConfirmationProps> = () => {
-  const dispatch = useAppDispatch();
-  const settings = useContext(SettingsContext);
-  const navigate = settings.skipRouter ? () => {} : useNavigate();
-
-  const bookingNumber = useSelector(selectBookingNumber);
-  const bookingQueryString = useSelector(selectBookingQueryString);
-  const isOption = useSelector(selectIsOption);
-  const translations = useSelector(selectTranslations);
-
-  useEffect(() => {
-    if (!bookingNumber) {
-      if (settings.skipRouter) {
-        dispatch(setCurrentStep(OPTIONS_FORM_STEP));
-      } else {
-        navigate(`${!settings.skipBasePathInRouting ? settings.basePath : ''}${settings.error.pathSuffix}?${bookingQueryString}`);
-      }
-    }
-  }, [bookingNumber]);
-
-  return (
-    <SharedConfirmation
-      bookingNumber={bookingNumber}
-      isOption={isOption}
-      isOffer={settings.isOffer}
-      translations={translations.CONFIRMATION}
-      companyContactPhone={settings.companyContactPhone}
-      companyContactEmail={settings.companyContactEmail}
-      homeUrl={settings.basePath || '/'}
-    />
-  );
-};
-
-export default Confirmation;

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

@@ -1,71 +0,0 @@
-import Message from '../../components/message';
-import React from 'react';
-import SettingsContext from '../../settings-context';
-import { setIsRetry } from '../booking/booking-slice';
-import { useContext } from 'react';
-import { useSelector } from 'react-redux';
-import { useAppDispatch } from '../../store';
-import { selectBookingQueryString, selectTranslations } from '../booking/selectors';
-import { useNavigate } from 'react-router-dom';
-
-interface ErrorProps {}
-
-const Error: React.FC<ErrorProps> = () => {
-  const dispatch = useAppDispatch();
-
-  const settings = useContext(SettingsContext);
-  const navigate = settings.skipRouter ? () => {} : useNavigate();
-
-  const bookingQueryString = useSelector(selectBookingQueryString);
-
-  const tryAgainUrl = `${!settings.skipBasePathInRouting ? settings.basePath : ''}?${bookingQueryString}`;
-
-  const handleClick: React.MouseEventHandler<HTMLAnchorElement> = (e) => {
-    e.preventDefault();
-
-    if (settings.skipRouter) {
-      if (window !== undefined) {
-        window.location.reload();
-      }
-    } else {
-      dispatch(setIsRetry(true));
-      navigate(tryAgainUrl);
-    }
-  };
-
-  const translations = useSelector(selectTranslations);
-
-  return (
-    <div className="form form__booking--message">
-      <div className="form__region">
-        <div className="form__row">
-          <div className="form__group">
-            <Message
-              type="error"
-              title="Er liep iets mis..."
-              actionComponent={
-                <a onClick={handleClick} title={translations.ERROR.TRY_AGAIN} className="cta">
-                  {translations.ERROR.TRY_AGAIN}
-                </a>
-              }>
-              <p>
-                {translations.ERROR.MESSAGE_TEXT1}
-                <br />
-                {translations.ERROR.MESSAGE_TEXT2}
-              </p>
-              <p>
-                {translations.ERROR.ERROR_TEXT1}
-                <a href={`mailto:${settings.companyContactEmail}?subject=Boeking%20mislukt`} title={translations.ERROR.ERROR_ALT}>
-                  {translations.ERROR.ERROR_TEXT2}
-                </a>
-                {translations.ERROR.ERROR_TEXT3}
-              </p>
-            </Message>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default Error;