katello 4.5.0.rc2 → 4.6.0.rc2

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

@@ -3,11 +3,12 @@ import { renderWithRedux, patientlyWaitFor, fireEvent } from 'react-testing-lib-
 import { Route } from 'react-router-dom';
 
 import api from '../../../../../services/api';
-import nock, { nockInstance, assertNockRequest, mockAutocomplete, mockSetting } from '../../../../../test-utils/nockWrapper';
+import { nockInstance, assertNockRequest, mockAutocomplete, mockSetting } from '../../../../../test-utils/nockWrapper';
 import ContentViewFilters from '../ContentViewFilters';
 import CONTENT_VIEWS_KEY from '../../../ContentViewsConstants';
 import cvFilterFixtures from './contentViewFilters.fixtures.json';
 import details from '../../../__tests__/mockDetails.fixtures.json';
+import emptyContentViewFiltersData from './emptyContentViewFilters.fixtures.json';
 
 const withCVRoute = component =>
   <Route path="/content_views/:id([0-9]+)#/filters">{component}</Route>;
@@ -39,7 +40,6 @@ beforeEach(() => {
 afterEach(() => {
   assertNockRequest(searchDelayScope);
   assertNockRequest(autoSearchScope);
-  nock.cleanAll();
 });
 
 test('Can call API and show filters on page load', async (done) => {
@@ -177,3 +177,33 @@ test('Can remove multiple filters', async (done) => {
   assertNockRequest(removeFilterScope);
   assertNockRequest(callbackGetContentViewScope, done);
 });
+
+test('Shows call-to-action button when there are no filters', async (done) => {
+  const repoTypesResponse = [{ name: 'deb' }, { name: 'docker' }, { name: 'file' }, { name: 'ostree' }, { name: 'yum' }];
+  const repoTypeScope = nockInstance
+    .get(api.getApiUrl('/repositories/repository_types'))
+    .query(true)
+    .reply(200, repoTypesResponse);
+
+  const autocompleteScope = mockAutocomplete(nockInstance, autocompleteUrl);
+
+  const scope = nockInstance
+    .get(cvFilters)
+    .query(true)
+    .reply(200, emptyContentViewFiltersData);
+
+  const { queryByLabelText } =
+    renderWithRedux(withCVRoute(<ContentViewFilters cvId={1} details={details} />), renderOptions);
+
+  expect(queryByLabelText('create_filter_empty_state')).toBeNull();
+  await patientlyWaitFor(() => {
+    expect(queryByLabelText('create_filter_empty_state')).toBeInTheDocument();
+  });
+  fireEvent.click(queryByLabelText('create_filter_empty_state'));
+  await patientlyWaitFor(() => {
+    expect(queryByLabelText('create_filter')).toBeInTheDocument();
+  });
+  assertNockRequest(autocompleteScope);
+  assertNockRequest(repoTypeScope);
+  assertNockRequest(scope, done);
+});

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

@@ -4,7 +4,7 @@ import { Route } from 'react-router-dom';
 
 import ContentViewFilterDetails from '../ContentViewFilterDetails';
 import { cvFilterDetailsKey } from '../../../ContentViewsConstants';
-import nock, {
+import {
   nockInstance,
   assertNockRequest,
   mockAutocomplete,
@@ -47,7 +47,6 @@ beforeEach(() => {
 afterEach(() => {
   assertNockRequest(searchDelayScope);
   assertNockRequest(autoSearchScope);
-  nock.cleanAll();
 });
 
 test('Can enable and disable add filter button', async (done) => {

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

@@ -4,7 +4,7 @@ import { Route } from 'react-router-dom';
 
 import ContentViewFilterDetails from '../ContentViewFilterDetails';
 import { ADDED, cvFilterDetailsKey, NOT_ADDED } from '../../../ContentViewsConstants';
-import nock, {
+import {
   nockInstance,
   assertNockRequest,
   mockAutocomplete,
@@ -47,7 +47,6 @@ beforeEach(() => {
 afterEach(() => {
   assertNockRequest(searchDelayScope);
   assertNockRequest(autoSearchScope);
-  nock.cleanAll();
 });
 
 test('Can enable and disable add filter button', async (done) => {

data/webpack/scenes/ContentViews/Details/Filters/__tests__/emptyCVContainerImageFilterContent.fixtures.json

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

data/webpack/scenes/ContentViews/Details/Filters/__tests__/emptyCVPackageFilterRules.fixtures.json

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

data/webpack/scenes/ContentViews/Details/Filters/__tests__/emptyContentViewFilters.fixtures.json

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

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { renderWithRedux, patientlyWaitFor } from 'react-testing-lib-wrapper';
 
-import nock, { nockInstance, assertNockRequest, mockAutocomplete, mockSetting } from '../../../../../test-utils/nockWrapper';
+import { nockInstance, assertNockRequest, mockAutocomplete, mockSetting } from '../../../../../test-utils/nockWrapper';
 import api from '../../../../../services/api';
 import CONTENT_VIEWS_KEY from '../../../ContentViewsConstants';
 import ContentViewHistories from '../ContentViewHistories';
@@ -23,7 +23,6 @@ beforeEach(() => {
 });
 
 afterEach(() => {
-  nock.cleanAll();
   assertNockRequest(searchDelayScope);
   assertNockRequest(autoSearchScope);
 });

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

@@ -91,7 +91,10 @@ const ContentViewRepositories = ({ cvId, details }) => {
   const [repoTypes, setRepoTypes] = useState({});
   const [bulkActionOpen, setBulkActionOpen] = useState(false);
   const { repository_ids: repositoryIds = [] } = details;
-
+  const resetFilters = () => {
+    setTypeSelected(allRepositories);
+    setStatusSelected(ALL_STATUSES);
+  };
   const {
     isSelected,
     selectOne,
@@ -243,6 +246,7 @@ const ContentViewRepositories = ({ cvId, details }) => {
         defaultFilters,
         selectedCount,
         selectNone,
+        resetFilters,
       }}
       ouiaId="content-view-repositories-table"
       {...selectAll}

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { renderWithRedux, patientlyWaitFor, act } from 'react-testing-lib-wrapper';
 
-import nock, { nockInstance, assertNockRequest, mockAutocomplete, mockSetting } from '../../../../../test-utils/nockWrapper';
+import { nockInstance, assertNockRequest, mockAutocomplete, mockSetting } from '../../../../../test-utils/nockWrapper';
 import api from '../../../../../services/api';
 import CONTENT_VIEWS_KEY from '../../../ContentViewsConstants';
 import ContentViewRepositories from '../ContentViewRepositories';
@@ -33,7 +33,6 @@ beforeEach(() => {
 });
 
 afterEach(() => {
-  nock.cleanAll();
   assertNockRequest(searchDelayScope);
   assertNockRequest(autoSearchScope);
 });

data/webpack/scenes/ContentViews/Details/Versions/BulkDelete/__tests__/BulkDeleteModal.test.js

@@ -41,6 +41,9 @@ const renderOptions = {
         response: contentViewData, status: STATUS.RESOLVED,
       },
     },
+    katello: {
+      hostDetails: {},
+    },
   },
 };
 

data/webpack/scenes/ContentViews/Details/Versions/Compare/CVVersionCompare.js

@@ -0,0 +1,143 @@
+import React, { useState, useEffect, useCallback } from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { STATUS } from 'foremanReact/constants';
+import { Tab, Tabs, TabTitleText } from '@patternfly/react-core';
+import CVVersionCompareHeader from './CVVersionCompareHeader';
+import { selectCVDetails, selectCVVersionDetails, selectCVVersionDetailsStatus } from '../../ContentViewDetailSelectors';
+import getCVVersionCompareTableConfigs from './CVVersionCompareConfig';
+import CVVersionCompareTable from './CVVersionCompareTable';
+import getContentViewDetails, { getContentViewVersionDetails } from '../../ContentViewDetailActions';
+import Loading from '../../../../../components/Loading';
+import './CVVersionCompare.scss';
+
+const CVVersionCompare = ({
+  cvId,
+  versionIds,
+  versionLabels,
+}) => {
+  const dispatch = useDispatch();
+  const { versionOneId: initialVersionOneId, versionTwoId: initialVersionTwoId } = versionIds;
+  const { versionOneLabel: initialVersionOne, versionTwoLabel: initialVersionTwo } = versionLabels;
+  const { versions: cvDetails } = useSelector(state => selectCVDetails(state, cvId));
+  const [versionOne, setVersionOne] = useState(initialVersionOne);
+  const [versionTwo, setVersionTwo] = useState(initialVersionTwo);
+  const getIdFromVersion = useCallback(version => (cvDetails?.find(result =>
+    Number(result.version) === Number(version))?.id), [cvDetails]);
+
+  const versionOneDetails = useSelector(state =>
+    selectCVVersionDetails(state, String(getIdFromVersion(versionOne)
+      ?? initialVersionOneId), cvId));
+  const versionTwoDetails = useSelector(state =>
+    selectCVVersionDetails(state, String(getIdFromVersion(versionTwo)
+      ?? initialVersionTwoId), cvId));
+
+  const [selectedViewBy, setSelectedViewBy] = useState('All');
+  const tableConfigs = getCVVersionCompareTableConfigs({
+    versionOne,
+    versionTwo,
+    versionOneId: String(getIdFromVersion(versionOne)),
+    versionTwoId: String(getIdFromVersion(versionTwo)),
+    viewBy: selectedViewBy.toLowerCase(),
+  });
+
+  const filteredTableConfigs = tableConfigs.filter(({ getCountKey }) =>
+    !!getCountKey(versionOneDetails, versionTwoDetails));
+  const versionOneDetailsStatus = useSelector(state =>
+    selectCVVersionDetailsStatus(state, String(getIdFromVersion(versionOne)
+      ?? initialVersionOneId), cvId));
+  const versionTwoDetailsStatus = useSelector(state =>
+    selectCVVersionDetailsStatus(state, String(getIdFromVersion(versionTwo)
+      ?? initialVersionTwoId), cvId));
+
+  const [currentActiveTab, setCurrentActiveTab] = useState(__('RPM packages'));
+  const onSelect = (_e, eventKey) => {
+    // This prevents needless pushing on repeated clicks of a tab
+    if (currentActiveTab !== eventKey) {
+      setCurrentActiveTab(eventKey);
+    }
+  };
+  const activeTableConfig = filteredTableConfigs.find(config =>
+    String(currentActiveTab) === config.name);
+  const showTabs = filteredTableConfigs.length > 0;
+  const showCompareTable = !(versionOneDetailsStatus === STATUS.PENDING
+    ||
+    versionTwoDetailsStatus === STATUS.PENDING) && versionOne && versionTwo;
+
+  useEffect(() => {
+    if (!cvDetails) {
+      dispatch(getContentViewDetails(cvId));
+    }
+  }, [dispatch, cvDetails, cvId]);
+
+  useEffect(() => {
+    if (cvDetails) {
+      dispatch(getContentViewVersionDetails(String(getIdFromVersion(versionOne)
+        ?? initialVersionOneId), cvId));
+      dispatch(getContentViewVersionDetails(String(getIdFromVersion(versionTwo)
+        ?? initialVersionTwoId), cvId));
+    }
+  }, [dispatch, versionOne, versionTwo, cvId, getIdFromVersion, cvDetails,
+    initialVersionOneId, initialVersionTwoId]);
+
+  return (
+    <>
+      <CVVersionCompareHeader
+        versionOne={versionOne}
+        versionTwo={versionTwo}
+        cvId={cvId}
+        setVersionOne={setVersionOne}
+        setVersionTwo={setVersionTwo}
+        selectedViewBy={selectedViewBy}
+        setSelectedViewBy={setSelectedViewBy}
+      />
+      {showTabs && (
+        (showCompareTable &&
+          <div className="grid-with-top-border">
+            <Tabs
+              isVertical
+              activeKey={currentActiveTab}
+              onSelect={onSelect}
+              ouiaId="cv-version-compare-tabs"
+            >
+              {filteredTableConfigs.map((config) => {
+                const { name } = config;
+                return (
+                  <Tab
+                    key={name}
+                    eventKey={name}
+                    title={
+                      <>
+                        <TabTitleText>{name}</TabTitleText>
+                      </>}
+                  />
+                );
+              })}
+            </Tabs>
+            <div className="compare-table-container">
+              <CVVersionCompareTable
+                tableConfig={activeTableConfig}
+                versionOne={versionOne}
+                versionTwo={versionTwo}
+                currentActiveKey={currentActiveTab}
+                selectedViewBy={selectedViewBy}
+              />
+            </div>
+          </div >) || <Loading />)
+      }
+    </>
+  );
+};
+CVVersionCompare.propTypes = {
+  cvId: PropTypes.number.isRequired,
+  versionIds: PropTypes.shape({
+    versionOneId: PropTypes.string,
+    versionTwoId: PropTypes.string,
+  }).isRequired,
+  versionLabels: PropTypes.shape({
+    versionOneLabel: PropTypes.string,
+    versionTwoLabel: PropTypes.string,
+  }).isRequired,
+};
+export default CVVersionCompare;

data/webpack/scenes/ContentViews/Details/Versions/Compare/CVVersionCompare.scss

@@ -0,0 +1,51 @@
+.content-view-header-content {
+  padding-top: 24px;
+
+  .pf-c-content {
+    dl {
+      margin: 0;
+    }
+  }
+
+  .pf-l-flex {
+    padding-top: 24px;
+  }
+}
+
+.grid-with-top-border {
+  border-top: 1px solid #d2d2d2;
+  margin-top: 24px;
+  display: flex;
+
+  .compare-table-container {
+    flex-grow: 4;
+  }
+  .pf-c-tabs.pf-m-vertical {
+    max-width: 230px;
+    border-right: 1px solid #d2d2d2;
+    height: unset;
+
+    .pf-c-tabs__item {
+      margin-top: 0;
+
+      button {
+        align-items: center;
+
+        .pf-c-label__content {
+          &::before {
+            border: none;
+          }
+        }
+      }
+
+      &.pf-m-current .pf-c-label__content {
+        font-weight: bold;
+      }
+    }
+  }
+
+  .pf-l-grid.pf-m-gutter {
+    display: initial;
+    width: 100%;
+  }
+}