@bytebrand/fe-ui-core 4.8.49 → 4.8.51

package/source/framework/vehiclesProps/decoratedLightProps.tsx

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

package/source/framework/vehiclesProps/decoratedProps.tsx

@@ -680,6 +680,7 @@ 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;
 
@@ -699,11 +700,15 @@ 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)}</>;
+          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
         }
 
-        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}</>;
+        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
       }
     },
     consumptionPowerCombinedAlternateView: {
@@ -716,6 +721,7 @@ 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 })
@@ -733,11 +739,15 @@ 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)}</>;
+          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
         }
 
-        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}</>;
+        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
       }
     },
     consumptionHydrogenCombinedAlternateView: {
@@ -750,6 +760,7 @@ 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 })
@@ -767,11 +778,15 @@ 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)}</>;
+          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
         }
 
-        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}</>;
+        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
       }
     },
     consumptionGasCombinedAlternateView: {
@@ -785,6 +800,7 @@ 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 })
@@ -802,11 +818,15 @@ 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)}</>;
+          return <>{wrapValue(wltpConsumptionValue)}, {wrapValue(wltpCo2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
         }
 
-        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}</>;
+        return <>{wrapValue(consumptionValue)} <br /> {wrapValue(co2Value)}{co2ClassValue && <><br />{co2ClassValue}</>}</>;
       }
     },
 
@@ -841,6 +861,7 @@ 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');
@@ -850,6 +871,9 @@ 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) {
@@ -857,6 +881,7 @@ const getDecoratedProps = (
             {wrapValue(wltpConsumptionWeightedPowerCombinedContent)}{', '}
             {wrapValue(wltpConsumptionWeightedCombinedContent)}{', '}
             {wrapValue(wltpCo2PluginValue)}
+            {co2ClassValue && <><br />{co2ClassValue}</>}
           </React.Fragment>
         }
 
@@ -864,6 +889,7 @@ const getDecoratedProps = (
           return <React.Fragment>
             {wrapValue(wltpConsumptionCombinedContent)}{', '}
             {wrapValue(wltpCo2Value)}
+            {co2ClassValue && <><br />{co2ClassValue}</>}
           </React.Fragment>
         }
 
@@ -873,6 +899,7 @@ 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,6 +38,8 @@ 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.',
@@ -59,6 +61,7 @@ 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.',