[8.13] fix empty ent. guard (#180465) (#180863)

# Backport

This will backport the following commits from `main` to `8.13`:
- [fix empty ent. guard
(#180465)](https://github.com/elastic/kibana/pull/180465)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Luke
G","email":"11671118+lgestc@users.noreply.github.com"},"sourceCommit":{"committedDate":"2024-04-15T15:27:35Z","message":"fix
empty ent. guard (#180465)\n\n## Summary\r\n\r\n@angorayc found an issue
with another upselling page, this adds the\r\nupdated logic to that
screen as
well.","sha":"69ef1f6a87b98a36f253d1a8e55e8c59ab8048ea","branchLabelMapping":{"^v8.14.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","Team:Threat
Hunting:Investigations","backport:prev-minor","v8.14.0"],"title":"fix
empty ent.
guard","number":180465,"url":"https://github.com/elastic/kibana/pull/180465","mergeCommit":{"message":"fix
empty ent. guard (#180465)\n\n## Summary\r\n\r\n@angorayc found an issue
with another upselling page, this adds the\r\nupdated logic to that
screen as
well.","sha":"69ef1f6a87b98a36f253d1a8e55e8c59ab8048ea"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v8.14.0","branchLabelMappingKey":"^v8.14.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/180465","number":180465,"mergeCommit":{"message":"fix
empty ent. guard (#180465)\n\n## Summary\r\n\r\n@angorayc found an issue
with another upselling page, this adds the\r\nupdated logic to that
screen as well.","sha":"69ef1f6a87b98a36f253d1a8e55e8c59ab8048ea"}}]}]
BACKPORT-->

Co-authored-by: Luke G <11671118+lgestc@users.noreply.github.com>

x-pack/plugins/threat_intelligence/public/containers/enterprise_guard.test.tsx

@@ -7,7 +7,7 @@
 
 import { render, screen } from '@testing-library/react';
 import React from 'react';
-import { TestProvidersComponent } from '../mocks/test_providers';
+import { EMPTY_PAGE_SECURITY_TEMPLATE, TestProvidersComponent } from '../mocks/test_providers';
 import { SecuritySolutionPluginContext } from '../types';
 import { SecuritySolutionContext } from './security_solution_context';
 import { EnterpriseGuard } from './enterprise_guard';
@@ -32,6 +32,8 @@ describe('<EnterpriseGuard />', () => {
       );
 
       expect(screen.queryByText('enterprise only content')).toBeInTheDocument();
+      expect(screen.queryByTestId('tiPaywall')).not.toBeInTheDocument();
+      expect(screen.queryByTestId(EMPTY_PAGE_SECURITY_TEMPLATE)).not.toBeInTheDocument();
     });
   });
 
@@ -55,6 +57,7 @@ describe('<EnterpriseGuard />', () => {
 
       expect(screen.queryByText('enterprise only content')).not.toBeInTheDocument();
       expect(screen.queryByTestId('tiPaywall')).toBeInTheDocument();
+      expect(screen.queryByTestId(EMPTY_PAGE_SECURITY_TEMPLATE)).toBeInTheDocument();
     });
   });
 });

x-pack/plugins/threat_intelligence/public/containers/enterprise_guard.tsx

@@ -18,9 +18,5 @@ export const EnterpriseGuard: FC = memo(({ children }) => {
     return <>{children}</>;
   }
 
-  return (
-    <SecuritySolutionPluginTemplateWrapper isEmptyState>
-      <Paywall />
-    </SecuritySolutionPluginTemplateWrapper>
-  );
+  return <SecuritySolutionPluginTemplateWrapper isEmptyState emptyPageBody={<Paywall />} />;
 });

x-pack/plugins/threat_intelligence/public/containers/integrations_guard.test.tsx

@@ -9,7 +9,7 @@ import { UseQueryResult } from '@tanstack/react-query';
 import { render } from '@testing-library/react';
 import React from 'react';
 import { IntegrationsGuard } from './integrations_guard';
-import { TestProvidersComponent } from '../mocks/test_providers';
+import { EMPTY_PAGE_SECURITY_TEMPLATE, TestProvidersComponent } from '../mocks/test_providers';
 import { Integration, useIntegrations } from '../hooks/use_integrations';
 import { useIntegrationsPageLink } from '../hooks/use_integrations_page_link';
 import { useTIDocumentationLink } from '../hooks/use_documentation_link';
@@ -47,6 +47,7 @@ describe('IntegrationsGuard', () => {
     });
 
     expect(getByTestId(LOADING_LOGO_TEST_ID)).toBeInTheDocument();
+    expect(getByTestId(EMPTY_PAGE_SECURITY_TEMPLATE)).toBeInTheDocument();
   });
 
   it('should render loading when indicator only is loading', async () => {
@@ -72,6 +73,7 @@ describe('IntegrationsGuard', () => {
     });
 
     expect(getByTestId(LOADING_LOGO_TEST_ID)).toBeInTheDocument();
+    expect(getByTestId(EMPTY_PAGE_SECURITY_TEMPLATE)).toBeInTheDocument();
   });
 
   it('should render loading when integrations only are loading', async () => {
@@ -98,6 +100,7 @@ describe('IntegrationsGuard', () => {
     });
 
     expect(getByTestId(LOADING_LOGO_TEST_ID)).toBeInTheDocument();
+    expect(getByTestId(EMPTY_PAGE_SECURITY_TEMPLATE)).toBeInTheDocument();
   });
 
   it('should render empty page when no indicators are found and no ti integrations are installed', async () => {
@@ -122,6 +125,7 @@ describe('IntegrationsGuard', () => {
       wrapper: TestProvidersComponent,
     });
     expect(getByTestId(EMPTY_PROMPT_TEST_ID)).toBeInTheDocument();
+    expect(getByTestId(EMPTY_PAGE_SECURITY_TEMPLATE)).toBeInTheDocument();
   });
 
   it('should render indicators table when we have some indicators', async () => {

x-pack/plugins/threat_intelligence/public/mocks/test_providers.tsx

@@ -113,6 +113,8 @@ const mockSecurityContext: SecuritySolutionPluginContext = getSecuritySolutionCo
 
 const casesServiceMock = casesPluginMock.createStartContract();
 
+export const EMPTY_PAGE_SECURITY_TEMPLATE = 'empty-page-security-template' as const;
+
 export const mockedServices = {
   ...coreServiceMock,
   data: dataServiceMock,
@@ -128,8 +130,9 @@ export const mockedServices = {
       () =>
       ({ children, isEmptyState, emptyPageBody }: any) => {
         if (isEmptyState && emptyPageBody) {
-          return <>{emptyPageBody}</>;
+          return <div data-test-subj={EMPTY_PAGE_SECURITY_TEMPLATE}>{emptyPageBody}</div>;
         }
+
         return <>{children}</>;
       },
   },