@bytebrand/fe-ui-core 4.8.52 → 4.8.54

package/source/components/VehicleSmallCard/VehicleSmallCard.tsx

@@ -12,7 +12,6 @@ import VehicleTitle from './VehicleData/VehicleTitle/VehicleTitle';
 import SeoText from './SeoText/SeoText';
 import VehicleInfo from './VehicleData/VehicleInfo/VehicleInfo';
 import VehiclePrice from './VehicleData/VehiclePrice/VehiclePrice';
-import { PLACEHOLDER_IMAGE_SMALL_URL } from '../../framework/constants/common';
 import {
   IVehicleInfo,
   IPrice,
@@ -282,12 +281,7 @@ const VehicleSmallCard: FunctionComponent<IVehicleSmallCardProps> = (props) => {
           target,
           rel,
           className: `${styles.redirectClassLink} ${styles.gridAreaTitle}`,
-          onClick: () => localStorage.setItem(
-            'activeTabCDP',
-            _get(price, 'leasing.isActive', false)
-              ? t('vehicleProps:title.leasing')
-              : t('vehicleProps:title.financing')
-          ),
+          onClick: () => localStorage.setItem('activeTabCDP', t('vehicleProps:title.financing')),
           href: url
         })}
 
@@ -340,12 +334,7 @@ const VehicleSmallCard: FunctionComponent<IVehicleSmallCardProps> = (props) => {
           target,
           rel,
           className: `${styles.redirectClassLink} ${styles.gridAreaImage}`,
-          onClick: () => localStorage.setItem(
-            'activeTabCDP',
-            _get(price, 'leasing.isActive', false)
-              ? t('vehicleProps:title.leasing')
-              : t('vehicleProps:title.financing')
-          ),
+          onClick: () => localStorage.setItem('activeTabCDP', t('vehicleProps:title.financing')),
           href: url
         })}
         <VehicleInfo {...vehicleInfoProps} />
