[Security Solution][Admin][Policy] Show policy api list error rather …

…than onboarding screen (#167838)

## Summary

- [x] Fixes a bug where the policy list page would show the onboarding
screen rather than an error screen if the policy list api failed
- [x] Adds related unit test 

# Screenshot

![policylist3](https://github.com/elastic/kibana/assets/56409205/1d1d544a-bce1-4b1f-8d47-db38fa1d57fe)

x-pack/plugins/security_solution/public/management/pages/policy/view/integration_tests/policy_list.test.tsx

@@ -11,7 +11,7 @@ import type { AppContextTestRender } from '../../../../../common/mock/endpoint';
 import { createAppRootMockRenderer } from '../../../../../common/mock/endpoint';
 import { sendGetEndpointSpecificPackagePolicies } from '../../../../services/policies/policies';
 import { sendGetEndpointSpecificPackagePoliciesMock } from '../../../../services/policies/test_mock_utils';
-import { PolicyList } from '../policy_list';
+import { PolicyList, policyListErrorMessage } from '../policy_list';
 import type { GetPolicyListResponse } from '../../types';
 import { getEndpointListPath, getPoliciesPath } from '../../../../common/routing';
 import { APP_UI_ID } from '../../../../../../common/constants';
@@ -45,6 +45,22 @@ describe('When on the policy list page', () => {
     jest.clearAllMocks();
   });
 
+  describe('on get policy list api failure', () => {
+    beforeEach(async () => {
+      getPackagePolicies.mockRejectedValueOnce(new Error('mock list failure'));
+      render();
+    });
+    afterEach(() => {
+      getPackagePolicies.mockReset();
+    });
+
+    it('should show table with error state', async () => {
+      expect(renderResult.getByTestId('policyListTable')).toBeTruthy();
+      await waitFor(() => {
+        expect(renderResult.getByText(policyListErrorMessage)).toBeTruthy();
+      });
+    });
+  });
   describe('and there are no policies', () => {
     beforeEach(async () => {
       getPackagePolicies.mockResolvedValue(
@@ -86,7 +102,7 @@ describe('When on the policy list page', () => {
     });
 
     beforeEach(async () => {
-      getPackagePolicies.mockReturnValue(policies);
+      getPackagePolicies.mockResolvedValue(policies);
       render();
       await waitFor(() => {
         expect(sendGetEndpointSpecificPackagePolicies).toHaveBeenCalled();

x-pack/plugins/security_solution/public/management/pages/policy/view/policy_list.tsx

@@ -46,6 +46,27 @@ import { useAppUrl, useToasts } from '../../../../common/lib/kibana';
 import { PolicyEndpointCount } from './components/policy_endpoint_count';
 import { ManagementEmptyStateWrapper } from '../../../components/management_empty_state_wrapper';
 
+export const policyListErrorMessage = i18n.translate(
+  'xpack.securitySolution.policy.list.errorMessage',
+  {
+    defaultMessage: 'Error while retrieving list of policies',
+  }
+);
+
+const policyListErrorToastTitle = i18n.translate(
+  'xpack.securitySolution.policy.list.errorMessage.toast.title',
+  {
+    defaultMessage: 'Failed to retrieve policy list',
+  }
+);
+
+const policyListErrorToastText = i18n.translate(
+  'xpack.securitySolution.policyList.packageVersionError',
+  {
+    defaultMessage: 'Error retrieving the endpoint package version',
+  }
+);
+
 export const PolicyList = memo(() => {
   const { canReadEndpointList, loading: authLoading } = useUserPrivileges().endpointPrivileges;
   const isProtectionUpdatesEnabled = useIsExperimentalFeatureEnabled('protectionUpdatesEnabled');
@@ -63,6 +84,9 @@ export const PolicyList = memo(() => {
   } = useGetEndpointSpecificPolicies({
     page: pagination.page,
     perPage: pagination.pageSize,
+    onError: (err) => {
+      toasts.addDanger({ title: policyListErrorToastTitle, text: err.message });
+    },
   });
 
   const { data: outdatedManifestsCountResponse, isLoading: isOutdatedManifestsCountLoading } =
@@ -73,17 +97,21 @@ export const PolicyList = memo(() => {
     useGetEndpointSecurityPackage({
       customQueryOptions: {
         onError: (err) => {
-          toasts.addDanger(
-            i18n.translate('xpack.securitySolution.policyList.packageVersionError', {
-              defaultMessage: 'Error retrieving the endpoint package version',
-            })
-          );
+          toasts.addDanger({
+            title: policyListErrorToastText,
+            text: err.message,
+          });
         },
       },
     });
 
   const totalItemCount = useMemo(() => data?.total ?? 0, [data]);
 
+  const shouldShowOnboarding = useMemo(
+    () => !policyIsFetching && totalItemCount === 0 && !error,
+    [policyIsFetching, totalItemCount, error]
+  );
+
   const policyListPath = useMemo(() => getPoliciesPath(search), [search]);
 
   const backLink: PolicyDetailsRouteState['backLink'] = useMemo(() => {
@@ -365,14 +393,10 @@ export const PolicyList = memo(() => {
     };
   }, [totalItemCount, pageSizeOptions, pagination.page, pagination.pageSize]);
 
-  const policyListErrorMessage = i18n.translate('xpack.securitySolution.policy.list.errorMessage', {
-    defaultMessage: 'Error while retrieving list of policies',
-  });
-
   return (
     <AdministrationListPage
       data-test-subj="policyListPage"
-      hideHeader={totalItemCount === 0}
+      hideHeader={shouldShowOnboarding}
       title={i18n.translate('xpack.securitySolution.policy.list.title', {
         defaultMessage: 'Policies',
       })}
@@ -381,7 +405,7 @@ export const PolicyList = memo(() => {
           'Use policies to customize endpoint and cloud workload protections and other configurations',
       })}
     >
-      {totalItemCount > 0 ? (
+      {!shouldShowOnboarding ? (
         <>
           <EuiText color="subdued" size="xs" data-test-subj="endpointListTableTotal">
             <FormattedMessage