From 351f216919c70fc985b7935f96c6e75d9c8c03db Mon Sep 17 00:00:00 2001 From: Lin Wang Date: Mon, 20 Jan 2025 14:00:54 +0800 Subject: [PATCH 01/11] Add navControlNewPrimaryRight slot to header Signed-off-by: Lin Wang --- src/core/public/chrome/chrome_service.tsx | 1 + .../chrome/nav_controls/nav_controls_service.ts | 17 +++++++++++++++++ src/core/public/chrome/ui/header/header.tsx | 11 ++++++++++- 3 files changed, 28 insertions(+), 1 deletion(-) diff --git a/src/core/public/chrome/chrome_service.tsx b/src/core/public/chrome/chrome_service.tsx index 4e16b185eb49..f523d01d53d6 100644 --- a/src/core/public/chrome/chrome_service.tsx +++ b/src/core/public/chrome/chrome_service.tsx @@ -391,6 +391,7 @@ export class ChromeService { navControlsExpandedCenter$={navControls.getExpandedCenter$()} navControlsExpandedRight$={navControls.getExpandedRight$()} navControlsLeftBottom$={navControls.getLeftBottom$()} + navControlsNewPrimaryHeaderRight$={navControls.getNewPrimaryHeaderRight$()} onIsLockedUpdate={setIsNavDrawerLocked} isLocked$={getIsNavDrawerLocked$} branding={injectedMetadata.getBranding()} diff --git a/src/core/public/chrome/nav_controls/nav_controls_service.ts b/src/core/public/chrome/nav_controls/nav_controls_service.ts index 19135cbf866c..1e685064961e 100644 --- a/src/core/public/chrome/nav_controls/nav_controls_service.ts +++ b/src/core/public/chrome/nav_controls/nav_controls_service.ts @@ -64,6 +64,8 @@ export interface ChromeNavControls { registerCenter(navControl: ChromeNavControl): void; /** Register a nav control to be presented on the left-bottom side of the left navigation. */ registerLeftBottom(navControl: ChromeNavControl): void; + /** Register a nav control to be presented on the right side of the new primary chrome header. */ + registerNewPrimaryHeaderRight(navControl: ChromeNavControl): void; /** @internal */ getLeft$(): Observable; /** @internal */ @@ -72,6 +74,8 @@ export interface ChromeNavControls { getCenter$(): Observable; /** @internal */ getLeftBottom$(): Observable; + /** @internal */ + getNewPrimaryHeaderRight$(): Observable; } /** @internal */ @@ -87,6 +91,9 @@ export class NavControlsService { new Set() ); const navControlsLeftBottom$ = new BehaviorSubject>(new Set()); + const navControlsNewPrimaryHeaderRight$ = new BehaviorSubject>( + new Set() + ); return { // In the future, registration should be moved to the setup phase. This @@ -115,6 +122,11 @@ export class NavControlsService { new Set([...navControlsLeftBottom$.value.values(), navControl]) ), + registerNewPrimaryHeaderRight: (navControl: ChromeNavControl) => + navControlsNewPrimaryHeaderRight$.next( + new Set([...navControlsNewPrimaryHeaderRight$.value.values(), navControl]) + ), + getLeft$: () => navControlsLeft$.pipe( map((controls) => sortBy([...controls.values()], 'order')), @@ -145,6 +157,11 @@ export class NavControlsService { map((controls) => sortBy([...controls.values()], 'order')), takeUntil(this.stop$) ), + getNewPrimaryHeaderRight$: () => + navControlsNewPrimaryHeaderRight$.pipe( + map((controls) => sortBy([...controls.values()], 'order')), + takeUntil(this.stop$) + ), }; } diff --git a/src/core/public/chrome/ui/header/header.tsx b/src/core/public/chrome/ui/header/header.tsx index 0b99c62e0fd4..cf342d28e9ec 100644 --- a/src/core/public/chrome/ui/header/header.tsx +++ b/src/core/public/chrome/ui/header/header.tsx @@ -108,6 +108,7 @@ export interface HeaderProps { navControlsExpandedCenter$: Observable; navControlsExpandedRight$: Observable; navControlsLeftBottom$: Observable; + navControlsNewPrimaryHeaderRight$: Observable; basePath: HttpStart['basePath']; isLocked$: Observable; loadingCount$: ReturnType; @@ -504,6 +505,9 @@ export function Header({ /> ); + const renderNewPrimaryHeaderRight = () => ( + + ); const leftControls = renderLeftControls(); const centerControls = renderCenterControls(); @@ -554,6 +558,8 @@ export function Header({ {renderRecentItems()} {renderBreadcrumbs(false, false)} + + {renderNewPrimaryHeaderRight()} {/* Secondary header */} @@ -623,7 +629,10 @@ export function Header({ {renderRecentItems()} {actionMenu} - {rightControls} + + {rightControls} + {renderNewPrimaryHeaderRight()} +
From 96d4035b83765708c99f21d02415406e104b3360 Mon Sep 17 00:00:00 2001 From: "opensearch-changeset-bot[bot]" <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 06:54:43 +0000 Subject: [PATCH 02/11] Changeset file for PR #9223 created/updated --- changelogs/fragments/9223.yml | 2 ++ 1 file changed, 2 insertions(+) create mode 100644 changelogs/fragments/9223.yml diff --git a/changelogs/fragments/9223.yml b/changelogs/fragments/9223.yml new file mode 100644 index 000000000000..3e701d08e7cc --- /dev/null +++ b/changelogs/fragments/9223.yml @@ -0,0 +1,2 @@ +feat: +- Add navControlsNewPrimaryHeaderRight slot to header ([#9223](/~https://github.com/opensearch-project/OpenSearch-Dashboards/pull/9223)) \ No newline at end of file From 7caa7563c5aa7c97b0f7fbd7e82b3cf62b6272d4 Mon Sep 17 00:00:00 2001 From: Lin Wang Date: Mon, 20 Jan 2025 15:38:00 +0800 Subject: [PATCH 03/11] Fix vertical align for header items Signed-off-by: Lin Wang --- src/core/public/chrome/ui/header/header.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/core/public/chrome/ui/header/header.tsx b/src/core/public/chrome/ui/header/header.tsx index cf342d28e9ec..c871ff03d44a 100644 --- a/src/core/public/chrome/ui/header/header.tsx +++ b/src/core/public/chrome/ui/header/header.tsx @@ -506,7 +506,9 @@ export function Header({ ); const renderNewPrimaryHeaderRight = () => ( - + + + ); const leftControls = renderLeftControls(); From 2daa83a7356cf22da3efe55aff70949cb161faf0 Mon Sep 17 00:00:00 2001 From: Lin Wang Date: Mon, 20 Jan 2025 15:41:58 +0800 Subject: [PATCH 04/11] Fix test coverage drop Signed-off-by: Lin Wang --- .../nav_controls/nav_controls_service.test.ts | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/src/core/public/chrome/nav_controls/nav_controls_service.test.ts b/src/core/public/chrome/nav_controls/nav_controls_service.test.ts index a3d73168c789..2efa6e628848 100644 --- a/src/core/public/chrome/nav_controls/nav_controls_service.test.ts +++ b/src/core/public/chrome/nav_controls/nav_controls_service.test.ts @@ -163,4 +163,28 @@ describe('RecentlyAccessed#start()', () => { expect(await navControls.getLeftBottom$().pipe(take(1)).toPromise()).toEqual([nc2, nc1, nc3]); }); }); + + describe('new primary header right controls', () => { + it('allows registration', async () => { + const navControls = getStart(); + const nc = { mount: jest.fn() }; + navControls.registerNewPrimaryHeaderRight(nc); + expect(await navControls.getNewPrimaryHeaderRight$().pipe(take(1)).toPromise()).toEqual([nc]); + }); + + it('sorts controls by order property', async () => { + const navControls = getStart(); + const nc1 = { mount: jest.fn(), order: 10 }; + const nc2 = { mount: jest.fn(), order: 0 }; + const nc3 = { mount: jest.fn(), order: 20 }; + navControls.registerNewPrimaryHeaderRight(nc1); + navControls.registerNewPrimaryHeaderRight(nc2); + navControls.registerNewPrimaryHeaderRight(nc3); + expect(await navControls.getNewPrimaryHeaderRight$().pipe(take(1)).toPromise()).toEqual([ + nc2, + nc1, + nc3, + ]); + }); + }); }); From 10540b2356f507b3445210ab7c19bf82c59daadc Mon Sep 17 00:00:00 2001 From: Lin Wang Date: Mon, 20 Jan 2025 15:59:18 +0800 Subject: [PATCH 05/11] Fix failed UTs Signed-off-by: Lin Wang --- .../header/__snapshots__/header.test.tsx.snap | 248 +++++++++++++++++- .../public/chrome/ui/header/header.test.tsx | 3 +- 2 files changed, 249 insertions(+), 2 deletions(-) diff --git a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap index 423902e326cf..7a852773d010 100644 --- a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap +++ b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap @@ -2540,6 +2540,17 @@ exports[`Header handles visibility and lock changes 1`] = ` "thrownError": null, } } + navControlsNewPrimaryHeaderRight$={ + BehaviorSubject { + "_isScalar": false, + "_value": Array [], + "closed": false, + "hasError": false, + "isStopped": false, + "observers": Array [], + "thrownError": null, + } + } navControlsRight$={ BehaviorSubject { "_isScalar": false, @@ -9653,6 +9664,55 @@ exports[`Header renders application header without title and breadcrumbs 1`] = ` "thrownError": null, } } + navControlsNewPrimaryHeaderRight$={ + BehaviorSubject { + "_isScalar": false, + "_value": Array [], + "closed": false, + "hasError": false, + "isStopped": false, + "observers": Array [ + Subscriber { + "_parentOrParents": null, + "_subscriptions": Array [ + SubjectSubscription { + "_parentOrParents": [Circular], + "_subscriptions": null, + "closed": false, + "subject": [Circular], + "subscriber": [Circular], + }, + ], + "closed": false, + "destination": SafeSubscriber { + "_complete": undefined, + "_context": [Circular], + "_error": undefined, + "_next": [Function], + "_parentOrParents": null, + "_parentSubscriber": [Circular], + "_subscriptions": null, + "closed": false, + "destination": Object { + "closed": true, + "complete": [Function], + "error": [Function], + "next": [Function], + }, + "isStopped": false, + "syncErrorThrowable": false, + "syncErrorThrown": false, + "syncErrorValue": null, + }, + "isStopped": false, + "syncErrorThrowable": true, + "syncErrorThrown": false, + "syncErrorValue": null, + }, + ], + "thrownError": null, + } + } navControlsRight$={ BehaviorSubject { "_isScalar": false, @@ -10739,7 +10799,65 @@ exports[`Header renders application header without title and breadcrumbs 1`] = ` >
+ > + +
+ +
+ +
@@ -13544,6 +13662,17 @@ exports[`Header renders condensed header 1`] = ` "thrownError": null, } } + navControlsNewPrimaryHeaderRight$={ + BehaviorSubject { + "_isScalar": false, + "_value": Array [], + "closed": false, + "hasError": false, + "isStopped": false, + "observers": Array [], + "thrownError": null, + } + } navControlsRight$={ BehaviorSubject { "_isScalar": false, @@ -18999,6 +19128,55 @@ exports[`Header renders page header with application title 1`] = ` "thrownError": null, } } + navControlsNewPrimaryHeaderRight$={ + BehaviorSubject { + "_isScalar": false, + "_value": Array [], + "closed": false, + "hasError": false, + "isStopped": false, + "observers": Array [ + Subscriber { + "_parentOrParents": null, + "_subscriptions": Array [ + SubjectSubscription { + "_parentOrParents": [Circular], + "_subscriptions": null, + "closed": false, + "subject": [Circular], + "subscriber": [Circular], + }, + ], + "closed": false, + "destination": SafeSubscriber { + "_complete": undefined, + "_context": [Circular], + "_error": undefined, + "_next": [Function], + "_parentOrParents": null, + "_parentSubscriber": [Circular], + "_subscriptions": null, + "closed": false, + "destination": Object { + "closed": true, + "complete": [Function], + "error": [Function], + "next": [Function], + }, + "isStopped": false, + "syncErrorThrowable": false, + "syncErrorThrown": false, + "syncErrorValue": null, + }, + "isStopped": false, + "syncErrorThrowable": true, + "syncErrorThrown": false, + "syncErrorValue": null, + }, + ], + "thrownError": null, + } + } navControlsRight$={ BehaviorSubject { "_isScalar": false, @@ -20451,6 +20629,63 @@ exports[`Header renders page header with application title 1`] = ` + +
+ +
+ { expect(component.find('[data-test-subj="headerBadgeControl"]').exists()).toBeFalsy(); expect(component.find('HeaderBadge').exists()).toBeFalsy(); expect(component.find('[data-test-subj="headerLeftControl"]').exists()).toBeFalsy(); - expect(component.find('HeaderNavControls').exists()).toBeFalsy(); + expect(component.find('HeaderNavControls')).toHaveLength(1); expect(component.find('[data-test-subj="headerCenterControl"]').exists()).toBeFalsy(); expect(component.find('[data-test-subj="headerRightControl"]').exists()).toBeFalsy(); expect(component.find('HeaderActionMenu').exists()).toBeFalsy(); From 9d39fda2624a7c633853fe8ce3506af6f7c5fb13 Mon Sep 17 00:00:00 2001 From: Lin Wang Date: Mon, 20 Jan 2025 16:19:04 +0800 Subject: [PATCH 06/11] Fix bootstrap failed Signed-off-by: Lin Wang --- src/core/public/chrome/chrome_service.mock.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/core/public/chrome/chrome_service.mock.ts b/src/core/public/chrome/chrome_service.mock.ts index 19997a87561a..e77b3b7bff74 100644 --- a/src/core/public/chrome/chrome_service.mock.ts +++ b/src/core/public/chrome/chrome_service.mock.ts @@ -75,10 +75,12 @@ const createStartContractMock = () => { registerCenter: jest.fn(), registerRight: jest.fn(), registerLeftBottom: jest.fn(), + registerNewPrimaryHeaderRight: jest.fn(), getLeft$: jest.fn(), getCenter$: jest.fn(), getRight$: jest.fn(), getLeftBottom$: jest.fn(), + getNewPrimaryHeaderRight$: jest.fn(), }, navGroup: { getNavGroupsMap$: jest.fn(() => new BehaviorSubject({})), From 8031bf5018a23d6ec5f14d4f022540712d059c4a Mon Sep 17 00:00:00 2001 From: Lin Wang Date: Mon, 20 Jan 2025 17:12:00 +0800 Subject: [PATCH 07/11] Update failed snapshots Signed-off-by: Lin Wang --- .../__snapshots__/dashboard_top_nav.test.tsx.snap | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap b/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap index 303a9238a2af..7999a917b901 100644 --- a/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap +++ b/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap @@ -214,10 +214,12 @@ exports[`Dashboard top nav render in embed mode 1`] = ` "getCenter$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -1300,10 +1302,12 @@ exports[`Dashboard top nav render in embed mode, and force hide filter bar 1`] = "getCenter$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -2386,10 +2390,12 @@ exports[`Dashboard top nav render in embed mode, components can be forced show b "getCenter$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -3472,10 +3478,12 @@ exports[`Dashboard top nav render in full screen mode with appended URL param bu "getCenter$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -4558,10 +4566,12 @@ exports[`Dashboard top nav render in full screen mode, no componenets should be "getCenter$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -5644,10 +5654,12 @@ exports[`Dashboard top nav render with all components 1`] = ` "getCenter$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { From ceb5048e205a5af8fb7045f61ea29906d3f50f95 Mon Sep 17 00:00:00 2001 From: Lin Wang Date: Wed, 22 Jan 2025 14:00:37 +0800 Subject: [PATCH 08/11] Remove left border Signed-off-by: Lin Wang --- .../ui/header/__snapshots__/header.test.tsx.snap | 12 ++++++++---- src/core/public/chrome/ui/header/header.tsx | 2 +- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap index 7a852773d010..d466f6f0b648 100644 --- a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap +++ b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap @@ -10800,9 +10800,11 @@ exports[`Header renders application header without title and breadcrumbs 1`] = `
- +
- +
); const renderNewPrimaryHeaderRight = () => ( - + ); From 63f1799c26cd9365cf6066d4f7bf4931253619be Mon Sep 17 00:00:00 2001 From: Lin Wang Date: Wed, 22 Jan 2025 14:29:53 +0800 Subject: [PATCH 09/11] Refactor with headerRight Signed-off-by: Lin Wang --- src/core/public/chrome/chrome_service.mock.ts | 4 ++-- src/core/public/chrome/chrome_service.tsx | 2 +- .../nav_controls/nav_controls_service.test.ts | 12 +++++----- .../nav_controls/nav_controls_service.ts | 8 +++---- src/core/public/chrome/ui/header/header.tsx | 6 ++--- .../dashboard_top_nav.test.tsx.snap | 24 +++++++++---------- 6 files changed, 28 insertions(+), 28 deletions(-) diff --git a/src/core/public/chrome/chrome_service.mock.ts b/src/core/public/chrome/chrome_service.mock.ts index e77b3b7bff74..8733229bf1a3 100644 --- a/src/core/public/chrome/chrome_service.mock.ts +++ b/src/core/public/chrome/chrome_service.mock.ts @@ -75,12 +75,12 @@ const createStartContractMock = () => { registerCenter: jest.fn(), registerRight: jest.fn(), registerLeftBottom: jest.fn(), - registerNewPrimaryHeaderRight: jest.fn(), + registerHeaderRight: jest.fn(), getLeft$: jest.fn(), getCenter$: jest.fn(), getRight$: jest.fn(), getLeftBottom$: jest.fn(), - getNewPrimaryHeaderRight$: jest.fn(), + getHeaderRight$: jest.fn(), }, navGroup: { getNavGroupsMap$: jest.fn(() => new BehaviorSubject({})), diff --git a/src/core/public/chrome/chrome_service.tsx b/src/core/public/chrome/chrome_service.tsx index f523d01d53d6..1b5a268a5409 100644 --- a/src/core/public/chrome/chrome_service.tsx +++ b/src/core/public/chrome/chrome_service.tsx @@ -391,7 +391,7 @@ export class ChromeService { navControlsExpandedCenter$={navControls.getExpandedCenter$()} navControlsExpandedRight$={navControls.getExpandedRight$()} navControlsLeftBottom$={navControls.getLeftBottom$()} - navControlsNewPrimaryHeaderRight$={navControls.getNewPrimaryHeaderRight$()} + navControlsNewPrimaryHeaderRight$={navControls.getHeaderRight$()} onIsLockedUpdate={setIsNavDrawerLocked} isLocked$={getIsNavDrawerLocked$} branding={injectedMetadata.getBranding()} diff --git a/src/core/public/chrome/nav_controls/nav_controls_service.test.ts b/src/core/public/chrome/nav_controls/nav_controls_service.test.ts index 2efa6e628848..f81cc4c17ece 100644 --- a/src/core/public/chrome/nav_controls/nav_controls_service.test.ts +++ b/src/core/public/chrome/nav_controls/nav_controls_service.test.ts @@ -168,8 +168,8 @@ describe('RecentlyAccessed#start()', () => { it('allows registration', async () => { const navControls = getStart(); const nc = { mount: jest.fn() }; - navControls.registerNewPrimaryHeaderRight(nc); - expect(await navControls.getNewPrimaryHeaderRight$().pipe(take(1)).toPromise()).toEqual([nc]); + navControls.registerHeaderRight(nc); + expect(await navControls.getHeaderRight$().pipe(take(1)).toPromise()).toEqual([nc]); }); it('sorts controls by order property', async () => { @@ -177,10 +177,10 @@ describe('RecentlyAccessed#start()', () => { const nc1 = { mount: jest.fn(), order: 10 }; const nc2 = { mount: jest.fn(), order: 0 }; const nc3 = { mount: jest.fn(), order: 20 }; - navControls.registerNewPrimaryHeaderRight(nc1); - navControls.registerNewPrimaryHeaderRight(nc2); - navControls.registerNewPrimaryHeaderRight(nc3); - expect(await navControls.getNewPrimaryHeaderRight$().pipe(take(1)).toPromise()).toEqual([ + navControls.registerHeaderRight(nc1); + navControls.registerHeaderRight(nc2); + navControls.registerHeaderRight(nc3); + expect(await navControls.getHeaderRight$().pipe(take(1)).toPromise()).toEqual([ nc2, nc1, nc3, diff --git a/src/core/public/chrome/nav_controls/nav_controls_service.ts b/src/core/public/chrome/nav_controls/nav_controls_service.ts index 1e685064961e..a608b05262da 100644 --- a/src/core/public/chrome/nav_controls/nav_controls_service.ts +++ b/src/core/public/chrome/nav_controls/nav_controls_service.ts @@ -65,7 +65,7 @@ export interface ChromeNavControls { /** Register a nav control to be presented on the left-bottom side of the left navigation. */ registerLeftBottom(navControl: ChromeNavControl): void; /** Register a nav control to be presented on the right side of the new primary chrome header. */ - registerNewPrimaryHeaderRight(navControl: ChromeNavControl): void; + registerHeaderRight(navControl: ChromeNavControl): void; /** @internal */ getLeft$(): Observable; /** @internal */ @@ -75,7 +75,7 @@ export interface ChromeNavControls { /** @internal */ getLeftBottom$(): Observable; /** @internal */ - getNewPrimaryHeaderRight$(): Observable; + getHeaderRight$(): Observable; } /** @internal */ @@ -122,7 +122,7 @@ export class NavControlsService { new Set([...navControlsLeftBottom$.value.values(), navControl]) ), - registerNewPrimaryHeaderRight: (navControl: ChromeNavControl) => + registerHeaderRight: (navControl: ChromeNavControl) => navControlsNewPrimaryHeaderRight$.next( new Set([...navControlsNewPrimaryHeaderRight$.value.values(), navControl]) ), @@ -157,7 +157,7 @@ export class NavControlsService { map((controls) => sortBy([...controls.values()], 'order')), takeUntil(this.stop$) ), - getNewPrimaryHeaderRight$: () => + getHeaderRight$: () => navControlsNewPrimaryHeaderRight$.pipe( map((controls) => sortBy([...controls.values()], 'order')), takeUntil(this.stop$) diff --git a/src/core/public/chrome/ui/header/header.tsx b/src/core/public/chrome/ui/header/header.tsx index 48a19cb2fb35..37ee55520ff7 100644 --- a/src/core/public/chrome/ui/header/header.tsx +++ b/src/core/public/chrome/ui/header/header.tsx @@ -505,7 +505,7 @@ export function Header({ /> ); - const renderNewPrimaryHeaderRight = () => ( + const renderHeaderRight = () => ( @@ -561,7 +561,7 @@ export function Header({ {renderBreadcrumbs(false, false)} - {renderNewPrimaryHeaderRight()} + {renderHeaderRight()} {/* Secondary header */} @@ -633,7 +633,7 @@ export function Header({ {rightControls} - {renderNewPrimaryHeaderRight()} + {renderHeaderRight()}
diff --git a/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap b/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap index 5a40ee3b1176..d009460871bb 100644 --- a/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap +++ b/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap @@ -212,14 +212,14 @@ exports[`Dashboard top nav render in embed mode 1`] = ` }, "navControls": Object { "getCenter$": [MockFunction], + "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], - "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], + "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], - "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -1300,14 +1300,14 @@ exports[`Dashboard top nav render in embed mode, and force hide filter bar 1`] = }, "navControls": Object { "getCenter$": [MockFunction], + "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], - "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], + "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], - "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -2388,14 +2388,14 @@ exports[`Dashboard top nav render in embed mode, components can be forced show b }, "navControls": Object { "getCenter$": [MockFunction], + "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], - "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], + "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], - "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -3476,14 +3476,14 @@ exports[`Dashboard top nav render in full screen mode with appended URL param bu }, "navControls": Object { "getCenter$": [MockFunction], + "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], - "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], + "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], - "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -4564,14 +4564,14 @@ exports[`Dashboard top nav render in full screen mode, no componenets should be }, "navControls": Object { "getCenter$": [MockFunction], + "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], - "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], + "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], - "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -5652,14 +5652,14 @@ exports[`Dashboard top nav render with all components 1`] = ` }, "navControls": Object { "getCenter$": [MockFunction], + "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], - "getNewPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], + "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], - "registerNewPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { From b088a3a60f3a797c18d0af580951301c95ad0012 Mon Sep 17 00:00:00 2001 From: Lin Wang Date: Wed, 22 Jan 2025 15:59:43 +0800 Subject: [PATCH 10/11] Renaming to primaryHeaderRight Signed-off-by: Lin Wang --- src/core/public/chrome/chrome_service.mock.ts | 4 ++-- src/core/public/chrome/chrome_service.tsx | 2 +- .../nav_controls/nav_controls_service.test.ts | 12 +++++----- .../nav_controls/nav_controls_service.ts | 18 +++++++------- .../header/__snapshots__/header.test.tsx.snap | 10 ++++---- .../public/chrome/ui/header/header.test.tsx | 2 +- src/core/public/chrome/ui/header/header.tsx | 10 ++++---- .../dashboard_top_nav.test.tsx.snap | 24 +++++++++---------- 8 files changed, 41 insertions(+), 41 deletions(-) diff --git a/src/core/public/chrome/chrome_service.mock.ts b/src/core/public/chrome/chrome_service.mock.ts index 8733229bf1a3..cdcb70428f29 100644 --- a/src/core/public/chrome/chrome_service.mock.ts +++ b/src/core/public/chrome/chrome_service.mock.ts @@ -75,12 +75,12 @@ const createStartContractMock = () => { registerCenter: jest.fn(), registerRight: jest.fn(), registerLeftBottom: jest.fn(), - registerHeaderRight: jest.fn(), + registerPrimaryHeaderRight: jest.fn(), getLeft$: jest.fn(), getCenter$: jest.fn(), getRight$: jest.fn(), getLeftBottom$: jest.fn(), - getHeaderRight$: jest.fn(), + getPrimaryHeaderRight$: jest.fn(), }, navGroup: { getNavGroupsMap$: jest.fn(() => new BehaviorSubject({})), diff --git a/src/core/public/chrome/chrome_service.tsx b/src/core/public/chrome/chrome_service.tsx index 1b5a268a5409..5ba78f5e255d 100644 --- a/src/core/public/chrome/chrome_service.tsx +++ b/src/core/public/chrome/chrome_service.tsx @@ -391,7 +391,7 @@ export class ChromeService { navControlsExpandedCenter$={navControls.getExpandedCenter$()} navControlsExpandedRight$={navControls.getExpandedRight$()} navControlsLeftBottom$={navControls.getLeftBottom$()} - navControlsNewPrimaryHeaderRight$={navControls.getHeaderRight$()} + navControlsPrimaryHeaderRight$={navControls.getPrimaryHeaderRight$()} onIsLockedUpdate={setIsNavDrawerLocked} isLocked$={getIsNavDrawerLocked$} branding={injectedMetadata.getBranding()} diff --git a/src/core/public/chrome/nav_controls/nav_controls_service.test.ts b/src/core/public/chrome/nav_controls/nav_controls_service.test.ts index f81cc4c17ece..2926dee8e26f 100644 --- a/src/core/public/chrome/nav_controls/nav_controls_service.test.ts +++ b/src/core/public/chrome/nav_controls/nav_controls_service.test.ts @@ -168,8 +168,8 @@ describe('RecentlyAccessed#start()', () => { it('allows registration', async () => { const navControls = getStart(); const nc = { mount: jest.fn() }; - navControls.registerHeaderRight(nc); - expect(await navControls.getHeaderRight$().pipe(take(1)).toPromise()).toEqual([nc]); + navControls.registerPrimaryHeaderRight(nc); + expect(await navControls.getPrimaryHeaderRight$().pipe(take(1)).toPromise()).toEqual([nc]); }); it('sorts controls by order property', async () => { @@ -177,10 +177,10 @@ describe('RecentlyAccessed#start()', () => { const nc1 = { mount: jest.fn(), order: 10 }; const nc2 = { mount: jest.fn(), order: 0 }; const nc3 = { mount: jest.fn(), order: 20 }; - navControls.registerHeaderRight(nc1); - navControls.registerHeaderRight(nc2); - navControls.registerHeaderRight(nc3); - expect(await navControls.getHeaderRight$().pipe(take(1)).toPromise()).toEqual([ + navControls.registerPrimaryHeaderRight(nc1); + navControls.registerPrimaryHeaderRight(nc2); + navControls.registerPrimaryHeaderRight(nc3); + expect(await navControls.getPrimaryHeaderRight$().pipe(take(1)).toPromise()).toEqual([ nc2, nc1, nc3, diff --git a/src/core/public/chrome/nav_controls/nav_controls_service.ts b/src/core/public/chrome/nav_controls/nav_controls_service.ts index a608b05262da..08dd5798d818 100644 --- a/src/core/public/chrome/nav_controls/nav_controls_service.ts +++ b/src/core/public/chrome/nav_controls/nav_controls_service.ts @@ -64,8 +64,8 @@ export interface ChromeNavControls { registerCenter(navControl: ChromeNavControl): void; /** Register a nav control to be presented on the left-bottom side of the left navigation. */ registerLeftBottom(navControl: ChromeNavControl): void; - /** Register a nav control to be presented on the right side of the new primary chrome header. */ - registerHeaderRight(navControl: ChromeNavControl): void; + /** Register a nav control to be presented on the right side of the primary chrome header. */ + registerPrimaryHeaderRight(navControl: ChromeNavControl): void; /** @internal */ getLeft$(): Observable; /** @internal */ @@ -75,7 +75,7 @@ export interface ChromeNavControls { /** @internal */ getLeftBottom$(): Observable; /** @internal */ - getHeaderRight$(): Observable; + getPrimaryHeaderRight$(): Observable; } /** @internal */ @@ -91,7 +91,7 @@ export class NavControlsService { new Set() ); const navControlsLeftBottom$ = new BehaviorSubject>(new Set()); - const navControlsNewPrimaryHeaderRight$ = new BehaviorSubject>( + const navControlsPrimaryHeaderRight$ = new BehaviorSubject>( new Set() ); @@ -122,9 +122,9 @@ export class NavControlsService { new Set([...navControlsLeftBottom$.value.values(), navControl]) ), - registerHeaderRight: (navControl: ChromeNavControl) => - navControlsNewPrimaryHeaderRight$.next( - new Set([...navControlsNewPrimaryHeaderRight$.value.values(), navControl]) + registerPrimaryHeaderRight: (navControl: ChromeNavControl) => + navControlsPrimaryHeaderRight$.next( + new Set([...navControlsPrimaryHeaderRight$.value.values(), navControl]) ), getLeft$: () => @@ -157,8 +157,8 @@ export class NavControlsService { map((controls) => sortBy([...controls.values()], 'order')), takeUntil(this.stop$) ), - getHeaderRight$: () => - navControlsNewPrimaryHeaderRight$.pipe( + getPrimaryHeaderRight$: () => + navControlsPrimaryHeaderRight$.pipe( map((controls) => sortBy([...controls.values()], 'order')), takeUntil(this.stop$) ), diff --git a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap index d466f6f0b648..8c4a332650dd 100644 --- a/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap +++ b/src/core/public/chrome/ui/header/__snapshots__/header.test.tsx.snap @@ -2540,7 +2540,7 @@ exports[`Header handles visibility and lock changes 1`] = ` "thrownError": null, } } - navControlsNewPrimaryHeaderRight$={ + navControlsPrimaryHeaderRight$={ BehaviorSubject { "_isScalar": false, "_value": Array [], @@ -9664,7 +9664,7 @@ exports[`Header renders application header without title and breadcrumbs 1`] = ` "thrownError": null, } } - navControlsNewPrimaryHeaderRight$={ + navControlsPrimaryHeaderRight$={ BehaviorSubject { "_isScalar": false, "_value": Array [], @@ -13664,7 +13664,7 @@ exports[`Header renders condensed header 1`] = ` "thrownError": null, } } - navControlsNewPrimaryHeaderRight$={ + navControlsPrimaryHeaderRight$={ BehaviorSubject { "_isScalar": false, "_value": Array [], @@ -19130,7 +19130,7 @@ exports[`Header renders page header with application title 1`] = ` "thrownError": null, } } - navControlsNewPrimaryHeaderRight$={ + navControlsPrimaryHeaderRight$={ BehaviorSubject { "_isScalar": false, "_value": Array [], @@ -23711,7 +23711,7 @@ exports[`Header toggles primary navigation menu when clicked 1`] = ` "thrownError": null, } } - navControlsNewPrimaryHeaderRight$={ + navControlsPrimaryHeaderRight$={ BehaviorSubject { "_isScalar": false, "_value": Array [], diff --git a/src/core/public/chrome/ui/header/header.test.tsx b/src/core/public/chrome/ui/header/header.test.tsx index 6af0b2f2c54c..31c60942d649 100644 --- a/src/core/public/chrome/ui/header/header.test.tsx +++ b/src/core/public/chrome/ui/header/header.test.tsx @@ -72,7 +72,7 @@ function mockProps() { navControlsRight$: new BehaviorSubject([]), navControlsExpandedCenter$: new BehaviorSubject([]), navControlsExpandedRight$: new BehaviorSubject([]), - navControlsNewPrimaryHeaderRight$: new BehaviorSubject([]), + navControlsPrimaryHeaderRight$: new BehaviorSubject([]), basePath: http.basePath, isLocked$: new BehaviorSubject(false), loadingCount$: new BehaviorSubject(0), diff --git a/src/core/public/chrome/ui/header/header.tsx b/src/core/public/chrome/ui/header/header.tsx index 37ee55520ff7..75add46475c7 100644 --- a/src/core/public/chrome/ui/header/header.tsx +++ b/src/core/public/chrome/ui/header/header.tsx @@ -108,7 +108,7 @@ export interface HeaderProps { navControlsExpandedCenter$: Observable; navControlsExpandedRight$: Observable; navControlsLeftBottom$: Observable; - navControlsNewPrimaryHeaderRight$: Observable; + navControlsPrimaryHeaderRight$: Observable; basePath: HttpStart['basePath']; isLocked$: Observable; loadingCount$: ReturnType; @@ -505,9 +505,9 @@ export function Header({ /> ); - const renderHeaderRight = () => ( + const renderPrimaryHeaderRight = () => ( - + ); @@ -561,7 +561,7 @@ export function Header({ {renderBreadcrumbs(false, false)} - {renderHeaderRight()} + {renderPrimaryHeaderRight()} {/* Secondary header */} @@ -633,7 +633,7 @@ export function Header({ {rightControls} - {renderHeaderRight()} + {renderPrimaryHeaderRight()}
diff --git a/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap b/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap index d009460871bb..3fc1dd35f813 100644 --- a/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap +++ b/src/plugins/dashboard/public/application/components/dashboard_top_nav/__snapshots__/dashboard_top_nav.test.tsx.snap @@ -212,14 +212,14 @@ exports[`Dashboard top nav render in embed mode 1`] = ` }, "navControls": Object { "getCenter$": [MockFunction], - "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], - "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -1300,14 +1300,14 @@ exports[`Dashboard top nav render in embed mode, and force hide filter bar 1`] = }, "navControls": Object { "getCenter$": [MockFunction], - "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], - "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -2388,14 +2388,14 @@ exports[`Dashboard top nav render in embed mode, components can be forced show b }, "navControls": Object { "getCenter$": [MockFunction], - "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], - "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -3476,14 +3476,14 @@ exports[`Dashboard top nav render in full screen mode with appended URL param bu }, "navControls": Object { "getCenter$": [MockFunction], - "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], - "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -4564,14 +4564,14 @@ exports[`Dashboard top nav render in full screen mode, no componenets should be }, "navControls": Object { "getCenter$": [MockFunction], - "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], - "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { @@ -5652,14 +5652,14 @@ exports[`Dashboard top nav render with all components 1`] = ` }, "navControls": Object { "getCenter$": [MockFunction], - "getHeaderRight$": [MockFunction], "getLeft$": [MockFunction], "getLeftBottom$": [MockFunction], + "getPrimaryHeaderRight$": [MockFunction], "getRight$": [MockFunction], "registerCenter": [MockFunction], - "registerHeaderRight": [MockFunction], "registerLeft": [MockFunction], "registerLeftBottom": [MockFunction], + "registerPrimaryHeaderRight": [MockFunction], "registerRight": [MockFunction], }, "navGroup": Object { From 6720a52a815362059472364879ac4f04cfcbd4f1 Mon Sep 17 00:00:00 2001 From: "opensearch-changeset-bot[bot]" <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com> Date: Wed, 22 Jan 2025 08:02:47 +0000 Subject: [PATCH 11/11] Changeset file for PR #9223 created/updated --- changelogs/fragments/9223.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/changelogs/fragments/9223.yml b/changelogs/fragments/9223.yml index 3e701d08e7cc..00270c401ef0 100644 --- a/changelogs/fragments/9223.yml +++ b/changelogs/fragments/9223.yml @@ -1,2 +1,2 @@ feat: -- Add navControlsNewPrimaryHeaderRight slot to header ([#9223](/~https://github.com/opensearch-project/OpenSearch-Dashboards/pull/9223)) \ No newline at end of file +- Add navControlsPrimaryHeaderRight slot to header ([#9223](/~https://github.com/opensearch-project/OpenSearch-Dashboards/pull/9223)) \ No newline at end of file