katello 4.3.0 → 4.4.0.rc1

data/webpack/components/Table/TableHooks.js

@@ -1,5 +1,7 @@
 import { useState, useRef, useEffect, useCallback } from 'react';
 import { isEmpty } from 'lodash';
+import { useLocation } from 'react-router-dom';
+import { friendlySearchParam } from '../../utils/helpers';
 
 class ReactConnectedSet extends Set {
   constructor(initialValue, forceRender) {
@@ -68,6 +70,7 @@ export const useSelectionSet = ({
   const pageIds = results?.map(result => result[idColumn]) ?? [];
   const selectableResults = results?.filter(result => isSelectable(result)) ?? [];
   const selectableIds = new Set(selectableResults.map(result => result[idColumn]));
+  const selectedResults = useRef({}); // { id: result }
   const canSelect = id => selectableIds.has(id);
   const areAllRowsOnPageSelected = () =>
     Number(pageIds?.length) > 0 &&
@@ -76,13 +79,28 @@ export const useSelectionSet = ({
   const areAllRowsSelected = () =>
     Number(selectionSet.size) > 0 && selectionSet.size === Number(metadata.selectable);
 
-  const selectPage = () => selectionSet.addAll(pageIds.filter(canSelect));
-  const selectNone = () => selectionSet.clear();
-  const selectOne = (isSelected, id) => {
+  const selectPage = () => {
+    const selectablePageIds = pageIds.filter(canSelect);
+    selectionSet.addAll(selectablePageIds);
+    // eslint-disable-next-line no-restricted-syntax
+    for (const result of selectableResults) {
+      selectedResults.current[result[idColumn]] = result;
+    }
+  };
+  const clearSelectedResults = () => {
+    selectedResults.current = {};
+  };
+  const selectNone = () => {
+    selectionSet.clear();
+    clearSelectedResults();
+  };
+  const selectOne = (isSelected, id, data) => {
     if (canSelect(id)) {
       if (isSelected) {
+        if (data) selectedResults.current[id] = data;
         selectionSet.add(id);
       } else {
+        delete selectedResults.current[id];
         selectionSet.delete(id);
       }
     }
@@ -102,6 +120,8 @@ export const useSelectionSet = ({
     isSelected,
     isSelectable: canSelect,
     selectionSet,
+    selectedResults: Object.values(selectedResults.current),
+    clearSelectedResults,
   };
 };
 
@@ -117,6 +137,7 @@ export const useBulkSelect = ({
   results,
   metadata,
   initialArry = [],
+  initialSearchQuery = '',
   idColumn = 'id',
   isSelectable,
 }) => {
@@ -125,7 +146,7 @@ export const useBulkSelect = ({
                   results, metadata, initialArry, idColumn, isSelectable,
                 });
   const exclusionSet = useSet([]);
-  const [searchQuery, updateSearchQuery] = useState('');
+  const [searchQuery, updateSearchQuery] = useState(initialSearchQuery);
   const [selectAllMode, setSelectAllMode] = useState(false);
   const selectedCount = selectAllMode ?
     Number(metadata.selectable) - exclusionSet.size : selectOptions.selectedCount;
@@ -155,9 +176,10 @@ export const useBulkSelect = ({
     setSelectAllMode(false);
     exclusionSet.clear();
     inclusionSet.clear();
-  }, [exclusionSet, inclusionSet]);
+    selectOptions.clearSelectedResults();
+  }, [exclusionSet, inclusionSet, selectOptions]);
 
-  const selectOne = (isRowSelected, id) => {
+  const selectOne = (isRowSelected, id, data) => {
     if (selectAllMode) {
       if (isRowSelected) {
         exclusionSet.delete(id);
@@ -165,7 +187,7 @@ export const useBulkSelect = ({
         exclusionSet.add(id);
       }
     } else {
-      selectOptions.selectOne(isRowSelected, id);
+      selectOptions.selectOne(isRowSelected, id, data);
     }
   };
 
@@ -219,3 +241,20 @@ export const useBulkSelect = ({
     areAllRowsSelected,
   };
 };
+
+// takes a url query like ?type=security&search=name+~+foo
+// and returns an object
+// {
+//   type: 'security',
+//   searchParam: 'name ~ foo'
+// }
+export const useUrlParams = () => {
+  const location = useLocation();
+  const { search: urlSearchParam, ...urlParams }
+    = Object.fromEntries(new URLSearchParams(location.search).entries());
+  const searchParam = urlSearchParam ? friendlySearchParam(urlSearchParam) : '';
+  return {
+    searchParam,
+    ...urlParams,
+  };
+};

data/webpack/components/Table/TableWrapper.js

@@ -26,6 +26,7 @@ const TableWrapper = ({
   foremanApiAutoComplete,
   searchQuery,
   updateSearchQuery,
+  searchPlaceholderText,
   additionalListeners,
   activeFilters,
   displaySelectAllCheckbox,
@@ -35,6 +36,8 @@ const TableWrapper = ({
   areAllRowsOnPageSelected,
   areAllRowsSelected,
   selectedCount,
+  selectedResults,
+  clearSelectedResults,
   emptySearchBody,
   disableSearch,
   nodesBelowSearch,
@@ -182,10 +185,12 @@ const TableWrapper = ({
             <Search
               isDisabled={unresolvedStatusOrNoRows && !searchQuery}
               patternfly4
+              initialInputValue={searchQuery && searchQuery}
               onSearch={search => updateSearchQuery(search)}
               getAutoCompleteParams={getAutoCompleteParams}
               foremanApiAutoComplete={foremanApiAutoComplete}
               bookmarkController={bookmarkController}
+              placeholder={searchPlaceholderText}
             />
           </FlexItem>
         }
@@ -260,6 +265,7 @@ TableWrapper.propTypes = {
   }),
   autocompleteEndpoint: PropTypes.string.isRequired,
   foremanApiAutoComplete: PropTypes.bool,
+  searchPlaceholderText: PropTypes.string,
   actionButtons: PropTypes.node,
   toggleGroup: PropTypes.node,
   children: PropTypes.node,
@@ -279,6 +285,8 @@ TableWrapper.propTypes = {
   ])),
   displaySelectAllCheckbox: PropTypes.bool,
   selectedCount: PropTypes.number,
+  selectedResults: PropTypes.arrayOf(PropTypes.object),
+  clearSelectedResults: PropTypes.func,
   selectAll: PropTypes.func,
   selectNone: PropTypes.func,
   selectPage: PropTypes.func,
@@ -297,13 +305,16 @@ TableWrapper.defaultProps = {
   activeFilters: [],
   defaultFilters: [],
   foremanApiAutoComplete: false,
+  searchPlaceholderText: undefined,
   actionButtons: null,
   toggleGroup: null,
   displaySelectAllCheckbox: false,
   selectedCount: 0,
-  selectAll: noop,
-  selectNone: noop,
-  selectPage: noop,
+  selectedResults: [],
+  clearSelectedResults: noop,
+  selectAll: undefined,
+  selectNone: undefined,
+  selectPage: undefined,
   areAllRowsOnPageSelected: noop,
   areAllRowsSelected: noop,
   emptySearchBody: __('Try changing your search settings.'),

data/webpack/components/TypeAhead/TypeAhead.js

@@ -22,6 +22,7 @@ const TypeAhead = ({
   autoSearchEnabled,
   autoSearchDelay,
   bookmarkController,
+  placeholder,
 }) => {
   const [inputValue, setInputValue] = useState(initialInputValue);
 
@@ -79,6 +80,7 @@ const TypeAhead = ({
           onSearch,
           items,
           activeItems,
+          placeholder,
           shouldShowItems: isOpen && items.length > 0,
         };
 
@@ -86,7 +88,7 @@ const TypeAhead = ({
           <div>
             {patternfly4 ?
               <TypeAheadSearchPf4 autoSearchEnabled={autoSearchEnabled} {...typeAheadProps} /> :
-              <TypeAheadSearch actionText={actionText} {...typeAheadProps} />}
+              <TypeAheadSearch actionText={actionText} {...typeAheadProps} placeholder={null} />}
           </div>
         );
       }}
@@ -112,6 +114,7 @@ TypeAhead.propTypes = {
   autoSearchEnabled: PropTypes.bool.isRequired,
   autoSearchDelay: PropTypes.number,
   bookmarkController: PropTypes.string,
+  placeholder: PropTypes.string,
 };
 
 TypeAhead.defaultProps = {
@@ -121,6 +124,7 @@ TypeAhead.defaultProps = {
   isDisabled: undefined,
   autoSearchDelay: 500,
   bookmarkController: undefined,
+  placeholder: undefined,
 };
 
 export default TypeAhead;

data/webpack/components/TypeAhead/pf4Search/TypeAheadInput.js

@@ -8,7 +8,7 @@ import { commonInputPropTypes } from '../helpers/commonPropTypes';
 import './TypeAheadInput.scss';
 
 const TypeAheadInput = ({
-  onKeyPress, onInputFocus, passedProps, isDisabled, autoSearchEnabled,
+  onKeyPress, onInputFocus, passedProps, isDisabled, autoSearchEnabled, placeholder,
 }) => {
   const inputRef = useRef(null);
   const {
@@ -33,6 +33,7 @@ const TypeAheadInput = ({
         onChange={onChangeWrapper}
         type="search"
         iconVariant={autoSearchEnabled && 'search'}
+        placeholder={placeholder}
       />
       {
         value && (
@@ -50,10 +51,12 @@ TypeAheadInput.propTypes = {
   isDisabled: PropTypes.bool,
   autoSearchEnabled: PropTypes.bool.isRequired,
   ...commonInputPropTypes,
+  placeholder: PropTypes.string,
 };
 
 TypeAheadInput.defaultProps = {
   isDisabled: undefined,
+  placeholder: '',
 };
 
 export default TypeAheadInput;

data/webpack/components/TypeAhead/pf4Search/TypeAheadSearch.js

@@ -12,7 +12,7 @@ import Bookmark from './../../../components/Bookmark';
 const TypeAheadSearch = ({
   userInputValue, clearSearch, getInputProps, getItemProps, isOpen, highlightedIndex,
   selectedItem, selectItem, openMenu, onSearch, items, activeItems, shouldShowItems,
-  autoSearchEnabled, isDisabled, bookmarkController, inputValue,
+  autoSearchEnabled, isDisabled, bookmarkController, inputValue, placeholder,
 }) => (
   <>
     <InputGroup>
@@ -34,6 +34,7 @@ const TypeAheadSearch = ({
         onInputFocus={openMenu}
         passedProps={{ ...getInputProps(), clearSearch }}
         autoSearchEnabled={autoSearchEnabled}
+        placeholder={placeholder}
       />
       <>
         {bookmarkController &&

data/webpack/components/extensions/HostDetails/Cards/ContentViewDetailsCard.js

@@ -26,7 +26,7 @@ const HostContentViewDetails = ({
   }
 
   return (
-    <GridItem rowSpan={2} md={6} lg={4}>
+    <GridItem rowSpan={1} md={6} lg={4} xl2={3} >
       <Card isHoverable>
         <CardHeader>
           <CardTitle>{__('Content view details')}</CardTitle>

data/webpack/components/extensions/HostDetails/Cards/ErrataOverviewCard.js

@@ -8,7 +8,6 @@ import {
   FlexItem,
   GridItem,
 } from '@patternfly/react-core';
-import { urlBuilder } from 'foremanReact/common/urlHelpers';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { propsToCamelCase } from 'foremanReact/common/helpers';
 import PropTypes from 'prop-types';
@@ -30,7 +29,7 @@ function HostInstallableErrata({
     w: 'enhancements', x: 'enhancement', y: errataEnhance, z: errataTotal,
   }];
   return (
-    <GridItem rowSpan={2} md={3} lg={4}>
+    <GridItem rowSpan={1} md={6} lg={4} xl2={3} >
       <Card isHoverable>
         <CardHeader>
           <CardTitle>{__('Installable Errata')}</CardTitle>
@@ -38,7 +37,7 @@ function HostInstallableErrata({
         <CardBody>
           <Flex direction="column">
             <FlexItem>
-              <a href={urlBuilder(`content_hosts/${id}/errata`, '')}>
+              <a href="#/Content/errata">
                 {errataTotal} errata
               </a>
             </FlexItem>
@@ -61,7 +60,7 @@ function HostInstallableErrata({
                   />
                 </div>
               </div>
-              <div className="erratalegend">
+              <div className="erratalegend" style={{ minWidth: '140px' }}>
                 <FlexItem>
                   <ErrataMapper data={chartData} id={id} />
                 </FlexItem>

data/webpack/components/extensions/HostDetails/HostDetailsActions.js

@@ -0,0 +1,2 @@
+const hostIdNotReady = { type: 'NOOP_HOST_ID_NOT_READY' };
+export default hostIdNotReady;

data/webpack/components/extensions/HostDetails/HostPackages/HostPackagesActions.js

@@ -1,6 +1,13 @@
-import { API_OPERATIONS, get } from 'foremanReact/redux/API';
+import { API_OPERATIONS, get, put } from 'foremanReact/redux/API';
+import { renderTaskStartedToast } from '../../../../scenes/Tasks/helpers';
 import { foremanApi } from '../../../../services/api';
-import { HOST_PACKAGES_KEY } from './HostPackagesConstants';
+import { getResponseErrorMsgs } from '../../../../utils/helpers';
+import { HOST_PACKAGES_INSTALL_KEY, HOST_PACKAGES_KEY } from './HostPackagesConstants';
+
+const errorToast = (error) => {
+  const message = getResponseErrorMsgs(error.response);
+  return message;
+};
 
 export const getInstalledPackagesWithLatest = (hostId, params) => get({
   type: API_OPERATIONS.GET,
@@ -9,3 +16,12 @@ export const getInstalledPackagesWithLatest = (hostId, params) => get({
   params,
 });
 export default getInstalledPackagesWithLatest;
+
+export const installPackageViaKatelloAgent = (hostId, params) => put({
+  type: API_OPERATIONS.PUT,
+  key: HOST_PACKAGES_INSTALL_KEY,
+  url: foremanApi.getApiUrl(`/hosts/${hostId}/packages/install`),
+  handleSuccess: ({ data }) => renderTaskStartedToast(data),
+  errorToast: error => errorToast(error),
+  params,
+});

data/webpack/components/extensions/HostDetails/HostPackages/HostPackagesConstants.js

@@ -1,2 +1,14 @@
 export const HOST_PACKAGES_KEY = 'HOST_PACKAGES';
+export const HOST_PACKAGES_INSTALL_KEY = 'HOST_PACKAGES_KATELLO_AGENT_INSTALL';
+
+export const PACKAGES_VERSION_STATUSES = {
+  UPGRADABLE: 'Upgradable',
+  UP_TO_DATE: 'Up-to date',
+};
+
+export const VERSION_STATUSES_TO_PARAM = {
+  [PACKAGES_VERSION_STATUSES.UPGRADABLE]: 'upgradable',
+  [PACKAGES_VERSION_STATUSES.UP_TO_DATE]: 'up-to-date',
+};
+
 export default HOST_PACKAGES_KEY;

data/webpack/components/extensions/HostDetails/Tabs/ContentTab/SecondaryTabsRoutes.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Route, Switch, Redirect } from 'react-router-dom';
 import { PackagesTab } from '../PackagesTab';
-import { ErrataTab } from '../ErrataTab';
+import { ErrataTab } from '../ErrataTab/ErrataTab.js';
 import { route } from './helpers';
 
 const SecondaryTabRoutes = () => (

data/webpack/components/extensions/HostDetails/Tabs/{ErrataTab.js → ErrataTab/ErrataTab.js}

@@ -20,18 +20,20 @@ import { selectAPIResponse } from 'foremanReact/redux/API/APISelectors';
 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 } from '../../../../components/Table/TableHooks';
-import TableWrapper from '../../../../components/Table/TableWrapper';
-import { ErrataType, ErrataSeverity } from '../../../../components/Errata';
-import { getInstallableErrata, regenerateApplicability, applyViaKatelloAgent } from '../HostErrata/HostErrataActions';
+import SelectableDropdown from '../../../../SelectableDropdown';
+import { useSet, useBulkSelect, useUrlParams } from '../../../../../components/Table/TableHooks';
+import TableWrapper from '../../../../../components/Table/TableWrapper';
+import { ErrataType, ErrataSeverity } from '../../../../../components/Errata';
+import { getInstallableErrata, regenerateApplicability, applyViaKatelloAgent } from './HostErrataActions';
 import ErratumExpansionDetail from './ErratumExpansionDetail';
 import ErratumExpansionContents from './ErratumExpansionContents';
-import { selectHostErrataStatus } from '../HostErrata/HostErrataSelectors';
-import { HOST_ERRATA_KEY, ERRATA_TYPES, ERRATA_SEVERITIES, TYPES_TO_PARAM, SEVERITIES_TO_PARAM } from '../HostErrata/HostErrataConstants';
-import { installErrata } from './RemoteExecutionActions';
-import { errataInstallUrl } from './customizedRexUrlHelpers';
+import { selectHostErrataStatus } from './HostErrataSelectors';
+import { HOST_ERRATA_KEY, ERRATA_TYPES, ERRATA_SEVERITIES, TYPES_TO_PARAM, SEVERITIES_TO_PARAM, PARAM_TO_FRIENDLY_NAME } from './HostErrataConstants';
+import { installErrata } from '../RemoteExecutionActions';
+import { errataInstallUrl } from '../customizedRexUrlHelpers';
 import './ErrataTab.scss';
+import hostIdNotReady from '../../HostDetailsActions';
+import defaultRemoteActionMethod, { KATELLO_AGENT } from '../../hostDetailsHelpers';
 
 export const ErrataTab = () => {
   const hostDetails = useSelector(state => selectAPIResponse(state, 'HOST_DETAILS'));
@@ -46,14 +48,21 @@ export const ErrataTab = () => {
   const [ALL, INSTALLABLE] = toggleGroupStates;
   const ERRATA_TYPE = __('Type');
   const ERRATA_SEVERITY = __('Severity');
-  const [toggleGroupState, setToggleGroupState] = useState(INSTALLABLE);
-
   const [isBulkActionOpen, setIsBulkActionOpen] = useState(false);
   const toggleBulkAction = () => setIsBulkActionOpen(prev => !prev);
   const expandedErrata = useSet([]);
   const erratumIsExpanded = id => expandedErrata.has(id);
-  const [errataTypeSelected, setErrataTypeSelected] = useState(ERRATA_TYPE);
-  const [errataSeveritySelected, setErrataSeveritySelected] = useState(ERRATA_SEVERITY);
+  const {
+    type: initialType,
+    severity: initialSeverity,
+    show,
+    searchParam,
+  } = useUrlParams();
+  const [toggleGroupState, setToggleGroupState] = useState(show ?? INSTALLABLE);
+  const [errataTypeSelected, setErrataTypeSelected]
+    = useState(PARAM_TO_FRIENDLY_NAME[initialType] ?? ERRATA_TYPE);
+  const [errataSeveritySelected, setErrataSeveritySelected]
+    = useState(PARAM_TO_FRIENDLY_NAME[initialSeverity] ?? ERRATA_SEVERITY);
   const activeFilters = [errataTypeSelected, errataSeveritySelected];
   const defaultFilters = [ERRATA_TYPE, ERRATA_SEVERITY];
 
@@ -72,7 +81,7 @@ export const ErrataTab = () => {
 
   const fetchItems = useCallback(
     (params) => {
-      if (!hostId) return null;
+      if (!hostId) return hostIdNotReady;
       const modifiedParams = { ...params };
       if (errataTypeSelected !== ERRATA_TYPE) {
         modifiedParams.type = TYPES_TO_PARAM[errataTypeSelected];
@@ -104,6 +113,7 @@ export const ErrataTab = () => {
     metadata,
     idColumn: 'errata_id',
     isSelectable: result => result.installable,
+    initialSearchQuery: searchParam || '',
   });
 
   if (!hostId) return <Skeleton />;
@@ -146,13 +156,12 @@ export const ErrataTab = () => {
     { errata_ids: [id] },
   ));
 
-  const katelloAgentAvailable = (contentFacet.katelloAgentInstalled &&
-    contentFacet.katelloAgentEnabled);
+  const defaultRemoteAction = defaultRemoteActionMethod({ hostDetails });
   const apply = () => {
-    if (contentFacet.remoteExecutionByDefault || !katelloAgentAvailable) {
-      applyViaRemoteExecution();
-    } else {
+    if (defaultRemoteAction === KATELLO_AGENT) {
       applyByKatelloAgent();
+    } else {
+      applyViaRemoteExecution();
     }
   };
 
@@ -167,7 +176,7 @@ export const ErrataTab = () => {
     </DropdownItem>,
   ];
 
-  if (katelloAgentAvailable) {
+  if (defaultRemoteAction === KATELLO_AGENT) {
     dropdownItems.push((
       <DropdownItem
         aria-label="apply_via_katello_agent"
@@ -239,7 +248,7 @@ export const ErrataTab = () => {
   );
 
   const hostIsNonLibrary = (
-    !contentFacet.contentViewDefault && !contentFacet.lifecycleEnvironmentLibrary
+    contentFacet?.contentViewDefault === false && contentFacet.lifecycleEnvironmentLibrary === false
   );
   const toggleGroup = (
     <Split hasGutter>

data/webpack/components/extensions/HostDetails/{HostErrata → Tabs/ErrataTab}/HostErrataActions.js

@@ -1,8 +1,8 @@
 import { API_OPERATIONS, get, put } from 'foremanReact/redux/API';
-import { foremanApi } from '../../../../services/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';
+import { getResponseErrorMsgs } from '../../../../../utils/helpers';
+import { renderTaskStartedToast } from '../../../../../scenes/Tasks/helpers';
 
 const errorToast = (error) => {
   const message = getResponseErrorMsgs(error.response);

data/webpack/components/extensions/HostDetails/{HostErrata → Tabs/ErrataTab}/HostErrataConstants.js

@@ -29,6 +29,17 @@ export const SEVERITIES_TO_PARAM = {
   [ERRATA_SEVERITIES.CRITICAL]: 'Critical',
 };
 
+export const PARAM_TO_FRIENDLY_NAME = {
+  security: 'Security',
+  bugfix: 'Bugfix',
+  enhancement: 'Enhancement',
+  none: 'N/A',
+  low: 'Low',
+  moderate: 'Moderate',
+  important: 'Important',
+  critical: 'Critical',
+};
+
 export default HOST_ERRATA_KEY;
 
 export const ERRATA_SEARCH_QUERY = 'Errata search query';