@bytebrand/fe-ui-core 4.1.62 → 4.1.64

package/package.json

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

package/source/components/SearchFilters/common/RangeControlled/RangeControlled.tsx

@@ -125,7 +125,7 @@ const RangeControlled = ({
   const toProps = {
     size: 'custom',
     value: to ? to : null,
-    label: `${t('filters.from')} ${unit ? unit : '€'}`,
+    label: `${t('filters.to')} ${unit ? unit : '€'}`,
     onChange: (value: any) => onDropDownChange('to', value),
     items: getOptions(sliceMoreThan(getDropdownRange(name), from))
   };

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

@@ -8,6 +8,8 @@ import MaterialAccordionGroup from '../../../MaterialAccordionGroup/MaterialAcco
 import classNames from 'classnames';
 import MaterialSwitch from '../../../MaterialSwitch/MaterialSwitch';
 import { COOKIE_SCHEMA } from '../../../../../framework/constants/common';
+import Cookies from 'js-cookie';
+import { config } from '../../../../../framework/constants/app';
 
 const ManageCookieModal = ({ onClearModalState }) => {
   const [analytcisMasterSwitch, setAnalyticsMasterSwitch] = useState(true);
@@ -32,8 +34,8 @@ const ManageCookieModal = ({ onClearModalState }) => {
   };
 
   const onHandleMarketingSwitchValue = (value: boolean) => {
-    const newAnalyticsSwitches = Object.keys(analyticsSwitches).reduce((acc, item) => ({ ...acc, [item]: value }), {});
-    setMarketingSwitches(newAnalyticsSwitches);
+    const newMarketingSwitches = Object.keys(marketingSwitches).reduce((acc, item) => ({ ...acc, [item]: value }), {});
+    setMarketingSwitches(newMarketingSwitches);
     setMarketingMasterSwitch(value);
   };
 
@@ -52,8 +54,18 @@ const ManageCookieModal = ({ onClearModalState }) => {
     onChange: () => {}
   };
 
-  const onAccept = (value: object) => {
-    localStorage.setItem('cookieConfig', JSON.stringify( value || {}));
+  const onAccept = (value?: object) => {    
+    const cookieConfig = value || {
+      marketing: Object.keys(marketingSwitches).filter(i => !marketingSwitches[i]) || [],
+      analytics: Object.keys(analyticsSwitches).filter(i => !analyticsSwitches[i]) || []
+    };
+    localStorage.setItem('cookieConfig', JSON.stringify(cookieConfig));
+    
+    Object.keys(cookieConfig).forEach(group => {
+      cookieConfig[group].forEach((cookie: string) => {
+        Cookies.remove(cookie, { path: '/' });
+      })
+    })
     onClearModalState();
   };
 
@@ -77,7 +89,7 @@ const ManageCookieModal = ({ onClearModalState }) => {
           You can disable these cookies in your browser settings but if you do the site may not work as intended.
           </span>
           {Object.keys(COOKIE_SCHEMA.necessary).map(cookie =>
-            <div className={styles.switchBlock}>
+            <div className={styles.switchBlock} key={cookie} >
               <span>{`${COOKIE_SCHEMA.necessary[cookie].name} (${cookie})`}</span>
               <MaterialSwitch disabled={true} value={true} onChange={() => {}} />
             </div>
@@ -95,7 +107,7 @@ const ManageCookieModal = ({ onClearModalState }) => {
             For example, we collect information about which pages you visit to help us present more relevant information.
           </span>
           {Object.keys(COOKIE_SCHEMA.analytics).map(cookie =>
-            <div className={styles.switchBlock}>
+            <div className={styles.switchBlock} key={cookie} >
               <span>{`${COOKIE_SCHEMA.analytics[cookie].name} (${cookie})`}</span>
               <MaterialSwitch
                 value={analyticsSwitches[cookie]}
@@ -116,7 +128,7 @@ const ManageCookieModal = ({ onClearModalState }) => {
             For example, we may serve you a personalized ad based on the pages you visit on our site.
           </span>
           {Object.keys(COOKIE_SCHEMA.marketing).map(cookie =>
-            <div className={styles.switchBlock}>
+            <div className={styles.switchBlock} key={cookie} >
               <span>{`${COOKIE_SCHEMA.marketing[cookie].name} (${cookie})`}</span>
               <MaterialSwitch
                 value={marketingSwitches[cookie]}
@@ -127,7 +139,7 @@ const ManageCookieModal = ({ onClearModalState }) => {
         </MaterialAccordionGroup>
       </div>
       <div className={styles.buttonsContainer}>
-        <Button onClick={onAccept}className={classNames(styles.modalBtn, styles.outlinedBtn)} variant='outlined'>Cookie-Einstellungen</Button>
+        <Button onClick={() => onAccept()}className={classNames(styles.modalBtn, styles.outlinedBtn)} variant='outlined'>Cookie-Einstellungen</Button>
         <Button onClick={() => onAccept({})} className={styles.modalBtn}>zustimmen</Button>
       </div>
     </div>