[Data/Search Sessions] Management UI

src/plugins/data/public/search/session/sessions_client.ts

@@ -67,8 +67,8 @@ export class SessionsClient {
     });
   }
 
-  public find(options: SavedObjectsFindOptions): Promise<SavedObjectsFindResponse> {
-    return this.http!.post(`/internal/session`, {
+  public find(options: Omit<SavedObjectsFindOptions, 'type'>): Promise<SavedObjectsFindResponse> {
+    return this.http!.post(`/internal/session/_find`, {
       body: JSON.stringify(options),
     });
   }

x-pack/plugins/data_enhanced/common/index.ts

@@ -12,6 +12,7 @@ export {
   EqlSearchStrategyResponse,
   IAsyncSearchOptions,
   pollSearch,
+  SearchSessionSavedObject,
   SearchSessionSavedObjectAttributes,
   SearchSessionStatus,
   SearchSessionRequestInfo,

x-pack/plugins/data_enhanced/common/search/session/types.ts

@@ -4,6 +4,8 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { SearchSessionStatus } from './';
+
 export interface SearchSessionSavedObjectAttributes {
   /**
    * User-facing session name to be displayed in session management
@@ -24,7 +26,7 @@ export interface SearchSessionSavedObjectAttributes {
   /**
    * status
    */
-  status: string;
+  status: SearchSessionStatus;
   /**
    * urlGeneratorId
    */
@@ -45,6 +47,10 @@ export interface SearchSessionSavedObjectAttributes {
   idMapping: Record<string, SearchSessionRequestInfo>;
 }
 
+export interface SearchSessionSavedObject {
+  id: string;
+  attributes: SearchSessionSavedObjectAttributes;
+}
 export interface SearchSessionRequestInfo {
   /**
    * ID of the async search request

x-pack/plugins/data_enhanced/common/search/sessions_mgmt/constants.ts

@@ -0,0 +1,17 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { SearchSessionStatus } from '../';
+
+export enum ACTION {
+  EXTEND = 'extend',
+  CANCEL = 'cancel',
+  DELETE = 'delete',
+}
+
+export const DATE_STRING_FORMAT = 'D MMM, YYYY, HH:mm:ss';
+
+export { SearchSessionStatus as STATUS };

x-pack/plugins/data_enhanced/common/search/sessions_mgmt/index.ts

@@ -0,0 +1,23 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { ACTION, STATUS } from './constants';
+
+export interface UISession {
+  id: string;
+  name: string;
+  appId: string;
+  created: string;
+  expires: string | null;
+  status: STATUS;
+  actions?: ACTION[];
+  isRestorable: boolean;
+  url: string;
+}
+
+export type ActionComplete = (result: UISession[]) => void;
+
+export * from './constants';

x-pack/plugins/data_enhanced/config.ts

@@ -10,6 +10,12 @@ export const configSchema = schema.object({
   search: schema.object({
     sendToBackground: schema.object({
       enabled: schema.boolean({ defaultValue: false }),
+      sessionsManagement: schema.object({
+        maxSessions: schema.number({ defaultValue: 10000 }),
+        refreshInterval: schema.duration({ defaultValue: '10s' }),
+        refreshTimeout: schema.duration({ defaultValue: '1m' }),
+        expiresSoonWarning: schema.duration({ defaultValue: '1d' }),
+      }),
     }),
   }),
 });

x-pack/plugins/data_enhanced/kibana.json

@@ -2,15 +2,8 @@
   "id": "dataEnhanced",
   "version": "8.0.0",
   "kibanaVersion": "kibana",
-  "configPath": [
-    "xpack", "data_enhanced"
-  ],
-  "requiredPlugins": [
-    "bfetch",
-    "data",
-    "features",
-    "taskManager"
-  ],
+  "configPath": ["xpack", "data_enhanced"],
+  "requiredPlugins": ["bfetch", "data", "features", "management", "share", "taskManager"],
   "optionalPlugins": ["kibanaUtils", "usageCollection"],
   "server": true,
   "ui": true,

x-pack/plugins/data_enhanced/public/plugin.ts

@@ -8,20 +8,25 @@ import React from 'react';
 import { CoreSetup, CoreStart, Plugin, PluginInitializerContext } from 'src/core/public';
 import { DataPublicPluginSetup, DataPublicPluginStart } from '../../../../src/plugins/data/public';
 import { BfetchPublicSetup } from '../../../../src/plugins/bfetch/public';
+import { ManagementSetup } from '../../../../src/plugins/management/public';
+import { SharePluginStart } from '../../../../src/plugins/share/public';
 
 import { setAutocompleteService } from './services';
 import { setupKqlQuerySuggestionProvider, KUERY_LANGUAGE_NAME } from './autocomplete';
 import { EnhancedSearchInterceptor } from './search/search_interceptor';
+import { registerSearchSessionsMgmt } from './search/sessions_mgmt';
 import { toMountPoint } from '../../../../src/plugins/kibana_react/public';
 import { createConnectedSearchSessionIndicator } from './search';
 import { ConfigSchema } from '../config';
 
 export interface DataEnhancedSetupDependencies {
   bfetch: BfetchPublicSetup;
   data: DataPublicPluginSetup;
+  management: ManagementSetup;
 }
 export interface DataEnhancedStartDependencies {
   data: DataPublicPluginStart;
+  share: SharePluginStart;
 }
 
 export type DataEnhancedSetup = ReturnType<DataEnhancedPlugin['setup']>;
@@ -30,12 +35,13 @@ export type DataEnhancedStart = ReturnType<DataEnhancedPlugin['start']>;
 export class DataEnhancedPlugin
   implements Plugin<void, void, DataEnhancedSetupDependencies, DataEnhancedStartDependencies> {
   private enhancedSearchInterceptor!: EnhancedSearchInterceptor;
+  private config!: ConfigSchema;
 
   constructor(private initializerContext: PluginInitializerContext<ConfigSchema>) {}
 
   public setup(
     core: CoreSetup<DataEnhancedStartDependencies>,
-    { bfetch, data }: DataEnhancedSetupDependencies
+    { bfetch, data, management }: DataEnhancedSetupDependencies
   ) {
     data.autocomplete.addQuerySuggestionProvider(
       KUERY_LANGUAGE_NAME,
@@ -57,12 +63,18 @@ export class DataEnhancedPlugin
         searchInterceptor: this.enhancedSearchInterceptor,
       },
     });
+
+    this.config = this.initializerContext.config.get<ConfigSchema>();
+    if (this.config.search.sendToBackground.enabled) {
+      const { sessionsManagement: sessionsMgmtConfig } = this.config.search.sendToBackground;
+      registerSearchSessionsMgmt(core, sessionsMgmtConfig, { management });
+    }
   }
 
   public start(core: CoreStart, plugins: DataEnhancedStartDependencies) {
     setAutocompleteService(plugins.data.autocomplete);
 
-    if (this.initializerContext.config.get().search.sendToBackground.enabled) {
+    if (this.config.search.sendToBackground.enabled) {
       core.chrome.setBreadcrumbsAppendExtension({
         content: toMountPoint(
           React.createElement(

x-pack/plugins/data_enhanced/public/search/sessions_mgmt/__mocks__/index.tsx

@@ -0,0 +1,18 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { ReactNode } from 'react';
+import { IntlProvider } from 'react-intl';
+// eslint-disable-next-line @kbn/eslint/no-restricted-paths
+import { UrlGeneratorsStart } from '../../../../../../../src/plugins/share/public/url_generators';
+
+export function LocaleWrapper({ children }: { children?: ReactNode }) {
+  return <IntlProvider locale="en">{children}</IntlProvider>;
+}
+
+export const mockUrls = ({
+  getUrlGenerator: (id: string) => ({ createUrl: () => `hello-cool-${id}-url` }),
+} as unknown) as UrlGeneratorsStart;

x-pack/plugins/data_enhanced/public/search/sessions_mgmt/application/index.tsx

@@ -0,0 +1,78 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { CoreSetup } from 'kibana/public';
+import type { ManagementAppMountParams } from 'src/plugins/management/public';
+import type {
+  AppDependencies,
+  IManagementSectionsPluginsSetup,
+  IManagementSectionsPluginsStart,
+  SessionsMgmtConfigSchema,
+} from '../';
+import { APP } from '../';
+import { SearchSessionsMgmtAPI } from '../lib/api';
+import { AsyncSearchIntroDocumentation } from '../lib/documentation';
+import { renderApp } from './render';
+
+export class SearchSessionsMgmtApp {
+  constructor(
+    private coreSetup: CoreSetup<IManagementSectionsPluginsStart>,
+    private config: SessionsMgmtConfigSchema,
+    private params: ManagementAppMountParams,
+    private pluginsSetup: IManagementSectionsPluginsSetup
+  ) {}
+
+  public async mountManagementSection() {
+    const { coreSetup, params, pluginsSetup } = this;
+    const [coreStart, pluginsStart] = await coreSetup.getStartServices();
+
+    const {
+      chrome: { docTitle },
+      http,
+      docLinks,
+      i18n,
+      notifications,
+      uiSettings,
+    } = coreStart;
+    const { data, share } = pluginsStart;
+
+    const pluginName = APP.getI18nName();
+    docTitle.change(pluginName);
+    params.setBreadcrumbs([{ text: pluginName }]);
+
+    const { sessionsClient } = data.search;
+    const api = new SearchSessionsMgmtAPI(
+      sessionsClient,
+      share.urlGenerators,
+      notifications,
+      this.config
+    );
+
+    const documentation = new AsyncSearchIntroDocumentation(docLinks);
+
+    const dependencies: AppDependencies = {
+      plugins: pluginsSetup,
+      config: this.config,
+      documentation,
+      core: coreStart,
+      api,
+      http,
+      i18n,
+      uiSettings,
+      share,
+    };
+
+    const { element } = params;
+    const unmountAppCb = renderApp(element, dependencies);
+
+    return () => {
+      docTitle.reset();
+      unmountAppCb();
+    };
+  }
+}
+
+export { renderApp };

x-pack/plugins/data_enhanced/public/search/sessions_mgmt/application/render.tsx

@@ -0,0 +1,39 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React from 'react';
+import { render, unmountComponentAtNode } from 'react-dom';
+import { AppDependencies } from '../';
+import { createKibanaReactContext } from '../../../../../../../src/plugins/kibana_react/public';
+import { SearchSessionsMgmtMain } from '../components/main';
+
+export const renderApp = (
+  elem: HTMLElement | null,
+  { i18n, uiSettings, ...homeDeps }: AppDependencies
+) => {
+  if (!elem) {
+    return () => undefined;
+  }
+
+  const { Context: I18nContext } = i18n;
+  // uiSettings is required by the listing table to format dates in the timezone from Settings
+  const { Provider: KibanaReactContextProvider } = createKibanaReactContext({
+    uiSettings,
+  });
+
+  render(
+    <I18nContext>
+      <KibanaReactContextProvider>
+        <SearchSessionsMgmtMain {...homeDeps} timezone={uiSettings.get('dateFormat:tz')} />
+      </KibanaReactContextProvider>
+    </I18nContext>,
+    elem
+  );
+
+  return () => {
+    unmountComponentAtNode(elem);
+  };
+};

x-pack/plugins/data_enhanced/public/search/sessions_mgmt/components/actions/get_action.tsx

@@ -0,0 +1,55 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { i18n } from '@kbn/i18n';
+import React from 'react';
+import { IClickActionDescriptor } from '../';
+import { ACTION, ActionComplete, UISession } from '../../../../../common/search/sessions_mgmt';
+import extendSessionIcon from '../../icons/extend_session.svg';
+import { SearchSessionsMgmtAPI } from '../../lib/api';
+import { DeleteButton } from '../delete_button';
+
+export const getAction = (
+  api: SearchSessionsMgmtAPI,
+  actionType: string,
+  { id }: UISession,
+  actionComplete: ActionComplete
+): IClickActionDescriptor | null => {
+  switch (actionType) {
+    case ACTION.CANCEL:
+      return {
+        iconType: 'crossInACircleFilled',
+        textColor: 'default',
+        label: i18n.translate('xpack.data.mgmt.searchSessions.actionCancel', {
+          defaultMessage: 'Cancel',
+        }),
+      };
+
+    case ACTION.DELETE:
+      return {
+        iconType: 'trash',
+        textColor: 'danger',
+        label: <DeleteButton api={api} id={id} actionComplete={actionComplete} />,
+      };
+
+    case ACTION.EXTEND:
+      return {
+        iconType: extendSessionIcon,
+        textColor: 'default',
+        label: i18n.translate('xpack.data.mgmt.searchSessions.actionExtend', {
+          defaultMessage: 'Extend',
+        }),
+      };
+
+    default:
+      // eslint-disable-next-line no-console
+      console.error(`Unknown action: ${actionType}`);
+  }
+
+  // Unknown action: do not show
+
+  return null;
+};

x-pack/plugins/data_enhanced/public/search/sessions_mgmt/components/actions/index.tsx

@@ -0,0 +1,7 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+export { PopoverActionsMenu } from './popover_actions';