diff --git a/public/components/DeleteModal/DeleteModal.test.tsx b/public/components/DeleteModal/DeleteModal.test.tsx
new file mode 100644
index 000000000..4a187ea45
--- /dev/null
+++ b/public/components/DeleteModal/DeleteModal.test.tsx
@@ -0,0 +1,22 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import DeleteModal from './DeleteModal';
+
+describe('<DeleteModal /> spec', () => {
+  it('renders the component', () => {
+    const tree = render(
+      <DeleteModal
+        closeDeleteModal={() => jest.fn()}
+        ids={'some ids'}
+        onClickDelete={() => jest.fn()}
+        type={'some type'}
+      />
+    );
+    expect(tree).toMatchSnapshot();
+  });
+});
diff --git a/public/components/DeleteModal/__snapshots__/DeleteModal.test.tsx.snap b/public/components/DeleteModal/__snapshots__/DeleteModal.test.tsx.snap
new file mode 100644
index 000000000..b53356b0f
--- /dev/null
+++ b/public/components/DeleteModal/__snapshots__/DeleteModal.test.tsx.snap
@@ -0,0 +1,184 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<DeleteModal /> spec renders the component 1`] = `
+Object {
+  "asFragment": [Function],
+  "baseElement": <body
+    class="euiBody-hasOverlayMask"
+  >
+    <div
+      aria-hidden="true"
+      data-aria-hidden="true"
+    />
+    <div
+      aria-hidden="true"
+      class="euiOverlayMask euiOverlayMask--aboveHeader"
+      data-aria-hidden="true"
+    />
+    <div
+      class="euiOverlayMask euiOverlayMask--aboveHeader"
+    >
+      <div
+        aria-hidden="true"
+        data-aria-hidden="true"
+        data-focus-guard="true"
+        style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+        tabindex="0"
+      />
+      <div
+        data-focus-lock-disabled="false"
+      >
+        <div
+          class="euiModal euiModal--maxWidth-default euiModal--confirmation"
+          tabindex="0"
+        >
+          <button
+            aria-label="Closes this modal window"
+            class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon"
+            type="button"
+          >
+            EuiIconMock
+          </button>
+          <div
+            class="euiModal__flex"
+          >
+            <div
+              class="euiModalHeader"
+            >
+              <div
+                class="euiModalHeader__title"
+                data-test-subj="confirmModalTitleText"
+              >
+                Delete some type
+              </div>
+            </div>
+            <div
+              class="euiModalBody"
+            >
+              <div
+                class="euiModalBody__overflow"
+              >
+                <div
+                  class="euiText euiText--medium"
+                  data-test-subj="confirmModalBodyText"
+                >
+                  <div
+                    class="euiForm"
+                  >
+                    <p>
+                      Delete "
+                      <strong>
+                        some ids
+                      </strong>
+                      " permanently? 
+                    </p>
+                    <div
+                      class="euiSpacer euiSpacer--s"
+                    />
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              class="euiModalFooter"
+            >
+              <button
+                class="euiButtonEmpty euiButtonEmpty--primary"
+                data-test-subj="confirmModalCancelButton"
+                type="button"
+              >
+                <span
+                  class="euiButtonContent euiButtonEmpty__content"
+                >
+                  <span
+                    class="euiButtonEmpty__text"
+                  >
+                    Cancel
+                  </span>
+                </span>
+              </button>
+              <button
+                class="euiButton euiButton--danger euiButton--fill"
+                data-test-subj="confirmModalConfirmButton"
+                type="button"
+              >
+                <span
+                  class="euiButtonContent euiButton__content"
+                >
+                  <span
+                    class="euiButton__text"
+                  >
+                    Delete some type
+                  </span>
+                </span>
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        aria-hidden="true"
+        data-aria-hidden="true"
+        data-focus-guard="true"
+        style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+        tabindex="0"
+      />
+    </div>
+  </body>,
+  "container": <div
+    aria-hidden="true"
+    data-aria-hidden="true"
+  />,
+  "debug": [Function],
+  "findAllByAltText": [Function],
+  "findAllByDisplayValue": [Function],
+  "findAllByLabelText": [Function],
+  "findAllByPlaceholderText": [Function],
+  "findAllByRole": [Function],
+  "findAllByTestId": [Function],
+  "findAllByText": [Function],
+  "findAllByTitle": [Function],
+  "findByAltText": [Function],
+  "findByDisplayValue": [Function],
+  "findByLabelText": [Function],
+  "findByPlaceholderText": [Function],
+  "findByRole": [Function],
+  "findByTestId": [Function],
+  "findByText": [Function],
+  "findByTitle": [Function],
+  "getAllByAltText": [Function],
+  "getAllByDisplayValue": [Function],
+  "getAllByLabelText": [Function],
+  "getAllByPlaceholderText": [Function],
+  "getAllByRole": [Function],
+  "getAllByTestId": [Function],
+  "getAllByText": [Function],
+  "getAllByTitle": [Function],
+  "getByAltText": [Function],
+  "getByDisplayValue": [Function],
+  "getByLabelText": [Function],
+  "getByPlaceholderText": [Function],
+  "getByRole": [Function],
+  "getByTestId": [Function],
+  "getByText": [Function],
+  "getByTitle": [Function],
+  "queryAllByAltText": [Function],
+  "queryAllByDisplayValue": [Function],
+  "queryAllByLabelText": [Function],
+  "queryAllByPlaceholderText": [Function],
+  "queryAllByRole": [Function],
+  "queryAllByTestId": [Function],
+  "queryAllByText": [Function],
+  "queryAllByTitle": [Function],
+  "queryByAltText": [Function],
+  "queryByDisplayValue": [Function],
+  "queryByLabelText": [Function],
+  "queryByPlaceholderText": [Function],
+  "queryByRole": [Function],
+  "queryByTestId": [Function],
+  "queryByText": [Function],
+  "queryByTitle": [Function],
+  "rerender": [Function],
+  "unmount": [Function],
+}
+`;
diff --git a/public/components/FormFieldHeader/FormFieldHeader.test.tsx b/public/components/FormFieldHeader/FormFieldHeader.test.tsx
new file mode 100644
index 000000000..a696d8830
--- /dev/null
+++ b/public/components/FormFieldHeader/FormFieldHeader.test.tsx
@@ -0,0 +1,15 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import { FormFieldHeader } from './FormFieldHeader';
+
+describe('<FormFieldHeader /> spec', () => {
+  it('renders the component', () => {
+    const tree = render(<FormFieldHeader headerTitle={'some title'} />);
+    expect(tree).toMatchSnapshot();
+  });
+});
diff --git a/public/components/FormFieldHeader/__snapshots__/FormFieldHeader.test.tsx.snap b/public/components/FormFieldHeader/__snapshots__/FormFieldHeader.test.tsx.snap
new file mode 100644
index 000000000..243ff3107
--- /dev/null
+++ b/public/components/FormFieldHeader/__snapshots__/FormFieldHeader.test.tsx.snap
@@ -0,0 +1,78 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<FormFieldHeader /> spec renders the component 1`] = `
+Object {
+  "asFragment": [Function],
+  "baseElement": <body>
+    <div>
+      <div
+        class="euiText euiText--small"
+      >
+        <strong>
+          some title
+        </strong>
+      </div>
+    </div>
+  </body>,
+  "container": <div>
+    <div
+      class="euiText euiText--small"
+    >
+      <strong>
+        some title
+      </strong>
+    </div>
+  </div>,
+  "debug": [Function],
+  "findAllByAltText": [Function],
+  "findAllByDisplayValue": [Function],
+  "findAllByLabelText": [Function],
+  "findAllByPlaceholderText": [Function],
+  "findAllByRole": [Function],
+  "findAllByTestId": [Function],
+  "findAllByText": [Function],
+  "findAllByTitle": [Function],
+  "findByAltText": [Function],
+  "findByDisplayValue": [Function],
+  "findByLabelText": [Function],
+  "findByPlaceholderText": [Function],
+  "findByRole": [Function],
+  "findByTestId": [Function],
+  "findByText": [Function],
+  "findByTitle": [Function],
+  "getAllByAltText": [Function],
+  "getAllByDisplayValue": [Function],
+  "getAllByLabelText": [Function],
+  "getAllByPlaceholderText": [Function],
+  "getAllByRole": [Function],
+  "getAllByTestId": [Function],
+  "getAllByText": [Function],
+  "getAllByTitle": [Function],
+  "getByAltText": [Function],
+  "getByDisplayValue": [Function],
+  "getByLabelText": [Function],
+  "getByPlaceholderText": [Function],
+  "getByRole": [Function],
+  "getByTestId": [Function],
+  "getByText": [Function],
+  "getByTitle": [Function],
+  "queryAllByAltText": [Function],
+  "queryAllByDisplayValue": [Function],
+  "queryAllByLabelText": [Function],
+  "queryAllByPlaceholderText": [Function],
+  "queryAllByRole": [Function],
+  "queryAllByTestId": [Function],
+  "queryAllByText": [Function],
+  "queryAllByTitle": [Function],
+  "queryByAltText": [Function],
+  "queryByDisplayValue": [Function],
+  "queryByLabelText": [Function],
+  "queryByPlaceholderText": [Function],
+  "queryByRole": [Function],
+  "queryByTestId": [Function],
+  "queryByText": [Function],
+  "queryByTitle": [Function],
+  "rerender": [Function],
+  "unmount": [Function],
+}
+`;
diff --git a/public/components/NotificationsCallOut/NotificationsCallOut.test.tsx b/public/components/NotificationsCallOut/NotificationsCallOut.test.tsx
new file mode 100644
index 000000000..4b86e7d68
--- /dev/null
+++ b/public/components/NotificationsCallOut/NotificationsCallOut.test.tsx
@@ -0,0 +1,15 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import { NotificationsCallOut } from './NotificationsCallOut';
+
+describe('<NotificationsCallOut /> spec', () => {
+  it('renders the component', () => {
+    const tree = render(<NotificationsCallOut />);
+    expect(tree).toMatchSnapshot();
+  });
+});
diff --git a/public/components/NotificationsCallOut/__snapshots__/NotificationsCallOut.test.tsx.snap b/public/components/NotificationsCallOut/__snapshots__/NotificationsCallOut.test.tsx.snap
new file mode 100644
index 000000000..4b93feaa8
--- /dev/null
+++ b/public/components/NotificationsCallOut/__snapshots__/NotificationsCallOut.test.tsx.snap
@@ -0,0 +1,138 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<NotificationsCallOut /> spec renders the component 1`] = `
+Object {
+  "asFragment": [Function],
+  "baseElement": <body>
+    <div>
+      <div
+        class="euiCallOut euiCallOut--danger"
+      >
+        <div
+          class="euiCallOutHeader"
+        >
+          EuiIconMock
+          <span
+            class="euiCallOutHeader__title"
+          >
+            Notifications plugin is not installed
+          </span>
+        </div>
+        <div
+          class="euiText euiText--small"
+        >
+          <div
+            class="euiTextColor euiTextColor--default"
+          >
+            <p>
+              Install the notifications plugin in order to create and select channels to send out notifications. 
+              <a
+                class="euiLink euiLink--primary"
+                href="https://opensearch.org/docs/latest/notifications-plugin/index/"
+                rel="noreferrer"
+              >
+                Learn more
+                EuiIconMock
+              </a>
+              .
+            </p>
+          </div>
+        </div>
+      </div>
+      <div
+        class="euiSpacer euiSpacer--m"
+      />
+    </div>
+  </body>,
+  "container": <div>
+    <div
+      class="euiCallOut euiCallOut--danger"
+    >
+      <div
+        class="euiCallOutHeader"
+      >
+        EuiIconMock
+        <span
+          class="euiCallOutHeader__title"
+        >
+          Notifications plugin is not installed
+        </span>
+      </div>
+      <div
+        class="euiText euiText--small"
+      >
+        <div
+          class="euiTextColor euiTextColor--default"
+        >
+          <p>
+            Install the notifications plugin in order to create and select channels to send out notifications. 
+            <a
+              class="euiLink euiLink--primary"
+              href="https://opensearch.org/docs/latest/notifications-plugin/index/"
+              rel="noreferrer"
+            >
+              Learn more
+              EuiIconMock
+            </a>
+            .
+          </p>
+        </div>
+      </div>
+    </div>
+    <div
+      class="euiSpacer euiSpacer--m"
+    />
+  </div>,
+  "debug": [Function],
+  "findAllByAltText": [Function],
+  "findAllByDisplayValue": [Function],
+  "findAllByLabelText": [Function],
+  "findAllByPlaceholderText": [Function],
+  "findAllByRole": [Function],
+  "findAllByTestId": [Function],
+  "findAllByText": [Function],
+  "findAllByTitle": [Function],
+  "findByAltText": [Function],
+  "findByDisplayValue": [Function],
+  "findByLabelText": [Function],
+  "findByPlaceholderText": [Function],
+  "findByRole": [Function],
+  "findByTestId": [Function],
+  "findByText": [Function],
+  "findByTitle": [Function],
+  "getAllByAltText": [Function],
+  "getAllByDisplayValue": [Function],
+  "getAllByLabelText": [Function],
+  "getAllByPlaceholderText": [Function],
+  "getAllByRole": [Function],
+  "getAllByTestId": [Function],
+  "getAllByText": [Function],
+  "getAllByTitle": [Function],
+  "getByAltText": [Function],
+  "getByDisplayValue": [Function],
+  "getByLabelText": [Function],
+  "getByPlaceholderText": [Function],
+  "getByRole": [Function],
+  "getByTestId": [Function],
+  "getByText": [Function],
+  "getByTitle": [Function],
+  "queryAllByAltText": [Function],
+  "queryAllByDisplayValue": [Function],
+  "queryAllByLabelText": [Function],
+  "queryAllByPlaceholderText": [Function],
+  "queryAllByRole": [Function],
+  "queryAllByTestId": [Function],
+  "queryAllByText": [Function],
+  "queryAllByTitle": [Function],
+  "queryByAltText": [Function],
+  "queryByDisplayValue": [Function],
+  "queryByLabelText": [Function],
+  "queryByPlaceholderText": [Function],
+  "queryByRole": [Function],
+  "queryByTestId": [Function],
+  "queryByText": [Function],
+  "queryByTitle": [Function],
+  "rerender": [Function],
+  "unmount": [Function],
+}
+`;
