katello 3.18.0.rc2.1 → 4.0.0.rc2

data/webpack/scenes/ContentViews/Copy/__tests__/contentViewCopyResult.fixtures.json

@@ -0,0 +1,42 @@
+{
+  "content_host_count": 0,
+  "composite": false,
+  "component_ids": [],
+  "default": false,
+  "force_puppet_environment": false,
+  "version_count": 0,
+  "latest_version": null,
+  "auto_publish": false,
+  "solve_dependencies": false,
+  "import_only": false,
+  "repository_ids": [],
+  "id": 34,
+  "name": "copy cv",
+  "label": "copy_cv",
+  "description": "",
+  "organization_id": 1,
+  "organization": {
+    "name": "Default Organization",
+    "label": "Default_Organization",
+    "id": 1
+  },
+  "created_at": "2020-12-14 12:45:59 -0500",
+  "updated_at": "2020-12-14 12:45:59 -0500",
+  "environments": [],
+  "repositories": [],
+  "puppet_modules": [],
+  "versions": [],
+  "components": [],
+  "content_view_components": [],
+  "activation_keys": [],
+  "next_version": "1.0",
+  "last_published": null,
+  "permissions": {
+    "view_content_views": true,
+    "edit_content_views": true,
+    "destroy_content_views": true,
+    "publish_content_views": true,
+    "promote_or_remove_content_views": true
+  },
+  "duplicate_repositories_to_publish": []
+}

data/webpack/scenes/ContentViews/Copy/__tests__/copyContentView.test.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import { renderWithRedux, patientlyWaitFor, fireEvent } from 'react-testing-lib-wrapper';
+
+import { nockInstance, assertNockRequest } from '../../../../test-utils/nockWrapper';
+import api from '../../../../services/api';
+import CopyContentViewForm from '../CopyContentViewForm';
+
+const cvCopyData = require('./contentViewCopyResult.fixtures.json');
+
+const cvId = '1';
+const cvCopyPath = api.getApiUrl(`/content_views/${cvId}/copy`);
+const setModalOpen = jest.fn();
+
+const copyParams = {
+  id: cvId,
+  name: 'cv copy',
+};
+
+const copiedCVDetails = { ...cvCopyData };
+
+const form = <CopyContentViewForm cvId={cvId} setModalOpen={setModalOpen} />;
+
+test('Can copy content view from form', async (done) => {
+  const copyscope = nockInstance
+    .post(cvCopyPath, copyParams)
+    .reply(201, copiedCVDetails);
+  const { queryByText, getByLabelText } = renderWithRedux(form);
+  expect(queryByText('Name')).toBeInTheDocument();
+
+  fireEvent.change(getByLabelText('input_name'), { target: { value: 'cv copy' } });
+
+  getByLabelText('copy_content_view').click();
+  // Form closes it self on success
+  await patientlyWaitFor(() => {
+    expect(queryByText('Name')).not.toBeInTheDocument();
+  });
+
+  assertNockRequest(copyscope, done);
+});

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

@@ -0,0 +1,4 @@
+import { withRouter } from 'react-router-dom';
+import CopyContentViewModal from './CopyContentViewModal';
+
+export default withRouter(CopyContentViewModal);

data/webpack/scenes/ContentViews/Create/ContentViewCreateSelectors.js

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

data/webpack/scenes/ContentViews/Create/ContentViewFormComponents.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { OutlinedQuestionCircleIcon } from '@patternfly/react-icons';
+import { Tooltip, TooltipPosition, Flex, FlexItem } from '@patternfly/react-core';
+import { autoPublishHelpText, dependenciesHelpText, importOnlyHelpText } from '../helpers';
+import ContentViewIcon from '../components/ContentViewIcon';
+
+const HelpToolTip = tooltip => (
+  <span className="foreman-spaced-icon">
+    <Tooltip
+      position={TooltipPosition.top}
+      content={tooltip}
+    >
+      <OutlinedQuestionCircleIcon />
+    </Tooltip>
+  </span>
+);
+
+export const LabelComposite = () => (
+  <Flex>
+    <FlexItem spacer={{ default: 'spacerNone' }}><ContentViewIcon composite /></FlexItem>
+    <FlexItem>{__('Composite Content View')}</FlexItem>
+  </Flex>
+);
+
+export const LabelComponent = () => (
+  <Flex>
+    <FlexItem spacer={{ default: 'spacerNone' }}><ContentViewIcon composite={false} /></FlexItem>
+    <FlexItem>{__('Component Content View')}</FlexItem>
+  </Flex>
+);
+
+export const LabelDependencies = () => (
+  <Flex>
+    <FlexItem spacer={{ default: 'spacerSm' }}>{__('Solve Dependencies')}</FlexItem>
+    <FlexItem>
+      {HelpToolTip(dependenciesHelpText)}
+    </FlexItem>
+  </Flex>
+);
+
+export const LabelAutoPublish = () => (
+  <Flex>
+    <FlexItem spacer={{ default: 'spacerSm' }}>{__('Auto Publish')}</FlexItem>
+    <FlexItem>
+      {HelpToolTip(autoPublishHelpText)}
+    </FlexItem>
+  </Flex>
+);
+
+export const LabelImportOnly = () => (
+  <Flex>
+    <FlexItem spacer={{ default: 'spacerSm' }}>{__('Import Only')}</FlexItem>
+    <FlexItem>
+      {HelpToolTip(importOnlyHelpText)}
+    </FlexItem>
+  </Flex>
+);

data/webpack/scenes/ContentViews/Create/CreateContentViewForm.js

@@ -0,0 +1,175 @@
+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, TextArea, Checkbox, ActionGroup, Button, Tile, Grid, GridItem } from '@patternfly/react-core';
+import { createContentView } from '../ContentViewsActions';
+import { selectCreateContentViews, selectCreateContentViewStatus, selectCreateContentViewError } from './ContentViewCreateSelectors';
+import { LabelDependencies, LabelAutoPublish, LabelImportOnly } from './ContentViewFormComponents';
+import ContentViewIcon from '../components/ContentViewIcon';
+
+const CreateContentViewForm = ({ setModalOpen }) => {
+  const dispatch = useDispatch();
+  const [name, setName] = useState('');
+  const [label, setLabel] = useState('');
+  const [description, setDescription] = useState('');
+  const [composite, setComposite] = useState(false);
+  const [component, setComponent] = useState(true);
+  const [autoPublish, setAutoPublish] = useState(false);
+  const [importOnly, setImportOnly] = useState(false);
+  const [dependencies, setDependencies] = useState(false);
+  const [redirect, setRedirect] = useState(false);
+  const [saving, setSaving] = useState(false);
+
+  const response = useSelector(selectCreateContentViews);
+  const status = useSelector(selectCreateContentViewStatus);
+  const error = useSelector(selectCreateContentViewError);
+
+  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 onSave = () => {
+    setSaving(true);
+    dispatch(createContentView({
+      name,
+      label,
+      description,
+      composite,
+      solve_dependencies: dependencies,
+      auto_publish: (autoPublish && composite),
+      import_only: importOnly,
+    }));
+  };
+
+  useEffect(
+    () => {
+      setLabel(name.replace(/ /g, '_'));
+    },
+    [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>
+      <FormGroup label="Label" isRequired fieldId="label">
+        <TextInput
+          isRequired
+          type="text"
+          id="label"
+          aria-label="input_label"
+          name="label"
+          value={label}
+          onChange={value => setLabel(value)}
+        />
+      </FormGroup>
+      <FormGroup label="Description" fieldId="description">
+        <TextArea
+          isRequired
+          type="text"
+          id="description"
+          name="description"
+          aria-label="input_description"
+          value={description}
+          onChange={value => setDescription(value)}
+        />
+      </FormGroup>
+      <FormGroup isInline fieldId="type" label="Type">
+        <Grid hasGutter>
+          <GridItem span={6}>
+            <Tile
+              isStacked
+              aria-label="component_tile"
+              icon={<ContentViewIcon composite={false} />}
+              id="component"
+              title="Component content view"
+              onClick={() => { setComponent(true); setComposite(false); }}
+              isSelected={component}
+            >
+              Single content view consisting of repositories
+            </Tile>
+          </GridItem>
+          <GridItem span={6}>
+            <Tile
+              isStacked
+              aria-label="composite_tile"
+              icon={<ContentViewIcon composite />}
+              id="composite"
+              title="Composite content view"
+              onClick={() => { setComposite(true); setComponent(false); }}
+              isSelected={composite}
+            >
+              Consists of component content views
+            </Tile>
+          </GridItem>
+        </Grid>
+      </FormGroup>
+      {!composite &&
+        <FormGroup isInline fieldId="dependencies">
+          <Checkbox
+            id="dependencies"
+            name="dependencies"
+            label={LabelDependencies()}
+            isChecked={dependencies}
+            onChange={checked => setDependencies(checked)}
+          />
+        </FormGroup>}
+      {!composite &&
+        <FormGroup isInline fieldId="importOnly">
+          <Checkbox
+            id="importOnly"
+            name="importOnly"
+            label={LabelImportOnly()}
+            isChecked={importOnly}
+            onChange={checked => setImportOnly(checked)}
+          />
+        </FormGroup>}
+      {composite &&
+        <FormGroup isInline fieldId="autoPublish">
+          <Checkbox
+            id="autoPublish"
+            name="autoPublish"
+            label={LabelAutoPublish()}
+            isChecked={autoPublish}
+            onChange={checked => setAutoPublish(checked)}
+          />
+        </FormGroup>}
+      <ActionGroup>
+        <Button aria-label="create_content_view" variant="primary" isDisabled={saving} onClick={() => onSave()}>Create content view</Button>
+        <Button variant="link" onClick={() => setModalOpen(false)}>Cancel</Button>
+      </ActionGroup>
+    </Form>
+  );
+};
+
+CreateContentViewForm.propTypes = {
+  setModalOpen: PropTypes.func,
+};
+
+CreateContentViewForm.defaultProps = {
+  setModalOpen: null,
+};
+
+export default CreateContentViewForm;

data/webpack/scenes/ContentViews/Create/CreateContentViewModal.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Modal, ModalVariant } from '@patternfly/react-core';
+import CreateContentViewForm from './CreateContentViewForm';
+
+const CreateContentViewModal = ({ show, setIsOpen }) => (
+  <Modal
+    title="Create content view"
+    variant={ModalVariant.small}
+    isOpen={show}
+    onClose={() => { setIsOpen(false); }}
+    appendTo={document.body}
+  ><CreateContentViewForm setModalOpen={setIsOpen} />
+  </Modal>
+);
+
+CreateContentViewModal.propTypes = {
+  show: PropTypes.bool,
+  setIsOpen: PropTypes.func,
+};
+
+CreateContentViewModal.defaultProps = {
+  show: false,
+  setIsOpen: null,
+};
+
+export default CreateContentViewModal;

data/webpack/scenes/ContentViews/Create/__tests__/contentViewCreateResult.fixtures.json

@@ -0,0 +1,42 @@
+{
+  "content_host_count": 0,
+  "composite": false,
+  "component_ids": [],
+  "default": false,
+  "force_puppet_environment": false,
+  "version_count": 0,
+  "latest_version": null,
+  "auto_publish": false,
+  "solve_dependencies": false,
+  "import_only": false,
+  "repository_ids": [],
+  "id": 34,
+  "name": "1232123",
+  "label": "1232123",
+  "description": "",
+  "organization_id": 1,
+  "organization": {
+    "name": "Default Organization",
+    "label": "Default_Organization",
+    "id": 1
+  },
+  "created_at": "2020-12-14 12:45:59 -0500",
+  "updated_at": "2020-12-14 12:45:59 -0500",
+  "environments": [],
+  "repositories": [],
+  "puppet_modules": [],
+  "versions": [],
+  "components": [],
+  "content_view_components": [],
+  "activation_keys": [],
+  "next_version": "1.0",
+  "last_published": null,
+  "permissions": {
+    "view_content_views": true,
+    "edit_content_views": true,
+    "destroy_content_views": true,
+    "publish_content_views": true,
+    "promote_or_remove_content_views": true
+  },
+  "duplicate_repositories_to_publish": []
+}

