katello 4.5.1 → 4.8.0.rc2

data/webpack/ouia_id_check.js

@@ -0,0 +1,93 @@
+import PropTypes from 'prop-types';
+import {
+  Alert,
+  Breadcrumb,
+  Button,
+  Card,
+  Checkbox,
+  Chip,
+  ChipGroup,
+  ContextSelector,
+  Dropdown,
+  DropdownItem,
+  DropdownSeparator,
+  DropdownToggle,
+  DropdownToggleCheckbox,
+  FormSelect,
+  Menu,
+  Modal,
+  ModalContent,
+  Nav,
+  NavExpandable,
+  NavItem,
+  OptionsMenu,
+  Pagination,
+  Radio,
+  Select,
+  Switch,
+  TabButton,
+  TabContent,
+  Tabs,
+  Text,
+  TextInput,
+  Title,
+  Toolbar,
+} from '@patternfly/react-core';
+import {
+  Table,
+  TableComposable,
+  Tr,
+} from '@patternfly/react-table';
+
+const checkForOuiaIds = () => {
+  const ouiaSupportedPFComponents = [
+    Alert,
+    Breadcrumb,
+    Button,
+    Card,
+    Checkbox,
+    Chip,
+    ChipGroup,
+    ContextSelector,
+    Dropdown,
+    DropdownItem,
+    DropdownSeparator,
+    DropdownToggle,
+    DropdownToggleCheckbox,
+    FormSelect,
+    Menu,
+    Modal,
+    ModalContent,
+    Nav,
+    NavExpandable,
+    NavItem,
+    OptionsMenu,
+    Pagination,
+    Radio,
+    Select,
+    Switch,
+    TabButton,
+    TabContent,
+    Tabs,
+    Text,
+    TextInput,
+    Title,
+    Toolbar,
+    Table,
+    TableComposable,
+    Tr,
+  ];
+  beforeEach(() => {
+    // eslint-disable-next-line no-restricted-syntax
+    for (const Component of ouiaSupportedPFComponents) {
+      // eslint-disable-next-line no-continue
+      if (!Component) continue;
+      Component.propTypes = {
+        ...Component.propTypes,
+        ouiaId: PropTypes.string.isRequired,
+      };
+    }
+  });
+};
+
+export default checkForOuiaIds;

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

