thm-p3-configurator 0.0.248 → 0.0.250

package/dist/src/shared/App.js

@@ -75,6 +75,6 @@ const App = () => {
     defaultCountry: APP_CONFIG.country
   }, /*#__PURE__*/_react.default.createElement(_OrderSessionContext.OrderSessionController, null, /*#__PURE__*/_react.default.createElement(_reactQuery.QueryClientProvider, {
     client: _queryClient.default
-  }, /*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react.default.createElement(_reactHotLoader.AppContainer, null, /*#__PURE__*/_react.default.createElement(_ActiveMarkerContext.ActiveMarkerProvider, null, /*#__PURE__*/_react.default.createElement(_StyleWrapper.default, null, !APP_CONFIG.internal && /*#__PURE__*/_react.default.createElement(_Navbar.default, null), APP_CONFIG.internal && /*#__PURE__*/_react.default.createElement(_InternalBranchSelectorModal.default, null), /*#__PURE__*/_react.default.createElement(_index.default, null))))))))));
+  }, /*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react.default.createElement(_reactHotLoader.AppContainer, null, /*#__PURE__*/_react.default.createElement(_ActiveMarkerContext.ActiveMarkerProvider, null, /*#__PURE__*/_react.default.createElement(_StyleWrapper.default, null, !APP_CONFIG.internal && /*#__PURE__*/_react.default.createElement(_Navbar.default, null), APP_CONFIG.internal && /*#__PURE__*/_react.default.createElement(_InternalBranchSelectorModal.default, null), APP_CONFIG.nodeEnv === 'development' && APP_CONFIG.internal === true && /*#__PURE__*/_react.default.createElement(_TEST_ONLY_INTERNAL_ROUTES.default, null))))))))));
 };
 var _default = exports.default = App;

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