@@ -377,7 +366,7 @@ VehicleSmallCard.defaultProps = {
   baseUrl: '',
   typeAlternative: '',
   offerSource: '',
-  src: PLACEHOLDER_IMAGE_SMALL_URL,
+  src: 'https://images.auto.de/noimage/small',
   environmentEmissions: null,
   language: 'en',
   consumption: null,

package/source/components/_common/MaterialAccordionGroup/MaterialAccordionGroup.styled.tsx

@@ -1,7 +1,4 @@
-import { styled as muiStyled, createTheme } from '@mui/material/styles';
-
-// Cast to any to bypass MUI 5.9 styled() overload mismatch with strict TS in consumers (fe-landing).
-const styled: any = muiStyled;
+import { styled, createTheme } from '@mui/material/styles';
 
 export const AccordionSummaryContent = styled('div')({
   display: 'flex',

package/source/components/_common/MaterialTooltip/MaterialTooltip.tsx

@@ -7,13 +7,12 @@ import ClickAwayListener from '@mui/material/ClickAwayListener';
 import { debounce } from 'lodash';
 
 interface IMaterialTooltip {
-  text: React.ReactNode;
+  text: string;
   icon?: string;
   className?: string;
   placement?: 'bottom-end' | 'bottom-start' | 'bottom' | 'left-end' | 'left-start' | 'left' | 'right-end' | 'right-start' | 'right' | 'top-end' | 'top-start' | 'top';
   disabled?: Boolean;
   zindex?: number;
-  disablePortal?: boolean;
 }
 
 const LightTooltip = styled(({ className, ...props }: TooltipProps) => (
@@ -33,7 +32,7 @@ const LightTooltip = styled(({ className, ...props }: TooltipProps) => (
   }
 }));
 
-const MaterialTooltip = ({ text, placement, className, disabled, zindex, disablePortal = true }: IMaterialTooltip) => {
+const MaterialTooltip = ({ text, placement, className, disabled, zindex }: IMaterialTooltip) => {
   const [isOpen, setIsOpen] = useState(false);
 
   const onHandleMenuOpen = (event: any) => {
@@ -72,7 +71,7 @@ const MaterialTooltip = ({ text, placement, className, disabled, zindex, disable
             className={className}
             zindex={zindex}
             PopperProps={{
-              disablePortal
+              disablePortal: true
             }}
           >
             <IconButton>

package/source/components/_common/withStats/withStats.styl

@@ -150,20 +150,10 @@ $indent = 10px
         height: 18px
         font-size: 10px
         min-width: 30px
-      .badgeFull
-        display: none
-      .badgeShort
-        display: inline
 
 .badgeItem
   // hook class for compact-mode overrides
 
-.badgeFull
-  display: inline
-
-.badgeShort
-  display: none
-
 .priceDifferencePerCent
   margin-left: auto;
 

package/source/components/_common/withStats/withStats.tsx

@@ -57,6 +57,16 @@ const withStats = (WrappedComponent: any) => ({
   ...props
 }: IStatsWrapperProps) => {
   const [activeSlide, setActiveSlide] = React.useState<number>(0);
+  const [isWideScreen, setIsWideScreen] = React.useState<boolean>(
+    typeof window !== 'undefined' ? window.matchMedia('(min-width: 992px)').matches : false
+  );
+
+  React.useEffect(() => {
+    const mq = window.matchMedia('(min-width: 992px)');
+    const handler = (e: MediaQueryListEvent) => setIsWideScreen(e.matches);
+    mq.addEventListener('change', handler);
+    return () => mq.removeEventListener('change', handler);
+  }, []);
 
   const MIN_PERCENT = 5;
   const MIN_PRICE_DIFFERENCE = 500;
@@ -161,9 +171,8 @@ const withStats = (WrappedComponent: any) => ({
           </Badge>
         )}
         {showDownPayment && (
-          <Badge type='blue' className={styles.badgeItem}>
-            <span className={styles.badgeFull}>{downPaymentText}</span>
-            <span className={styles.badgeShort}>{downPaymentShortText}</span>
+          <Badge type='lightBlue' className={styles.badgeItem}>
+            {allFourActive && isWideScreen ? downPaymentShortText : downPaymentText}
           </Badge>
         )}
         {!!historyPriceDifferencePerCent && historyPriceDifferencePerCent >= MIN_PERCENT && (

package/source/framework/DataTransformers.ts

@@ -69,7 +69,6 @@ export const transformDataForDecoratedCar = (car: any) => {
     bootCapacity: _get(car, 'sizeVolumeWeight.cargoCapacity', null),
     capacityLoad: _get(car, 'sizeVolumeWeight.completeCapacity', null),
     wltpCo2:  _get(car, 'environmentEmissions.wltpCo2', null),
-    wltpEnergyEfficiencyClass: _get(car, 'environmentEmissions.wltpEnergyEfficiencyClass', null),
     pluginHybrid: _get(car, 'engineData.pluginHybrid', null),
     wltpCombined: _get(car, 'consumption.wltpCombined', null),
     wltpPowerCombined: _get(car, 'consumption.wltpPowerCombined', null),

package/source/framework/constants/common.ts

@@ -1,12 +1,8 @@
-const _rawHost = typeof window !== 'undefined' ? window.location.host.replace('www.', '') : 'auto.de';
-const _isIP = /^\d+\.\d+\.\d+\.\d+(:\d+)?$/.test(_rawHost);
-const _imgBase = _isIP ? 'https://images.auto.de' : 'https://images.' + _rawHost;
+export const SITE_DOMAIN: string = 'https://www.auto.de';
 
-export const SITE_DOMAIN: string = typeof window !== 'undefined' ? 'https://' + window.location.host : 'https://www.auto.de';
-
-export const PLACEHOLDER_IMAGE: string = _imgBase + '/noimage/';
-export const PLACEHOLDER_IMAGE_SMALL_URL: string = _imgBase + '/noimage/small';
-export const PLACEHOLDER_IMAGE_LARGE_URL: string = _imgBase + '/noimage/large';
+export const PLACEHOLDER_IMAGE: string = 'https://images.auto.de/noimage/';
+export const PLACEHOLDER_IMAGE_SMALL_URL: string = `https://images.auto.de/noimage/noimage/small`;
+export const PLACEHOLDER_IMAGE_LARGE_URL: string = `https://images.auto.de/noimage/noimage/large`;
 
 export const QUOTES_SLIDES_TO_SHOW_DEFAULT = 3;
 

package/source/framework/types/types.ts

@@ -115,7 +115,6 @@ export interface IVehicleInfo {
   url?: string;
   target?: string;
   rel?: string;
-  leasing?: ILeasing;
 }
 
 export interface IVehicleTitleProps {

package/source/framework/vehiclesProps/decoratedLightProps.tsx

@@ -124,10 +124,6 @@ const getDecoratedLightProps = (
         const wltpConsumptionCombined = car.consumption.wltpCombined;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
         const consumptionPowerCombined = car.consumption.consumptionCombined;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
 
         const co2 = car.environmentEmissions.co2;
 
@@ -147,9 +143,7 @@ const getDecoratedLightProps = (
           ? t('vehicleProps:value.consumptionCombined', { consumption: consumptionCombined.toLocaleString(language), unit: translatedUnit })
           : t('vehicleProps:value.na');
 
-        const consumptionPowerCombinedContent = Number.isFinite(consumptionPowerCombined)
-          ? t('vehicleProps:value.consumptionPowerCombined', { consumption: consumptionPowerCombined.toLocaleString(language), unit: translatedUnit })
-          : null;
+        const consumptionPowerCombinedContent = t('vehicleProps:value.consumptionPowerCombined', { consumption: consumptionPowerCombined.toLocaleString(language), unit: translatedUnit });
 
         const co2Value = Number.isFinite(co2)
           ? t('vehicleProps:value.co2Combined', { co2: co2.toLocaleString(language) })
@@ -168,24 +162,22 @@ const getDecoratedLightProps = (
                 {`${wltpWeightedPowerCombinedContent}, `}
                 {`${wltpWeightedCombinedContent}, `}
                 {wltpCo2PluginValue}
-                {co2ClassValue && <>, {co2ClassValue}</>}
               </React.Fragment>
           }
 
           return Number.isFinite(consumptionCombined) || Number.isFinite(consumptionPowerCombined)
             ? <React.Fragment>
               {consumptionPowerCombined ? consumptionPowerCombinedContent : t('vehicleProps:value.na')} <br />{consumptionValue} <br /> {co2Value}
-              {co2ClassValue && <>, {co2ClassValue}</>}
             </React.Fragment>
             : t('vehicleProps:value.na');
 
         }
 
         if (wltpConsumptionValue && wltpCo2Value) {
-          return <>{wltpConsumptionValue}, {wltpCo2Value}{co2ClassValue && <>, {co2ClassValue}</>}</>;
+          return <>{wltpConsumptionValue}, {wltpCo2Value}</>;
         }
 
-        return <>{consumptionValue} <br /> {co2Value}{co2ClassValue && <>, {co2ClassValue}</>}</>;
+        return <>{consumptionValue} <br /> {co2Value}</>;
       }
     },
     consumptionPowerCombinedAlternateView: {
@@ -199,10 +191,6 @@ const getDecoratedLightProps = (
         const co2 = car.environmentEmissions.co2;
         const wltpConsumptionPowerCombined = car.consumption.wltpPowerCombined;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
 
         const wltpConsumptionValue = Number.isFinite(wltpConsumptionPowerCombined)
           ? t('vehicleProps:value.wltpPowerCombined', { consumption: wltpConsumptionPowerCombined.toLocaleString(language), unit: translatedUnit })
@@ -221,10 +209,10 @@ const getDecoratedLightProps = (
           : t('vehicleProps:value.na');
 
         if (wltpConsumptionValue && wltpCo2Value) {
-          return <>{wltpConsumptionValue}, {wltpCo2Value}{co2ClassValue && <>, {co2ClassValue}</>}</>;
+          return <>{wltpConsumptionValue}, {wltpCo2Value}</>;
         }
 
-        return <>{consumptionValue} <br /> {co2Value} {co2ClassValue && <>, {co2ClassValue}</>}</>;
+        return <>{consumptionValue} <br /> {co2Value} </>;
       }
     },
 
@@ -245,12 +233,8 @@ const getDecoratedLightProps = (
 
         const consumptionPowerCombinedContent = t('vehicleProps:value.consumptionPowerCombined', { consumption: consumptionPowerCombined.toLocaleString(language), unit: translatedUnit });
         const consumptionCombinedContent = t('vehicleProps:value.consumptionCombined', { consumption: consumptionCombined.toLocaleString(language), unit: translatedUnit });        
-        const wltpWeightedPowerCombinedContent = Number.isFinite(wltpWeightedPowerCombined)
-          ? t('vehicleProps:value.wltpWeightedPowerCombined', { consumption: wltpWeightedPowerCombined.toLocaleString(language), unit: translatedUnit })
-          : null;
-        const wltpWeightedCombinedContent = Number.isFinite(wltpWeightedCombined)
-          ? t('vehicleProps:value.wltpWeightedCombined', { consumption: wltpWeightedCombined.toLocaleString(language), unit: translatedUnit })
-          : null;
+        const wltpWeightedPowerCombinedContent = t('vehicleProps:value.wltpWeightedPowerCombined', { consumption: wltpWeightedPowerCombined.toLocaleString(language), unit: translatedUnit });
+        const wltpWeightedCombinedContent = t('vehicleProps:value.wltpWeightedCombined', { consumption: wltpWeightedCombined.toLocaleString(language), unit: translatedUnit });
         const wltpConsumptionPowerCombinedContent = wltpConsumptionPowerCombined
           ? t('vehicleProps:value.wltpPowerCombined', { consumption: wltpConsumptionPowerCombined.toLocaleString(language), unit: translatedUnit })
           : null;
@@ -261,10 +245,6 @@ const getDecoratedLightProps = (
 
         const co2 = car.environmentEmissions.co2;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
 
         const co2Value = Number.isFinite(co2)
         ? t('vehicleProps:value.co2Combined', { co2: co2.toLocaleString(language) })
@@ -286,7 +266,6 @@ const getDecoratedLightProps = (
                 {`${wltpWeightedPowerCombinedContent}, `}
                 {`${wltpWeightedCombinedContent}, `}
                 {wltpCo2PluginValue}
-                {co2ClassValue && <>, {co2ClassValue}</>}
               </React.Fragment>
           }
         }
@@ -296,14 +275,12 @@ const getDecoratedLightProps = (
               {`${wltpConsumptionPowerCombinedContent}, `}
               {`${wltpWeightedCombinedContent}, `}
               {wltpCo2PluginValue}
-              {co2ClassValue && <>, {co2ClassValue}</>}
             </React.Fragment>
         }
 
         return Number.isFinite(consumptionCombined) || Number.isFinite(consumptionPowerCombined)
           ? <React.Fragment>
             {consumptionPowerCombined ? consumptionPowerCombinedContent : t('vehicleProps:value.na')} <br />{consumptionCombinedContent} <br /> {co2Value}
-            {co2ClassValue && <>, {co2ClassValue}</>}
           </React.Fragment>
           : t('vehicleProps:value.na');
       }
@@ -320,10 +297,6 @@ const getDecoratedLightProps = (
         const co2 = car.environmentEmissions.co2;
         const wltpConsumptionCombined = car.consumption.wltpCombined;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
 
         const consumptionValue = Number.isFinite(consumptionHydrogenCombined)
           ? t('vehicleProps:value.consumptionGas', { consumption: consumptionHydrogenCombined.toLocaleString(language), unit: translatedUnit })
@@ -341,10 +314,10 @@ const getDecoratedLightProps = (
           : null;
 
         if (wltpConsumptionValue && wltpCo2Value) {
-          return <>{wltpConsumptionValue}, {wltpCo2Value}{co2ClassValue && <>, {co2ClassValue}</>}</>;
+          return <>{wltpConsumptionValue}, {wltpCo2Value}</>;
         }
 
-        return <>{consumptionValue} <br /> {co2Value}{co2ClassValue && <>, {co2ClassValue}</>}</>;
+        return <>{consumptionValue} <br /> {co2Value}</>;
       }
     },
     consumptionGasCombinedAlternateView: {
@@ -358,10 +331,6 @@ const getDecoratedLightProps = (
         const co2 = car.environmentEmissions.co2;
         const wltpConsumptionCombined = car.consumption.wltpCombined;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
 
         const consumptionValue = Number.isFinite(consumptionGasCombined)
           ? t('vehicleProps:value.consumptionGas', { consumption: consumptionGasCombined.toLocaleString(language), unit: translatedUnit })
@@ -380,10 +349,10 @@ const getDecoratedLightProps = (
           : null;
 
         if (wltpConsumptionValue && wltpCo2Value) {
-          return <>{wltpConsumptionValue}, {wltpCo2Value}{co2ClassValue && <>, {co2ClassValue}</>}</>;
+          return <>{wltpConsumptionValue}, {wltpCo2Value}</>;
         }
 
-        return <>{consumptionValue} <br /> {co2Value}{co2ClassValue && <>, {co2ClassValue}</>}</>;
+        return <>{consumptionValue} <br /> {co2Value}</>;
       }
     },
     consumptionCombinedDealer: {
@@ -395,7 +364,6 @@ const getDecoratedLightProps = (
         const translatedUnit = t(`cbd:${consumptionUnit}`);
 
         const co2 = car.environmentEmissions.co2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
 
         const consumptionValue = Number.isFinite(consumptionCombined)
           ? t('vehicleProps:value.consumptionCombined', { consumption: consumptionCombined.toLocaleString(language), unit: translatedUnit })
@@ -405,11 +373,7 @@ const getDecoratedLightProps = (
           ? t('vehicleProps:value.co2Combined', { co2: co2.toLocaleString(language) })
           : t('vehicleProps:value.na');
 
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
-
-        return <>{consumptionValue} | {co2Value}{co2ClassValue ? <> | {co2ClassValue}</> : null}</>;
+        return <>{consumptionValue} | {co2Value}</>;
       }
     },
     gearbox: {

package/source/framework/vehiclesProps/decoratedProps.tsx

@@ -680,7 +680,6 @@ const getDecoratedProps = (
         const translatedUnit = t(`cbd:${consumptionUnit}`);
         const wltpConsumptionCombined = car.consumption.wltpCombined;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
 
         const co2 = car.environmentEmissions.co2;
 
@@ -700,15 +699,11 @@ const getDecoratedProps = (
           ? t('vehicleProps:value.co2Combined', { co2: co2.toLocaleString(language) })
           : t('vehicleProps:value.na');
 
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
-
         if (wltpConsumptionValue && wltpCo2Value) {
-          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
+          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}</>;
         }
 
-        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
+        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}</>;
       }
     },
     consumptionPowerCombinedAlternateView: {
@@ -721,7 +716,6 @@ const getDecoratedProps = (
         const co2 = car.environmentEmissions.co2;
         const wltpConsumptionPowerCombined = car.consumption.wltpPowerCombined;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
 
         const wltpConsumptionValue = Number.isFinite(wltpConsumptionPowerCombined)
           ? t('vehicleProps:value.consumptionPower', { consumption: wltpConsumptionPowerCombined.toLocaleString(language), unit: translatedUnit })
@@ -739,15 +733,11 @@ const getDecoratedProps = (
           ? t('vehicleProps:value.co2Combined', { co2: co2.toLocaleString(language) })
           : t('vehicleProps:value.na');
 
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
-
         if (wltpConsumptionValue && wltpCo2Value) {
-          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
+          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}</>;
         }
 
-        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
+        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}</>;
       }
     },
     consumptionHydrogenCombinedAlternateView: {
@@ -760,7 +750,6 @@ const getDecoratedProps = (
         const translatedUnit = t(`cbd:${consumptionUnit}`);
         const co2 = car.environmentEmissions.co2;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
 
         const consumptionValue = Number.isFinite(consumptionHydrogenCombined)
           ? t('vehicleProps:value.consumptionGas', { consumption: consumptionHydrogenCombined.toLocaleString(language), unit: translatedUnit })
@@ -778,15 +767,11 @@ const getDecoratedProps = (
           ? t('vehicleProps:value.wltpCo2Combined', { co2: wltpCo2.toLocaleString(language) })
           : null;
 
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
-
         if (wltpConsumptionValue && wltpCo2Value) {
-          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
+          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}</>;
         }
 
-        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
+        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}</>;
       }
     },
     consumptionGasCombinedAlternateView: {
@@ -800,7 +785,6 @@ const getDecoratedProps = (
 
         const co2 = car.environmentEmissions.co2;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
 
         const consumptionValue = Number.isFinite(consumptionGasCombined)
           ? t('vehicleProps:value.consumptionGas', { consumption: consumptionGasCombined.toLocaleString(language), unit: translatedUnit })
@@ -818,15 +802,11 @@ const getDecoratedProps = (
           ? t('vehicleProps:value.wltpCo2Combined', { co2: wltpCo2.toLocaleString(language) })
           : null;
 
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
-
         if (wltpConsumptionValue && wltpCo2Value) {
-          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
+          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}</>;
         }
 
-        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
+        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}</>;
       }
     },
 
@@ -861,7 +841,6 @@ const getDecoratedProps = (
 
         const co2 = car.environmentEmissions.co2;
         const wltpCo2 = car.environmentEmissions.wltpCo2;
-        const wltpEnergyEfficiencyClass = car.environmentEmissions.wltpEnergyEfficiencyClass;
         const co2Value = Number.isFinite(co2)
         ? t('vehicleProps:value.co2Combined', { co2: co2.toLocaleString(language) })
         : t('vehicleProps:value.na');
@@ -871,9 +850,6 @@ const getDecoratedProps = (
         const wltpCo2PluginValue = Number.isFinite(wltpCo2)
         ? t('vehicleProps:value.wltpCo2WtdCombined', { co2: wltpCo2.toLocaleString(language) })
         : null;
-        const co2ClassValue = isPropDefined(wltpEnergyEfficiencyClass)
-          ? t('vehicleProps:value.co2Class', { class: t(`cbd:${wltpEnergyEfficiencyClass}`) })
-          : null;
         const hybridPlugin = car.engineData.hybridPlugin;
 
         if (hybridPlugin && wltpConsumptionWeightedPowerCombinedContent && wltpConsumptionWeightedCombinedContent) {
@@ -881,7 +857,6 @@ const getDecoratedProps = (
             {wrapValue(wltpConsumptionWeightedPowerCombinedContent)}{', '}
             {wrapValue(wltpConsumptionWeightedCombinedContent)}{', '}
             {wrapValue(wltpCo2PluginValue)}
-            {co2ClassValue && <><br />{co2ClassValue}</>}
           </React.Fragment>
         }
 
@@ -889,7 +864,6 @@ const getDecoratedProps = (
           return <React.Fragment>
             {wrapValue(wltpConsumptionCombinedContent)}{', '}
             {wrapValue(wltpCo2Value)}
-            {co2ClassValue && <><br />{co2ClassValue}</>}
           </React.Fragment>
         }
 
@@ -899,7 +873,6 @@ const getDecoratedProps = (
             {consumptionPowerCombined && hybridPlugin ? <br /> : ''}
             {wrapValue(consumptionCombinedContent)} <br />
             {wrapValue(co2Value)}
-            {co2ClassValue && <><br />{co2ClassValue}</>}
           </React.Fragment>
           : t('vehicleProps:value.na');
       }

package/source/locales/data.ts

@@ -38,8 +38,6 @@ export const vehicleProps = (car?: any, isOfferAvailable: boolean = true) => {
       promoSlider: {
         consumptionCombined: `${vehicleOption.consumptionCombined}l/100km (komb)*`,
         co2: `${vehicleOption.co2} g CO2/km (komb)*`,
-        // wltpEnergyEfficiencyClass arrives as `selector_energyEfficiencyClass_X`; map to the bare letter via cbd dict.
-        co2Class: `CO2-Klasse ${(cbd.cbd as any)[vehicleOption.wltpEnergyEfficiencyClass] || vehicleOption.wltpEnergyEfficiencyClass || ''} (komb)`,
         new: 'neu',
         downPayment: '0€ Anzahlung',
         downPaymentShort: '0€ Anz.',
@@ -61,7 +59,6 @@ export const vehicleProps = (car?: any, isOfferAvailable: boolean = true) => {
         deliveryPeriodMonths: `${Math.round(monthsTo)} Monat\nab Bestellung`,
         deliveryPeriodDays: `${count} Tag\nab Bestellung`,
         co2Combined: `${vehicleOption.co2}g CO2/km (komb)*`,
-        co2Class: `CO2-Klasse ${(cbd.cbd as any)[vehicleOption.wltpEnergyEfficiencyClass] || vehicleOption.wltpEnergyEfficiencyClass || ''} (komb)`,
         co2: `${vehicleOption.co2} g/km `,
         na: 'N/A',
         priceSub: '/mtl.',

package/.husky/pre-push

@@ -1,4 +0,0 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
-
-npm run test:ci

package/.storybook/addons.js

@@ -1,4 +0,0 @@
-import '@storybook/addon-actions/register';
-import '@storybook/addon-links/register';
-import '@storybook/addon-backgrounds/register';
-import 'storybook-addon-i18next/register';

package/.storybook/config.js

@@ -1,64 +0,0 @@
- import { configure, addDecorator, addParameters } from '@storybook/react';
-
-import i18n from 'i18next';
-import centered from '@storybook/addon-centered/react';
-
-import { reactI18nextModule } from 'react-i18next';
-import { withI18next } from 'storybook-addon-i18next';
-import { en, de } from '@bytebrand/i18n-dictionaries';
-
-import '!style-loader!css-loader!stylus-loader!../source/theme/colors.styl';
-
-i18n
-  .use(reactI18nextModule)
-  .init({
-    whitelist: ['en', 'de'],
-    lng: 'de',
-    fallbackLng: 'de',
-    interpolation: {
-      escapeValue: false,
-    },
-    debug: process.env.NODE_ENV === 'development',
-    react: {
-      wait: true
-    },
-  },
-  (err, t) => {
-    if (err) {
-      return console.error('Something went wrong loading', err);
-    }
-
-    i18n.addResourceBundle('en', 'cbd', en, true, true);
-    i18n.addResourceBundle('de', 'cbd', de, true, true);
-
-  });
-
-addDecorator(withI18next({
-  i18n,
-  languages: {
-    en: 'English',
-    de: 'Deutsch',
-  }
-}));
-
-addParameters({
-  options: {
-    sortStoriesByKind: true
-  },
-  backgrounds: [
-    { name: 'white', value: '#fff' },
-    { name: 'grey', value: '#808080', default: true },
-    { name: 'black', value: '#000' }
-  ]
-});
-
-addDecorator(centered);
-
-// automatically import all files ending in *.stories.js
-const req = require.context('../source/components', true, /.story.js$/);
-
-function loadStories() {
-  req.keys().forEach(filename => req(filename));
-}
-
-configure(loadStories, module);

package/.storybook/postcss.config.js

@@ -1,6 +0,0 @@
-module.exports = ({ file, options, env }) => ({
-  parser: false,
-  plugins: {
-    'autoprefixer': env === 'production' ? options.autoprefixer : false,
-  }
-});

package/.storybook/preview-head.html

@@ -1,10 +0,0 @@
-<link rel="stylesheet" type="text/css" charset="UTF-8"
-    href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css" />
-<link rel="stylesheet" type="text/css"
-    href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css" />
-
-<link rel="stylesheet" type="text/css"
-    href="https://cdn.jsdelivr.net/npm/react-checkbox-tree@1.5.1/lib/react-checkbox-tree.css" />
-
-<link rel="stylesheet" type="text/css"
-    href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" />