thm-p3-configurator 0.0.56 → 0.0.58

package/dist/src/shared/__api__/authenticatedProxyApi.js

@@ -50,9 +50,18 @@ const authenticatedProxyApi = exports.authenticatedProxyApi = {
   getMyProfile: () => authenticateClient('api/v1/profile', {
     method: 'GET'
   }),
+  getBranchTypes: () => authenticateClient("api/v1/branch-types", {
+    method: 'GET'
+  }),
   getMyBranchesByFormula: formula => authenticateClient("api/v1/profile/".concat(formula, "/branches"), {
     method: 'GET'
   }),
+  getSingleOrderBranchTypes: branchTypesParamsString => authenticateClient("api/v1/branch-types?".concat(branchTypesParamsString), {
+    method: 'GET'
+  }),
+  getSingleOrderBranches: branchesParamsString => authenticateClient("api/v1/branches?".concat(branchesParamsString), {
+    method: 'GET'
+  }),
   getBranchById: id => authenticateClient("api/v1/branches/".concat(id), {
     method: 'GET'
   }),

package/dist/src/shared/__api__/mutations.js

@@ -101,7 +101,9 @@ const useCreateSingleOrderMutation = () => {
       customer,
       formula,
       branchId,
-      channel
+      channel,
+      preferredDateTime,
+      internalNote
     } = _ref3;
     return _authenticatedProxyApi.authenticatedProxyApi.postSingleOrder({
       licensePlate,
@@ -110,7 +112,9 @@ const useCreateSingleOrderMutation = () => {
       customer,
       formula,
       branchId,
-      channel
+      channel,
+      preferredDateTime,
+      internalNote
     });
   });
   return {

package/dist/src/shared/__api__/orderApi.js

@@ -1,11 +1,9 @@
 "use strict";
 
-require("core-js/modules/es.promise.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.orderApi = void 0;
-require("core-js/modules/es.promise.js");
 var _axios = _interopRequireDefault(require("axios"));
 var _index = require("../__constants__/index.js");
 var _LocalStorageWorker = require("../__services__/LocalStorageWorker.js");
@@ -31,18 +29,6 @@ orderClient.interceptors.request.use(config => {
   config.headers.Authorization = "Bearer ".concat(authSession === null || authSession === void 0 ? void 0 : authSession.accessToken);
   return config;
 });
-
-// Add response interceptor to log 4xx errors
-orderClient.interceptors.response.use(response => response, error => {
-  if (error.response && error.response.status >= 400 && error.response.status < 500) {
-    console.error('4xx Error Response:', {
-      status: error.response.status,
-      url: error.config.url,
-      data: error.response.data
-    });
-  }
-  return Promise.reject(error);
-});
 const orderApi = exports.orderApi = {
   getOrder: orderParameters => orderClient("api".concat(APP_CONFIG.internal ? '' : '/public', "/order?").concat(orderParameters) // Remove the `/public` param if the configurator is internal,
   ),

package/dist/src/shared/__api__/queries.js

@@ -16,7 +16,7 @@ require("core-js/modules/esnext.iterator.for-each.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useSingleOrderCart = exports.useSingleOrderArticles = exports.useQuestionsQuery = exports.useProductsQuery = exports.useProductFieldLabels = exports.usePrivateDossierByTypeAndIdQuery = exports.useMyBranches = exports.useModelsQuery = exports.useMarketingChannels = exports.useBuildYearsQuery = exports.useBrandsQuery = exports.useBranchesQuery = exports.useBranchTypes = exports.useBranchByIdOrWidgetId = exports.useArticleTypes = exports.useArticleSubGroups = exports.useArticleGroups = exports.useActiveDiscounts = void 0;
+exports.useSingleOrderCart = exports.useSingleOrderBranchesQuery = exports.useSingleOrderBranchTypes = exports.useSingleOrderArticles = exports.useQuestionsQuery = exports.useProductsQuery = exports.useProductFieldLabels = exports.usePrivateDossierByTypeAndIdQuery = exports.useMyBranches = exports.useModelsQuery = exports.useMarketingChannels = exports.useBuildYearsQuery = exports.useBrandsQuery = exports.useBranchesQuery = exports.useBranchTypes = exports.useBranchByIdOrWidgetId = exports.useArticleTypes = exports.useArticleSubGroups = exports.useArticleGroups = exports.useActiveDiscounts = void 0;
 require("core-js/modules/es.symbol.description.js");
 require("core-js/modules/es.json.stringify.js");
 require("core-js/modules/es.object.from-entries.js");
@@ -430,14 +430,30 @@ const useQuestionsQuery = questionParams => {
     durationQuestion: (_questionsQuery$data$3 = questionsQuery === null || questionsQuery === void 0 || (_questionsQuery$data6 = questionsQuery.data) === null || _questionsQuery$data6 === void 0 ? void 0 : _questionsQuery$data6.durationQuestion) !== null && _questionsQuery$data$3 !== void 0 ? _questionsQuery$data$3 : []
   };
 };
-
+exports.useQuestionsQuery = useQuestionsQuery;
+const useSingleOrderBranchesQuery = branchesParams => {
+  var _branchesParams;
+  branchesParams = _objectSpread(_objectSpread({}, branchesParams), {}, {
+    type: 'single-order'
+  });
+  const branchesParamsString = new URLSearchParams((0, _helpers__.removeNullishProps)(branchesParams)).toString();
+  const branchesQuery = (0, _reactQuery.useQuery)(['single-order-branches', branchesParamsString], {
+    queryFn: () => _authenticatedProxyApi.authenticatedProxyApi.getSingleOrderBranches(branchesParamsString).then(res => res.data),
+    enabled: !!((_branchesParams = branchesParams) !== null && _branchesParams !== void 0 && _branchesParams.branchTypeId)
+  });
+  return {
+    isLoadingSingleOrderBranches: branchesQuery.isLoading,
+    isSingleOrderBranchesError: branchesQuery.isError,
+    singleOrderBranches: branchesQuery === null || branchesQuery === void 0 ? void 0 : branchesQuery.data
+  };
+};
 /**
  * @description Retrieves the branches
  */
-exports.useQuestionsQuery = useQuestionsQuery;
+exports.useSingleOrderBranchesQuery = useSingleOrderBranchesQuery;
 const useBranchesQuery = branchesParams => {
   const branchesParamsString = new URLSearchParams((0, _helpers__.removeNullishProps)(branchesParams)).toString();
-  const branchesQuery = (0, _reactQuery.useQuery)(['branches', branchesParamsString], {
+  const branchesQuery = (0, _reactQuery.useQuery)(['branches-test', branchesParamsString], {
     queryFn: () => _publicProxyApi.publicProxyApi.getBranches(branchesParamsString).then(res => res.data)
   });
   return {
@@ -481,11 +497,26 @@ const useMyBranches = formula => {
     myBranches: (_myBranchesQuery$data = myBranchesQuery === null || myBranchesQuery === void 0 ? void 0 : myBranchesQuery.data) !== null && _myBranchesQuery$data !== void 0 ? _myBranchesQuery$data : []
   };
 };
-
+exports.useMyBranches = useMyBranches;
+const useSingleOrderBranchTypes = branchTypesParams => {
+  branchTypesParams = _objectSpread(_objectSpread({}, branchTypesParams), {}, {
+    type: 'single-order'
+  });
+  const branchTypesParamsString = new URLSearchParams((0, _helpers__.removeNullishProps)(branchTypesParams)).toString();
+  const singleOrderBranchTypesQuery = (0, _reactQuery.useQuery)({
+    queryKey: ['single-order-branch-types', branchTypesParamsString],
+    queryFn: () => _authenticatedProxyApi.authenticatedProxyApi.getSingleOrderBranchTypes(branchTypesParamsString).then(res => res.data)
+  });
+  return {
+    isLoadingSingleOrderBranchTypes: singleOrderBranchTypesQuery.isLoading,
+    singleOrderBranchTypesError: singleOrderBranchTypesQuery.isError,
+    singleOrderBranchTypes: singleOrderBranchTypesQuery === null || singleOrderBranchTypesQuery === void 0 ? void 0 : singleOrderBranchTypesQuery.data
+  };
+};
 /**
  * @description Query the branch type mappings from hyper, returns the value normalized
  */
-exports.useMyBranches = useMyBranches;
+exports.useSingleOrderBranchTypes = useSingleOrderBranchTypes;
 const useBranchTypes = () => {
   var _branchTypesQuery$dat;
   const branchTypesQuery = (0, _reactQuery.useQuery)({

package/dist/src/shared/__components__/Buttons/LinkButton.js

@@ -40,10 +40,11 @@ const LinkButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     type = 'button',
     isDisabled,
     onClick,
-    label
+    label,
+    className = ''
   } = _ref;
   return /*#__PURE__*/_react.default.createElement("button", {
-    className: (0, _helpers__.withStyle)("btn btn-link p-0"),
+    className: (0, _helpers__.withStyle)("btn btn-link p-0 ".concat(className)),
     type: type,
     ref: ref,
     disabled: isDisabled,

package/dist/src/shared/__components__/Form/DropdownInput.js

@@ -95,7 +95,7 @@ function _toPrimitive(t, r) {
 }
 const DropdownInput = _ref => {
   let {
-    options,
+    options = [],
     name,
     label,
     isRequired,
@@ -110,21 +110,25 @@ const DropdownInput = _ref => {
     isClearable = false
   } = _ref;
   const [value, setValue] = (0, _react.useState)(() => {
-    if (initialValue) {
-      const matchingOption = options.find(opt => opt.value === initialValue);
-      return matchingOption || null;
+    if (!initialValue || !(options !== null && options !== void 0 && options.length)) return null;
+    if (typeof initialValue === 'object' && initialValue.value && initialValue.label) {
+      return initialValue;
     }
-    return null;
+    return options.find(opt => opt.value === initialValue) || null;
   });
   const lgSize = window.matchMedia('(min-width: 960px)');
   const xxlSize = window.matchMedia('(min-width: 1440px)');
   (0, _react.useEffect)(() => {
-    if (initialValue === '' || initialValue === null) {
+    if (!initialValue || !(options !== null && options !== void 0 && options.length)) {
       setValue(null);
-    } else {
-      const matchingOption = options.find(opt => opt.value === initialValue);
-      setValue(matchingOption || null);
+      return;
     }
+    if (typeof initialValue === 'object' && initialValue.value && initialValue.label) {
+      setValue(initialValue);
+      return;
+    }
+    const matchingOption = options.find(opt => opt.value === initialValue);
+    setValue(matchingOption || null);
   }, [initialValue, options]);
   const handleChange = option => {
     setValue(option);

package/dist/src/shared/__components__/Header.js

@@ -17,7 +17,8 @@ function _interopRequireDefault(e) {
 }
 const Header = _ref => {
   let {
-    title
+    title,
+    subtitle = ''
   } = _ref;
   const formula = (0, _FormulaContext.useFormula)();
   return /*#__PURE__*/_react.default.createElement("div", {
@@ -34,6 +35,8 @@ const Header = _ref => {
     alt: "Trekhaak Montage"
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('hero__inner d-none d-lg-block')
-  }, /*#__PURE__*/_react.default.createElement("h2", null, (title === null || title === void 0 ? void 0 : title.length) > 0 ? title : 'Trekhaak offerte opstellen'))))));
+  }, /*#__PURE__*/_react.default.createElement("h2", null, (title === null || title === void 0 ? void 0 : title.length) > 0 ? title : 'Trekhaak offerte opstellen'), (subtitle === null || subtitle === void 0 ? void 0 : subtitle.length) > 0 && /*#__PURE__*/_react.default.createElement("p", {
+    className: (0, _helpers__.withStyle)('hero__subtitle')
+  }, subtitle))))));
 };
 var _default = exports.default = Header;

package/dist/src/shared/__components__/internal/InternalCustomerDetailsForm.js

@@ -29,8 +29,11 @@ var _helpers__ = require("../../__helpers__");
 var _LocalStorageWorker = require("../../__services__/LocalStorageWorker");
 var _LinkButton = _interopRequireDefault(require("../Buttons/LinkButton"));
 var _CardWide = _interopRequireDefault(require("../Cards/CardWide"));
+var _DatePickerInput = _interopRequireDefault(require("../Form/DatePickerInput"));
 var _DropdownInput = _interopRequireDefault(require("../Form/DropdownInput"));
+var _TextAreaInput = _interopRequireDefault(require("../Form/TextAreaInput"));
 var _TextInput = _interopRequireDefault(require("../Form/TextInput"));
+var _TimePickerInput = _interopRequireDefault(require("../Form/TimePickerInput"));
 function _interopRequireDefault(e) {
   return e && e.__esModule ? e : {
     default: e
@@ -111,10 +114,13 @@ const customerDetailsFormSchema = (0, _yup.object)({
   infix: (0, _yup.string)().nullable(),
   lastName: (0, _yup.string)().required(_constants__.FORM_ERROR_MESSAGES.required),
   email: (0, _yup.string)().email(_constants__.FORM_ERROR_MESSAGES.email).required(_constants__.FORM_ERROR_MESSAGES.required),
-  phoneNumber: (0, _yup.string)().required(_constants__.FORM_ERROR_MESSAGES.required)
+  phoneNumber: (0, _yup.string)().required(_constants__.FORM_ERROR_MESSAGES.required),
+  date: (0, _yup.string)().nullable(),
+  time: (0, _yup.string)().nullable(),
+  internalNote: (0, _yup.string)().nullable()
 });
 const InternalCustomerDetailsForm = (_ref, ref) => {
-  var _branchTypes$byId$aut, _authSession$branch;
+  var _branchTypes$byId$aut, _authSession$branch, _marketingChannels$fi;
   let {
     errors = {},
     onValidationError,
@@ -123,7 +129,9 @@ const InternalCustomerDetailsForm = (_ref, ref) => {
   const [{
     customer,
     channel,
-    selectedBranch
+    selectedBranch,
+    appointment,
+    internalNote
   }, dispatch] = (0, _OrderSessionContext.useOrderSession)();
   const {
     branchById
@@ -181,7 +189,7 @@ const InternalCustomerDetailsForm = (_ref, ref) => {
   (0, _react.useImperativeHandle)(ref, () => ({
     validateForm
   }));
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('col-12 mt-2 mb-4')
   }, /*#__PURE__*/_react.default.createElement(_CardWide.default, null, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('row')
@@ -204,13 +212,10 @@ const InternalCustomerDetailsForm = (_ref, ref) => {
     noOptionsMessage: "Geen opties beschikbaar",
     placeholder: "Maak een keuze",
     errorMessage: (errors === null || errors === void 0 ? void 0 : errors['channelType']) || (errors === null || errors === void 0 ? void 0 : errors['channelId']),
-    initialValue: () => {
-      const foundChannel = marketingChannels.find(marketingC => (marketingC === null || marketingC === void 0 ? void 0 : marketingC.entityId) === (channel === null || channel === void 0 ? void 0 : channel.channelId));
-      return {
-        label: foundChannel === null || foundChannel === void 0 ? void 0 : foundChannel.title,
-        value: foundChannel
-      };
-    },
+    initialValue: channel !== null && channel !== void 0 && channel.channelId ? {
+      label: marketingChannels === null || marketingChannels === void 0 || (_marketingChannels$fi = marketingChannels.find(marketingC => (marketingC === null || marketingC === void 0 ? void 0 : marketingC.entityId) === (channel === null || channel === void 0 ? void 0 : channel.channelId))) === null || _marketingChannels$fi === void 0 ? void 0 : _marketingChannels$fi.title,
+      value: marketingChannels === null || marketingChannels === void 0 ? void 0 : marketingChannels.find(marketingC => (marketingC === null || marketingC === void 0 ? void 0 : marketingC.entityId) === (channel === null || channel === void 0 ? void 0 : channel.channelId))
+    } : null,
     onChange: _ref2 => {
       var _value$kanaalType;
       let {
@@ -302,6 +307,54 @@ const InternalCustomerDetailsForm = (_ref, ref) => {
     isRequired: true,
     label: "Telefoonnummer:",
     errorMessage: errors === null || errors === void 0 ? void 0 : errors['phoneNumber']
-  }))));
+  })))), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('col-12')
+  }, /*#__PURE__*/_react.default.createElement(_CardWide.default, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('row')
+  }, /*#__PURE__*/_react.default.createElement("h6", {
+    className: (0, _helpers__.withStyle)('modal-title col-12 mb-2')
+  }, "Gegevens voor de afspraak", /*#__PURE__*/_react.default.createElement("br", null)), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('col-12 col-md-6')
+  }, /*#__PURE__*/_react.default.createElement(_DatePickerInput.default, {
+    onChange: value => dispatch({
+      type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_DATE,
+      payload: {
+        date: value
+      }
+    }),
+    name: 'Datum',
+    label: "Datum",
+    initialValue: appointment !== null && appointment !== void 0 && appointment.date ? new Date(appointment === null || appointment === void 0 ? void 0 : appointment.date) : null,
+    isStrict: false,
+    errorMessage: errors === null || errors === void 0 ? void 0 : errors['date']
+  }), /*#__PURE__*/_react.default.createElement(_TimePickerInput.default, {
+    onChange: value => dispatch({
+      type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_TIME,
+      payload: {
+        time: value
+      }
+    }),
+    initialValue: appointment !== null && appointment !== void 0 && appointment.time ? new Date(appointment === null || appointment === void 0 ? void 0 : appointment.time) : null,
+    name: 'Tijd',
+    label: "Tijd",
+    isStrict: false,
+    errorMessage: errors === null || errors === void 0 ? void 0 : errors['time']
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('col-12 col-md-6')
+  }, /*#__PURE__*/_react.default.createElement(_TextAreaInput.default, {
+    placeholder: "",
+    initialValue: internalNote === null || internalNote === void 0 ? void 0 : internalNote.internalNote,
+    name: "internalNote",
+    onChange: value => dispatch({
+      type: _OrderSessionContext.orderSessionActions.SET_INTERNAL_NOTE,
+      payload: {
+        internalNote: value
+      }
+    }),
+    isRequired: false,
+    form: form,
+    label: "Eventuele opmerkingen:",
+    errorMessage: errors === null || errors === void 0 ? void 0 : errors['internalNote']
+  }))))));
 };
 var _default = exports.default = /*#__PURE__*/(0, _react.forwardRef)(InternalCustomerDetailsForm);