@@ -690,7 +690,7 @@ const useMyBranches = formula => {
   const authSession = _LocalStorageWorker.lsw.get(_constants__.AUTH_SESSION_KEY);
   const myBranchesQuery = (0, _reactQuery.useQuery)({
     queryKey: ['me', 'branches', authSession, formula],
-    queryFn: () => _authenticatedProxyApi.authenticatedProxyApi.getMyBranchesByFormula(formula).then(userRes => userRes.data),
+    queryFn: () => _authenticatedProxyApi.authenticatedProxyApi.getMyBranchesByFormula(formula === _constants__.CONFIGURATOR_FORMULAS.THM ? _constants__.CONFIGURATOR_FORMULAS.TM : formula).then(userRes => userRes.data),
     enabled: !!authSession && !!formula
   });
   return {

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

@@ -7,9 +7,10 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _logoPrimaryIcon = _interopRequireDefault(require("../../../public/assets/images/logo-primary-icon.svg"));
 var _logoThcWhite = _interopRequireDefault(require("../../../public/assets/images/logo-thc-white.svg"));
+var _logoTmgPrimary = _interopRequireDefault(require("../../../public/assets/images/logo-tmg-primary.png"));
 var _constants__ = require("../__constants__");
-var _FormulaContext = require("../__context__/FormulaContext");
 var _helpers__ = require("../__helpers__");
+var _useBranchTheme = require("../__hooks__/useBranchTheme");
 function _interopRequireDefault(e) {
   return e && e.__esModule ? e : {
     default: e
@@ -20,7 +21,7 @@ const Header = _ref => {
     title,
     subtitle = ''
   } = _ref;
-  const formula = (0, _FormulaContext.useFormula)();
+  const theme = (0, _useBranchTheme.useBranchTheme)();
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)("hero hero--offset")
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -30,8 +31,8 @@ const Header = _ref => {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('col hero__logo-container')
   }, /*#__PURE__*/_react.default.createElement("img", {
-    className: (0, _helpers__.withStyle)('hero__logo'),
-    src: formula === _constants__.CONFIGURATOR_FORMULAS.THC ? _logoThcWhite.default : _logoPrimaryIcon.default,
+    className: (0, _helpers__.withStyle)("hero__logo ".concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'hero__logo--tmg' : '')),
+    src: theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? _logoThcWhite.default : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? _logoTmgPrimary.default : _logoPrimaryIcon.default,
     alt: "Trekhaak Montage"
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('hero__inner d-none d-lg-block')

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

@@ -6,10 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _logoThcWhite = _interopRequireDefault(require("../../../public/assets/images/logo-thc-white.svg"));
+var _logoTmgPrimary = _interopRequireDefault(require("../../../public/assets/images/logo-tmg-primary.png"));
 var _logoWhite = _interopRequireDefault(require("../../../public/assets/images/logo-white.svg"));
 var _constants__ = require("../__constants__");
-var _FormulaContext = require("../__context__/FormulaContext");
 var _helpers__ = require("../__helpers__");
+var _useBranchTheme = require("../__hooks__/useBranchTheme");
 function _interopRequireDefault(e) {
   return e && e.__esModule ? e : {
     default: e
@@ -19,9 +20,9 @@ const Navbar = _ref => {
   let {
     onPhoneClicked
   } = _ref;
-  const formula = (0, _FormulaContext.useFormula)();
+  const theme = (0, _useBranchTheme.useBranchTheme)();
   return /*#__PURE__*/_react.default.createElement("nav", {
-    className: (0, _helpers__.withStyle)("navbar fixed-top ".concat(formula === _constants__.CONFIGURATOR_FORMULAS.THC ? 'thc' : ''))
+    className: (0, _helpers__.withStyle)("navbar fixed-top ".concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? 'thc' : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'tmg' : ''))
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('container-fluid')
   }, /*#__PURE__*/_react.default.createElement("a", {
@@ -29,7 +30,7 @@ const Navbar = _ref => {
     href: APP_CONFIG.websiteHost
   }, /*#__PURE__*/_react.default.createElement("img", {
     className: (0, _helpers__.withStyle)('img-fluid'),
-    src: formula === _constants__.CONFIGURATOR_FORMULAS.THC ? _logoThcWhite.default : _logoWhite.default,
+    src: theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? _logoThcWhite.default : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? _logoTmgPrimary.default : _logoWhite.default,
     alt: "Trekhaakmontage"
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('navbar__phone ms-10 d-none d-sm-flex')

package/dist/src/shared/__components__/ProductCard/ProductCardCheckbox.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _constants__ = require("../../__constants__");
-var _FormulaContext = require("../../__context__/FormulaContext");
+var _useBranchTheme = require("../../__hooks__/useBranchTheme");
 var _helpers__ = require("../../__helpers__");
 function _interopRequireDefault(e) {
   return e && e.__esModule ? e : {
@@ -19,7 +19,7 @@ const ProductCardCheckbox = _ref => {
     isDisabled,
     id
   } = _ref;
-  const formula = (0, _FormulaContext.useFormula)();
+  const theme = (0, _useBranchTheme.useBranchTheme)();
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('align-items-center d-flex position-relative')
   }, /*#__PURE__*/_react.default.createElement("input", {
@@ -30,7 +30,7 @@ const ProductCardCheckbox = _ref => {
     readOnly: true,
     checked: defaultChecked
   }), /*#__PURE__*/_react.default.createElement("label", {
-    className: (0, _helpers__.withStyle)("btn ".concat(formula === _constants__.CONFIGURATOR_FORMULAS.THC ? 'btn-outline-custom-primary' : 'btn-outline-primary', " ")),
+    className: (0, _helpers__.withStyle)("btn ".concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? 'btn-outline-custom-primary' : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'btn-outline-tmg-primary' : 'btn-outline-primary', " ")),
     htmlFor: "btn-check-".concat(id),
     disabled: isDisabled
   }, defaultChecked ? 'Geselecteerd' : 'Selecteer'));

package/dist/src/shared/__components__/ProductCard/index.js

@@ -166,7 +166,8 @@ const ProductCard = _ref => {
   }, isTmg ? "".concat((_stock$quantity2 = stock === null || stock === void 0 ? void 0 : stock.quantity) !== null && _stock$quantity2 !== void 0 ? _stock$quantity2 : 0, " op voorraad") : 'Op voorraad')), hasCheckbox && /*#__PURE__*/_react.default.createElement(_ProductCardCheckbox.default, {
     id: productId,
     isDisabled: isDisabled,
-    defaultChecked: isSelected
+    defaultChecked: isSelected,
+    isTmg: isTmg
   })))))));
 };
 var _default = exports.default = ProductCard;

package/dist/src/shared/__components__/Spinners/FullPageSpinner.js

@@ -10,10 +10,11 @@ exports.default = void 0;
 require("core-js/modules/web.dom-collections.iterator.js");
 var _react = _interopRequireWildcard(require("react"));
 var _logoThcWhite = _interopRequireDefault(require("../../../../public/assets/images/logo-thc-white.svg"));
+var _logoTmgPrimary = _interopRequireDefault(require("../../../../public/assets/images/logo-tmg-primary.png"));
 var _logoWhite = _interopRequireDefault(require("../../../../public/assets/images/logo-white.png"));
 var _constants__ = require("../../__constants__");
-var _FormulaContext = require("../../__context__/FormulaContext");
 var _helpers__ = require("../../__helpers__");
+var _useBranchTheme = require("../../__hooks__/useBranchTheme");
 function _interopRequireDefault(e) {
   return e && e.__esModule ? e : {
     default: e
@@ -49,12 +50,12 @@ const FullPageSpinner = _ref => {
     children
   } = _ref;
   const [hasRendered, setHasRendered] = (0, _react.useState)();
-  const formula = (0, _FormulaContext.useFormula)();
+  const theme = (0, _useBranchTheme.useBranchTheme)();
   (0, _react.useEffect)(() => {
     setHasRendered(true);
   }, []);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _helpers__.withStyle)("loader ".concat(formula === _constants__.CONFIGURATOR_FORMULAS.THC ? 'thc' : ''))
+    className: (0, _helpers__.withStyle)("loader ".concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? 'thc' : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'tmg' : ''))
   }, hasRendered !== true ? /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement("i", {
     className: (0, _helpers__.withStyle)('loader__icon')
   })) : /*#__PURE__*/_react.default.createElement("span", {
@@ -63,7 +64,7 @@ const FullPageSpinner = _ref => {
     className: "fas fa-cog fa-spin"
   }), ' '), children ? children : /*#__PURE__*/_react.default.createElement("img", {
     className: (0, _helpers__.withStyle)('loader__logo'),
-    src: formula === _constants__.CONFIGURATOR_FORMULAS.THC ? _logoThcWhite.default : _logoWhite.default,
+    src: theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? _logoThcWhite.default : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? _logoTmgPrimary.default : _logoWhite.default,
     alt: "Trekhaak Montage - Configurator"
   }));
 };

