fix(ESSNTL-5537): Update RBAC for staleness page + tab conditional (R…

…edHatInsights#2063) * fix(ESSNTL-5537): Update RBAC for staleness page + tab conditional RedHatInsights#2062 * fix(ESSNTL-5537): fix test --------- Co-authored-by: Georgii Karataev <[email protected]> feat(THEEDGE-3581): view group detail tabs when group has edge devices
acosferreira · Oct 24, 2023 · e94dc2e · e94dc2e
1 parent 31c6cf8
commit e94dc2e
Show file tree

Hide file tree

Showing 6 changed files with 169 additions and 107 deletions.
diff --git a/src/api/api.js b/src/api/api.js
@@ -1,5 +1,6 @@
 import 'abortcontroller-polyfill/dist/polyfill-patch-fetch';
 export const INVENTORY_API_BASE = '/api/inventory/v1';
+export const EDGE_API_BASE = '/api/edge/v1';
 import flatMap from 'lodash/flatMap';
 
 import instance from '@redhat-cloud-services/frontend-components-utilities/interceptors';
@@ -396,3 +397,11 @@ export const postStalenessData = (data) => {
 export const patchStalenessData = (data) => {
   return instance.patch(`${INVENTORY_API_BASE}/account/staleness`, data);
 };
+
+export const fetchEdgeSystem = () => {
+  try {
+    return instance.get(`${EDGE_API_BASE}/devices/devicesview?limit=1`);
+  } catch (err) {
+    console.log(err);
+  }
+};
diff --git a/src/components/InventoryGroupDetail/GroupTabDetails.js b/src/components/InventoryGroupDetail/GroupTabDetails.js
@@ -38,8 +38,7 @@ const GroupTabDetailsWrapper = ({ groupId, groupName, activeTab }) => {
   const notificationProp = getNotificationProp(dispatch);
 
   const [activeTabKey, setActiveTabKey] = useState(0);
-  console.log('tab: ' + tab);
-  console.log('activeTab: ' + activeTab);
+
   return (
     <Tabs
       activeKey={activeTabKey}

diff --git a/src/components/InventoryHostStaleness/HostStalenessCard.js b/src/components/InventoryHostStaleness/HostStalenessCard.js
@@ -20,13 +20,15 @@ import TabCard from './TabCard';
 import {
   CONVENTIONAL_TAB_TOOLTIP,
   IMMUTABLE_TAB_TOOLTIP,
+  conventionalApiKeys,
   daysToSecondsConversion,
   hostStalenessApiKeys,
   secondsToDaysConversion,
 } from './constants';
 import { InventoryHostStalenessPopover } from './constants';
 import {
   fetchDefaultStalenessValues,
+  fetchEdgeSystem,
   fetchStalenessData,
   patchStalenessData,
   postStalenessData,
@@ -42,14 +44,15 @@ const HostStalenessCard = ({ canModifyHostStaleness }) => {
   const [activeTabKey, setActiveTabKey] = useState(0);
   const [isModalOpen, setIsModalOpen] = useState(false);
   const [isFormValid, setIsFormValid] = useState(true);
+  const [hasEdgeSystems, setHasEdgeSystems] = useState(true);
+  const [isLoading, setIsLoading] = useState(true);
   const [hostStalenessImmutableDefaults, setHostStalenessImmutableDefaults] =
     useState({});
   const [
     hostStalenessConventionalDefaults,
     setHostStalenessConventionalDefaults,
   ] = useState({});
 
-  const [isLoading, setIsLoading] = useState(true);
   const dispatch = useDispatch();
 
   const handleTabClick = (_event, tabIndex) => {
@@ -68,7 +71,8 @@ const HostStalenessCard = ({ canModifyHostStaleness }) => {
   //On save Button
   const saveHostData = async () => {
     let apiData = {};
-    hostStalenessApiKeys.forEach(
+    let apiKeys = hasEdgeSystems ? hostStalenessApiKeys : conventionalApiKeys;
+    apiKeys.forEach(
       (filterKey) =>
         filterKey !== 'id' &&
         (apiData[filterKey] = daysToSecondsConversion(newFormValues[filterKey]))
@@ -165,8 +169,12 @@ const HostStalenessCard = ({ canModifyHostStaleness }) => {
       ...immutableFilter,
     });
   };
+  const edgeSystemCheck = () => {
+    fetchEdgeSystem().then((res) => setHasEdgeSystems(res.data.total > 0));
+  };
 
   const batchedApi = async () => {
+    edgeSystemCheck();
     fetchApiStalenessData();
     fetchDefaultValues();
     setIsLoading(false);
@@ -184,7 +192,7 @@ const HostStalenessCard = ({ canModifyHostStaleness }) => {
             <Title headingLevel="h4" size="xl" id="HostTitle">
               Organization level system staleness and deletion
             </Title>
-            <InventoryHostStalenessPopover />
+            <InventoryHostStalenessPopover hasEdgeSystems={hasEdgeSystems} />
           </CardHeader>
           <CardBody>
             <p>
@@ -200,12 +208,11 @@ const HostStalenessCard = ({ canModifyHostStaleness }) => {
                   onClick={() => {
                     setIsEditing(!isEditing);
                   }}
-                  ouiaId="edit-staleness-setting"
                 >
                   Edit
                 </Button>
               ) : (
-                <Tooltip content="You do not have the Inventory staleness and deletion viewer role required to perform this action. Contact your org admin for access.">
+                <Tooltip content="You do not have the Staleness and deletion admin role and/or Inventory Hosts Administrator role required to perform this action. Contact your org admin for access.">
                   <div>
                     <Button
                       variant="link"
@@ -218,77 +225,96 @@ const HostStalenessCard = ({ canModifyHostStaleness }) => {
                 </Tooltip>
               )}
             </Flex>
-            <Tabs
-              id={'HostTabs'}
-              className="pf-m-light pf-c-table pf-u-mb-lg pf-u-mt-lg"
-              activeKey={activeTabKey}
-              onSelect={handleTabClick}
-            >
-              <Tab
-                eventKey={0}
-                title={
-                  <TabTitleText>
-                    Conventional (RPM-DNF){' '}
-                    <Popover
-                      aria-label="Basic popover"
-                      headerContent={<div>Conventional systems (RPM-DNF)</div>}
-                      bodyContent={<div>{CONVENTIONAL_TAB_TOOLTIP}</div>}
-                    >
-                      <OutlinedQuestionCircleIcon className="pf-u-ml-md" />
-                    </Popover>
-                  </TabTitleText>
-                }
+            {hasEdgeSystems ? (
+              <Tabs
+                id={'HostTabs'}
+                className="pf-m-light pf-c-table pf-u-mb-lg pf-u-mt-lg"
+                activeKey={activeTabKey}
+                onSelect={handleTabClick}
               >
-                <TabCard
-                  isEditing={isEditing}
-                  filter={filter}
-                  setFilter={setFilter}
-                  activeTabKey={0}
-                  newFormValues={newFormValues}
-                  setNewFormValues={setNewFormValues}
-                  isFormValid={isFormValid}
-                  setIsFormValid={setIsFormValid}
-                  hostStalenessImmutableDefaults={
-                    hostStalenessImmutableDefaults
+                <Tab
+                  eventKey={0}
+                  title={
+                    <TabTitleText>
+                      Conventional (RPM-DNF){' '}
+                      <Popover
+                        aria-label="Basic popover"
+                        headerContent={
+                          <div>Conventional systems (RPM-DNF)</div>
+                        }
+                        bodyContent={<div>{CONVENTIONAL_TAB_TOOLTIP}</div>}
+                      >
+                        <OutlinedQuestionCircleIcon className="pf-u-ml-md" />
+                      </Popover>
+                    </TabTitleText>
                   }
-                  hostStalenessConventionalDefaults={
-                    hostStalenessConventionalDefaults
+                >
+                  <TabCard
+                    isEditing={isEditing}
+                    filter={filter}
+                    setFilter={setFilter}
+                    activeTabKey={0}
+                    newFormValues={newFormValues}
+                    setNewFormValues={setNewFormValues}
+                    isFormValid={isFormValid}
+                    setIsFormValid={setIsFormValid}
+                    hostStalenessImmutableDefaults={
+                      hostStalenessImmutableDefaults
+                    }
+                    hostStalenessConventionalDefaults={
+                      hostStalenessConventionalDefaults
+                    }
+                  />
+                </Tab>
+                <Tab
+                  eventKey={1}
+                  title={
+                    <TabTitleText>
+                      Immutable (OSTree){' '}
+                      <Popover
+                        aria-label="Basic popover"
+                        headerContent={<div>Immutable (OSTree)</div>}
+                        bodyContent={<div>{IMMUTABLE_TAB_TOOLTIP}</div>}
+                      >
+                        <OutlinedQuestionCircleIcon className="pf-u-ml-md" />
+                      </Popover>
+                    </TabTitleText>
                   }
-                />
-              </Tab>
-              <Tab
-                eventKey={1}
-                title={
-                  <TabTitleText>
-                    Immutable (OSTree){' '}
-                    <Popover
-                      aria-label="Basic popover"
-                      headerContent={<div>Immutable (OSTree)</div>}
-                      bodyContent={<div>{IMMUTABLE_TAB_TOOLTIP}</div>}
-                    >
-                      <OutlinedQuestionCircleIcon className="pf-u-ml-md" />
-                    </Popover>
-                  </TabTitleText>
+                >
+                  <TabCard
+                    isEditing={isEditing}
+                    filter={filter}
+                    setFilter={setFilter}
+                    activeTabKey={1}
+                    newFormValues={newFormValues}
+                    setNewFormValues={setNewFormValues}
+                    isFormValid={isFormValid}
+                    setIsFormValid={setIsFormValid}
+                    hostStalenessImmutableDefaults={
+                      hostStalenessImmutableDefaults
+                    }
+                    hostStalenessConventionalDefaults={
+                      hostStalenessConventionalDefaults
+                    }
+                  />
+                </Tab>
+              </Tabs>
+            ) : (
+              <TabCard
+                isEditing={isEditing}
+                filter={filter}
+                setFilter={setFilter}
+                activeTabKey={0}
+                newFormValues={newFormValues}
+                setNewFormValues={setNewFormValues}
+                isFormValid={isFormValid}
+                setIsFormValid={setIsFormValid}
+                hostStalenessImmutableDefaults={hostStalenessImmutableDefaults}
+                hostStalenessConventionalDefaults={
+                  hostStalenessConventionalDefaults
                 }
-              >
-                <TabCard
-                  isEditing={isEditing}
-                  filter={filter}
-                  setFilter={setFilter}
-                  activeTabKey={1}
-                  newFormValues={newFormValues}
-                  setNewFormValues={setNewFormValues}
-                  isFormValid={isFormValid}
-                  setIsFormValid={setIsFormValid}
-                  hostStalenessImmutableDefaults={
-                    hostStalenessImmutableDefaults
-                  }
-                  hostStalenessConventionalDefaults={
-                    hostStalenessConventionalDefaults
-                  }
-                />
-              </Tab>
-            </Tabs>
+              />
+            )}
             {isEditing && (
               <Flex justifyContent={{ default: 'justifyContentFlexStart' }}>
                 <Button

diff --git a/src/components/InventoryHostStaleness/__test__/InventoryHostStaleness.test.js b/src/components/InventoryHostStaleness/__test__/InventoryHostStaleness.test.js
@@ -2,17 +2,36 @@ import React from 'react';
 import { render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import HostStalenessCard from '../HostStalenessCard';
+import { Provider } from 'react-redux';
+import { MemoryRouter } from 'react-router-dom';
+import { getStore } from '../../../store';
+import MockAdapter from 'axios-mock-adapter';
+import { instance } from '@redhat-cloud-services/frontend-components-utilities/interceptors';
 
-jest.mock('react-redux', () => {
-  return {
-    ...jest.requireActual('react-redux'),
-    useDispatch: () => {},
+describe('Table Renders', () => {
+  const mock = new MockAdapter(instance);
+  const stalenessData = {
+    conventional_staleness_delta: 86400,
+    conventional_stale_warning_delta: 604800,
+    conventional_culling_delta: 1209600,
+    immutable_staleness_delta: 172800,
+    immutable_stale_warning_delta: 1290600,
+    immutable_culling_delta: 15552000,
+    id: 'system_default',
   };
-});
 
-describe('Table Renders', () => {
   it('Renders table with two tabs and updates when edit is selected', () => {
-    render(<HostStalenessCard canModifyHostStaleness={true} />);
+    render(
+      <MemoryRouter>
+        <Provider store={getStore()}>
+          <HostStalenessCard canModifyHostStaleness={true} />
+        </Provider>
+      </MemoryRouter>
+    );
+    mock
+      .onGet(`/api/edge/v1/devices/devicesview?limit=1`)
+      .reply(200, { data: { total: 1 } });
+    mock.onGet('/api/inventory/v1/account/staleness').reply(200, stalenessData);
 
     expect(
       screen.getByRole('tab', { name: 'Conventional (RPM-DNF)' })

diff --git a/src/components/InventoryHostStaleness/constants.js b/src/components/InventoryHostStaleness/constants.js
@@ -33,6 +33,12 @@ export const hostStalenessApiKeys = [
   'immutable_culling_delta',
 ];
 
+export const conventionalApiKeys = [
+  'conventional_staleness_delta',
+  'conventional_stale_warning_delta',
+  'conventional_culling_delta',
+];
+
 export const daysToSecondsConversion = (days) => {
   return days * 86400;
 };
@@ -258,7 +264,7 @@ export const HostStalenessResetDefaultPopover = ({ activeTabKey }) => {
   );
 };
 
-export const InventoryHostStalenessPopover = () => {
+export const InventoryHostStalenessPopover = ({ hasEdgeSystems }) => {
   return (
     <Popover
       aria-label="Orginization level popover"
@@ -293,26 +299,29 @@ export const InventoryHostStalenessPopover = () => {
               - Systems are deleted after 14 days since last check-in.
             </span>
           </Flex>
-          <Flex
-            direction={{ default: 'column' }}
-            spaceItems={{ default: 'spaceItemsNone' }}
-          >
-            <span className="pf-u-font-size-sm">
-              Default for Immutable systems (OSTree):
-            </span>
-            <span className="pf-u-font-size-sm">
-              <p>
-                - Systems are marked as stale after 2 days since last check-in.
-              </p>
-            </span>
-            <span className="pf-u-font-size-sm">
-              - Systems are marked as stale warning after 120 days since last
-              check-in.
-            </span>
-            <span className="pf-u-font-size-sm">
-              - Systems are deleted after 180 days since last check-in.
-            </span>
-          </Flex>
+          {hasEdgeSystems && (
+            <Flex
+              direction={{ default: 'column' }}
+              spaceItems={{ default: 'spaceItemsNone' }}
+            >
+              <span className="pf-u-font-size-sm">
+                Default for Immutable systems (OSTree):
+              </span>
+              <span className="pf-u-font-size-sm">
+                <p>
+                  - Systems are marked as stale after 2 days since last
+                  check-in.
+                </p>
+              </span>
+              <span className="pf-u-font-size-sm">
+                - Systems are marked as stale warning after 120 days since last
+                check-in.
+              </span>
+              <span className="pf-u-font-size-sm">
+                - Systems are deleted after 180 days since last check-in.
+              </span>
+            </Flex>
+          )}
         </Flex>
       }
     >
@@ -574,3 +583,7 @@ export const formValidation = async (newFormValues, setIsFormValid) => {
 HostStalenessResetDefaultPopover.propTypes = {
   activeTabKey: PropTypes.number,
 };
+
+InventoryHostStalenessPopover.propTypes = {
+  hasEdgeSystems: PropTypes.bool,
+};