help-center-mappings

config/kibana.yml

@@ -181,3 +181,6 @@
 # Maximum number of documents loaded by each shard to generate autocomplete suggestions.
 # This value must be a whole number greater than zero. Defaults to 100_000
 #unifiedSearch.autocomplete.valueSuggestions.terminateAfter: 100000
+
+# setting needed for POC of help-center
+server.securityResponseHeaders.crossOriginOpenerPolicy: unsafe-none

package.json

@@ -111,6 +111,8 @@
     "@elastic/ems-client": "8.5.1",
     "@elastic/eui": "95.1.0-backport.0",
     "@elastic/filesaver": "1.1.2",
+    "@elastic/help-center-common": "file:../help-center-sdk/packages/common",
+    "@elastic/help-center-host": "file:../help-center-sdk/packages/host",
     "@elastic/node-crypto": "1.2.1",
     "@elastic/numeral": "^2.5.1",
     "@elastic/react-search-ui": "^1.20.2",
@@ -270,6 +272,8 @@
     "@kbn/core-execution-context-server-internal": "link:packages/core/execution-context/core-execution-context-server-internal",
     "@kbn/core-fatal-errors-browser": "link:packages/core/fatal-errors/core-fatal-errors-browser",
     "@kbn/core-fatal-errors-browser-internal": "link:packages/core/fatal-errors/core-fatal-errors-browser-internal",
+    "@kbn/core-help-center-browser": "link:packages/core/help-center/core-help-center-browser",
+    "@kbn/core-help-center-browser-internal": "link:packages/core/help-center/core-help-center-browser-internal",
     "@kbn/core-history-block-plugin": "link:test/plugin_functional/plugins/core_history_block",
     "@kbn/core-http-browser": "link:packages/core/http/core-http-browser",
     "@kbn/core-http-browser-internal": "link:packages/core/http/core-http-browser-internal",

packages/core/chrome/core-chrome-browser-internal/src/ui/project/header.tsx

@@ -37,6 +37,7 @@ import useObservable from 'react-use/lib/useObservable';
 import { debounceTime, Observable } from 'rxjs';
 import type { CustomBranding } from '@kbn/core-custom-branding-common';
 
+import { LocationHelpButton } from '@elastic/help-center-host';
 import { useHeaderActionMenuMounter } from '../header/header_action_menu';
 import { Breadcrumbs } from './breadcrumbs';
 import { HeaderHelpMenu } from '../header/header_help_menu';
@@ -283,6 +284,9 @@ export const ProjectHeader = ({
               <EuiHeaderSectionItem>
                 <HeaderNavControls navControls$={observables.navControlsCenter$} />
               </EuiHeaderSectionItem>
+              <EuiHeaderSectionItem>
+                <LocationHelpButton />
+              </EuiHeaderSectionItem>
 
               <EuiHeaderSectionItem>
                 <HeaderHelpMenu

packages/core/help-center/core-help-center-browser-internal/index.ts

@@ -0,0 +1,9 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+export { HelpCenterService } from './src/help_center_service';

packages/core/help-center/core-help-center-browser-internal/jest.config.js

@@ -0,0 +1,13 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+module.exports = {
+  preset: '@kbn/test',
+  rootDir: '../../../..',
+  roots: ['<rootDir>/packages/core/help-center/core-help-center-browser-internal'],
+};

packages/core/help-center/core-help-center-browser-internal/kibana.jsonc

@@ -0,0 +1,5 @@
+{
+    "type": "shared-common",
+    "id": "@kbn/core-help-center-browser-internal",
+    "owner": "@elastic/appex-sharedux"
+}

packages/core/help-center/core-help-center-browser-internal/package.json

@@ -0,0 +1,6 @@
+{
+    "name": "@kbn/core-help-center-browser-internal",
+    "private": true,
+    "version": "1.0.0",
+    "license": "SSPL-1.0 OR Elastic License 2.0"
+}

packages/core/help-center/core-help-center-browser-internal/src/help_center_service.ts

@@ -0,0 +1,65 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { Subject, BehaviorSubject } from 'rxjs';
+import { shareReplay, takeUntil, map } from 'rxjs';
+import type { HelpCenterSetup, HelpCenterStart } from '@kbn/core-help-center-browser';
+import { HelpTopic } from '@elastic/help-center-common';
+
+export class HelpCenterService {
+  private helpCenterUrl$ = new BehaviorSubject<string | undefined>(undefined);
+  private helpTopics$ = new BehaviorSubject<Record<string, HelpTopic>>({});
+  private version$ = new BehaviorSubject<string | undefined>(undefined);
+  private stop$ = new Subject<void>();
+
+  /**
+   * @public
+   */
+  public setup(): HelpCenterSetup {
+    return {
+      configure: ({ helpCenterUrl, version, helpTopics }) => {
+        this.helpCenterUrl$.next(helpCenterUrl);
+        this.version$.next(version);
+        if (helpTopics && Object.keys(helpTopics).length > 0) {
+          this.helpTopics$.next(helpTopics);
+        }
+      },
+      addHelpTopics: (helpTopics) => {
+        this.helpTopics$.next({ ...this.helpTopics$.value, ...helpTopics });
+      },
+      hasHelpTopics$: this.helpTopics$.pipe(
+        takeUntil(this.stop$),
+        map((cb) => Object.keys(cb).length > 0),
+        shareReplay(1)
+      ),
+    };
+  }
+
+  /**
+   * @public
+   */
+  public start(): HelpCenterStart {
+    if (!this.helpTopics$) {
+      throw new Error('Setup needs to be called before start');
+    }
+    return {
+      hasHelpTopics$: this.helpTopics$.pipe(
+        takeUntil(this.stop$),
+        map((cb) => Object.keys(cb).length > 0),
+        shareReplay(1)
+      ),
+      helpCenterUrl$: this.helpCenterUrl$.pipe(takeUntil(this.stop$), shareReplay(1)),
+      helpTopics$: this.helpTopics$.pipe(takeUntil(this.stop$), shareReplay(1)),
+      version$: this.version$.pipe(takeUntil(this.stop$), shareReplay(1)),
+    };
+  }
+
+  public stop() {
+    this.stop$.next();
+  }
+}

packages/core/help-center/core-help-center-browser-internal/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "extends": "../../../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "target/types",
+    "types": [
+      "jest",
+      "node",
+      "react"
+    ]
+  },
+  "include": [
+    "**/*.ts",
+      "**/*.tsx",
+  ],
+  "exclude": [
+    "target/**/*"
+  ],
+  "kbn_references": []
+}

