feat(events-graph): Update Event stats graph on issue stream
This PR updates the event stats graph on the issue stream to a newer design, and it changes the issue sub-status (ongoing, escalating, etc.) from a color-themed pill on the left side of the row, to a single-color label under the new events graph.
This change is released under a feature flag, which is currently set to 100% LA to Sentry orgs only.
New UI at a glance: (Preview will be better for this tho, please use that)
Full list of changes:
- The issue sub-status is now one color and is a label under the graph
- The markline showing the peak events in a given period has higher opacity and is moved to the right side of the graph
- The bars of the graph now animate and rise from the x-axis upon first render (this feature may need to be turned off if we observe any performance issues)
- A placeholder has been added for the loading state of the graph (previously there was no loading state at all)
- The
<Placeholder/>component has been given a slightly rounded edge
Bundle Report
Changes will increase total bundle size by 1.46kB :arrow_up:
| Bundle name | Size | Change |
|---|---|---|
| app-webpack-bundle-array-push | 27.67MB | 1.46kB :arrow_up: |
Codecov Report
Attention: Patch coverage is 77.77778% with 2 lines in your changes are missing coverage. Please review.
Please upload report for BASE (
master@acf464d). Learn more about missing BASE report.
:exclamation: Current head 9c7bbbe differs from pull request most recent head d4ea763
Please upload reports for the commit d4ea763 to get more accurate results.
Additional details and impacted files
@@ Coverage Diff @@
## master #71130 +/- ##
=========================================
Coverage ? 77.87%
=========================================
Files ? 6526
Lines ? 290413
Branches ? 50243
=========================================
Hits ? 226161
Misses ? 58032
Partials ? 6220
| Files | Coverage Δ | |
|---|---|---|
| static/app/components/charts/barChart.tsx | 93.33% <100.00%> (ø) |
|
| static/app/components/charts/miniBarChart.tsx | 80.95% <100.00%> (ø) |
|
| static/app/components/eventOrGroupExtraDetails.tsx | 94.44% <ø> (ø) |
|
| ...c/app/components/group/inboxBadges/statusBadge.tsx | 94.73% <100.00%> (ø) |
|
| static/app/components/charts/groupStatusChart.tsx | 15.78% <0.00%> (ø) |
|
| static/app/components/stream/group.tsx | 55.63% <50.00%> (ø) |