@bytebrand/fe-ui-core 4.3.1 → 4.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (125) hide show
  1. package/__tests__/components/UserDasboardPage/sections/CheckoutSection/CheckoutSection.test.tsx +613 -0
  2. package/__tests__/components/UserDasboardPage/sections/FavoriteSection/FavoriteSection.test.tsx +335 -0
  3. package/__tests__/utils/CommonUtils/getOfferSliders.test.ts +4 -2
  4. package/common.ts +6 -2
  5. package/package.json +19 -28
  6. package/source/components/AccordionWidget/AccordionWidget.tsx +1 -3
  7. package/source/components/Breadcrumbs/Breadcrumbs.tsx +3 -3
  8. package/source/components/Checkout/CheckoutStepper/CheckoutStepper.styl +2 -190
  9. package/source/components/Checkout/CheckoutStepper/CheckoutStepper.tsx +15 -16
  10. package/source/components/Checkout/OrderOverviewItem/OrderOverviewItem.styl +2 -2
  11. package/source/components/Checkout/OrderOverviewItem/OrderOverviewItem.tsx +3 -3
  12. package/source/components/FormattedNumber/FormattedNumber.tsx +2 -3
  13. package/source/components/InfoBlocks/FirstInfoBlock/FirstInfoBlockItem/FirstInfoBlockItem.styl +4 -6
  14. package/source/components/OfferDetailedSection/partials/PanelConfig.tsx +0 -3
  15. package/source/components/OfferPanel/MuiOfferPeriod/{MuiOfferPeriod.theme.js → MuiOfferPeriod.theme.tsx} +8 -13
  16. package/source/components/OfferPanel/MuiOfferPeriod/MuiOfferPeriod.tsx +28 -4
  17. package/source/components/OfferPanel/OfferCheckboxGroup/CheckboxContainer.tsx +6 -12
  18. package/source/components/OfferPanel/OfferCheckboxGroup/OfferCheckboxGroup.tsx +1 -1
  19. package/source/components/OfferPanel/OfferPanel.tsx +1 -1
  20. package/source/components/OfferPanel/OfferPeriod/OfferPeriod.tsx +0 -4
  21. package/source/components/OfferPanel/RangeGroup/RangeGroup.tsx +6 -4
  22. package/source/components/PriceRatingDetailed/PriceRatingDetailed.tsx +6 -2
  23. package/source/components/SearchFilters/filters/AlternativeID.tsx +42 -53
  24. package/source/components/SearchFilters/filters/DriveType.tsx +1 -1
  25. package/source/components/SearchFilters/filters/EmissionSticker.tsx +1 -1
  26. package/source/components/SearchFilters/filters/FirstRegistration.tsx +0 -1
  27. package/source/components/SearchFilters/filters/InteriorColor.tsx +1 -1
  28. package/source/components/SearchFilters/filters/InteriorMaterial.tsx +2 -1
  29. package/source/components/SearchFilters/filters/Mileage.tsx +1 -1
  30. package/source/components/SearchFilters/filters/Power.tsx +36 -17
  31. package/source/components/SearchFilters/filters/StateOptions.tsx +0 -1
  32. package/source/components/SearchFilters/filters/Transmission.tsx +1 -1
  33. package/source/components/SearchPage/SearchChips/SearchChips.tsx +1 -1
  34. package/source/components/SearchPageMobile/FiltersDetailed/BodyType.tsx +3 -3
  35. package/source/components/SearchPageMobile/FiltersDetailed/Consumption.tsx +2 -2
  36. package/source/components/SearchPageMobile/FiltersDetailed/Doors.tsx +1 -1
  37. package/source/components/SearchPageMobile/FiltersDetailed/MakeModel.tsx +1 -1
  38. package/source/components/SearchWidget/ColorWidget/BodyColorWidget.tsx +3 -3
  39. package/source/components/SearchWidget/EnvironmentWidget/EnvironmentWidget.tsx +3 -3
  40. package/source/components/SearchWidget/HighlightsWidget/HighlightsWidget.tsx +2 -2
  41. package/source/components/SearchWidget/StateWidget/StateWidget.tsx +1 -2
  42. package/source/components/SearchWidgetsMobile/BasicDataWidgetMobile/BasicDataWidgetMobile.tsx +4 -4
  43. package/source/components/SearchWidgetsMobile/EquipmentsWidget/EquipmentsWidget.tsx +16 -16
  44. package/source/components/SearchWidgetsMobile/HighlightsWidgetMobile/HighlightsWidgetMobile.tsx +1 -1
  45. package/source/components/SearchWidgetsMobile/InteriorWidget/InteriorWidget.tsx +1 -1
  46. package/source/components/SearchWidgetsMobile/SafetyWidget/SafetyWidget.tsx +6 -6
  47. package/source/components/Stepper/Stepper.tsx +4 -3
  48. package/source/components/UserDashboardPage/sections/CheckoutSection/CheckoutSection.styl +38 -0
  49. package/source/components/UserDashboardPage/sections/CheckoutSection/CheckoutSection.tsx +120 -0
  50. package/source/components/UserDashboardPage/sections/FavoriteSection/FavoriteSection.styl +22 -0
  51. package/source/components/UserDashboardPage/sections/FavoriteSection/FavoriteSection.tsx +84 -0
  52. package/source/components/UserDashboardPage/sections/OrderStatusSection/AdditionalOrderInfo.styl +11 -2
  53. package/source/components/UserDashboardPage/sections/OrderStatusSection/AdditionalOrderInfo.tsx +5 -5
  54. package/source/components/UserDashboardPage/sections/OrderStatusSection/OrderStatusCar.tsx +57 -38
  55. package/source/components/UserDashboardPage/sections/OrderStatusSection/OrderStatusCard.tsx +2 -2
  56. package/source/components/UserDashboardPage/sections/OrderStatusSection/OrderStatusSection.tsx +183 -101
  57. package/source/components/UserDashboardPage/sections/RequestedCarsSection/RequestedCarsSection.tsx +5 -7
  58. package/source/components/Vehicle/VehicleFormattedPrice/VehicleFormattedPrice.tsx +33 -7
  59. package/source/components/VehicleDetailedSidebar/VehicleDetailedSidebar.styl +10 -2
  60. package/source/components/VehicleDetailedSidebar/VehicleDetailedSidebar.tsx +21 -14
  61. package/source/components/VehicleDetailedSidebar/partials/Price.styl +5 -1
  62. package/source/components/VehicleDetailedSidebar/partials/Price.tsx +2 -1
  63. package/source/components/VehicleDetailedSidebar/partials/PriceContent.styl +16 -5
  64. package/source/components/VehicleDetailedSidebar/partials/PriceContent.tsx +9 -4
  65. package/source/components/VehicleDetailedSidebar/partials/Properties.tsx +1 -1
  66. package/source/components/VehicleDetailedSlider/VehicleDetailedSlider.styl +45 -0
  67. package/source/components/VehicleDetailedSlider/VehicleDetailedSlider.tsx +121 -42
  68. package/source/components/VehicleDetailedSlider/partials/PriceData.styl +4 -1
  69. package/source/components/VehicleDetailedSlider/partials/PriceData.tsx +8 -1
  70. package/source/components/VehicleDetailedSlider/partials/Stats.tsx +2 -2
  71. package/source/components/VehicleSmallCard/VehicleData/VechiclePriceItem/VechiclePriceItem.tsx +9 -7
  72. package/source/components/VehicleSmallCard/VehicleData/VehiclePrice/VehiclePrice.styl +35 -1
  73. package/source/components/VehicleSmallCard/VehicleData/VehiclePrice/VehiclePrice.tsx +9 -3
  74. package/source/components/VehicleSmallCard/VehicleData/VehicleTitle/VehicleTitle.styl +11 -2
  75. package/source/components/VehicleSmallCard/VehicleData/VehicleTitle/VehicleTitle.tsx +2 -1
  76. package/source/components/VehicleSmallCard/VehicleSmallCard.styl +3 -1
  77. package/source/components/VehicleSmallCard/VehicleSmallCard.tsx +3 -7
  78. package/source/components/_common/Badge/Badge.styl +3 -0
  79. package/source/components/_common/Badge/Badge.tsx +1 -1
  80. package/source/components/_common/Button/Button.tsx +5 -4
  81. package/source/components/_common/Checkbox/FormCheckbox.tsx +4 -4
  82. package/source/components/_common/CheckboxMaterial/CheckboxMaterial.tsx +1 -1
  83. package/source/components/_common/Chip/Chip.tsx +1 -3
  84. package/source/components/_common/ExpansionPanel/ExpansionPanel.tsx +3 -3
  85. package/source/components/_common/IconSVG/IconSVGConfig.tsx +2 -0
  86. package/source/components/_common/IconSVG/SVG/flags/SK.tsx +0 -1
  87. package/source/components/_common/IconSVG/SVG/slider/360New.tsx +1 -1
  88. package/source/components/_common/IconSVG/SVG/slider/YoutubeButton.tsx +26 -0
  89. package/source/components/_common/MaterialAccordion/MaterialAccordion.tsx +22 -30
  90. package/source/components/_common/MaterialAutocomplete/MaterialAutocomplete.styled.tsx +8 -8
  91. package/source/components/_common/MaterialDatePicker/MaterialDatePicker.styled.tsx +0 -1
  92. package/source/components/_common/MaterialSelect/MaterialSelect.styled.tsx +12 -15
  93. package/source/components/_common/MaterialSelect/MaterialSelect.tsx +3 -3
  94. package/source/components/_common/MaterialSwitch/MaterialSwitch.tsx +3 -1
  95. package/source/components/_common/MaterialTooltip/MaterialTooltip.styled.tsx +1 -1
  96. package/source/components/_common/MaterialTooltip/MaterialTooltip.tsx +3 -3
  97. package/source/components/_common/Modal/CookieModal.tsx +1 -3
  98. package/source/components/_common/Modal/Modal.styled.tsx +2 -1
  99. package/source/components/_common/Modal/Modal.tsx +1 -5
  100. package/source/components/_common/Modal/ModalsConfig.tsx +5 -1
  101. package/source/components/_common/Modal/modals/ManageCookieModal/ManageCookieModal.styl +23 -7
  102. package/source/components/_common/Modal/modals/ManageCookieModal/ManageCookieModal.tsx +84 -36
  103. package/source/components/_common/Modal/modals/PreviewCookieModal/PreviewCookieModal.styl +29 -14
  104. package/source/components/_common/Modal/modals/PreviewCookieModal/PreviewCookieModal.tsx +17 -10
  105. package/source/components/_common/OfferRequestButtonWrapper/OfferRequestButtonWrapper.tsx +12 -4
  106. package/source/components/_common/Range/Range.tsx +26 -16
  107. package/source/components/_common/UserMenu/MaterialMenu.styled.tsx +0 -1
  108. package/source/components/_common/UserMenu/MaterialMenu.tsx +3 -3
  109. package/source/components/_common/UserMenu/MaterialMenuItem.tsx +42 -20
  110. package/source/components/_common/UserMenu/NestedMenu.tsx +1 -1
  111. package/source/components/_common/withStats/withStats.styl +3 -0
  112. package/source/components/_common/withStats/withStats.tsx +19 -16
  113. package/source/components/containers/SearchPage/FiltersContainer/FiltersContainer.styl +14 -1
  114. package/source/components/containers/SearchPage/FiltersContainer/FiltersContainer.tsx +78 -42
  115. package/source/framework/constants/common.ts +89 -60
  116. package/source/framework/constants/highlights.ts +1 -1
  117. package/source/framework/constants.ts +1 -1
  118. package/source/framework/types/types.ts +9 -4
  119. package/source/framework/utils/CommonUtils.ts +73 -62
  120. package/source/framework/utils/DateUtils.ts +10 -2
  121. package/source/framework/vehiclesProps/decoratedLightProps.tsx +1 -2
  122. package/source/framework/vehiclesProps/decoratedProps.tsx +1 -2
  123. package/source/locales/data.ts +2 -2
  124. package/tslint.json +1 -2
  125. package/utils.ts +2 -0