packages/core/help-center/core-help-center-browser/index.ts

@@ -0,0 +1,8 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+export type { HelpCenterSetup, HelpCenterStart } from './types';

packages/core/help-center/core-help-center-browser/jest.config.js

@@ -0,0 +1,13 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+module.exports = {
+  preset: '@kbn/test/jest_node',
+  rootDir: '../../../..',
+  roots: ['<rootDir>/packages/core/help-center/core-help-center-browser'],
+};

packages/core/help-center/core-help-center-browser/kibana.jsonc

@@ -0,0 +1,5 @@
+{
+  "type": "shared-common",
+  "id": "@kbn/core-help-center-browser",
+  "owner": "@elastic/appex-sharedux"
+}

packages/core/help-center/core-help-center-browser/package.json

@@ -0,0 +1,6 @@
+{
+    "name": "@kbn/core-help-center-browser",
+    "private": true,
+    "version": "1.0.0",
+    "license": "SSPL-1.0 OR Elastic License 2.0"
+}

packages/core/help-center/core-help-center-browser/tsconfig.json

@@ -0,0 +1,17 @@
+{
+    "extends": "../../../../tsconfig.base.json",
+    "compilerOptions": {
+      "outDir": "target/types",
+      "types": [
+        "jest",
+        "node"
+      ]
+    },
+    "include": [
+      "**/*.ts",
+    ],
+    "exclude": [
+      "target/**/*"
+    ],
+    "kbn_references": []
+}

packages/core/help-center/core-help-center-browser/types.ts

@@ -0,0 +1,27 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { Observable } from 'rxjs';
+import { HelpTopic } from '@elastic/help-center-common';
+
+export interface HelpCenterStart {
+  helpTopics$: Observable<Record<string, HelpTopic>>;
+  hasHelpTopics$: Observable<boolean>;
+  version$: Observable<string | undefined>;
+  helpCenterUrl$: Observable<string | undefined>;
+}
+
+export interface HelpCenterSetup {
+  configure: (config: {
+    helpCenterUrl: string;
+    version: string;
+    helpTopics?: Record<string, HelpTopic>;
+  }) => void;
+  addHelpTopics: (helpTopics: Record<string, HelpTopic>) => void;
+  hasHelpTopics$: Observable<boolean>;
+}

packages/core/lifecycle/core-lifecycle-browser/src/core_setup.ts

@@ -18,6 +18,7 @@ import type { CustomBrandingSetup } from '@kbn/core-custom-branding-browser';
 import type { PluginsServiceSetup } from '@kbn/core-plugins-contracts-browser';
 import type { SecurityServiceSetup } from '@kbn/core-security-browser';
 import type { UserProfileServiceSetup } from '@kbn/core-user-profile-browser';
+import type { HelpCenterSetup } from '@kbn/core-help-center-browser';
 import type { CoreStart } from './core_start';
 
 /**
@@ -43,6 +44,8 @@ export interface CoreSetup<TPluginsStart extends object = object, TStart = unkno
   customBranding: CustomBrandingSetup;
   /** {@link FatalErrorsSetup} */
   fatalErrors: FatalErrorsSetup;
+  /** {@link HelpCenterSetup} */
+  helpCenter: HelpCenterSetup;
   /** {@link HttpSetup} */
   http: HttpSetup;
   /** {@link NotificationsSetup} */

packages/core/lifecycle/core-lifecycle-browser/src/core_start.ts

