refactor: implement new design for Toolbar [DHIS2-20932]#151
Open
refactor: implement new design for Toolbar [DHIS2-20932]#151
Conversation
|
🚀 Deployed on https://pr-151.event-visualizer.netlify.dhis2.org |
This allows for flexibility with the FileMenu and also reuse of the New/Open/Save buttons. The OpenFileDialog is rendered as part of the actions-bar so it keeps its state and both the Open buttons (in the toolbar and in the FileMenu) open it.
3 tasks
This fixes issues with labels and buttons being hidden when resizing the screen. The HoverMenuListItem only needs a label, icon and onClick callback. We already have these callbacks in the custom hook and are used also in the custom buttons.
HendrikThePendric
previously approved these changes
Feb 19, 2026
Collaborator
HendrikThePendric
left a comment
There was a problem hiding this comment.
Left a few non-critical comments
HendrikThePendric
previously approved these changes
Feb 20, 2026
This component is going to be removed anyway when the vis type selector is rewritten using the chevron icon from ui.
HendrikThePendric
previously approved these changes
Feb 20, 2026
|
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
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.



Implements DHIS2-20932
Description
Implement the new design for the
Toolbarcomponent.Everything in the spec should be addressed in this PR, except for the styles (see TODO below).
Quality checklist
Add N/A to items that are not applicable and check them.
ToDos
AnalyticsToolbarif that's in the way.Screenshots
Full width: toolbar with action buttons, menus, and togglers:

Smaller width: toolbar action buttons loose the label:

Even smaller width: toolbar action buttons are hidden, title gets ellipsis:
