katello 4.8.4 → 4.9.0.rc1

data/webpack/scenes/ContentViews/Details/Filters/Rules/Package/AddEditPackageRuleModal.js

@@ -14,6 +14,7 @@ import {
 } from '../../../ContentViewDetailSelectors';
 import { orgId } from '../../../../../../services/api';
 import SearchText from '../../../../../../components/Search/SearchText';
+import { CONTENT_VIEW_NEEDS_PUBLISH } from '../../../../ContentViewsConstants';
 
 const AddEditPackageRuleModal = ({
   filterId, onClose, selectedFilterRuleData, repositoryIds,
@@ -109,6 +110,7 @@ const AddEditPackageRuleModal = ({
           onClose();
         },
       ));
+    dispatch({ type: CONTENT_VIEW_NEEDS_PUBLISH });
   };
 
 
@@ -127,6 +129,7 @@ const AddEditPackageRuleModal = ({
 
   return (
     <Modal
+      ouiaId="add-edit-rpm-rule-modal"
       title={selectedFilterRuleData ? __('Edit RPM rule') : __('Add RPM rule')}
       variant={ModalVariant.small}
       isOpen
@@ -162,6 +165,7 @@ const AddEditPackageRuleModal = ({
         </FormGroup>
         <FormGroup label={__('Version')} fieldId="version_comparator">
           <FormSelect
+            ouiaId="version-comparator"
             value={versionComparator}
             onChange={setVersionComparator}
             id="version_comparator"
@@ -177,6 +181,7 @@ const AddEditPackageRuleModal = ({
         {showVersion &&
           <FormGroup label={__('Version')} fieldId="version">
             <TextInput
+              ouiaId="input-version"
               type="text"
               id="version"
               aria-label="input_version"
@@ -188,6 +193,7 @@ const AddEditPackageRuleModal = ({
         {showMinVersion &&
           <FormGroup label={__('Minimum version')} fieldId="min_version">
             <TextInput
+              ouiaId="input-min-version"
               type="text"
               id="min_version"
               aria-label="input_min_version"
@@ -199,6 +205,7 @@ const AddEditPackageRuleModal = ({
         {showMaxVersion &&
           <FormGroup label={__('Maximum version')} fieldId="max_version">
             <TextInput
+              ouiaId="input-max-version"
               type="text"
               id="max_version"
               aria-label="input_max_version"

data/webpack/scenes/ContentViews/Details/Filters/__tests__/cvErrataIDFilter.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { renderWithRedux, patientlyWaitFor, fireEvent } from 'react-testing-lib-wrapper';
 import { Route } from 'react-router-dom';
-
+import { act } from '@testing-library/react';
 import ContentViewFilterDetails from '../ContentViewFilterDetails';
 import { cvFilterDetailsKey } from '../../../ContentViewsConstants';
 import {
@@ -17,7 +17,6 @@ import details from '../../../__tests__/mockDetails.fixtures.json';
 
 const cvFiltersPath = api.getApiUrl('/content_view_filters');
 const cvRefreshCallbackPath = api.getApiUrl('/content_views/1');
-
 const cvFilterDetailsPath = api.getApiUrl('/content_view_filters/6');
 const cvAddFilterRulePath = api.getApiUrl('/content_view_filters/6/rules');
 const cvRemoveFilterRulePath = api.getApiUrl('/content_view_filters/6/rules/4');
@@ -33,7 +32,6 @@ const renderOptions = {
     initialIndex: 1,
   },
 };
-
 const withCVRoute = component => <Route path="/content_views/:id([0-9]+)#/filters/:filterId([0-9]+)">{component}</Route>;
 
 test('Can enable and disable add filter button', async (done) => {
@@ -75,6 +73,7 @@ test('Can enable and disable add filter button', async (done) => {
   assertNockRequest(cvFilterScope);
   assertNockRequest(cvFiltersScope);
   assertNockRequest(errataScope, done);
+  act(done);
 });
 
 test('Can add a filter rule', async (done) => {
@@ -124,7 +123,7 @@ test('Can add a filter rule', async (done) => {
   fireEvent.click(getAllByLabelText('Actions')[3]);
   expect(getAllByLabelText('Actions')[3]).toHaveAttribute('aria-expanded', 'true');
   await patientlyWaitFor(() => expect(getByText('Add')).toBeInTheDocument());
-  fireEvent.click(getByText('Add'));
+  act(() => { fireEvent.click(getByText('Add')); });
 
 
   assertNockRequest(autocompleteScope);
@@ -132,8 +131,8 @@ test('Can add a filter rule', async (done) => {
   assertNockRequest(cvFiltersScope);
   assertNockRequest(cvFiltersRuleScope);
   assertNockRequest(cvRequestCallbackScope);
-
   assertNockRequest(errataScope, done);
+  act(done);
 });
 
 test('Can remove a filter rule', async (done) => {
@@ -182,7 +181,7 @@ test('Can remove a filter rule', async (done) => {
   fireEvent.click(getAllByLabelText('Actions')[2]);
   expect(getAllByLabelText('Actions')[2]).toHaveAttribute('aria-expanded', 'true');
   await patientlyWaitFor(() => expect(getByText('Remove')).toBeInTheDocument());
-  fireEvent.click(getByText('Remove'));
+  act(() => { fireEvent.click(getByText('Remove')); });
 
 
   assertNockRequest(autocompleteScope);
@@ -190,8 +189,8 @@ test('Can remove a filter rule', async (done) => {
   assertNockRequest(cvFiltersScope);
   assertNockRequest(cvFiltersRuleScope);
   assertNockRequest(cvRequestCallbackScope);
-
   assertNockRequest(errataScope, done);
+  act(done);
 });
 
 test('Can bulk remove filter rules', async (done) => {
@@ -243,17 +242,19 @@ test('Can bulk remove filter rules', async (done) => {
   });
   fireEvent.click(getByLabelText('Select all rows'));
   fireEvent.click(getByLabelText('bulk_actions'));
-  expect(getByLabelText('bulk_actions')).toHaveAttribute('aria-expanded', 'true');
-  expect(getByLabelText('bulk_remove')).toBeInTheDocument();
-  fireEvent.click(getByLabelText('bulk_remove'));
+  await patientlyWaitFor(() => {
+    expect(getByLabelText('bulk_actions')).toHaveAttribute('aria-expanded', 'true');
+    expect(getByLabelText('bulk_remove')).toBeInTheDocument();
+  });
+  act(() => { fireEvent.click(getByLabelText('bulk_remove')); });
 
   assertNockRequest(autocompleteScope);
   assertNockRequest(cvFilterScope);
   assertNockRequest(cvFiltersScope);
   assertNockRequest(cvFiltersRuleBulkDeleteScope);
   assertNockRequest(cvRequestCallbackScope);
-
   assertNockRequest(errataScope, done);
+  act(done);
 });
 
 test('Can bulk add filter rules', async (done) => {
@@ -301,17 +302,20 @@ test('Can bulk add filter rules', async (done) => {
     expect(getByLabelText('Select all rows')).toBeInTheDocument();
     expect(getByLabelText('bulk_actions')).toHaveAttribute('aria-expanded', 'false');
   });
+  expect(getByLabelText('add_filter_rule')).toHaveAttribute('aria-disabled', 'true');
   fireEvent.click(getByLabelText('Select all rows'));
-  expect(getByLabelText('add_filter_rule')).toBeInTheDocument();
-  fireEvent.click(getByLabelText('add_filter_rule'));
+  await patientlyWaitFor(() => {
+    expect(getByLabelText('add_filter_rule')).toHaveAttribute('aria-disabled', 'false');
+  });
+  act(() => { fireEvent.click(getByLabelText('add_filter_rule')); });
 
   assertNockRequest(autocompleteScope);
   assertNockRequest(cvFilterScope);
   assertNockRequest(cvFiltersScope);
   assertNockRequest(cvFiltersRuleBulkAddScope);
   assertNockRequest(cvRequestCallbackScope);
-
   assertNockRequest(errataScope, done);
+  act(done);
 });
 
 test('Can show filters and chips', async (done) => {
@@ -330,15 +334,19 @@ test('Can show filters and chips', async (done) => {
     .times(5)
     .query(true)
     .reply(200, allErrata);
+  const cvRequestCallbackScope = nockInstance
+    .get(cvRefreshCallbackPath)
+    .query(true)
+    .reply(200, cvFilterDetails);
   const autocompleteScope = mockAutocomplete(nockInstance, autocompleteUrl);
 
   const {
     getByText, getAllByText, queryByText, getByLabelText, getByTestId,
   } =
-    renderWithRedux(withCVRoute(<ContentViewFilterDetails
-      cvId={1}
-      details={details}
-    />), renderOptions);
+      renderWithRedux(withCVRoute(<ContentViewFilterDetails
+        cvId={1}
+        details={details}
+      />), renderOptions);
 
   // Nothing will show at first, page is loading
   expect(queryByText(cvFilterName)).toBeNull();
@@ -347,14 +355,13 @@ test('Can show filters and chips', async (done) => {
   await patientlyWaitFor(() => {
     expect(getByText(cvFilterName)).toBeInTheDocument();
     expect(getByTestId('allAddedNotAdded')).toBeInTheDocument();
-    fireEvent.click(getByTestId('allAddedNotAdded')
-      ?.childNodes[0]?.childNodes[1]?.childNodes[0]?.childNodes[0]);
   });
+  fireEvent.click(getByTestId('allAddedNotAdded')?.childNodes[0]?.childNodes[1]?.childNodes[0]?.childNodes[0]);
 
   await patientlyWaitFor(() => {
     expect(getByLabelText('select Added')).toBeInTheDocument();
-    getByLabelText('select Added').click();
   });
+  act(() => { getByLabelText('select Added').click(); });
 
   await patientlyWaitFor(() => {
     expect(getByText(errataId)).toBeInTheDocument();
@@ -362,8 +369,10 @@ test('Can show filters and chips', async (done) => {
   });
 
   expect(getByText('Errata type')).toBeInTheDocument();
-  getByText('Errata type').click();
-  expect(getByLabelText('security_selection')).toBeInTheDocument();
+  act(() => { getByText('Errata type').click(); });
+  await patientlyWaitFor(() => {
+    expect(getByLabelText('security_selection')).toBeInTheDocument();
+  });
   getByLabelText('security_selection').click();
 
   await patientlyWaitFor(() => {
@@ -374,14 +383,18 @@ test('Can show filters and chips', async (done) => {
     expect(getAllByText('ANY')).toHaveLength(1);
   });
   fireEvent.change(getByLabelText('end_date_input'), { target: { value: '08/15/2020' } });
+  await patientlyWaitFor(() => {
+    expect(queryByText('ANY')).toBeNull();
+  });
 
-  // expect(getByLabelText('blah')).toBeInTheDocument();
   assertNockRequest(autocompleteScope);
   assertNockRequest(cvFilterScope);
   assertNockRequest(cvFiltersScope);
+  assertNockRequest(cvRequestCallbackScope);
   assertNockRequest(errataScope); // 1st call on component load
   assertNockRequest(errataScope); // 2nd call on status selection
   assertNockRequest(errataScope); // 3rd call on errata type selection
   assertNockRequest(errataScope); // 4th call on start date change
   assertNockRequest(errataScope, done); // Last call on end date change
+  act(done);
 });

data/webpack/scenes/ContentViews/Details/Histories/ContentViewHistories.js

@@ -49,9 +49,9 @@ const ContentViewHistories = ({ cvId }) => {
     const taskType = task ? task.label : taskTypes[action];
 
     if (taskType === taskTypes.removal) {
-      return <>{__('Deleted from ')} <Label isTruncated key="1" color="blue" href={`/lifecycle_environments/${environment?.id}`}>{environment?.name ?? __('all environments')}</Label></>;
+      return <>{__('Deleted from ')} <Label isTruncated key="1" color="blue" href={`/lifecycle_environments/${environment?.id}`}>{`${environment?.name ?? __('all environments')}`}</Label></>;
     } else if (action === 'promotion' || taskType === taskTypes.promotion) {
-      return <>{__('Promoted to ')}<Label isTruncated key="2" color="blue" href={`/lifecycle_environments/${environment?.id}`}>{environment?.name}</Label></>;
+      return <>{__('Promoted to ')}<Label isTruncated key="2" color="blue" href={`/lifecycle_environments/${environment?.id}`}>{`${environment?.name}`}</Label></>;
     } else if (taskType === taskTypes.publish) {
       return __('Published new version');
     } else if (taskType === taskTypes.export) {
@@ -62,7 +62,7 @@ const ContentViewHistories = ({ cvId }) => {
     return '';
   };
 
-  const emptyContentTitle = __("You currently don't have any history for this content view.");
+  const emptyContentTitle = __('No history yet');
   const emptyContentBody = __('History will appear here when the content view is published or promoted.'); // needs link
   const emptySearchTitle = __('No matching history record found');
   const emptySearchBody = __('Try changing your search settings.');

data/webpack/scenes/ContentViews/Details/Histories/__tests__/contentViewHistory.test.js

@@ -77,7 +77,7 @@ test('Can handle no History being present', async (done) => {
   const { queryByText } = renderWithRedux(<ContentViewHistories cvId={1} />, renderOptions);
 
   expect(queryByText(firstHistory.description)).toBeNull();
-  await patientlyWaitFor(() => expect(queryByText("You currently don't have any history for this content view.")).toBeInTheDocument());
+  await patientlyWaitFor(() => expect(queryByText('History will appear here when the content view is published or promoted.')).toBeInTheDocument());
   assertNockRequest(autocompleteScope);
   assertNockRequest(scope, done);
 });

data/webpack/scenes/ContentViews/Details/Repositories/ContentViewRepositories.js

@@ -3,7 +3,7 @@ import React, {
   useEffect,
   useState,
 } from 'react';
-
+import { FormattedMessage } from 'react-intl';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { urlBuilder } from 'foremanReact/common/urlHelpers';
 import { STATUS } from 'foremanReact/constants';
@@ -39,6 +39,7 @@ import {
   Th,
   Td,
 } from '@patternfly/react-table';
+import { useKatelloDocUrl } from '../../../../utils/useKatelloDocUrl';
 import AddedStatusLabel from '../../../../components/AddedStatusLabel';
 import SelectableDropdown from '../../../../components/SelectableDropdown';
 import TableWrapper from '../../../../components/Table/TableWrapper';
@@ -74,10 +75,27 @@ const repoTypeNames = {
   ostree: 'OSTree',
 };
 
+const NoReposInOrgCallsToAction = () => (
+  <FormattedMessage
+    id="truly-empty-calls-to-action"
+    defaultMessage={__('{enableRedHatRepos} or {createACustomProduct}.')}
+    values={{
+      enableRedHatRepos: (
+        <a href="/redhat_repositories" id="empty-state-primary-action-enable-red-hat-repos">{__('Enable Red Hat repositories')}</a>
+      ),
+      createACustomProduct: (
+        <a href="/products/" id="empty-state-primary-action-create-a-custom-product">{__('create a custom product')}</a>
+      ),
+    }}
+  />
+);
+
 const ContentViewRepositories = ({ cvId, details }) => {
   const dispatch = useDispatch();
   const response = useSelector(state => selectCVRepos(state, cvId), shallowEqual);
   const { results, ...metadata } = response;
+  const { org_repository_count: orgRepositoryCount } = metadata;
+  const [isLoading, setLoading] = useState(false);
   const status = useSelector(state => selectCVReposStatus(state, cvId), shallowEqual);
   const error = useSelector(state => selectCVReposError(state, cvId), shallowEqual);
   const repoTypesResponse = useSelector(state => selectRepoTypes(state), shallowEqual);
@@ -86,7 +104,7 @@ const ContentViewRepositories = ({ cvId, details }) => {
   const generatedContentView = generatedFor !== 'none';
   const [searchQuery, updateSearchQuery] = useState('');
   const [typeSelected, setTypeSelected] = useState(allRepositories);
-  const [statusSelected, setStatusSelected] = useState(ALL_STATUSES);
+  const [statusSelected, setStatusSelected] = useState(ADDED);
   // repoTypes object format: [displayed_value]: API_value
   const [repoTypes, setRepoTypes] = useState({});
   const [bulkActionOpen, setBulkActionOpen] = useState(false);
@@ -121,10 +139,18 @@ const ContentViewRepositories = ({ cvId, details }) => {
     __('Status'),
   ];
 
+  const documentationUrl = useKatelloDocUrl('Managing_Content', '#Products_and_Repositories_content-management');
+
   useEffect(() => {
     dispatch(getRepositoryTypes());
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
+  useEffect(() => {
+    if (status !== STATUS.PENDING) {
+      setLoading(false);
+    }
+  }, [status]);
+
   // Get repo type filter selections dynamically from the API
   useDeepCompareEffect(() => {
     if (repoTypesStatus === STATUS.RESOLVED && repoTypesResponse) {
@@ -149,14 +175,16 @@ const ContentViewRepositories = ({ cvId, details }) => {
     dispatch(updateContentView(
       cvId,
       { repository_ids: repositoryIds.concat(repos) },
-      () =>
+      () => {
         dispatch(getContentViewRepositories(
           cvId,
           typeSelected !== 'All repositories' ? {
             content_type: repoTypes[typeSelected],
           } : {},
-          statusSelected,
-        )),
+          ADDED,
+        ));
+        setStatusSelected(ADDED);
+      },
     ));
   };
 
@@ -192,6 +220,11 @@ const ContentViewRepositories = ({ cvId, details }) => {
     onRemove(reposToDelete);
   };
 
+  const handleShow = () => {
+    setLoading(true);
+    setStatusSelected(ALL_STATUSES);
+  };
+
   const rowDropdownItems = ({ id }) => [
     {
       title: 'Add',
@@ -217,8 +250,35 @@ const ContentViewRepositories = ({ cvId, details }) => {
     return getContentViewRepositories(cvId, allParams, statusSelected);
   }, [cvId, repoTypes, statusSelected, typeSelected]);
 
-  const emptyContentTitle = __("You currently don't have any repositories to add to this content view.");
-  const emptyContentBody = __('Please add some repositories.'); // needs link
+  const noResults = (results && results.length === 0) && !searchQuery && status === STATUS.RESOLVED;
+  const emptyContentOverride =
+    noResults && statusSelected === ADDED;
+  const noReposInOrg =
+    (orgRepositoryCount === 0);
+  const emptyContentTitles = {
+    addRepos: __('No repositories added yet'),
+    noReposInOrg: __('No repositories available to add'),
+  };
+  const emptyContentBodies = {
+    addRepos: __('Click to see repositories available to add.'),
+    noReposInOrg: '',
+  };
+
+  const showPrimaryAction = emptyContentOverride || noReposInOrg;
+  const primaryActionButton = noReposInOrg ? (
+    <span style={{ fontSize: 'larger' }}><NoReposInOrgCallsToAction /></span>
+  ) : (
+    <Button ouiaId="empty-state-primary-action-button" onClick={handleShow}>
+      {__('Show repositories')}
+    </Button>
+  );
+
+  const secondaryActionLink = noReposInOrg ? documentationUrl : undefined;
+  const secondaryActionTitle = noReposInOrg ? __('View documentation') : undefined;
+  const emptyContentTitle =
+    noReposInOrg ? emptyContentTitles.noReposInOrg : emptyContentTitles.addRepos;
+  const emptyContentBody =
+    noReposInOrg ? emptyContentBodies.noReposInOrg : emptyContentBodies.addRepos;
   const emptySearchTitle = __('No matching repositories found');
   const emptySearchBody = __('Try changing your search settings.');
   const activeFilters = [typeSelected, statusSelected];
@@ -230,6 +290,8 @@ const ContentViewRepositories = ({ cvId, details }) => {
     </DropdownItem>,
   ];
 
+  const loadingStatus = (isLoading || status === STATUS.PENDING) ? STATUS.PENDING : status;
+
   return (
     <TableWrapper
       {...{
@@ -241,13 +303,21 @@ const ContentViewRepositories = ({ cvId, details }) => {
         searchQuery,
         updateSearchQuery,
         error,
-        status,
         activeFilters,
         defaultFilters,
         selectedCount,
         selectNone,
         resetFilters,
+        emptyContentOverride,
+        showPrimaryAction,
+        primaryActionButton,
+        secondaryActionLink,
+        secondaryActionTitle,
       }}
+      status={loadingStatus}
+      showSecondaryAction={noReposInOrg}
+      showSecondaryActionButton={noReposInOrg}
+      secondaryActionTargetBlank={noReposInOrg}
       ouiaId="content-view-repositories-table"
       {...selectAll}
       variant={TableVariant.compact}

data/webpack/scenes/ContentViews/Details/Repositories/__tests__/contentViewAddRemove.test.js

@@ -1,17 +1,19 @@
 import React from 'react';
-import { renderWithRedux, patientlyWaitFor, act } from 'react-testing-lib-wrapper';
+import { renderWithRedux, patientlyWaitFor, act, fireEvent } from 'react-testing-lib-wrapper';
 
 import { nockInstance, assertNockRequest, mockAutocomplete } from '../../../../../test-utils/nockWrapper';
 import api from '../../../../../services/api';
 import CONTENT_VIEWS_KEY from '../../../ContentViewsConstants';
 import ContentViewRepositories from '../ContentViewRepositories';
 import repoData from './contentViewDetailRepos.fixtures.json';
+import noReposAddedData from './contentViewDetailNoReposAdded.fixtures.json';
 import cvDetailData from '../../__tests__/contentViewDetails.fixtures.json';
 import cvRepoAddData from './contentViewRepoAdd.fixture.json';
 
 const autocompleteUrl = '/repositories/auto_complete_search';
 const renderOptions = { apiNamespace: `${CONTENT_VIEWS_KEY}_1` };
 const cvAllRepos = api.getApiUrl('/content_views/1/repositories/show_all');
+const cvAddedRepos = api.getApiUrl('/content_views/1/repositories');
 const repoTypesResponse = [{ name: 'deb' }, { name: 'docker' }, { name: 'file' }, { name: 'ostree' }, { name: 'yum' }];
 
 const cvDetailsPath = api.getApiUrl('/content_views/1');
@@ -33,6 +35,10 @@ jest.mock('react-intl', () => ({ addLocaleData: () => { }, FormattedDate: () =>
 test('Can enable and disable add repositories button', async (done) => {
   const autocompleteScope = mockAutocomplete(nockInstance, autocompleteUrl);
 
+  const noReposScope = nockInstance
+    .get(cvAddedRepos)
+    .query(true)
+    .reply(200, noReposAddedData);
   const scope = nockInstance
     .get(cvAllRepos)
     .query(true)
@@ -43,14 +49,18 @@ test('Can enable and disable add repositories button', async (done) => {
     renderOptions,
   );
 
+  await patientlyWaitFor(() => expect(getByText('Show repositories')).toBeInTheDocument());
+  fireEvent.click(getByText('Show repositories'));
+
   await patientlyWaitFor(() => expect(getByText(firstRepo.name)).toBeInTheDocument());
   expect(getByLabelText('Select all')).toBeInTheDocument();
   expect(getByLabelText('add_repositories')).toHaveAttribute('aria-disabled', 'true');
-  getByLabelText('Select all').click();
+  fireEvent.click(getByLabelText('Select all'));
   await patientlyWaitFor(() => {
     expect(getByLabelText('add_repositories')).toHaveAttribute('aria-disabled', 'false');
   });
   assertNockRequest(autocompleteScope);
+  assertNockRequest(noReposScope);
   assertNockRequest(scope, done);
 });
 
@@ -67,6 +77,11 @@ test('Can add repositories', async (done) => {
     .query(true)
     .reply(200, cvDetailData);
 
+  const noReposScope = nockInstance
+    .get(cvAddedRepos)
+    .query(true)
+    .reply(200, noReposAddedData);
+
   const scope = nockInstance
     .get(cvAllRepos)
     .query(true)
@@ -77,17 +92,21 @@ test('Can add repositories', async (done) => {
     renderOptions,
   );
 
+  await patientlyWaitFor(() => expect(getByText('Show repositories')).toBeInTheDocument());
+  fireEvent.click(getByText('Show repositories'));
+
   await patientlyWaitFor(() => expect(getByText(firstRepo.name)).toBeInTheDocument());
   expect(getByLabelText('Select all')).toBeInTheDocument();
   expect(getByLabelText('add_repositories')).toHaveAttribute('aria-disabled', 'true');
-  getByLabelText('Select all').click();
-  getByLabelText('add_repositories').click();
+  fireEvent.click(getByLabelText('Select all'));
+  fireEvent.click(getByLabelText('add_repositories'));
   await patientlyWaitFor(() => expect(getByText(firstRepo.name)).toBeInTheDocument());
 
   assertNockRequest(repoAddscope);
 
   assertNockRequest(cvDetailScope);
   assertNockRequest(autocompleteScope);
+  assertNockRequest(noReposScope);
   assertNockRequest(scope, done);
   act(done);
 });
@@ -96,7 +115,7 @@ test('Can remove repositories', async (done) => {
   const autocompleteScope = mockAutocomplete(nockInstance, autocompleteUrl);
   const cvRemoveParams = { include_permissions: true, repository_ids: [58, 62, 64] };
   const scope = nockInstance
-    .get(cvAllRepos)
+    .get(cvAddedRepos)
     .query(true)
     .reply(200, repoData);
   const cvDetailScope = nockInstance
@@ -114,16 +133,16 @@ test('Can remove repositories', async (done) => {
 
   await patientlyWaitFor(() => expect(getByText(firstRepo.name)).toBeInTheDocument());
   expect(getByLabelText('Select all')).toBeInTheDocument();
-  getByLabelText('Select all').click();
+  fireEvent.click(getByLabelText('Select all'));
   await patientlyWaitFor(() => {
     expect(getByLabelText('bulk_actions')).toHaveAttribute('aria-expanded', 'false');
   });
-  getByLabelText('bulk_actions').click();
+  fireEvent.click(getByLabelText('bulk_actions'));
   await patientlyWaitFor(() => {
     expect(getByLabelText('bulk_actions')).toHaveAttribute('aria-expanded', 'true');
     expect(getByLabelText('bulk_remove')).toBeInTheDocument();
   });
-  getByLabelText('bulk_remove').click();
+  fireEvent.click(getByLabelText('bulk_remove'));
   await patientlyWaitFor(() => expect(getByText(firstRepo.name)).toBeInTheDocument());
 
   assertNockRequest(repoRemoveScope);

data/webpack/scenes/ContentViews/Details/Repositories/__tests__/contentViewDetailNoReposAdded.fixtures.json

@@ -0,0 +1,13 @@
+{
+  "total": 0,
+  "subtotal": 0,
+  "page": 1,
+  "per_page": 20,
+  "error": null,
+  "search": null,
+  "sort": {
+    "by": null,
+    "order": null
+  },
+  "results": []
+}

data/webpack/scenes/ContentViews/Details/Versions/BulkDelete/ActionSummary.js

@@ -22,7 +22,7 @@ const ActionSummary = ({ title, text, selectedEnv: { name, id } }) => (
           <ExclamationTriangleIcon color={warningColor.value} />
         </FlexItem>
         <FlexItem style={{ marginRight: '8px' }}>
-          <Text>{text}</Text>
+          <Text ouiaId="action-summary-text">{text}</Text>
         </FlexItem>
         {name && id &&
           <FlexItem>

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

@@ -4,7 +4,6 @@ import React, {
 } from 'react';
 
 import { translate as __ } from 'foremanReact/common/I18n';
-import { STATUS } from 'foremanReact/constants';
 import { first } from 'lodash';
 import { FormattedMessage } from 'react-intl';
 import {
@@ -38,6 +37,7 @@ import {
   getNumberOfActivationKeys,
 } from '../BulkDeleteHelpers';
 import ContentViewSelect from '../../../../components/ContentViewSelect/ContentViewSelect';
+import { getCVPlaceholderText, shouldDisableCVSelect } from '../../../../components/ContentViewSelect/helpers';
 
 export default () => {
   const dispatch = useDispatch();
@@ -52,7 +52,6 @@ export default () => {
   const { results = [] } = useSelector(selectContentViews);
   const { content_view: { id: cvId } } = first(versions);
   const contentViewsInEnvStatus = useSelector(selectContentViewStatus);
-  const cvInEnvLoading = contentViewsInEnvStatus === STATUS.PENDING;
   const [toggleCVSelect, setToggleCVSelect] = useState(false);
 
   const numberOfActivationKeys = getNumberOfActivationKeys(versions);
@@ -88,18 +87,19 @@ export default () => {
         {name}
       </SelectOption>));
 
-  const placeHolder = (() => {
-    switch (true) {
-    case cvInEnvLoading && !!selectedEnvForAK.length:
-      return __('Loading...');
-    case selectedEnvForAK.length === 0:
-      return __('Select an environment above');
-    case selectOptions.length > 0:
-      return __('Select a content view');
-    default:
-      return __('No content views available');
-    }
-  })();
+  const placeholderText = getCVPlaceholderText({
+    contentSourceId: null,
+    environments: selectedEnvForAK,
+    contentViewsStatus: contentViewsInEnvStatus,
+    cvSelectOptions: selectOptions,
+  });
+
+  const disableCVSelect = shouldDisableCVSelect({
+    contentSourceId: null,
+    environments: selectedEnvForAK,
+    contentViewsStatus: contentViewsInEnvStatus,
+    cvSelectOptions: selectOptions,
+  });
 
   const setUserCheckedItems = (value) => {
     setSelectedCVForAK(null);
@@ -178,8 +178,8 @@ export default () => {
         selections={selectedCVForAK}
         onSelect={onSelect}
         onClear={onClear}
-        isDisabled={cvInEnvLoading || !selectOptions?.length || !selectedEnvForAK?.length}
-        placeholderText={placeHolder}
+        isDisabled={disableCVSelect}
+        placeholderText={placeholderText}
         isOpen={toggleCVSelect}
         onToggle={setToggleCVSelect}
         menuAppendTo={() => document.body}