@bytebrand/fe-ui-core-autobahn 1.0.0

package/constants/common.ts

@@ -0,0 +1,127 @@
+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 = 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 QUOTES_SLIDES_TO_SHOW_DEFAULT = 3;
+
+export const HUNDRED = 100;
+
+export const GOOGLE_BUNDLE_COOKIES = [
+  'analytics_storage',
+  'ad_storage',
+  'functionality_storage',
+  'personalization_storage',
+  'security_storage'
+];
+
+/* tslint:disable */
+
+export const COOKIE_SCHEMA_LINKS = {
+  ['auto.de']: 'https://www.auto.de/datenschutz/',
+  Cloudflare: 'https://www.cloudflare.com/de-de/gdpr/introduction/',
+  Firebase: 'https://firebase.google.com/support/privacy?hl=de',
+  Google: 'https://policies.google.com/privacy?hl=de',
+  Criteo: 'https://www.criteo.com/de/privacy/',
+  Facebook: 'https://www.facebook.com/privacy/policies/cookies/?entry_point=cookie_policy_redirect&entry=0',
+  ['Google Analytics']: 'https://policies.google.com/privacy?hl=de',
+  Hotjar: 'https://www.hotjar.com/legal/policies/privacy/de/',
+  Microsoft: 'https://privacy.microsoft.com/de-de/privacystatement',
+  Matomo: 'https://matomo.org/privacy-policy/',
+  Trustpilot: 'https://de.legal.trustpilot.com/for-reviewers/end-user-privacy-terms',
+  Awin: 'https://www.awin.com/de/datenschutzerklarung',
+  Youtube:'https://www.youtube.com/howyoutubeworks/our-commitments/protecting-user-data/',
+  ['RTB House']: 'https://www.rtbhouse.com/privacy-center'
+}
+
+export const COOKIE_SCHEMA = {
+  necessary: {
+    ['auto.de']: ['next-i18next'],
+    Cloudflare: [
+      'cf_chl_2',
+      'cf_chl_rc_ni',
+      'cf_chl_prog'
+    ],
+    Firebase: [''],
+    Matomo: ['MATOMO_SESSID','_pk_ses.1.4d04', '_pk_id.1.4d04'],
+    Trustpilot: ['']
+  },
+  analytics: {
+    ['auto.de']: [
+      'sentry',
+      'callback',
+      'locale'
+    ],
+    Facebook: ['_fbp'],
+    Hotjar: ['hotjar'],
+  },
+  marketing: {
+    ['auto.de']: [
+      'cf',
+      'cip',
+      'cnac',
+      'car'
+    ],
+    Awin: [
+      'bid'
+    ],
+    Criteo: [
+      'uid',
+      'PugT',
+      'demdex',
+      'cto_bundle',
+      'tuuid',
+      'tuuid_lu',
+      'c',
+      'CMID',
+      'CMPS',
+      'CMPRO',
+      'uuid2',
+      'um',
+      'umeh',
+      'KRTBCOOKIE_97',
+      'IDSYNC',
+      'dpm',
+      '_kuid_',
+      'visitor-id',
+      'data-c-ts',
+      'data-c',
+      'CMTS',
+      'mv_tokens',
+      'A3',
+      'mv_tokens_eu-v1',
+      'am_tokens',
+      'am_tokens_eu-v1',
+      'iteo'
+    ],
+    Google: [
+      'test_cookie',
+      'IDE',
+      ...GOOGLE_BUNDLE_COOKIES
+    ],
+    ['RTB House']: [
+      'rtbh',
+      'udmts',
+      'dt',
+      '__rtbh.lid',
+      '__rtbh.uid',
+      'ar_debug',
+      'C',
+      'G',
+      'ts',
+      'receive-cookie-deprecation'
+    ],
+    Microsoft: ['_clck', '_clsk', '_uetsid', '_uetvid'],
+    Youtube: [
+      'youtube'
+    ]
+  }
+};
+
+
+/* tslint:enable */

package/constants/core.ts

@@ -0,0 +1,131 @@
+import { DELIVERY_PERIODS } from './selectors';
+
+export enum N {
+  ZERO, ONE, TWO, THREE, FOUR, FIVE, FOURTEEN = 14, FIFTEEN = 15, HUNDRED = 100, THOUSAND = 1000
+}
+
+// interface IPriceTabs {
+//   fin: number[];
+//   leasing: number[];
+//   buy: number[];
+//   abo: number[];
+//   [key: string]: any;
+// }
+
+export const THREE = 3; // tab index
+export const FOUR = 4; // tab index
+export const FIVE = 5; // tab index
+export const FIFTEEN = 15; // font-size
+export const FOURTEEN = 14;
+export const HUNDRED = 100;
+export const THOUSAND = 1000;
+
+export const PREDICTABLE_PRICE_INDEX = 1.07814;
+
+export const CONTAINER_STYLES = {
+  display: 'flex',
+  flexDirection: 'row',
+  alignItems: 'stretch',
+  justifyContent: 'center'
+};
+
+export const LOCAL_STORAGE_KEY = {
+  JWT_TOKEN_KEY: 'auto_jwt_token',
+  JWT_USER_NAME_KEY: 'auto_jwt_username',
+  i18n_KEY: 'i18nLanguage'
+};
+
+export const DEFAULT_LANG: string = typeof window !== 'undefined' ? window.localStorage.getItem(LOCAL_STORAGE_KEY.i18n_KEY) : 'de';
+
+export const ROW_STYLES = {
+  marginBottom: 10
+};
+
+export const COLUMN_STYLES = {
+  padding: 10,
+  boxSizing: 'border-box'
+};
+
+export const ONLINE_SINCE_KEY: string = 'ONLINE_SINCE';
+export const CONSUMPTION_KEY: string = 'CONSUMPTION';
+// detailed search keys
+export const EMISSION_CLASS_KEY: string = 'EMISSION_CLASS';
+export const EMISSION_STICKER_KEY: string = 'EMISSION_STICKER';
+export const PARTICULATE_FILTER_KEY: string = 'PARTICULATE_FILTER';
+export const GENERAL_INSPECTION_KEY: string = 'GENERAL_INSPECTION';
+export const DELIVERY_PERIODS_EXTRA = DELIVERY_PERIODS.map((val: string) => ({
+  label: val.match(/\d+/),
+  value: val
+}));
+
+
+export const WLTP_ENERGY_EFFICIENCY_CLASS = [
+  "selector_energyEfficiencyClass_a",
+  "selector_energyEfficiencyClass_b",
+  "selector_energyEfficiencyClass_c",
+  "selector_energyEfficiencyClass_d",
+  "selector_energyEfficiencyClass_e",
+  "selector_energyEfficiencyClass_f",
+  "selector_energyEfficiencyClass_g"
+];
+
+export const offers = [
+  {
+    name: 'financing',
+    periods: [12, 24, 36, 48, 60, 72, 84, 96],                      // tslint:disable-line
+    sliders: [
+      { name: 'firstInstallment', min: 0, step: 100, unit: 'euro', withRangeLimit: true },              // tslint:disable-line
+      { name: 'annualMileage', min: 5000, max: 60000, step: 5000, unit: 'km' }  // tslint:disable-line
+    ]
+  },
+  {
+    name: 'leasing',
+    periods: [30, 36, 42, 48, 54, 60],                              // tslint:disable-line
+    sliders: [
+      { name: 'firstInstallment', min: 0, step: 100, unit: 'euro' },              // tslint:disable-line
+      { name: 'annualMileage', min: 5000, max: 60000, step: 5000, unit: 'km' }  // tslint:disable-line
+    ]
+  },
+  { name: 'buy' },
+  { name: 'abo', periods: [1, 2, 6, 9, 12, 18], isActive: false }   // tslint:disable-line
+];
+
+export const checkoutOffers = [offers[0], offers[1], offers[THREE], offers[2]];
+
+export const comparableKeys = ['paybackPeriod', 'annualMileage', 'firstInstallment', 'withAddServices', 'withTransportation'];
+
+export const aboColorOptions = ['black', 'grey', 'white', 'blue'];
+export const aboIncludedServices = [
+  'KFZ-Versicherung (Haftpflicht, Teil- & Vollkasko)',
+  '4 Jahre Garantie',
+  'Wartung, Verschleiß & wintertaugliche Reifen',
+  'Zulassung',
+  'Steuer'
+];
+export const aboFaq = [
+  'Wer kann dieses Abo buchen?',
+  'Wie erfolgen Übergabe und Ruckgabe?',
+  'Wie lang ist die Laufzeit?',
+  'Was kostet ein Auto Abo?'
+];
+
+export const checkoutWarranties = [
+  { name: 'silver', color0: '#A2A0A3', color1: '#D6D6D6', isWarrantyActive: true },
+  { name: 'bronze', color0: '#A18151', color1: '#E9BC79' },
+  { name: 'gold', color0: '#F2D88F', color1: '#B79D62' },
+  { name: 'no-warranty', color0: '#F2D88F', color1: '#B79D62' }
+];
+
+export const checkoutStepUrls = [
+  'contact-information', 'payment-type', 'payment-details', 'additional-services', 'order-overview', 'additional-services-delivery'
+];
+
+export const checkoutSteps = [
+  { pathname: 'contact-information', component: 'ContactInformation', props: 'contactInformationProps', minutes: 2 },
+  { pathname: 'payment-type', component: 'PaymentType', props: 'paymentTypeProps', minutes: 1 },
+  { pathname: 'payment-details', component: 'PaymentDetails', props: 'paymentDetailsProps', minutes: 2 },
+  { pathname: 'additional-services', component: 'AdditionalServices', props: 'additionalServicesProps', minutes: 2 },
+  { pathname: 'order-overview', component: 'OrderOverview', props: 'orderOverviewProps', minutes: 1 }
+];
+
+export const checkoutSubStep = { pathname: 'additional-services-delivery', component: 'DeliveryServices', props: 'deliveryServicesProps' };

