Allow users with read access to view Integrations app

x-pack/plugins/fleet/public/applications/integrations/app.tsx

@@ -7,12 +7,10 @@
 
 import React, { memo, useEffect, useState } from 'react';
 import type { AppMountParameters } from 'kibana/public';
-import { EuiCode, EuiEmptyPrompt, EuiErrorBoundary, EuiPanel, EuiPortal } from '@elastic/eui';
+import { EuiErrorBoundary, EuiPortal } from '@elastic/eui';
 import type { History } from 'history';
 import { Router, Redirect, Route, Switch } from 'react-router-dom';
 import { FormattedMessage } from '@kbn/i18n/react';
-import { i18n } from '@kbn/i18n';
-import styled from 'styled-components';
 import useObservable from 'react-use/lib/useObservable';
 
 import {
@@ -49,29 +47,23 @@ const ErrorLayout = ({ children }: { children: JSX.Element }) => (
   </EuiErrorBoundary>
 );
 
-const Panel = styled(EuiPanel)`
-  max-width: 500px;
-  margin-right: auto;
-  margin-left: auto;
-`;
-
 export const WithPermissionsAndSetup: React.FC = memo(({ children }) => {
   useBreadcrumbs('integrations');
 
   const [isPermissionsLoading, setIsPermissionsLoading] = useState<boolean>(false);
-  const [permissionsError, setPermissionsError] = useState<string>();
   const [isInitialized, setIsInitialized] = useState(false);
   const [initializationError, setInitializationError] = useState<Error | null>(null);
 
   useEffect(() => {
     (async () => {
-      setPermissionsError(undefined);
       setIsInitialized(false);
       setInitializationError(null);
       try {
+        // Attempt Fleet Setup if user has permissions, otherwise skip
         setIsPermissionsLoading(true);
         const permissionsResponse = await sendGetPermissionsCheck();
         setIsPermissionsLoading(false);
+
         if (permissionsResponse.data?.success) {
           try {
             const setupResponse = await sendSetup();
@@ -83,69 +75,20 @@ export const WithPermissionsAndSetup: React.FC = memo(({ children }) => {
           }
           setIsInitialized(true);
         } else {
-          setPermissionsError(permissionsResponse.data?.error || 'REQUEST_ERROR');
+          setIsInitialized(true);
         }
-      } catch (err) {
-        setPermissionsError('REQUEST_ERROR');
+      } catch {
+        // If there's an error checking permissions, default to proceeding without running setup
+        // User will only have access to EPM endpoints if they actually have permission
+        setIsInitialized(true);
       }
     })();
   }, []);
 
-  if (isPermissionsLoading || permissionsError) {
+  if (isPermissionsLoading) {
     return (
       <ErrorLayout>
-        {isPermissionsLoading ? (
-          <Loading />
-        ) : permissionsError === 'REQUEST_ERROR' ? (
-          <Error
-            title={
-              <FormattedMessage
-                id="xpack.fleet.permissionsRequestErrorMessageTitle"
-                defaultMessage="Unable to check permissions"
-              />
-            }
-            error={i18n.translate('xpack.fleet.permissionsRequestErrorMessageDescription', {
-              defaultMessage: 'There was a problem checking Fleet permissions',
-            })}
-          />
-        ) : (
-          <Panel>
-            <EuiEmptyPrompt
-              iconType="securityApp"
-              title={
-                <h2>
-                  {permissionsError === 'MISSING_SUPERUSER_ROLE' ? (
-                    <FormattedMessage
-                      id="xpack.fleet.permissionDeniedErrorTitle"
-                      defaultMessage="Permission denied"
-                    />
-                  ) : (
-                    <FormattedMessage
-                      id="xpack.fleet.securityRequiredErrorTitle"
-                      defaultMessage="Security is not enabled"
-                    />
-                  )}
-                </h2>
-              }
-              body={
-                <p>
-                  {permissionsError === 'MISSING_SUPERUSER_ROLE' ? (
-                    <FormattedMessage
-                      id="xpack.fleet.integrationsPermissionDeniedErrorMessage"
-                      defaultMessage="You are not authorized to access Integrations. Integrations requires {roleName} privileges."
-                      values={{ roleName: <EuiCode>superuser</EuiCode> }}
-                    />
-                  ) : (
-                    <FormattedMessage
-                      id="xpack.fleet.integrationsSecurityRequiredErrorMessage"
-                      defaultMessage="You must enable security in Kibana and Elasticsearch to use Integrations."
-                    />
-                  )}
-                </p>
-              }
-            />
-          </Panel>
-        )}
+        <Loading />
       </ErrorLayout>
     );
   }

x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/assets/assets.tsx

@@ -9,6 +9,7 @@ import React, { useEffect, useState } from 'react';
 import { Redirect } from 'react-router-dom';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { EuiFlexGroup, EuiFlexItem, EuiTitle, EuiSpacer } from '@elastic/eui';
+import { groupBy } from 'lodash';
 
 import { Loading, Error, ExtensionWrapper } from '../../../../../components';
 
@@ -67,8 +68,26 @@ export const AssetsPage = ({ packageInfo }: AssetsPanelProps) => {
             id,
             type,
           }));
-          const { savedObjects } = await savedObjectsClient.bulkGet(objectsToGet);
-          setAssetsSavedObjects(savedObjects as AssetSavedObject[]);
+
+          // We don't have an API to know which SO types a user has access to, so instead we make a request for each
+          // SO type and ignore the 403 errors
+          const objectsByType = await Promise.all(
+            Object.entries(groupBy(objectsToGet, 'type')).map(([type, objects]) =>
+              savedObjectsClient
+                .bulkGet(objects)
+                // Ignore privilege errors
+                .catch((e: any) => {
+                  if (e?.body?.statusCode === 403) {
+                    return { savedObjects: [] };
+                  } else {
+                    throw e;
+                  }
+                })
+                .then(({ savedObjects }) => savedObjects as AssetSavedObject[])
+            )
+          );
+
+          setAssetsSavedObjects(objectsByType.flat());
         } catch (e) {
           setFetchError(e);
         } finally {

x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/index.test.tsx

@@ -11,6 +11,7 @@ import { act, cleanup } from '@testing-library/react';
 
 import { INTEGRATIONS_ROUTING_PATHS, pagePathGetters } from '../../../../constants';
 import type {
+  CheckPermissionsResponse,
   GetAgentPoliciesResponse,
   GetFleetStatusResponse,
   GetInfoResponse,
@@ -23,6 +24,7 @@ import type {
 } from '../../../../../../../common/types/models';
 import {
   agentPolicyRouteService,
+  appRoutesService,
   epmRouteService,
   fleetSetupRouteService,
   packagePolicyRouteService,
@@ -260,6 +262,7 @@ interface EpmPackageDetailsResponseProvidersMock {
   fleetSetup: jest.MockedFunction<() => GetFleetStatusResponse>;
   packagePolicyList: jest.MockedFunction<() => GetPackagePoliciesResponse>;
   agentPolicyList: jest.MockedFunction<() => GetAgentPoliciesResponse>;
+  appCheckPermissions: jest.MockedFunction<() => CheckPermissionsResponse>;
 }
 
 const mockApiCalls = (
@@ -740,6 +743,10 @@ On Windows, the module was tested with Nginx installed from the Chocolatey repos
     },
   };
 
+  const appCheckPermissionsResponse: CheckPermissionsResponse = {
+    success: true,
+  };
+
   const mockedApiInterface: MockedApi<EpmPackageDetailsResponseProvidersMock> = {
     waitForApi() {
       return new Promise((resolve) => {
@@ -757,6 +764,7 @@ On Windows, the module was tested with Nginx installed from the Chocolatey repos
       fleetSetup: jest.fn().mockReturnValue(agentsSetupResponse),
       packagePolicyList: jest.fn().mockReturnValue(packagePoliciesResponse),
       agentPolicyList: jest.fn().mockReturnValue(agentPoliciesResponse),
+      appCheckPermissions: jest.fn().mockReturnValue(appCheckPermissionsResponse),
     },
   };
 
@@ -792,6 +800,11 @@ On Windows, the module was tested with Nginx installed from the Chocolatey repos
         return mockedApiInterface.responseProvider.epmGetStats();
       }
 
+      if (path === appRoutesService.getCheckPermissionsPath()) {
+        markApiCallAsHandled();
+        return mockedApiInterface.responseProvider.appCheckPermissions();
+      }
+
       const err = new Error(`API [GET ${path}] is not MOCKED!`);
       // eslint-disable-next-line no-console
       console.error(err);