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.

Sign up for GitHub

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

Jump to bottom

Frontend: Allows PanelChrome to be collapsed #71991

Merged
merged 12 commits into from
Jul 27, 2023
Merged

Frontend: Allows PanelChrome to be collapsed #71991

merged 12 commits into from
Jul 27, 2023

Conversation

harisrozajac
Copy link
Contributor

@harisrozajac harisrozajac commented Jul 19, 2023 •
edited

This feature allows PanelChrome to be collapsed.

With this feature, PanelChrome has three mutually exclusive modes:

  • Normal - default mode when Hover and Collapsible are not enabled
  • Hover
  • Collapsible

The panel can be collapsed/expanded by clicking on the chevron or the title.

Fixes: #70145

Please check that:

  • It works as expected from a user's perspective.
  • Check the example in storybook
  • The docs are updated

@harisrozajac harisrozajac added this to the 10.1.x milestone Jul 19, 2023
@harisrozajac harisrozajac changed the title Haris/panel chrome/allow panel to be collapsed 70145 Frontend: Allows PanelChrome to be collapsed Jul 19, 2023
@harisrozajac harisrozajac marked this pull request as ready for review July 20, 2023 14:01
@harisrozajac harisrozajac requested a review from a team as a code owner July 20, 2023 14:01
@harisrozajac harisrozajac requested review from ashharrison90 and JoaoSilvaGrafana and removed request for a team July 20, 2023 14:01
@harisrozajac harisrozajac requested a review from a team July 20, 2023 15:21
@torkelo torkelo requested review from axelavargas, dprokop and polibb and removed request for ashharrison90 and JoaoSilvaGrafana July 24, 2023 07:56
@github-actions github-actions bot added the pr/external This PR is from external contributor label Jul 25, 2023
axelavargas
axelavargas approved these changes Jul 27, 2023
View reviewed changes
Copy link
Member

@axelavargas axelavargas left a comment

Choose a reason for hiding this comment

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

Hey @harisrozajac 👋🏾,

Good job on this PR! I like the implementation 🙌🏾 . I see Gio's point on having a mode, but you're right about keeping it simple because of backward compatibility and the issues that come with deprecating props in Grafana UI components.

Just one more thing - could you update the PanelChrome.mdx documentation? It would be good to have an example and a note about hoverHeader and collapsible not working together.

Apart from that, everything is working great 🥳 Well done!

@harisrozajac harisrozajac requested a review from a team as a code owner July 27, 2023 16:06
@harisrozajac harisrozajac requested review from jackw and removed request for a team July 27, 2023 16:06
@harisrozajac
Copy link
Contributor Author

Just one more thing - could you update the PanelChrome.mdx documentation? It would be good to have an example and a note about hoverHeader and collapsible not working together.

@axelavargas Thank you so much for your feedback! I've updated the documentation, so we should be good to go. 🎆

@harisrozajac harisrozajac removed the pr/external This PR is from external contributor label Jul 27, 2023
@gelicia gelicia requested a review from Elfo404 July 27, 2023 17:01
@gelicia gelicia dismissed Elfo404’s stale review July 27, 2023 17:02

Requested changes were addressed

gelicia
gelicia approved these changes Jul 27, 2023
View reviewed changes
Copy link
Contributor

@gelicia gelicia left a comment

Choose a reason for hiding this comment

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

LGTM!

@harisrozajac harisrozajac merged commit 8dd6609 into main Jul 27, 2023
16 checks passed
@harisrozajac harisrozajac deleted the haris/panel-chrome/allow-panel-to-be-collapsed-70145 branch July 27, 2023 19:53
@grafana-delivery-bot grafana-delivery-bot bot modified the milestones: 10.1.x, 10.2.x Jul 27, 2023
sarahzinger pushed a commit that referenced this pull request Aug 1, 2023
@harisrozajac @sarahzinger
Frontend: Allows PanelChrome to be collapsed (#71991)
824447e 
* Collapsible PanelChrome v1

* Enable either Collapsible or HoverHeader modes

* Clean up

* Update story

* Add test

* Revert to 'strict'

* Use useToggle

* Allow collapsibility when title is not passed

* Fix semantics and ellipsis wrapping

* Improve accessibility

* Add documentation
chauchausoup pushed a commit to chauchausoup/grafana that referenced this pull request Sep 15, 2023
@harisrozajac @chauchausoup
Frontend: Allows PanelChrome to be collapsed (grafana#71991)
1bdca10 
* Collapsible PanelChrome v1

* Enable either Collapsible or HoverHeader modes

* Clean up

* Update story

* Add test

* Revert to 'strict'

* Use useToggle

* Allow collapsibility when title is not passed

* Fix semantics and ellipsis wrapping

* Improve accessibility

* Add documentation
@zerok zerok modified the milestones: 10.2.x, 10.2.0 Oct 23, 2023
@dnhn dnhn mentioned this pull request Oct 24, 2023
Closed
@BrewTestBot BrewTestBot mentioned this pull request Oct 25, 2023
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@axelavargas axelavargas axelavargas approved these changes

@gelicia gelicia gelicia approved these changes

@dprokop dprokop Awaiting requested review from dprokop

@polibb polibb Awaiting requested review from polibb

@jackw jackw Awaiting requested review from jackw jackw is a code owner automatically assigned from grafana/plugins-platform-frontend

@Elfo404 Elfo404 Awaiting requested review from Elfo404

Assignees
No one assigned
Labels
add to changelog area/frontend no-backport Skip backport of PR
Projects
Dashboards
Archived in project
Milestone
10.2.0
Development

Successfully merging this pull request may close these issues.

PanelChrome: Allow panel to be collapsed
5 participants
@harisrozajac @axelavargas @Elfo404 @gelicia @zerok