katello 3.18.0.rc1 → 4.0.0.rc1

data/package.json

@@ -26,7 +26,7 @@
     "@sheerun/mutationobserver-shim": "^0.3.3",
     "@testing-library/jest-dom": "^5.3.0",
     "@testing-library/react": "^10.0.2",
-    "@theforeman/builder": "^4.6.0",
+    "@theforeman/builder": ">= 6.0.0",
     "@theforeman/find-foreman": "^4.8.0",
     "axios-mock-adapter": "^1.10.0",
     "babel-eslint": "^10.0.3",

data/webpack/__mocks__/foremanReact/Root/Context/ForemanContext.js

@@ -1,3 +1,2 @@
 // eslint-disable-next-line import/prefer-default-export
 export const useForemanSettings = () => ({ perPage: 20 });
-export const usePaginationOptions = () => [5, 10, 20, 50];

data/webpack/__mocks__/foremanReact/components/Pagination/PaginationHooks.js

@@ -0,0 +1,2 @@
+// eslint-disable-next-line import/prefer-default-export
+export const usePaginationOptions = () => [5, 10, 20, 50];

data/webpack/__mocks__/foremanReact/components/common/dates/LongDateTime.js

@@ -0,0 +1,5 @@
+// This component uses the intl context from Foreman, we need to figure out how to mock that
+// context before using this component directly from Foreman in testing
+
+export default () => 'A Mocked Date';
+

data/webpack/{scenes/ContentViews/Details/Repositories → components/SelectableDropdown}/SelectableDropdown.js

@@ -1,12 +1,19 @@
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
-import { Select, SelectOption, SelectVariant, Level, LevelItem } from '@patternfly/react-core';
+import { Spinner, Select, SelectOption, SelectVariant, Level, LevelItem } from '@patternfly/react-core';
+import { ErrorCircleOIcon } from '@patternfly/react-icons';
+
 
 const SelectableDropdown = ({
-  items, title, selected, setSelected,
+  items, title, selected, setSelected, loading, error,
 }) => {
   const [isOpen, setIsOpen] = useState(false);
-  const onSelect = (event, selection) => {
+  const icon = () => {
+    if (error) return <span aria-label={`${title} error`}><ErrorCircleOIcon color="red" /></span>;
+    if (loading) return <span aria-label={`${title} spinner`}><Spinner size="sm" /></span>;
+    return null;
+  };
+  const onSelect = (_event, selection) => {
     setSelected(selection);
     setIsOpen(false);
   };
@@ -30,6 +37,8 @@ const SelectableDropdown = ({
           onSelect={onSelect}
           selections={selected}
           isOpen={isOpen}
+          isDisabled={loading || error}
+          toggleIcon={icon()}
         >
           {selectItems}
         </Select>
@@ -43,6 +52,14 @@ SelectableDropdown.propTypes = {
   title: PropTypes.string.isRequired,
   selected: PropTypes.string.isRequired,
   setSelected: PropTypes.func.isRequired,
+  // If the items are loaded dynamically, you can pass in loading or error states
+  loading: PropTypes.bool,
+  error: PropTypes.bool,
+};
+
+SelectableDropdown.defaultProps = {
+  loading: false,
+  error: false,
 };
 
 

data/webpack/components/SelectableDropdown/__tests__/SelectableDropdown.test.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import { render } from 'react-testing-lib-wrapper';
+
+import SelectableDropdown from '../SelectableDropdown';
+
+const type = 'Breakfast';
+
+test('Can dynamically load options', async () => {
+  const { rerender, queryByText, queryByLabelText } = render(<SelectableDropdown
+    items={[]}
+    title={type}
+    selected=""
+    setSelected={jest.fn}
+    placeholderText={type}
+    loading
+    error={false}
+  />);
+  expect(queryByLabelText(`${type} spinner`)).toBeInTheDocument();
+
+  rerender(<SelectableDropdown
+    items={['donut', 'croissant', 'bear claw']}
+    title={type}
+    selected=""
+    setSelected={jest.fn}
+    placeholderText={type}
+    loading={false}
+    error={false}
+  />);
+  expect(queryByLabelText(`${type} spinner`)).not.toBeInTheDocument();
+  expect(queryByText('donut')).toBeInTheDocument();
+});
+
+
+test('Can handle error', async () => {
+  const { queryByLabelText } = render(<SelectableDropdown
+    items={[]}
+    title={type}
+    selected=""
+    setSelected={jest.fn}
+    placeholderText={type}
+    loading={false}
+    error
+  />);
+  expect(queryByLabelText(`${type} error`)).toBeInTheDocument();
+});

data/webpack/components/SelectableDropdown/index.js

@@ -0,0 +1,3 @@
+import SelectableDropdown from './SelectableDropdown';
+
+export default SelectableDropdown;

data/webpack/components/Table/TableWrapper.js

@@ -3,7 +3,8 @@ import { Pagination, Flex, FlexItem } from '@patternfly/react-core';
 
 import PropTypes from 'prop-types';
 import { useDispatch } from 'react-redux';
-import { usePaginationOptions, useForemanSettings } from 'foremanReact/Root/Context/ForemanContext';
+import { useForemanSettings } from 'foremanReact/Root/Context/ForemanContext';
+import { usePaginationOptions } from 'foremanReact/components/Pagination/PaginationHooks';
 
 import MainTable from './MainTable';
 import Search from '../../components/Search';

data/webpack/components/Table/helpers.js

@@ -0,0 +1,14 @@
+// Can be included as a TableWrapper prop for selectable rows
+const onSelect = (rows, setRows) => (_event, isSelected, rowId) => {
+  let newRows;
+  if (rowId === -1) {
+    newRows = rows.map(row => ({ ...row, selected: isSelected }));
+  } else {
+    newRows = [...rows];
+    newRows[rowId].selected = isSelected;
+  }
+
+  setRows(newRows);
+};
+
+export default onSelect;

data/webpack/components/TypeAhead/TypeAhead.js

@@ -1,6 +1,7 @@
 import React, { Component } from 'react';
 import Downshift from 'downshift';
 import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
 
 import TypeAheadSearch from './pf3Search/TypeAheadSearch';
 // eslint-disable-next-line import/no-named-default
@@ -101,7 +102,7 @@ TypeAhead.propTypes = {
 };
 
 TypeAhead.defaultProps = {
-  actionText: 'Search',
+  actionText: __('Search'),
   initialInputValue: '',
   patternfly4: false,
 };

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import { InputGroup, Button, Icon } from 'patternfly-react';
 import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
 
 import TypeAheadInput from './TypeAheadInput';
 import TypeAheadItems from './TypeAheadItems';
@@ -46,7 +47,7 @@ TypeAheadSearch.propTypes = {
 };
 
 TypeAheadSearch.defaultProps = {
-  actionText: 'Search',
+  actionText: __('Search'),
 };
 
 export default TypeAheadSearch;

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

@@ -7,7 +7,6 @@ import keyPressHandler from '../helpers/helpers';
 import TypeAheadInput from './TypeAheadInput';
 import TypeAheadItems from './TypeAheadItems';
 import commonSearchPropTypes from '../helpers/commonPropTypes';
-import './TypeAheadSearch.scss';
 
 const TypeAheadSearch = ({
   userInputValue, clearSearch, getInputProps, getItemProps, isOpen, inputValue, highlightedIndex,

data/webpack/containers/Application/overrides.scss

@@ -54,3 +54,9 @@ td, th {
     }
   }
 }
+
+// Override browser default outline ring on focus
+*:focus {
+  outline: none;
+}
+

data/webpack/index.js

@@ -5,6 +5,7 @@
 
 import componentRegistry from 'foremanReact/components/componentRegistry';
 import Application from './containers/Application/index';
+import Content from './scenes/SmartProxy/Content';
 import './redux';
 // Not currently mocking anything
 // import './services/api/setupMocks';
@@ -13,3 +14,8 @@ componentRegistry.register({
   name: 'katello',
   type: Application,
 });
+
+componentRegistry.register({
+  name: 'Content',
+  type: Content,
+});

data/webpack/redux/actions/RedHatRepositories/helpers.js

@@ -25,16 +25,16 @@ const recommendedRepositoriesRHEL = [
 ];
 
 const recommendedRepositoriesSatTools = [
-  'satellite-tools-6.8-for-rhel-8-x86_64-rpms',
-  'rhel-7-server-satellite-tools-6.8-rpms',
-  'rhel-6-server-satellite-tools-6.8-rpms',
-  'rhel-5-server-els-satellite-tools-6.8-rpms',
+  'satellite-tools-6.9-for-rhel-8-x86_64-rpms',
+  'rhel-7-server-satellite-tools-6.9-rpms',
+  'rhel-6-server-satellite-tools-6.9-rpms',
+  'rhel-5-server-els-satellite-tools-6.9-rpms',
   'rhel-7-server-satellite-maintenance-6-rpms',
 ];
 
 const recommendedRepositoriesMisc = [
   'rhel-server-rhscl-7-rpms',
-  'rhel-7-server-satellite-capsule-6.8-rpms',
+  'rhel-7-server-satellite-capsule-6.9-rpms',
   'rhel-7-server-ansible-2.9-rpms',
 ];
 

data/webpack/scenes/ContentViews/ContentViewsActions.js

@@ -1,6 +1,8 @@
-import { API_OPERATIONS, get } from 'foremanReact/redux/API';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { API_OPERATIONS, get, post } from 'foremanReact/redux/API';
 import api, { orgId } from '../../services/api';
-import CONTENT_VIEWS_KEY from './ContentViewsConstants';
+import CONTENT_VIEWS_KEY, { CREATE_CONTENT_VIEW_KEY, COPY_CONTENT_VIEW_KEY } from './ContentViewsConstants';
+import { getResponseErrorMsgs } from '../../utils/helpers';
 
 export const createContentViewsParams = extraParams => ({
   organization_id: orgId(),
@@ -15,4 +17,31 @@ const getContentViews = extraParams => get({
   params: createContentViewsParams(extraParams),
 });
 
+const cvSuccessToast = (response) => {
+  const { data: { name } } = response;
+  return __(`Content view ${name} created`);
+};
+
+const cvErrorToast = (error) => {
+  const message = getResponseErrorMsgs(error.response);
+  return message;
+};
+
+export const createContentView = params => post({
+  type: API_OPERATIONS.POST,
+  key: CREATE_CONTENT_VIEW_KEY,
+  url: api.getApiUrl('/content_views'),
+  params,
+  successToast: response => cvSuccessToast(response),
+  errorToast: error => cvErrorToast(error),
+});
+
+export const copyContentView = params => post({
+  type: API_OPERATIONS.POST,
+  key: COPY_CONTENT_VIEW_KEY,
+  url: api.getApiUrl(`/content_views/${params.id}/copy`),
+  params,
+  successToast: response => cvSuccessToast(response),
+  errorToast: error => cvErrorToast(error),
+});
 export default getContentViews;

data/webpack/scenes/ContentViews/ContentViewsConstants.js

@@ -1,14 +1,18 @@
 const CONTENT_VIEWS_KEY = 'CONTENT_VIEWS';
+export const CREATE_CONTENT_VIEW_KEY = 'CONTENT_VIEW_CREATE';
+export const COPY_CONTENT_VIEW_KEY = 'CONTENT_VIEW_COPY';
 export const UPDATE_CONTENT_VIEW = 'UPDATE_CONTENT_VIEW';
 export const UPDATE_CONTENT_VIEW_SUCCESS = 'UPDATE_CONTENT_VIEW_SUCCESS';
 export const UPDATE_CONTENT_VIEW_FAILURE = 'UPDATE_CONTENT_VIEW_FAILURE';
-
 export const cvDetailsKey = cvId => `${CONTENT_VIEWS_KEY}_${cvId}`;
 export const cvDetailsRepoKey = cvId => `${CONTENT_VIEWS_KEY}_REPOSITORIES_${cvId}`;
+export const cvDetailsFilterKey = cvId => `${CONTENT_VIEWS_KEY}_FILTERS_${cvId}`;
 
 // Repo added to content view status display and key
 export const ADDED = 'Added';
 export const NOT_ADDED = 'Not added';
 export const ALL_STATUSES = 'All';
 
+export const REPOSITORY_TYPES = 'REPOSITORY_TYPES';
+
 export default CONTENT_VIEWS_KEY;

data/webpack/scenes/ContentViews/Copy/ContentViewCopySelectors.js

@@ -0,0 +1,16 @@
+import {
+  selectAPIStatus,
+  selectAPIError,
+  selectAPIResponse,
+} from 'foremanReact/redux/API/APISelectors';
+import { STATUS } from 'foremanReact/constants';
+import { COPY_CONTENT_VIEW_KEY } from '../ContentViewsConstants';
+
+export const selectCopyContentViews = state =>
+  selectAPIResponse(state, COPY_CONTENT_VIEW_KEY) || {};
+
+export const selectCopyContentViewStatus = state =>
+  selectAPIStatus(state, COPY_CONTENT_VIEW_KEY) || STATUS.PENDING;
+
+export const selectCopyContentViewError = state =>
+  selectAPIError(state, COPY_CONTENT_VIEW_KEY);

data/webpack/scenes/ContentViews/Copy/CopyContentViewForm.js

@@ -0,0 +1,77 @@
+import { STATUS } from 'foremanReact/constants';
+import React, { useState, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { useDispatch, useSelector } from 'react-redux';
+import { Redirect } from 'react-router-dom';
+import { Form, FormGroup, TextInput, ActionGroup, Button } from '@patternfly/react-core';
+import {
+  selectCopyContentViewError, selectCopyContentViews,
+  selectCopyContentViewStatus,
+} from './ContentViewCopySelectors';
+import { copyContentView } from '../ContentViewsActions';
+
+const CopyContentViewForm = ({ cvId, setModalOpen }) => {
+  const dispatch = useDispatch();
+  const [name, setName] = useState('');
+  const [redirect, setRedirect] = useState(false);
+  const [saving, setSaving] = useState(false);
+  const response = useSelector(selectCopyContentViews);
+  const status = useSelector(selectCopyContentViewStatus);
+  const error = useSelector(selectCopyContentViewError);
+
+  useEffect(() => {
+    const { id } = response;
+    if (id && status === STATUS.RESOLVED) {
+      setSaving(false);
+      setRedirect(true);
+    } else if (status === STATUS.ERROR) {
+      setSaving(false);
+    }
+  }, [JSON.stringify(response), status, error]);
+
+  const onSubmit = () => {
+    setSaving(true);
+    dispatch(copyContentView({
+      id: cvId,
+      name,
+    }));
+  };
+
+  if (redirect) {
+    const { id } = response;
+    return (<Redirect to={`/labs/content_views/${id}`} />);
+  }
+
+  return (
+    <Form>
+      <FormGroup label="Name" isRequired fieldId="name">
+        <TextInput
+          isRequired
+          type="text"
+          id="name"
+          aria-label="input_name"
+          name="name"
+          value={name}
+          onChange={value => setName(value)}
+        />
+      </FormGroup>
+      <ActionGroup>
+        <Button aria-label="copy_content_view" variant="primary" isDisabled={saving} onClick={() => onSubmit()}>Copy content view</Button>
+        <Button variant="link" onClick={() => setModalOpen(false)}>Cancel</Button>
+      </ActionGroup>
+    </Form>
+  );
+};
+
+CopyContentViewForm.propTypes = {
+  cvId: PropTypes.string,
+  setModalOpen: PropTypes.func,
+};
+
+CopyContentViewForm.defaultProps = {
+  cvId: null,
+  setModalOpen: null,
+};
+
+
+export default CopyContentViewForm;

data/webpack/scenes/ContentViews/Copy/CopyContentViewModal.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Modal, ModalVariant } from '@patternfly/react-core';
+import CopyContentViewForm from './CopyContentViewForm';
+
+const CopyContentViewModal = ({
+  cvId, cvName, show, setIsOpen,
+}) => {
+  const description = (
+    <p>
+      This will create a copy of <b>{cvName}</b>, including details,
+      repositories, and filters. Generated data such
+      as history, tasks and versions will not be copied.
+    </p>
+  );
+  return (
+    <Modal
+      title="Copy content view"
+      variant={ModalVariant.small}
+      isOpen={show}
+      description={description}
+      onClose={() => {
+        setIsOpen(false);
+      }}
+      appendTo={document.body}
+    ><CopyContentViewForm cvId={cvId} setModalOpen={setIsOpen} />
+    </Modal>);
+};
+
+CopyContentViewModal.propTypes = {
+  cvId: PropTypes.string,
+  cvName: PropTypes.string,
+  show: PropTypes.bool,
+  setIsOpen: PropTypes.func,
+};
+
+CopyContentViewModal.defaultProps = {
+  cvId: null,
+  cvName: null,
+  show: false,
+  setIsOpen: null,
+};
+
+export default CopyContentViewModal;