data/webpack/scenes/ContentViews/Create/__tests__/createContentView.test.js

@@ -0,0 +1,92 @@
+import React from 'react';
+import { renderWithRedux, patientlyWaitFor, fireEvent } from 'react-testing-lib-wrapper';
+
+import { nockInstance, assertNockRequest } from '../../../../test-utils/nockWrapper';
+import api from '../../../../services/api';
+import CreateContentViewForm from '../CreateContentViewForm';
+
+const cvCreateData = require('./contentViewCreateResult.fixtures.json');
+
+const cvCreatePath = api.getApiUrl('/content_views');
+
+const setModalOpen = jest.fn();
+
+const createDetails = {
+  name: '1232123',
+  label: '1232123',
+  description: '',
+  composite: false,
+  solve_dependencies: false,
+  auto_publish: false,
+  import_only: false,
+};
+
+const createdCVDetails = { ...cvCreateData };
+
+const form = <CreateContentViewForm setModalOpen={setModalOpen} />;
+
+test('Can save content view from form', async (done) => {
+  const createscope = nockInstance
+    .post(cvCreatePath, createDetails)
+    .reply(201, createdCVDetails);
+  const { queryByText, getByLabelText } = renderWithRedux(form);
+  expect(queryByText('Description')).toBeInTheDocument();
+
+  fireEvent.change(getByLabelText('input_name'), { target: { value: '1232123' } });
+
+  await patientlyWaitFor(() => { expect(getByLabelText('input_label')).toHaveAttribute('value', '1232123'); });
+
+  getByLabelText('create_content_view').click();
+
+  assertNockRequest(createscope, done);
+});
+
+test('Form closes itself upon save', async (done) => {
+  const createscope = nockInstance
+    .post(cvCreatePath, createDetails)
+    .reply(201, createdCVDetails);
+  const { getByText, queryByText, getByLabelText } = renderWithRedux(form);
+  expect(getByText('Description')).toBeInTheDocument();
+  expect(getByText('Name')).toBeInTheDocument();
+  expect(getByText('Label')).toBeInTheDocument();
+
+  fireEvent.change(getByLabelText('input_name'), { target: { value: '1232123' } });
+
+  await patientlyWaitFor(() => { expect(getByLabelText('input_label')).toHaveAttribute('value', '1232123'); });
+
+  getByLabelText('create_content_view').click();
+  // Form closes it self on success
+  await patientlyWaitFor(() => {
+    expect(queryByText('Description')).not.toBeInTheDocument();
+  });
+
+  assertNockRequest(createscope, done);
+});
+
+test('Displays dependent fields correctly', () => {
+  const { getByText, queryByText, getByLabelText } = renderWithRedux(form);
+  expect(getByText('Description')).toBeInTheDocument();
+  expect(getByText('Name')).toBeInTheDocument();
+  expect(getByText('Label')).toBeInTheDocument();
+  expect(getByText('Composite content view')).toBeInTheDocument();
+  expect(getByText('Component content view')).toBeInTheDocument();
+  expect(getByText('Solve Dependencies')).toBeInTheDocument();
+  expect(queryByText('Auto Publish')).not.toBeInTheDocument();
+  expect(getByText('Import Only')).toBeInTheDocument();
+
+  // label auto_set
+  fireEvent.change(getByLabelText('input_name'), { target: { value: '123 2123' } });
+  expect(getByLabelText('input_label')).toHaveAttribute('value', '123_2123');
+
+  // display Auto Publish when Composite CV
+  fireEvent.click(getByLabelText('composite_tile'));
+  expect(queryByText('Solve Dependencies')).not.toBeInTheDocument();
+  expect(getByText('Auto Publish')).toBeInTheDocument();
+  expect(queryByText('Import Only')).not.toBeInTheDocument();
+
+  // display Solve Dependencies when Component CV
+  fireEvent.click(getByLabelText('component_tile'));
+  expect(getByText('Solve Dependencies')).toBeInTheDocument();
+  expect(queryByText('Auto Publish')).not.toBeInTheDocument();
+  expect(getByText('Import Only')).toBeInTheDocument();
+});