@@ -133,82 +133,6 @@ export function TimeSeriesWidgetVisualization(props: TimeSeriesWidgetVisualizati
133
133
organization . features . includes ( 'release-bubbles-ui' ) &&
134
134
props . showReleaseAs === 'bubble' ;
135
135
136
- // find min/max timestamp of *all* timeSeries
137
- const allBoundaries = props . plottables
138
- . flatMap ( plottable => [ plottable . start , plottable . end ] )
139
- . toSorted ( ) ;
140
- const earliestTimeStamp = allBoundaries . at ( 0 ) ;
141
- const latestTimeStamp = allBoundaries . at ( - 1 ) ;
142
-
143
- const {
144
- connectReleaseBubbleChartRef,
145
- releaseBubbleSeries,
146
- releaseBubbleXAxis,
147
- releaseBubbleGrid,
148
- } = useReleaseBubbles ( {
149
- chartId : props . id ,
150
- minTime : earliestTimeStamp ? new Date ( earliestTimeStamp ) . getTime ( ) : undefined ,
151
- maxTime : latestTimeStamp ? new Date ( latestTimeStamp ) . getTime ( ) : undefined ,
152
- releases : hasReleaseBubbles
153
- ? props . releases ?. map ( ( { timestamp, version} ) => ( { date : timestamp , version} ) )
154
- : [ ] ,
155
- } ) ;
156
-
157
- const releaseSeries = props . releases
158
- ? hasReleaseBubbles
159
- ? releaseBubbleSeries
160
- : ReleaseSeries (
161
- theme ,
162
- props . releases ,
163
- function onReleaseClick ( release : Release ) {
164
- if ( organization . features . includes ( 'release-bubbles-ui' ) ) {
165
- navigate (
166
- makeReleaseDrawerPathname ( {
167
- location,
168
- release : release . version ,
169
- source : 'time-series-widget' ,
170
- } )
171
- ) ;
172
- return ;
173
- }
174
- navigate (
175
- makeReleasesPathname ( {
176
- organization,
177
- path : `/${ encodeURIComponent ( release . version ) } /` ,
178
- } )
179
- ) ;
180
- } ,
181
- utc ?? false
182
- )
183
- : null ;
184
-
185
- const hasReleaseBubblesSeries = hasReleaseBubbles && releaseSeries ;
186
-
187
- const handleChartRef = useCallback (
188
- ( e : ReactEchartsRef | null ) => {
189
- if ( ! e ?. getEchartsInstance ) {
190
- return ;
191
- }
192
-
193
- for ( const plottable of props . plottables ) {
194
- plottable . handleChartRef ?.( e ) ;
195
- }
196
-
197
- const echartsInstance = e . getEchartsInstance ( ) ;
198
- registerWithWidgetSyncContext ( echartsInstance ) ;
199
-
200
- if ( hasReleaseBubblesSeries ) {
201
- connectReleaseBubbleChartRef ( e ) ;
202
- }
203
- } ,
204
- [
205
- hasReleaseBubblesSeries ,
206
- connectReleaseBubbleChartRef ,
207
- registerWithWidgetSyncContext ,
208
- props . plottables ,
209
- ]
210
- ) ;
211
-
212
136
const { onDataZoom, ...chartZoomProps } = useChartZoom ( {
213
137
saveOnZoom : true ,
214
138
} ) ;
@@ -431,6 +355,88 @@ export function TimeSeriesWidgetVisualization(props: TimeSeriesWidgetVisualizati
431
355
432
356
const yAxes : YAXisComponentOption [ ] = [ leftYAxis , rightYAxis ] . filter ( axis => ! ! axis ) ;
433
357
358
+ // find min/max timestamp of *all* timeSeries
359
+ const allBoundaries = props . plottables
360
+ . flatMap ( plottable => [ plottable . start , plottable . end ] )
361
+ . toSorted ( ) ;
362
+ const earliestTimeStamp = allBoundaries . at ( 0 ) ;
363
+ const latestTimeStamp = allBoundaries . at ( - 1 ) ;
364
+
365
+ const {
366
+ connectReleaseBubbleChartRef,
367
+ releaseBubbleSeries,
368
+ releaseBubbleXAxis,
369
+ releaseBubbleGrid,
370
+ releaseBubbleYAxis,
371
+ } = useReleaseBubbles ( {
372
+ chartId : props . id ,
373
+ minTime : earliestTimeStamp ? new Date ( earliestTimeStamp ) . getTime ( ) : undefined ,
374
+ maxTime : latestTimeStamp ? new Date ( latestTimeStamp ) . getTime ( ) : undefined ,
375
+ releases : hasReleaseBubbles
376
+ ? props . releases ?. map ( ( { timestamp, version} ) => ( { date : timestamp , version} ) )
377
+ : [ ] ,
378
+ yAxisIndex : yAxes . length ,
379
+ } ) ;
380
+
381
+ if ( releaseBubbleYAxis ) {
382
+ yAxes . push ( releaseBubbleYAxis ) ;
383
+ }
384
+
385
+ const releaseSeries = props . releases
386
+ ? hasReleaseBubbles
387
+ ? releaseBubbleSeries
388
+ : ReleaseSeries (
389
+ theme ,
390
+ props . releases ,
391
+ function onReleaseClick ( release : Release ) {
392
+ if ( organization . features . includes ( 'release-bubbles-ui' ) ) {
393
+ navigate (
394
+ makeReleaseDrawerPathname ( {
395
+ location,
396
+ release : release . version ,
397
+ source : 'time-series-widget' ,
398
+ } )
399
+ ) ;
400
+ return ;
401
+ }
402
+ navigate (
403
+ makeReleasesPathname ( {
404
+ organization,
405
+ path : `/${ encodeURIComponent ( release . version ) } /` ,
406
+ } )
407
+ ) ;
408
+ } ,
409
+ utc ?? false
410
+ )
411
+ : null ;
412
+
413
+ const hasReleaseBubblesSeries = hasReleaseBubbles && releaseSeries ;
414
+
415
+ const handleChartRef = useCallback (
416
+ ( e : ReactEchartsRef | null ) => {
417
+ if ( ! e ?. getEchartsInstance ) {
418
+ return ;
419
+ }
420
+
421
+ for ( const plottable of props . plottables ) {
422
+ plottable . handleChartRef ?.( e ) ;
423
+ }
424
+
425
+ const echartsInstance = e . getEchartsInstance ( ) ;
426
+ registerWithWidgetSyncContext ( echartsInstance ) ;
427
+
428
+ if ( hasReleaseBubblesSeries ) {
429
+ connectReleaseBubbleChartRef ( e ) ;
430
+ }
431
+ } ,
432
+ [
433
+ hasReleaseBubblesSeries ,
434
+ connectReleaseBubbleChartRef ,
435
+ registerWithWidgetSyncContext ,
436
+ props . plottables ,
437
+ ]
438
+ ) ;
439
+
434
440
const showXAxisProp = props . showXAxis ?? 'auto' ;
435
441
const showXAxis = showXAxisProp === 'auto' ;
436
442
0 commit comments