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

[Enterprise Search] Added a shouldShowActiveForSubroutes option #83338

Merged
merged 3 commits into from
Nov 16, 2020

Conversation

JasonStoltz
Copy link
Member

Summary

This PR lets us show Engine nav links as "active" for routes that have sub-routes.

For ex.

There is a documents page at /documents.
There is a document detail page at /documents/:id.

The documents page is linked to from the Engine nav.
The document detail page is considered a sub-page of documents, and hence, is not linked from the Engine nav.

However, we still need to show "Documents" as the active link within the Engine nav.

I'm proposing passing a flag of shouldShowActiveForSubroutes to the SubNavLink, which will show the link as active if the "to" link matches the current path OR is the root of the current path.

Alternatively, we could make this change the default for nav links. I.e., if the "to" link matches the current path OR is the root of the current path, then show it as active.

I'm open to suggestions.

Checklist

For maintainers

@JasonStoltz JasonStoltz requested a review from a team November 12, 2020 20:12
@JasonStoltz JasonStoltz added v7.11.0 release_note:skip Skip the PR/issue when compiling release notes labels Nov 12, 2020
@cee-chen
Copy link
Contributor

Ohh super good catch on this one!

Alternatively, we could make this change the default for nav links. I.e., if the "to" link matches the current path OR is the root of the current path, then show it as active.

I like this idea a lot in theory, but we might want to check with @scottybollinger / the WS team first. I think it would affect their current nested navigation links like so [current state below]:

would end up looking like this or this:

which is maybe a little odd, so I think I'm leaning towards a one-off prop like you added for that reason.

Copy link
Contributor

@cee-chen cee-chen left a comment

Choose a reason for hiding this comment

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

After reading the code a little more I think I feel more certain that we should leave the optional flag as-is instead of making it a default (I think mainly to not affect WS like the screenshots above). This is super great, thanks Jason! I have a super minor comment on test organization but it's non-blocking

@@ -79,6 +79,30 @@ describe('SideNavLink', () => {
expect(wrapper.find('.enterpriseSearchNavLinks__item--isActive')).toHaveLength(1);
});

it("won't set an active class when route is a subroute of 'to'", () => {
Copy link
Contributor

Choose a reason for hiding this comment

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

[not a blocker] What are your thoughts on wrapping these two new tests in a describe('shouldShowActiveForSubroutes' () => { block for organization and swapping the order (testing the positive first and then confirming the negative)? no worries if not, it's super minor

Copy link
Member Author

@JasonStoltz JasonStoltz Nov 16, 2020

Choose a reason for hiding this comment

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

Yeah I'll update this. I have to merge master anyway.

@@ -63,15 +63,17 @@ export const SideNav: React.FC<SideNavProps> = ({ product, children }) => {

interface SideNavLinkProps {
to: string;
shouldShowActiveForSubroutes?: boolean;
Copy link
Contributor

Choose a reason for hiding this comment

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

After rereading a few times this var name is really growing on me! It's very clear what it means and I was able to figure it out without having to ask for a screenshot (which I almost did at first haha) 💯

Copy link
Member Author

Choose a reason for hiding this comment

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

Haha. I wanted to, but it was late in the day and and I was trying to get out the door so I thought I'd roll the dice 🎲

@scottybollinger
Copy link
Contributor

Just to be clear, I believe we want Workplace Search as-is with the parent not active. That won't change as a result of this PR, right?

@cee-chen
Copy link
Contributor

cee-chen commented Nov 12, 2020

Correct! The current implementation is with a manual flag/prop for if you want that behavior

@JasonStoltz JasonStoltz changed the title Added a shouldShowActiveForSubroutes option [Enterprise Search] Added a shouldShowActiveForSubroutes option Nov 16, 2020
@kibanamachine
Copy link
Contributor

💚 Build Succeeded

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id before after diff
enterpriseSearch 683.4KB 683.6KB +233.0B

History

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

@JasonStoltz JasonStoltz merged commit af65e13 into elastic:master Nov 16, 2020
@JasonStoltz JasonStoltz deleted the sidenav-link-update branch November 16, 2020 17:17
JasonStoltz added a commit to JasonStoltz/kibana that referenced this pull request Nov 17, 2020
phillipb added a commit to phillipb/kibana that referenced this pull request Nov 19, 2020
…ode-details

* 'master' of github.com:elastic/kibana:
  Remove dependency of tests on strict SyntaxKind values (elastic#83440)
  [SecuritySolution] override timerange for prebuilt templates (elastic#82468)
  [Enterprise Search] Added a shouldShowActiveForSubroutes option (elastic#83338)
  [Lens] Make the dimension flyout panel stay close on outside click (elastic#83059)
  [Security Solution] Gracefully handle errors in detection rules install (elastic#83306)
  Fix advanced settings category sorting (elastic#83394)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
release_note:skip Skip the PR/issue when compiling release notes v7.11.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants