diff --git a/changelogs/fragments/7721.yml b/changelogs/fragments/7721.yml new file mode 100644 index 00000000000..1963c6ea475 --- /dev/null +++ b/changelogs/fragments/7721.yml @@ -0,0 +1,2 @@ +feat: +- Allow `screenTitle` to be present when SearchBar is not in Application header ([#7721](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/7721)) \ No newline at end of file diff --git a/src/plugins/navigation/public/top_nav_menu/_index.scss b/src/plugins/navigation/public/top_nav_menu/_index.scss index a4de5f473fb..556b58ff645 100644 --- a/src/plugins/navigation/public/top_nav_menu/_index.scss +++ b/src/plugins/navigation/public/top_nav_menu/_index.scss @@ -67,3 +67,9 @@ text-overflow: ellipsis; } } + +// stylelint-disable-next-line @osd/stylelint/no_modifying_global_selectors +.osdTopNavMenuSpread .euiHeaderLinks__list { + width: 100%; + justify-content: space-between; +} diff --git a/src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx b/src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx index e8e3489fe28..4abf5a4cd8b 100644 --- a/src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx +++ b/src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx @@ -128,11 +128,14 @@ export function TopNavMenu(props: TopNavMenuProps): ReactElement | null { ); } - function renderMenu(className: string): ReactElement | null { + function renderMenu(className: string, spreadSections: boolean = false): ReactElement | null { if ((!config || config.length === 0) && (!showDataSourceMenu || !dataSourceMenuConfig)) return null; + + const menuClassName = classNames(className, { osdTopNavMenuSpread: spreadSections }); + return ( - + {renderItems()} {renderDataSourceMenu()} @@ -182,12 +185,19 @@ export function TopNavMenu(props: TopNavMenuProps): ReactElement | null { case false: case TopNavMenuItemRenderType.OMITTED: - return ( - <> - - {renderMenu(menuClassName)} - - + return screenTitle ? ( + + + + {screenTitle} + + {renderMenu(menuClassName, true)} + + + ) : ( + + {renderMenu(menuClassName)} + ); // Show the SearchBar in-place