package/constants/highlights.ts

@@ -0,0 +1,165 @@
+import _get from 'lodash/get';
+import { selectors } from '@bytebrand/car-schema-selectors';
+
+export const climatisation = {
+  key: 'heatingCooling_climatisation',
+  climatisationKeys: [
+    // 'selector_climatisation_no_airCondition',
+    'selector_climatisation_airCondition',
+    'selector_climatisation_automaticAirCondition',
+    'selector_climatisation_2_automaticAirCondition',
+    'selector_climatisation_3_automaticAirCondition',
+    'selector_climatisation_4_automaticAirCondition',
+    'selector_climatisation_5_automaticAirCondition'
+  ],
+  endpointKey: 'heatingCooling.climatisation'
+};
+
+export const airbags = {
+  key: 'airbags_airbag',
+  airbagKeys: [
+    'selector_airbag_driver',
+    'selector_airbag_passenger',
+    'selector_airbag_front',
+    'selector_airbag_frontAndSide',
+    'selector_airbag_frontSideAndOther',
+    'selector_airbag_head',
+    'selector_airbag_knee',
+    'selector_airbag_seatCushion',
+    'selector_airbag_rearSeat',
+    'selector_airbag_rear',
+    'selector_airbag_airBelt',
+    'selector_airbag_pedestrian',
+    'selector_airbag_motorcycle'
+  ],
+  endpointKey: 'airbags.airbag'
+};
+
+export const trailerHitch = {
+  key: 'search_trailerHitch',
+  trailerHitchKeys: [
+    'trailerCouplingRotatable',
+    'trailerCouplingRemovable',
+    'trailerCouplingFix'
+  ],
+  endpointKey: 'trailerCoupling'
+};
+
+export const lights = {
+  key: 'search_noIncandescentLight',
+  noIncandescentLightKeys: [
+    'ledHeadlights',
+    'laserHeadlights',
+    'xenonHeadlights',
+    'biLEDHeadlights',
+    'biXenonHeadlights',
+    'daytimeRunningLightsLED'
+  ],
+  endpointKey: 'lights'
+};
+
+export const parkingAssistants = {
+  key: 'search_parkingAssistants',
+  parkingAssistantsKeys: [
+    'selector_parkingAssistants_front',
+    'selector_parkingAssistants_rear',
+    'selector_parkingAssistants_camera',
+    'selector_parkingAssistants_360Camera',
+    'selector_parkingAssistants_selfSteeringSystems',
+    'selector_parkingAssistants_other'
+  ],
+  endpointKey: 'assistants.parkingAssistants'
+};
+
+export const seatHeating = {
+  key: 'search_seatHeating',
+  driverSeats: {
+    key: 'selector_driverSeats_electricHeated',
+    endpointKey: 'seats.driverSeats'
+  },
+  coDriverSeats: {
+    key: 'selector_coDriverSeats_electricHeated',
+    endpointKey: 'seats.coDriverSeats'
+  },
+  backSeats: {
+    key: 'selector_backSeats_electricHeated',
+    endpointKey: 'seats.backSeats'
+  }
+};
+
+function isKeyTrueInCarObject(keys: any, endpoint: string, car: any) {
+  let result = false;
+
+  if (Array.isArray(keys)) {
+    keys.forEach((key: string) => {
+      if (result) { return true; }
+
+      const path = `${endpoint}.${key}`;
+
+      result = _get(car, path, false);
+    });
+  }
+
+  return result;
+}
+
+function isKeyInCarArray(keys: any, arr: any, car: any) {
+  let result = false;
+
+  if (Array.isArray(keys)) {
+    keys.forEach((key: string) => {
+      if (result) { return true; }
+
+      result = _get(car, arr, []).some((item: string) => item === key);
+    });
+  }
+
+  return result;
+}
+
+export function getActualHighlights(car: any, t: any) {
+  const result: any[] = [];
+
+  Object.keys(selectors.highlights).forEach((key: string) => {
+    const item = selectors.highlights[key].tkey;
+    let value = _get(car, item.replace('_', '.'), null);
+
+    /* unique cases */
+    switch (item) {
+      case climatisation.key:
+        value = climatisation.climatisationKeys.some((str: string) => str === _get(car, climatisation.endpointKey, ''));
+        break;
+
+      case airbags.key:
+        value = isKeyInCarArray(airbags.airbagKeys, airbags.endpointKey, car);
+        break;
+
+      case seatHeating.key:
+        const isDriverSeats = _get(car, seatHeating.driverSeats.endpointKey, []).some((i: string) => i === seatHeating.driverSeats.key);
+        const isCoDriverSeats = _get(car, seatHeating.coDriverSeats.endpointKey, []).some((i: string) => i === seatHeating.coDriverSeats.key);
+        const isBackSeats = _get(car, seatHeating.backSeats.endpointKey, []).some((i: string) => i === seatHeating.backSeats.key);
+        value = isDriverSeats || isCoDriverSeats || isBackSeats;
+        break;
+
+      case trailerHitch.key:
+        value = isKeyTrueInCarObject(trailerHitch.trailerHitchKeys, trailerHitch.endpointKey, car);
+        break;
+
+      case lights.key:
+        value = isKeyTrueInCarObject(lights.noIncandescentLightKeys, lights.endpointKey, car);
+        break;
+
+      case parkingAssistants.key:
+        value = isKeyInCarArray(parkingAssistants.parkingAssistantsKeys, parkingAssistants.endpointKey, car);
+        break;
+
+      default:
+    }
+
+    if (value) {
+      result.push({ icon: item, description: t(`cbd:${item}`) });
+    }
+  });
+
+  return result;
+}

