katello 4.1.4 → 4.2.0.rc1

data/webpack/scenes/ContentViews/Details/ComponentContentViews/__tests__/publishedContentViewDetails.fixtures.json

@@ -0,0 +1,367 @@
+{
+  "content_host_count": 0,
+  "composite": false,
+  "component_ids": [],
+  "default": false,
+  "version_count": 33,
+  "latest_version": "33.0",
+  "latest_version_id": 85,
+  "auto_publish": false,
+  "solve_dependencies": false,
+  "import_only": false,
+  "repository_ids": [],
+  "id": 13,
+  "name": "10",
+  "label": "10",
+  "description": "",
+  "organization_id": 1,
+  "organization": {
+    "name": "Default Organization",
+    "label": "Default_Organization",
+    "id": 1
+  },
+  "created_at": "2021-06-21 03:52:16 -1000",
+  "updated_at": "2021-06-22 11:03:15 -1000",
+  "last_task": {
+    "id": "861e56ab-e582-46ff-a56f-4db0a66f6cd3",
+    "result": "success",
+    "last_sync_words": "14 days"
+  },
+  "latest_version_environments": [
+    {
+      "id": 1,
+      "name": "Library",
+      "label": "Library"
+    },
+    {
+      "id": 5,
+      "name": "dev1",
+      "label": "dev1"
+    },
+    {
+      "id": 6,
+      "name": "test1",
+      "label": "test1"
+    },
+    {
+      "id": 7,
+      "name": "prod1",
+      "label": "prod1"
+    },
+    {
+      "id": 9,
+      "name": "dev2",
+      "label": "dev2"
+    }
+  ],
+  "environments": [
+    {
+      "id": 1,
+      "name": "Library",
+      "label": "Library",
+      "permissions": {
+        "readable": true
+      }
+    },
+    {
+      "id": 5,
+      "name": "dev1",
+      "label": "dev1",
+      "permissions": {
+        "readable": true
+      }
+    },
+    {
+      "id": 6,
+      "name": "test1",
+      "label": "test1",
+      "permissions": {
+        "readable": true
+      }
+    },
+    {
+      "id": 7,
+      "name": "prod1",
+      "label": "prod1",
+      "permissions": {
+        "readable": true
+      }
+    },
+    {
+      "id": 8,
+      "name": "test2",
+      "label": "test2",
+      "permissions": {
+        "readable": true
+      }
+    },
+    {
+      "id": 9,
+      "name": "dev2",
+      "label": "dev2",
+      "permissions": {
+        "readable": true
+      }
+    },
+    {
+      "id": 10,
+      "name": "qa2",
+      "label": "qa2",
+      "permissions": {
+        "readable": true
+      }
+    },
+    {
+      "id": 11,
+      "name": "prod2",
+      "label": "prod2",
+      "permissions": {
+        "readable": true
+      }
+    },
+    {
+      "id": 12,
+      "name": "dev3",
+      "label": "dev3",
+      "permissions": {
+        "readable": true
+      }
+    },
+    {
+      "id": 13,
+      "name": "test3",
+      "label": "test3",
+      "permissions": {
+        "readable": true
+      }
+    }
+  ],
+  "repositories": [],
+  "versions": [
+    {
+      "id": 52,
+      "version": "1.0",
+      "published": "2021-06-22 06:07:43 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 53,
+      "version": "2.0",
+      "published": "2021-06-22 06:09:02 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 54,
+      "version": "3.0",
+      "published": "2021-06-22 06:09:33 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 55,
+      "version": "4.0",
+      "published": "2021-06-22 06:29:29 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 56,
+      "version": "5.0",
+      "published": "2021-06-22 06:29:56 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 57,
+      "version": "6.0",
+      "published": "2021-06-22 06:30:29 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 58,
+      "version": "7.0",
+      "published": "2021-06-22 06:32:10 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 59,
+      "version": "8.0",
+      "published": "2021-06-22 06:38:01 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 60,
+      "version": "9.0",
+      "published": "2021-06-22 06:41:03 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 61,
+      "version": "10.0",
+      "published": "2021-06-22 06:53:06 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 62,
+      "version": "11.0",
+      "published": "2021-06-22 06:55:03 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 63,
+      "version": "12.0",
+      "published": "2021-06-22 06:57:47 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 64,
+      "version": "13.0",
+      "published": "2021-06-22 06:58:13 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 65,
+      "version": "14.0",
+      "published": "2021-06-22 06:58:44 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 66,
+      "version": "15.0",
+      "published": "2021-06-22 07:00:51 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 67,
+      "version": "16.0",
+      "published": "2021-06-22 07:02:35 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 68,
+      "version": "17.0",
+      "published": "2021-06-22 07:03:15 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 69,
+      "version": "18.0",
+      "published": "2021-06-22 07:12:38 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 70,
+      "version": "19.0",
+      "published": "2021-06-22 07:38:55 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 71,
+      "version": "20.0",
+      "published": "2021-06-22 07:39:27 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 72,
+      "version": "21.0",
+      "published": "2021-06-22 08:09:53 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 73,
+      "version": "22.0",
+      "published": "2021-06-22 08:10:23 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 74,
+      "version": "23.0",
+      "published": "2021-06-22 09:24:48 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 75,
+      "version": "24.0",
+      "published": "2021-06-22 09:28:09 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 76,
+      "version": "25.0",
+      "published": "2021-06-22 09:31:50 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 77,
+      "version": "26.0",
+      "published": "2021-06-22 09:33:03 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 78,
+      "version": "27.0",
+      "published": "2021-06-22 09:34:31 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 79,
+      "version": "28.0",
+      "published": "2021-06-22 09:35:00 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 80,
+      "version": "29.0",
+      "published": "2021-06-22 09:35:18 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 81,
+      "version": "30.0",
+      "published": "2021-06-22 10:55:48 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 83,
+      "version": "31.0",
+      "published": "2021-06-22 10:58:09 -1000",
+      "environment_ids": []
+    },
+    {
+      "id": 84,
+      "version": "32.0",
+      "published": "2021-06-22 10:58:37 -1000",
+      "environment_ids": [
+        8,
+        10,
+        11,
+        12,
+        13
+      ]
+    },
+    {
+      "id": 85,
+      "version": "33.0",
+      "published": "2021-06-22 11:03:15 -1000",
+      "environment_ids": [
+        1,
+        5,
+        6,
+        7,
+        9
+      ]
+    }
+  ],
+  "components": [],
+  "content_view_components": [],
+  "activation_keys": [],
+  "hosts": [],
+  "next_version": "34.0",
+  "last_published": "2021-06-22 11:03:15 -1000",
+  "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": [],
+  "errors": null
+}

