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

(fix) O3-4081: Help button has no icon when hovering over it #1182

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

virajwathsalag
Copy link
Contributor

Requirements

  • This PR has a title that briefly describes the work done including the ticket number. Ensure your PR title includes a conventional commit label (such as feat, fix, or chore, among others). See existing PR titles for inspiration.

For changes to apps

If applicable

  • My work includes tests or is validated by existing tests.
  • I have updated the esm-framework mock to reflect any API changes I have made.

Summary

The help button doesn't have any label when hovered above it like other components
So, I added a label to it when hovered above the help icon the "help" label is displayed and also when clicked on the help button the help label hides.

Screenshots

2024-10-20.08-10-19.mp4

Related Issue

https://openmrs.atlassian.net/browse/O3-4081

Other

@virajwathsalag
Copy link
Contributor Author

@denniskigen can you checkout this PR ?

@@ -43,6 +43,7 @@ export default function HelpMenu() {
className={classNames(styles.helpMenuButton)}
>
<Help size={24} />
{!helpMenuOpen && <span className={styles.helpLabel}>Help</span>} {/* Label is hidden when menu is open */}
Copy link
Collaborator

Choose a reason for hiding this comment

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

Hi @virajwathsalag , sorry this took so long to get a review. I don't know why whoever wrote this initially chose to implement it as a <button> wrapping an icon component; this seems like a natural fit for the IconButton component, which handles the label tooltip. Could you please rework this code to use the IconButton?

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.

2 participants