@bytebrand/fe-ui-core 4.3.1 → 4.4.0

package/source/framework/utils/CommonUtils.ts

@@ -7,23 +7,19 @@ import {
   DROP_DOWN_GROUP, RATE_DEFAULT, MMS_GROUPS_KEY, MMS_GROUP_FIELDS
 } from '../constants/SearchWidget';
 import { priceRatings, priceRatingConfig } from '../constants/price';
-import { GOOGLE_BUNDLE_COOKIES, HUNDRED } from '../constants/common';
+import { HUNDRED } from '../constants/common';
 import { offers } from '../constants';
 import { FILTERS_IN_TITLE, MANUFACTURER_KEY, MAX_FILTERS_IN_TITLE, MODEL_KEY } from '../constants/Search';
 import { SearchPage as SearchPageTranslate } from '../../locales/data';
+import { isArray } from 'lodash';
 
 const PRICE_DEFAULT = DROP_DOWN_GROUP[PRICE].defaultValue;
 
 declare global {
   // tslint:disable-next-line:interface-name
   interface Window {
-    grantHotjarCookieConsent?: () => void;
-    grantCookieConsentClarity?: () => void;
-    grantCookieConsentMicrosoft?: () => void;
-    grantCookieConsentFacebook?: () => void;
     grantCookieConsentSentry?: () => void;
-    grantCookieConsent?: (list: string[]) => void;
-    allowGoogle?: () => void;
+    grantCookieConsent?: (disabledCookies: string[]) => void;
   }
 }
 
