Conditionally render divider between button groups in the status bar #24114
Conversation
This file contains 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
In the left hand status bar, there are two groups of buttons. There was a border between the two hardcoded on the first button of the second group, however, if all buttons in the first group are hidden, the border doesn't need to be rendered. I think a better approach would be to change StatusBar's definition from `left_items` and `right_items` to `left_groups` and `right_groups`, and render dividers between each group of items. That seemed like a bigger refactor than I wanted to handle for now, but is an option for the future.
cla-bot
bot
added
the
cla-signed
ksweetie
commented
Feb 3, 2025
Comment on lines
-89
to
-91
| .pl_1() | ||
| .border_l_1() | ||
| .border_color(cx.theme().colors().border) |
There was a problem hiding this comment.
This border looks slightly darker or thicker than the default Divider. We could either:
- Use this 1px border instead of Divider.
- Modify Divider to have a darker/thicker border.
I'm assuming that the default divider is good for this use case, but happy to iterate.
ksweetie
commented
Feb 3, 2025
| .children(buttons) | ||
| .when(has_buttons, |this| { | ||
| this.h_flex().gap_1().child(Divider::vertical()) | ||
| }) |
There was a problem hiding this comment.
My Rust is very bad, so there's likely a better way to handle this diff. I wanted to inline !buttons.is_empty(), but ran into an error about moving buttons that I couldn't figure out. If anything here could be more idiomatic, please let me know!
danilo-leal
approved these changes
Feb 3, 2025
ksweetie
deleted the
hide-diagnostic-item-border-when-no-buttons-to-the-left
branch
danilo-leal
added a commit
that referenced
this pull request
Feb 4, 2025
Follow up to #24114 Just fixing the UI so that the divider only shows for the left-positioned items. Release Notes: - N/A
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
In the left hand status bar, there are two groups of buttons. There was a border between the two hardcoded on the first button of the second group, however, if all buttons in the first group are hidden, the border doesn't need to be rendered.
(Not handled in this PR) A potentially better approach would be to change StatusBar's definition from
left_itemsandright_itemstoleft_groupsandright_groups, and render dividers between each group of items. That seemed like a bigger refactor than I wanted to handle for now, but is an option for the future.If you use these settings on
main, the border will show, but with nothing to the left of it.{ "collaboration_panel": { "button": false }, "outline_panel": { "button": false }, "project_panel": { "button": false, }, }Screenshots:
Before:
After:
Release Notes: