@@ -38,20 +38,20 @@ export const SpeedMultiMeter = ({
38
38
{ value : formatValue ( perDay ) , label : i18n ( 'perDay' ) } ,
39
39
] ;
40
40
41
- const [ valueToDisplay , setValueToDisplay ] = React . useState ( perMinute ) ;
41
+ const [ valueToDisplayIndex , setValueToDisplayIndex ] = React . useState ( 0 ) ;
42
42
const [ highlightedValueIndex , setHighlightedValueIndex ] = React . useState (
43
43
withValue ? 0 : undefined ,
44
44
) ;
45
45
const [ highlightedContainerIndex , setHighlightedContainerIndex ] = React . useState < number > ( ) ;
46
46
47
- const onEnterDiagram = ( values : number [ ] , index : number ) => {
48
- setValueToDisplay ( values [ index ] ) ;
47
+ const onEnterDiagram = ( index : number ) => {
48
+ setValueToDisplayIndex ( index ) ;
49
49
setHighlightedValueIndex ( index ) ;
50
50
setHighlightedContainerIndex ( index ) ;
51
51
} ;
52
52
53
53
const onLeaveDiagram = ( ) => {
54
- setValueToDisplay ( perMinute ) ;
54
+ setValueToDisplayIndex ( 0 ) ;
55
55
setHighlightedValueIndex ( withValue ? 0 : undefined ) ;
56
56
setHighlightedContainerIndex ( undefined ) ;
57
57
} ;
@@ -70,7 +70,7 @@ export const SpeedMultiMeter = ({
70
70
className = { b ( 'bar-container' , {
71
71
highlighted : isContainerHighlighted ( index ) ,
72
72
} ) }
73
- onMouseEnter = { onEnterDiagram . bind ( null , rawValues , index ) }
73
+ onMouseEnter = { ( ) => onEnterDiagram ( index ) }
74
74
>
75
75
< div
76
76
className = { b ( 'bar' , {
@@ -102,7 +102,9 @@ export const SpeedMultiMeter = ({
102
102
< div className = { b ( ) } >
103
103
< div className = { b ( 'content' ) } >
104
104
{ withValue && (
105
- < div className = { b ( 'displayed-value' ) } > { formatValue ( valueToDisplay ) } </ div >
105
+ < div className = { b ( 'displayed-value' ) } >
106
+ { formatValue ( rawValues [ valueToDisplayIndex ] ) }
107
+ </ div >
106
108
) }
107
109
< Popover
108
110
content = { renderPopoverContent ( ) }
0 commit comments