katello 4.7.0 → 4.7.1

data/locale/zh_TW/katello.po

@@ -10,7 +10,7 @@
 #
 msgid ""
 msgstr ""
-"Project-Id-Version: katello 2.4.0-RC1\n"
+"Project-Id-Version: katello 4.7.0\n"
 "Report-Msgid-Bugs-To: \n"
 "PO-Revision-Date: 2017-12-19 20:14+0000\n"
 "Last-Translator: Bryan Kearney <bryan.kearney@gmail.com>, 2022\n"
@@ -1215,7 +1215,7 @@ msgstr ""
 msgid "Cannot set auto publish to a non-composite content view"
 msgstr ""
 
-msgid "Cannot skip metadata check on non-yum repositories."
+msgid "Cannot skip metadata check on non-yum/deb repositories."
 msgstr ""
 
 msgid "Cannot specify components for non-composite views"
@@ -1530,9 +1530,6 @@ msgstr ""
 msgid "Content source ID"
 msgstr ""
 
-msgid "Content source successfully updated."
-msgstr ""
-
 msgid "Content source was not set for host '%{host}'"
 msgstr ""
 
@@ -2726,7 +2723,7 @@ msgstr ""
 msgid "Force sync even if no upstream changes are detected. Non-yum repositories are skipped."
 msgstr ""
 
-msgid "Force sync even if no upstream changes are detected. Only used with yum repositories."
+msgid "Force sync even if no upstream changes are detected. Only used with yum or deb repositories."
 msgstr ""
 
 msgid "Forces a republish of the specified repository, regenerating metadata and symlinks on the filesystem."
@@ -2906,6 +2903,9 @@ msgstr ""
 msgid "Host collections updated"
 msgstr ""
 
+msgid "Host configurations are not updated yet"
+msgstr ""
+
 msgid "Host content and subscription details"
 msgstr "主機內容和訂閱詳細資料"
 
@@ -3170,6 +3170,9 @@ msgstr ""
 msgid "Ignorable content can be only set for Yum repositories."
 msgstr ""
 
+msgid "Ignore SRPMs can not be set in combination with 'Complete Mirroring' mirroring policy."
+msgstr ""
+
 msgid "Ignore errors"
 msgstr ""
 
@@ -4370,13 +4373,16 @@ msgstr "找不到主機集項目。"
 msgid "No host collections yet"
 msgstr ""
 
+msgid "No hosts found"
+msgstr ""
+
 msgid "No hosts have been specified."
 msgstr "未指定主機。"
 
 msgid "No hosts registered with subscription-manager found in selection."
 msgstr ""
 
-msgid "No hosts with content source found!"
+msgid "No hosts were specified"
 msgstr ""
 
 msgid "No installed packages and/or enabled repositories have been reported by %s."
@@ -5872,9 +5878,6 @@ msgstr ""
 msgid "Run Sync Plan:"
 msgstr ""
 
-msgid "Run job invocation"
-msgstr ""
-
 msgid "Running"
 msgstr "執行中"
 
@@ -7106,7 +7109,7 @@ msgstr ""
 msgid "This organization has Simple Content Access enabled. Hosts are not required to have subscriptions attached to access repositories. {br} Learn more about your overall subscription usage with the {subscriptionsService}."
 msgstr ""
 
-msgid "This organization is not using {scaLink}. Entitlement-based subscription management is deprecated and will be removed in a future version."
+msgid "This organization is not using {scaLink}. Legacy subscription management is deprecated and will be removed in a future version."
 msgstr ""
 
 msgid "This repository is not suggested. Please see additional %(anchorBegin)sdocumentation%(anchorEnd)s prior to use."
@@ -7160,6 +7163,12 @@ msgstr "提示"
 msgid "To get started, add this host to a host collection."
 msgstr ""
 
+msgid "To update the selected host configuration, update hosts manually in the next section."
+msgstr ""
+
+msgid "To update the selected host configuration, {link}, or update hosts manually in the next section."
+msgstr ""
+
 msgid "Toggling Simple Content Access will refresh your manifest."
 msgstr ""
 
