-
Notifications
You must be signed in to change notification settings - Fork 885
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] Inactive State on 'Discover' Tab in Side Navigation Menu #5432
[Fix] Inactive State on 'Discover' Tab in Side Navigation Menu #5432
Conversation
Signed-off-by: Willie Hung <willie880201044@gmail.com>
Signed-off-by: Willie Hung <willie880201044@gmail.com>
Codecov ReportAttention:
Additional details and impacted files@@ Coverage Diff @@
## main #5432 +/- ##
==========================================
- Coverage 66.97% 66.97% -0.01%
==========================================
Files 3293 3293
Lines 63289 63292 +3
Branches 10065 10066 +1
==========================================
Hits 42390 42390
- Misses 18458 18459 +1
- Partials 2441 2443 +2
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Sentry. |
Signed-off-by: Willie Hung <willie880201044@gmail.com>
Signed-off-by: Willie Hung <willie880201044@gmail.com>
Signed-off-by: Josh Romero <rmerqg@amazon.com>
Signed-off-by: Willie Hung <willie880201044@gmail.com>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@Willie-The-Lord I think this PR is great, but I have a couple ideas for how we might make it a little better oriented with future improvements.
@@ -39,6 +39,15 @@ import { relativeToAbsolute } from '../../nav_links/to_nav_link'; | |||
export const isModifiedOrPrevented = (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => | |||
event.metaKey || event.altKey || event.ctrlKey || event.shiftKey || event.defaultPrevented; | |||
|
|||
// Future: should make this function more generic |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
For comments that indicate future work, we generally use the TODO:
prefix, which is actually parsed and identified by several tools. Also, in the case of any TODO, there should be an open issue, and the link should be included in the comment itself. This makes it much easier to know if a given todo has actually been completed or if the comment is still valid.
// Future: should make this function more generic | |
// TODO: make this function more generic |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@joshuarrrr should I create an issue for the future improvement?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@Willie-The-Lord Yes, please, that would be appreciated! 😄
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@joshuarrrr issue created.
Co-authored-by: Josh Romero <rmerqg@amazon.com> Signed-off-by: Willie Hung <willie880201044@gmail.com>
Signed-off-by: Willie Hung <willie880201044@gmail.com>
Signed-off-by: Willie Hung <willie880201044@gmail.com>
Signed-off-by: Josh Romero <rmerqg@amazon.com>
Co-authored-by: SuZhou-Joe <suzhou@amazon.com> Signed-off-by: Willie Hung <willie880201044@gmail.com>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM - @Willie-The-Lord please open a follow-up issue, if you haven't already, for creating a registration function.
* Fix active background render error * Update CHANGELOG.md * Revise test suit * Add isActive logic * Remove redundant tests and add comment for future reference * Update src/core/public/chrome/ui/header/nav_link.tsx * Seperate special cases from logic && revise test * Update CHANGELOG.md * Update src/core/public/chrome/ui/header/nav_link.tsx Co-authored-by: SuZhou-Joe <suzhou@amazon.com> Signed-off-by: Willie Hung <willie880201044@gmail.com> --------- Signed-off-by: Willie Hung <willie880201044@gmail.com> Signed-off-by: Josh Romero <rmerqg@amazon.com> Co-authored-by: Josh Romero <rmerqg@amazon.com> Co-authored-by: SuZhou-Joe <suzhou@amazon.com> (cherry picked from commit 478176a) Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
#5606) * Fix active background render error * Update CHANGELOG.md * Revise test suit * Add isActive logic * Remove redundant tests and add comment for future reference * Update src/core/public/chrome/ui/header/nav_link.tsx * Seperate special cases from logic && revise test * Update CHANGELOG.md * Update src/core/public/chrome/ui/header/nav_link.tsx --------- (cherry picked from commit 478176a) Signed-off-by: Willie Hung <willie880201044@gmail.com> Signed-off-by: Josh Romero <rmerqg@amazon.com> Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Josh Romero <rmerqg@amazon.com> Co-authored-by: SuZhou-Joe <suzhou@amazon.com>
* Fix active background render error * Update CHANGELOG.md * Revise test suit * Add isActive logic * Remove redundant tests and add comment for future reference * Update src/core/public/chrome/ui/header/nav_link.tsx * Seperate special cases from logic && revise test * Update CHANGELOG.md * Update src/core/public/chrome/ui/header/nav_link.tsx Co-authored-by: SuZhou-Joe <suzhou@amazon.com> Signed-off-by: Willie Hung <willie880201044@gmail.com> --------- Signed-off-by: Willie Hung <willie880201044@gmail.com> Signed-off-by: Josh Romero <rmerqg@amazon.com> Co-authored-by: Josh Romero <rmerqg@amazon.com> Co-authored-by: SuZhou-Joe <suzhou@amazon.com> (cherry picked from commit 478176a) Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
* Fix active background render error * Update CHANGELOG.md * Revise test suit * Add isActive logic * Remove redundant tests and add comment for future reference * Update src/core/public/chrome/ui/header/nav_link.tsx * Seperate special cases from logic && revise test * Update CHANGELOG.md * Update src/core/public/chrome/ui/header/nav_link.tsx Co-authored-by: SuZhou-Joe <suzhou@amazon.com> Signed-off-by: Willie Hung <willie880201044@gmail.com> --------- Signed-off-by: Willie Hung <willie880201044@gmail.com> Signed-off-by: Josh Romero <rmerqg@amazon.com> Co-authored-by: Josh Romero <rmerqg@amazon.com> Co-authored-by: SuZhou-Joe <suzhou@amazon.com> (cherry picked from commit 478176a) Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
#5744) * Fix active background render error * Update CHANGELOG.md * Revise test suit * Add isActive logic * Remove redundant tests and add comment for future reference * Update src/core/public/chrome/ui/header/nav_link.tsx * Seperate special cases from logic && revise test * Update CHANGELOG.md * Update src/core/public/chrome/ui/header/nav_link.tsx --------- (cherry picked from commit 478176a) Signed-off-by: Willie Hung <willie880201044@gmail.com> Signed-off-by: Josh Romero <rmerqg@amazon.com> Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Josh Romero <rmerqg@amazon.com> Co-authored-by: SuZhou-Joe <suzhou@amazon.com>
Description
This PR resolves the issue where the 'Discover' tab in the collapsible side navigation menu failed to display the appropriate active state styling upon selection. The modification ensures that when a user selects the 'Discover' tab, it is now triggered and displayed with an active state background.
Issues Resolved
Resolves #5226
Screenshot
Before
before.mov
After
after.mov
Testing
Add unit tests for the following functions to ensure the newly added function operates correctly.
isActiveNavLink
(newly added function)createEuiListItem
Check List
yarn test:jest
yarn test:jest_integration