thm-p3-configurator 0.0.404 → 0.0.406

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/src/shared/__components__/Form/DatePickerInput.js +5 -1
  2. package/dist/src/shared/__components__/Form/TimePickerInput.js +122 -12
  3. package/dist/src/shared/__components__/internal/InternalCustomerDetailsForm.js +35 -16
  4. package/dist/src/shared/__containers__/internal/InternalAppointmentForm.js +92 -15
  5. package/dist/src/shared/__helpers__/dossier.js +12 -0
  6. package/dist/src/shared/__helpers__/openingHours.js +211 -0
  7. package/dist/src/shared/__pages__/internal/InternalSessionEditPage.js +0 -1
  8. package/package.json +1 -1
package/dist/src/shared/__components__/Form/DatePickerInput.js CHANGED
@@ -54,7 +54,9 @@ const DatePickerInput = _ref => {
54
54
  label,
55
55
  errorMessage,
56
56
  minDate = new Date(),
57
- maxDate
57
+ maxDate,
58
+ filterDate,
59
+ includeDates
58
60
  } = _ref;
59
61
  const [value, setValue] = (0, _react.useState)(null);
60
62
  const [isTouched, setIsTouched] = (0, _react.useState)(false);
@@ -112,6 +114,8 @@ const DatePickerInput = _ref => {
112
114
  },
113
115
  minDate: minDate,
114
116
  maxDate: maxDate,
117
+ filterDate: filterDate,
118
+ includeDates: includeDates,
115
119
  locale: "nl",
116
120
  onFocus: handleFocus,
117
121
  onChange: date => handleChange(date),
package/dist/src/shared/__components__/Form/TimePickerInput.js CHANGED
@@ -1,19 +1,27 @@
1
1
  "use strict";
2
2
 
3
3
  require("core-js/modules/es.weak-map.js");
4
+ require("core-js/modules/esnext.iterator.constructor.js");
5
+ require("core-js/modules/esnext.iterator.filter.js");
6
+ require("core-js/modules/esnext.iterator.for-each.js");
4
7
  require("core-js/modules/web.dom-collections.iterator.js");
5
8
  require("core-js/modules/es.weak-map.js");
9
+ require("core-js/modules/esnext.iterator.constructor.js");
10
+ require("core-js/modules/esnext.iterator.filter.js");
11
+ require("core-js/modules/esnext.iterator.for-each.js");
6
12
  Object.defineProperty(exports, "__esModule", {
7
13
  value: true
8
14
  });
9
15
  exports.default = void 0;
10
16
  require("core-js/modules/web.dom-collections.iterator.js");
11
17
  var _nl = _interopRequireDefault(require("date-fns/locale/nl"));
18
+ var _dateFns = require("date-fns");
12
19
  var _setHours = _interopRequireDefault(require("date-fns/setHours"));
13
20
  var _setMinutes = _interopRequireDefault(require("date-fns/setMinutes"));
14
21
  var _moment = _interopRequireDefault(require("moment"));
15
22
  var _react = _interopRequireWildcard(require("react"));
16
23
  var _reactDatepicker = _interopRequireWildcard(require("react-datepicker"));
24
+ var _openingHours = require("../../__helpers__/openingHours");
17
25
  var _helpers__ = require("../../__helpers__");
18
26
  var _ErrorMessage = _interopRequireDefault(require("./ErrorMessage"));
19
27
  function _getRequireWildcardCache(e) {
@@ -46,30 +54,127 @@ function _interopRequireDefault(e) {
46
54
  default: e
47
55
  };
48
56
  }
57
+ function ownKeys(e, r) {
58
+ var t = Object.keys(e);
59
+ if (Object.getOwnPropertySymbols) {
60
+ var o = Object.getOwnPropertySymbols(e);
61
+ r && (o = o.filter(function (r) {
62
+ return Object.getOwnPropertyDescriptor(e, r).enumerable;
63
+ })), t.push.apply(t, o);
64
+ }
65
+ return t;
66
+ }
67
+ function _objectSpread(e) {
68
+ for (var r = 1; r < arguments.length; r++) {
69
+ var t = null != arguments[r] ? arguments[r] : {};
70
+ r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
71
+ _defineProperty(e, r, t[r]);
72
+ }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
73
+ Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
74
+ });
75
+ }
76
+ return e;
77
+ }
78
+ function _defineProperty(e, r, t) {
79
+ return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
80
+ value: t,
81
+ enumerable: !0,
82
+ configurable: !0,
83
+ writable: !0
84
+ }) : e[r] = t, e;
85
+ }
86
+ function _toPropertyKey(t) {
87
+ var i = _toPrimitive(t, "string");
88
+ return "symbol" == typeof i ? i : i + "";
89
+ }
90
+ function _toPrimitive(t, r) {
91
+ if ("object" != typeof t || !t) return t;
92
+ var e = t[Symbol.toPrimitive];
93
+ if (void 0 !== e) {
94
+ var i = e.call(t, r || "default");
95
+ if ("object" != typeof i) return i;
96
+ throw new TypeError("@@toPrimitive must return a primitive value.");
97
+ }
98
+ return ("string" === r ? String : Number)(t);
99
+ }
49
100
  (0, _reactDatepicker.registerLocale)('nl', _nl.default);
