Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: toolbar UI update with hoverable menu #1478

Merged
merged 25 commits into from
Jun 19, 2023

Conversation

HendrikThePendric
Copy link
Contributor

@HendrikThePendric HendrikThePendric commented May 30, 2023

Implements DHIS2-15167

Relates to dhis2/line-listing-app#368 & dhis2/data-visualizer-app#2358


Key features

  1. Adds Toolbar and ToolbarSidebar components to build the toolbar layout
  2. Adds HoverMenubar and related components to build hoverable menu within the toolbar
  3. Adds UpdateButton and InterpretationsAndDetailsToggler to be placed in the toolbar
  4. Updates FileMenu to be a hoverable dropdown menu, leveraging the new hover-menu-bar components.
  5. Adds initiallyActiveTabKey to VisualizationOptions component so it can be opened at a specified tab.

BREAKING CHANGE

The updated FileMenu is not compatible with the previous version. Apps will be required to update their toolbar before using this version of analytics.


TODO

  • Add tests
  • Add demo

Screenshots

Screenshot 2023-06-12 at 18 20 44

Not the most glamorous screenshot, but it works.

@HendrikThePendric HendrikThePendric changed the title DHIS2-15167-toolbar-update feat: toolbar UI update with hoverable menu Jun 12, 2023
@HendrikThePendric HendrikThePendric marked this pull request as ready for review June 12, 2023 16:29
Copy link
Contributor Author

Choose a reason for hiding this comment

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

The diff for this file looks more impressive than the changes I actually made. The component now make use of the new hover menu functionality, so it doesn't need to have an internal open-state, render a layer etc. Due to the removal of the Layer/Popper/etc the JSX nesting changed significantly and this is causing the diff to look big.

Copy link
Contributor Author

@HendrikThePendric HendrikThePendric Jun 12, 2023

Choose a reason for hiding this comment

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

I've switched to using @testing-library/react because I was running into issues when opening poppers with enzyme. I also prefer this lib to Enzyme in general, but that's not why I started using it here.

src/__demo__/Toolbar.stories.js Outdated Show resolved Hide resolved
@HendrikThePendric HendrikThePendric merged commit 5526163 into master Jun 19, 2023
@HendrikThePendric HendrikThePendric deleted the DHIS2-15167-toolbar-update branch June 19, 2023 13:32
dhis2-bot added a commit that referenced this pull request Jun 19, 2023
# [25.2.0](v25.1.22...v25.2.0) (2023-06-19)

### Features

* toolbar UI update with hoverable menu ([#1478](#1478)) ([5526163](5526163))
HendrikThePendric added a commit that referenced this pull request Jun 20, 2023
HendrikThePendric added a commit that referenced this pull request Jun 20, 2023
dhis2-bot added a commit that referenced this pull request Jun 20, 2023
## [25.2.2](v25.2.1...v25.2.2) (2023-06-20)

### Reverts

* Revert "feat: toolbar UI update with hoverable menu (#1478)" ([c55346c](c55346c)), closes [#1478](#1478)
HendrikThePendric added a commit that referenced this pull request Jun 20, 2023
BREAKING CHANGE
The `FileMenu` is now using the new `HoverMenuBar` components which makes this version of the `FileMenu` incompatible with the previous version. Apps will be need to update their toolbar and file menu before using this version of analytics.
HendrikThePendric added a commit that referenced this pull request Jun 20, 2023
BREAKING CHANGE
The `FileMenu` is now using the new `HoverMenuBar` components which makes this version of the `FileMenu` incompatible with the previous version. Apps will be need to update their toolbar and file menu before using this version of analytics.
HendrikThePendric added a commit that referenced this pull request Jun 20, 2023
BREAKING CHANGE
The `FileMenu` is now using the new `HoverMenuBar` components which makes this version of the `FileMenu` incompatible with the previous version. Apps will be need to update their toolbar and file menu before using this version of analytics.
HendrikThePendric added a commit that referenced this pull request Jun 20, 2023
BREAKING CHANGE: The `FileMenu` is now using the new `HoverMenuBar` components which makes this version of the `FileMenu` incompatible with the previous version. Apps will be need to update their toolbar and file menu before using this version of analytics.
dhis2-bot added a commit that referenced this pull request Jun 20, 2023
# [26.0.0](v25.2.3...v26.0.0) (2023-06-20)

### Features

* toolbar UI update with hoverable menu ([#1478](#1478)) ([#1509](#1509)) ([0a51153](0a51153))

### BREAKING CHANGES

* The `FileMenu` is now using the new `HoverMenuBar` components which makes this version of the `FileMenu` incompatible with the previous version. Apps will be need to update their toolbar and file menu before using this version of analytics.
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.

3 participants