@qite/tide-booking-component 1.0.0 → 1.0.2

package/build/build-cjs/index.js

@@ -7235,22 +7235,12 @@ var selectRequestRooms = function (state) {
 var selectOfficeId = function (state) {
   return state.booking.officeId;
 };
-var selectEntryStatus = function (state) {
-  return state.booking.entryStatus;
-};
-var selectCustomEntryStatusId = function (state) {
-  return state.booking.customEntryStatusId;
-};
 var selectBookingOptions = function (state) {
   return state.booking.bookingOptions;
 };
 var selectBookingType = function (state) {
   return state.booking.bookingType;
 };
-// export const selectB2BEntryStatus = (state: RootState) =>
-//   state.booking.b2bEntryStatus;
-// export const selectB2BCustomEntryStatusId = (state: RootState) =>
-//   state.booking.b2bCustomEntryStatusId;
 var selectTagIds = function (state) {
   return state.booking.tagIds;
 };
@@ -7446,12 +7436,8 @@ var selectBookingPackageRequest = toolkit.createSelector(
 );
 var selectBookingPackageBookRequest = toolkit.createSelector(
   selectBookingPackageRequest,
-  selectEntryStatus,
-  selectCustomEntryStatusId,
   selectBookingOptions,
   selectBookingType,
-  // selectB2BEntryStatus,
-  // selectB2BCustomEntryStatusId,
   selectBookingPackagePax,
   selectBookingAddress,
   selectPackageDetails,
@@ -7465,12 +7451,8 @@ var selectBookingPackageBookRequest = toolkit.createSelector(
   selectVoucherCodes,
   function (
     bookingPackageRequest,
-    entryStatus,
-    customEntryStatusId,
     bookingOptions,
     bookingType,
-    // b2bEntryStatus,
-    // b2bCustomEntryStatusId,
     pax,
     address,
     packageDetails,
@@ -7483,32 +7465,7 @@ var selectBookingPackageBookRequest = toolkit.createSelector(
     remarks,
     voucherCodes
   ) {
-    var _a,
-      _b,
-      _c,
-      _d,
-      _e,
-      _f,
-      _g,
-      _h,
-      _j,
-      _k,
-      _l,
-      _m,
-      _o,
-      _p,
-      _q,
-      _r,
-      _s,
-      _t,
-      _u,
-      _v,
-      _w;
-    if (
-      !packageDetails ||
-      (pax === null || pax === void 0 ? void 0 : pax.length) == 0
-    )
-      return null;
+    if (!packageDetails) return null;
     var returnPaymentUrl = false;
     if (
       generatePaymentUrl &&
@@ -7517,188 +7474,52 @@ var selectBookingPackageBookRequest = toolkit.createSelector(
     ) {
       returnPaymentUrl = true;
     }
-    console.log("bookingType", bookingType);
-    console.log("bookingPackageRequest.agentId", bookingPackageRequest.agentId);
-    console.log("bookingOptions", bookingOptions);
+    var entryStatus = 0;
+    var customEntryStatusId = undefined;
     switch (bookingType) {
-      case "b2c":
-        if (
-          ((_a =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2c) === null || _a === void 0
-            ? void 0
-            : _a.tagIds) &&
-          ((_b =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2c) === null || _b === void 0
-            ? void 0
-            : _b.tagIds.length) > 0
-        ) {
+      case "b2b":
+        if (bookingOptions.b2b.tagIds && bookingOptions.b2b.tagIds.length > 0) {
           tagIds =
             tagIds === null || tagIds === void 0
               ? void 0
-              : tagIds.concat(
-                  (_c =
-                    bookingOptions === null || bookingOptions === void 0
-                      ? void 0
-                      : bookingOptions.b2c) === null || _c === void 0
-                    ? void 0
-                    : _c.tagIds
-                );
+              : tagIds.concat(bookingOptions.b2b.tagIds);
         }
-        if (
-          (_d =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2c) === null || _d === void 0
-            ? void 0
-            : _d.entryStatus
-        ) {
-          entryStatus =
-            (_e =
-              bookingOptions === null || bookingOptions === void 0
-                ? void 0
-                : bookingOptions.b2c) === null || _e === void 0
-              ? void 0
-              : _e.entryStatus;
+        if (bookingOptions.b2b.entryStatus) {
+          entryStatus = bookingOptions.b2b.entryStatus;
         }
-        if (
-          (_f =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2c) === null || _f === void 0
-            ? void 0
-            : _f.customEntryStatusId
-        ) {
-          customEntryStatusId =
-            (_g =
-              bookingOptions === null || bookingOptions === void 0
-                ? void 0
-                : bookingOptions.b2c) === null || _g === void 0
-              ? void 0
-              : _g.customEntryStatusId;
+        if (bookingOptions.b2b.customEntryStatusId) {
+          customEntryStatusId = bookingOptions.b2b.customEntryStatusId;
         }
         break;
-      case "b2b":
+      case "b2b2c":
         if (
-          ((_h =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2b) === null || _h === void 0
-            ? void 0
-            : _h.tagIds) &&
-          ((_j =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2b) === null || _j === void 0
-            ? void 0
-            : _j.tagIds.length) > 0
+          bookingOptions.b2b2c.tagIds &&
+          bookingOptions.b2b2c.tagIds.length > 0
         ) {
           tagIds =
             tagIds === null || tagIds === void 0
               ? void 0
-              : tagIds.concat(
-                  (_k =
-                    bookingOptions === null || bookingOptions === void 0
-                      ? void 0
-                      : bookingOptions.b2b) === null || _k === void 0
-                    ? void 0
-                    : _k.tagIds
-                );
+              : tagIds.concat(bookingOptions.b2b2c.tagIds);
         }
-        if (
-          (_l =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2b) === null || _l === void 0
-            ? void 0
-            : _l.entryStatus
-        ) {
-          entryStatus =
-            (_m =
-              bookingOptions === null || bookingOptions === void 0
-                ? void 0
-                : bookingOptions.b2b) === null || _m === void 0
-              ? void 0
-              : _m.entryStatus;
+        if (bookingOptions.b2b2c.entryStatus) {
+          entryStatus = bookingOptions.b2b2c.entryStatus;
         }
-        if (
-          (_o =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2b) === null || _o === void 0
-            ? void 0
-            : _o.customEntryStatusId
-        ) {
-          customEntryStatusId =
-            (_p =
-              bookingOptions === null || bookingOptions === void 0
-                ? void 0
-                : bookingOptions.b2b) === null || _p === void 0
-              ? void 0
-              : _p.customEntryStatusId;
+        if (bookingOptions.b2b2c.customEntryStatusId) {
+          customEntryStatusId = bookingOptions.b2b2c.customEntryStatusId;
         }
         break;
-      case "b2b2c":
-        if (
-          ((_q =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2b2c) === null || _q === void 0
-            ? void 0
-            : _q.tagIds) &&
-          ((_r =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2b2c) === null || _r === void 0
-            ? void 0
-            : _r.tagIds.length) > 0
-        ) {
+      default:
+        if (bookingOptions.b2c.tagIds && bookingOptions.b2c.tagIds.length > 0) {
           tagIds =
             tagIds === null || tagIds === void 0
               ? void 0
-              : tagIds.concat(
-                  (_s =
-                    bookingOptions === null || bookingOptions === void 0
-                      ? void 0
-                      : bookingOptions.b2b2c) === null || _s === void 0
-                    ? void 0
-                    : _s.tagIds
-                );
+              : tagIds.concat(bookingOptions.b2c.tagIds);
         }
-        if (
-          (_t =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2b2c) === null || _t === void 0
-            ? void 0
-            : _t.entryStatus
-        ) {
-          entryStatus =
-            (_u =
-              bookingOptions === null || bookingOptions === void 0
-                ? void 0
-                : bookingOptions.b2b2c) === null || _u === void 0
-              ? void 0
-              : _u.entryStatus;
+        if (bookingOptions.b2c.entryStatus) {
+          entryStatus = bookingOptions.b2c.entryStatus;
         }
-        if (
-          (_v =
-            bookingOptions === null || bookingOptions === void 0
-              ? void 0
-              : bookingOptions.b2b2c) === null || _v === void 0
-            ? void 0
-            : _v.customEntryStatusId
-        ) {
-          customEntryStatusId =
-            (_w =
-              bookingOptions === null || bookingOptions === void 0
-                ? void 0
-                : bookingOptions.b2b2c) === null || _w === void 0
-              ? void 0
-              : _w.customEntryStatusId;
+        if (bookingOptions.b2c.customEntryStatusId) {
+          customEntryStatusId = bookingOptions.b2c.customEntryStatusId;
         }
         break;
     }
@@ -7707,7 +7528,12 @@ var selectBookingPackageBookRequest = toolkit.createSelector(
       status: entryStatus,
       customStatusId: customEntryStatusId,
       address: address,
-      pax: pax,
+      pax:
+        (pax === null || pax === void 0 ? void 0 : pax.length) != 0
+          ? pax
+          : packageDetails.options[0].requestRooms.flatMap(function (x) {
+              return x.pax;
+            }),
       nonTravelPax: [],
       calculateDeposit: calculateDeposit,
       returnPaymentUrl: returnPaymentUrl,
@@ -7716,7 +7542,6 @@ var selectBookingPackageBookRequest = toolkit.createSelector(
       remarks: remarks,
       voucherCodes: voucherCodes,
     };
-    console.log("bookingPackageRequest", bookingPackageRequest);
     return bookingPackageRequest;
   }
 );
@@ -7796,28 +7621,24 @@ var packageApi = {
 var _a;
 var initialState$1 = {
   officeId: 1,
-  entryStatus: 0,
-  customEntryStatusId: undefined,
   bookingOptions: {
     b2b: {
-      tagIds: [9],
+      tagIds: [],
       entryStatus: 2,
       customEntryStatusId: undefined,
     },
     b2b2c: {
-      tagIds: [11],
+      tagIds: [],
       entryStatus: 2,
       customEntryStatusId: undefined,
     },
     b2c: {
-      tagIds: [10],
+      tagIds: [],
       entryStatus: 0,
       customEntryStatusId: undefined,
     },
   },
   bookingType: "b2c",
-  // b2bEntryStatus: 2,
-  // b2bCustomEntryStatusId: undefined,
   productAttributes: undefined,
   bookingAttributes: undefined,
   calculateDeposit: false,
@@ -7966,27 +7787,12 @@ var bookingSlice = toolkit.createSlice({
     setOfficeId: function (state, action) {
       state.officeId = action.payload;
     },
-    setEntryStatus: function (state, action) {
-      state.entryStatus = action.payload;
-    },
-    setCustomEntryStatusId: function (state, action) {
-      state.customEntryStatusId = action.payload;
-    },
     setBookingOptions: function (state, action) {
       state.bookingOptions = action.payload;
     },
     setBookingType: function (state, action) {
       state.bookingType = action.payload;
     },
-    // setB2BEntryStatus(state, action: PayloadAction<number>) {
-    //   state.b2bEntryStatus = action.payload;
-    // },
-    // setB2BCustomEntryStatusId(
-    //   state,
-    //   action: PayloadAction<number | undefined>
-    // ) {
-    //   state.b2bCustomEntryStatusId = action.payload;
-    // },
     setProductAttributes: function (state, action) {
       state.productAttributes = action.payload;
     },
@@ -8101,12 +7907,8 @@ var bookingSlice = toolkit.createSlice({
   },
 });
 var setOfficeId = ((_a = bookingSlice.actions), _a.setOfficeId),
-  setEntryStatus = _a.setEntryStatus,
-  setCustomEntryStatusId = _a.setCustomEntryStatusId,
   setBookingOptions = _a.setBookingOptions,
   setBookingType = _a.setBookingType,
-  // setB2BEntryStatus,
-  // setB2BCustomEntryStatusId,
   setProductAttributes = _a.setProductAttributes,
   setBookingAttributes = _a.setBookingAttributes,
   setCalculateDeposit = _a.setCalculateDeposit,
@@ -8161,10 +7963,6 @@ var SettingsContext = React__default["default"].createContext({
   generatePaymentUrl: false,
   currency: "EUR",
   officeId: 1,
-  entryStatus: 0,
-  customEntryStatusId: null,
-  // b2bEntryStatus: 2,
-  // b2bCustomEntryStatusId: null,
   tagIds: [],
   hideAgentSelection: false,
   agentAdressId: undefined,
@@ -8172,7 +7970,10 @@ var SettingsContext = React__default["default"].createContext({
   productPath: "/",
   basePath: "/boeken",
   options: {
-    pathSuffix: "/opties",
+    pathSuffix: "/",
+  },
+  travellers: {
+    pathSuffix: "/travellers",
   },
   summary: {
     pathSuffix: "/samenvatting",
@@ -8193,9 +7994,15 @@ var SettingsContext = React__default["default"].createContext({
   loaderComponent: null,
   icons: null,
   bookingOptions: {
-    b2b: undefined,
-    b2b2c: undefined,
-    b2c: undefined,
+    b2b: {
+      entryStatus: 0,
+    },
+    b2b2c: {
+      entryStatus: 0,
+    },
+    b2c: {
+      entryStatus: 0,
+    },
   },
 });
 
@@ -8774,6 +8581,7 @@ var OptionRoom = function (_a) {
   var _b, _c, _d, _e, _f;
   var packageRoom = _a.packageRoom,
     pax = _a.pax,
+    optionPax = _a.optionPax,
     onRoomChange = _a.onRoomChange;
   var selectedOption =
     packageRoom === null || packageRoom === void 0
@@ -8962,6 +8770,28 @@ var OptionRoom = function (_a) {
       return "";
     }
   };
+  var getPaxName = function (id) {
+    var item = pax.find(function (x) {
+      return x.id === id;
+    });
+    if (
+      !(item === null || item === void 0 ? void 0 : item.firstName) &&
+      !(item === null || item === void 0 ? void 0 : item.lastName)
+    ) {
+      var optionPaxItem =
+        optionPax === null || optionPax === void 0
+          ? void 0
+          : optionPax.find(function (x) {
+              return x.id === id;
+            });
+      return optionPaxItem === null || optionPaxItem === void 0
+        ? void 0
+        : optionPaxItem.paxName;
+    }
+    return ""
+      .concat(item === null || item === void 0 ? void 0 : item.firstName, " ")
+      .concat(item === null || item === void 0 ? void 0 : item.lastName[0]);
+  };
   return React__default["default"].createElement(
     "tr",
     null,
@@ -9067,10 +8897,7 @@ var OptionRoom = function (_a) {
                                 },
                                 i > 0 && ", ",
                                 " ",
-                                p.firstName,
-                                " ",
-                                p.lastName[0],
-                                "."
+                                getPaxName(p.id)
                               );
                             })
                           )
@@ -9825,6 +9652,7 @@ var OptionPaxGroup = function (_a) {
 
 var OptionPaxCard = function (_a) {
   var pax = _a.pax,
+    requestRoomsPax = _a.requestRoomsPax,
     parentIndex = _a.parentIndex,
     onPaxChange = _a.onPaxChange;
   var _b = React.useState(),
@@ -9843,10 +9671,18 @@ var OptionPaxCard = function (_a) {
     [pax, toggleStates, setToggleStates]
   );
   var bookingPax = reactRedux.useSelector(selectBookingPackagePax);
-  var getPaxName = function (id) {
+  var getPaxName = function (bookingOptionPax) {
     var item = bookingPax.find(function (x) {
-      return x.id === id;
+      return x.id === bookingOptionPax.id;
     });
+    if (
+      !(item === null || item === void 0 ? void 0 : item.firstName) &&
+      !(item === null || item === void 0 ? void 0 : item.lastName)
+    ) {
+      return bookingOptionPax === null || bookingOptionPax === void 0
+        ? void 0
+        : bookingOptionPax.paxName;
+    }
     return ""
       .concat(item === null || item === void 0 ? void 0 : item.firstName, " ")
       .concat(item === null || item === void 0 ? void 0 : item.lastName);
@@ -9867,6 +9703,7 @@ var OptionPaxCard = function (_a) {
     React__default["default"].Fragment,
     null,
     pax.map(function (p, i) {
+      var _a, _b;
       return React__default["default"].createElement(
         "div",
         {
@@ -9882,8 +9719,27 @@ var OptionPaxCard = function (_a) {
           React__default["default"].createElement(
             "h3",
             { className: "booking-card__body-heading" },
-            getPaxName(p.id)
+            getPaxName(p)
           ),
+          ((_a =
+            requestRoomsPax === null || requestRoomsPax === void 0
+              ? void 0
+              : requestRoomsPax.find(function (x) {
+                  return x.id == p.id;
+                })) === null || _a === void 0
+            ? void 0
+            : _a.age) &&
+            React__default["default"].createElement(
+              "p",
+              { className: "form__region-label" },
+              ((_b = requestRoomsPax.find(function (x) {
+                return x.id == p.id;
+              })) === null || _b === void 0
+                ? void 0
+                : _b.age) > CHILD_MAX_AGE
+                ? translations.TRAVELERS_FORM.ADULT
+                : translations.TRAVELERS_FORM.CHILD
+            ),
           React__default["default"].createElement(
             "div",
             { className: "booking-card__actions" },
@@ -10409,11 +10265,16 @@ var OptionBookingGroup = function (_a) {
 var OptionsForm = function () {
   var _a = React.useContext(SettingsContext),
     basePath = _a.basePath,
-    summary = _a.summary,
+    travellers = _a.travellers,
     loaderComponent = _a.loaderComponent;
   var dispatch = useAppDispatch();
-  var travelerFormValues = reactRedux.useSelector(selectTravelersFormValues);
   var requestRooms = reactRedux.useSelector(selectRequestRooms);
+  var requestRoomsPax =
+    requestRooms === null || requestRooms === void 0
+      ? void 0
+      : requestRooms.flatMap(function (x) {
+          return x.pax;
+        });
   var pax = reactRedux.useSelector(selectBookingPackagePax);
   var packageRooms = reactRedux.useSelector(selectPackageRooms);
   var bookingQueryString = reactRedux.useSelector(selectBookingQueryString);
@@ -10421,29 +10282,36 @@ var OptionsForm = function () {
   var groups = reactRedux.useSelector(selectPackageGroups);
   var optionUnits = reactRedux.useSelector(selectPackageOptionUnits);
   var optionPax = reactRedux.useSelector(selectPackageOptionPax);
-  if (!travelerFormValues || !packageRooms) {
+  if (!packageRooms) {
     router.navigate("".concat(basePath, "?").concat(bookingQueryString));
   }
   var getRoomPax = function (index) {
+    var _a;
     var room =
       requestRooms === null || requestRooms === void 0
         ? void 0
         : requestRooms.find(function (x) {
             return x.index == index;
           });
-    return pax.filter(function (x) {
+    var bookingPackagePax = pax.filter(function (x) {
       return room === null || room === void 0
         ? void 0
         : room.pax.some(function (y) {
             return y.id == x.id;
           });
     });
+    return bookingPackagePax.length > 0
+      ? bookingPackagePax
+      : (_a = room === null || room === void 0 ? void 0 : room.pax) !== null &&
+        _a !== void 0
+      ? _a
+      : [];
   };
   var handleSubmit = function (e) {
     router.navigate(
       ""
         .concat(basePath)
-        .concat(summary.pathSuffix, "?")
+        .concat(travellers.pathSuffix, "?")
         .concat(bookingQueryString)
     );
     e.preventDefault();
@@ -10541,6 +10409,7 @@ var OptionsForm = function () {
                                 key: room.index,
                                 packageRoom: room,
                                 pax: getRoomPax(room.index),
+                                optionPax: optionPax,
                                 onRoomChange: handleOnRoomChange,
                               }
                             );
@@ -10602,6 +10471,7 @@ var OptionsForm = function () {
                   React__default["default"].createElement(OptionPaxCard, {
                     pax: optionPax,
                     onPaxChange: handleOnPaxChange,
+                    requestRoomsPax: requestRoomsPax,
                   })
                 )
               )
@@ -11384,7 +11254,7 @@ var StepIndicators = function (_a) {
     React__default["default"].createElement(
       "div",
       { className: "step-indicators__items" },
-      ["Persoonlijke gegevens", "Samenstellen", "Overzicht", "Bevestiging"].map(
+      ["Samenstellen", "Persoonlijke gegevens", "Overzicht", "Bevestiging"].map(
         function (stepName, index) {
           return React__default["default"].createElement(
             "div",
@@ -12821,7 +12691,7 @@ var validateForm = function (values, agentRequired) {
         lodash.set(
           errors,
           "children[".concat(index, "].birthDate"),
-          "Reiziger ".concat(index + 1, ": is geen kind")
+          "Reiziger ".concat(values.adults.length + index + 1, ": is geen kind")
         );
       }
     }
@@ -13011,7 +12881,6 @@ var TravelersForm = function () {
   var childIds = reactRedux.useSelector(selectChildIds);
   var agents = reactRedux.useSelector(selectAgents);
   var agentAdressId = reactRedux.useSelector(selectAgentAdressId);
-  console.log("agentAdressId", agentAdressId);
   var initialValues =
     (_a = reactRedux.useSelector(selectTravelersFormValues)) !== null &&
     _a !== void 0
@@ -13062,7 +12931,7 @@ var TravelersForm = function () {
       router.navigate(
         ""
           .concat(settings.basePath)
-          .concat(settings.options.pathSuffix, "?")
+          .concat(settings.summary.pathSuffix, "?")
           .concat(bookingQueryString)
       );
     },
@@ -13172,6 +13041,7 @@ var TravelersForm = function () {
   var handleAgentClear = function () {
     formik$1.setFieldValue("travelAgentId", 0);
     formik$1.setFieldValue("travelAgentName", "");
+    dispatch(setBookingType("b2c"));
   };
   var toggleAgent = function (value) {
     setShowAgents(value);
@@ -13801,13 +13671,10 @@ var Booking = function (_a) {
     thumbnailUrl = _a.thumbnailUrl;
   var _b = React.useContext(SettingsContext),
     officeId = _b.officeId,
-    entryStatus = _b.entryStatus,
-    customEntryStatusId = _b.customEntryStatusId,
     bookingOptions = _b.bookingOptions,
-    // b2bEntryStatus,
-    // b2bCustomEntryStatusId,
     basePath = _b.basePath,
     options = _b.options,
+    travellers = _b.travellers,
     summary = _b.summary,
     confirmation = _b.confirmation,
     error = _b.error,
@@ -13942,23 +13809,7 @@ var Booking = function (_a) {
   React.useEffect(
     function () {
       dispatch(setOfficeId(officeId));
-      dispatch(setEntryStatus(entryStatus));
-      dispatch(
-        setCustomEntryStatusId(
-          customEntryStatusId !== null && customEntryStatusId !== void 0
-            ? customEntryStatusId
-            : undefined
-        )
-      );
-      dispatch(
-        setBookingOptions(
-          bookingOptions !== null && bookingOptions !== void 0
-            ? bookingOptions
-            : undefined
-        )
-      );
-      // dispatch(setB2BEntryStatus(b2bEntryStatus));
-      // dispatch(setB2BCustomEntryStatusId(b2bCustomEntryStatusId ?? undefined));
+      dispatch(setBookingOptions(bookingOptions));
       dispatch(setCalculateDeposit(showSidebarDeposit));
       dispatch(
         setTagIds(tagIds !== null && tagIds !== void 0 ? tagIds : undefined)
@@ -13976,15 +13827,9 @@ var Booking = function (_a) {
     },
     [
       officeId,
-      entryStatus,
-      customEntryStatusId,
       bookingOptions,
-      // b2bEntryStatus,
-      // b2bCustomEntryStatusId,
       showSidebarDeposit,
       setOfficeId,
-      setEntryStatus,
-      setCustomEntryStatusId,
       setCalculateDeposit,
       tagIds,
       agentAdressId,
@@ -14027,20 +13872,20 @@ var Booking = function (_a) {
               router.Router,
               { basepath: basePath },
               React__default["default"].createElement(StepRoute, {
-                path: "/",
+                path: options.pathSuffix,
                 number: 1,
-                title: translations.STEPS.PERSONAL_DETAILS,
+                title: translations.STEPS.TRAVEL_OPTIONS,
                 component: React__default["default"].createElement(
-                  TravelersForm,
+                  OptionsForm,
                   null
                 ),
               }),
               React__default["default"].createElement(StepRoute, {
-                path: options.pathSuffix,
+                path: travellers.pathSuffix,
                 number: 2,
-                title: translations.STEPS.TRAVEL_OPTIONS,
+                title: translations.STEPS.PERSONAL_DETAILS,
                 component: React__default["default"].createElement(
-                  OptionsForm,
+                  TravelersForm,
                   null
                 ),
               }),