package/dist/src/shared/__constants__/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.VESTIGING_TYPE_ID = exports.VEHICLE_SINGLE_ORDER_OWNERSHIP_TYPE = exports.VEHICLE_OWNERSHIP_TYPE = exports.VEHICLE_CODING_SUBGROUP_NAME = exports.USER_GEOLOCATION_KEY = exports.TMG_ORGANIZATION_TYPE = exports.StockStatus = exports.STATUS_ASSESSMENT = exports.PRODUCT_CATEGORIES = exports.PRIVATE_SINGLE_ORDER_SESSION_KEY = exports.PARTNER_PORTAL_PAGE_TITLES_BY_THEME = exports.PARTNER_PORTAL_CHANNEL_TITLE = exports.ORDER_SESSION_KEY = exports.NO_PRODUCTS_CONTACT_DETAILS_BY_FORMULA = exports.NAVIGATION_STEPS_INTERNAL = exports.NAVIGATION_STEPS_EXTERNAL = exports.NAVIGATION_BUTTONS = exports.MOUSE_EXIT_INTENT_THROTTLE = exports.MOUSE_EXIT_INTENT_OFFSET = exports.LOCATION_TYPE = exports.LOCATION_CHANGE_BUTTON_LABEL = exports.LOCALE = exports.LEASE_TYPE_ID = exports.FORM_ERROR_MESSAGES = exports.DOSSIER_TYPES = exports.DISCOUNT_TYPES = exports.DEFAULT_MAP_LONGITUDE = exports.DEFAULT_MAP_LATITUDE = exports.DEFAULT_ARTICLE_BRAND = exports.DAY_NAMES = exports.CONFIGURATOR_FORMULAS = exports.BRANCH_THEME_BY_FORMULA = exports.BRANCH_FORMULAS = exports.BOARD_COMPUTER_DISABLED_KEY = exports.AUTH_SESSION_KEY = exports.ARTICLE_SPECS_TRANSLATIONS = exports.ARTICLES_SYSTEM_FIELDS = exports.API_ERROR_CODES = exports.ANWB_DISCOUNT_CODE = exports.ALL_EXPERIMENTS = exports.ACTIVE_VARIANTS = void 0;
+exports.mapBranchFormulaToConfiguratorFormula = exports.VESTIGING_TYPE_ID = exports.VEHICLE_SINGLE_ORDER_OWNERSHIP_TYPE = exports.VEHICLE_OWNERSHIP_TYPE = exports.VEHICLE_CODING_SUBGROUP_NAME = exports.USER_GEOLOCATION_KEY = exports.TMG_ORGANIZATION_TYPE = exports.StockStatus = exports.STATUS_ASSESSMENT = exports.PRODUCT_CATEGORIES = exports.PRIVATE_SINGLE_ORDER_SESSION_KEY = exports.PARTNER_PORTAL_PAGE_TITLES_BY_THEME = exports.PARTNER_PORTAL_CHANNEL_TITLE = exports.ORDER_SESSION_KEY = exports.NO_PRODUCTS_CONTACT_DETAILS_BY_FORMULA = exports.NAVIGATION_STEPS_INTERNAL = exports.NAVIGATION_STEPS_EXTERNAL = exports.NAVIGATION_BUTTONS = exports.MOUSE_EXIT_INTENT_THROTTLE = exports.MOUSE_EXIT_INTENT_OFFSET = exports.LOCATION_TYPE = exports.LOCATION_CHANGE_BUTTON_LABEL = exports.LOCALE = exports.LEASE_TYPE_ID = exports.FORM_ERROR_MESSAGES = exports.DOSSIER_TYPES = exports.DISCOUNT_TYPES = exports.DEFAULT_MAP_LONGITUDE = exports.DEFAULT_MAP_LATITUDE = exports.DEFAULT_ARTICLE_BRAND = exports.DAY_NAMES = exports.CONFIGURATOR_FORMULAS = exports.BRANCH_THEME_BY_FORMULA = exports.BRANCH_FORMULAS = exports.BOARD_COMPUTER_DISABLED_KEY = exports.AUTH_SESSION_KEY = exports.ARTICLE_SPECS_TRANSLATIONS = exports.ARTICLES_SYSTEM_FIELDS = exports.API_ERROR_CODES = exports.ANWB_DISCOUNT_CODE = exports.ALL_EXPERIMENTS = exports.ACTIVE_VARIANTS = void 0;
 const DOSSIER_TYPES = exports.DOSSIER_TYPES = {
   Quotation: 'quotation',
   AppointmentRequest: 'appointment-request',
@@ -212,7 +212,10 @@ const StockStatus = exports.StockStatus = {
 const CONFIGURATOR_FORMULAS = exports.CONFIGURATOR_FORMULAS = {
   THM: 'THM',
   THC: 'THC',
-  TMG: 'TMG'
+  TMG: 'TMG',
+  TM: 'TMG',
+  TH: 'TH',
+  TowMotive: 'TowMotive'
 };
 const NO_PRODUCTS_CONTACT_DETAILS_BY_FORMULA = exports.NO_PRODUCTS_CONTACT_DETAILS_BY_FORMULA = {
   [CONFIGURATOR_FORMULAS.THM]: {
@@ -235,10 +238,46 @@ const NO_PRODUCTS_CONTACT_DETAILS_BY_FORMULA = exports.NO_PRODUCTS_CONTACT_DETAI
     phoneHref: 'tel:+31852030167',
     companyName: 'TowMotive Group',
     logoAltText: 'TowMotive Group Logo'
+  },
+  [CONFIGURATOR_FORMULAS.TH]: {
+    email: 'order@towmotivegroup.com',
+    phoneDisplay: '+31 85 - 203 0167',
+    phoneHref: 'tel:+31852030167',
+    companyName: 'TowMotive Group',
+    logoAltText: 'TowMotive Group Logo'
+  },
+  [CONFIGURATOR_FORMULAS.TowMotive]: {
+    email: 'order@towmotivegroup.com',
+    phoneDisplay: '+31 85 - 203 0167',
+    phoneHref: 'tel:+31852030167',
+    companyName: 'TowMotive Group',
+    logoAltText: 'TowMotive Group Logo'
   }
 };
 const LOCATION_CHANGE_BUTTON_LABEL = exports.LOCATION_CHANGE_BUTTON_LABEL = 'Wijzig de locatie';
 const TMG_ORGANIZATION_TYPE = exports.TMG_ORGANIZATION_TYPE = 'TowMotive Group';
+
+/**
+ * Maps branch formula values to CONFIGURATOR_FORMULAS
+ */
+const mapBranchFormulaToConfiguratorFormula = branchFormula => {
+  if (!branchFormula) return CONFIGURATOR_FORMULAS.THM;
+  switch (branchFormula.toLowerCase()) {
+    case 'towmotive':
+    case 'th':
+      return CONFIGURATOR_FORMULAS.TowMotive;
+    case 'tmg':
+      return CONFIGURATOR_FORMULAS.TMG;
+    case 'thc':
+      return CONFIGURATOR_FORMULAS.THC;
+    case 'thm':
+    case 'trekhaakmontage':
+      return CONFIGURATOR_FORMULAS.THM;
+    default:
+      return CONFIGURATOR_FORMULAS.THM;
+  }
+};
+exports.mapBranchFormulaToConfiguratorFormula = mapBranchFormulaToConfiguratorFormula;
 const LOCATION_TYPE = exports.LOCATION_TYPE = 'Vestiging';
 const ANWB_DISCOUNT_CODE = exports.ANWB_DISCOUNT_CODE = 'ANWBTHC25';
 const AUTH_SESSION_KEY = exports.AUTH_SESSION_KEY = '__authSession';

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

@@ -11,8 +11,8 @@ require("core-js/modules/web.dom-collections.iterator.js");
 var _react = _interopRequireWildcard(require("react"));
 var _reactRouter = require("react-router");
 var _constants__ = require("../__constants__");
-var _FormulaContext = require("../__context__/FormulaContext");
 var _helpers__ = require("../__helpers__");
+var _useBranchTheme = require("../__hooks__/useBranchTheme");
 function _getRequireWildcardCache(e) {
   if ("function" != typeof WeakMap) return null;
   var r = new WeakMap(),
@@ -43,7 +43,7 @@ const StyleWrapper = _ref => {
     children
   } = _ref;
   const [height, setHeight] = _react.default.useState({});
-  const formula = (0, _FormulaContext.useFormula)();
+  const theme = (0, _useBranchTheme.useBranchTheme)();
   (0, _react.useLayoutEffect)(() => {
     window.addEventListener('resize', handleResize);
     handleResize();
@@ -68,7 +68,7 @@ const StyleWrapper = _ref => {
     }
   };
   return /*#__PURE__*/_react.default.createElement("main", {
-    className: (0, _helpers__.withStyle)("thm-configurator ".concat(APP_CONFIG.internal ? 'thm-configurator--offset' : '', " ").concat(formula === _constants__.CONFIGURATOR_FORMULAS.THC ? 'thc' : '')),
+    className: (0, _helpers__.withStyle)("thm-configurator ".concat(APP_CONFIG.internal ? 'thm-configurator--offset' : '', " ").concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? 'thc' : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'tmg' : '')),
     style: height
   }, children);
 };

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

@@ -361,7 +361,7 @@ const InternalAppointmentForm = _ref => {
           isTmg: isTmg
         }
       });