@@ -24,6 +24,7 @@ import type { CustomBrandingStart } from '@kbn/core-custom-branding-browser';
 import type { PluginsServiceStart } from '@kbn/core-plugins-contracts-browser';
 import type { SecurityServiceStart } from '@kbn/core-security-browser';
 import type { UserProfileServiceStart } from '@kbn/core-user-profile-browser';
+import { HelpCenterStart } from '@kbn/core-help-center-browser';
 
 /**
  * Core services exposed to the `Plugin` start lifecycle
@@ -47,6 +48,8 @@ export interface CoreStart {
   docLinks: DocLinksStart;
   /** {@link ExecutionContextStart} */
   executionContext: ExecutionContextStart;
+  /** {@link HelpCenterStart} */
+  helpCenter: HelpCenterStart;
   /** {@link HttpStart} */
   http: HttpStart;
   /**

packages/core/plugins/core-plugins-browser-internal/src/plugin_context.ts

@@ -82,6 +82,7 @@ export function createPluginSetupContext<
     customBranding: deps.customBranding,
     fatalErrors: deps.fatalErrors,
     executionContext: deps.executionContext,
+    helpCenter: deps.helpCenter,
     http: {
       ...deps.http,
       staticAssets: {
@@ -146,6 +147,7 @@ export function createPluginStartContext<
     customBranding: deps.customBranding,
     docLinks: deps.docLinks,
     executionContext: deps.executionContext,
+    helpCenter: deps.helpCenter,
     http: {
       ...deps.http,
       staticAssets: {

packages/core/rendering/core-rendering-browser-internal/src/app_containers.tsx

@@ -11,6 +11,8 @@ import { Observable } from 'rxjs';
 import useObservable from 'react-use/lib/useObservable';
 import classNames from 'classnames';
 import { APP_WRAPPER_CLASS } from '@kbn/core-application-common';
+import { HelpTopic } from '@elastic/help-center-common';
+import { HostContextProvider, GuidePopover } from '@elastic/help-center-host';
 
 export const AppWrapper: FC<
   PropsWithChildren<{
@@ -27,3 +29,26 @@ export const AppWrapper: FC<
     </div>
   );
 };
+
+export const HelpCenterWrapper: FC<
+  PropsWithChildren<{
+    helpTopics$: Observable<Record<string, HelpTopic>>;
+    helpCenterUrl$: Observable<string | undefined>;
+    version$: Observable<string | undefined>;
+  }>
+> = ({ helpTopics$, version$, helpCenterUrl$, children }) => {
+  const helpTopics = useObservable(helpTopics$);
+  const version = useObservable(version$);
+  const helpCenterUrl = useObservable(helpCenterUrl$);
+
+  if (!helpTopics || !version || !helpCenterUrl) {
+    return <>{children}</>;
+  }
+
+  return (
+    <HostContextProvider {...{ helpCenterUrl, helpTopics, version }}>
+      {children}
+      <GuidePopover />
+    </HostContextProvider>
+  );
+};

packages/core/rendering/core-rendering-browser-internal/src/rendering_service.tsx

@@ -17,10 +17,12 @@ import type { I18nStart } from '@kbn/core-i18n-browser';
 import type { OverlayStart } from '@kbn/core-overlays-browser';
 import type { ThemeServiceStart } from '@kbn/core-theme-browser';
 import { KibanaRootContextProvider } from '@kbn/react-kibana-context-root';
-import { AppWrapper } from './app_containers';
+import { HelpCenterStart } from '@kbn/core-help-center-browser';
+import { AppWrapper, HelpCenterWrapper } from './app_containers';
 
 interface StartServices {
   analytics: AnalyticsServiceStart;
+  helpCenter: HelpCenterStart;
   i18n: I18nStart;
   theme: ThemeServiceStart;
 }
@@ -41,7 +43,14 @@ export interface StartDeps extends StartServices {
  * @internal
  */
 export class RenderingService {
-  start({ application, chrome, overlays, targetDomElement, ...startServices }: StartDeps) {
+  start({
+    application,
+    chrome,
+    overlays,
+    targetDomElement,
+    helpCenter,
+    ...startServices
+  }: StartDeps) {
     const chromeHeader = chrome.getHeaderComponent();
     const appComponent = application.getComponent();
     const bannerComponent = overlays.banners.getComponent();
@@ -54,10 +63,11 @@ export class RenderingService {
         body.classList.remove(...previousClasses);
         body.classList.add(...newClasses);
       });
+    const { helpCenterUrl$, helpTopics$, version$ } = helpCenter;
 
     ReactDOM.render(
       <KibanaRootContextProvider {...startServices} globalStyles={true}>
-        <>
+        <HelpCenterWrapper {...{ helpCenterUrl$, helpTopics$, version$ }}>
           {/* Fixed headers */}
           {chromeHeader}
 
@@ -72,7 +82,7 @@ export class RenderingService {
             {/* The actual plugin/app */}
             {appComponent}
           </AppWrapper>
-        </>
+        </HelpCenterWrapper>
       </KibanaRootContextProvider>,
       targetDomElement
     );