diff --git a/public/components/integrations/components/__tests__/__snapshots__/integration_header.test.tsx.snap b/public/components/integrations/components/__tests__/__snapshots__/integration_header.test.tsx.snap
index 41591c2408..574594d3a5 100644
--- a/public/components/integrations/components/__tests__/__snapshots__/integration_header.test.tsx.snap
+++ b/public/components/integrations/components/__tests__/__snapshots__/integration_header.test.tsx.snap
@@ -24,6 +24,124 @@ exports[`Integration Header Test Renders integration header as expected 1`] = `
             </EuiTitle>
           </div>
         </EuiPageHeaderSection>
+        <EuiPageHeaderSection>
+          <div
+            className="euiPageHeaderSection"
+          >
+            <IntegrationHeaderActions
+              onShowUpload={[Function]}
+            >
+              <EuiPopover
+                anchorPosition="downLeft"
+                button={
+                  <EuiButton
+                    fill={true}
+                    iconType="arrowDown"
+                    onClick={[Function]}
+                  >
+                    Catalog
+                  </EuiButton>
+                }
+                closePopover={[Function]}
+                display="inlineBlock"
+                hasArrow={true}
+                id="integHeaderActionsPanel"
+                isOpen={false}
+                ownFocus={true}
+                panelPaddingSize="none"
+              >
+                <div
+                  className="euiPopover euiPopover--anchorDownLeft"
+                  id="integHeaderActionsPanel"
+                >
+                  <div
+                    className="euiPopover__anchor"
+                  >
+                    <EuiButton
+                      fill={true}
+                      iconType="arrowDown"
+                      onClick={[Function]}
+                    >
+                      <EuiButtonDisplay
+                        baseClassName="euiButton"
+                        disabled={false}
+                        element="button"
+                        fill={true}
+                        iconType="arrowDown"
+                        isDisabled={false}
+                        onClick={[Function]}
+                        type="button"
+                      >
+                        <button
+                          className="euiButton euiButton--primary euiButton--fill"
+                          disabled={false}
+                          onClick={[Function]}
+                          style={
+                            Object {
+                              "minWidth": undefined,
+                            }
+                          }
+                          type="button"
+                        >
+                          <EuiButtonContent
+                            className="euiButton__content"
+                            iconSide="left"
+                            iconType="arrowDown"
+                            textProps={
+                              Object {
+                                "className": "euiButton__text",
+                              }
+                            }
+                          >
+                            <span
+                              className="euiButtonContent euiButton__content"
+                            >
+                              <EuiIcon
+                                className="euiButtonContent__icon"
+                                color="inherit"
+                                size="m"
+                                type="arrowDown"
+                              >
+                                <EuiIconBeaker
+                                  aria-hidden={true}
+                                  className="euiIcon euiIcon--medium euiIcon--inherit euiIcon-isLoading euiButtonContent__icon"
+                                  focusable="false"
+                                  role="img"
+                                  style={null}
+                                >
+                                  <svg
+                                    aria-hidden={true}
+                                    className="euiIcon euiIcon--medium euiIcon--inherit euiIcon-isLoading euiButtonContent__icon"
+                                    focusable="false"
+                                    height={16}
+                                    role="img"
+                                    style={null}
+                                    viewBox="0 0 16 16"
+                                    width={16}
+                                    xmlns="http://www.w3.org/2000/svg"
+                                  >
+                                    <path
+                                      d="M5.277 10.088c.02.014.04.03.057.047.582.55 1.134.812 1.666.812.586 0 1.84-.293 3.713-.88L9 6.212V2H7v4.212l-1.723 3.876Zm-.438.987L3.539 14h8.922l-1.32-2.969C9.096 11.677 7.733 12 7 12c-.74 0-1.463-.315-2.161-.925ZM6 2H5V1h6v1h-1v4l3.375 7.594A1 1 0 0 1 12.461 15H3.54a1 1 0 0 1-.914-1.406L6 6V2Z"
+                                    />
+                                  </svg>
+                                </EuiIconBeaker>
+                              </EuiIcon>
+                              <span
+                                className="euiButton__text"
+                              >
+                                Catalog
+                              </span>
+                            </span>
+                          </EuiButtonContent>
+                        </button>
+                      </EuiButtonDisplay>
+                    </EuiButton>
+                  </div>
+                </div>
+              </EuiPopover>
+            </IntegrationHeaderActions>
+          </div>
+        </EuiPageHeaderSection>
       </header>
     </EuiPageHeader>
     <EuiSpacer
diff --git a/public/components/integrations/components/__tests__/__snapshots__/upload_flyout.test.tsx.snap b/public/components/integrations/components/__tests__/__snapshots__/upload_flyout.test.tsx.snap
new file mode 100644
index 0000000000..6fb54a8fe8
--- /dev/null
+++ b/public/components/integrations/components/__tests__/__snapshots__/upload_flyout.test.tsx.snap
@@ -0,0 +1,75 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Integration Upload Flyout Renders integration upload flyout as expected 1`] = `
+<EuiFlyout
+  onClose={[Function]}
+  size="s"
+>
+  <EuiFlyoutHeader>
+    Upload Integrations
+  </EuiFlyoutHeader>
+  <EuiFlyoutBody>
+    <IntegrationUploadPicker
+      isInvalid={true}
+      onFileSelected={[Function]}
+      setIsInvalid={[Function]}
+    />
+  </EuiFlyoutBody>
+  <EuiFlyoutFooter>
+    <EuiFlexGroup
+      justifyContent="spaceBetween"
+    >
+      <EuiFlexItem
+        grow={false}
+      >
+        <EuiButton
+          onClick={[Function]}
+        >
+          Cancel
+        </EuiButton>
+      </EuiFlexItem>
+      <EuiFlexItem
+        grow={false}
+      >
+        <EuiButton
+          disabled={true}
+          fill={true}
+          onClick={[Function]}
+        >
+          Upload
+        </EuiButton>
+      </EuiFlexItem>
+    </EuiFlexGroup>
+  </EuiFlyoutFooter>
+</EuiFlyout>
+`;
+
+exports[`Integration Upload Flyout Renders the clean integration picker as expected 1`] = `
+<EuiForm>
+  <EuiFormRow
+    describedByIds={Array []}
+    display="row"
+    error={
+      Array [
+        "Must be an ndjson bundle of integration templates",
+      ]
+    }
+    fullWidth={false}
+    hasChildLabel={true}
+    hasEmptyLabelSpace={false}
+    isInvalid={false}
+    label="Select file"
+    labelType="label"
+  >
+    <EuiFilePicker
+      compressed={false}
+      display="large"
+      id="integrationBundlePicker"
+      initialPromptText="Select or drag and drop integration bundles"
+      isInvalid={false}
+      onBlur={[Function]}
+      onChange={[Function]}
+    />
+  </EuiFormRow>
+</EuiForm>
+`;
diff --git a/public/components/integrations/components/__tests__/upload_flyout.test.tsx b/public/components/integrations/components/__tests__/upload_flyout.test.tsx
new file mode 100644
index 0000000000..82037a8fd9
--- /dev/null
+++ b/public/components/integrations/components/__tests__/upload_flyout.test.tsx
@@ -0,0 +1,36 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { configure, shallow } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+import React from 'react';
+import { waitFor } from '@testing-library/react';
+import { IntegrationUploadFlyout, IntegrationUploadPicker } from '../upload_flyout';
+
+describe('Integration Upload Flyout', () => {
+  configure({ adapter: new Adapter() });
+
+  it('Renders integration upload flyout as expected', async () => {
+    const wrapper = shallow(<IntegrationUploadFlyout onClose={() => {}} />);
+
+    await waitFor(() => {
+      expect(wrapper).toMatchSnapshot();
+    });
+  });
+
+  it('Renders the clean integration picker as expected', async () => {
+    const wrapper = shallow(
+      <IntegrationUploadPicker
+        isInvalid={true}
+        setIsInvalid={(_) => {}}
+        onFileSelected={(_) => {}}
+      />
+    );
+
+    await waitFor(() => {
+      expect(wrapper).toMatchSnapshot();
+    });
+  });
+});