Hide tenant when disabled in the account nav button popover (#1768) (#1792)

Signed-off-by: Derek Ho <dxho@amazon.com>
(cherry picked from commit 4dc984b)

Co-authored-by: Derek Ho <dxho@amazon.com>

Author: opensearch-trigger-bot[bot]

public/apps/account/account-nav-button.tsx

@@ -108,15 +108,17 @@ export function AccountNavButton(props: {
               }
             />
           </EuiListGroup>
-          <EuiListGroupItem
-            color="subdued"
-            key="tenant"
-            label={
-              <EuiText size="xs" id="tenantName">
-                {resolveTenantName(props.tenant || '', username)}
-              </EuiText>
-            }
-          />
+          {isMultiTenancyEnabled && props.config.multitenancy.enabled && (
+            <EuiListGroupItem
+              color="subdued"
+              key="tenant"
+              label={
+                <EuiText size="xs" id="tenantName">
+                  {resolveTenantName(props.tenant || '', username)}
+                </EuiText>
+              }
+            />
+          )}
         </EuiFlexItem>
       </EuiFlexGroup>
 

public/apps/account/test/account-nav-button.test.tsx

@@ -16,8 +16,9 @@
 import { shallow } from 'enzyme';
 import React from 'react';
 import { AccountNavButton, reloadAfterTenantSwitch } from '../account-nav-button';
-import { getShouldShowTenantPopup, setShouldShowTenantPopup } from '../../../utils/storage-utils';
+import { getShouldShowTenantPopup } from '../../../utils/storage-utils';
 import { getDashboardsInfo } from '../../../utils/dashboards-info-utils';
+import { render, fireEvent } from '@testing-library/react';
 
 jest.mock('../../../utils/storage-utils', () => ({
   getShouldShowTenantPopup: jest.fn(),
@@ -81,6 +82,10 @@ describe('Account navigation button', () => {
     jest.clearAllMocks();
   });
 
+  afterAll(() => {
+    useStateSpy.mockRestore();
+  });
+
   it('renders', () => {
     (getDashboardsInfo as jest.Mock).mockImplementationOnce(() => {
       return mockDashboardsInfo;
@@ -149,6 +154,10 @@ describe('Account navigation button, multitenancy disabled', () => {
     useStateSpy.mockImplementation((init) => [init, setState]);
   });
 
+  afterAll(() => {
+    useStateSpy.mockRestore();
+  });
+
   afterEach(() => {
     jest.clearAllMocks();
   });
@@ -168,6 +177,74 @@ describe('Account navigation button, multitenancy disabled', () => {
   });
 });
 
+describe('Shows tenant info when multitenancy enabled, and hides it if disabled', () => {
+  test('Renders "switch-tenants" and "tenant-name" when multi-tenancy is enabled', () => {
+    const props = {
+      coreStart: {},
+      isInternalUser: true,
+      username: 'example_user',
+      tenant: 'example_tenant',
+      config: {
+        multitenancy: { enabled: true },
+        auth: {
+          type: 'dummy',
+        },
+      },
+    };
+
+    // Render the component
+    const { container, queryByText } = render(<AccountNavButton {...props} />);
+
+    // Find the popover component by data-test-subj
+    const popoverElement = container.querySelector('[data-test-subj="account-popover"]');
+
+    // Assert that the popover component is rendered
+    expect(popoverElement).toBeDefined();
+
+    // Now, simulate a click event on the button to open the popover
+    fireEvent.click(popoverElement!);
+
+    const tenantName = queryByText('example_tenant');
+    expect(tenantName).not.toBeNull();
+
+    const tenantSwitch = queryByText('Switch tenants');
+    expect(tenantSwitch).not.toBeNull();
+  });
+
+  test('Does not render "switch-tenants" and "tenant-name" when multi-tenancy is disabled', () => {
+    const props = {
+      coreStart: {},
+      isInternalUser: true,
+      username: 'example_user',
+      tenant: 'example_tenant',
+      config: {
+        multitenancy: { enabled: false },
+        auth: {
+          type: 'dummy',
+        },
+      },
+    };
+
+    // Render the component
+    const { container, queryByText } = render(<AccountNavButton {...props} />);
+
+    // Find the popover component by data-test-subj
+    const popoverElement = container.querySelector('[data-test-subj="account-popover"]');
+
+    // Assert that the popover component is rendered
+    expect(popoverElement).toBeDefined();
+
+    // Now, simulate a click event on the button to open the popover
+    fireEvent.click(popoverElement!);
+
+    const tenantName = queryByText('example_tenant');
+    expect(tenantName).toBeNull();
+
+    const tenantSwitch = queryByText('Switch tenants');
+    expect(tenantSwitch).toBeNull();
+  });
+});
+
 describe('Reload window after tenant switch', () => {
   const originalLocation = window.location;
   const mockSetWindowHref = jest.fn();