@@ -1,4 +1,4 @@
1
- import * as React from 'react';
1
+ import React, { useState, KeyboardEvent } from 'react';
2
2
  import TextField from '../../_common/TextField/TextField';
3
3
  import Button from '../../_common/Button/Button';
4
4
  import classNames from 'classnames';
@@ -11,69 +11,58 @@ interface IAlternativeIDProps {
11
11
  error: boolean;
12
12
  successTransition: boolean;
13
13
  autoDeId?: string;
14
- onChange: (value: any) => void;
14
+ onChange: (value: string) => void;
15
15
  onKeyPress?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
16
16
  }
17
17
 
18
- interface IAlternativeIDState {
19
- value: string;
20
- }
18
+ const AlternativeID: React.FC<IAlternativeIDProps> = ({
19
+ t,
20
+ name,
21
+ successTransition,
22
+ autoDeId,
23
+ onChange,
24
+ error = false
25
+ }) => {
26
+ const [value, setValue] = useState<string>(autoDeId || '');
21
27
 
22
- class AlternativeID extends React.Component<IAlternativeIDProps, IAlternativeIDState> {
23
- static defaultProps = {
24
- error: false
28
+ const onFilterChange = (value: string) => {
29
+ setValue(value);
25
30
  };
26
31
 
27
- state = {
28
- value: ''
32
+ const handleSearchClick = () => {
33
+ onChange(value);
29
34
  };
30
35
 
31
- componentDidMount() { this.setState({ value: this.props.autoDeId }); }
32
-
33
- onFilterChange = (value: string) => {
34
- this.setState({ value });
35
- };
36
-
37
- handleSearchClick = () => {
38
- const { value } = this.state;
39
-
40
- this.props.onChange(value);
41
- }
42
-
43
- onKeyAlternativeRedirect = (event: React.KeyboardEvent<HTMLInputElement>) => {
44
- const { value } = this.state;
36
+ const onKeyAlternativeRedirect = (event: React.KeyboardEvent<HTMLInputElement>) => {
45
37
  if (event.key === 'Enter') {
46
- this.props.onChange(value);
38
+ onChange(value);
47
39
  }
48
- }
40
+ };
49
41
 
50
- render(): JSX.Element {
51
- const { t, name, error, successTransition } = this.props;
52
- const inputProps = {
53
- name,
54
- placeholder: 'z.B: FCEE67',
55
- value: this.state.value,
56
- onChange: this.onFilterChange,
57
- onKeyPress: (event: React.KeyboardEvent<HTMLInputElement>) => this.onKeyAlternativeRedirect(event)
58
- };
42
+ const inputProps = {
43
+ name,
44
+ placeholder: 'z.B: FCEE67',
45
+ value,
46
+ onChange: onFilterChange,
47
+ onKeyPress: (event: KeyboardEvent<HTMLInputElement>) => onKeyAlternativeRedirect(event)
48
+ };
59
49
 
60
- const buttonProps = {
61
- onClick: this.handleSearchClick,
62
- className: classNames(
63
- styles.button,
64
- { [styles.buttonWithError]: error },
65
- { [styles.buttonIsFetching]: successTransition }
66
- )
67
- };
50
+ const buttonProps = {
51
+ onClick: handleSearchClick,
52
+ className: classNames(
53
+ styles.button,
54
+ { [styles.buttonWithError]: error },
55
+ { [styles.buttonIsFetching]: successTransition }
56
+ )
57
+ };
68
58
 
69
- return (
70
- <div>
71
- <TextField {...inputProps} />
72
- {error && <span className={styles.errorText}>{t('filters.alternativeErrorText')}</span>}
73
- <Button {...buttonProps}>{t('filters.alternativeBtn')}</Button>
74
- </div>
75
- );
76
- }
77
- }
59
+ return (
60
+ <div>
61
+ <TextField {...inputProps} />
62
+ {error && <span className={styles.errorText}>{t('filters.alternativeErrorText')}</span>}
63
+ <Button {...buttonProps}>{t('filters.alternativeBtn')}</Button>
64
+ </div>
65
+ );
66
+ };
78
67
 
79
- export default AlternativeID;
68
+ export default AlternativeID;
@@ -14,7 +14,7 @@ export interface IDriveTypeProps {
14
14
  }
15
15
 
16
16
  class DriveType extends React.Component<IDriveTypeProps, {}> {
17
- onDriveTypeChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
17
+ onDriveTypeChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string, value?: any): void => {
18
18
  const { values } = this.props;
19
19
  event.stopPropagation();
20
20
  event.nativeEvent.stopImmediatePropagation();
@@ -11,7 +11,7 @@ export interface IEmissionStickerProps {
11
11
  }
12
12
 
13
13
  class EmissionSticker extends React.Component<IEmissionStickerProps, {}> {
14
- onFilterChange = (_event: any, value: string[]) => {
14
+ onFilterChange = (_event?: React.ChangeEvent<HTMLInputElement>, value?: any) => {
15
15
  this.props.onChange('OWNERS_OPTIONS', value);
16
16
  };
17
17
 
@@ -1,7 +1,6 @@
1
1
  import React, { memo } from 'react';
2
2
  import Slider from '../../_common/Slider/Slider';
3
3
  import _get from 'lodash/get';
4
- import { RANGE_FILTERS_DEFAULT_CONTROLS } from '../../../framework/constants/Search';
5
4
  import { sliceLessThan, sliceMoreThan } from '../../../framework/utils/CommonUtils';
6
5
  import { getSearchYears } from '../../../framework/utils/DateUtils';
7
6
  import MaterialAutocomplete from '../../_common/MaterialAutocomplete/MaterialAutocomplete';
@@ -16,7 +16,7 @@ export interface IInteriorColorProps {
16
16
  }
17
17
 
18
18
  const InteriorColor = ({ onChange, values, options, aggregation, t, className }: IInteriorColorProps) => {
19
- const onColorChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
19
+ const onColorChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string, value?: any): void => {
20
20
  event.stopPropagation();
21
21
  event.nativeEvent.stopImmediatePropagation();
22
22
  let _value = value;
@@ -11,12 +11,13 @@ interface IInteriorMaterialProps {
11
11
  values: any[];
12
12
  aggregation?: any;
13
13
  t: (key: string) => string;
14
+ isHorizontal?: boolean;
14
15
 
15
16
  onChange?: (event: any, value: string[]) => void;
16
17
  }
17
18
 
18
19
  const InteriorMaterial = ({ options, values, aggregation, t, onChange }: IInteriorMaterialProps) => {
19
- const onTypeChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
20
+ const onTypeChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string, value?: any): void => {
20
21
  event.stopPropagation();
21
22
  event.nativeEvent.stopImmediatePropagation();
22
23
  let _value = value;
@@ -2,7 +2,7 @@ import React, { memo } from 'react';
2
2
  import _get from 'lodash/get';
3
3
  import { isEqual } from 'lodash';
4
4
  import Slider from '../../_common/Slider/Slider';
5
- import { MILLAGE_FIX, RANGE_FILTERS_DEFAULT_CONTROLS } from '../../../framework/constants/Search';
5
+ import { MILLAGE_FIX } from '../../../framework/constants/Search';
6
6
  import { sliceLessThan, sliceMoreThan, numberWithDot } from '../../../framework/utils/CommonUtils';
7
7
  import styles from './commonFilters.styl';
8
8
  import MaterialAutocomplete from '../../_common/MaterialAutocomplete/MaterialAutocomplete';
@@ -2,10 +2,10 @@ import React, { memo } from 'react';
2
2
  import Slider from '../../_common/Slider/Slider';
3
3
  import MaterialAutocomplete from '../../_common/MaterialAutocomplete/MaterialAutocomplete';
4
4
  import styles from './commonFilters.styl';
5
- import { isEqual } from 'lodash';
5
+ import { isEqual, isNil } from 'lodash';
6
6
  import { RadioGroup } from '@mui/material';
7
7
  import CheckboxMaterial from '../../_common/CheckboxMaterial/CheckboxMaterial';
8
- import { POWER_FIX, RANGE_FILTERS_DEFAULT_CONTROLS } from '../../../framework/constants/Search';
8
+ import { POWER_FIX } from '../../../framework/constants/Search';
9
9
  import { sliceLessThan, sliceMoreThan } from '../../../framework/utils/CommonUtils';
10
10
 
11
11
  interface IPowerProps {
@@ -17,12 +17,18 @@ interface IPowerProps {
17
17
  onChangeControls?: (name: string, value: any) => void;
18
18
  t?: any;
19
19
  }
20
+ interface ITypeState {
21
+ type: string;
22
+ }
20
23
 
21
- class Power extends React.Component<IPowerProps, {}> {
24
+ class Power extends React.Component<IPowerProps, ITypeState> {
22
25
  constructor(props: IPowerProps) {
23
26
  super(props);
24
27
 
25
28
  this.name = 'POWER';
29
+ this.state = {
30
+ type: props.controls.type
31
+ };
26
32
  }
27
33
 
28
34
  private readonly name: string;
@@ -30,10 +36,13 @@ class Power extends React.Component<IPowerProps, {}> {
30
36
 
31
37
  onDropDownChange = (name: string, value: any) => {
32
38
  const { controls, onChange, onChangeControls } = this.props;
33
- const { from, to, type }: any = { ...controls, [name]: value };
39
+ const { type } = this.state;
40
+ const { from, to }: any = { ...controls, [name]: value };
34
41
  const controlsObj = { from, to, type };
35
42
  this.tempValues = { from, to };
36
-
43
+ if ((controlsObj.from === '' && controlsObj.to === '') || (!controlsObj.to && !controlsObj.from)) {
44
+ controlsObj.type = null;
45
+ }
37
46
  onChangeControls(this.name, controlsObj);
38
47
  onChange(this.name, controlsObj);
39
48
  };
@@ -41,9 +50,16 @@ class Power extends React.Component<IPowerProps, {}> {
41
50
  onTypeChange = (_event: React.SyntheticEvent, value: any) => {
42
51
  const { controls, onChange, onChangeControls } = this.props;
43
52
  const values = this.tempValues ? this.tempValues : controls;
44
-
45
- onChangeControls(this.name, { ...values, type: value });
46
- onChange(this.name, { ...values, type: value });
53
+ // this.type=value;
54
+ this.setState(() => ({
55
+ type: value
56
+ }));
57
+ if (!isNil(values.from) && !isNil(values.to)) {
58
+ if (values.from !== '' || values.to !== '') {
59
+ onChangeControls(this.name, { ...values, type: value });
60
+ onChange(this.name, { ...values, type: value });
61
+ }
62
+ }
47
63
  };
48
64
 
49
65
  getOptions = (options: any) => options.map((option: string) => ({
@@ -62,7 +78,9 @@ class Power extends React.Component<IPowerProps, {}> {
62
78
  };
63
79
 
64
80
  renderSlider = () => {
65
- const { values, options, onChange, onChangeControls, controls: { type } } = this.props;
81
+ const { type } = this.state;
82
+
83
+ const { values, options, onChange, onChangeControls } = this.props;
66
84
  const sliderProps = {
67
85
  options,
68
86
  name: this.name,
@@ -70,7 +88,6 @@ class Power extends React.Component<IPowerProps, {}> {
70
88
  values: this.transformValues(values),
71
89
  onChange: (value: any, name: string) => {
72
90
  this.tempValues = value;
73
-
74
91
  onChange(name, { ...value, type });
75
92
  onChangeControls(this.name, { ...value, type });
76
93
  // onChangeControls(this.name, { ...RANGE_FILTERS_DEFAULT_CONTROLS, type });
@@ -81,8 +98,8 @@ class Power extends React.Component<IPowerProps, {}> {
81
98
  };
82
99
 
83
100
  renderRadioGroup = () => {
84
- const { typeOptions, controls } = this.props;
85
- const { type } = controls;
101
+ const { typeOptions } = this.props;
102
+ const { type } = this.state;
86
103
  const radioGroupProps = {
87
104
  value: type,
88
105
  name: 'POWER_TYPE',
@@ -106,15 +123,16 @@ class Power extends React.Component<IPowerProps, {}> {
106
123
 
107
124
  render(): JSX.Element {
108
125
  const { t, controls } = this.props;
109
- const { from = 0, to = 0, type } = controls;
126
+ const { type } = this.state;
127
+ const { from = 0, to = 0 } = controls;
110
128
  const commonProps = {
111
129
  size: 'custom'
112
130
  };
113
131
 
114
132
  const fromProps = {
115
133
  ...commonProps,
116
- value: from || null,
117
- label: this.getLabel('filters.from', controls.type),
134
+ value: (from !== 0 ? `${from}` :0) || null,
135
+ label: this.getLabel('filters.from', type),
118
136
  type: 'number',
119
137
  onChange: (value: any) => this.onDropDownChange('from', value),
120
138
  items: this.getOptions(sliceLessThan(POWER_FIX, to))
@@ -122,9 +140,9 @@ class Power extends React.Component<IPowerProps, {}> {
122
140
 
123
141
  const toProps = {
124
142
  ...commonProps,
125
- value: to || null,
143
+ value: (to !== 0 ? `${to}` :0) || null,
126
144
  type: 'number',
127
- label: this.getLabel('filters.to', controls.type),
145
+ label: this.getLabel('filters.to', type),
128
146
  onChange: (value: any) => this.onDropDownChange('to', value),
129
147
  items: this.getOptions(sliceMoreThan(POWER_FIX, from))
130
148
  };
@@ -150,6 +168,7 @@ class Power extends React.Component<IPowerProps, {}> {
150
168
  export default memo(Power, (prevProps: any, nextProps: any) => {
151
169
  return prevProps.controls.from === nextProps.controls.from &&
152
170
  prevProps.controls.to === nextProps.controls.to &&
171
+ prevProps.t === nextProps.t &&
153
172
  prevProps.controls.type === nextProps.controls.type &&
154
173
  prevProps.values.from === nextProps.values.from &&
155
174
  prevProps.values.to === nextProps.values.to &&
@@ -1,6 +1,5 @@
1
1
  import * as React from 'react';
2
2
 
3
- import Checkbox from '../../_common/Checkbox/Checkbox';
4
3
  import styles from './StateOptions.styl';
5
4
  import FilterLabel from '../../_common/FilterLabel/FilterLabel';
6
5
  import CheckboxMaterial from '../../_common/CheckboxMaterial/CheckboxMaterial';
@@ -14,7 +14,7 @@ export interface ITransmissionProps {
14
14
  }
15
15
 
16
16
  class Transmission extends React.Component<ITransmissionProps, {}> {
17
- onTransmissionChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
17
+ onTransmissionChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string, value?: any): void => {
18
18
  const { values } = this.props;
19
19
  event.stopPropagation();
20
20
  event.nativeEvent.stopImmediatePropagation();
@@ -5,7 +5,7 @@ import ChipFilter from '../ChipFilter/ChipFilter';
5
5
  import { SearchPage as SearchPageTranslate } from '../../../locales/data';
6
6
  import Chip from '@mui/material/Chip';
7
7
 
8
- import { getChipFilterValue, getFormattedPrice } from '../../../framework/utils/CommonUtils';
8
+ import { getChipFilterValue } from '../../../framework/utils/CommonUtils';
9
9
 
10
10
  export interface ISearchChipsProps {
11
11
  chips: any[];
@@ -21,9 +21,9 @@ class BodyType extends React.Component<IBodyTypeBlock> {
21
21
  || !_isEqual(aggregation, nextProps.aggregation)
22
22
  || t !== nextProps.t;
23
23
  }
24
- onBodyTypeCheckboxChange = (option: any) => (_: React.ChangeEvent<HTMLInputElement>, checked: boolean) => this.onFilterChange(checked, option);
24
+ onBodyTypeCheckboxChange = (option: any) => (_event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string) => this.onFilterChange(checked, option);
25
25
 
26
- onFilterChange = (_: boolean, fieldName: string): void => {
26
+ onFilterChange = (_: boolean | string, fieldName: string): void => {
27
27
  const { BODY_TYPE, onChange } = this.props;
28
28
  const bodyTypeField = 'BODY_TYPE';
29
29
  const values = [...BODY_TYPE.values];
@@ -37,7 +37,7 @@ class BodyType extends React.Component<IBodyTypeBlock> {
37
37
  onChange(bodyTypeField, values);
38
38
  };
39
39
 
40
- renderLabel = (option: string, isChecked: boolean): React.ReactNode => {
40
+ renderLabel = (option: string, isChecked: boolean): JSX.Element => {
41
41
  const { t, aggregation } = this.props;
42
42
  // const agg = aggregation && aggregation[option] || 0;
43
43
  const agg = aggregation && aggregation[option] ? aggregation[option] : 0;
@@ -1,4 +1,4 @@
1
- import React, { memo } from 'react';
1
+ import React from 'react';
2
2
  import _get from 'lodash/get';
3
3
 
4
4
  import styles from './Consumption.styl';
@@ -8,7 +8,7 @@ import { CONSUMPTION_FIX } from '../../../framework/constants/Search';
8
8
  export interface IConsumptionProps {
9
9
  values: any;
10
10
  options: any;
11
- controls: any;
11
+ controls?: any;
12
12
  shortTitle?: boolean;
13
13
  onChange: (fieldName: string, fieldValue: any) => void;
14
14
  t?: (phrase: string) => string;
@@ -25,7 +25,7 @@ class Doors extends React.Component<IDoorsProps, IDoorsState> {
25
25
  };
26
26
  }
27
27
 
28
- onFilterChange = (_: boolean, checked?: boolean, fieldName?: string): void => {
28
+ onFilterChange = (_:React.ChangeEvent<HTMLInputElement> | boolean, _checked?: string | boolean, fieldName?: any): void => {
29
29
  const { fieldValues } = this.props;
30
30
  let newValue: string[] = [...fieldValues];
31
31
 
@@ -1,4 +1,4 @@
1
- import React, { memo } from 'react';
1
+ import React from 'react';
2
2
  import _get from 'lodash/get';
3
3
  import styles from './MakeModel.styl';
4
4
  import MaterialSelect from '../../_common/MaterialSelect/MaterialSelect';
@@ -39,7 +39,7 @@ const BodyColorWidget = ({
39
39
 
40
40
  }: IBodyColorWidgetProps) => {
41
41
 
42
- const onColorChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
42
+ const onColorChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: string | boolean, value?: any): void => {
43
43
  event.stopPropagation();
44
44
  event.nativeEvent.stopImmediatePropagation();
45
45
  let _value = value;
@@ -55,7 +55,7 @@ const BodyColorWidget = ({
55
55
  onFilterChange('BODY_COLOR', _value);
56
56
  };
57
57
 
58
- const onCheckboxClick = (_: React.ChangeEvent<HTMLInputElement>, value: boolean): void => {
58
+ const onCheckboxClick = (_event?: React.ChangeEvent<HTMLInputElement>, value?: string | boolean): void => {
59
59
  onFilterChange('METALLIC', value ? 'exterior_metallic' : '');
60
60
  };
61
61
 
@@ -72,7 +72,7 @@ const BodyColorWidget = ({
72
72
  content: option,
73
73
  value: option,
74
74
  className: styles.color,
75
- labelPlacement: 'bottom',
75
+ labelPlacement: 'bottom' as 'bottom',
76
76
  checked: isChecked,
77
77
  label: <FilterLabel text={t(`cbd:${option}`)} agg={agg} isVertical={true}/>,
78
78
  onChange: onColorChange
@@ -50,7 +50,7 @@ const EnvironmentWidget: React.FC<IEnvironmentWidgetProps> = ({
50
50
  const getConsumption = _get(CONSUMPTION, 'values.to');
51
51
  const getEmissionClass = _get(EMISSION_CLASS, 'values');
52
52
 
53
- const onEmissionStickersChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any) => {
53
+ const onEmissionStickersChange = (event?: React.ChangeEvent<HTMLInputElement>, _checked?: string | boolean, value?: any) => {
54
54
  event.stopPropagation();
55
55
  event.nativeEvent.stopImmediatePropagation();
56
56
  const { values } = EMISSION_STICKER;
@@ -63,7 +63,7 @@ const EnvironmentWidget: React.FC<IEnvironmentWidgetProps> = ({
63
63
  onFilterChange(EMISSION_STICKER_KEY, value);
64
64
  };
65
65
 
66
- const onCheckboxClick = (_: React.ChangeEvent<HTMLElement>, value: boolean): void => {
66
+ const onCheckboxClick = (_: React.ChangeEvent<HTMLElement>, value?: boolean | string): void => {
67
67
  onFilterChange(PARTICULATE_FILTER_KEY, value ? 'engineData_particulateFilterDiesel' : '');
68
68
  };
69
69
 
@@ -132,7 +132,7 @@ const EnvironmentWidget: React.FC<IEnvironmentWidgetProps> = ({
132
132
  <MaterialAutocomplete
133
133
  size='custom'
134
134
  value={getConsumption ? getValue(getConsumption) : null}
135
- onChange={(value: string) => onFilterChange(CONSUMPTION_KEY, { from: void 0, to: value })}
135
+ onChange={(value: string) => onFilterChange(CONSUMPTION_KEY, { from: void 0, to: value } as any)}
136
136
  label={t('filters.consumption')}
137
137
  unit='l/100 km'
138
138
  items={getOptions(CONSUMPTION_FIX)}
@@ -29,7 +29,7 @@ export interface IHighlightsWidgetProps {
29
29
 
30
30
  class HighlightsWidget extends React.Component<IHighlightsWidgetProps, {}> {
31
31
 
32
- onFilterChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any) => {
32
+ onFilterChange = (event: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string, value?: any) => {
33
33
  event.stopPropagation();
34
34
  event.nativeEvent.stopImmediatePropagation();
35
35
 
@@ -75,7 +75,7 @@ class HighlightsWidget extends React.Component<IHighlightsWidgetProps, {}> {
75
75
  };
76
76
 
77
77
  render(): JSX.Element {
78
- const { t, HIGHLIGHTS, Link } = this.props;
78
+ const { t, Link } = this.props;
79
79
 
80
80
  return (
81
81
  <div className={styles.highlights}>
@@ -1,7 +1,6 @@
1
1
  import React, { useState, useEffect } from 'react';
2
2
  import Owners from '../../SearchFilters/filters/Owners';
3
3
  import MaterialSelect from '../../_common/MaterialSelect/MaterialSelect';
4
- import StateOptions from '../../SearchFilters/filters/StateOptions';
5
4
  import StateOptionsNew from '../../SearchFilters/filters/StateOptionsNew';
6
5
  import { VEHICLE_CONDITION_KEY, STATE_OPTIONS_KEY } from '../../../framework/constants/Search';
7
6
  import FilterLabel from '../../_common/FilterLabel/FilterLabel';
@@ -48,7 +47,7 @@ const StateWidget = (props: IStateWidgetProps) => {
48
47
  labelContainerClassName: styles.labelWrapper
49
48
  };
50
49
 
51
- const getCheckboxClickHandler = (name: string) => (_: React.ChangeEvent<HTMLInputElement>, value: boolean): void => {
50
+ const getCheckboxClickHandler = (name: string) => (_: React.ChangeEvent<HTMLInputElement>, value?: boolean | string): void => {
52
51
  const { VEHICLE_CONDITION: { values, options } } = props;
53
52
  const currentValues: any = {};
54
53
  options.forEach((key: string) => { currentValues[key] = values.includes(key); });
@@ -12,7 +12,7 @@ import Mileage from '../../SearchPageMobile/FiltersDetailed/Mileage';
12
12
  import Consumption from '../../SearchPageMobile/FiltersDetailed/Consumption';
13
13
  import FirstRegistration from '../../SearchPageMobile/FiltersDetailed/FirstRegistration';
14
14
  import MakeModel, { IMakeModelProps } from '../../SearchPageMobile/FiltersDetailed/MakeModel';
15
- import MakeModelExclude, { IMakeModelExcludeProps } from '../../SearchPageMobile/FiltersDetailed/MakeModelExclude';
15
+ import { IMakeModelExcludeProps } from '../../SearchPageMobile/FiltersDetailed/MakeModelExclude';
16
16
  import { COST_TYPE_DEFAULT, COST_TYPE_OPTIONS, RANGE_FILTERS, RANGE_FILTERS_DEFAULT_CONTROLS } from '../../../framework/constants/Search';
17
17
  import { OBJECT_FILTERS, RATE_DEFAULT_CONTROLS } from '../../../framework/constants/SearchWidget';
18
18
 
@@ -32,7 +32,7 @@ class BasicDataWidgetMobile extends React.Component<IMakeModelProps & IMakeModel
32
32
  };
33
33
 
34
34
  shouldComponentUpdate(nextProps: any, nextState: any) {
35
- const { MMS_GROUPS, BODY_TYPE, FIRST_REGISTRATION, MILEAGE, POWER, RATE, PRICE, CONSUMPTION, SEATS, DOORS, FUEL, t, isNotDetailed } = this.props;
35
+ const { MMS_GROUPS, BODY_TYPE, FIRST_REGISTRATION, MILEAGE, POWER, RATE, PRICE, CONSUMPTION, SEATS, DOORS, FUEL, t } = this.props;
36
36
 
37
37
  const dataBlocks = {
38
38
  MMS_GROUPS, BODY_TYPE, FIRST_REGISTRATION, MILEAGE, POWER, RATE, PRICE, CONSUMPTION, SEATS, DOORS, FUEL
@@ -66,8 +66,8 @@ class BasicDataWidgetMobile extends React.Component<IMakeModelProps & IMakeModel
66
66
  render(): React.ReactNode {
67
67
  const {
68
68
  MMS_GROUPS, BODY_TYPE, FIRST_REGISTRATION, MILEAGE, POWER, RATE, PRICE, CONSUMPTION, SEATS, DOORS, FUEL,
69
- onFilterChange, onChangeFilterControls, onAddMmsGroup, onRemoveMmsGroup, onDropDownFocus,
70
- MM_GROUPS_EXCLUDE, onAddMmExcludeGroup, onRemoveMmExcludeGroup, t, showModal, hideModal, onAddMmsGroupClick, isNotDetailed
69
+ onFilterChange, onChangeFilterControls, onRemoveMmsGroup, onDropDownFocus,
70
+ t, showModal, hideModal, onAddMmsGroupClick, isNotDetailed
71
71
  } = this.props;
72
72
  const commonProps = { t, onChange: onFilterChange };
73
73
 
@@ -39,7 +39,7 @@ const EquipmentsWidget = (props: IEquipmentsWidget) => {
39
39
  CLIMATISATION, HEATER, MULTIMEDIA, SEATS_OPTIONS, WHEEL, LIGHTS, DOORS_OPTIONS, WINDOW_OPTIONS,
40
40
  MIRRORS_OPTIONS, LANDING_GEAR, EXTRAS_OPTIONS, DRIVER_SEATS, CO_DRIVER_SEATS, BACK_SEATS, HIGHLIGHTS,
41
41
  onFilterChange,
42
- onDropDownFocus,
42
+ // onDropDownFocus,
43
43
  onCategoryFocus,
44
44
  t } = props;
45
45
  const onCheckboxClick = (fieldName: string, categoryName: string, values: string[]): void => {
@@ -116,11 +116,11 @@ const EquipmentsWidget = (props: IEquipmentsWidget) => {
116
116
  return onFilterChange(categoryName, values);
117
117
  };
118
118
 
119
- const onDropdownFocus = (fieldName: string) => {
120
- if (onDropDownFocus) {
121
- onDropDownFocus(fieldName);
122
- }
123
- };
119
+ // const onDropdownFocus = (fieldName: string) => {
120
+ // if (onDropDownFocus) {
121
+ // onDropDownFocus(fieldName);
122
+ // }
123
+ // };
124
124
 
125
125
  const getOptions = (options: any, categoryName?: string) => {
126
126
  const { [categoryName]: { aggregation } } = props;
@@ -134,16 +134,16 @@ const EquipmentsWidget = (props: IEquipmentsWidget) => {
134
134
  });
135
135
  };
136
136
 
137
- const isDropDown = (name: string) => {
138
- switch (name) {
139
- case 'DRIVER_SEATS':
140
- case 'CO_DRIVER_SEATS':
141
- case 'BACK_SEATS':
142
- return true;
143
- default:
144
- return false;
145
- }
146
- };
137
+ // const isDropDown = (name: string) => {
138
+ // switch (name) {
139
+ // case 'DRIVER_SEATS':
140
+ // case 'CO_DRIVER_SEATS':
141
+ // case 'BACK_SEATS':
142
+ // return true;
143
+ // default:
144
+ // return false;
145
+ // }
146
+ // };
147
147
 
148
148
  const renderDropDown = (index: number, categoryName?: string, data?: any, isMobile?: boolean): React.ReactNode => {
149
149
  const { options, values } = data;
@@ -36,7 +36,7 @@ const HighlightsWidgetMobile = ({ onFilterChange, HIGHLIGHTS, t }: IHighlightsWi
36
36
  onFilterChange(HIGHLIGHTS_KEY, value);
37
37
  };
38
38
 
39
- const onHighlightsChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
39
+ const onHighlightsChange = (event: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string, value?: any): void => {
40
40
  const { values } = HIGHLIGHTS;
41
41
  event.stopPropagation();
42
42
  event.nativeEvent.stopImmediatePropagation();
@@ -1,4 +1,4 @@
1
- import React, { memo } from 'react';
1
+ import React from 'react';
2
2
  import InteriorColor from '../../SearchFilters/filters/InteriorColor';
3
3
  import InteriorMaterial from '../../SearchFilters/filters/InteriorMaterial';
4
4
 
@@ -22,7 +22,7 @@ export interface ISafetyWidget {
22
22
  const AIRBAG_KEY = 'AIRBAG';
23
23
 
24
24
  const SafetyWidget = (props: ISafetyWidget) => {
25
- const { ASSISTANTS, AIRBAG, PARKING_ASSISTANTS, THEFT_PROTECTION, HIGHLIGHTS, onFilterChange, onDropDownFocus, t } = props;
25
+ const { ASSISTANTS, AIRBAG, PARKING_ASSISTANTS, THEFT_PROTECTION, HIGHLIGHTS, onFilterChange, t } = props;
26
26
  const onCheckboxClick = (fieldName: string, categoryName: string, values: string[]) => {
27
27
  const index = values.indexOf(fieldName);
28
28
 
@@ -40,11 +40,11 @@ const SafetyWidget = (props: ISafetyWidget) => {
40
40
  return onFilterChange(AIRBAG_KEY, values);
41
41
  };
42
42
 
43
- const onDropdownFocus = () => {
44
- if (onDropDownFocus) {
45
- onDropDownFocus(AIRBAG_KEY);
46
- }
47
- };
43
+ // const onDropdownFocus = () => {
44
+ // if (onDropDownFocus) {
45
+ // onDropDownFocus(AIRBAG_KEY);
46
+ // }
47
+ // };
48
48
 
49
49
  const getOptions = (_: string, options: any) => {
50
50
  const { aggregation } = AIRBAG;
@@ -12,14 +12,15 @@ export interface IProps {
12
12
  children: React.ReactElement<IStepProps>[];
13
13
  onStepChange?: (nextStep: number) => void;
14
14
  className?: string;
15
+ completed?: boolean;
15
16
  }
16
17
 
17
18
  const defaultStepsDivider: React.ReactElement<IStepsDividerProps> = <StepsDivider/>;
18
19
 
19
20
  const Stepper: React.FunctionComponent<IProps> = ({ currentStep, nonLinear, stepsDivider = defaultStepsDivider, onStepChange, children, className }) => {
20
- const childrenArray: React.ReactElement<IStepProps>[] = React.Children.toArray<React.ReactElement<IStepProps>>(children);
21
- const steps = childrenArray.map((child, index) => {
22
- if (!React.isValidElement(child)) {
21
+ const childrenArray: any | { props: IStepProps }[] = React.Children.toArray(children);
22
+ const steps = childrenArray.map((child: { props: IStepProps }, index: number) => {
23
+ if (!React.isValidElement<IStepProps>(child)) {
23
24
  throw new Error('Stepper component has invalid child');
24
25
  }
25
26