katello 4.4.1 → 4.5.0

data/webpack/components/extensions/HostDetails/Tabs/ErrataTab/ErrataTab.js

@@ -1,8 +1,9 @@
 import React, { useCallback, useState } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import {
-  Button, Split, SplitItem, ActionList, ActionListItem, Dropdown,
+  Split, SplitItem, ActionList, ActionListItem, Dropdown,
   DropdownItem, KebabToggle, Skeleton, Tooltip, ToggleGroup, ToggleGroupItem,
+  DropdownToggle, DropdownToggleAction,
 } from '@patternfly/react-core';
 import { TimesIcon, CheckIcon } from '@patternfly/react-icons';
 import {
@@ -21,7 +22,7 @@ import IsoDate from 'foremanReact/components/common/dates/IsoDate';
 import { urlBuilder } from 'foremanReact/common/urlHelpers';
 import { propsToCamelCase } from 'foremanReact/common/helpers';
 import SelectableDropdown from '../../../../SelectableDropdown';
-import { useSet, useBulkSelect, useUrlParams } from '../../../../../components/Table/TableHooks';
+import { useSet, useBulkSelect, useUrlParams, useTableSort } from '../../../../../components/Table/TableHooks';
 import TableWrapper from '../../../../../components/Table/TableWrapper';
 import { ErrataType, ErrataSeverity } from '../../../../../components/Errata';
 import { getInstallableErrata, regenerateApplicability, applyViaKatelloAgent } from './HostErrataActions';
@@ -33,7 +34,18 @@ import { installErrata } from '../RemoteExecutionActions';
 import { errataInstallUrl } from '../customizedRexUrlHelpers';
 import './ErrataTab.scss';
 import hostIdNotReady from '../../HostDetailsActions';
-import { defaultRemoteActionMethod, KATELLO_AGENT } from '../../hostDetailsHelpers';
+import { defaultRemoteActionMethod,
+  hasRequiredPermissions as can,
+  missingRequiredPermissions as cannot,
+  KATELLO_AGENT,
+  userPermissionsFromHostDetails } from '../../hostDetailsHelpers';
+import SortableColumnHeaders from '../../../../Table/components/SortableColumnHeaders';
+import { useRexJobPolling } from '../RemoteExecutionHooks';
+
+const recalculateApplicability = ['edit_hosts'];
+const invokeRexJobs = ['create_job_invocations'];
+const doKatelloAgentActions = ['edit_hosts'];
+const createBookmarks = ['create_bookmarks'];
 
 export const ErrataTab = () => {
   const hostDetails = useSelector(state => selectAPIResponse(state, 'HOST_DETAILS'));
@@ -41,7 +53,14 @@ export const ErrataTab = () => {
     id: hostId,
     name: hostname,
     content_facet_attributes: contentFacetAttributes,
+    errata_status: errataStatus,
   } = hostDetails;
+  const userPermissions = userPermissionsFromHostDetails({ hostDetails });
+  const showRecalculate =
+    can(
+      recalculateApplicability,
+      userPermissions,
+    );
   const contentFacet = propsToCamelCase(contentFacetAttributes ?? {});
   const dispatch = useDispatch();
   const toggleGroupStates = ['all', 'installable'];
@@ -66,10 +85,17 @@ export const ErrataTab = () => {
   const activeFilters = [errataTypeSelected, errataSeveritySelected];
   const defaultFilters = [ERRATA_TYPE, ERRATA_SEVERITY];
 
-  const emptyContentTitle = __('This host does not have any installable errata.');
-  const emptyContentBody = __('Installable errata will appear here when available.');
+  const [isActionOpen, setIsActionOpen] = useState(false);
+  const onActionToggle = () => {
+    setIsActionOpen(prev => !prev);
+  };
+
+  const allUpToDate = errataStatus === 0;
+  const emptyContentTitle = allUpToDate ? __('All errata up-to-date') : __('This host has errata that are applicable, but not installable.');
+  const emptyContentBody = allUpToDate ? __('No action is needed because there are no applicable errata for this host.') : __("You may want to check the host's content view and lifecycle environment.");
   const emptySearchTitle = __('No matching errata found');
   const emptySearchBody = __('Try changing your search settings.');
+  const errorSearchTitle = __('Problem searching errata');
   const columnHeaders = [
     __('Errata'),
     __('Type'),
@@ -78,6 +104,21 @@ export const ErrataTab = () => {
     __('Synopsis'),
     __('Published date'),
   ];
+  const COLUMNS_TO_SORT_PARAMS = {
+    [columnHeaders[0]]: 'errata_id',
+    [columnHeaders[1]]: 'type',
+    [columnHeaders[2]]: 'severity',
+    [columnHeaders[5]]: 'updated',
+  };
+
+  const {
+    pfSortParams, apiSortParams,
+    activeSortColumn, activeSortDirection,
+  } = useTableSort({
+    allColumns: columnHeaders,
+    columnsToSortParams: COLUMNS_TO_SORT_PARAMS,
+    initialSortColumnName: 'Errata',
+  });
 
   const fetchItems = useCallback(
     (params) => {
@@ -93,16 +134,18 @@ export const ErrataTab = () => {
         hostId,
         {
           include_applicable: toggleGroupState === ALL,
+          ...apiSortParams,
           ...modifiedParams,
         },
       );
     },
     [hostId, toggleGroupState, ALL, ERRATA_SEVERITY, ERRATA_TYPE,
-      errataTypeSelected, errataSeveritySelected],
+      errataTypeSelected, errataSeveritySelected, apiSortParams],
   );
 
   const response = useSelector(state => selectAPIResponse(state, HOST_ERRATA_KEY));
   const { results, ...metadata } = response;
+  const { error: errorSearchBody } = metadata;
   const status = useSelector(state => selectHostErrataStatus(state));
   const errataSearchQuery = id => `errata_id = ${id}`;
   const {
@@ -116,23 +159,42 @@ export const ErrataTab = () => {
     initialSearchQuery: searchParam || '',
   });
 
-  if (!hostId) return <Skeleton />;
+  const installErrataAction = () => installErrata({
+    hostname, search: fetchBulkParams(),
+  });
+  const {
+    triggerJobStart: triggerBulkApply, lastCompletedJob: lastCompletedBulkApply,
+    isPolling: isBulkApplyInProgress,
+  } = useRexJobPolling(installErrataAction);
 
-  const applyErratumViaRemoteExecution = id => dispatch(installErrata({
+  const installErratumAction = id => installErrata({
     hostname,
     search: errataSearchQuery(id),
-  }));
+  });
+
+  const {
+    triggerJobStart: triggerApply, lastCompletedJob: lastCompletedApply,
+    isPolling: isApplyInProgress,
+  } = useRexJobPolling(installErratumAction);
+
+  const actionInProgress = (isApplyInProgress || isBulkApplyInProgress);
+  const disabledReason = __('A remote execution job is in progress');
+
+  const tdSelect = useCallback((errataId, rowIndex, rexJobInProgress) => ({
+    disable: rexJobInProgress || !isSelectable(errataId),
+    isSelected: isSelected(errataId),
+    onSelect: (event, selected) => selectOne(selected, errataId),
+    rowIndex,
+    variant: 'checkbox',
+  }), [isSelectable, isSelected, selectOne]);
+
+  if (!hostId) return <Skeleton />;
+
+  const applyErratumViaRemoteExecution = id => triggerApply(id);
 
   const applyViaRemoteExecution = () => {
-    dispatch(installErrata({
-      hostname, search: fetchBulkParams(),
-    }));
-
-    const params = { page: metadata.page, per_page: metadata.per_page, search: metadata.search };
-    dispatch(getInstallableErrata(
-      hostId,
-      { ...params, include_applicable: toggleGroupState === ALL },
-    ));
+    triggerBulkApply();
+    selectNone();
   };
 
   const bulkCustomizedRexUrl = () => errataInstallUrl({
@@ -157,6 +219,10 @@ export const ErrataTab = () => {
   ));
 
   const defaultRemoteAction = defaultRemoteActionMethod({ hostDetails });
+  const showActions = defaultRemoteAction === KATELLO_AGENT ?
+    can(doKatelloAgentActions, userPermissions) :
+    can(invokeRexJobs, userPermissions);
+
   const apply = () => {
     if (defaultRemoteAction === KATELLO_AGENT) {
       applyByKatelloAgent();
@@ -165,7 +231,10 @@ export const ErrataTab = () => {
     }
   };
 
-  const dropdownItems = [
+  const readOnlyBookmarks =
+  cannot(createBookmarks, userPermissionsFromHostDetails({ hostDetails }));
+
+  const dropdownKebabItems = [
     <DropdownItem
       aria-label="bulk_add"
       key="bulk_add"
@@ -176,20 +245,7 @@ export const ErrataTab = () => {
     </DropdownItem>,
   ];
 
-  if (defaultRemoteAction === KATELLO_AGENT) {
-    dropdownItems.push((
-      <DropdownItem
-        aria-label="apply_via_katello_agent"
-        key="apply_via_katello_agent"
-        component="button"
-        onClick={applyByKatelloAgent}
-        isDisabled={selectedCount === 0}
-      >
-        {__('Apply via Katello agent')}
-      </DropdownItem>));
-  }
-
-  dropdownItems.push((
+  const dropdownItems = [
     <DropdownItem
       aria-label="apply_via_remote_execution"
       key="apply_via_remote_execution"
@@ -198,9 +254,7 @@ export const ErrataTab = () => {
       isDisabled={selectedCount === 0}
     >
       {__('Apply via remote execution')}
-    </DropdownItem>));
-
-  dropdownItems.push((
+    </DropdownItem>,
     <DropdownItem
       aria-label="apply_via_customized_remote_execution"
       key="apply_via_customized_remote_execution"
@@ -209,7 +263,21 @@ export const ErrataTab = () => {
       isDisabled={selectedCount === 0}
     >
       {__('Apply via customized remote execution')}
-    </DropdownItem>));
+    </DropdownItem>,
+  ];
+
+  if (defaultRemoteAction === KATELLO_AGENT) {
+    dropdownItems.unshift((
+      <DropdownItem
+        aria-label="apply_via_katello_agent"
+        key="apply_via_katello_agent"
+        component="button"
+        onClick={applyByKatelloAgent}
+        isDisabled={selectedCount === 0}
+      >
+        {__('Apply via Katello agent')}
+      </DropdownItem>));
+  }
 
   const handleErrataTypeSelected = newType => setErrataTypeSelected((prevType) => {
     if (prevType === newType) {
@@ -225,27 +293,47 @@ export const ErrataTab = () => {
     return newSeverity;
   });
 
-  const actionButtons = (
+  const actionButtons = showActions ? (
     <>
       <Split hasGutter>
         <SplitItem>
           <ActionList isIconList>
             <ActionListItem>
-              <Button isDisabled={selectedCount === 0} onClick={apply}> {__('Apply')} </Button>
+              <Dropdown
+                aria-label="errata_dropdown"
+                toggle={
+                  <DropdownToggle
+                    aria-label="expand_errata_toggle"
+                    splitButtonItems={[
+                      <DropdownToggleAction key="action" aria-label="bulk_actions" onClick={apply}>
+                        {__('Apply')}
+                      </DropdownToggleAction>,
+                    ]}
+                    splitButtonVariant="action"
+                    toggleVariant="primary"
+                    onToggle={onActionToggle}
+                    isDisabled={selectedCount === 0}
+                  />
+              }
+                isOpen={isActionOpen}
+                dropdownItems={dropdownItems}
+              />
             </ActionListItem>
+            {showRecalculate &&
             <ActionListItem>
               <Dropdown
-                toggle={<KebabToggle aria-label="bulk_actions" onToggle={toggleBulkAction} />}
+                toggle={<KebabToggle aria-label="bulk_actions_kebab" onToggle={toggleBulkAction} />}
                 isOpen={isBulkActionOpen}
                 isPlain
-                dropdownItems={dropdownItems}
+                dropdownItems={dropdownKebabItems}
               />
             </ActionListItem>
+            }
           </ActionList>
         </SplitItem>
       </Split>
     </>
-  );
+  ) : null;
 
   const hostIsNonLibrary = (
     contentFacet?.contentViewDefault === false && contentFacet.lifecycleEnvironmentLibrary === false
@@ -260,6 +348,7 @@ export const ErrataTab = () => {
           items={Object.values(ERRATA_TYPES)}
           selected={errataTypeSelected}
           setSelected={handleErrataTypeSelected}
+          isDisabled={!results?.length}
         />
       </SplitItem>
       <SplitItem>
@@ -270,6 +359,7 @@ export const ErrataTab = () => {
           items={Object.values(ERRATA_SEVERITIES)}
           selected={errataSeveritySelected}
           setSelected={handleErrataSeveritySelected}
+          isDisabled={!results?.length}
         />
       </SplitItem>
       {hostIsNonLibrary &&
@@ -282,7 +372,6 @@ export const ErrataTab = () => {
               isSelected={toggleGroupState === ALL}
               onChange={() => setToggleGroupState(ALL)}
             />
-
             <ToggleGroupItem
               text={__('Installable')}
               buttonId="installableToggle"
@@ -306,6 +395,8 @@ export const ErrataTab = () => {
             emptyContentBody,
             emptySearchTitle,
             emptySearchBody,
+            errorSearchTitle,
+            errorSearchBody,
             status,
             activeFilters,
             defaultFilters,
@@ -317,22 +408,31 @@ export const ErrataTab = () => {
             toggleGroup,
           }
           }
+          happyEmptyContent={allUpToDate}
+          ouiaId="host-errata-table"
           additionalListeners={[
-            hostId, toggleGroupState, errataTypeSelected, errataSeveritySelected]}
+            hostId, toggleGroupState, errataTypeSelected,
+            errataSeveritySelected, activeSortColumn, activeSortDirection,
+            lastCompletedApply, lastCompletedBulkApply]}
           fetchItems={fetchItems}
+          bookmarkController="katello_errata"
+          readOnlyBookmarks={readOnlyBookmarks}
           autocompleteEndpoint={`/hosts/${hostId}/errata/auto_complete_search`}
           foremanApiAutoComplete
           rowsCount={results?.length}
           variant={TableVariant.compact}
           {...selectAll}
-          displaySelectAllCheckbox
+          displaySelectAllCheckbox={showActions}
         >
           <Thead>
             <Tr>
               <Th key="expand-carat" />
               <Th key="select-all" />
-              {columnHeaders.map(col =>
-                <Th key={col}>{col}</Th>)}
+              <SortableColumnHeaders
+                columnHeaders={columnHeaders}
+                pfSortParams={pfSortParams}
+                columnsToSortParams={COLUMNS_TO_SORT_PARAMS}
+              />
               <Th key="action-menu" />
             </Tr>
           </Thead>
@@ -353,6 +453,7 @@ export const ErrataTab = () => {
                   {
                     title: __('Apply via remote execution'),
                     onClick: () => applyErratumViaRemoteExecution(errataId),
+                    isDisabled: actionInProgress,
                   },
                   {
                     title: __('Apply via customized remote execution'),
@@ -387,14 +488,12 @@ export const ErrataTab = () => {
                         onToggle: (_event, _rInx, isOpen) => expandedErrata.onToggle(isOpen, id),
                       }}
                     />
-                    <Td select={{
-                      disable: !isSelectable(errataId),
-                      isSelected: isSelected(errataId),
-                      onSelect: (event, selected) => selectOne(selected, errataId),
-                      rowIndex,
-                      variant: 'checkbox',
-                    }}
-                    />
+                    {showActions ? (
+                      <Td
+                        select={tdSelect(errataId, rowIndex, actionInProgress)}
+                        title={actionInProgress && disabledReason}
+                      />
+                    ) : null}
                     <Td>
                       <a href={urlBuilder(`errata/${id}`, '')}>{errataId}</a>
                     </Td>
@@ -418,25 +517,30 @@ export const ErrataTab = () => {
                     </Td>
                     <Td><TableText wrapModifier="truncate">{title}</TableText></Td>
                     <Td key={publishedAt}><IsoDate date={publishedAt} /></Td>
-                    <Td
-                      key={`rowActions-${id}`}
-                      actions={{
-                        items: rowActions,
-                      }}
-
-                    />
+                    {showActions ? (
+                      <Td
+                        key={`rowActions-${id}`}
+                        actions={{
+                          items: rowActions,
+                        }}
+                      />
+                    ) : null}
                   </Tr>
                   <Tr key="child_row" isExpanded={isExpanded}>
-                    <Td colSpan={3}>
-                      <ExpandableRowContent>
-                        <ErratumExpansionContents erratum={erratum} />
-                      </ExpandableRowContent>
-                    </Td>
-                    <Td colSpan={4}>
-                      <ExpandableRowContent>
-                        <ErratumExpansionDetail erratum={erratum} />
-                      </ExpandableRowContent>
-                    </Td>
+                    {isExpanded && (
+                      <>
+                        <Td colSpan={3}>
+                          <ExpandableRowContent>
+                            <ErratumExpansionContents erratum={erratum} />
+                          </ExpandableRowContent>
+                        </Td>
+                        <Td colSpan={4}>
+                          <ExpandableRowContent>
+                            <ErratumExpansionDetail erratum={erratum} />
+                          </ExpandableRowContent>
+                        </Td>
+                      </>
+                    )}
                   </Tr>
                 </Tbody>
               );

data/webpack/components/extensions/HostDetails/Tabs/ErrataTab/HostErrataActions.js

@@ -1,13 +1,7 @@
 import { API_OPERATIONS, get, put } from 'foremanReact/redux/API';
 import { foremanApi } from '../../../../../services/api';
 import { HOST_ERRATA_KEY, HOST_ERRATA_APPLICABILITY_KEY, HOST_ERRATA_APPLY_KEY } from './HostErrataConstants';
-import { getResponseErrorMsgs } from '../../../../../utils/helpers';
-import { renderTaskStartedToast } from '../../../../../scenes/Tasks/helpers';
-
-const errorToast = (error) => {
-  const message = getResponseErrorMsgs(error.response);
-  return message;
-};
+import { errorToast, renderTaskStartedToast } from '../../../../../scenes/Tasks/helpers';
 
 export const getInstallableErrata = (hostId, params) => get({
   type: API_OPERATIONS.GET,

data/webpack/components/extensions/HostDetails/Tabs/ModuleStreamsTab/ModuleStreamsActions.js

@@ -1,10 +1,8 @@
 import { API_OPERATIONS, get } from 'foremanReact/redux/API';
+import { errorToast } from '../../../../../scenes/Tasks/helpers';
 import { foremanApi } from '../../../../../services/api';
-import { getResponseErrorMsgs } from '../../../../../utils/helpers';
 import { MODULE_STREAMS_KEY } from './ModuleStreamsConstants';
 
-const errorToast = error => getResponseErrorMsgs(error.response);
-
 export const getHostModuleStreams = (hostId, params) => get({
   type: API_OPERATIONS.GET,
   key: MODULE_STREAMS_KEY,

data/webpack/components/extensions/HostDetails/Tabs/ModuleStreamsTab/ModuleStreamsConstants.js

@@ -1,3 +1,31 @@
 export const MODULE_STREAMS_KEY = 'MODULE_STREAMS';
 
+export const INSTALLED_STATE = {
+  UPGRADEABLE: 'Upgradable',
+  UPTODATE: 'Up-to-date',
+  NOTINSTALLED: 'Not installed',
+};
+
+export const HOST_MODULE_STREAM_STATUSES = {
+  ENABLED: 'Enabled',
+  INSTALLED: 'Installed',
+  DISABLED: 'Disabled',
+  UNKNOWN: 'Unknown',
+  UPGRADABLE: 'Upgradable',
+};
+
+export const STATUS_PARAM_TO_FRIENDLY_NAME = {
+  enabled: 'Enabled',
+  installed: 'Installed',
+  disabled: 'Disabled',
+  unknown: 'Unknown',
+  upgradable: 'Upgradable',
+};
+
+export const INSTALL_STATUS_PARAM_TO_FRIENDLY_NAME = {
+  not_installed: 'Not installed',
+  up_to_date: 'Up-to-date',
+  upgradable: 'Upgradable',
+};
+
 export default MODULE_STREAMS_KEY;