package/dist/src/shared/__containers__/LicensePlateForm.js

@@ -129,10 +129,9 @@ const LicensePlateForm = _ref => {
   }, /*#__PURE__*/_react.default.createElement(_PrimaryButton.default, {
     className: (0, _helpers__.withStyle)('btn btn-primary'),
     type: "button",
-    onClick: () => onSubmit(isFilter ? {
-      value: filterLicensePlate,
-      type: 'licenseplate'
-    } : undefined),
+    onClick: () => {
+      onSubmit(isFilter ? filterLicensePlate : undefined);
+    },
     isDisabled: !isFilter ? !licensePlate || licensePlate.length < 6 : false,
     label: isFilter ? 'Filteren' : 'Volgende'
   })))));

package/dist/src/shared/__containers__/ManualSelectionForm.js

@@ -223,7 +223,7 @@ const ManualSelectionForm = _ref => {
       type: 'model'
     } : undefined),
     isDisabled: !model && !isFilter,
-    label: isFilter ? 'Filter' : 'Sluiten'
+    label: isFilter ? 'Filter' : 'Volgende'
   })))));
 };
 var _default = exports.default = ManualSelectionForm;

package/dist/src/shared/__containers__/QuestionsForm.js

@@ -1,8 +1,14 @@
 "use strict";
 
 require("core-js/modules/es.weak-map.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.for-each.js");
 require("core-js/modules/web.dom-collections.iterator.js");
 require("core-js/modules/es.weak-map.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.for-each.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -49,11 +55,61 @@ function _interopRequireWildcard(e, r) {
   }
   return n.default = e, t && t.set(e, n), n;
 }
