Skip to content

Comments

refactor: implement new design for Toolbar [DHIS2-20932]#151

Open
edoardo wants to merge 40 commits intomasterfrom
refactor/toolbar-design
Open

refactor: implement new design for Toolbar [DHIS2-20932]#151
edoardo wants to merge 40 commits intomasterfrom
refactor/toolbar-design

Conversation

@edoardo
Copy link
Member

@edoardo edoardo commented Feb 13, 2026

Implements DHIS2-20932

Description

Implement the new design for the Toolbar component.

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

  • @cooper-joe review the styles, some things are off, we could get rid of the AnalyticsToolbar if that's in the way.

Screenshots

Full width: toolbar with action buttons, menus, and togglers:
Screenshot 2026-02-18 at 15 36 18

Smaller width: toolbar action buttons loose the label:
Screenshot 2026-02-18 at 15 36 29

Even smaller width: toolbar action buttons are hidden, title gets ellipsis:
Screenshot 2026-02-18 at 15 36 52

@dhis2-bot
Copy link

dhis2-bot commented Feb 13, 2026

🚀 Deployed on https://pr-151.event-visualizer.netlify.dhis2.org

@dhis2-bot dhis2-bot temporarily deployed to netlify February 13, 2026 15:00 Inactive
@dhis2-bot dhis2-bot temporarily deployed to netlify February 16, 2026 09:57 Inactive
@dhis2-bot dhis2-bot temporarily deployed to netlify February 16, 2026 10:03 Inactive
@dhis2-bot dhis2-bot temporarily deployed to netlify February 16, 2026 11:07 Inactive
@dhis2-bot dhis2-bot temporarily deployed to netlify February 16, 2026 14:08 Inactive
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.
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.
@dhis2-bot dhis2-bot temporarily deployed to netlify February 18, 2026 10:31 Inactive
@dhis2-bot dhis2-bot temporarily deployed to netlify February 19, 2026 14:05 Inactive
@dhis2-bot dhis2-bot temporarily deployed to netlify February 19, 2026 14:17 Inactive
@dhis2-bot dhis2-bot temporarily deployed to netlify February 19, 2026 14:22 Inactive
@dhis2-bot dhis2-bot temporarily deployed to netlify February 19, 2026 14:45 Inactive
Copy link
Collaborator

@HendrikThePendric HendrikThePendric left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Left a few non-critical comments

@dhis2-bot dhis2-bot temporarily deployed to netlify February 20, 2026 10:15 Inactive
@HendrikThePendric HendrikThePendric self-requested a review February 20, 2026 13:30
This component is going to be removed anyway when the vis type selector
is rewritten using the chevron icon from ui.
@dhis2-bot dhis2-bot temporarily deployed to netlify February 20, 2026 14:20 Inactive
@edoardo edoardo marked this pull request as ready for review February 20, 2026 14:21
@HendrikThePendric HendrikThePendric self-requested a review February 20, 2026 14:47
@sonarqubecloud
Copy link

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants