Conditionally hide UI components and enable inventory sync in IOP mode

nofaralfasi · nofaralfasi · commit 2cc7ef575397 · 2025-09-16T18:41:17.000+03:00
- Enable inventory synchronization in local advisor engine environments
- Hide cloud-specific UI elements when use_iop_mode is true
- Conditionally display settings based on iop mode

This allows inventory sync to run in IOP mode while hiding cloud-specific
UI components that are not relevant in local advisor engine environments.
diff --git a/lib/inventory_sync/async/inventory_hosts_sync.rb b/lib/inventory_sync/async/inventory_hosts_sync.rb
@@ -8,8 +8,6 @@ class InventoryHostsSync < QueryInventoryJob
       set_callback :step, :around, :create_missing_hosts
 
       def plan(organizations)
-        # Do not run for local advisor, since we use sub-man id to identify hosts.
-        return if ForemanRhCloud.with_iop_smart_proxy?
         # by default the tasks will be executed concurrently
         super(organizations)
         plan_self_host_sync
diff --git a/webpack/ForemanInventoryUpload/Components/PageHeader/PageHeader.js b/webpack/ForemanInventoryUpload/Components/PageHeader/PageHeader.js
@@ -6,26 +6,33 @@ import InventoryFilter from '../InventoryFilter';
 import ToolbarButtons from './components/ToolbarButtons';
 import SettingsWarning from './components/SettingsWarning';
 import PageTitle from './PageTitle';
+import { useAdvisorEngineConfig } from '../../../common/Hooks/ConfigHooks';
 import './PageHeader.scss';
 
-const PageHeader = () => (
-  <div className="inventory-upload-header">
-    <SettingsWarning />
-    <PageTitle />
-    <div className="inventory-upload-header-description">
-      <InventorySettings />
-      <PageDescription />
+const PageHeader = () => {
+  const useIopMode = useAdvisorEngineConfig();
+
+  return (
+    <div className="inventory-upload-header">
+      <SettingsWarning />
+      <PageTitle />
+      {!useIopMode && (
+        <div className="inventory-upload-header-description">
+          <InventorySettings />
+          <PageDescription />
+        </div>
+      )}
+      <Grid.Row>
+        <Grid.Col xs={4}>
+          <InventoryFilter />
+        </Grid.Col>
+        <Grid.Col xs={7} xsOffset={1}>
+          <ToolbarButtons />
+        </Grid.Col>
+      </Grid.Row>
     </div>
-    <Grid.Row>
-      <Grid.Col xs={4}>
-        <InventoryFilter />
-      </Grid.Col>
-      <Grid.Col xs={7} xsOffset={1}>
-        <ToolbarButtons />
-      </Grid.Col>
-    </Grid.Row>
-  </div>
-);
+  );
+};
 
 PageHeader.propTypes = {};
 
diff --git a/webpack/ForemanInventoryUpload/Components/PageHeader/__tests__/PageHeader.test.js b/webpack/ForemanInventoryUpload/Components/PageHeader/__tests__/PageHeader.test.js
@@ -1,13 +1,184 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { Provider } from 'react-redux';
+import configureMockStore from 'redux-mock-store';
+import thunk from 'redux-thunk';
 import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
-
 import PageHeader from '../PageHeader';
 
