feat(ui): Make release bubble padding configurable #86841
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
github-actions
bot
added
the
Scope: Frontend
billyvg
force-pushed
the
ref-ui-configurable-release-bubble-padding
branch
from
bfb5f1d to
0241175
Compare
billyvg
changed the title
<BarChart>
billyvg
commented
Mar 11, 2025
Comment on lines
226
to
234
| // bubbleStartX bubbleEndX | ||
| // | | | ||
| // v v | ||
| // ---------------- ---------------- | ||
| // | | | | | ||
| // ---------------- ---------------- | ||
| // ^ ^ | ||
| // |--| | ||
| // bubblePadding.x |
There was a problem hiding this comment.
note my artisanal ascii art
| @@ -1,10 +1,8 @@ | |||
| export const BUBBLE_SERIES_ID = '__release_bubble__'; | |||
| export const BUBBLE_AREA_SERIES_ID = '__release_bubble_area__'; | |||
| export const DEFAULT_BUBBLE_SIZE = 12; | |||
| export const DEFAULT_BUBBLE_SIZE = 4; | |||
There was a problem hiding this comment.
Previously, the bubble size was the entire height including whitespace around it. This was because I started w/ the chart configuration and calculated everything else based on that.
I inverted this so that we define the actual bubble pixel height and calculate the chart offsets based on that + padding.
|
|
||
| // "padding" around the bubbles as it is drawn on canvas vs CSS, this may need | ||
| // to move into `renderReleaseBubble` if it needs to be customizable | ||
| export const RELEASE_BUBBLE_Y_PADDING = 8; | ||
| export const RELEASE_BUBBLE_Y_HALF_PADDING = RELEASE_BUBBLE_Y_PADDING / 2; |
There was a problem hiding this comment.
calculate this since padding is now configurable.
billyvg
commented
Mar 12, 2025
static/app/views/dashboards/widgets/timeSeriesWidget/releaseBubbles/constants.tsx
Outdated
Show resolved
Hide resolved
billyvg
commented
Mar 12, 2025
Comment on lines
-3
to
-10
| export const DEFAULT_BUBBLE_SIZE = 12; | ||
|
|
||
| // "padding" around the bubbles as it is drawn on canvas vs CSS, this may need | ||
| // to move into `renderReleaseBubble` if it needs to be customizable | ||
| export const RELEASE_BUBBLE_Y_PADDING = 8; | ||
| export const RELEASE_BUBBLE_Y_HALF_PADDING = RELEASE_BUBBLE_Y_PADDING / 2; | ||
| export const RELEASE_BUBBLE_X_PADDING = 1; | ||
| export const RELEASE_BUBBLE_X_HALF_PADDING = RELEASE_BUBBLE_X_PADDING / 2; |
There was a problem hiding this comment.
moved these as default args in the hook
We will need to configure different bubble styles when on different charts. This PR makes the padding configurable if needed. It also removes left padding from first bubble and right padding from last padding.
billyvg
force-pushed
the
ref-ui-configurable-release-bubble-padding
branch
from
17a62ad to
b1f9a1e
Compare
This was referenced Mar 12, 2025
billyvg
added a commit
that referenced
this pull request
Mar 27, 2025
Adds new release bubbles to the issue details graph  ref #86946 depends on - #86841 - #86840 --------- Co-authored-by: getsantry[bot] <66042841+getsantry[bot]@users.noreply.github.com>
andrewshie-sentry
pushed a commit
that referenced
this pull request
Mar 27, 2025
Adds new release bubbles to the issue details graph  ref #86946 depends on - #86841 - #86840 --------- Co-authored-by: getsantry[bot] <66042841+getsantry[bot]@users.noreply.github.com>
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
We may need to configure different bubble styles when on different charts. This PR makes the padding configurable if needed. It also removes left padding from first bubble and right padding from last padding and fixes the vertical alignment of the bubble as well.
ref #85775