@@ -220,10 +216,11 @@ export const buildQueryForSearch = (filters: any) => {
 
     if (filterValue && filterValue.value) {
       if (MMS_GROUP_FIELDS.indexOf(filter) !== -1) {
-        MMS_GROUP[filter] = filterValue.value;
 
         if (filterValue.isSeries) {
           MMS_GROUP.SERIES = filterValue.value;
+        } else {
+          MMS_GROUP[filter] = filterValue.value;
         }
       }
     }
@@ -376,15 +373,19 @@ export const getOfferSliders = (financingConfig: any, t: (key: string, options?:
     financingConfig.common ?
     financingConfig.common.currentSalesPrice :
     financingConfig.currentSalesPrice; // TODO: fix deprecated. Correct is "financingConfig.common.currentSalesPrice"
-  return offerObj.sliders
-    .map((slider: any, index) => {
-      if (componentType === 'checkout' && index === 1 && priceTabIndex === 0) return; // remove checkout annual mileage for financing
-      if (slider.name === 'firstInstallment') slider.max = offerConfig.firstInstallmentMax || currentSalesPrice;
-      slider.value = offerConfig[slider.name];
-      slider.unitName = t(`modals:financing.${slider.unit}`);
-      slider.caption = t(`modals:financing.${slider.name}`);
-      return slider;
-    }).filter(Boolean);
+  if (isArray(offerObj.sliders)) {
+    const sliders: any = offerObj.sliders;
+    return sliders
+        .map((slider: any, index: number) => {
+          if (componentType === 'checkout' && index === 1 && priceTabIndex === 0) return; // remove checkout annual mileage for financing
+          if (slider.name === 'firstInstallment') slider.max = offerConfig.firstInstallmentMax || currentSalesPrice;
+          slider.value = offerConfig[slider.name];
+          slider.unitName = t(`modals:financing.${slider.unit}`);
+          slider.caption = t(`modals:financing.${slider.name}`);
+          return slider;
+        }).filter(Boolean);
+  }
+
 };
 
 export const checkWebpFeature = async () => {
@@ -462,7 +463,9 @@ export function getChipFilterValue(
     case 'SEATS':
     case 'CUBIC_CAPACITY':
       title = t(`SearchPage:filters.${chipFilterKey.toLocaleLowerCase()}`);
-      const fromTo = `${chipFilterValue.from} - ${chipFilterValue.to}`;
+      from = !!chipFilterValue.from ? `${t('SearchPage:filters.from')} ${chipFilterValue.from}` : '';
+      to = !!chipFilterValue.to ? `${t('SearchPage:filters.to')} ${chipFilterValue.to}` : '';
+      const fromTo = (from && to) ? `${chipFilterValue.from} - ${chipFilterValue.to}` : `${from || to}`;
       filterValue = `${title} ${fromTo}`;
       break;
 
@@ -544,64 +547,29 @@ export function setUtmParameters() {
   const domain = parsedUrl.hostname.split('.').slice(-2).join('.');
 
   document.cookie = `marketing=${JSON.stringify(marketing)};expires=${expiresDate};domain=.${domain};path=/`;
+  
 }
 
 export const updateCookieList = (handleSentryInit: () => void) => {
-  let cookieConsentList = Object.keys(GOOGLE_BUNDLE_COOKIES);
-  let isHomeGoogleGranted = true; // home page google cookie
-  let isMicrosoftGranted = true; // Microsoft _uetvid _uetsid
-  let isMicrosoftClarity = true; // Microsoft Clarity _clck _clsk
-  let isFacebookGranted = true; // Facebook Clarity _fbp _f
-  let isSentryGranted = true; // Sentry
-  let isHotjarGranted = true;
   const cookieConfig = JSON.parse(localStorage.getItem('cookieConfig')) || {};
-
+  let isSentryGranted = true; // Sentry
+  let disabledCookies: any[] = [];
   const parsedUrl = new URL(window.location.href);
   const domain = parsedUrl.hostname.split('.').slice(-2).join('.');
+
   Object.keys(cookieConfig).forEach((group: string) => {
     cookieConfig[group].forEach((cookie: string) => {
       Cookies.remove(cookie, { domain, path: '/' }); // manually remove selected cookies
-      // google
-      if (cookieConsentList.includes(cookie)) {
-        cookieConsentList = cookieConsentList.filter(i => i !== cookie);  // deny google cookie consent for _gcl_au, _ga, _gid, _gat_UA-31842-13, etc
-
-        isHomeGoogleGranted = false;
+      if (cookie === 'sentry') {
+        isSentryGranted = false;
       }
-      else if (cookie === 'hotjar') isHotjarGranted = false;
-      else if (cookie === '_uetvid' || cookie === '_uetsid') isMicrosoftGranted = false;
-      else if (cookie === '_clck' || cookie === '_clsk') isMicrosoftClarity = false;
-      else if (cookie === '_fbp') isFacebookGranted = false;
-      else if (cookie === 'sentry') isSentryGranted = false;
+      disabledCookies.push(cookie);
     });
   });
 
   // grant google cookies
   if (typeof window.grantCookieConsent === 'function') {
-    window.grantCookieConsent(cookieConsentList);
-  };
-
-  // grant Microsoft cookies
-  if (isMicrosoftGranted && typeof window.grantCookieConsentMicrosoft === 'function') {
-    window.grantCookieConsentMicrosoft();
-  }
-
-  // grant Microsoft Clarity cookies
-  if (isMicrosoftClarity && typeof window.grantCookieConsentClarity === 'function') {
-    window.grantCookieConsentClarity();
-  }
-
-  // grant Facebook cookies
-  if (!isFacebookGranted && typeof window.grantCookieConsentFacebook === 'function') {
-    window.grantCookieConsentFacebook();
-  };
-
-  if (isHomeGoogleGranted && typeof window.allowGoogle === 'function') {
-    window.allowGoogle();
-  }
-
-  // grant Hotjar cookies
-  if (isHotjarGranted && typeof window.grantHotjarCookieConsent === 'function') {
-    window.grantHotjarCookieConsent();
+    window.grantCookieConsent(disabledCookies);
   }
 
   // grant Sentry cookies
@@ -619,6 +587,49 @@ export const getCents = (value: number, prefix?: string, postfix?: string): stri
   return `${prefix}${result}${postfix}`;
 };
 
+/**
+ * Generates a timestamp (Unix time) after 14 days from the current date.
+ * @returns {number} Timestamp (Unix time) after 14 days.
+ */
+export const getUnixTimestampAfterTwoWeeks = () => {
+  const currentDate = new Date();
+  const futureDate = new Date();
+
+  futureDate.setDate(currentDate.getDate() + 14);
+
+  const unixTimestamp = Math.floor(futureDate.getTime() / 1000);
+  return unixTimestamp;
+};
+
+/**
+ * Converts a Unix timestamp to the day of the month.
+ * @param {number} unixTimestamp - The Unix timestamp to convert.
+ * @returns {number} Return the number of days as the result
+ */
+export const convertUnixTimestampToDays = (unixTimestamp: number) => {
+  const milliseconds = Number(unixTimestamp * 1000);
+  const date = new Date(milliseconds);
+  const currentDate = new Date();
+
+  // Calculate the difference between the current date and the obtained date
+  const timeDifference = currentDate.getTime() - date.getTime();
+  const daysDifference = -Math.floor(timeDifference / (1000 * 3600 * 24));
+  return daysDifference;
+};
+
 export const priceParse = (value: any) => {
   return !!value ? Number.parseFloat(value) : null;
-};
+};
+
+// iPad on iOS 13 detection
+export const iOS = () => {
+  return [
+    'iPad Simulator',
+    'iPhone Simulator',
+    'iPod Simulator',
+    'iPad',
+    'iPhone',
+    'iPod'
+  ].includes(navigator.platform)
+  || (navigator.userAgent.includes("Mac") && "ontouchend" in document)
+}

package/source/framework/utils/DateUtils.ts

@@ -8,10 +8,10 @@ export interface IFormatTimestamp {
 
 export const timestampToDate = (timestamp: number) => {
   if (!timestamp) return 'N/A';
-  const date = new Date(timestamp * 1000);// tslint:disable-line
+  const date = new Date(timestamp * 1000);
   const year = date.getFullYear();
   const month = date.getMonth() + 1;
-  const monthFormatted = month < 10 ? '0' + month : month;// tslint:disable-line
+  const monthFormatted = month < 10 ? `0${month}` : month;
   return (`${monthFormatted}/${year}`);
 };
 
@@ -91,3 +91,11 @@ export const getYears = (minYear = 1980, maxYear = moment().year(), reverse = fa
 export const createDateAsUTC = (date: Date): Date => new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds()));
 
 // end for checkout datepicker
+
+export const fromUTCToDateString = (UTCDate: Date) => {
+  const date = new Date(UTCDate);
+  const day = date.getUTCDate().toString().padStart(2, '0');
+  const month = (date.getUTCMonth() + 1).toString().padStart(2, '0');
+  const year = date.getUTCFullYear();
+  return `${day}.${month}.${year}`;
+}

package/source/framework/vehiclesProps/decoratedLightProps.tsx

@@ -1,7 +1,6 @@
 /* tslint:disable */
 import * as React from 'react';
 // import { cbdGearbox, cbdFuel } from './cbdSelectors'
-import { isNull } from 'util';
 import { formatMileage } from '../utils/CommonUtils';
 import { formatTimestamp } from '../utils/DateUtils';
 import { DELIVERY_PERIODS_EXTRA } from '../constants';
@@ -19,7 +18,7 @@ const isPropDefined = (prop: any) => {
       && prop.indexOf('unknown') === -1
       && prop.indexOf('N/A') === -1;
   }
-  return !isNull(prop) && type !== 'undefined';
+  return !(prop === undefined || prop === null) && type !== 'undefined';
 };
 
 const formatDeliveryPeriod = (t: (phrase: string, config?: any) => string, deliveryPeriod: string) => {

package/source/framework/vehiclesProps/decoratedProps.tsx

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { isNull } from 'util';
 import moment from 'moment';
 
 import Icon from '../../components/_common/IconContainer/IconContainer';
@@ -25,7 +24,7 @@ const isPropDefined = (prop: any) => {
     return prop.indexOf('other') === -1
       && prop.indexOf('unknown') === -1;
   }
-  return !isNull(prop) && type !== 'undefined';
+  return !(prop === undefined || prop === null) && type !== 'undefined';
 };
 
 const isCheckedBatteryTime = (prop: any, t: (key: string, options?: object) => string) => {

package/source/locales/data.ts

@@ -56,7 +56,7 @@ export const vehicleProps = (car?: any, isOfferAvailable: boolean = true) => {
         na: 'N/A',
         priceSub: '/mtl.',
         priceSubMtl: '/mtl.',
-        prefixOldPrice: 'ab',
+        prefixOldPrice: 'z.B.',
         vehicleOwners: `${vehicleOption.vehicleOwners} Fahrzeughalter`,
         vehicleOwners_plural: `${count} Fahrzeughalter`,
         doorsOnly: `${vehicleOption.doorsOnly} Türen`,
@@ -164,7 +164,7 @@ export const vehicleProps = (car?: any, isOfferAvailable: boolean = true) => {
         'firstRegistration': 'Erstzulassung',
         'mileage': 'Kilometerstand',
         'consumptionAndCo2': 'Kraftstoffverbrauch*',
-        'monthlyFrom': 'monatlich ab',
+        'monthlyFrom': 'monatlich z.B.',
         'buy': 'Kaufen',
         'financingDescription': 'Bei der Finanzierung zahlen Sie lediglich die Zinsen des Darlehens und einen geringen Tilgungsanteil. Zum Vertragsende können Sie entscheiden, ob Sie den Restbetrag ablösen oder weiter finanzieren wollen.',
         'leasingDescription': 'Beim Leasing zahlen Sie lediglich die Zinsen des Darlehens und einen geringen Tilgungsanteil. Zum Vertragsende geben Sie das Auto einfach wieder zurück.',

package/tslint.json

@@ -13,7 +13,7 @@
     "match-default-export-name": false,
     "import-name": false,
     "no-boolean-literal-compare": false,
-    "max-line-length": [true, 200],
+    "max-line-length": [false],
     "semicolon": [true, "always", "ignore-bound-class-methods"],
     "variable-name": [true, "allow-pascal-case", "allow-leading-underscore", "allow-trailing-underscore"],
     "trailing-comma": [true, {"multiline": "never", "singleline": "never"}],
@@ -32,7 +32,6 @@
     "interface-name": [true, "always-prefix"],
     "class-name": true,
     "prefer-function-over-method": false,
-    "prefer-switch": [true, {"min-cases": 2}],
     "switch-final-break": true
   },
   "rulesDirectory": []

package/utils.ts

@@ -37,6 +37,8 @@ export {
   buildQueryForSearch,
   buildBodyForRequest,
   priceParse,
+  getUnixTimestampAfterTwoWeeks,
+  convertUnixTimestampToDays,
   getCents
 } from './source/framework/utils/CommonUtils';