+// Mock child components to isolate PageHeader testing
+// This prevents child component complexity from affecting our tests
+jest.mock('../components/SettingsWarning', () => () => (
+  <div data-testid="settings-warning">SettingsWarning</div>
+));
+jest.mock('../PageTitle', () => () => (
+  <div data-testid="page-title">PageTitle</div>
+));
+jest.mock('../../InventorySettings', () => () => (
+  <div data-testid="inventory-settings">InventorySettings</div>
+));
+jest.mock('../components/PageDescription', () => () => (
+  <div data-testid="page-description">PageDescription</div>
+));
+jest.mock('../../InventoryFilter', () => () => (
+  <div data-testid="inventory-filter">InventoryFilter</div>
+));
+jest.mock('../components/ToolbarButtons', () => () => (
+  <div data-testid="toolbar-buttons">ToolbarButtons</div>
+));
+
+// Mock the hook since useAPI is mocked in tests and doesn't read from Redux
+jest.mock('../../../../common/Hooks/ConfigHooks', () => ({
+  useAdvisorEngineConfig: jest.fn(() => false),
+}));
+
+const {
+  useAdvisorEngineConfig,
+} = require('../../../../common/Hooks/ConfigHooks');
+
+const middlewares = [thunk];
+const mockStore = configureMockStore(middlewares);
+
+const baseStoreState = {
+  API: {
+    INVENTORY_SETTINGS: {
+      response: { subscriptionConnectionEnabled: true },
+    },
+  },
+  ForemanRhCloud: {
+    inventoryUpload: {
+      accountsList: {
+        CloudConnectorStatus: {},
+      },
+      syncStatus: {},
+      inventoryFilter: {
+        filterTerm: '',
+      },
+    },
+  },
+};
+
 const fixtures = {
   'render without Props': {},
   /** fixtures, props for the component */
 };
 
 describe('PageHeader', () => {
+  beforeEach(() => {
+    useAdvisorEngineConfig.mockReturnValue(false);
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
   describe('rendering', () =>
     testComponentSnapshotsWithFixtures(PageHeader, fixtures));
+
+  describe('component behavior', () => {
+    test('renders all components when not in IoP mode', () => {
+      const store = mockStore(baseStoreState);
+
+      render(
+        <Provider store={store}>
+          <PageHeader />
+        </Provider>
+      );
+
+      // All components should be present when not in IoP mode
+      expect(screen.getByTestId('settings-warning')).toBeTruthy();
+      expect(screen.getByTestId('page-title')).toBeTruthy();
+      expect(screen.getByTestId('inventory-settings')).toBeTruthy();
+      expect(screen.getByTestId('page-description')).toBeTruthy();
+      expect(screen.getByTestId('inventory-filter')).toBeTruthy();
+      expect(screen.getByTestId('toolbar-buttons')).toBeTruthy();
+    });
+
+    test('hides inventory settings and description when in IoP mode', () => {
+      useAdvisorEngineConfig.mockReturnValue(true);
+      const store = mockStore(baseStoreState);
+
+      render(
+        <Provider store={store}>
+          <PageHeader />
+        </Provider>
+      );
+
+      // Core components should still be present
+      expect(screen.getByTestId('settings-warning')).toBeTruthy();
+      expect(screen.getByTestId('page-title')).toBeTruthy();
+      expect(screen.getByTestId('inventory-filter')).toBeTruthy();
+      expect(screen.getByTestId('toolbar-buttons')).toBeTruthy();
+
+      // These components should be hidden in IoP mode
+      expect(screen.queryByTestId('inventory-settings')).toBeNull();
+      expect(screen.queryByTestId('page-description')).toBeNull();
+    });
+
+    test('renders with correct CSS class', () => {
+      const store = mockStore(baseStoreState);
+
+      const { container } = render(
+        <Provider store={store}>
+          <PageHeader />
+        </Provider>
+      );
+
+      expect(container.querySelector('.inventory-upload-header')).toBeTruthy();
+    });
+
+    test('renders grid layout with correct structure', () => {
+      const store = mockStore(baseStoreState);
+
+      const { container } = render(
+        <Provider store={store}>
+          <PageHeader />
+        </Provider>
+      );
+
+      // Check for grid row
+      const gridRow = container.querySelector('.row');
+      expect(gridRow).toBeTruthy();
+
+      // Check for grid columns with correct classes
+      const filterColumn = container.querySelector('.col-xs-4');
+      expect(filterColumn).toBeTruthy();
+
+      const toolbarColumn = container.querySelector('.col-xs-7');
+      expect(toolbarColumn).toBeTruthy();
+    });
+
+    test('renders description section only when not in IoP mode', () => {
+      const store = mockStore(baseStoreState);
+
+      const { container } = render(
+        <Provider store={store}>
+          <PageHeader />
+        </Provider>
+      );
+
+      // Description section should be present when not in IoP mode
+      const descriptionSection = container.querySelector(
+        '.inventory-upload-header-description'
+      );
+      expect(descriptionSection).toBeTruthy();
+    });
+
+    test('does not render description section when in IoP mode', () => {
+      useAdvisorEngineConfig.mockReturnValue(true);
+      const store = mockStore(baseStoreState);
+
+      const { container } = render(
+        <Provider store={store}>
+          <PageHeader />
+        </Provider>
+      );
+
+      // Description section should not be present in IoP mode
+      const descriptionSection = container.querySelector(
+        '.inventory-upload-header-description'
+      );
+      expect(descriptionSection).toBeNull();
+    });
+  });
 });
diff --git a/webpack/ForemanInventoryUpload/Components/PageHeader/__tests__/__snapshots__/PageHeader.test.js.snap b/webpack/ForemanInventoryUpload/Components/PageHeader/__tests__/__snapshots__/PageHeader.test.js.snap
@@ -4,13 +4,13 @@ exports[`PageHeader rendering render without Props 1`] = `
 <div
   className="inventory-upload-header"
 >
-  <ConnectedSettingsWarning />
-  <PageTitle />
+  <Component />
+  <Component />
   <div
     className="inventory-upload-header-description"
   >
-    <ConnectedInventorySettings />
-    <PageDescription />
+    <Component />
+    <Component />
   </div>
   <Row
     bsClass="row"
@@ -21,15 +21,15 @@ exports[`PageHeader rendering render without Props 1`] = `
       componentClass="div"
       xs={4}
     >
-      <Connect(InventoryFilter) />
+      <Component />
     </Col>
     <Col
       bsClass="col"
       componentClass="div"
       xs={7}
       xsOffset={1}
     >
-      <ToolbarButtons />
+      <Component />
     </Col>
   </Row>
 </div>
diff --git a/webpack/ForemanInventoryUpload/Components/PageHeader/components/ToolbarButtons/ToolbarButtons.js b/webpack/ForemanInventoryUpload/Components/PageHeader/components/ToolbarButtons/ToolbarButtons.js
@@ -4,19 +4,21 @@ import SyncButton from '../SyncButton';
 import CloudConnectorButton from '../CloudConnectorButton';
 import './toolbarButtons.scss';
 import { selectSubscriptionConnectionEnabled } from '../../../InventorySettings/InventorySettingsSelectors';
+import { useAdvisorEngineConfig } from '../../../../../common/Hooks/ConfigHooks';
 
 const ToolbarButtons = () => {
   const subscriptionConnectionEnabled = useSelector(
     selectSubscriptionConnectionEnabled
   );
+  const useIopMode = useAdvisorEngineConfig();
 
   if (!subscriptionConnectionEnabled) {
     return null;
   }
 
   return (
     <div className="inventory_toolbar_buttons">
-      <CloudConnectorButton />
+      {!useIopMode && <CloudConnectorButton />}
       <SyncButton />
     </div>
   );
diff --git a/webpack/ForemanInventoryUpload/Components/PageHeader/components/ToolbarButtons/__tests__/ToolbarButtons.test.js b/webpack/ForemanInventoryUpload/Components/PageHeader/components/ToolbarButtons/__tests__/ToolbarButtons.test.js