package/constants/price.ts

@@ -0,0 +1,9 @@
+export const priceRatings = ['noRating', 'highPrice', 'increasedPrice', 'fairPrice', 'goodPrice', 'topPrice'];
+
+export const priceRatingConfig: any = {
+  topPrice: { min: -25, max: -9 },
+  goodPrice: { min: -9, max: -4 },
+  fairPrice: { min: -4, max: 4 },
+  increasedPrice: { min: 4, max: 17 },
+  highPrice: { min: 17, max: 25 }
+};

package/constants/selectors.ts

@@ -0,0 +1,38 @@
+import { selectors } from '@bytebrand/car-schema-selectors';
+
+// Basic data
+export const BODY_TYPES = selectors.category
+  .filter(category => category !== 'selector_unknown');
+
+// Engine | Transmission | Drive
+export const FUEL_TYPES = selectors.fuel
+  .filter(fuel => fuel !== 'selector_unknown');
+
+export const TRANSMISSION_TYPES = selectors.gearbox
+  .filter((gearbox: string) => gearbox !== 'selector_unknown');
+
+export const DRIVE_TYPES = selectors.driveType
+  .filter((driveType: string) => driveType !== 'selector_unknown');
+
+// Color | Pad
+export const EXTERIOR_COLORS = selectors.exteriorColor
+  .filter((color: string) => color !== 'selector_unknown');
+export const INTERIOR_COLORS = selectors.interiorColor
+  .filter((color: string) => color !== 'selector_unknown');
+export const INTERIOR_TYPES = selectors.interiorType
+  .filter((color: string) => color !== 'selector_unknown');
+
+// Highlights
+export const HIGHLIGHTS_TYPES = Object.keys(selectors.highlights)
+  .map((key: string) => selectors.highlights[key].tkey);
+
+// Environment
+export const EMISSION_CLASS = selectors.emissionClass
+  .filter((emClass: string) => emClass !== 'selector_unknown');
+
+export const EMISSION_STICKERS = selectors.emissionSticker
+  .filter((sticker: string) => sticker !== 'selector_unknown');
+
+  // Availability
+export const DELIVERY_PERIODS = selectors.deliveryPeriod
+.filter((deliveryPeriod: string) => deliveryPeriod !== 'selector_unknown');

