fix(ESSNTL-5468): DetailRenderer and ungrouped hosts (#2038)

Fixeshttps://issues.redhat.com/browse/ESSNTL-5468, https://issues.redhat.com/browse/ESSNTL-5469, https://issues.redhat.com/browse/ESSNTL-5470.

For ungrouped hosts, the component was wrongly checking for general hosts:write permissions instead of using null in resource definition as a minimum required permission.

src/components/InventoryDetail/DetailRenderer.js

@@ -4,19 +4,17 @@ import PropTypes from 'prop-types';
 import React, { useEffect, useState } from 'react';
 import AccessDenied from '../../Utilities/AccessDenied';
 import { hosts } from '../../api';
-import {
-  GENERAL_HOSTS_READ_PERMISSIONS,
-  REQUIRED_PERMISSIONS_TO_READ_GROUP_HOSTS,
-} from '../../constants';
+import { REQUIRED_PERMISSIONS_TO_READ_GROUP_HOSTS } from '../../constants';
 import DetailWrapper from './DetailWrapper';
 
 const DetailRenderer = ({ isRbacEnabled, ...props }) => {
   const [hostGroupId, setHostGroupId] = useState(null);
   const [isLoading, setIsLoading] = useState(true);
   const { hasAccess } = usePermissionsWithContext(
-    hostGroupId !== null
-      ? REQUIRED_PERMISSIONS_TO_READ_GROUP_HOSTS(hostGroupId)
-      : [GENERAL_HOSTS_READ_PERMISSIONS]
+    /**
+     * hostGroupId can be null, and the ungrouped hosts permissions will be checked in that case
+     */
+    REQUIRED_PERMISSIONS_TO_READ_GROUP_HOSTS(hostGroupId)
   );
 
   useEffect(() => {
@@ -51,24 +49,27 @@ const DetailRenderer = ({ isRbacEnabled, ...props }) => {
     };
   }, [props.inventoryId]);
 
-  if (isRbacEnabled === false) {
-    return <DetailWrapper {...props} />;
-  }
-
-  if (isLoading) {
+  if (isLoading === true) {
+    /**
+     * TODO: test different scenarios once RTL migration is complete
+     */
     return (
       <Flex direction={{ default: 'column' }}>
         <Skeleton width="66%" fontSize="2xl" />
         <Skeleton width="33%" />
         <Skeleton width="33%" />
       </Flex>
     );
-  }
-
-  if (hasAccess === false) {
-    return <AccessDenied />;
   } else {
-    return <DetailWrapper {...props} />;
+    if (isRbacEnabled === true) {
+      if (hasAccess === false) {
+        return <AccessDenied />;
+      } else {
+        return <DetailWrapper {...props} />;
+      }
+    } else {
+      return <DetailWrapper {...props} />;
+    }
   }
 };
 

src/components/InventoryDetail/DetailWrapper.js

@@ -23,7 +23,6 @@ const DetailWrapper = ({
   showTags,
   Wrapper,
   className,
-  hasAccess,
   appName,
   inventoryId,
   ...props
@@ -96,7 +95,6 @@ DetailWrapper.propTypes = {
   ]),
   className: PropTypes.string,
   Wrapper: PropTypes.elementType,
-  hasAccess: PropTypes.bool,
   inventoryId: PropTypes.string.isRequired,
 };