101
+ const getTimeInMinutes = date => {
102
+ if (!date) {
103
+ return null;
104
+ }
105
+ const value = new Date(date);
106
+ return value.getHours() * 60 + value.getMinutes();
107
+ };
50
108
  const TimePickerInput = _ref => {
109
+ var _openToDate$getTime, _openToDate$getTime2, _resolvedOpenToDate$g, _resolvedOpenToDate$g2, _minTime$getTime, _minTime$getTime2, _maxTime$getTime, _maxTime$getTime2;
51
110
  let {
52
111
  initialValue,
112
+ value: controlledValue,
53
113
  onChange,
54
114
  name,
55
115
  isRequired,
56
116
  label,
57
117
  isStrict = false,
118
+ isDisabled = false,
119
+ minTime: minTimeProp = null,
120
+ maxTime: maxTimeProp = null,
121
+ openToDate = null,
58
122
  errorMessage
59
123
  } = _ref;
60
- const [value, setValue] = (0, _react.useState)(null);
124
+ const isControlled = controlledValue !== undefined;
125
+ const [internalValue, setInternalValue] = (0, _react.useState)(null);
61
126
  const [isTouched, setIsTouched] = (0, _react.useState)(false);
127
+ const strictMinTime = isStrict ? (0, _setHours.default)((0, _setMinutes.default)(new Date(), 0), 6) : null;
128
+ const strictMaxTime = isStrict ? (0, _setHours.default)((0, _setMinutes.default)(new Date(), 0), 20) : null;
129
+ const minTime = minTimeProp !== null && minTimeProp !== void 0 ? minTimeProp : strictMinTime;
130
+ const maxTime = maxTimeProp !== null && maxTimeProp !== void 0 ? maxTimeProp : strictMaxTime;
131
+ const resolvedOpenToDate = (0, _react.useMemo)(() => openToDate ? new Date(openToDate) : null, [(_openToDate$getTime = openToDate === null || openToDate === void 0 || (_openToDate$getTime2 = openToDate.getTime) === null || _openToDate$getTime2 === void 0 ? void 0 : _openToDate$getTime2.call(openToDate)) !== null && _openToDate$getTime !== void 0 ? _openToDate$getTime : openToDate]);
132
+ const pickerMinDate = (0, _react.useMemo)(() => resolvedOpenToDate ? (0, _dateFns.startOfDay)(resolvedOpenToDate) : (0, _dateFns.startOfDay)(new Date()), [(_resolvedOpenToDate$g = resolvedOpenToDate === null || resolvedOpenToDate === void 0 || (_resolvedOpenToDate$g2 = resolvedOpenToDate.getTime) === null || _resolvedOpenToDate$g2 === void 0 ? void 0 : _resolvedOpenToDate$g2.call(resolvedOpenToDate)) !== null && _resolvedOpenToDate$g !== void 0 ? _resolvedOpenToDate$g : resolvedOpenToDate]);
133
+ const selectedValue = isControlled ? controlledValue !== null && controlledValue !== void 0 ? controlledValue : null : internalValue;
134
+ const initialTimestamp = initialValue instanceof Date ? initialValue.getTime() : initialValue ? new Date(initialValue).getTime() : null;
62
135
  (0, _react.useEffect)(() => {
63
- if ((0, _moment.default)().isValid(initialValue)) {
64
- setValue(initialValue);
136
+ if (isControlled) {
137
+ return;
138
+ }
139
+ if (initialTimestamp && (0, _moment.default)(initialTimestamp).isValid()) {
140
+ setInternalValue(new Date(initialTimestamp));
141
+ return;
65
142
  }
66
- }, [initialValue]);
143
+ setInternalValue(null);
144
+ }, [isControlled, initialTimestamp]);
145
+ const filterTime = (0, _react.useCallback)(time => {
146
+ if (!minTime && !maxTime) {
147
+ return true;
148
+ }
149
+ const selectedMinutes = getTimeInMinutes(time);
150
+ if (selectedMinutes == null) {
151
+ return false;
152
+ }
153
+ const minMinutes = getTimeInMinutes(minTime);
154
+ if (minMinutes != null && selectedMinutes < minMinutes) {
155
+ return false;
156
+ }
157
+ const maxMinutes = getTimeInMinutes(maxTime);
158
+ if (maxMinutes != null && selectedMinutes > maxMinutes) {
159
+ return false;
160
+ }
161
+ return true;
162
+ }, [(_minTime$getTime = minTime === null || minTime === void 0 || (_minTime$getTime2 = minTime.getTime) === null || _minTime$getTime2 === void 0 ? void 0 : _minTime$getTime2.call(minTime)) !== null && _minTime$getTime !== void 0 ? _minTime$getTime : minTime, (_maxTime$getTime = maxTime === null || maxTime === void 0 || (_maxTime$getTime2 = maxTime.getTime) === null || _maxTime$getTime2 === void 0 ? void 0 : _maxTime$getTime2.call(maxTime)) !== null && _maxTime$getTime !== void 0 ? _maxTime$getTime : maxTime]);
67
163
  const handleFocus = () => {
164
+ if (isDisabled) {
165
+ return;
166
+ }
68
167
  setIsTouched(true);
69
168
  };
70
169
  const handleChange = date => {
71
- setValue(date);
72
- onChange(date);
170
+ if (isDisabled) {
171
+ return;
172
+ }
173
+ const nextValue = date && resolvedOpenToDate ? (0, _openingHours.copyTimeToDate)(date, resolvedOpenToDate) : date;
174
+ if (!isControlled) {
175
+ setInternalValue(nextValue);
176
+ }
177
+ onChange(nextValue);
73
178
  };