package/constants.ts

@@ -0,0 +1,91 @@
+// Autobahn (auto.de redesign) — shared lookup constants.
+// Typed replacement for the design kit's `window.*` globals (data.jsx / ui.jsx / CdpModules.jsx).
+// Pure data only — no DOM, no store access. Imported by the ported presentational components.
+//
+// NOTE on counts: the BODY_TYPES / QUICK_FILTERS sample counts below are the design's
+// placeholder figures. They are only used by the W2 filter UI, which will replace them with
+// REAL aggregation counts from searchStore.aggregation. They are not rendered as real data in W1.
+
+/** Pkw-EnVKV CO₂ efficiency classes (best → worst) and their band colors. */
+export const CO2_CLASSES = ['A', 'B', 'C', 'D', 'E', 'F', 'G'] as const;
+export type Co2Class = (typeof CO2_CLASSES)[number];
+export const CO2_COLORS: readonly string[] = [
+  '#1FA01F', '#5DAE2E', '#9FC21C', '#F2C200', '#F2900D', '#E8601A', '#D4202B',
+];
+
+/** Preisbewertung (price-rating) tiers, index 0 = Top … 4 = Hoch. green → red. */
+export const TIER_LABELS = ['Top Preis', 'Guter Preis', 'Fairer Preis', 'Erhöht', 'Hoher Preis'] as const;
+// i18n key suffixes parallel to TIER_LABELS — components render t('autobahn:tier.<key>') so the
+// Preisbewertung label localizes (TIER_LABELS stays the German source-of-truth used for tier→index logic).
+export const TIER_KEYS = ['top', 'good', 'fair', 'raised', 'high'] as const;
+export const TIER_COLORS: readonly string[] = ['#0F7B43', '#4FA86B', '#C7B53A', '#E08A2B', '#D4502B'];
+export type RatingTier = 0 | 1 | 2 | 3 | 4;
+
+/** SRP sort options (labels match the design; mapped to real sort params by the SRP container). */
+export const SORTS = [
+  'Relevanz',
+  'Preis aufsteigend',
+  'Preis absteigend',
+  'Erstzulassung',
+  'Kilometerstand',
+  'Leistung',
+] as const;
+export type SortLabel = (typeof SORTS)[number];
+
+/** Quick-filter chips for the srp-bar: [lucide icon, label, defaultActive?]. */
+export type QuickFilter = readonly [icon: string, label: string, defaultActive?: boolean];
+export const QUICK_FILTERS: readonly QuickFilter[] = [
+  ['sliders-horizontal', 'Filter', true],
+  ['fuel', 'Diesel'],
+  ['cog', 'Automatik'],
+  ['battery-charging', 'Hybrid'],
+  ['gauge', 'bis 50.000 km'],
+  ['wallet', 'bis 300 €/mtl.'],
+  ['calendar', 'ab 2022'],
+];
+
+/** Brand shortlist for the Marke select (full list comes from appStore.manufacturers at runtime). */
+export const BRANDS: readonly string[] = [
+  'VW', 'Mercedes-Benz', 'BMW', 'Audi', 'Opel', 'Škoda', 'Ford', 'Hyundai',
+];
+
+/** Body-type tiles: [label, lucide icon, placeholder count]. Counts are design placeholders (W2 → real aggregations). */
+export type BodyType = readonly [label: string, icon: string, placeholderCount: string];
+export const BODY_TYPES: readonly BodyType[] = [
+  ['Kleinwagen', 'car', '4.812'],
+  ['Limousine', 'car-front', '5.530'],
+  ['Kombi', 'caravan', '6.118'],
+  ['SUV', 'truck', '7.940'],
+  ['Cabrio', 'wind', '1.270'],
+  ['Van', 'bus', '2.691'],
+];
+
+/** Marker text rendered wherever the design shows a field we have no real data source for yet. */
+export const NEEDS_DATA_LABEL = 'Daten folgt';
+
+// ---------------------------------------------------------------------------
+// Legacy shared constants (moved here from fe-ui-core).
+//
+// This block mirrors the public symbol set of the old
+// `@bytebrand/fe-ui-core/constants` barrel so consumers can swap that
+// specifier for `@bytebrand/fe-ui-core-autobahn/constants` 1:1. The
+// implementations live under ./constants/ (core.ts, app.ts, price.ts,
+// Search.ts, …); fe-ui-core re-exports them via shims until it is deleted.
+// ---------------------------------------------------------------------------
+
+export {
+  offers,
+  checkoutOffers,
+  checkoutWarranties,
+  checkoutSteps,
+  checkoutSubStep,
+  DELIVERY_PERIODS_EXTRA,
+  THREE,
+  WLTP_ENERGY_EFFICIENCY_CLASS
+} from './constants/core';
+
+export { CUSTOM_ERROR_MESSAGES, supportPhone, supportPhoneLink } from './constants/app';
+
+export { priceRatings } from './constants/price';
+
+export { THROTTLE_DELAY } from './constants/Search';