-      await onSubmit((0, _helpers__.removeNullishProps)({
+      await onSubmit((0, _helpers__.removeNullishProps)(_objectSpread(_objectSpread({
         vehicle,
         customer: (0, _helpers__.removeNullishProps)(_objectSpread(_objectSpread({}, customer), {}, {
           firstName: (_customer$firstName = customer === null || customer === void 0 ? void 0 : customer.firstName) !== null && _customer$firstName !== void 0 ? _customer$firstName : undefined,
@@ -397,8 +397,12 @@ const InternalAppointmentForm = _ref => {
           code: discountCode,
           amount: discountAmount,
           percentage: discountPercentage
-        }),
-        formula,
+        })
+      }, formula === _constants__.CONFIGURATOR_FORMULAS.THM ? {
+        formula: _constants__.CONFIGURATOR_FORMULAS.TM
+      } : {
+        formula
+      }), {}, {
         branchId: selectedBranch,
         selectBoardComputerUpdate: selectedBoardComputer != null,
         cart: (0, _product.validateCartInput)([{
@@ -417,7 +421,7 @@ const InternalAppointmentForm = _ref => {
             quantity: extraQuantity
           };
         }), ...selectedDiscountedProducts])
-      }));
+      })));
     } catch (ex) {
       console.error("handleSubmit(): ".concat(ex));
       setErrors(function () {

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

@@ -339,7 +339,7 @@ const InternalQuotationForm = _ref => {
           isTmg
         }
       });
-      await onSubmit((0, _helpers__.removeNullishProps)({
+      await onSubmit((0, _helpers__.removeNullishProps)(_objectSpread(_objectSpread({
         vehicle,
         customer: (0, _helpers__.removeNullishProps)(_objectSpread(_objectSpread({}, customer), {}, {
           firstName: (_customer$firstName = customer === null || customer === void 0 ? void 0 : customer.firstName) !== null && _customer$firstName !== void 0 ? _customer$firstName : undefined,
@@ -369,8 +369,12 @@ const InternalQuotationForm = _ref => {
           amount: discountAmount,
           percentage: discountPercentage
         }),
-        priceCalculationDate,
-        formula,
+        priceCalculationDate
+      }, formula === _constants__.CONFIGURATOR_FORMULAS.THM ? {
+        formula: _constants__.CONFIGURATOR_FORMULAS.TM
+      } : {
+        formula
+      }), {}, {
         branchId: selectedBranch,
         selectBoardComputerUpdate: selectedBoardComputer != null,
         cart: (0, _product.validateCartInput)([{
@@ -389,7 +393,7 @@ const InternalQuotationForm = _ref => {
             quantity: extraQuantity
           };
         }), ...selectedDiscountedProducts])
-      }));
+      })));
     } catch (ex) {
       console.error("handleSubmit(): ".concat(ex));
       setErrors(function () {

package/dist/src/shared/__helpers__/singleOrderArticles.js

@@ -187,11 +187,15 @@ const fetchArticlesByArticleNumbers = exports.fetchArticlesByArticleNumbers = as
 const fetchPartStockLevels = exports.fetchPartStockLevels = async function fetchPartStockLevels(part, branchId) {
   var _response$data$data;
   let formula = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
-  const partParamsString = new URLSearchParams((0, _index.removeNullishProps)({
-    branchId,
-    formula,
+  const partParamsString = new URLSearchParams((0, _index.removeNullishProps)(_objectSpread(_objectSpread({
+    branchId
+  }, formula != undefined && formula === _index2.CONFIGURATOR_FORMULAS.THM ? {
+    formula: _index2.CONFIGURATOR_FORMULAS.TM
+  } : {
+    formula
+  }), {}, {
     parts: JSON.stringify([part])
-  })).toString();
+  }))).toString();
   const response = await _authenticatedProxyApi.authenticatedProxyApi.getArticlePrices(partParamsString);
   if (!(response !== null && response !== void 0 && response.data)) {
     throw new Error('No response from the API');
@@ -213,6 +217,7 @@ const enrichArticlesWithBrandsAndPrices = exports.enrichArticlesWithBrandsAndPri
   const articleBrandQueryString = new URLSearchParams({
     articleNumbers: JSON.stringify(articleNumbers)
   }).toString();
+  formula = formula === _index2.CONFIGURATOR_FORMULAS.THM ? _index2.CONFIGURATOR_FORMULAS.TM : formula;
   const brandResponse = await _authenticatedProxyApi.authenticatedProxyApi.getBrandsByArticleNumbers(articleBrandQueryString);
   if (!(brandResponse !== null && brandResponse !== void 0 && brandResponse.data)) {
     throw new Error('Failed to fetch the brands of the articles');

package/dist/src/shared/__hooks__/useBranchTheme.js

@@ -23,14 +23,19 @@ const useBranchTheme = () => {
     }
     switch (formula) {
       case _constants__.BRANCH_FORMULAS.Trekhaakmontage:
+      case _constants__.CONFIGURATOR_FORMULAS.THM:
         {
           return _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakmontage;
         }
       case _constants__.BRANCH_FORMULAS.Trekhaakcentrum:
+      case _constants__.CONFIGURATOR_FORMULAS.THC:
         {
           return _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum;
         }
       case _constants__.BRANCH_FORMULAS.TowMotiveGroup:
+      case _constants__.CONFIGURATOR_FORMULAS.TMG:
+      case _constants__.CONFIGURATOR_FORMULAS.TH:
+      case _constants__.CONFIGURATOR_FORMULAS.TowMotive:
         {
           return _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup;
         }

package/dist/src/shared/__pages__/internal/InternalLicensePlatePage.js

@@ -20,6 +20,7 @@ var _QuestionsForm = _interopRequireDefault(require("../../__containers__/Questi
 var _FormulaContext = require("../../__context__/FormulaContext");
 var _OrderSessionContext = require("../../__context__/OrderSessionContext");
 var _helpers__ = require("../../__helpers__");
+var _useBranchTheme = require("../../__hooks__/useBranchTheme");
 var _useSearchParam = _interopRequireDefault(require("../../__hooks__/useSearchParam"));
 var _LicensePlateValidator = _interopRequireDefault(require("../../__services__/LicensePlateValidator"));
 function _interopRequireDefault(e) {
@@ -73,6 +74,7 @@ const InternalLicensePlatePage = () => {
   const [session, dispatch] = (0, _OrderSessionContext.useOrderSession)();
   const originalLicensePlate = (0, _react.useRef)();
   const formula = (0, _FormulaContext.useFormula)();
+  const theme = (0, _useBranchTheme.useBranchTheme)();
   const [licensePlateURL, discountCode, persistSession, notFound] = (0, _useSearchParam.default)(['licensePlate', 'discountCode', 'persistSession', 'notFound']);
   const history = (0, _reactRouter.useHistory)();
   (0, _queries.useProductFieldLabels)(); // Prefetch
@@ -124,7 +126,7 @@ const InternalLicensePlatePage = () => {
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('vh-100')
   }, /*#__PURE__*/_react.default.createElement(_internal.InternalCancelDossierEdit, null), /*#__PURE__*/_react.default.createElement("section", {
-    className: (0, _helpers__.withStyle)("thm-configurator-wrapper thm-configurator-home thm-configurator-wrapper--offset ".concat(formula === _constants__.CONFIGURATOR_FORMULAS.THC ? 'thc' : ''))
+    className: (0, _helpers__.withStyle)("thm-configurator-wrapper thm-configurator-home thm-configurator-wrapper--offset ".concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? 'thc' : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'tmg' : ''))
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('container')
   }, /*#__PURE__*/_react.default.createElement("div", {

package/dist/src/shared/__pages__/internal/InternalManualSelectionPage.js

@@ -18,6 +18,7 @@ var _internal = require("../../__containers__/internal");
 var _ManualSelectionForm = _interopRequireDefault(require("../../__containers__/ManualSelectionForm"));
 var _QuestionsForm = _interopRequireDefault(require("../../__containers__/QuestionsForm"));
 var _FormulaContext = require("../../__context__/FormulaContext");
+var _useBranchTheme = require("../../__hooks__/useBranchTheme");
 var _OrderSessionContext = require("../../__context__/OrderSessionContext");
 var _helpers__ = require("../../__helpers__");
 var _useSearchParam = _interopRequireDefault(require("../../__hooks__/useSearchParam"));
@@ -81,6 +82,7 @@ const InternalManualSelectionPage = _ref2 => {
   const originalVehicle = (0, _react.useRef)();
   const history = (0, _reactRouter.useHistory)();
   const formula = (0, _FormulaContext.useFormula)();
+  const theme = (0, _useBranchTheme.useBranchTheme)();
   const [discountCode, persistSession] = (0, _useSearchParam.default)(['discountCode', 'persistSession']);
   (0, _queries.useProductFieldLabels)(); // Prefetch
 
@@ -135,7 +137,7 @@ const InternalManualSelectionPage = _ref2 => {
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('vh-100')
   }, /*#__PURE__*/_react.default.createElement(_internal.InternalCancelDossierEdit, null), /*#__PURE__*/_react.default.createElement("section", {
-    className: (0, _helpers__.withStyle)("thm-configurator-wrapper thm-configurator-home thm-configurator-wrapper--offset ".concat(formula === _constants__.CONFIGURATOR_FORMULAS.THC ? 'thc' : '', " "))
+    className: (0, _helpers__.withStyle)("thm-configurator-wrapper thm-configurator-home thm-configurator-wrapper--offset ".concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? 'thc' : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'tmg' : '', " "))
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('container')
   }, /*#__PURE__*/_react.default.createElement("div", {

package/dist/src/shared/__pages__/internal/InternalNoProductsPage.js

@@ -16,6 +16,7 @@ var _constants__ = require("../../__constants__");
 var _internal = require("../../__containers__/internal");
 var _FormulaContext = require("../../__context__/FormulaContext");
 var _helpers__ = require("../../__helpers__");
+var _useBranchTheme = require("../../__hooks__/useBranchTheme");
 function _interopRequireDefault(e) {
   return e && e.__esModule ? e : {
     default: e
@@ -49,6 +50,7 @@ function _interopRequireWildcard(e, r) {
 const InternalNoProductsPage = () => {
   const mailLinkRef = (0, _react.useRef)(null);
   const formula = (0, _FormulaContext.useFormula)();
+  const theme = (0, _useBranchTheme.useBranchTheme)();
   const contactDetails = _constants__.NO_PRODUCTS_CONTACT_DETAILS_BY_FORMULA[formula] || _constants__.NO_PRODUCTS_CONTACT_DETAILS_BY_FORMULA[_constants__.CONFIGURATOR_FORMULAS.THM];
   const handleClick = () => {
     if (mailLinkRef.current) {
@@ -58,7 +60,7 @@ const InternalNoProductsPage = () => {
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('vh-100')
   }, /*#__PURE__*/_react.default.createElement(_internal.InternalCancelDossierEdit, null), /*#__PURE__*/_react.default.createElement("section", {
-    className: (0, _helpers__.withStyle)("thm-configurator-wrapper thm-configurator-home thm-configurator-wrapper--offset ".concat(formula === _constants__.CONFIGURATOR_FORMULAS.THC ? 'thc' : ''))
+    className: (0, _helpers__.withStyle)("thm-configurator-wrapper thm-configurator-home thm-configurator-wrapper--offset ".concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? 'thc' : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'tmg' : ''))
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('container')
   }, /*#__PURE__*/_react.default.createElement("div", {

package/dist/src/shared/__pages__/internal/InternalSingleOrderPage.js

@@ -349,18 +349,22 @@ const InternalSingleOrderPage = () => {
         var _response$data2;
         // Regular flow for offline orders
         const preferredDateTime = appointment !== null && appointment !== void 0 && appointment.date && appointment !== null && appointment !== void 0 && appointment.time ? (0, _helpers__.parseDateAndTimeToTimestamp)(appointment === null || appointment === void 0 ? void 0 : appointment.date, appointment === null || appointment === void 0 ? void 0 : appointment.time) : null;
-        const response = await createSingleOrder({
+        const response = await createSingleOrder(_objectSpread(_objectSpread({
           licensePlate: filters.licensePlate,
           model: filters.model,
           cart: singleOrderCart,
           vehicle: vehiclePayload,
-          customer,
-          formula,
+          customer
+        }, formula === _constants__.CONFIGURATOR_FORMULAS.THM ? {
+          formula: _constants__.CONFIGURATOR_FORMULAS.TM
+        } : {
+          formula
+        }), {}, {
           branchId: selectedBranch,
           channel,
           preferredDateTime,
           internalNote: internalNote === null || internalNote === void 0 ? void 0 : internalNote.internalNote
-        });
+        }));
         if (response !== null && response !== void 0 && (_response$data2 = response.data) !== null && _response$data2 !== void 0 && (_response$data2 = _response$data2.data) !== null && _response$data2 !== void 0 && _response$data2.entityId) {
           setCreatedEntityId(response.data.data.entityId);
         }

package/dist/src/shared/__pages__/internal/__TEST_ONLY_INTERNAL_ROUTES.js

@@ -10,7 +10,6 @@ var _react = _interopRequireDefault(require("react"));
 var _reactRouterDom = require("react-router-dom");
 var _ = require(".");
 var _internal = require("../../__containers__/internal");
-var _NoProductsPage = _interopRequireDefault(require("../NoProductsPage"));
 var _NotFoundPage = _interopRequireDefault(require("../NotFoundPage"));
 var _QuotationThanksPage = _interopRequireDefault(require("../QuotationThanksPage"));
 function _interopRequireDefault(e) {
@@ -39,7 +38,7 @@ const TEST_ONLY_INTERNAL_ROUTES = () => {
   }), /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, {
     exact: true,
     path: "/configurator/geen-producten",
-    render: props => /*#__PURE__*/_react.default.createElement(_NoProductsPage.default, props)
+    render: props => /*#__PURE__*/_react.default.createElement(_.InternalNoProductsPage, props)
   }), /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, {
     exact: true,
     path: "/configurator/montagelocatie",

package/dist/src/shared/__style__/_variables-external.scss

@@ -17,6 +17,9 @@ $primary: #213a7a;
 $secondary: #0f1223;
 $custom-secondary: #f8be2c87;
 $custom-primary: #f8bd2c;
+// TMG theme colors
+$tmg-primary: #000;
+$tmg-secondary: #41bbca;
 $success: $green;
 $info: $cyan;
 $warning: $yellow;
@@ -36,6 +39,8 @@ $theme-colors: (
   'primary-light': $primary-light,
   'custom-primary': $custom-primary,
   'custom-secondary': $custom-secondary,
+  'tmg-primary': $tmg-primary,
+  'tmg-secondary': $tmg-secondary,
   'secondary': $secondary,
   'success': $success,
   'info': $info,

package/dist/src/shared/__style__/_variables.scss

@@ -17,6 +17,9 @@ $primary: #213a7a;
 $secondary: #0f1223;
 $custom-secondary: #f8be2c87;
 $custom-primary: #f8bd2c;
+// TMG theme colors
+$tmg-primary: #41bbca;
+$tmg-secondary: #0d282c;
 $success: $green;
 $info: $cyan;
 $warning: $yellow;
@@ -36,6 +39,8 @@ $theme-colors: (
   'primary-light': $primary-light,
   'custom-primary': $custom-primary,
   'custom-secondary': $custom-secondary,
+  'tmg-primary': $tmg-primary,
+  'tmg-secondary': $tmg-secondary,
   'secondary': $secondary,
   'success': $success,
   'info': $info,

package/dist/src/shared/__style__/components/_loader.scss

@@ -22,3 +22,8 @@ Loader
 .loader__logo {
   @extend .mt-2;
 }
+
+.tmg .loader__logo {
+  max-width: 150px;
+  max-height: 150px;
+}

package/dist/src/shared/__style__/components/_navbar.scss

@@ -7,6 +7,10 @@ Navbar
   &.thc {
     @extend .bg-custom-primary;
   }
+
+  &.tmg {
+    @extend .bg-tmg-secondary;
+  }
   height: $navbar-height;
   z-index: $zindex-fixed;
 }
@@ -20,6 +24,14 @@ Navbar Brand
   }
 }
 
+.navbar.tmg .navbar-brand {
+  img {
+    max-width: 120px;
+    max-height: 40px;
+    width: auto;
+  }
+}
+
 /* ==========================================================================
 Navbar Phone
 ========================================================================== */

package/dist/src/shared/__style__/components/hero/_hero.scss

@@ -34,6 +34,17 @@ Hero Logo
   @include media-breakpoint-up(lg) {
     max-height: none;
   }
+
+  &--tmg {
+    height: auto;
+    max-height: 60px;
+    top: 50%;
+    transform: translateY(-50%);
+
+    @include media-breakpoint-up(lg) {
+      max-height: 80px;
+    }
+  }
 }
 
 /* ==========================================================================

package/dist/src/shared/__style__/configurator/_configurator.scss

@@ -21,6 +21,16 @@ Configurator
       @extend .bg-custom-primary;
     }
   }
+
+  &.tmg {
+    .loader {
+      @extend .bg-tmg-primary;
+    }
+
+    .hero {
+      @extend .bg-tmg-primary;
+    }
+  }
 }
 
 /* ==========================================================================
@@ -36,6 +46,111 @@ Configurator Wrapper
       border-color: $custom-primary !important;
     }
   }
+
+  &.tmg {
+    .btn-primary {
+      @extend .bg-tmg-primary;
+
+      border-color: $tmg-primary !important;
+    }
+  }
+}
+
+/* ==========================================================================
+Configurator TMG theme
+========================================================================== */
+.thm-configurator {
+  &.tmg {
+    .btn-primary {
+      @extend .bg-tmg-primary;
+
+      border-color: $tmg-primary !important;
+    }
+
+    .btn-outline-theme-primary {
+      border-color: $tmg-primary;
+      color: $tmg-primary;
+
+      &:hover {
+        background-color: $tmg-primary;
+        color: white;
+      }
+    }
+
+    .form-dots__item {
+      &.active {
+        background-color: $tmg-primary;
+      }
+    }
+
+    .card-footer {
+      .btn-check {
+        border-color: $tmg-primary;
+      }
+    }
+
+    .form__radio-item {
+      &:hover {
+        @extend .bg-tmg-secondary;
+      }
+    }
+
+    .list-check {
+      li {
+        &.info {
+          &::before {
+            background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='17.733' height='17.092' viewBox='0 0 17.733 17.092'><g id='i' transform='translate(-0.002 0.001)'><path id='Path_202' data-name='Path 202' d='M17.735,10.316l-.026-.076a1.689,1.689,0,0,0-.052-.357L15.393,2.772A1.41,1.41,0,0,0,14.326,1.8L6.936.044A1.485,1.485,0,0,0,5.505.452L.405,5.779A1.439,1.439,0,0,0,.067,7.206l2.264,7.112a1.41,1.41,0,0,0,1.067.969l7.39,1.759a1.485,1.485,0,0,0,1.431-.408l5.1-5.327a1.623,1.623,0,0,0,.416-.994Z' fill='#{$tmg-primary}'/><line id='Line_1' data-name='Line 1' y2='5' transform='translate(8.868 7.045)' fill='none' stroke='#fff' stroke-linecap='round' stroke-width='1.5'/><line id='Line_3' data-name='Line 3' transform='translate(8.868 5.045)' fill='none' stroke='#fff' stroke-linecap='round' stroke-width='1.5'/></g></svg>") !important;
+          }
+        }
+      }
+    }
+
+    .form-check--sm {
+      @extend .text-tmg-primary;
+
+      @include font-size($font-size-sm);
+    }
+
+    .form-check {
+      @include font-size($font-size-base);
+      color: $tmg-primary;
+    }
+
+    .dealer-item {
+      &.active {
+        border: 1px solid $tmg-primary;
+      }
+    }
+
+    .form__radio-default-item {
+      span {
+        &::after {
+          background-color: $tmg-primary;
+        }
+
+        &::before {
+          border: 1px solid $tmg-primary;
+        }
+      }
+    }
+
+    .steps {
+      .btn {
+        &.active {
+          @extend .bg-tmg-primary;
+        }
+      }
+    }
+
+    .card__link {
+      cursor: pointer;
+
+      &.card__horizontal.active,
+      &.card__horizontal:hover {
+        border-color: $tmg-primary !important;
+      }
+    }
+  }
 }
 
 /* ==========================================================================
@@ -53,6 +168,14 @@ Configurator Home
       .justify-content-center,
       .pb-0;
   }
+
+  &.tmg {
+    @extend .bg-tmg-primary,
+      .d-flex,
+      .flex-column,
+      .justify-content-center,
+      .pb-0;
+  }
 }
 
 /* ==========================================================================

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "thm-p3-configurator",
-  "version": "0.0.248",
+  "version": "0.0.250",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "author": "EnoRm.",