Point in time management plugin and empty state

CHANGELOG.md

@@ -46,6 +46,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 - [Vis Builder] Add field summary popovers ([#2682](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2682))
 - [I18n] Register ru, ru-RU locale ([#2817](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2817))
 - Add yarn opensearch arg to setup plugin dependencies ([#2544](https://github.com/opensearch-project/OpenSearch-Dashboards/issues/2544))
+- [Point in TIme] Add management plugin shell and empty state ([#2813](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2813))
 
 ### 🐛 Bug Fixes
 

src/dev/build/tasks/os_packages/docker_generator/resources/bin/opensearch-dashboards-docker

@@ -160,6 +160,7 @@ opensearch_dashboards_vars=(
     data_source.audit.appender.layout.kind
     data_source.audit.appender.layout.highlight
     data_source.audit.appender.layout.pattern
+    pit.enabled
 )
 
 longopts=''

src/plugins/point_in_time_management/opensearch_dashboards.json

@@ -0,0 +1,10 @@
+{
+  "id": "pit",
+  "version": "1.0.0",
+  "opensearchDashboardsVersion": "opensearchDashboards",
+  "server": true,
+  "ui": true,
+  "requiredPlugins": ["navigation", "management"],
+  "optionalPlugins": [],
+  "requiredBundles": ["opensearchDashboardsReact"]
+}

src/plugins/point_in_time_management/public/components/empty_state/empty_state.test.tsx

@@ -0,0 +1,16 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { EmptyState } from './empty_state';
+import { shallow } from 'enzyme';
+
+describe('EmptyState', () => {
+  it('should render normally', () => {
+    const component = shallow(<EmptyState />);
+
+    expect(component).toMatchSnapshot();
+  });
+});

src/plugins/point_in_time_management/public/components/empty_state/empty_state.tsx

@@ -0,0 +1,78 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { FormattedMessage } from '@osd/i18n/react';
+import {
+  EuiPageContentHeader,
+  EuiPageContentHeaderSection,
+  EuiTitle,
+  EuiPageContent,
+  EuiSpacer,
+  EuiText,
+  EuiPageContentBody,
+  EuiFlexItem,
+  EuiFlexGroup,
+  EuiButton,
+} from '@elastic/eui';
+
+export const EmptyState = () => {
+  return (
+    <>
+      <EuiPageContent
+        className="pitEmptyState"
+        grow={false}
+        style={{ minHeight: '70vh' }}
+        horizontalPosition="center"
+        data-test-subj="pointInTimeEmptyState"
+      >
+        <EuiPageContentHeader>
+          <EuiPageContentHeaderSection>
+            <EuiTitle>
+              <h1>
+                <FormattedMessage
+                  id="pointInTimeManagement.header.pointInTimeTitle"
+                  defaultMessage="Point in Time"
+                />
+              </h1>
+            </EuiTitle>
+          </EuiPageContentHeaderSection>
+          <EuiButton fill={true} iconType="plusInCircle" data-test-subj="createPITBtnInHeader">
+            <FormattedMessage
+              id="pointInTimeManagement.header.createPointInTimeButton"
+              defaultMessage="Create point in time"
+            />
+          </EuiButton>
+        </EuiPageContentHeader>
+        <EuiText size="s">
+          <p>
+            <FormattedMessage
+              id="pointInTimeManagement.pointInTimeDescription"
+              defaultMessage="Create and manage point in time objects to help you retrieve data from OpenSearch."
+            />
+          </p>
+        </EuiText>
+        <EuiSpacer size="m" />
+        <EuiPageContentBody>
+          <EuiFlexGroup
+            style={{ minHeight: '50vh' }}
+            alignItems="center"
+            justifyContent="center"
+            direction="column"
+          >
+            <EuiFlexItem grow={false}>No point in time objects have been created yet.</EuiFlexItem>
+            <EuiSpacer />
+            <EuiButton data-test-subj="createPITBtnInBody">
+              <FormattedMessage
+                id="pointInTimeManagement.createPointInTimeButton"
+                defaultMessage="Create point in time"
+              />
+            </EuiButton>
+          </EuiFlexGroup>
+        </EuiPageContentBody>
+      </EuiPageContent>
+    </>
+  );
+};

src/plugins/point_in_time_management/public/components/empty_state/index.ts

@@ -0,0 +1,6 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export { EmptyState } from './empty_state';

src/plugins/point_in_time_management/public/components/index.ts

@@ -0,0 +1,6 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export { EmptyState } from './empty_state';

src/plugins/point_in_time_management/public/index.ts

@@ -0,0 +1,12 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { PointInTimeManagementPlugin } from './plugin';
+
+export function plugin() {
+  return new PointInTimeManagementPlugin();
+}
+
+export { PointInTimeManagementPluginSetup, PointInTimeManagementPluginStart } from './types';

src/plugins/point_in_time_management/public/management_app/index.ts

@@ -0,0 +1,6 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export { mountManagementSection } from './mount_management_section';

src/plugins/point_in_time_management/public/management_app/mount_management_section.tsx

@@ -0,0 +1,38 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { I18nProvider } from '@osd/i18n/react';
+import { ManagementAppMountParams } from '../../../management/public';
+import { PointInTimeManagementStartDependencies } from '../plugin';
+import { StartServicesAccessor } from '../../../../core/public';
+import { PointInTimeManagementContext } from '../types';
+import { OpenSearchDashboardsContextProvider } from '../../../opensearch_dashboards_react/public';
+import { EmptyState } from '../components';
+
+export async function mountManagementSection(
+  getStartServices: StartServicesAccessor<PointInTimeManagementStartDependencies>,
+  params: ManagementAppMountParams
+) {
+  const [{ chrome, application }] = await getStartServices();
+  const deps: PointInTimeManagementContext = {
+    chrome,
+    application,
+  };
+  ReactDOM.render(
+    <OpenSearchDashboardsContextProvider services={deps}>
+      <I18nProvider>
+        <EmptyState />
+      </I18nProvider>
+    </OpenSearchDashboardsContextProvider>,
+    params.element
+  );
+
+  return () => {
+    chrome.docTitle.reset();
+    ReactDOM.unmountComponentAtNode(params.element);
+  };
+}

src/plugins/point_in_time_management/public/plugin.ts

@@ -0,0 +1,60 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { i18n } from '@osd/i18n';
+import { CoreSetup, CoreStart, Plugin } from '../../../core/public';
+import { PointInTimeManagementPluginSetup, PointInTimeManagementPluginStart } from './types';
+import { ManagementSetup } from '../../management/public';
+
+export interface PointInTimeManagementSetupDependencies {
+  management: ManagementSetup;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface PointInTimeManagementStartDependencies {}
+
+const sectionsHeader = i18n.translate('pointInTimeManagement.pointInTime.sectionsHeader', {
+  defaultMessage: 'Point In Time',
+});
+
+const PITM_APP_ID = 'pointInTime';
+
+export class PointInTimeManagementPlugin
+  implements
+    Plugin<
+      PointInTimeManagementPluginSetup,
+      PointInTimeManagementPluginStart,
+      PointInTimeManagementSetupDependencies,
+      PointInTimeManagementStartDependencies
+    > {
+  public setup(
+    core: CoreSetup<PointInTimeManagementStartDependencies, PointInTimeManagementPluginStart>,
+    { management }: PointInTimeManagementSetupDependencies
+  ): PointInTimeManagementPluginSetup {
+    const opensearchDashboardsSection = management.sections.section.opensearchDashboards;
+
+    if (!opensearchDashboardsSection) {
+      throw new Error('`opensearchDashboards` management section not found.');
+    }
+
+    opensearchDashboardsSection.registerApp({
+      id: PITM_APP_ID,
+      title: sectionsHeader,
+      order: 1,
+      mount: async (mountParams) => {
+        const { mountManagementSection } = await import('./management_app');
+        return mountManagementSection(core.getStartServices, mountParams);
+      },
+    });
+
+    return {};
+  }
+
+  public start(core: CoreStart): PointInTimeManagementPluginStart {
+    return {};
+  }
+
+  public stop() {}
+}

src/plugins/point_in_time_management/public/types.ts

@@ -0,0 +1,27 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { ApplicationStart, ChromeStart } from 'opensearch-dashboards/public';
+import { NavigationPublicPluginStart } from '../../navigation/public';
+import { ManagementSetup } from '../../management/public';
+
+export interface PointInTimeManagementContext {
+  chrome: ChromeStart;
+  application: ApplicationStart;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface PointInTimeManagementPluginSetup {}
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface PointInTimeManagementPluginStart {}
+
+export interface AppPluginStartDependencies {
+  navigation: NavigationPublicPluginStart;
+}
+
+export interface SetupDependencies {
+  management: ManagementSetup;
+}

src/plugins/point_in_time_management/server/index.ts

@@ -0,0 +1,21 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { schema } from '@osd/config-schema';
+import { PluginInitializerContext } from '../../../core/server';
+import { PointInTimeManagementPlugin } from './plugin';
+
+export const config = {
+  schema: schema.object({ enabled: schema.boolean({ defaultValue: false }) }),
+};
+
+// This exports static code and TypeScript types,
+// as well as the OpenSearch Dashboards Platform `plugin()` initializer.
+
+export function plugin(initializerContext: PluginInitializerContext) {
+  return new PointInTimeManagementPlugin(initializerContext);
+}
+
+export { PointInTimeManagementPluginSetup, PointInTimeManagementPluginStart } from './types';