package/data/DataTransformers.ts

@@ -0,0 +1,88 @@
+import _get from 'lodash/get';
+import { formatMileage } from '../utils/CommonUtils';
+export const transformManufacturers = (brands: any) => {
+  const { top = [], regular = [] } = brands;
+  const brandsArr: any = [];
+
+  if (top.length) {
+    brandsArr.push({ value: 'top', label: 'top', isDisabled: true });
+    top.map((brand: any) => brandsArr.push({ value: brand.title, label: brand.title }));
+  }
+
+  if (top.length) {
+    brandsArr.push({ value: 'regular', label: 'regular', isDisabled: true });
+    regular.map((brand: any) => brandsArr.push({ value: brand.title, label: brand.title }));
+  }
+
+  return brandsArr;
+};
+
+export const transformModelsGeneral = (models: any) => {
+  const groupArr: any = [];
+
+  Object.keys(models).map((key: string) => {
+    groupArr.push({
+      value: models[key].title,
+      label: models[key].title,
+      isSeries: true
+    });
+
+    models[key].models.map((model: any) => groupArr.push({
+      value: model.title,
+      label: model.title
+    }));
+  });
+
+  return groupArr;
+};
+
+export const transformDataForDecoratedCar = (car: any) => {
+  const getMileage = parseInt(_get(car, 'mainData.mileage', _get(car, 'info.mileage')), 10);
+  const consumptionCombined = _get(car, 'consumption.consumptionCombined', null);
+  const consumptionPowerCombined = _get(car, 'consumption.consumptionPowerCombined', null);
+  return {
+    mileage: getMileage.toString().length > 3 ? formatMileage(getMileage).toString() : formatMileage(getMileage).toString().replace('.', ','),  // tslint:disable-line
+    regDate: _get(car, 'mainData.firstRegistration', null),
+    consumptionCombined: consumptionCombined ? consumptionCombined.toString().replace('.', ',') : consumptionCombined,
+    consumptionPowerCombined: consumptionPowerCombined ? consumptionPowerCombined.toString().replace('.', ',') : consumptionPowerCombined,
+    powerKW: _get(car, 'engineData.powerKW', null),
+    powerPS: _get(car, 'engineData.powerPS', null),
+    co2: _get(car, 'environmentEmissions.co2', null),
+    availabilityFrom: _get(car, 'offer.availabilityFrom', null),
+    deliveryPeriod: _get(car, 'offer.deliveryPeriod', null),
+    vehicleOwners: _get(car, 'mainData.numberOfPreviousOwners'),
+    doorsOnly: _get(car, 'mainData.doors'),
+    vatRate: _get(car, 'price.vatRate'),
+    topSpeed: _get(car, 'engineData.highSpeed', null),
+    torque: _get(car, 'engineData.torque', null),
+    batteryCapacity: _get(car, 'battery.batteryCapacity', null),
+    seats: _get(car, 'mainData.seats', null),
+    doors: _get(car, 'mainData.doors', null),
+    capacity: _get(car, 'sizeVolumeWeight.cargoCapacity', null),
+    width: _get(car, 'sizeVolumeWeight.width', null),
+    height: _get(car, 'sizeVolumeWeight.height', null),
+    length: _get(car, 'sizeVolumeWeight.length', null),
+    base: _get(car, 'driveSuspension.wheelBase', null),
+    fuelCapacity: _get(car, 'sizeVolumeWeight.fuelCapacity', null),
+    maximumWeightCapacity: _get(car, 'sizeVolumeWeight.maxWeight', null),
+    tareWeight: _get(car, 'sizeVolumeWeight.emptyWeight', null),
+    bootCapacity: _get(car, 'sizeVolumeWeight.cargoCapacity', null),
+    capacityLoad: _get(car, 'sizeVolumeWeight.completeCapacity', null),
+    wltpCo2:  _get(car, 'environmentEmissions.wltpCo2', null),
+    wltpEnergyEfficiencyClass: _get(car, 'environmentEmissions.wltpEnergyEfficiencyClass', null),
+    wltpDischargedEnergyEfficiencyClass: _get(car, 'environmentEmissions.wltpDischargedEnergyEfficiencyClass', null),
+    pluginHybrid: _get(car, 'engineData.pluginHybrid', null),
+    wltpCombined: _get(car, 'consumption.wltpCombined', null),
+    wltpPowerCombined: _get(car, 'consumption.wltpPowerCombined', null),
+    wltpWeightedCombined: _get(car, 'consumption.wltpWeightedCombined', null),
+    wltpWeightedPowerCombined: _get(car, 'consumption.wltpWeightedPowerCombined', null)
+  };
+};
+
+export const transformQuotes = (quotes: any[]) => quotes.map(q => ({
+  id: _get(q, 'id', Date.now().toString()),
+  image: _get(q, 'image', ''),
+  name: _get(q, 'name', ''),
+  source: 'Kundenbewertung via Google',
+  review: _get(q, 'quote_of_customer', '')
+}));