@bytebrand/fe-ui-core 4.2.86 → 4.2.88

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytebrand/fe-ui-core",
-  "version": "4.2.86",
+  "version": "4.2.88",
   "description": "UI components for the auto.de project",
   "main": "index.ts",
   "module": "dist/common.js",

package/source/components/_common/Modal/modals/PreviewCookieModal/PreviewCookieModal.styl

@@ -42,4 +42,9 @@
     font-size: 11px !important
 
 .outlinedBtn
-  border: none !important
+  border: none !important
+
+.outlinedBtnLeft
+  display: block !important;
+  min-width: auto !important;
+  margin-top: 10px !important;

package/source/components/_common/Modal/modals/PreviewCookieModal/PreviewCookieModal.tsx

@@ -11,21 +11,34 @@ interface IPreviewCookieModal {
 }
 
 const PreviewCookieModal = ({ toggleModal, setModal }: IPreviewCookieModal) => {
+  const environment = window.location.origin;
   const onAcceptAll = () => {
     localStorage.setItem('cookieConfig', JSON.stringify({}));
     updateCookieList();
     toggleModal();
   };
 
+  const onHandleRedirect = () => {
+    window.open(`${environment}/impressum/`, '_blank');
+  };
+
   return (
     <div className={styles.modalWrapper}>
       <IconSVG name='autodeLogo' customDimensions />
       <div className={styles.modalTitle}>Nach den Cookies geht die Fahrt weiter.</div>
-      <div className={styles.modalContent}>Für ein bestmögliches Nutzererlebnis setzen wir Cookies und andere Technologien ein. Diese können Sie hier verwalten.</div>
+      <div className={styles.modalContent}>
+        Wenn Sie auf "Zustimmen" klicken, ermöglichen Sie uns über Cookies das Nutzerverhalten 
+        für alle User zu optimieren und Ihnen individuelle Empfehlungen auch auf Drittseiten anzuzeigen. 
+        Durch die Zustimmung erteilen Sie uns Ihre ausdrückliche Einwilligung. 
+        Über "Anpassen" können Sie Ihre Einwilligungen individuell anpassen. 
+        Dies ist auch später jederzeit im Bereich "Cookie-Richtlinie" möglich. 
+        Die relevante Datenschutzerklärung finden Sie <a href={`${environment}/datenschutz/`} target='_blank' style={{ color: '#005ccb'}}>hier</a>.
+      </div>
       <div className={styles.buttonsContainer}>
-        <Button onClick={() => setModal('MANAGE_COOKIE_MODAL')} className={classNames(styles.modalBtn, styles.outlinedBtn)} variant='outlined'>Cookie-Einstellungen</Button>
+        <Button onClick={() => setModal('MANAGE_COOKIE_MODAL')} className={classNames(styles.modalBtn, styles.outlinedBtn)} variant='outlined'>Anpassen</Button>
         <Button onClick={onAcceptAll} className={styles.modalBtn}>zustimmen</Button>
       </div>
+      <Button onClick={onHandleRedirect} className={classNames(styles.modalBtn, styles.outlinedBtn, styles.outlinedBtnLeft)} variant='outlined'>Impressum</Button>
     </div>
   );
 };

package/source/components/containers/SearchPage/FiltersContainer/FiltersContainer.tsx

@@ -387,7 +387,7 @@ class FiltersContainer extends React.Component<IFiltersContainerProps, {}> {
       error: isErrorAlternativeField,
       onChange: onAlternativeRedirect
     };
-    console.log('renderxxxxxxx', paramsFromQuery.autoDeId);
+
     return (
       <div className={styles.filters}>
         {isAlternative ? (

package/source/framework/constants/common.ts

@@ -19,8 +19,7 @@ export const GOOGLE_BUNDLE_COOKIES = {
 /* tslint:disable */
 export const COOKIE_SCHEMA = {
   necessary: {
-    gdpr: { name: 'DSGVO' },
-    __cfruid: { name: 'Cloudflare ' },
+    __cfruid: { name: 'Cloudflare' },
     cf_chl_2: { name: 'Cloudflare für Webverkehr zu identifizieren' },
     cf_chl_rc_ni: { name: 'Cloudflare für den internen Gebrauch' },
     ['next-i18next']: { name: 'Spracheinstellungen' },
@@ -35,7 +34,7 @@ export const COOKIE_SCHEMA = {
     callback: { name: 'callback' },
     demdex: { name: 'demdex' },
     vuid: { name: 'Vimeo' },
-    // _fbp: { name: 'Facebook' },
+    _fbp: { name: 'Facebook' },
     hotjar: { name: 'Hotjar-Analytics'},
     _clck: { name: 'Clarity' },
     _clsk: { name: 'Clarity' },

package/source/framework/utils/CommonUtils.ts

@@ -20,6 +20,7 @@ declare global {
     grantHotjarCookieConsent?: () => void;
     grantCookieConsentClarity?: () => void;
     grantCookieConsentMicrosoft?: () => void;
+    grantCookieConsentFacebook?: () => void;
     grantCookieConsent?: (list: string[]) => void;
     allowGoogle?: () => void;
   }
@@ -549,6 +550,7 @@ export const updateCookieList = () => {
   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 isHotjarGranted = true;
   const cookieConfig = JSON.parse(localStorage.getItem('cookieConfig')) || {};
 
@@ -566,11 +568,14 @@ export const updateCookieList = () => {
       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;
     });
   });
+
   // grant google cookies
-  if (typeof window.grantCookieConsent === 'function')
+  if (typeof window.grantCookieConsent === 'function') {
     window.grantCookieConsent(cookieConsentList);
+  };
 
   // grant Microsoft cookies
   if (isMicrosoftGranted && typeof window.grantCookieConsentMicrosoft === 'function') {
@@ -582,6 +587,11 @@ export const updateCookieList = () => {
     window.grantCookieConsentClarity();
   }
 
+  // grant Facebook cookies
+  if (!isFacebookGranted && typeof window.grantCookieConsentFacebook === 'function') {
+    window.grantCookieConsentFacebook();
+  };
+
   if (isHomeGoogleGranted && typeof window.allowGoogle === 'function') {
     window.allowGoogle();
   }