74
179
  return /*#__PURE__*/_react.default.createElement("div", {
75
180
  className: (0, _helpers__.withStyle)('form-group')
@@ -80,10 +185,14 @@ const TimePickerInput = _ref => {
80
185
  className: isTouched && errorMessage ? (0, _helpers__.withStyle)('is-invalid') : ''
81
186
  }, /*#__PURE__*/_react.default.createElement("div", {
82
187
  className: (0, _helpers__.withStyle)('form-group__icon-field'),
83
- style: {
188
+ style: _objectSpread({
84
189
  position: 'relative',
85
190
  width: '100%'
86
- }
191
+ }, isDisabled ? {
192
+ pointerEvents: 'none',
193
+ opacity: 0.65,
194
+ cursor: 'not-allowed'
195
+ } : {})
87
196
  }, /*#__PURE__*/_react.default.createElement("span", {
88
197
  className: "fal fa-clock",
89
198
  "aria-hidden": "true",
@@ -107,13 +216,14 @@ const TimePickerInput = _ref => {
107
216
  timeCaption: name,
108
217
  id: name,
109
218
  name: name,
110
- selected: value,
219
+ disabled: isDisabled,
220
+ selected: selectedValue,
111
221
  onKeyDown: e => {
112
222
  e.preventDefault();
113
223
  },
114
- minDate: new Date(),
115
- minTime: isStrict ? (0, _setHours.default)((0, _setMinutes.default)(new Date(), 0), 6) : null,
116
- maxTime: isStrict ? (0, _setHours.default)((0, _setMinutes.default)(new Date(), 0), 20) : null,
224
+ minDate: pickerMinDate,
225
+ openToDate: resolvedOpenToDate !== null && resolvedOpenToDate !== void 0 ? resolvedOpenToDate : undefined,
226
+ filterTime: minTime || maxTime ? filterTime : undefined,
117
227
  locale: "nl",
118
228
  onFocus: handleFocus,
119
229
  wrapperClassName: (0, _helpers__.withStyle)('react-datepicker-wrapper'),
package/dist/src/shared/__components__/internal/InternalCustomerDetailsForm.js CHANGED
@@ -32,6 +32,7 @@ var _queries = require("../../__api__/queries");
32
32
  var _constants__ = require("../../__constants__");
33
33
  var _AuthSessionContext = require("../../__context__/AuthSessionContext");
34
34
  var _OrderSessionContext = require("../../__context__/OrderSessionContext");
35
+ var _openingHours = require("../../__helpers__/openingHours");
35
36
  var _helpers__ = require("../../__helpers__");
36
37
  var _countryOptions = require("../../__helpers__/countryOptions");
37
38
  var _useIsTmg = require("../../__hooks__/useIsTmg");
@@ -161,7 +162,7 @@ const customerDetailsFormSchema = (0, _yup.object)({
161
162
  })
162
163
  });
163
164
  const InternalCustomerDetailsForm = (_ref, ref) => {
164
- var _customer$vatNumber, _customer$kvkNumber, _branchTypes$byId$aut, _authSession$branch, _authSession$branch2;
165
+ var _appointment$time$get, _appointment$time, _appointment$time$get2, _appointment$date$get, _appointment$date, _appointment$date$get2, _customer$vatNumber, _customer$kvkNumber, _branchTypes$byId$aut, _authSession$branch, _authSession$branch2, _ref5, _appointment$date$get3, _appointment$date2, _appointment$date2$ge;
165
166
  let {
166
167
  errors = {},
167
168
  onValidationError,
@@ -189,6 +190,12 @@ const InternalCustomerDetailsForm = (_ref, ref) => {
189
190
  isLoadingCountries
190
191
  } = (0, _queries.useCountriesQuery)();
191
192
  const countryOptions = (0, _react.useMemo)(() => (0, _countryOptions.buildCountryDropdownOptions)(countries === null || countries === void 0 ? void 0 : countries.results), [countries]);
193
+ const appointmentTimeValue = (0, _react.useMemo)(() => {
194
+ if (!(appointment !== null && appointment !== void 0 && appointment.time) || !(appointment !== null && appointment !== void 0 && appointment.date)) {
195
+ return null;
196
+ }
197
+ return (0, _openingHours.copyTimeToDate)(new Date(appointment.time), new Date(appointment.date));
198
+ }, [(_appointment$time$get = appointment === null || appointment === void 0 || (_appointment$time = appointment.time) === null || _appointment$time === void 0 || (_appointment$time$get2 = _appointment$time.getTime) === null || _appointment$time$get2 === void 0 ? void 0 : _appointment$time$get2.call(_appointment$time)) !== null && _appointment$time$get !== void 0 ? _appointment$time$get : appointment === null || appointment === void 0 ? void 0 : appointment.time, (_appointment$date$get = appointment === null || appointment === void 0 || (_appointment$date = appointment.date) === null || _appointment$date === void 0 || (_appointment$date$get2 = _appointment$date.getTime) === null || _appointment$date$get2 === void 0 ? void 0 : _appointment$date$get2.call(_appointment$date)) !== null && _appointment$date$get !== void 0 ? _appointment$date$get : appointment === null || appointment === void 0 ? void 0 : appointment.date]);
192
199
  const authSession = (0, _AuthSessionContext.useAuthSession)();
193
200
  const isTmg = (0, _useIsTmg.useIsTmg)();
194
201
  const [companySearchTerm, setCompanySearchTerm] = (0, _react.useState)('');
@@ -340,13 +347,15 @@ const InternalCustomerDetailsForm = (_ref, ref) => {
340
347
  enabled: isBusinessOwnership
341
348
  });
342
349
  (0, _react.useEffect)(() => {
343
- if (!(customer !== null && customer !== void 0 && customer.countryId) && countryOptions !== null && countryOptions !== void 0 && countryOptions.length) {
344
- const defaultCountry = countryOptions.find(option => option.label === 'NEDERLAND');
345
- if (defaultCountry) {
346
- updateCustomerField('countryId', defaultCountry.value);
347
- }
350
+ if (customer !== null && customer !== void 0 && customer.countryId || !(countryOptions !== null && countryOptions !== void 0 && countryOptions.length)) {
351
+ return;
352
+ }
353
+ const inferredCountry = (0, _helpers__.getCountryOptionForPostalCode)(customer === null || customer === void 0 ? void 0 : customer.zipCode, countryOptions);
354
+ const defaultCountry = inferredCountry || countryOptions.find(option => option.label === 'NEDERLAND');
355
+ if (defaultCountry) {
356
+ updateCustomerField('countryId', defaultCountry.value);
348
357
  }
349
- }, [customer === null || customer === void 0 ? void 0 : customer.countryId, countryOptions, updateCustomerField]);
358
+ }, [customer === null || customer === void 0 ? void 0 : customer.countryId, customer === null || customer === void 0 ? void 0 : customer.zipCode, countryOptions, updateCustomerField]);
350
359
  (0, _react.useEffect)(() => {
351
360
  if (checkboxAvailability.shouldForceDirectDelivery && !Boolean(anderAfleveradres)) {
352
361
  dispatch({
@@ -970,25 +979,35 @@ const InternalCustomerDetailsForm = (_ref, ref) => {
970
979
  }, "Gegevens voor de afspraak", /*#__PURE__*/_react.default.createElement("br", null)), /*#__PURE__*/_react.default.createElement("div", {
971
980
  className: (0, _helpers__.withStyle)('col-12 col-md-6')
972
981
  }, /*#__PURE__*/_react.default.createElement(_DatePickerInput.default, {
973
- onChange: value => dispatch({
974
- type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_DATE,
975
- payload: {
976
- date: value
977
- }
978
- }),
982
+ onChange: value => {
983
+ dispatch({
984
+ type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_DATE,
985
+ payload: {
986
+ date: value
987
+ }
988
+ });
989
+ dispatch({
990
+ type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_TIME,
991
+ payload: {
992
+ time: null
993
+ }
994
+ });
995
+ },
979
996
  name: 'Datum',
980
997
  label: "Datum",
981
998
  initialValue: appointment !== null && appointment !== void 0 && appointment.date ? new Date(appointment === null || appointment === void 0 ? void 0 : appointment.date) : null,
982
999
  isStrict: false,
983
1000
  errorMessage: errors === null || errors === void 0 ? void 0 : errors['date']
984
1001
  }), /*#__PURE__*/_react.default.createElement(_TimePickerInput.default, {
985
- onChange: value => dispatch({
1002
+ key: "appointment-time-".concat((_ref5 = (_appointment$date$get3 = appointment === null || appointment === void 0 || (_appointment$date2 = appointment.date) === null || _appointment$date2 === void 0 || (_appointment$date2$ge = _appointment$date2.getTime) === null || _appointment$date2$ge === void 0 ? void 0 : _appointment$date2$ge.call(_appointment$date2)) !== null && _appointment$date$get3 !== void 0 ? _appointment$date$get3 : appointment === null || appointment === void 0 ? void 0 : appointment.date) !== null && _ref5 !== void 0 ? _ref5 : 'none'),
1003
+ value: appointmentTimeValue,
1004
+ onChange: time => dispatch({
986
1005
  type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_TIME,
987
1006
  payload: {
988
- time: value
1007
+ time
989
1008
  }
990
1009
  }),
991
- initialValue: appointment !== null && appointment !== void 0 && appointment.time ? new Date(appointment === null || appointment === void 0 ? void 0 : appointment.time) : null,
1010
+ openToDate: appointment !== null && appointment !== void 0 && appointment.date ? new Date(appointment.date) : null,
992
1011
  name: 'Tijd',
993
1012
  label: "Tijd",
994
1013
  isStrict: false,
package/dist/src/shared/__containers__/internal/InternalAppointmentForm.js CHANGED
@@ -53,6 +53,7 @@ var _OrderSessionContext = require("../../__context__/OrderSessionContext");
53
53
  var _helpers__ = require("../../__helpers__");
54
54
  var _countryOptions = require("../../__helpers__/countryOptions");
55
55
  var _product = require("../../__helpers__/product");
56
+ var _openingHours = require("../../__helpers__/openingHours");
56
57
  var _ui = require("../../__helpers__/ui");
57
58
  var _useIsTmg = require("../../__hooks__/useIsTmg");
58
59
  var _useIsTowmotive = require("../../__hooks__/useIsTowmotive");
@@ -219,7 +220,7 @@ const getBranchCity = function getBranchCity() {
219
220
  return (branch === null || branch === void 0 ? void 0 : branch.city) || (branch === null || branch === void 0 ? void 0 : branch.gemeente) || '';
220
221
  };
221
222
  const InternalAppointmentForm = _ref => {
222
- var _branchTypes$byId$aut, _authSession$branch, _customer$vatNumber, _customer$kvkNumber, _authSession$branch2, _contextCustomer$note2;
223
+ var _branchTypes$byId$aut, _authSession$branch, _customer$vatNumber, _customer$kvkNumber, _appointment$time$get, _appointment$time, _appointment$time$get2, _appointment$date$get, _appointment$date, _appointment$date$get2, _authSession$branch2, _ref9, _appointment$date$get3, _appointment$date2, _appointment$date2$ge, _contextCustomer$note2;
223
224
  let {
224
225
  onSubmit = payload => {},
225
226
  isError = false,
@@ -435,13 +436,15 @@ const InternalAppointmentForm = _ref => {
435
436
  return defaultCountry || null;
436
437
  }, [customer === null || customer === void 0 ? void 0 : customer.countryId, countryOptions]);
437
438
  (0, _react.useEffect)(() => {
438
- if (!(customer !== null && customer !== void 0 && customer.countryId) && countryOptions !== null && countryOptions !== void 0 && countryOptions.length) {
439
- const defaultCountry = countryOptions.find(option => option.label === 'NEDERLAND');
440
- if (defaultCountry) {
441
- updateCustomerField('countryId', defaultCountry.value);
442
- }
439
+ if (customer !== null && customer !== void 0 && customer.countryId || !(countryOptions !== null && countryOptions !== void 0 && countryOptions.length)) {
440
+ return;
441
+ }
442
+ const inferredCountry = (0, _helpers__.getCountryOptionForPostalCode)(customer === null || customer === void 0 ? void 0 : customer.zipCode, countryOptions);
443
+ const defaultCountry = inferredCountry || countryOptions.find(option => option.label === 'NEDERLAND');
444
+ if (defaultCountry) {
445
+ updateCustomerField('countryId', defaultCountry.value);
443
446
  }
444
- }, [customer === null || customer === void 0 ? void 0 : customer.countryId, countryOptions, updateCustomerField]);
447
+ }, [customer === null || customer === void 0 ? void 0 : customer.countryId, customer === null || customer === void 0 ? void 0 : customer.zipCode, countryOptions, updateCustomerField]);
445
448
  const isBusinessOwnership = activeOwnershipType === _constants__.VEHICLE_OWNERSHIP_TYPE.Zakelijk;
446
449
  const isLeaseOwnership = activeOwnershipType === _constants__.VEHICLE_OWNERSHIP_TYPE.Leasemaatschappij;
447
450
  const isNetherlandsSelected = (0, _react.useMemo)(() => {
@@ -459,6 +462,61 @@ const InternalAppointmentForm = _ref => {
459
462
  branchById
460
463
  } = (0, _queries.useBranchByIdOrWidgetId)(selectedBranch);
461
464
  const history = (0, _reactRouter.useHistory)();
465
+ const openingstijden = branchById === null || branchById === void 0 ? void 0 : branchById.openingstijden;
466
+ const filterAppointmentDate = (0, _react.useCallback)(date => (0, _openingHours.isAppointmentDateSelectable)(openingstijden, date), [openingstijden]);
467
+ const appointmentIncludeDates = (0, _react.useMemo)(() => (0, _openingHours.getAppointmentIncludeDates)(openingstijden), [openingstijden]);
468
+ const appointmentTimeBounds = (0, _react.useMemo)(() => appointment !== null && appointment !== void 0 && appointment.date ? (0, _openingHours.getAppointmentTimeBounds)(openingstijden, new Date(appointment.date)) : {
469
+ minTime: null,
470
+ maxTime: null
471
+ }, [openingstijden, appointment === null || appointment === void 0 ? void 0 : appointment.date]);
472
+ const isTimePickerDisabled = !(appointment !== null && appointment !== void 0 && appointment.date) || appointmentTimeBounds.minTime && appointmentTimeBounds.maxTime && appointmentTimeBounds.minTime > appointmentTimeBounds.maxTime;
473
+ (0, _react.useEffect)(() => {
474
+ if (!openingstijden) {
475
+ return;
476
+ }
477
+ if (appointment !== null && appointment !== void 0 && appointment.date) {
478
+ const date = new Date(appointment.date);
479
+ if (!(0, _openingHours.isAppointmentDateSelectable)(openingstijden, date)) {
480
+ dispatch({
481
+ type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_DATE,
482
+ payload: {
483
+ date: null
484
+ }
485
+ });
486
+ dispatch({
487
+ type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_TIME,
488
+ payload: {
489
+ time: null
490
+ }
491
+ });
492
+ return;
493
+ }
494
+ const bounds = (0, _openingHours.getAppointmentTimeBounds)(openingstijden, date);
495
+ if (bounds.minTime && bounds.maxTime && bounds.minTime > bounds.maxTime) {
496
+ dispatch({
497
+ type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_TIME,
498
+ payload: {
499
+ time: null
500
+ }
501
+ });
502
+ return;
503
+ }
504
+ if (appointment !== null && appointment !== void 0 && appointment.time && !(0, _openingHours.isTimeWithinBounds)(new Date(appointment.time), bounds)) {
505
+ dispatch({
506
+ type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_TIME,
507
+ payload: {
508
+ time: null
509
+ }
510
+ });
511
+ }
512
+ }
513
+ }, [openingstijden, appointment === null || appointment === void 0 ? void 0 : appointment.date, dispatch]);
514
+ const appointmentTimeValue = (0, _react.useMemo)(() => {
515
+ if (!(appointment !== null && appointment !== void 0 && appointment.time) || !(appointment !== null && appointment !== void 0 && appointment.date)) {
516
+ return null;
517
+ }
518
+ return (0, _openingHours.copyTimeToDate)(new Date(appointment.time), new Date(appointment.date));
519
+ }, [(_appointment$time$get = appointment === null || appointment === void 0 || (_appointment$time = appointment.time) === null || _appointment$time === void 0 || (_appointment$time$get2 = _appointment$time.getTime) === null || _appointment$time$get2 === void 0 ? void 0 : _appointment$time$get2.call(_appointment$time)) !== null && _appointment$time$get !== void 0 ? _appointment$time$get : appointment === null || appointment === void 0 ? void 0 : appointment.time, (_appointment$date$get = appointment === null || appointment === void 0 || (_appointment$date = appointment.date) === null || _appointment$date === void 0 || (_appointment$date$get2 = _appointment$date.getTime) === null || _appointment$date$get2 === void 0 ? void 0 : _appointment$date$get2.call(_appointment$date)) !== null && _appointment$date$get !== void 0 ? _appointment$date$get : appointment === null || appointment === void 0 ? void 0 : appointment.date]);
462
520
  const formula = (0, _FormulaContext.useFormula)();
463
521
  const showBranchAutofillLink = [_constants__.CONFIGURATOR_FORMULAS.TOW, _constants__.CONFIGURATOR_FORMULAS.TMG, _constants__.CONFIGURATOR_FORMULAS.TowMotive].includes(formula);
464
522
  const isTowmotive = (0, _useIsTowmotive.useIsTowmotive)();
@@ -1523,30 +1581,49 @@ const InternalAppointmentForm = _ref => {
1523
1581
  }, "Gegevens voor de afspraak", /*#__PURE__*/_react.default.createElement("br", null)), /*#__PURE__*/_react.default.createElement("div", {
1524
1582
  className: (0, _helpers__.withStyle)('col-12 col-md-6')
1525
1583
  }, /*#__PURE__*/_react.default.createElement(_DatePickerInput.default, {
1526
- onChange: value => dispatch({
1527
- type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_DATE,
1528
- payload: {
1529
- date: value
1584
+ key: "appointment-date-".concat(selectedBranch !== null && selectedBranch !== void 0 ? selectedBranch : 'none'),
1585
+ onChange: value => {
1586
+ if (value && openingstijden && !(0, _openingHours.isAppointmentDateSelectable)(openingstijden, value)) {
1587
+ return;
1530
1588
  }
1531
- }),
1589
+ dispatch({
1590
+ type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_DATE,
1591
+ payload: {
1592
+ date: value
1593
+ }
1594
+ });
1595
+ dispatch({
1596
+ type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_TIME,
1597
+ payload: {
1598
+ time: null
1599
+ }
1600
+ });
1601
+ },
1532
1602
  name: 'Datum',
1533
1603
  isRequired: false,
1534
1604
  label: "Datum",
1535
1605
  initialValue: appointment !== null && appointment !== void 0 && appointment.date ? new Date(appointment === null || appointment === void 0 ? void 0 : appointment.date) : null,
1536
1606
  isStrict: false,
1607
+ filterDate: filterAppointmentDate,
1608
+ includeDates: appointmentIncludeDates,
1537
1609
  errorMessage: errors === null || errors === void 0 ? void 0 : errors['date']
1538
1610
  }), /*#__PURE__*/_react.default.createElement(_TimePickerInput.default, {
1539
- onChange: value => dispatch({
1611
+ key: "appointment-time-".concat((_ref9 = (_appointment$date$get3 = appointment === null || appointment === void 0 || (_appointment$date2 = appointment.date) === null || _appointment$date2 === void 0 || (_appointment$date2$ge = _appointment$date2.getTime) === null || _appointment$date2$ge === void 0 ? void 0 : _appointment$date2$ge.call(_appointment$date2)) !== null && _appointment$date$get3 !== void 0 ? _appointment$date$get3 : appointment === null || appointment === void 0 ? void 0 : appointment.date) !== null && _ref9 !== void 0 ? _ref9 : 'none'),
1612
+ value: appointmentTimeValue,
1613
+ onChange: time => dispatch({
1540
1614
  type: _OrderSessionContext.orderSessionActions.SET_APPOINTMENT_TIME,
1541
1615
  payload: {
1542
- time: value
1616
+ time
1543
1617
  }
1544
1618
  }),
1545
- initialValue: appointment !== null && appointment !== void 0 && appointment.time ? new Date(appointment === null || appointment === void 0 ? void 0 : appointment.time) : null,
1619
+ openToDate: appointment !== null && appointment !== void 0 && appointment.date ? new Date(appointment.date) : null,
1546
1620
  name: 'Tijd',
1547
1621
  isRequired: false,
1548
1622
  label: "Tijd",
1549
1623
  isStrict: false,
1624
+ isDisabled: isTimePickerDisabled,
1625
+ minTime: appointmentTimeBounds.minTime,
1626
+ maxTime: appointmentTimeBounds.maxTime,
1550
1627
  errorMessage: errors === null || errors === void 0 ? void 0 : errors['time']
1551
1628
  })), /*#__PURE__*/_react.default.createElement("div", {
1552
1629
  className: (0, _helpers__.withStyle)('col-12 col-md-6')
package/dist/src/shared/__helpers__/dossier.js CHANGED
@@ -93,6 +93,17 @@ const getDossierValue = function getDossierValue() {
93
93
  }
94
94
  return dossier === null || dossier === void 0 || (_dossier$klant3 = dossier.klant) === null || _dossier$klant3 === void 0 ? void 0 : _dossier$klant3[contactField];
95
95
  };
96
+ const getDossierCountryId = function getDossierCountryId() {
97
+ var _dossier$land, _dossier$klant4;
98
+ let dossier = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
99
+ if (dossier !== null && dossier !== void 0 && (_dossier$land = dossier.land) !== null && _dossier$land !== void 0 && _dossier$land.entityId) {
100
+ return dossier.land.entityId;
101
+ }
102
+ if (dossier !== null && dossier !== void 0 && (_dossier$klant4 = dossier.klant) !== null && _dossier$klant4 !== void 0 && (_dossier$klant4 = _dossier$klant4.land) !== null && _dossier$klant4 !== void 0 && _dossier$klant4.entityId) {
103
+ return dossier.klant.land.entityId;
104
+ }
105
+ return undefined;
106
+ };
96
107
 
97
108
  /**
98
109
  * @description Covnerts an existing hyper dossier object into a local order session
@@ -189,6 +200,7 @@ const parseDossierToOrderSession = exports.parseDossierToOrderSession = function
189
200
  companyNamePlaceholder: (_dossier$placeholderB = dossier === null || dossier === void 0 ? void 0 : dossier.placeholderBedrijfsnaam) !== null && _dossier$placeholderB !== void 0 ? _dossier$placeholderB : undefined,
190
201
  kvkNumber: (_dossier$kvkNummer = dossier === null || dossier === void 0 ? void 0 : dossier.kvkNummer) !== null && _dossier$kvkNummer !== void 0 ? _dossier$kvkNummer : undefined,
191
202
  vatNumber: (_dossier$btwNummer = dossier === null || dossier === void 0 ? void 0 : dossier.btwNummer) !== null && _dossier$btwNummer !== void 0 ? _dossier$btwNummer : undefined,
203
+ countryId: getDossierCountryId(dossier),
192
204
  leasemaatschappijEntityId: (_ref5 = (_ref6 = (_dossier$leasemaatsch3 = dossier === null || dossier === void 0 ? void 0 : dossier.leasemaatschappijEntityId) !== null && _dossier$leasemaatsch3 !== void 0 ? _dossier$leasemaatsch3 : dossier === null || dossier === void 0 || (_dossier$leasemaatsch4 = dossier.leasemaatschappij) === null || _dossier$leasemaatsch4 === void 0 ? void 0 : _dossier$leasemaatsch4.entityId) !== null && _ref6 !== void 0 ? _ref6 : isLeaseOwnership ? dossier === null || dossier === void 0 || (_dossier$bedrijf4 = dossier.bedrijf) === null || _dossier$bedrijf4 === void 0 ? void 0 : _dossier$bedrijf4.entityId : undefined) !== null && _ref5 !== void 0 ? _ref5 : undefined,
193
205
  leasemaatschappijBedrijfsnaam: (_ref7 = (_ref8 = (_ref9 = (_dossier$leasemaatsch5 = dossier === null || dossier === void 0 ? void 0 : dossier.leasemaatschappijBedrijfsnaam) !== null && _dossier$leasemaatsch5 !== void 0 ? _dossier$leasemaatsch5 : dossier === null || dossier === void 0 || (_dossier$leasemaatsch6 = dossier.leasemaatschappij) === null || _dossier$leasemaatsch6 === void 0 ? void 0 : _dossier$leasemaatsch6.name) !== null && _ref9 !== void 0 ? _ref9 : dossier === null || dossier === void 0 || (_dossier$leasemaatsch7 = dossier.leasemaatschappij) === null || _dossier$leasemaatsch7 === void 0 ? void 0 : _dossier$leasemaatsch7.title) !== null && _ref8 !== void 0 ? _ref8 : leaseBedrijfName) !== null && _ref7 !== void 0 ? _ref7 : undefined,
194
206
  leasemaatschappijContactpersoonNaam: (_dossier$leasemaatsch8 = dossier === null || dossier === void 0 ? void 0 : dossier.leasemaatschappijContactpersoonNaam) !== null && _dossier$leasemaatsch8 !== void 0 ? _dossier$leasemaatsch8 : undefined,
package/dist/src/shared/__helpers__/openingHours.js ADDED
@@ -0,0 +1,211 @@
1
+ "use strict";
2
+
3
+ require("core-js/modules/es.parse-int.js");
4
+ require("core-js/modules/esnext.iterator.map.js");
5
+ require("core-js/modules/web.dom-collections.iterator.js");
6
+ Object.defineProperty(exports, "__esModule", {
7
+ value: true
8
+ });
9
+ exports.roundUpToTimeInterval = exports.parseTimeOnDate = exports.isTimeWithinBounds = exports.isAppointmentDateSelectable = exports.getOpeningDayKey = exports.getDaySchedule = exports.getAppointmentTimeBounds = exports.getAppointmentIncludeDates = exports.copyTimeToDate = void 0;
10
+ require("core-js/modules/es.parse-int.js");
11
+ require("core-js/modules/esnext.iterator.map.js");
12
+ require("core-js/modules/web.dom-collections.iterator.js");
13
+ var _dateFns = require("date-fns");
14
+ const OPENING_DAY_KEYS_BY_GET_DAY = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
15
+ const TIME_INTERVAL_MINUTES = 15;
16
+ const DEFAULT_INCLUDE_DATES_DAYS_AHEAD = 365;
17
+
18
+ /**
19
+ * @param {Date} date
20
+ * @returns {'sunday'|'monday'|'tuesday'|'wednesday'|'thursday'|'friday'|'saturday'}
21
+ */
22
+ const getOpeningDayKey = date => {
23
+ return OPENING_DAY_KEYS_BY_GET_DAY[(0, _dateFns.getDay)(date)];
24
+ };
25
+
26
+ /**
27
+ * @param {Record<string, { isOpen?: boolean, opensAt?: string|null, closesAt?: string|null }>|null|undefined} openingstijden
28
+ * @param {Date} date
29
+ */
30
+ exports.getOpeningDayKey = getOpeningDayKey;
31
+ const getDaySchedule = (openingstijden, date) => {
32
+ var _openingstijden$dayKe;
33
+ if (!openingstijden || !date) {
34
+ return null;
35
+ }
36
+ const dayKey = getOpeningDayKey(date);
37
+ return (_openingstijden$dayKe = openingstijden[dayKey]) !== null && _openingstijden$dayKe !== void 0 ? _openingstijden$dayKe : null;
38
+ };
39
+
40
+ /**
41
+ * @param {Record<string, { isOpen?: boolean, opensAt?: string|null, closesAt?: string|null }>|null|undefined} openingstijden
42
+ * @param {Date} date
43
+ * @returns {boolean}
44
+ */
45
+ exports.getDaySchedule = getDaySchedule;
46
+ const isAppointmentDateSelectable = (openingstijden, date) => {
47
+ if (!openingstijden || !date) {
48
+ return true;
49
+ }
50
+ const normalizedDate = (0, _dateFns.startOfDay)(date);
51
+ const schedule = getDaySchedule(openingstijden, normalizedDate);
52
+ return (schedule === null || schedule === void 0 ? void 0 : schedule.isOpen) === true;
53
+ };
54
+
55
+ /**
56
+ * @param {Record<string, { isOpen?: boolean, opensAt?: string|null, closesAt?: string|null }>|null|undefined} openingstijden
57
+ * @param {{ startDate?: Date, daysAhead?: number }} [options]
58
+ * @returns {Date[]|undefined}
59
+ */
60
+ exports.isAppointmentDateSelectable = isAppointmentDateSelectable;
61
+ const getAppointmentIncludeDates = exports.getAppointmentIncludeDates = function getAppointmentIncludeDates(openingstijden) {
62
+ let {
63
+ startDate = new Date(),
64
+ daysAhead = DEFAULT_INCLUDE_DATES_DAYS_AHEAD
65
+ } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
66
+ if (!openingstijden) {
67
+ return undefined;
68
+ }
69
+ const rangeStart = (0, _dateFns.startOfDay)(startDate);
70
+ const includeDates = [];
71
+ for (let i = 0; i < daysAhead; i += 1) {
72
+ const date = (0, _dateFns.addDays)(rangeStart, i);
73
+ if (isAppointmentDateSelectable(openingstijden, date)) {
74
+ includeDates.push(date);
75
+ }
76
+ }
77
+ return includeDates;
78
+ };
79
+
80
+ /**
81
+ * @param {string|null|undefined} timeString - "HH:mm"
82
+ * @param {Date} baseDate
83
+ * @returns {Date|null}
84
+ */
85
+ const parseTimeOnDate = (timeString, baseDate) => {
86
+ if (!timeString || !baseDate) {
87
+ return null;
88
+ }
89
+ const [hours, minutes] = timeString.split(':').map(num => parseInt(num, 10));
90
+ if (Number.isNaN(hours) || Number.isNaN(minutes)) {
91
+ return null;
92
+ }
93
+ const result = new Date(baseDate);
94
+ result.setHours(hours, minutes, 0, 0);
95
+ return result;
96
+ };
97
+
98
+ /**
99
+ * Copies hours and minutes from one date onto another calendar day.
100
+ * @param {Date} timeSource
101
+ * @param {Date} baseDate
102
+ * @returns {Date|null}
103
+ */
104
+ exports.parseTimeOnDate = parseTimeOnDate;
105
+ const copyTimeToDate = (timeSource, baseDate) => {
106
+ if (!timeSource || !baseDate) {
107
+ return null;
108
+ }
109
+ const source = new Date(timeSource);
110
+ const result = new Date(baseDate);
111
+ if (Number.isNaN(source.getTime()) || Number.isNaN(result.getTime())) {
112
+ return null;
113
+ }
114
+ result.setHours(source.getHours(), source.getMinutes(), 0, 0);
115
+ return result;
116
+ };
117
+
118
+ /**
119
+ * @param {Date} date
120
+ * @returns {Date}
121
+ */
122
+ exports.copyTimeToDate = copyTimeToDate;
123
+ const roundUpToTimeInterval = date => {
124
+ const rounded = new Date(date);
125
+ const minutes = rounded.getMinutes();
126
+ const remainder = minutes % TIME_INTERVAL_MINUTES;
127
+ if (remainder !== 0) {
128
+ rounded.setMinutes(minutes + (TIME_INTERVAL_MINUTES - remainder), 0, 0);
129
+ } else {
130
+ rounded.setSeconds(0, 0);
131
+ }
132
+ return rounded;
133
+ };
134
+
135
+ /**
136
+ * @param {Record<string, { isOpen?: boolean, opensAt?: string|null, closesAt?: string|null }>|null|undefined} openingstijden
137
+ * @param {Date} date
138
+ * @returns {{ minTime: Date|null, maxTime: Date|null }}
139
+ */
140
+ exports.roundUpToTimeInterval = roundUpToTimeInterval;
141
+ const getAppointmentTimeBounds = (openingstijden, date) => {
142
+ if (!date) {
143
+ return {
144
+ minTime: null,
145
+ maxTime: null
146
+ };
147
+ }
148
+ const schedule = getDaySchedule(openingstijden, date);
149
+ if (!(schedule !== null && schedule !== void 0 && schedule.isOpen) || !schedule.opensAt || !schedule.closesAt) {
150
+ return {
151
+ minTime: null,
152
+ maxTime: null
153
+ };
154
+ }
155
+ const opensAt = parseTimeOnDate(schedule.opensAt, date);
156
+ const closesAt = parseTimeOnDate(schedule.closesAt, date);
157
+ if (!opensAt || !closesAt) {
158
+ return {
159
+ minTime: null,
160
+ maxTime: null
161
+ };
162
+ }
163
+ let minTime = opensAt;
164
+ if ((0, _dateFns.isSameDay)((0, _dateFns.startOfDay)(date), (0, _dateFns.startOfDay)(new Date()))) {
165
+ const nowRounded = roundUpToTimeInterval(new Date());
166
+ if (nowRounded > minTime) {
167
+ minTime = nowRounded;
168
+ }
169
+ }
170
+ return {
171
+ minTime,
172
+ maxTime: closesAt
173
+ };
174
+ };
175
+
176
+ /**
177
+ * @param {Date|null|undefined} time
178
+ * @param {{ minTime: Date|null, maxTime: Date|null }} bounds
179
+ * @returns {boolean}
180
+ */
181
+ exports.getAppointmentTimeBounds = getAppointmentTimeBounds;
182
+ const isTimeWithinBounds = (time, bounds) => {
183
+ if (!time) {
184
+ return true;
185
+ }
186
+ const {
187
+ minTime,
188
+ maxTime
189
+ } = bounds;
190
+ if (!minTime && !maxTime) {
191
+ return true;
192
+ }
193
+ const selected = new Date(time);
194
+ const selectedMinutes = selected.getHours() * 60 + selected.getMinutes();
195
+ if (minTime) {
196
+ const min = new Date(minTime);
197
+ const minMinutes = min.getHours() * 60 + min.getMinutes();
198
+ if (selectedMinutes < minMinutes) {
199
+ return false;
200
+ }
201
+ }
202
+ if (maxTime) {
203
+ const max = new Date(maxTime);
204
+ const maxMinutes = max.getHours() * 60 + max.getMinutes();
205
+ if (selectedMinutes > maxMinutes) {
206
+ return false;
207
+ }
208
+ }
209
+ return true;
210
+ };
211
+ exports.isTimeWithinBounds = isTimeWithinBounds;
package/dist/src/shared/__pages__/internal/InternalSessionEditPage.js CHANGED
@@ -129,7 +129,6 @@ const InternalSessionEditPage = props => {
129
129
  const hydrateOrderSessionByDossier = (0, _react.useCallback)(async dossierById => {
130
130
  try {
131
131
  var _dossierById$akkoordO, _orderRes$data, _orderRes$data2, _session$discountCode, _session$customer, _sessionProducts$sele;
132
- console.log('dossierById', dossierById);
133
132
  const session = (0, _dossier.parseDossierToOrderSession)(dossierById);
134
133
  session.customerAgreed = (_dossierById$akkoordO = dossierById === null || dossierById === void 0 ? void 0 : dossierById.akkoordOpmerkingen) !== null && _dossierById$akkoordO !== void 0 ? _dossierById$akkoordO : false;
135
134
  const orderRes = await _authenticatedProxyApi.authenticatedProxyApi.getOrder(new URLSearchParams((0, _helpers__.removeNullishProps)(_objectSpread(_objectSpread({}, session), {}, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "thm-p3-configurator",
3
- "version": "0.0.404",
3
+ "version": "0.0.406",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.js",
6
6
  "author": "EnoRm.",