diff --git a/docs/development/core/public/kibana-plugin-core-public.chromestart.getiscollapsed_.md b/docs/development/core/public/kibana-plugin-core-public.chromestart.getisnavdrawerlocked_.md
similarity index 51%
rename from docs/development/core/public/kibana-plugin-core-public.chromestart.getiscollapsed_.md
rename to docs/development/core/public/kibana-plugin-core-public.chromestart.getisnavdrawerlocked_.md
index 205f863526e223..78a4442a651e6a 100644
--- a/docs/development/core/public/kibana-plugin-core-public.chromestart.getiscollapsed_.md
+++ b/docs/development/core/public/kibana-plugin-core-public.chromestart.getisnavdrawerlocked_.md
@@ -1,15 +1,15 @@
-[Home](./index.md) > [kibana-plugin-core-public](./kibana-plugin-core-public.md) > [ChromeStart](./kibana-plugin-core-public.chromestart.md) > [getIsCollapsed$](./kibana-plugin-core-public.chromestart.getiscollapsed_.md)
+[Home](./index.md) > [kibana-plugin-core-public](./kibana-plugin-core-public.md) > [ChromeStart](./kibana-plugin-core-public.chromestart.md) > [getIsNavDrawerLocked$](./kibana-plugin-core-public.chromestart.getisnavdrawerlocked_.md)
-## ChromeStart.getIsCollapsed$() method
+## ChromeStart.getIsNavDrawerLocked$() method
-Get an observable of the current collapsed state of the chrome.
+Get an observable of the current locked state of the nav drawer.
Signature:
```typescript
-getIsCollapsed$(): Observable;
+getIsNavDrawerLocked$(): Observable;
```
Returns:
diff --git a/docs/development/core/public/kibana-plugin-core-public.chromestart.md b/docs/development/core/public/kibana-plugin-core-public.chromestart.md
index 7d9d47df544d06..c179e089d7cfd0 100644
--- a/docs/development/core/public/kibana-plugin-core-public.chromestart.md
+++ b/docs/development/core/public/kibana-plugin-core-public.chromestart.md
@@ -56,7 +56,7 @@ core.chrome.setHelpExtension(elem => {
| [getBrand$()](./kibana-plugin-core-public.chromestart.getbrand_.md) | Get an observable of the current brand information. |
| [getBreadcrumbs$()](./kibana-plugin-core-public.chromestart.getbreadcrumbs_.md) | Get an observable of the current list of breadcrumbs |
| [getHelpExtension$()](./kibana-plugin-core-public.chromestart.gethelpextension_.md) | Get an observable of the current custom help conttent |
-| [getIsCollapsed$()](./kibana-plugin-core-public.chromestart.getiscollapsed_.md) | Get an observable of the current collapsed state of the chrome. |
+| [getIsNavDrawerLocked$()](./kibana-plugin-core-public.chromestart.getisnavdrawerlocked_.md) | Get an observable of the current locked state of the nav drawer. |
| [getIsVisible$()](./kibana-plugin-core-public.chromestart.getisvisible_.md) | Get an observable of the current visibility state of the chrome. |
| [removeApplicationClass(className)](./kibana-plugin-core-public.chromestart.removeapplicationclass.md) | Remove a className added with addApplicationClass()
. If className is unknown it is ignored. |
| [setAppTitle(appTitle)](./kibana-plugin-core-public.chromestart.setapptitle.md) | Sets the current app's title |
@@ -65,6 +65,5 @@ core.chrome.setHelpExtension(elem => {
| [setBreadcrumbs(newBreadcrumbs)](./kibana-plugin-core-public.chromestart.setbreadcrumbs.md) | Override the current set of breadcrumbs |
| [setHelpExtension(helpExtension)](./kibana-plugin-core-public.chromestart.sethelpextension.md) | Override the current set of custom help content |
| [setHelpSupportUrl(url)](./kibana-plugin-core-public.chromestart.sethelpsupporturl.md) | Override the default support URL shown in the help menu |
-| [setIsCollapsed(isCollapsed)](./kibana-plugin-core-public.chromestart.setiscollapsed.md) | Set the collapsed state of the chrome navigation. |
| [setIsVisible(isVisible)](./kibana-plugin-core-public.chromestart.setisvisible.md) | Set the temporary visibility for the chrome. This does nothing if the chrome is hidden by default and should be used to hide the chrome for things like full-screen modes with an exit button. |
diff --git a/docs/development/core/public/kibana-plugin-core-public.chromestart.setiscollapsed.md b/docs/development/core/public/kibana-plugin-core-public.chromestart.setiscollapsed.md
deleted file mode 100644
index b1843ef326d961..00000000000000
--- a/docs/development/core/public/kibana-plugin-core-public.chromestart.setiscollapsed.md
+++ /dev/null
@@ -1,24 +0,0 @@
-
-
-[Home](./index.md) > [kibana-plugin-core-public](./kibana-plugin-core-public.md) > [ChromeStart](./kibana-plugin-core-public.chromestart.md) > [setIsCollapsed](./kibana-plugin-core-public.chromestart.setiscollapsed.md)
-
-## ChromeStart.setIsCollapsed() method
-
-Set the collapsed state of the chrome navigation.
-
-Signature:
-
-```typescript
-setIsCollapsed(isCollapsed: boolean): void;
-```
-
-## Parameters
-
-| Parameter | Type | Description |
-| --- | --- | --- |
-| isCollapsed | boolean
| |
-
-Returns:
-
-`void`
-
diff --git a/src/core/public/chrome/chrome_service.mock.ts b/src/core/public/chrome/chrome_service.mock.ts
index bd932c5961eca7..89007461b63e6c 100644
--- a/src/core/public/chrome/chrome_service.mock.ts
+++ b/src/core/public/chrome/chrome_service.mock.ts
@@ -61,8 +61,6 @@ const createStartContractMock = () => {
getBrand$: jest.fn(),
setIsVisible: jest.fn(),
getIsVisible$: jest.fn(),
- setIsCollapsed: jest.fn(),
- getIsCollapsed$: jest.fn(),
addApplicationClass: jest.fn(),
removeApplicationClass: jest.fn(),
getApplicationClasses$: jest.fn(),
@@ -73,15 +71,16 @@ const createStartContractMock = () => {
getHelpExtension$: jest.fn(),
setHelpExtension: jest.fn(),
setHelpSupportUrl: jest.fn(),
+ getIsNavDrawerLocked$: jest.fn(),
};
startContract.navLinks.getAll.mockReturnValue([]);
startContract.getBrand$.mockReturnValue(new BehaviorSubject({} as ChromeBrand));
startContract.getIsVisible$.mockReturnValue(new BehaviorSubject(false));
- startContract.getIsCollapsed$.mockReturnValue(new BehaviorSubject(false));
startContract.getApplicationClasses$.mockReturnValue(new BehaviorSubject(['class-name']));
startContract.getBadge$.mockReturnValue(new BehaviorSubject({} as ChromeBadge));
startContract.getBreadcrumbs$.mockReturnValue(new BehaviorSubject([{} as ChromeBreadcrumb]));
startContract.getHelpExtension$.mockReturnValue(new BehaviorSubject(undefined));
+ startContract.getIsNavDrawerLocked$.mockReturnValue(new BehaviorSubject(false));
return startContract;
};
diff --git a/src/core/public/chrome/chrome_service.test.ts b/src/core/public/chrome/chrome_service.test.ts
index 9018b219736345..bf531aaa00facb 100644
--- a/src/core/public/chrome/chrome_service.test.ts
+++ b/src/core/public/chrome/chrome_service.test.ts
@@ -259,40 +259,6 @@ describe('start', () => {
});
});
- describe('is collapsed', () => {
- it('updates/emits isCollapsed', async () => {
- const { chrome, service } = await start();
- const promise = chrome
- .getIsCollapsed$()
- .pipe(toArray())
- .toPromise();
-
- chrome.setIsCollapsed(true);
- chrome.setIsCollapsed(false);
- chrome.setIsCollapsed(true);
- service.stop();
-
- await expect(promise).resolves.toMatchInlineSnapshot(`
- Array [
- false,
- true,
- false,
- true,
- ]
- `);
- });
-
- it('only stores true in localStorage', async () => {
- const { chrome } = await start();
-
- chrome.setIsCollapsed(true);
- expect(store.size).toBe(1);
-
- chrome.setIsCollapsed(false);
- expect(store.size).toBe(0);
- });
- });
-
describe('application classes', () => {
it('updates/emits the application classes', async () => {
const { chrome, service } = await start();
@@ -442,12 +408,12 @@ describe('start', () => {
});
describe('stop', () => {
- it('completes applicationClass$, isCollapsed$, breadcrumbs$, isVisible$, and brand$ observables', async () => {
+ it('completes applicationClass$, getIsNavDrawerLocked, breadcrumbs$, isVisible$, and brand$ observables', async () => {
const { chrome, service } = await start();
const promise = Rx.combineLatest(
chrome.getBrand$(),
chrome.getApplicationClasses$(),
- chrome.getIsCollapsed$(),
+ chrome.getIsNavDrawerLocked$(),
chrome.getBreadcrumbs$(),
chrome.getIsVisible$(),
chrome.getHelpExtension$()
@@ -465,7 +431,7 @@ describe('stop', () => {
Rx.combineLatest(
chrome.getBrand$(),
chrome.getApplicationClasses$(),
- chrome.getIsCollapsed$(),
+ chrome.getIsNavDrawerLocked$(),
chrome.getBreadcrumbs$(),
chrome.getIsVisible$(),
chrome.getHelpExtension$()
diff --git a/src/core/public/chrome/chrome_service.tsx b/src/core/public/chrome/chrome_service.tsx
index 2b0b115ce068ee..7c9b644b8b9849 100644
--- a/src/core/public/chrome/chrome_service.tsx
+++ b/src/core/public/chrome/chrome_service.tsx
@@ -34,14 +34,14 @@ import { ChromeNavLinks, NavLinksService } from './nav_links';
import { ChromeRecentlyAccessed, RecentlyAccessedService } from './recently_accessed';
import { NavControlsService, ChromeNavControls } from './nav_controls';
import { DocTitleService, ChromeDocTitle } from './doc_title';
-import { LoadingIndicator, HeaderWrapper as Header } from './ui';
+import { LoadingIndicator, Header } from './ui';
import { DocLinksStart } from '../doc_links';
import { ChromeHelpExtensionMenuLink } from './ui/header/header_help_menu';
import { KIBANA_ASK_ELASTIC_LINK } from './constants';
import { IUiSettingsClient } from '../ui_settings';
export { ChromeNavControls, ChromeRecentlyAccessed, ChromeDocTitle };
-const IS_COLLAPSED_KEY = 'core.chrome.isCollapsed';
+const IS_LOCKED_KEY = 'core.chrome.isLocked';
/** @public */
export interface ChromeBadge {
@@ -146,18 +146,25 @@ export class ChromeService {
const appTitle$ = new BehaviorSubject('Kibana');
const brand$ = new BehaviorSubject({});
- const isCollapsed$ = new BehaviorSubject(!!localStorage.getItem(IS_COLLAPSED_KEY));
const applicationClasses$ = new BehaviorSubject>(new Set());
const helpExtension$ = new BehaviorSubject(undefined);
const breadcrumbs$ = new BehaviorSubject([]);
const badge$ = new BehaviorSubject(undefined);
const helpSupportUrl$ = new BehaviorSubject(KIBANA_ASK_ELASTIC_LINK);
+ const isNavDrawerLocked$ = new BehaviorSubject(localStorage.getItem(IS_LOCKED_KEY) === 'true');
const navControls = this.navControls.start();
const navLinks = this.navLinks.start({ application, http });
const recentlyAccessed = await this.recentlyAccessed.start({ http });
const docTitle = this.docTitle.start({ document: window.document });
+ const setIsNavDrawerLocked = (isLocked: boolean) => {
+ isNavDrawerLocked$.next(isLocked);
+ localStorage.setItem(IS_LOCKED_KEY, `${isLocked}`);
+ };
+
+ const getIsNavDrawerLocked$ = isNavDrawerLocked$.pipe(takeUntil(this.stop$));
+
if (!this.params.browserSupportsCsp && injectedMetadata.getCspConfig().warnLegacyBrowsers) {
notifications.toasts.addWarning(
i18n.translate('core.chrome.legacyBrowserWarning', {
@@ -193,6 +200,8 @@ export class ChromeService {
recentlyAccessed$={recentlyAccessed.get$()}
navControlsLeft$={navControls.getLeft$()}
navControlsRight$={navControls.getRight$()}
+ onIsLockedUpdate={setIsNavDrawerLocked}
+ isLocked$={getIsNavDrawerLocked$}
/>
),
@@ -214,17 +223,6 @@ export class ChromeService {
setIsVisible: (isVisible: boolean) => this.toggleHidden$.next(!isVisible),
- getIsCollapsed$: () => isCollapsed$.pipe(takeUntil(this.stop$)),
-
- setIsCollapsed: (isCollapsed: boolean) => {
- isCollapsed$.next(isCollapsed);
- if (isCollapsed) {
- localStorage.setItem(IS_COLLAPSED_KEY, 'true');
- } else {
- localStorage.removeItem(IS_COLLAPSED_KEY);
- }
- },
-
getApplicationClasses$: () =>
applicationClasses$.pipe(
map(set => [...set]),
@@ -262,6 +260,8 @@ export class ChromeService {
},
setHelpSupportUrl: (url: string) => helpSupportUrl$.next(url),
+
+ getIsNavDrawerLocked$: () => getIsNavDrawerLocked$,
};
}
@@ -353,16 +353,6 @@ export interface ChromeStart {
*/
setIsVisible(isVisible: boolean): void;
- /**
- * Get an observable of the current collapsed state of the chrome.
- */
- getIsCollapsed$(): Observable;
-
- /**
- * Set the collapsed state of the chrome navigation.
- */
- setIsCollapsed(isCollapsed: boolean): void;
-
/**
* Get the current set of classNames that will be set on the application container.
*/
@@ -413,6 +403,11 @@ export interface ChromeStart {
* @param url The updated support URL
*/
setHelpSupportUrl(url: string): void;
+
+ /**
+ * Get an observable of the current locked state of the nav drawer.
+ */
+ getIsNavDrawerLocked$(): Observable;
}
/** @internal */
diff --git a/src/core/public/chrome/ui/header/header.tsx b/src/core/public/chrome/ui/header/header.tsx
index c9a583f39b30cb..4dec084fd8a83f 100644
--- a/src/core/public/chrome/ui/header/header.tsx
+++ b/src/core/public/chrome/ui/header/header.tsx
@@ -30,6 +30,7 @@ import {
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React, { Component, createRef } from 'react';
+import classnames from 'classnames';
import * as Rx from 'rxjs';
import {
ChromeBadge,
@@ -68,8 +69,8 @@ export interface HeaderProps {
navControlsLeft$: Rx.Observable;
navControlsRight$: Rx.Observable;
basePath: HttpStart['basePath'];
- isLocked?: boolean;
- onIsLockedUpdate?: OnIsLockedUpdate;
+ isLocked$: Rx.Observable;
+ onIsLockedUpdate: OnIsLockedUpdate;
}
interface State {
@@ -81,6 +82,7 @@ interface State {
navControlsLeft: readonly ChromeNavControl[];
navControlsRight: readonly ChromeNavControl[];
currentAppId: string | undefined;
+ isLocked: boolean;
}
export class Header extends Component {
@@ -99,6 +101,7 @@ export class Header extends Component {
navControlsLeft: [],
navControlsRight: [],
currentAppId: '',
+ isLocked: false,
};
}
@@ -109,11 +112,12 @@ export class Header extends Component {
this.props.forceAppSwitcherNavigation$,
this.props.navLinks$,
this.props.recentlyAccessed$,
- // Types for combineLatest only handle up to 6 inferred types so we combine these two separately.
+ // Types for combineLatest only handle up to 6 inferred types so we combine these separately.
Rx.combineLatest(
this.props.navControlsLeft$,
this.props.navControlsRight$,
- this.props.application.currentAppId$
+ this.props.application.currentAppId$,
+ this.props.isLocked$
)
).subscribe({
next: ([
@@ -122,7 +126,7 @@ export class Header extends Component {
forceNavigation,
navLinks,
recentlyAccessed,
- [navControlsLeft, navControlsRight, currentAppId],
+ [navControlsLeft, navControlsRight, currentAppId, isLocked],
]) => {
this.setState({
appTitle,
@@ -133,6 +137,7 @@ export class Header extends Component {
navControlsLeft,
navControlsRight,
currentAppId,
+ isLocked,
});
},
});
@@ -181,8 +186,16 @@ export class Header extends Component {
return null;
}
+ const className = classnames(
+ 'chrHeaderWrapper',
+ {
+ 'chrHeaderWrapper--navIsLocked': this.state.isLocked,
+ },
+ 'hide-for-sharing'
+ );
+
return (
-
+
@@ -220,7 +233,7 @@ export class Header extends Component {
= props => {
- const initialIsLocked = localStorage.getItem(IS_LOCKED_KEY);
- const [isLocked, setIsLocked] = useState(initialIsLocked === 'true');
- const setIsLockedStored = (locked: boolean) => {
- localStorage.setItem(IS_LOCKED_KEY, `${locked}`);
- setIsLocked(locked);
- };
- const className = classnames(
- 'chrHeaderWrapper',
- {
- 'chrHeaderWrapper--navIsLocked': isLocked,
- },
- 'hide-for-sharing'
- );
- return (
-
-
-
- );
-};
diff --git a/src/core/public/chrome/ui/header/index.ts b/src/core/public/chrome/ui/header/index.ts
index 4521f1f74b31bb..49e002a66d9390 100644
--- a/src/core/public/chrome/ui/header/index.ts
+++ b/src/core/public/chrome/ui/header/index.ts
@@ -18,7 +18,6 @@
*/
export { Header, HeaderProps } from './header';
-export { HeaderWrapper } from './header_wrapper';
export {
ChromeHelpExtensionMenuLink,
ChromeHelpExtensionMenuCustomLink,
diff --git a/src/core/public/chrome/ui/index.ts b/src/core/public/chrome/ui/index.ts
index 81b2fdfb0fcc0e..460e19b7d97801 100644
--- a/src/core/public/chrome/ui/index.ts
+++ b/src/core/public/chrome/ui/index.ts
@@ -20,7 +20,6 @@
export { LoadingIndicator } from './loading_indicator';
export {
Header,
- HeaderWrapper,
ChromeHelpExtensionMenuLink,
ChromeHelpExtensionMenuCustomLink,
ChromeHelpExtensionMenuDiscussLink,
diff --git a/src/core/public/public.api.md b/src/core/public/public.api.md
index fa5dc745e69313..7428280b2dccbb 100644
--- a/src/core/public/public.api.md
+++ b/src/core/public/public.api.md
@@ -337,7 +337,7 @@ export interface ChromeStart {
getBrand$(): Observable;
getBreadcrumbs$(): Observable;
getHelpExtension$(): Observable;
- getIsCollapsed$(): Observable;
+ getIsNavDrawerLocked$(): Observable;
getIsVisible$(): Observable;
navControls: ChromeNavControls;
navLinks: ChromeNavLinks;
@@ -349,7 +349,6 @@ export interface ChromeStart {
setBreadcrumbs(newBreadcrumbs: ChromeBreadcrumb[]): void;
setHelpExtension(helpExtension?: ChromeHelpExtension): void;
setHelpSupportUrl(url: string): void;
- setIsCollapsed(isCollapsed: boolean): void;
setIsVisible(isVisible: boolean): void;
}
diff --git a/src/legacy/ui/public/chrome/chrome.js b/src/legacy/ui/public/chrome/chrome.js
index 3355870eabfe7c..7a75ad906a8704 100644
--- a/src/legacy/ui/public/chrome/chrome.js
+++ b/src/legacy/ui/public/chrome/chrome.js
@@ -28,7 +28,6 @@ import '../private';
import '../promises';
import '../directives/storage';
import '../directives/watch_multi';
-import './services';
import '../react_components';
import '../i18n';
diff --git a/src/legacy/ui/public/chrome/services/global_nav_state.js b/src/legacy/ui/public/chrome/services/global_nav_state.js
deleted file mode 100644
index 5a67806852fe81..00000000000000
--- a/src/legacy/ui/public/chrome/services/global_nav_state.js
+++ /dev/null
@@ -1,45 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import { distinctUntilChanged } from 'rxjs/operators';
-import { npStart } from 'ui/new_platform';
-import { uiModules } from '../../modules';
-
-const newPlatformChrome = npStart.core.chrome;
-
-uiModules.get('kibana').service('globalNavState', $rootScope => {
- let isOpen = false;
- newPlatformChrome
- .getIsCollapsed$()
- .pipe(distinctUntilChanged())
- .subscribe(isCollapsed => {
- $rootScope.$evalAsync(() => {
- isOpen = !isCollapsed;
- $rootScope.$broadcast('globalNavState:change');
- });
- });
-
- return {
- isOpen: () => isOpen,
-
- setOpen: newValue => {
- newPlatformChrome.setIsCollapsed(!newValue);
- },
- };
-});
diff --git a/src/legacy/ui/public/chrome/services/index.js b/src/legacy/ui/public/chrome/services/index.js
deleted file mode 100644
index 3b3967f51b2ffa..00000000000000
--- a/src/legacy/ui/public/chrome/services/index.js
+++ /dev/null
@@ -1,20 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import './global_nav_state';