@bytebrand/fe-ui-core 4.2.195 → 4.2.197

package/package.json

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

package/source/components/UserDashboardPage/sections/OrderStatusSection/OrderStatusSection.tsx

@@ -21,7 +21,7 @@ interface IOrderStatusSection {
   isFetching: boolean;
   withAdditionalInfo?: boolean; // for using on /account/my-order.
   orderedCars: any[]; // TODO: create interface for orderedCars, when the object is formatted by the backend
-  wonCars: any[];
+  wonCars?: any[];
 }
 
 const OrderStatusSection = ({
@@ -116,7 +116,7 @@ const OrderStatusSection = ({
   }
 
   const carPriceWithWarrantyTitle = (warranty: { warrantyPackage: string, warrantyCost: number, warrantyPeriod: number }) => {
-    if (!warranty.warrantyCost) {
+    if (!warranty || !warranty.warrantyCost) {
       return t('MyOrderPage:carPrice');
     }
     const warrantyPackage = t(`MyOrderPage:${warranty.warrantyPackage}`);
@@ -160,7 +160,7 @@ const OrderStatusSection = ({
 
             const transformedDeliveryDate = !!deliveryDate ? `${t('MyOrderPage:deliveredOn')} ${fromUTCToDateString(deliveryDate)}` : null;
 
-            const currentSalesPriceWithWarranty = !!warranty.warrantyCost ? currentSalesPrice + warranty.warrantyCost : currentSalesPrice;
+            const currentSalesPriceWithWarranty = !!warranty && !!warranty.warrantyCost ? currentSalesPrice + warranty.warrantyCost : currentSalesPrice;
   
             const additionalOrderData = {
               addressData: [

package/source/components/VehicleDetailedSidebar/VehicleDetailedSidebar.tsx

@@ -1,6 +1,7 @@
 import React, { useState, useEffect, useRef, FunctionComponent } from 'react';
 import _get from 'lodash/get';
-import { Hidden, Visible } from 'react-grid-system';
+import { Hidden } from 'react-grid-system';
+import { isMobileOnly } from 'react-device-detect';
 import PriceContent from './partials/PriceContent';
 import Title from './partials/Title';
 import Price from './partials/Price';
@@ -148,13 +149,13 @@ const VehicleDetailedSidebar: FunctionComponent<IVehicleDetailedSidebarProps> =
         <Title {...titleProps} />
         <Price {...priceProps} />
         <Price {...priceProps} isSticky={true} />
-        <Visible xs sm md>
+        {isMobileOnly && (
           <div
             ref={ref}
             data-locale='de-DE'
             data-template-id='5419b6a8b0d04a076446a9ad'
             data-businessunit-id='46edfd1c0000640005017f22'
-            data-style-height='42px'
+            data-style-height='32px'
             data-style-width='100%'
             data-theme='light'
             data-style-alignment='center'
@@ -167,7 +168,7 @@ const VehicleDetailedSidebar: FunctionComponent<IVehicleDetailedSidebarProps> =
               Trustpilot
             </a>
           </div>
-        </Visible>
+        )}
         {props.children}
       </div>
       <div>

package/source/components/_common/Range/Range.tsx

@@ -2,7 +2,6 @@ import React, { useState, useEffect } from 'react';
 import FormattedNumber from '../../FormattedNumber/FormattedNumber';
 import { Slider } from '@mui/material';
 import { isMobileOnly } from 'react-device-detect';
-import { iOS } from '../../../framework/utils/CommonUtils';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 
 interface IRangeProps {
@@ -41,7 +40,6 @@ const Range: React.FC<IRangeProps> = ({
   maxFinancingFirstInstallment
 }: IRangeProps) => {
   const [rangeValue, setRangeValue] = useState<number | number[]>(0);
-  const isIOS = iOS();
 
   useEffect(
     () => {
@@ -51,9 +49,6 @@ const Range: React.FC<IRangeProps> = ({
   )
 
   const onChangeRange = (event: Event, value: number | number[]) => {
-    if (isIOS && event.type === 'mousedown') {
-      return;
-    }
     setRangeValue(value);
     onChange(event, value)
   }