@@ -35,7 +35,7 @@ function InteractionListItem({data: itemData, index, style}: Props) {
35
35
selectTab,
36
36
} = itemData ;
37
37
38
- const { commitData} = dataForRoot ;
38
+ const { commitData, interactionCommits } = dataForRoot ;
39
39
const { interactions, lastInteractionTime, maxCommitDuration} = chartData ;
40
40
41
41
const interaction = interactions [ index ] ;
@@ -47,6 +47,10 @@ function InteractionListItem({data: itemData, index, style}: Props) {
47
47
selectInteraction ( interaction . id ) ;
48
48
} , [ interaction , selectInteraction ] ) ;
49
49
50
+ const commits = ( interactionCommits . get ( interaction . id ) || [ ] ) . filter (
51
+ commitIndex => commitData [ commitIndex ] ,
52
+ ) ;
53
+
50
54
const startTime = interaction . timestamp ;
51
55
const stopTime = lastInteractionTime ;
52
56
@@ -77,17 +81,22 @@ function InteractionListItem({data: itemData, index, style}: Props) {
77
81
width : scaleX ( stopTime - startTime , 0 ) ,
78
82
} }
79
83
/>
80
- { commitData . map ( ( commit , commitIndex ) => (
84
+ { commits . map ( commitIndex => (
81
85
< div
82
86
className = { styles . CommitBox }
83
87
key = { commitIndex }
84
88
onClick = { ( ) => viewCommit ( commitIndex ) }
85
89
style = { {
86
90
backgroundColor : getGradientColor (
87
- Math . min ( 1 , Math . max ( 0 , commit . duration / maxCommitDuration ) ) ||
88
- 0 ,
91
+ Math . min (
92
+ 1 ,
93
+ Math . max (
94
+ 0 ,
95
+ commitData [ commitIndex ] . duration / maxCommitDuration ,
96
+ ) ,
97
+ ) || 0 ,
89
98
) ,
90
- left : labelWidth + scaleX ( commit . timestamp , 0 ) ,
99
+ left : labelWidth + scaleX ( commitData [ commitIndex ] . timestamp , 0 ) ,
91
100
} }
92
101
/>
93
102
) ) }
0 commit comments