data/webpack/scenes/ContentViews/Details/ContentViewDetailActions.js

@@ -1,10 +1,13 @@
-import { API_OPERATIONS, get, put } from 'foremanReact/redux/API';
+import { API_OPERATIONS, APIActions, get, put, post } from 'foremanReact/redux/API';
 import { addToast } from 'foremanReact/redux/actions/toasts';
 import { translate as __ } from 'foremanReact/common/I18n';
 import {
   UPDATE_CONTENT_VIEW,
   UPDATE_CONTENT_VIEW_FAILURE,
   UPDATE_CONTENT_VIEW_SUCCESS,
+  CREATE_CONTENT_VIEW_FILTER_KEY,
+  DELETE_CONTENT_VIEW_FILTER_KEY,
+  DELETE_CONTENT_VIEW_FILTERS_KEY,
   NOT_ADDED,
   ALL_STATUSES,
   REPOSITORY_TYPES,
@@ -17,6 +20,10 @@ import {
   cvFilterRulesKey,
   cvDetailsComponentKey,
   cvDetailsVersionKey,
+  cvAddComponentKey,
+  cvRemoveComponentKey,
+  addComponentSuccessMessage,
+  removeComponentSuccessMessage,
 } from '../ContentViewsConstants';
 import api from '../../../services/api';
 import { getResponseErrorMsgs, apiError } from '../../../utils/helpers';
@@ -33,11 +40,11 @@ const cvUpdateSuccess = (response, dispatch) => {
   dispatch(getContentViewDetails(id));
   return dispatch(addToast({
     type: 'success',
-    message: __(' Content view updated.'),
+    message: __(' Content view updated'),
   }));
 };
 
-export const updateContentView = (cvId, params) => async dispatch => dispatch(put({
+export const updateContentView = (cvId, params) => dispatch => dispatch(put({
   type: API_OPERATIONS.PUT,
   key: cvDetailsKey(cvId),
   url: api.getApiUrl(`/content_views/${cvId}`),
@@ -51,6 +58,33 @@ export const updateContentView = (cvId, params) => async dispatch => dispatch(pu
   },
 }));
 
+export const addComponent = params => put({
+  type: API_OPERATIONS.PUT,
+  key: cvAddComponentKey(params.compositeContentViewId),
+  url: api.getApiUrl(`/content_views/${params.compositeContentViewId}/content_view_components/${params.components.id ? params.components.id : 'add'}`),
+  params: params.components.id ? params.components : params,
+  successToast: () => addComponentSuccessMessage(params.components.id),
+  errorToast: error => __(`Something went wrong while adding component! ${getResponseErrorMsgs(error.response)}`),
+});
+
+export const removeComponent = params => put({
+  type: API_OPERATIONS.PUT,
+  key: cvRemoveComponentKey(params.compositeContentViewId),
+  url: api.getApiUrl(`/content_views/${params.compositeContentViewId}/content_view_components/remove`),
+  params,
+  successToast: () => removeComponentSuccessMessage(params.component_ids.length),
+  errorToast: error => __(`Something went wrong while removing component! ${getResponseErrorMsgs(error.response)}`),
+});
+
+export const createContentViewFilter = (cvId, params) => post({
+  type: API_OPERATIONS.POST,
+  key: CREATE_CONTENT_VIEW_FILTER_KEY,
+  url: api.getApiUrl(`/content_view_filters?content_view_id=${cvId}`),
+  params,
+  successToast: () => __('Filter created'),
+  errorToast: error => __(`Something went wrong while creating the filter! ${getResponseErrorMsgs(error.response)}`),
+});
+
 export const getContentViewRepositories = (cvId, params, status) => {
   const apiParams = { ...params };
   let apiUrl = `/content_views/${cvId}/repositories`;
@@ -83,6 +117,25 @@ export const getContentViewFilters = (cvId, params) => get({
   url: api.getApiUrl('/content_view_filters'),
 });
 
+export const deleteContentViewFilters = (cvId, ids, handleSuccess) => put({
+  type: API_OPERATIONS.PUT,
+  key: DELETE_CONTENT_VIEW_FILTERS_KEY,
+  url: api.getApiUrl(`/content_views/${cvId}/remove_filters`),
+  params: { filter_ids: ids },
+  handleSuccess,
+  successToast: () => __('Filters successfully deleted'),
+  errorToast: error => __(`Something went wrong while deleting filters! ${getResponseErrorMsgs(error.response)}`),
+});
+
+export const deleteContentViewFilter = (filterId, handleSuccess) => APIActions.delete({
+  type: API_OPERATIONS.DELETE,
+  key: DELETE_CONTENT_VIEW_FILTER_KEY,
+  url: api.getApiUrl(`/content_view_filters/${filterId}`),
+  handleSuccess,
+  successToast: () => __('Filter successfully deleted'),
+  errorToast: error => __(`Something went wrong while deleting this filter! ${getResponseErrorMsgs(error.response)}`),
+});
+
 export const getCVFilterDetails = (cvId, filterId, params) => get({
   key: cvFilterDetailsKey(cvId, filterId),
   params: { contentViewId: cvId, ...params },
@@ -117,9 +170,9 @@ export const getCVFilterRules = (filterId, params) => get({
   url: api.getApiUrl(`/content_view_filters/${filterId}/rules`),
 });
 
-export const getContentViewComponents = (cvId, params) => {
-  const apiParams = { ...params };
-  const apiUrl = `/content_views/${cvId}/content_view_components`;
+export const getContentViewComponents = (cvId, params, statusSelected) => {
+  const apiParams = { ...params, status: statusSelected };
+  const apiUrl = `/content_views/${cvId}/content_view_components/show_all`;
   return get({
     key: cvDetailsComponentKey(cvId),
     params: apiParams,

data/webpack/scenes/ContentViews/Details/ContentViewDetailSelectors.js

@@ -15,7 +15,11 @@ import {
   cvDetailsVersionKey,
   REPOSITORY_TYPES,
   cvDetailsComponentKey,
+  cvAddComponentKey,
+  cvRemoveComponentKey,
+  CREATE_CONTENT_VIEW_FILTER_KEY,
 } from '../ContentViewsConstants';
+import { pollTaskKey } from '../../Tasks/helpers';
 
 export const selectCVDetails = (state, cvId) =>
   selectAPIResponse(state, cvDetailsKey(cvId)) || {};
@@ -101,4 +105,43 @@ export const selectCVVersionsStatus = (state, cvId) =>
 export const selectCVVersionsError = (state, cvId) =>
   selectAPIError(state, cvDetailsVersionKey(cvId));
 
+export const selectPublishTaskPoll = (state, cvVersionPublishKey) =>
+  selectAPIResponse(state, pollTaskKey(cvVersionPublishKey)) || {};
+
+export const selectPublishTaskPollStatus = (state, cvVersionPublishKey) =>
+  selectAPIStatus(state, pollTaskKey(cvVersionPublishKey)) || STATUS.PENDING;
+
+export const selectTaskPoll = (state, key) =>
+  selectAPIResponse(state, pollTaskKey(key)) || {};
+
+export const selectTaskPollStatus = (state, key) =>
+  selectAPIStatus(state, pollTaskKey(key)) || STATUS.PENDING;
+
+export const selectCVComponentAdd = (state, cvId) =>
+  selectAPIResponse(state, cvAddComponentKey(cvId));
+
+export const selectCVComponentAddStatus = (state, cvId) =>
+  selectAPIStatus(state, cvAddComponentKey(cvId)) || STATUS.PENDING;
+
+export const selectCVComponentAddError = (state, cvId) =>
+  selectAPIError(state, cvAddComponentKey(cvId));
+
+export const selectCVComponentRemove = (state, cvId) =>
+  selectAPIResponse(state, cvRemoveComponentKey(cvId));
+
+export const selectCVComponentRemoveStatus = (state, cvId) =>
+  selectAPIStatus(state, cvRemoveComponentKey(cvId)) || STATUS.PENDING;
+
+export const selectCVComponentRemoveError = (state, cvId) =>
+  selectAPIError(state, cvRemoveComponentKey(cvId));
+
+export const selectCreateContentViewFilter = state =>
+  selectAPIResponse(state, CREATE_CONTENT_VIEW_FILTER_KEY) || {};
+
+export const selectCreateContentViewFilterStatus = state =>
+  selectAPIStatus(state, CREATE_CONTENT_VIEW_FILTER_KEY) || STATUS.PENDING;
+
+export const selectCreateContentViewFilterError = state =>
+  selectAPIError(state, CREATE_CONTENT_VIEW_FILTER_KEY);
+
 export const selectIsCVUpdating = state => state.katello?.contentViewDetails?.updating;

data/webpack/scenes/ContentViews/Details/ContentViewDetails.js

@@ -1,6 +1,8 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { useSelector, shallowEqual } from 'react-redux';
-import { Grid, GridItem, TextContent, Text, TextVariants, Button, Flex, FlexItem } from '@patternfly/react-core';
+import { Link } from 'react-router-dom';
+import { Grid, GridItem, TextContent, Text, TextVariants, Button, Flex, FlexItem, Breadcrumb, BreadcrumbItem } from '@patternfly/react-core';
+import Skeleton from 'react-loading-skeleton';
 import { ExternalLinkAltIcon } from '@patternfly/react-icons';
 import { translate as __ } from 'foremanReact/common/I18n';
 import PropTypes from 'prop-types';
@@ -16,10 +18,13 @@ import ContentViewFilterDetails from './Filters/ContentViewFilterDetails';
 import { selectCVDetails } from './ContentViewDetailSelectors';
 import RoutedTabs from '../../../components/RoutedTabs';
 import ContentViewIcon from '../components/ContentViewIcon';
+import PublishContentViewWizard from '../Publish/PublishContentViewWizard';
 
 const ContentViewDetails = ({ match }) => {
   const cvId = parseInt(match.params.id, 10);
   const details = useSelector(state => selectCVDetails(state, cvId), shallowEqual);
+  const [isPublishModalOpen, setIsPublishModalOpen] = useState(false);
+  const [currentStep, setCurrentStep] = useState(1);
 
   const { name, composite } = details;
   const tabs = [
@@ -60,6 +65,15 @@ const ContentViewDetails = ({ match }) => {
     <Grid className="grid-with-margin">
       <DetailsContainer cvId={cvId}>
         <React.Fragment>
+          <Breadcrumb style={{ marginTop: '15px' }}>
+            <BreadcrumbItem
+              aria-label="cv_breadcrumb"
+              render={() => (<Link to="/labs/content_views" >{__('Content Views')}</Link>)}
+            />
+            <BreadcrumbItem aria-label="cv_breadcrumb_cv" isActive>
+              {name || <Skeleton />}
+            </BreadcrumbItem>
+          </Breadcrumb>
           <GridItem span={8}>
             <Flex>
               <FlexItem>
@@ -72,17 +86,34 @@ const ContentViewDetails = ({ match }) => {
               </FlexItem>
             </Flex>
           </GridItem>
-          <GridItem span={4} style={{ textAlign: 'right' }}>
-            <Button
-              component="a"
-              aria-label="view tasks button"
-              href={`/foreman_tasks/tasks?search=resource_type%3D+Katello%3A%3AContentView+resource_id%3D${cvId}`}
-              target="_blank"
-              variant="secondary"
-            >
-              {'View tasks '}
-              <ExternalLinkAltIcon />
-            </Button>
+          <GridItem span={4}>
+            <Flex>
+              <FlexItem>
+                <Button onClick={() => { setIsPublishModalOpen(true); }} variant="primary" aria-label="publish_content_view">
+                  Publish new version
+                </Button>
+                {isPublishModalOpen && <PublishContentViewWizard
+                  details={details}
+                  show={isPublishModalOpen}
+                  setIsOpen={setIsPublishModalOpen}
+                  currentStep={currentStep}
+                  setCurrentStep={setCurrentStep}
+                  aria-label="publish_content_view_modal"
+                />}
+              </FlexItem>
+              <FlexItem>
+                <Button
+                  component="a"
+                  aria-label="view tasks button"
+                  href={`/foreman_tasks/tasks?search=resource_type%3D+Katello%3A%3AContentView+resource_id%3D${cvId}`}
+                  target="_blank"
+                  variant="secondary"
+                >
+                  {'View tasks '}
+                  <ExternalLinkAltIcon />
+                </Button>
+              </FlexItem>
+            </Flex>
           </GridItem>
           <GridItem span={12}>
             <RoutedTabs tabs={tabs} baseUrl={`/labs/content_views/${cvId}`} defaultTabIndex={1} />