@@ -10,6 +10,10 @@ const repoTypeSearchQueryMap = {
 };
 
 const recommendedRepositoriesRHEL = [
+  'rhel-9-for-x86_64-baseos-rpms',
+  'rhel-9-for-x86_64-baseos-kickstart',
+  'rhel-9-for-x86_64-appstream-rpms',
+  'rhel-9-for-x86_64-appstream-kickstart',
   'rhel-8-for-x86_64-baseos-rpms',
   'rhel-8-for-x86_64-baseos-kickstart',
   'rhel-8-for-x86_64-appstream-rpms',
@@ -20,6 +24,7 @@ const recommendedRepositoriesRHEL = [
   'rhel-7-server-optional-rpms',
   'rhel-7-server-extras-rpms',
   'rhel-7-server-kickstart',
+  'rhel-6-server-els-rpms',
 ];
 
 const recommendedRepositoriesSatTools = [
@@ -30,15 +35,10 @@ const recommendedRepositoriesSatTools = [
 ];
 
 const recommendedRepositoriesMisc = [
-  'rhel-server-rhscl-7-rpms',
-  'rhel-7-server-satellite-capsule-6.11-rpms',
-  'satellite-capsule-6.11-for-rhel-8-x86_64-rpms',
-  'rhel-7-server-ansible-2.9-rpms',
+  'satellite-capsule-6.13-for-rhel-8-x86_64-rpms',
   'ansible-2-for-rhel-8-x86_64-rpms',
-  'rhel-7-server-satellite-maintenance-6.11-rpms',
-  'rhel-7-server-satellite-utils-6.11-rpms',
-  'satellite-maintenance-6.11-for-rhel-8-x86_64-rpms',
-  'satellite-utils-6.11-for-rhel-8-x86_64-rpms',
+  'satellite-maintenance-6.13-for-rhel-8-x86_64-rpms',
+  'satellite-utils-6.13-for-rhel-8-x86_64-rpms',
 ];
 
 const recommendedRepositorySetLables = recommendedRepositoriesRHEL

data/webpack/redux/reducers/index.js

@@ -11,9 +11,8 @@ import { moduleStreams } from '../../scenes/ModuleStreams';
 import { reducers as organizationProductsReducers } from '../OrganizationProducts';
 import { moduleStreamDetails } from '../../scenes/ModuleStreams/Details';
 import { reducers as systemStatuses } from '../../components/extensions/about';
-import { ansibleCollections } from '../../scenes/AnsibleCollections';
-import { ansibleCollectionDetails } from '../../scenes/AnsibleCollections/Details';
 import { contentViewDetails } from '../../scenes/ContentViews/Details';
+import hostDetails from '../../components/extensions/HostDetails/HostDetailsReducer';
 
 export default combineReducers({
   organization,
@@ -26,9 +25,8 @@ export default combineReducers({
   setOrganization,
   moduleStreams,
   moduleStreamDetails,
-  ansibleCollections,
-  ansibleCollectionDetails,
   contentViewDetails,
+  hostDetails,
   ...organizationProductsReducers,
   ...systemStatuses,
 });

data/webpack/scenes/AlternateContentSources/ACSActions.js

@@ -1,7 +1,16 @@
 import { API_OPERATIONS, APIActions, get, post } from 'foremanReact/redux/API';
 import { translate as __ } from 'foremanReact/common/I18n';
 import api, { orgId } from '../../services/api';
-import ACS_KEY, { acsRefreshKey, CREATE_ACS_KEY, DELETE_ACS_KEY } from './ACSConstants';
+import ACS_KEY, {
+  acsDetailsKey,
+  acsRefreshKey,
+  CREATE_ACS_KEY,
+  DELETE_ACS_KEY,
+  EDIT_ACS_KEY,
+  PRODUCTS_KEY,
+  BULK_ACS_REFRESH_KEY,
+  BULK_ACS_DELETE_KEY,
+} from './ACSConstants';
 import { getResponseErrorMsgs } from '../../utils/helpers';
 import { renderTaskStartedToast } from '../Tasks/helpers';
 
@@ -18,6 +27,7 @@ export const acsErrorToast = (error) => {
 export const createACSParams = (extraParams) => {
   const getParams = {
     organization_id: orgId(),
+    include_permissions: true,
     ...extraParams,
   };
   return getParams;
@@ -30,11 +40,20 @@ const getAlternateContentSources = (extraParams, id = '') => get({
   params: createACSParams(extraParams),
 });
 
-export const createACS = params => post({
+export const getACSDetails = (acsId, extraParams = {}) => get({
+  type: API_OPERATIONS.GET,
+  key: acsDetailsKey(acsId),
+  params: { organization_id: orgId(), include_permissions: true, ...extraParams },
+  url: api.getApiUrl(`/alternate_content_sources/${acsId}`),
+  errorToast: error => acsErrorToast(error),
+});
+
+export const createACS = (params, name, handleSuccess) => post({
   type: API_OPERATIONS.POST,
-  key: CREATE_ACS_KEY,
+  key: CREATE_ACS_KEY + name,
   url: api.getApiUrl('/alternate_content_sources'),
   params,
+  handleSuccess,
   successToast: response => acsSuccessToast(response),
   errorToast: error => acsErrorToast(error),
 });
@@ -45,7 +64,7 @@ export const deleteACS = (acsId, handleSuccess) => APIActions.delete({
   url: api.getApiUrl(`/alternate_content_sources/${acsId}`),
   handleSuccess,
   successToast: () => __('Alternate content source deleted'),
-  errorToast: error => __(`Something went wrong while deleting this alternate content source! ${getResponseErrorMsgs(error.response)}`),
+  errorToast: error => acsErrorToast(error),
 });
 
 export const refreshACS = (acsId, handleSuccess) => post({
@@ -54,12 +73,57 @@ export const refreshACS = (acsId, handleSuccess) => post({
   url: api.getApiUrl(`/alternate_content_sources/${acsId}/refresh`),
   params: { id: acsId },
   handleSuccess: (response) => {
-    if (handleSuccess) handleSuccess();
+    if (handleSuccess) {
+      handleSuccess();
+    }
     return renderTaskStartedToast(response.data);
   },
-  errorToast: error => __(`Something went wrong while refreshing this alternate content source! ${getResponseErrorMsgs(error.response)}`),
+  errorToast: error => acsErrorToast(error),
+});
+
+export const bulkRefreshACS = (params, handleSuccess) => post({
+  type: API_OPERATIONS.POST,
+  key: BULK_ACS_REFRESH_KEY,
+  url: api.getApiUrl('/alternate_content_sources/bulk/refresh'),
+  params,
+  handleSuccess: (response) => {
+    renderTaskStartedToast(response?.data, __('Bulk alternate content source refresh has started.'));
+    return handleSuccess();
+  },
+  errorToast: error => __('Something went wrong while refreshing alternate content sources: ') + getResponseErrorMsgs(error.response),
+});
+
+export const bulkDeleteACS = (params, handleSuccess) => APIActions.put({
+  type: API_OPERATIONS.PUT,
+  key: BULK_ACS_DELETE_KEY,
+  url: api.getApiUrl('/alternate_content_sources/bulk/destroy'),
+  params,
+  handleSuccess: (response) => {
+    renderTaskStartedToast(response?.data, __('Bulk alternate content source delete has started.'));
+    return handleSuccess();
+  },
+  errorToast: error => __(`Something went wrong while deleting alternate content sources: ${getResponseErrorMsgs(error.response)}`),
+});
+
+export const getProducts = () => get({
+  type: API_OPERATIONS.GET,
+  key: PRODUCTS_KEY,
+  url: api.getApiUrl('/products'),
+  params: {
+    organization_id: orgId(), full_result: true, enabled: true, non_empty: true,
+  },
 });
+
+export const editACS = (acsId, params, handleSuccess, handleError) => APIActions.put({
+  type: API_OPERATIONS.PUT,
+  key: EDIT_ACS_KEY,
+  url: api.getApiUrl(`/alternate_content_sources/${acsId}`),
+  params,
+  handleSuccess,
+  handleError,
+  successToast: () => __('Alternate content source edited'),
+  errorToast: error => acsErrorToast(error),
+});
+
 export default getAlternateContentSources;
 
-// acs = Katello::AlternateContentSource.new
-// (name:"acs", label:"acs", alternate_content_source_type:"custom", base_url:"abcdef")

data/webpack/scenes/AlternateContentSources/ACSConstants.js

@@ -2,10 +2,15 @@ import { translate as __ } from 'foremanReact/common/I18n';
 
 const ACS_KEY = 'ACS';
 export const CREATE_ACS_KEY = 'ACS_CREATE';
+export const EDIT_ACS_KEY = 'ACS_EDIT';
 export const DELETE_ACS_KEY = 'ACS_DELETE';
 export const SMART_PROXY_KEY = 'SMART_PROXY';
+export const PRODUCTS_KEY = 'PRODUCTS';
 export const SSL_CERTS = 'SSL_CERTS';
+export const BULK_ACS_REFRESH_KEY = 'BULK_ACS_REFRESH';
+export const BULK_ACS_DELETE_KEY = 'BULK_ACS_DELETE';
 export const acsRefreshKey = acsId => `${ACS_KEY}_REFRESH_${acsId}`;
+export const acsDetailsKey = acsId => `${ACS_KEY}_DETAILS_${acsId}`;
 
 export const YUM = __('Yum');
 export const FILE = __('File');

data/webpack/scenes/AlternateContentSources/ACSIndexPage.js

@@ -8,7 +8,7 @@ const ACSIndexPage = () => (
     <Grid className="margin-24">
       <GridItem span={12}>
         <TextContent>
-          <Text component={TextVariants.h1}>{__('Alternate content sources')}</Text>
+          <Text component={TextVariants.h1}>{__('Alternate Content Sources')}</Text>
         </TextContent>
       </GridItem>
     </Grid>

data/webpack/scenes/AlternateContentSources/ACSSelectors.js

@@ -1,10 +1,6 @@
-import {
-  selectAPIStatus,
-  selectAPIError,
-  selectAPIResponse,
-} from 'foremanReact/redux/API/APISelectors';
+import { selectAPIError, selectAPIResponse, selectAPIStatus } from 'foremanReact/redux/API/APISelectors';
 import { STATUS } from 'foremanReact/constants';
-import ACS_KEY, { CREATE_ACS_KEY } from './ACSConstants';
+import ACS_KEY, { acsDetailsKey, CREATE_ACS_KEY, PRODUCTS_KEY } from './ACSConstants';
 
 export const selectAlternateContentSources = (state, index = '') => selectAPIResponse(state, ACS_KEY + index) || {};
 
@@ -14,11 +10,24 @@ export const selectAlternateContentSourcesStatus = (state, index = '') =>
 export const selectAlternateContentSourcesError = (state, index = '') =>
   selectAPIError(state, ACS_KEY + index);
 
-export const selectCreateACS = state =>
-  selectAPIResponse(state, CREATE_ACS_KEY) || {};
+export const selectCreateACS = (state, name) =>
+  selectAPIResponse(state, CREATE_ACS_KEY + name) || {};
 
-export const selectCreateACSStatus = state =>
-  selectAPIStatus(state, CREATE_ACS_KEY) || STATUS.PENDING;
+export const selectCreateACSStatus = (state, name) =>
+  selectAPIStatus(state, CREATE_ACS_KEY + name) || STATUS.PENDING;
 
-export const selectCreateACSError = state =>
-  selectAPIError(state, CREATE_ACS_KEY);
+export const selectCreateACSError = (state, name) =>
+  selectAPIError(state, CREATE_ACS_KEY + name);
+
+export const selectACSDetails = (state, acsId) =>
+  selectAPIResponse(state, acsDetailsKey(acsId)) || {};
+
+export const selectACSDetailsStatus =
+    (state, acsId) => selectAPIStatus(state, acsDetailsKey(acsId)) || STATUS.PENDING;
+
+export const selectACSDetailsError =
+    (state, acsId) => selectAPIError(state, acsDetailsKey(acsId));
+
+export const selectProducts = state => selectAPIResponse(state, PRODUCTS_KEY) || {};
+
+export const selectProductsStatus = state => selectAPIStatus(state, PRODUCTS_KEY) || STATUS.PENDING;

data/webpack/scenes/AlternateContentSources/Acs.scss

@@ -0,0 +1,3 @@
+.expandable-section-text {
+  font-size: 14px;
+}

data/webpack/scenes/AlternateContentSources/Create/ACSCreateWizard.js

@@ -14,6 +14,10 @@ import ACSCreateFinish from './Steps/ACSCreateFinish';
 import { getContentCredentials } from '../../ContentCredentials/ContentCredentialActions';
 import { getSmartProxies } from '../../SmartProxy/SmartProxyContentActions';
 import { CONTENT_CREDENTIAL_CERT_TYPE } from '../../ContentCredentials/ContentCredentialConstants';
+import { getProducts } from '../ACSActions';
+import ACSProducts from './Steps/ACSProducts';
+import { areSubPathsValid, isValidUrl } from '../helpers';
+
 
 const ACSCreateWizard = ({ show, setIsOpen }) => {
   const [acsType, setAcsType] = useState(null);
@@ -23,6 +27,7 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
   const [smartProxies, setSmartProxies] = useState([]);
   const [url, setUrl] = useState('');
   const [subpaths, setSubpaths] = useState('');
+  const [useHttpProxies, setUseHttpProxies] = useState(false);
   const [verifySSL, setVerifySSL] = useState(false);
   const [authentication, setAuthentication] = useState('');
   const [sslCert, setSslCert] = useState('');
@@ -33,68 +38,108 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
   const [password, setPassword] = useState('');
   const [caCert, setCACert] = useState('');
   const [caCertName, setCACertName] = useState('');
-  const [currentStep, setCurrentStep] = useState(1);
+  const [productIds, setProductIds] = useState([]);
+  const [productNames, setProductNames] = useState([]);
   const dispatch = useDispatch();
 
   useEffect(
     () => {
       dispatch(getContentCredentials({ content_type: CONTENT_CREDENTIAL_CERT_TYPE }));
       dispatch(getSmartProxies());
+      dispatch(getProducts());
     },
     [dispatch],
   );
 
-  const steps = [
-    {
-      id: 1,
-      name: __('Select source type'),
-      component: <SelectSource />,
-      enableNext: acsType && contentType,
-    },
-    {
-      id: 2,
-      name: __('Name source'),
-      component: <NameACS />,
-      enableNext: name !== '',
-    },
-    {
-      id: 3,
-      name: __('Select smart proxy'),
-      component: <ACSSmartProxies />,
-      enableNext: smartProxies.length,
-    },
-    {
-      id: 4,
-      name: __('URL and paths'),
-      component: <AcsUrlPaths />,
-      enableNext: url !== '' && subpaths !== '',
-    },
-    {
-      id: 5,
-      name: __('Credentials'),
-      component: <ACSCredentials />,
-    },
-    {
-      id: 6,
-      name: __('Review details'),
-      component: <ACSReview />,
-      nextButtonText: __('Add'),
-    },
-    {
-      id: 7,
-      name: __('Create ACS'),
-      component: <ACSCreateFinish />,
-      isFinishedStep: true,
-    },
+  const subPathValidated = areSubPathsValid(subpaths) ? 'default' : 'error';
+  const urlValidated = (url === '' || isValidUrl(url, acsType)) ? 'default' : 'error';
+
+  const urlAndPathsValid = () => url !== '' && urlValidated !== 'error' && subPathValidated !== 'error';
 
+  const credentialsFilled = () => {
+    if (authentication === 'manual') {
+      return username !== '';
+    }
+    return true;
+  };
+
+  const sourceTypeStep = {
+    id: 1,
+    name: __('Select source type'),
+    component: <SelectSource />,
+    enableNext: acsType && contentType,
+  };
+
+  const nameStep = {
+    id: 2,
+    name: __('Name source'),
+    component: <NameACS />,
+    canJumpTo: acsType && contentType,
+    enableNext: name !== '',
+  };
+
+  const smartProxyStep = {
+    id: 3,
+    name: __('Select smart proxy'),
+    component: <ACSSmartProxies />,
+    canJumpTo: name !== '',
+    enableNext: smartProxies.length,
+  };
+
+  const productStep = {
+    id: 4,
+    name: __('Select products'),
+    component: <ACSProducts />,
+    canJumpTo: smartProxies.length && name !== '',
+    enableNext: productIds.length,
+  };
+
+  const urlPathStep = {
+    id: 5,
+    name: __('URL and paths'),
+    component: <AcsUrlPaths />,
+    canJumpTo: (acsType === 'custom' || acsType === 'rhui') && (smartProxies.length) && name !== '',
+    enableNext: urlAndPathsValid(),
+  };
+
+  const credentialsStep = {
+    id: 6,
+    name: __('Credentials'),
+    component: <ACSCredentials />,
+    canJumpTo: urlAndPathsValid() && (smartProxies.length) && name !== '',
+    enableNext: (urlAndPathsValid() || productIds.length) && smartProxies.length && name !== '' && acsType && contentType && credentialsFilled(),
+  };
+
+  const reviewStep = {
+    id: 7,
+    name: __('Review details'),
+    component: <ACSReview />,
+    nextButtonText: __('Add'),
+    canJumpTo: (urlAndPathsValid() || productIds.length) && smartProxies.length && name !== '' && acsType && contentType && credentialsFilled(),
+    enableNext: (urlAndPathsValid() || productIds.length) && smartProxies.length && name !== '' && acsType && contentType,
+  };
+
+  const finishStep = {
+    id: 8,
+    name: __('Create ACS'),
+    component: <ACSCreateFinish />,
+    isFinishedStep: true,
+  };
+
+  const steps = [
+    sourceTypeStep,
+    nameStep,
+    smartProxyStep,
+    ...((acsType === 'custom' || acsType === 'rhui') ? [urlPathStep, credentialsStep] : []),
+    ...(acsType === 'simplified' ? [productStep] : []),
+    reviewStep,
+    finishStep,
   ];
 
   return (
     <ACSCreateContext.Provider value={{
       show,
       setIsOpen,
-      currentStep,
-      setCurrentStep,
       acsType,
       setAcsType,
       contentType,
@@ -105,10 +150,16 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
       setDescription,
       smartProxies,
       setSmartProxies,
+      productIds,
+      setProductIds,
+      productNames,
+      setProductNames,
       url,
       setUrl,
       subpaths,
       setSubpaths,
+      useHttpProxies,
+      setUseHttpProxies,
       verifySSL,
       setVerifySSL,
       authentication,
@@ -134,10 +185,6 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
       <Wizard
         title={__('Add an alternate content source')}
         steps={steps}
-        startAtStep={currentStep}
-        onGoToStep={({ id }) => setCurrentStep(id)}
-        onNext={({ id }) => setCurrentStep(id)}
-        onBack={({ id }) => setCurrentStep(id)}
         onClose={() => {
           setIsOpen(false);
         }}

data/webpack/scenes/AlternateContentSources/Create/Steps/ACSCreateFinish.js

@@ -1,6 +1,9 @@
-import React, { useContext, useState } from 'react';
+import React, { useCallback, useContext, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
+import { useHistory } from 'react-router-dom';
+import PropTypes from 'prop-types';
 import useDeepCompareEffect from 'use-deep-compare-effect';
+import { WizardContextConsumer } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { STATUS } from 'foremanReact/constants';
 import ACSCreateContext from '../ACSCreateContext';
@@ -8,9 +11,16 @@ import { selectCreateACS, selectCreateACSError, selectCreateACSStatus } from '..
 import getAlternateContentSources, { createACS } from '../../ACSActions';
 import Loading from '../../../../components/Loading';
 
-const ACSCreateFinish = () => {
+const ACSCreateFinishWrapper = () => (
+  <WizardContextConsumer>
+    {({ activeStep }) => <ACSCreateFinish activeStep={activeStep} />}
+  </WizardContextConsumer>
+);
+
+const ACSCreateFinish = ({ activeStep }) => {
+  const { push } = useHistory();
+  const currentStep = activeStep.id;
   const {
-    currentStep,
     setIsOpen,
     acsType,
     contentType,
@@ -19,6 +29,7 @@ const ACSCreateFinish = () => {
     smartProxies,
     url,
     subpaths,
+    useHttpProxies,
     verifySSL,
     authentication,
     sslCert,
@@ -26,54 +37,75 @@ const ACSCreateFinish = () => {
     username,
     password,
     caCert,
+    productIds,
   } = useContext(ACSCreateContext);
   const dispatch = useDispatch();
-  const response = useSelector(state => selectCreateACS(state));
-  const status = useSelector(state => selectCreateACSStatus(state));
-  const error = useSelector(state => selectCreateACSError(state));
+  const response = useSelector(state => selectCreateACS(state, name));
+  const status = useSelector(state => selectCreateACSStatus(state, name));
+  const error = useSelector(state => selectCreateACSError(state, name));
   const [createACSDispatched, setCreateACSDispatched] = useState(false);
   const [saving, setSaving] = useState(true);
 
+  const acsTypeParams = useCallback((params, type) => {
+    let acsParams = params;
+    if (type === 'custom' || type === 'rhui') {
+      acsParams = {
+        base_url: url, verify_ssl: verifySSL, ssl_ca_cert_id: caCert, ...acsParams,
+      };
+      if (subpaths !== '') {
+        acsParams = { subpaths: subpaths.split(','), ...acsParams };
+      }
+    }
+    if (type === 'simplified') {
+      acsParams = { product_ids: productIds, ...acsParams };
+    }
+    return acsParams;
+  }, [caCert, productIds, subpaths, url, verifySSL]);
+
   useDeepCompareEffect(() => {
-    if (currentStep === 7 && !createACSDispatched) {
+    if (currentStep === 8 && !createACSDispatched) {
       setCreateACSDispatched(true);
       let params = {
         name,
         description,
-        base_url: url,
-        subpaths: subpaths.split(','),
         smart_proxy_names: smartProxies,
+        use_http_proxies: useHttpProxies,
         content_type: contentType,
         alternate_content_source_type: acsType,
-        verify_ssl: verifySSL,
-        ssl_ca_cert_id: caCert,
       };
+      params = acsTypeParams(params, acsType);
       if (authentication === 'content_credentials') {
         params = { ssl_client_cert_id: sslCert, ssl_client_key_id: sslKey, ...params };
       }
       if (authentication === 'manual') {
         params = { upstream_username: username, upstream_password: password, ...params };
       }
-      dispatch(createACS(params));
+      dispatch(createACS(params, name, () => { dispatch(getAlternateContentSources()); }));
     }
   }, [dispatch, createACSDispatched, setCreateACSDispatched,
     acsType, authentication, name, description, url, subpaths,
-    smartProxies, contentType, verifySSL, caCert, sslCert, sslKey,
-    username, password, currentStep]);
+    smartProxies, contentType, useHttpProxies, verifySSL, caCert, sslCert, sslKey,
+    username, password, currentStep, acsTypeParams]);
 
   useDeepCompareEffect(() => {
     const { id } = response;
     if (id && status === STATUS.RESOLVED && saving) {
       setSaving(false);
-      dispatch(getAlternateContentSources());
+      window.location.assign(`/alternate_content_sources/${id}/details`);
       setIsOpen(false);
     } else if (status === STATUS.ERROR) {
       setSaving(false);
       setIsOpen(false);
     }
-  }, [response, status, error, saving, dispatch, setIsOpen]);
+  }, [response, status, error, push, saving, dispatch, setIsOpen]);
 
   return <Loading loadingText={__('Saving alternate content source...')} />;
 };
 
-export default ACSCreateFinish;
+ACSCreateFinish.propTypes = {
+  activeStep: PropTypes.shape({
+    id: PropTypes.number.isRequired,
+  }).isRequired,
+};
+
+export default ACSCreateFinishWrapper;