added point in time table

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

@@ -0,0 +1,17 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { i18n } from '@osd/i18n';
+
+export function getListBreadcrumbs() {
+  return [
+    {
+      text: i18n.translate('pitManagement.listBreadcrumb', {
+        defaultMessage: 'Point in time',
+      }),
+      href: `/`,
+    },
+  ];
+}

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

@@ -3,4 +3,4 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-export { EmptyState } from './empty_state';
+export { PITTableWithRouter } from './pit_table';

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

@@ -0,0 +1,29 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { EuiButton, EuiEmptyPrompt } from '@elastic/eui';
+import { FormattedMessage } from '@osd/i18n/react';
+import React from 'react';
+
+export const EmptyState = () => (
+  <EuiEmptyPrompt
+    body={
+      <p>
+        <FormattedMessage
+          id="pointInTimeManagement.pointInTimeDescription"
+          defaultMessage="No PIT objects have been created."
+        />
+      </p>
+    }
+    actions={
+      <EuiButton iconType="plusInCircle" data-test-subj="createPITBtnInHeader">
+        <FormattedMessage
+          id="pointInTimeManagement.header.createPointInTimeButton"
+          defaultMessage="Create PIT"
+        />
+      </EuiButton>
+    }
+  />
+);

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

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

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

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

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

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

src/plugins/point_in_time_management/public/components/pit_table/page_header/page_header.test.tsx

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

src/plugins/point_in_time_management/public/components/pit_table/page_header/page_header.tsx

@@ -0,0 +1,39 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import {
+  EuiButton,
+  EuiPageContentHeader,
+  EuiPageContentHeaderSection,
+  EuiText,
+  EuiTitle,
+} from '@elastic/eui';
+import { FormattedMessage } from '@osd/i18n/react';
+import React from 'react';
+
+export const PageHeader = () => (
+  <>
+    <EuiPageContentHeader>
+      <EuiPageContentHeaderSection>
+        <EuiTitle>
+          <h1>
+            <FormattedMessage id="pitManagement.header.pitTitle" defaultMessage="Point in Time" />
+          </h1>
+        </EuiTitle>
+      </EuiPageContentHeaderSection>
+      <EuiButton fill={true} iconType="plusInCircle" data-test-subj="createPITBtnInHeader">
+        <FormattedMessage id="pitManagement.header.createPitButton" defaultMessage="Create PIT" />
+      </EuiButton>
+    </EuiPageContentHeader>
+    <EuiText size="s">
+      <p>
+        <FormattedMessage
+          id="pitManagement.pitDescription"
+          defaultMessage="Create and manage point in time objects."
+        />
+      </p>
+    </EuiText>
+  </>
+);