Refs #36793 - Added TableHooks test and reorganized SelectAll to its …

…own directory

config/routes.rb

@@ -551,6 +551,7 @@
   end
 
   match 'host_statuses' => 'react#index', :via => :get
+  match 'new/hosts/auto_complete_search', :via => :get, to: 'hosts#auto_complete_search', as: "auto_complete_search_hosts_new"
   constraints(id: /[^\/]+/) do
     match 'new/hosts/:id' => 'react#index', :via => :get, :as => :host_details_page
   end

webpack/assets/javascripts/react_app/components/HostsIndex/index.js

@@ -5,7 +5,7 @@ import { Td } from '@patternfly/react-table';
 import { ToolbarItem } from '@patternfly/react-core';
 import { translate as __ } from '../../common/I18n';
 import TableIndexPage from '../PF4/TableIndexPage/TableIndexPage';
-import { ActionKebab } from '../PF4/TableIndexPage/ActionKebab';
+import { ActionKebab } from './ActionKebab';
 import { HOSTS_API_PATH, API_REQUEST_KEY } from '../../routes/Hosts/constants';
 import { selectKebabItems } from './Selectors';
 import { useAPI } from '../../common/hooks/API/APIHooks';
@@ -44,7 +44,7 @@ const HostsIndex = () => {
 
   const { fetchBulkParams, ...selectAllOptions } = useBulkSelect({
     results,
-    metadata: {},
+    metadata: { total, page },
     initialSearchQuery: apiSearchQuery || '',
   });
 

webpack/assets/javascripts/react_app/components/PF4/TableIndexPage/Table/SelectAllCheckbox.js → webpack/assets/javascripts/react_app/components/PF4/TableIndexPage/Table/SelectAllCheckbox/index.js

@@ -6,8 +6,8 @@ import {
   DropdownToggleCheckbox,
   DropdownItem,
 } from '@patternfly/react-core';
-import { translate as __ } from '../../../../common/I18n';
-import { noop } from '../../../../common/helpers';
+import { translate as __ } from '../../../../../common/I18n';
+import { noop } from '../../../../../common/helpers';
 
 import './SelectAllCheckbox.scss';
 

webpack/assets/javascripts/react_app/components/PF4/TableIndexPage/Table/TableHooks.js

@@ -93,7 +93,7 @@ export const useSelectionSet = ({
   const selectPage = () => {
     const selectablePageIds = pageIds.filter(canSelect);
     selectionSet.addAll(selectablePageIds);
-    selectableResults.forEach (result => {
+    selectableResults.forEach(result => {
       selectedResults.current[result[idColumn]] = result;
     });
   };
@@ -168,7 +168,7 @@ export const useBulkSelect = ({
   const [searchQuery, updateSearchQuery] = useState(initialSearchQuery);
   const [selectAllMode, setSelectAllMode] = useState(false);
   const selectedCount = selectAllMode
-    ? Number(metadata.selectable) - exclusionSet.size
+    ? Number(metadata.selectable || metadata.total) - exclusionSet.size
     : selectOptions.selectedCount;
 
   const areAllRowsOnPageSelected = () =>

webpack/assets/javascripts/react_app/components/PF4/TableIndexPage/Table/TableHooks.test.js

@@ -0,0 +1,99 @@
+import { act, renderHook } from '@testing-library/react-hooks';
+import { useBulkSelect } from './TableHooks';
+
+const isSelectable = () => true;
+const idColumn = 'errata_id';
+const metadata = {
+  error: null, selectable: 2, subtotal: 2, total: 2,
+};
+const results = [
+  {
+    errata_id: 'RHSA-2022:2031',
+    id: 311,
+    severity: 'Low',
+    type: 'security',
+  },
+  {
+    errata_id: 'RHSA-2022:2110',
+    id: 17,
+    severity: 'Low',
+    type: 'security',
+  },
+];
+
+it('returns a scoped search string based on inclusionSet', () => {
+  const { result } = renderHook(() => useBulkSelect({
+    results,
+    metadata,
+    idColumn,
+    isSelectable,
+  }));
+
+  act(() => {
+    result.current.selectOne(true, 'RHSA-2022:2031');
+  });
+
+  expect(result.current.fetchBulkParams()).toBe('errata_id ^ (RHSA-2022:2031)');
+});
+
+it('returns a scoped search string based on exclusionSet', () => {
+  const { result } = renderHook(() => useBulkSelect({
+    results,
+    metadata,
+    idColumn,
+    isSelectable,
+  }));
+
+  act(() => {
+    result.current.selectAll(true);
+  });
+
+  act(() => {
+    result.current.selectOne(false, 'RHSA-2022:2031');
+  });
+
+  expect(result.current.fetchBulkParams()).toBe('errata_id !^ (RHSA-2022:2031)');
+});
+
+it('adds search query to scoped search string based on exclusionSet', () => {
+  const { result } = renderHook(() => useBulkSelect({
+    results,
+    metadata,
+    idColumn,
+    isSelectable,
+  }));
+
+  act(() => {
+    result.current.updateSearchQuery('type=security');
+  });
+
+  act(() => {
+    result.current.selectAll(true);
+  });
+
+  act(() => {
+    result.current.selectOne(false, 'RHSA-2022:2031');
+  });
+
+  expect(result.current.fetchBulkParams()).toBe('type=security and errata_id !^ (RHSA-2022:2031)');
+});
+
+it('adds filter dropdown query to scoped search string', () => {
+  const { result } = renderHook(() => useBulkSelect({
+    results,
+    metadata,
+    idColumn,
+    isSelectable,
+    filtersQuery: 'severity=Low',
+  }));
+
+  act(() => {
+    result.current.selectAll(true);
+  });
+
+  act(() => {
+    result.current.selectOne(false, 'RHSA-2022:2031');
+  });
+
+  expect(result.current.fetchBulkParams()).toBe('severity=Low and errata_id !^ (RHSA-2022:2031)');
+});

webpack/assets/javascripts/react_app/components/PF4/TableIndexPage/TableIndexPage.test.js

@@ -37,14 +37,25 @@ const props = {
   exportable: true,
   creatable: true,
   hasHelpPage: true,
+  response: {
+    response: {
+      search: "",
+      can_create: true,
+      results: [{item: 1}],
+      total: 1,
+      per_page: 20,
+      page: 1,
+      subtotal: 1,
+    },
+  },
   children: <div>Content</div>,
   customActionButtons: [
     {
       title: 'Custom Action',
       action: { href: '/custom' },
     },
   ],
-  cutsomToolbarItems: <button>Custom button</button>,
+  customToolbarItems: <button>Custom button</button>,
 };
 Object.defineProperty(window, 'location', {
   value: { href: '/test?search=name=test' },

webpack/assets/javascripts/react_app/routes/__test__/__snapshots__/Routes.test.js.snap

@@ -14,6 +14,12 @@ exports[`Routes rendering routes with children renders routes with chidlren 1`]
       path="/models"
       render={[Function]}
     />
+    <Route
+      exact={true}
+      key="/new/hosts"
+      path="/new/hosts"
+      render={[Function]}
+    />
     <Route
       key="/new/hosts/:id"
       path="/new/hosts/:id"