Skip to content

Commit

Permalink
[Search][App Search] support engine name in solution nav (#192781)
Browse files Browse the repository at this point in the history
## Summary

Updated how we build the app search side items for the solution nav to
remove the renderItem handler and place all the engine links under the
engine name. This will only be used for the Search solution nav so we
are accepting the trade-off of losing the engine badges in the side nav
when using the solution nav.

### Screenshots
Engine page w/ Solution Nav
<img width="1482" alt="image"
src="https://github.com/user-attachments/assets/a7c88e82-2482-430a-9106-0708d152c903">
Engine Page w/ Classic Nav
<img width="1482" alt="image"
src="https://github.com/user-attachments/assets/c7cdac9e-97ff-4e58-849f-595da880e7db">
  • Loading branch information
TattdCodeMonkey authored Sep 13, 2024
1 parent 3da5a33 commit 3d4b362
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 5 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -65,3 +65,20 @@ export const useAppSearchNav = () => {
// to cause all our navItems to properly render as nav links.
return [{ id: '', name: '', items: navItems }];
};

// Process App Search side nav items for use in the new Solution Nav
export const cleanAppSearchNavItems = (
items: Array<EuiSideNavItemType<unknown>>
): Array<EuiSideNavItemType<unknown>> => {
const enginesItem = items.find((item) => item.id === 'engines');
if (enginesItem && enginesItem.items && enginesItem.items.length > 0) {
const engineChildren = enginesItem.items;
const engineNameItem = engineChildren.find((item) => item.id === 'engineName');
if (engineNameItem && engineNameItem.renderItem) {
delete engineNameItem.renderItem;
engineNameItem.items = engineChildren.filter((item) => item.id !== 'engineName');
enginesItem.items = [engineNameItem];
}
}
return items;
};
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { SetAppSearchChrome } from '../../../shared/kibana_chrome';
import { EnterpriseSearchPageTemplateWrapper, PageTemplateProps } from '../../../shared/layout';
import { SendAppSearchTelemetry } from '../../../shared/telemetry';

import { useAppSearchNav } from './nav';
import { useAppSearchNav, cleanAppSearchNavItems } from './nav';

export const AppSearchPageTemplate: React.FC<
Omit<PageTemplateProps, 'useEndpointHeaderActions'>
Expand All @@ -27,14 +27,14 @@ export const AppSearchPageTemplate: React.FC<

React.useEffect(() => {
if (chromeStyle === 'classic') return;
const appSearch = cleanAppSearchNavItems(navItems?.[0]?.items);
// We update the new side nav definition with the selected app items
updateSideNavDefinition({ appSearch: navItems?.[0]?.items });
}, [chromeStyle, navItems, updateSideNavDefinition]);
React.useEffect(() => {
updateSideNavDefinition({ appSearch });

return () => {
updateSideNavDefinition({ appSearch: undefined });
};
}, [updateSideNavDefinition]);
}, [chromeStyle, navItems, updateSideNavDefinition]);

return (
<EnterpriseSearchPageTemplateWrapper
Expand Down

0 comments on commit 3d4b362

Please sign in to comment.