+function ownKeys(e, r) {
+  var t = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function (r) {
+      return Object.getOwnPropertyDescriptor(e, r).enumerable;
+    })), t.push.apply(t, o);
+  }
+  return t;
+}
+function _objectSpread(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t = null != arguments[r] ? arguments[r] : {};
+    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
+      _defineProperty(e, r, t[r]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
+      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+    });
+  }
+  return e;
+}
+function _defineProperty(e, r, t) {
+  return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+    value: t,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : e[r] = t, e;
+}
+function _toPropertyKey(t) {
+  var i = _toPrimitive(t, "string");
+  return "symbol" == typeof i ? i : i + "";
+}
+function _toPrimitive(t, r) {
+  if ("object" != typeof t || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r || "default");
+    if ("object" != typeof i) return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return ("string" === r ? String : Number)(t);
+}
 const QuestionsForm = _ref => {
   let {
     onPrev = () => {},
-    onSubmit = () => {}
+    onSubmit = () => {},
+    isFilter = false,
+    initialLicensePlate = null
   } = _ref;
+  const [filterAnswers, setFilterAnswers] = (0, _react.useState)({
+    executionAnswer1: '',
+    executionAnswer2: '',
+    durationAnswer: ''
+  });
   const [{
     licensePlate,
     model,
@@ -67,6 +123,7 @@ const QuestionsForm = _ref => {
     priceCalculationDate
   }, dispatch] = (0, _OrderSessionContext.useOrderSession)();
   const formula = (0, _FormulaContext.useFormula)();
+  const history = (0, _reactRouter.useHistory)();
   const {
     isLoadingQuestions,
     execution1AnswerOptions,
@@ -75,7 +132,7 @@ const QuestionsForm = _ref => {
     questionsError,
     durationQuestion
   } = (0, _queries.useQuestionsQuery)({
-    licensePlate,
+    licensePlate: initialLicensePlate !== null && initialLicensePlate !== void 0 ? initialLicensePlate : licensePlate,
     model,
     formula,
     discountCode,
@@ -84,7 +141,7 @@ const QuestionsForm = _ref => {
     durationAnswer: durationAnswer
   });
   (0, _queries.useProductsQuery)({
-    licensePlate,
+    licensePlate: initialLicensePlate !== null && initialLicensePlate !== void 0 ? initialLicensePlate : licensePlate,
     model,
     executionAnswer1,
     executionAnswer2,
@@ -137,6 +194,27 @@ const QuestionsForm = _ref => {
       });
     }
   }, [execution2AnswerOptions]);
+  (0, _react.useEffect)(() => {
+    if (!isLoadingQuestions) {
+      const hasNoQuestions = !(durationOptions !== null && durationOptions !== void 0 && durationOptions.length) && !(execution1Options !== null && execution1Options !== void 0 && execution1Options.length) && !(execution2Options !== null && execution2Options !== void 0 && execution2Options.length) && !(execution2AnswerOptions !== null && execution2AnswerOptions !== void 0 && execution2AnswerOptions.length) && !(execution1AnswerOptions !== null && execution1AnswerOptions !== void 0 && execution1AnswerOptions.length) && !(durationQuestion !== null && durationQuestion !== void 0 && durationQuestion.length);
+      if (hasNoQuestions) {
+        dispatch({
+          type: _OrderSessionContext.orderSessionActions.CLEAR_ANSWERS
+        });
+        if (isFilter) {
+          onSubmit({
+            type: 'licensePlate',
+            value: {
+              licensePlate: initialLicensePlate
+            }
+          });
+          return;
+        } else {
+          history.push('/configurator/trekhaakpakket');
+        }
+      }
+    }
+  }, [isLoadingQuestions, durationOptions, execution1Options, execution2Options, execution2AnswerOptions, execution1AnswerOptions, durationQuestion, isFilter]);
   if (questionsError === _constants__.API_ERROR_CODES.notFound || questionsError === _constants__.API_ERROR_CODES.notFoundAldoc) {
     return /*#__PURE__*/_react.default.createElement(_reactRouter.Redirect, {
       to: "/configurator/geen-producten"
@@ -156,9 +234,11 @@ const QuestionsForm = _ref => {
     }));
   }
   if (!(durationOptions !== null && durationOptions !== void 0 && durationOptions.length) && !(execution1Options !== null && execution1Options !== void 0 && execution1Options.length) && !(execution2Options !== null && execution2Options !== void 0 && execution2Options.length) && !(execution2AnswerOptions !== null && execution2AnswerOptions !== void 0 && execution2AnswerOptions.length) && !(execution1AnswerOptions !== null && execution1AnswerOptions !== void 0 && execution1AnswerOptions.length) && !(durationQuestion !== null && durationQuestion !== void 0 && durationQuestion.length)) {
-    return /*#__PURE__*/_react.default.createElement(_reactRouter.Redirect, {
-      to: "/configurator/trekhaakpakket"
-    });
+    if (!isFilter) {
+      return /*#__PURE__*/_react.default.createElement(_reactRouter.Redirect, {
+        to: "/configurator/trekhaakpakket"
+      });
+    }
   }
   const handlePrev = () => {
     dispatch({
@@ -166,42 +246,69 @@ const QuestionsForm = _ref => {
     });
     onPrev();
   };
+  const handleDurationChange = value => {
+    if (isFilter) {
+      setFilterAnswers(prev => _objectSpread(_objectSpread({}, prev), {}, {
+        durationAnswer: value
+      }));
+    } else {
+      dispatch({
+        type: _OrderSessionContext.orderSessionActions.SET_DURATION_ANSWER,
+        payload: {
+          answer: value
+        }
+      });
+    }
+  };
+  const handleExecution1Change = value => {
+    if (isFilter) {
+      setFilterAnswers(prev => _objectSpread(_objectSpread({}, prev), {}, {
+        executionAnswer1: value
+      }));
+    } else {
+      dispatch({
+        type: _OrderSessionContext.orderSessionActions.SET_EXECUTION1_ANSWER,
+        payload: {
+          answer: value
+        }
+      });
+    }
+  };
+  const handleExecution2Change = value => {
+    if (isFilter) {
+      setFilterAnswers(prev => _objectSpread(_objectSpread({}, prev), {}, {
+        executionAnswer2: value
+      }));
+    } else {
+      dispatch({
+        type: _OrderSessionContext.orderSessionActions.SET_EXECUTION2_ANSWER,
+        payload: {
+          answer: value
+        }
+      });
+    }
+  };
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "We hebben nog een aantal vragen (max 4) voordat we de juiste trekhaak voor jouw auto kunnen adviseren."), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('my-2')
   }, (durationOptions === null || durationOptions === void 0 ? void 0 : durationOptions.length) > 0 && /*#__PURE__*/_react.default.createElement(_RadioInput.default, {
     name: "questions-duration",
     label: "Selecteer uw uitvoering",
-    onChange: value => dispatch({
-      type: _OrderSessionContext.orderSessionActions.SET_DURATION_ANSWER,
-      payload: {
-        answer: value
-      }
-    }),
-    initialValue: durationAnswer,
+    onChange: handleDurationChange,
+    initialValue: isFilter ? filterAnswers.durationAnswer : durationAnswer,
     options: durationOptions,
     isRequired: true
   }), (execution1Options === null || execution1Options === void 0 ? void 0 : execution1Options.length) > 0 && /*#__PURE__*/_react.default.createElement(_RadioInput.default, {
     name: "questions-1",
     label: "Selecteer uw uitvoering",
-    onChange: value => dispatch({
-      type: _OrderSessionContext.orderSessionActions.SET_EXECUTION1_ANSWER,
-      payload: {
-        answer: value
-      }
-    }),
-    initialValue: executionAnswer1,
+    onChange: handleExecution1Change,
+    initialValue: isFilter ? filterAnswers.executionAnswer1 : executionAnswer1,
     options: execution1Options,
     isRequired: true
   }), (execution2Options === null || execution2Options === void 0 ? void 0 : execution2Options.length) > 0 && /*#__PURE__*/_react.default.createElement(_RadioInput.default, {
     name: "questions-2",
     label: "Selecteer uw uitvoering",
-    onChange: value => dispatch({
-      type: _OrderSessionContext.orderSessionActions.SET_EXECUTION2_ANSWER,
-      payload: {
-        answer: value
-      }
-    }),
-    initialValue: executionAnswer2,
+    onChange: handleExecution2Change,
+    initialValue: isFilter ? filterAnswers.executionAnswer2 : executionAnswer2,
     options: execution2Options,
     isRequired: true
   })), /*#__PURE__*/_react.default.createElement("div", {
@@ -220,13 +327,21 @@ const QuestionsForm = _ref => {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('d-grid gap-2')
   }, /*#__PURE__*/_react.default.createElement(_PrimaryButton.default, {
-    isDisabled: execution1AnswerOptions.length && !executionAnswer1 || execution2AnswerOptions.length && !executionAnswer2 || durationQuestion.length && !durationAnswer,
-    onClick: () => onSubmit({
+    isDisabled: isFilter ? execution1AnswerOptions.length && !filterAnswers.executionAnswer1 || execution2AnswerOptions.length && !filterAnswers.executionAnswer2 || durationQuestion.length && !filterAnswers.durationAnswer : execution1AnswerOptions.length && !executionAnswer1 || execution2AnswerOptions.length && !executionAnswer2 || durationQuestion.length && !durationAnswer,
+    onClick: () => onSubmit(isFilter ? {
+      type: 'licensePlate',
+      value: {
+        licensePlate: initialLicensePlate,
+        executionAnswer1: filterAnswers.executionAnswer1,
+        executionAnswer2: filterAnswers.executionAnswer2,
+        durationAnswer: filterAnswers.durationAnswer
+      }
+    } : {
       executionAnswer1,
       executionAnswer2,
       durationAnswer
     }),
-    label: "Bekijk de mogelijkheden"
+    label: isFilter ? 'Filter' : 'Bekijk de mogelijkheden'
   })))));
 };
 var _default = exports.default = QuestionsForm;

package/dist/src/shared/__containers__/internal/InternalAppointmentForm.js

@@ -146,7 +146,7 @@ const internalAppointmentFormSchema = (0, _yup.object)({
  * TODO: Split this component - file is too long at the moment.
  */
 const InternalAppointmentForm = _ref => {
-  var _branchTypes$byId$aut, _authSession$branch;
+  var _branchTypes$byId$aut, _authSession$branch, _marketingChannels$fi;
   let {
     onSubmit = payload => {},
     isError = false,
@@ -387,13 +387,10 @@ const InternalAppointmentForm = _ref => {
     noOptionsMessage: "Geen opties beschikbaar",
     placeholder: "Maak een keuze",
     errorMessage: (errors === null || errors === void 0 ? void 0 : errors['channelType']) || (errors === null || errors === void 0 ? void 0 : errors['channelId']),
-    initialValue: () => {
-      const foundChannel = marketingChannels.find(marketingC => (marketingC === null || marketingC === void 0 ? void 0 : marketingC.entityId) === (channel === null || channel === void 0 ? void 0 : channel.channelId));
-      return {
-        label: foundChannel === null || foundChannel === void 0 ? void 0 : foundChannel.title,
-        value: foundChannel
-      };
-    },
+    initialValue: channel !== null && channel !== void 0 && channel.channelId ? {
+      label: marketingChannels === null || marketingChannels === void 0 || (_marketingChannels$fi = marketingChannels.find(marketingC => (marketingC === null || marketingC === void 0 ? void 0 : marketingC.entityId) === (channel === null || channel === void 0 ? void 0 : channel.channelId))) === null || _marketingChannels$fi === void 0 ? void 0 : _marketingChannels$fi.title,
+      value: marketingChannels === null || marketingChannels === void 0 ? void 0 : marketingChannels.find(marketingC => (marketingC === null || marketingC === void 0 ? void 0 : marketingC.entityId) === (channel === null || channel === void 0 ? void 0 : channel.channelId))
+    } : null,
     onChange: _ref3 => {
       var _value$kanaalType;
       let {