@@ -7808,9 +7817,6 @@ msgstr ""
 msgid "Warning"
 msgstr "警告"
 
-msgid "What's next?"
-msgstr ""
-
 msgid "When \"Releases/Distributions\" is set, \"Upstream URL\" must also be set!"
 msgstr ""
 
@@ -8651,6 +8657,9 @@ msgstr "單一資源回應的根節點（選用）"
 msgid "rule identifier"
 msgstr "規則識別子"
 
+msgid "run job invocation"
+msgstr ""
+
 msgid "service level"
 msgstr "服務等級"
 
@@ -8705,9 +8714,6 @@ msgstr "Red Hat 供應者的以下屬性可以更新：[ %s ]"
 msgid "to"
 msgstr ""
 
-msgid "to update configuration on all hosts, or"
-msgstr ""
-
 msgid "true if the latest version of the component's content view is desired"
 msgstr ""
 
@@ -8735,9 +8741,6 @@ msgstr ""
 msgid "update a filter"
 msgstr "更新篩選器"
 
-msgid "update configuration on the hosts manually:"
-msgstr ""
-
 msgid "updating package group..."
 msgstr "正在更新套件群組..."
 

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

@@ -2,7 +2,7 @@ import React, { useState, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { useDispatch, useSelector } from 'react-redux';
-import { Modal, Button, Select, SelectOption, Alert, Flex } from '@patternfly/react-core';
+import { Modal, Button, SelectOption, Alert, Flex } from '@patternfly/react-core';
 import {
   global_palette_black_600 as pfDescriptionColor,
 } from '@patternfly/react-tokens';
@@ -20,6 +20,7 @@ import ContentViewIcon from '../../../../../scenes/ContentViews/components/Conte
 import updateHostContentViewAndEnvironment from './HostContentViewActions';
 import HOST_CV_AND_ENV_KEY from './HostContentViewConstants';
 import { getHostDetails } from '../../HostDetailsActions';
+import ContentViewSelect from '../../../../../scenes/ContentViews/components/ContentViewSelect/ContentViewSelect';
 
 const ENV_PATH_OPTIONS = { key: ENVIRONMENT_PATHS_KEY };
 
@@ -183,19 +184,13 @@ const ChangeHostCVModal = ({
         isDisabled={hostUpdateStatus === STATUS.PENDING}
       />
       {selectedEnvForHost.length > 0 &&
-      <div style={{ marginTop: '1em' }}>
-        <h3>{__('Select content view')}</h3>
-        <Select
+        <ContentViewSelect
           selections={selectedCVForHost}
+          onClear={() => setSelectedCVForHost(null)}
           onSelect={handleCVSelect}
           isOpen={cvSelectOpen}
-          menuAppendTo="parent"
           isDisabled={contentViewsInEnv.length === 0 || hostUpdateStatus === STATUS.PENDING}
           onToggle={isExpanded => setCVSelectOpen(isExpanded)}
-          ouiaId="select-content-view"
-          id="selectCV"
-          name="selectCV"
-          aria-label="selectCV"
           placeholderText={cvPlaceholderText()}
         >
           {contentViewsInEnv?.map(cv => (
@@ -227,8 +222,7 @@ const ChangeHostCVModal = ({
             </SelectOption>
           ))
           }
-        </Select>
-      </div>
+        </ContentViewSelect>
       }
     </Modal>
   );

data/webpack/components/extensions/HostDetails/Cards/ContentViewDetailsCard/__tests__/changeHostCVModal.test.js

@@ -86,7 +86,7 @@ test('Select an env > call CV API > select a CV > Save button is enabled', async
 
   const {
     getAllByText, getByText,
-    findByText, getAllByRole,
+    findByPlaceholderText, getAllByRole,
   } = renderWithRedux(<ChangeHostCVModal
     isOpen
     closeModal={jest.fn()}
@@ -107,7 +107,7 @@ test('Select an env > call CV API > select a CV > Save button is enabled', async
   await act(async () => {
     userEvent.click(envRadio); // Select the Library environment
 
-    const cvDropdown = await findByText('Select a content view');
+    const cvDropdown = await findByPlaceholderText('Select a content view');
     expect(cvDropdown).toBeInTheDocument();
 
     userEvent.click(cvDropdown); // Open the CV dropdown

data/webpack/components/extensions/HostDetails/DetailsTabCards/RegistrationCard.js

@@ -77,7 +77,7 @@ const RegistrationCard = ({ isExpandedGlobal, hostDetails }) => {
           <RegisteredBy user={login} activationKeys={activationKeys} />
         </DescriptionListGroup>
         <DescriptionListGroup>
-          <DescriptionListTerm>{__('Registered through')}</DescriptionListTerm>
+          <DescriptionListTerm>{__('Content source')}</DescriptionListTerm>
           <DescriptionListDescription>{registeredThrough}</DescriptionListDescription>
         </DescriptionListGroup>
       </DescriptionList>

data/webpack/components/extensions/HostDetails/DetailsTabCards/SystemPropertiesCardExtensions.js

@@ -5,8 +5,10 @@ import {
   DescriptionListTerm,
   DescriptionListDescription,
   ClipboardCopy,
+  Label,
 } from '@patternfly/react-core';
-import { translate as __ } from 'foremanReact/common/I18n';
+import { sprintf, translate as __ } from 'foremanReact/common/I18n';
+import { propsToCamelCase } from 'foremanReact/common/helpers';
 
 export const SystemPropertiesCardSubscription = ({ hostDetails }) => {
   const subscriptionUuid = hostDetails?.subscription_facet_attributes?.uuid;
@@ -35,6 +37,61 @@ SystemPropertiesCardSubscription.defaultProps = {
   hostDetails: {},
 };
 
+export const SystemPropertiesCardVirtualization = ({ hostDetails }) => {
+  if (!hostDetails?.subscription_facet_attributes) return null;
+
+  const {
+    virtualGuests,
+    hypervisor,
+    virtualHost,
+  } = propsToCamelCase(hostDetails.subscription_facet_attributes);
+  const virtualGuestIds = `name ^ (${virtualGuests.map(guest => guest.name).join(', ')})`;
+
+  return (
+    <>
+      {hypervisor &&
+        <DescriptionListGroup>
+          <DescriptionListTerm>{__('Virtual guests')}</DescriptionListTerm>
+          <DescriptionListDescription>
+            <a href={`/hosts?search=${encodeURI(virtualGuestIds)}`}>
+              <Label color="blue" className="virtual-guests-label">
+                {sprintf(__('%s guests'), virtualGuests.length)}
+              </Label>
+            </a>
+          </DescriptionListDescription>
+        </DescriptionListGroup>
+      }
+      {virtualHost &&
+        <DescriptionListGroup>
+          <DescriptionListTerm>{__('Virtual host')}</DescriptionListTerm>
+          <DescriptionListDescription>
+            <a href={`/new/hosts/${virtualHost.name}`}>
+              {virtualHost.name}
+            </a>
+          </DescriptionListDescription>
+        </DescriptionListGroup>
+      }
+    </>
+  );
+};
+
+SystemPropertiesCardVirtualization.propTypes = {
+  hostDetails: PropTypes.shape({
+    subscription_facet_attributes: PropTypes.shape({
+      virtual_guests: PropTypes.arrayOf(PropTypes.shape({})),
+      hypervisor: PropTypes.bool,
+      virtual_host: PropTypes.shape({
+        id: PropTypes.number,
+        name: PropTypes.string,
+      }),
+    }),
+  }),
+};
+
+SystemPropertiesCardVirtualization.defaultProps = {
+  hostDetails: {},
+};
+
 export const SystemPropertiesCardTracer = ({ hostDetails }) => {
   const tracerStatus = hostDetails?.content_facet_attributes?.katello_tracer_installed;
   return (

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

@@ -46,9 +46,13 @@ import {
   userPermissionsFromHostDetails,
 } from '../../hostDetailsHelpers';
 
+const moduleStreamSupported = ({ os, version }) =>
+  os.match(/RedHat|RHEL|CentOS|Rocky|AlmaLinux|OracleLinux/i) && Number(version) > 7;
 export const hideModuleStreamsTab = ({ hostDetails }) => {
   const osMatch = hostDetails?.operatingsystem_name?.match(/(\w+) (\d+)/);
-  return !(osMatch && osMatch[1].match(/RedHat|CentOS/i) && Number(osMatch[2]) > 7);
+  if (!osMatch) return true;
+  const [, os, version] = osMatch;
+  return !(osMatch && moduleStreamSupported({ os, version }));
 };
 
 const EnabledIcon = ({ streamText, streamInstallStatus, upgradable }) => {

data/webpack/global_index.js

@@ -22,6 +22,7 @@ import HostCollectionsCard from './components/extensions/HostDetails/Cards/HostC
 import { hostIsNotRegistered } from './components/extensions/HostDetails/hostDetailsHelpers';
 import {
   SystemPropertiesCardSubscription,
+  SystemPropertiesCardVirtualization,
   SystemPropertiesCardTracer,
 } from './components/extensions/HostDetails/DetailsTabCards/SystemPropertiesCardExtensions';
 import HostActionsBar from './components/extensions/HostDetails/ActionsBar';
@@ -61,6 +62,7 @@ addGlobalFill('host-tab-details-cards', 'Installed products', <InstalledProducts
 addGlobalFill('host-tab-details-cards', 'Registration details', <RegistrationCard key="registration-details" />, 200);
 addGlobalFill('host-details-tab-properties-1', 'Subscription UUID', <SystemPropertiesCardSubscription key="subscription-uuid" />);
 addGlobalFill('host-details-tab-properties-2', 'Tracer', <SystemPropertiesCardTracer key="tracer-status" />);
+addGlobalFill('host-details-tab-properties-3', 'Virtualization', <SystemPropertiesCardVirtualization key="virtualization" />);
 
 addGlobalFill(
   'host-details-kebab',

data/webpack/scenes/ContentViews/Delete/Steps/CVDeletionReassignActivationKeysForm.js

@@ -1,7 +1,7 @@
 import React, { useContext, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import useDeepCompareEffect from 'use-deep-compare-effect';
-import { ExpandableSection, Select, SelectOption } from '@patternfly/react-core';
+import { ExpandableSection, SelectOption } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { STATUS } from 'foremanReact/constants';
 import getContentViews from '../../ContentViewsActions';
@@ -9,6 +9,7 @@ import { selectContentViewError, selectContentViews, selectContentViewStatus } f
 import CVDeleteContext from '../CVDeleteContext';
 import EnvironmentPaths from '../../components/EnvironmentPaths/EnvironmentPaths';
 import AffectedActivationKeys from '../../Details/Versions/Delete/affectedActivationKeys';
+import ContentViewSelect from '../../components/ContentViewSelect/ContentViewSelect';
 
 const CVDeletionReassignActivationKeysForm = () => {
   const dispatch = useDispatch();
@@ -66,6 +67,11 @@ const CVDeletionReassignActivationKeysForm = () => {
     return results?.filter(cv => cv.id === id)[0]?.name;
   };
 
+  const onClear = () => {
+    setSelectedCVForAK(null);
+    setSelectedCVNameForAK(null);
+  };
+
   const onSelect = (_event, selection) => {
     setSelectedCVForAK(selection);
     setSelectedCVNameForAK(fetchSelectedCVName(selection));
@@ -82,23 +88,17 @@ const CVDeletionReassignActivationKeysForm = () => {
         multiSelect={false}
       />
       {!cvInEnvLoading && selectedEnvForAK.length > 0 &&
-      <div style={{ marginTop: '1em' }}>
-        <h3>{__('Select content view')}</h3>
-        <Select
+        <ContentViewSelect
           selections={selectedCVForAK}
           onSelect={onSelect}
+          onClear={onClear}
           isOpen={cvSelectOpen}
           isDisabled={cvSelectOptions.length === 0}
           onToggle={isExpanded => setCVSelectOpen(isExpanded)}
-          id="selectCV"
-          name="selectCV"
-          aria-label="selectCV"
-          ouiaId="selectCV"
           placeholderText={(cvSelectOptions.length === 0) ? __('No content views available') : __('Select a content view')}
         >
           {cvSelectOptions}
-        </Select>
-      </div>
+        </ContentViewSelect>
       }
       <ExpandableSection
         toggleText={showActivationKeys ?

data/webpack/scenes/ContentViews/Delete/Steps/CVDeletionReassignHostsForm.js

@@ -1,7 +1,7 @@
 import React, { useState, useContext } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import useDeepCompareEffect from 'use-deep-compare-effect';
-import { ExpandableSection, Select, SelectOption } from '@patternfly/react-core';
+import { ExpandableSection, SelectOption } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { STATUS } from 'foremanReact/constants';
 import getContentViews from '../../ContentViewsActions';
@@ -9,6 +9,7 @@ import { selectContentViewError, selectContentViews, selectContentViewStatus } f
 import CVDeleteContext from '../CVDeleteContext';
 import EnvironmentPaths from '../../components/EnvironmentPaths/EnvironmentPaths';
 import AffectedHosts from '../../Details/Versions/Delete/affectedHosts';
+import ContentViewSelect from '../../components/ContentViewSelect/ContentViewSelect';
 
 
 const CVDeletionReassignHostsForm = () => {
@@ -67,6 +68,11 @@ const CVDeletionReassignHostsForm = () => {
     return results?.filter(cv => cv.id === id)[0]?.name;
   };
 
+  const onClear = () => {
+    setSelectedCVForHosts(null);
+    setSelectedCVNameForHosts(null);
+  };
+
   const onSelect = (_event, selection) => {
     setSelectedCVForHosts(selection);
     setSelectedCVNameForHosts(fetchSelectedCVName(selection));
@@ -83,23 +89,17 @@ const CVDeletionReassignHostsForm = () => {
         multiSelect={false}
       />
       {selectedEnvForHost.length > 0 &&
-      <div style={{ marginTop: '1em' }}>
-        <h3>{__('Select content view')}</h3>
-        <Select
+        <ContentViewSelect
           selections={selectedCVForHosts}
           onSelect={onSelect}
+          onClear={onClear}
           isOpen={cvSelectOpen}
           isDisabled={cvSelectOptions.length === 0}
           onToggle={isExpanded => setCVSelectOpen(isExpanded)}
-          id="selectCV"
-          name="selectCV"
-          aria-label="selectCV"
-          ouiaId="selectCV"
           placeholderText={(cvSelectOptions.length === 0) ? __('No content views available') : __('Select a content view')}
         >
           {cvSelectOptions}
-        </Select>
-      </div>
+        </ContentViewSelect>
       }
       <ExpandableSection
         toggleText={showHosts ? 'Hide hosts' : 'Show hosts'}

data/webpack/scenes/ContentViews/Delete/__tests__/contentViewDelete.test.js

@@ -165,7 +165,7 @@ test('Can open Delete wizard and delete CV with all steps', async (done) => {
     .reply(200, cVDropDownOptionsData);
 
   const {
-    getByText, getByLabelText, getAllByLabelText, getAllByText, queryByText,
+    getByText, getByLabelText, getAllByLabelText, getAllByText, queryByText, getByPlaceholderText,
   } =
     renderWithRedux(<ContentViewsPage />, renderOptions);
   expect(queryByText(firstCV.name)).toBeNull();
@@ -191,9 +191,9 @@ test('Can open Delete wizard and delete CV with all steps', async (done) => {
   fireEvent.click(getByLabelText('test1'));
   await patientlyWaitFor(() => {
     expect(getByText('Select content view')).toBeInTheDocument();
-    expect(getByText('Select a content view')).toBeInTheDocument();
+    expect(getByPlaceholderText('Select a content view')).toBeInTheDocument();
   });
-  fireEvent.click(getByText('Select a content view'));
+  fireEvent.click(getByPlaceholderText('Select a content view'));
   await patientlyWaitFor(() => {
     expect(getByText('cv2')).toBeInTheDocument();
   });
@@ -210,9 +210,9 @@ test('Can open Delete wizard and delete CV with all steps', async (done) => {
   fireEvent.click(getByLabelText('test1'));
   await patientlyWaitFor(() => {
     expect(getByText('Select content view')).toBeInTheDocument();
-    expect(getByText('Select a content view')).toBeInTheDocument();
+    expect(getByPlaceholderText('Select a content view')).toBeInTheDocument();
   });
-  fireEvent.click(getByText('Select a content view'));
+  fireEvent.click(getByPlaceholderText('Select a content view'));
   await patientlyWaitFor(() => {
     expect(getByText('cv2')).toBeInTheDocument();
   });

data/webpack/scenes/ContentViews/Details/Versions/BulkDelete/Steps/ReassignActivationKeys.js

@@ -18,10 +18,8 @@ import {
   ExpandableSection,
   Popover,
   PopoverPosition,
-  Select,
   SelectDirection,
   SelectOption,
-  TextContent,
 } from '@patternfly/react-core';
 import { OutlinedQuestionCircleIcon } from '@patternfly/react-icons';
 
@@ -39,6 +37,7 @@ import {
   getEnvironmentList,
   getNumberOfActivationKeys,
 } from '../BulkDeleteHelpers';
+import ContentViewSelect from '../../../../components/ContentViewSelect/ContentViewSelect';
 
 export default () => {
   const dispatch = useDispatch();
@@ -107,6 +106,11 @@ export default () => {
     setSelectedEnvForAK(value);
   };
 
+  const onClear = () => {
+    setSelectedCVForAK(null);
+    setSelectedEnvForAK([]);
+  };
+
   const onSelect = (_event, selection) => {
     setSelectedCVForAK(selection);
     setToggleCVSelect(false);
@@ -170,16 +174,11 @@ export default () => {
         headerText={__('Select an environment')}
         multiSelect={false}
       />
-      <TextContent>
-        {__('Select a content view')}
-      </TextContent>
-      <Select
+      <ContentViewSelect
         selections={selectedCVForAK}
         onSelect={onSelect}
+        onClear={onClear}
         isDisabled={cvInEnvLoading || !selectOptions?.length || !selectedEnvForAK?.length}
-        id="selectCV"
-        name="selectCV"
-        aria-label="selectCV"
         placeholderText={placeHolder}
         isOpen={toggleCVSelect}
         onToggle={setToggleCVSelect}
@@ -189,7 +188,7 @@ export default () => {
         width={350}
       >
         {selectOptions}
-      </Select>
+      </ContentViewSelect>
     </>
   );
 };

data/webpack/scenes/ContentViews/Details/Versions/BulkDelete/Steps/ReassignHosts.js

@@ -18,10 +18,8 @@ import {
   ExpandableSection,
   Popover,
   PopoverPosition,
-  Select,
   SelectDirection,
   SelectOption,
-  TextContent,
 } from '@patternfly/react-core';
 import { OutlinedQuestionCircleIcon } from '@patternfly/react-icons';
 
@@ -40,6 +38,7 @@ import {
   getNumberOfActivationKeys,
   getNumberOfHosts,
 } from '../BulkDeleteHelpers';
+import ContentViewSelect from '../../../../components/ContentViewSelect/ContentViewSelect';
 
 export default () => {
   const dispatch = useDispatch();
@@ -115,6 +114,15 @@ export default () => {
     }
   };
 
+  const onClear = () => {
+    setSelectedCVForHosts(null);
+    setSelectedEnvForHosts([]);
+    if (numberOfAKs) {
+      setSelectedCVForAK(null);
+      setSelectedEnvForAK([]);
+    }
+  };
+
   const onSelect = (_event, selection) => {
     setSelectedCVForHosts(selection);
     if (numberOfAKs) {
@@ -194,16 +202,11 @@ export default () => {
         headerText={__('Select an environment')}
         multiSelect={false}
       />
-      <TextContent>
-        {__('Select a content view')}
-      </TextContent>
-      <Select
+      <ContentViewSelect
         selections={selectedCVForHosts}
         onSelect={onSelect}
+        onClear={onClear}
         isDisabled={cvInEnvLoading || !selectOptions?.length || !selectedEnvForHosts?.length}
-        id="selectCV"
-        name="selectCV"
-        aria-label="selectCV"
         placeholderText={placeHolder}
         isOpen={toggleCVSelect}
         onToggle={setToggleCVSelect}
@@ -213,7 +216,7 @@ export default () => {
         width={350}
       >
         {selectOptions}
-      </Select>
+      </ContentViewSelect>
     </>
   );
 };

data/webpack/scenes/ContentViews/Details/Versions/Delete/RemoveSteps/CVReassignActivationKeysForm.js

@@ -1,7 +1,7 @@
 import React, { useState, useContext } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import useDeepCompareEffect from 'use-deep-compare-effect';
-import { ExpandableSection, Select, SelectOption } from '@patternfly/react-core';
+import { ExpandableSection, SelectOption } from '@patternfly/react-core';
 import { STATUS } from 'foremanReact/constants';
 import { translate as __ } from 'foremanReact/common/I18n';
 import EnvironmentPaths from '../../../../components/EnvironmentPaths/EnvironmentPaths';
@@ -9,6 +9,7 @@ import getContentViews from '../../../../ContentViewsActions';
 import { selectContentViewError, selectContentViews, selectContentViewStatus } from '../../../../ContentViewSelectors';
 import AffectedActivationKeys from '../affectedActivationKeys';
 import DeleteContext from '../DeleteContext';
+import ContentViewSelect from '../../../../components/ContentViewSelect/ContentViewSelect';
 
 const CVReassignActivationKeysForm = () => {
   const dispatch = useDispatch();
@@ -75,6 +76,11 @@ const CVReassignActivationKeysForm = () => {
     return results.filter(cv => cv.id === id)[0]?.name;
   };
 
+  const onClear = () => {
+    setSelectedCVForAK(null);
+    setSelectedCVNameForAK(null);
+  };
+
   const onSelect = (event, selection) => {
     setSelectedCVForAK(selection);
     setSelectedCVNameForAK(fetchSelectedCVName(selection));
@@ -91,23 +97,17 @@ const CVReassignActivationKeysForm = () => {
         multiSelect={false}
       />
       {!cvInEnvLoading && selectedEnvForAK.length > 0 &&
-        <div style={{ marginTop: '1em' }}>
-          <h3>{__('Select content view')}</h3>
-          <Select
-            selections={selectedCVForAK}
-            onSelect={onSelect}
-            isOpen={cvSelectOpen}
-            isDisabled={cvSelectOptions.length === 0}
-            onToggle={isExpanded => setCVSelectOpen(isExpanded)}
-            id="selectCV"
-            name="selectCV"
-            aria-label="selectCV"
-            ouiaId="selectCV"
-            placeholderText={(cvSelectOptions.length === 0) ? __('No content views available') : __('Select a content view')}
-          >
-            {cvSelectOptions}
-          </Select>
-        </div>
+        <ContentViewSelect
+          selections={selectedCVForAK}
+          onSelect={onSelect}
+          onClear={onClear}
+          isOpen={cvSelectOpen}
+          isDisabled={cvSelectOptions.length === 0}
+          onToggle={isExpanded => setCVSelectOpen(isExpanded)}
+          placeholderText={(cvSelectOptions.length === 0) ? __('No content views available') : __('Select a content view')}
+        >
+          {cvSelectOptions}
+        </ContentViewSelect>
       }
       <ExpandableSection
         toggleText={showActivationKeys ?