katello 4.4.1 → 4.5.0

data/webpack/components/extensions/HostDetails/Tabs/__tests__/tracesTab.test.js

@@ -9,8 +9,18 @@ import mockTraceData from './traces.fixtures.json';
 import mockResolveTraceTask from './resolveTraces.fixtures.json';
 import emptyTraceResults from './tracerEmptyTraceResults.fixtures.json';
 import mockJobInvocationStatus from './tracerEnableJobInvocation.fixtures.json';
+import mockBookmarkData from './bookmarks.fixtures.json';
 
 const hostName = 'client.example.com';
+const tracesBookmarks = foremanApi.getApiUrl('/bookmarks?search=controller%3Dkatello_host_tracers');
+
+jest.mock('../../hostDetailsHelpers', () => ({
+  ...jest.requireActual('../../hostDetailsHelpers'),
+  userPermissionsFromHostDetails: () => ({
+    create_job_invocations: true,
+  }),
+}));
+
 const tracerInstalledResponse = {
   id: 1,
   name: 'client.example.com',
@@ -42,18 +52,20 @@ const renderOptions = isTracerInstalled => ({ // sets initial Redux state
 
 const actionMenuToTheRightOf = node => node.nextElementSibling.firstElementChild.firstElementChild;
 
-const hostTraces = foremanApi.getApiUrl('/hosts/1/traces?per_page=20&page=1');
+const hostTraces = foremanApi.getApiUrl('/hosts/1/traces');
 const autocompleteUrl = '/hosts/1/traces/auto_complete_search';
 const jobInvocations = foremanApi.getApiUrl('/job_invocations');
 
 let firstTrace;
 let searchDelayScope;
 let autoSearchScope;
+let bookmarkScope;
 
 describe('With tracer installed', () => {
   beforeEach(() => {
     const { results } = mockTraceData;
     [firstTrace] = results;
+    bookmarkScope = nockInstance.get(tracesBookmarks).reply(200, mockBookmarkData);
     searchDelayScope = mockSetting(nockInstance, 'autosearch_delay', 0);
     autoSearchScope = mockSetting(nockInstance, 'autosearch_while_typing');
   });
@@ -61,6 +73,7 @@ describe('With tracer installed', () => {
   afterEach(() => {
     assertNockRequest(searchDelayScope);
     assertNockRequest(autoSearchScope);
+    assertNockRequest(bookmarkScope);
     nock.cleanAll();
   });
 
@@ -71,6 +84,7 @@ describe('With tracer installed', () => {
     // return tracedata results when we look for traces
     const scope = nockInstance
       .get(hostTraces)
+      .query(true)
       .reply(200, mockTraceData);
 
 
@@ -89,13 +103,14 @@ describe('With tracer installed', () => {
 
     const scope = nockInstance
       .get(hostTraces)
+      .query(true)
       .reply(200, emptyTraceResults);
 
 
     const { queryByText } = renderWithRedux(<TracesTab />, renderOptions(true));
 
     // Assert that there are not any traces showing on the screen.
-    await patientlyWaitFor(() => expect(queryByText('This host currently does not have traces.')).toBeInTheDocument());
+    await patientlyWaitFor(() => expect(queryByText('No applications to restart')).toBeInTheDocument());
     // Assert request was made and completed, see helper function
     assertNockRequest(autocompleteScope);
     assertNockRequest(scope, done);
@@ -107,7 +122,7 @@ describe('With tracer installed', () => {
 
     const scope = nockInstance
       .get(hostTraces)
-      .times(2)
+      .query(true)
       .reply(200, mockTraceData);
     const resolveTracesScope = nockInstance
       .post(jobInvocations)
@@ -130,7 +145,7 @@ describe('With tracer installed', () => {
     const restartAppButton = getByText('Restart app');
     // wait 50ms so that the button is enabled
     await waitFor(() => {
-      expect(getByText('Restart app')).not.toBeDisabled();
+      expect(restartAppButton.parentElement).not.toHaveClass('pf-m-disabled');
       restartAppButton.click();
     });
 
@@ -146,7 +161,7 @@ describe('With tracer installed', () => {
 
     const scope = nockInstance
       .get(hostTraces)
-      .times(2)
+      .query(true)
       .reply(200, mockTraceData);
     const resolveTracesScope = nockInstance
       .post(jobInvocations)
@@ -183,7 +198,7 @@ describe('With tracer installed', () => {
     const thirdTrace = mockTraceData.results[2];
     const scope = nockInstance
       .get(hostTraces)
-      .times(2)
+      .query(true)
       .reply(200, mockTraceData);
     const jobInvocationBody = ({ job_invocation: { inputs } }) =>
       inputs[TRACES_SEARCH_QUERY] === `id !^ (${firstTrace.id},${thirdTrace.id})`;
@@ -225,6 +240,7 @@ describe('With tracer installed', () => {
 
     const scope = nockInstance
       .get(hostTraces)
+      .query(true)
       .reply(200, mockTraceData);
     const resolveTracesScope = nockInstance
       .post(jobInvocations)
@@ -260,6 +276,7 @@ describe('With tracer installed', () => {
     const autocompleteScope = mockForemanAutocomplete(nockInstance, autocompleteUrl);
     const scope = nockInstance
       .get(hostTraces)
+      .query(true)
       .reply(200, mockTraceData);
 
     const { getByText } = renderWithRedux(
@@ -294,6 +311,7 @@ describe('With tracer installed', () => {
     const feature = REX_FEATURES.KATELLO_HOST_TRACER_RESOLVE;
     const scope = nockInstance
       .get(hostTraces)
+      .query(true)
       .reply(200, mockTraceData);
 
     const { getByLabelText, queryByText } = renderWithRedux(
@@ -336,6 +354,7 @@ describe('With tracer installed', () => {
 
       const scope = nockInstance
         .get(hostTraces)
+        .query(true)
         .reply(200, mockTraceData);
 
       const { getByLabelText } = renderWithRedux(

data/webpack/components/extensions/HostDetails/Tabs/customizedRexUrlHelpers.js

@@ -52,3 +52,9 @@ export const errataInstallUrl = ({ hostname, search }) => createJob({
   feature: REX_FEATURES.KATELLO_HOST_ERRATA_INSTALL_BY_SEARCH,
   inputs: { [ERRATA_SEARCH_QUERY]: search },
 });
+
+export const katelloModuleStreamActionUrl = ({ hostname, action, moduleSpec }) => createJob({
+  hostname,
+  feature: REX_FEATURES.KATELLO_HOST_MODULE_STREAM_ACTION,
+  inputs: { action, module_spec: moduleSpec },
+});

data/webpack/components/extensions/HostDetails/hostDetailsHelpers.js

@@ -25,4 +25,22 @@ export const hostIsNotRegistered = ({ hostDetails }) => {
 
 export const hostIsRegistered = ({ hostDetails }) => !hostIsNotRegistered({ hostDetails });
 
+export const userPermissionsFromHostDetails = ({ hostDetails }) => {
+  const {
+    permissions: hostPermissions,
+    content_facet_attributes: cfAttributes = {},
+  } = hostDetails;
+  return { ...hostPermissions, ...cfAttributes?.permissions };
+};
+
+// requiredPermissions is an array
+// userPermissions is an object, e.g. { view_hosts: true }
+export const hasRequiredPermissions = (requiredPermissions = [], userPermissions) => {
+  const permittedActions = Object.keys(userPermissions).filter(key => userPermissions[key]);
+  return requiredPermissions.every(permission => permittedActions.includes(permission));
+};
+
+export const missingRequiredPermissions = (requiredPermissions = [], userPermissions) =>
+  !hasRequiredPermissions(requiredPermissions, userPermissions);
+
 export default defaultRemoteActionMethod;

data/webpack/containers/Application/config.js

@@ -15,6 +15,7 @@ import Content from '../../scenes/Content';
 import ContentDetails from '../../scenes/Content/Details';
 import withHeader from './withHeaders';
 import ChangeContentSource from '../../scenes/Hosts/ChangeContentSource';
+import AlternateContentSource from '../../scenes/AlternateContentSources';
 
 // eslint-disable-next-line import/prefer-default-export
 export const links = [
@@ -80,4 +81,8 @@ export const links = [
     path: 'change_host_content_source',
     component: WithOrganization(withHeader(ChangeContentSource, { title: __('Change host content source') })),
   },
+  {
+    path: 'labs/alternate_content_sources',
+    component: WithOrganization(withHeader(AlternateContentSource, { title: __('Alternate Content Sources') })),
+  },
 ];

data/webpack/global_index.js

@@ -6,31 +6,54 @@ import { translate as __ } from 'foremanReact/common/I18n';
 import SystemStatuses from './components/extensions/about';
 import RegistrationCommands from './components/extensions/RegistrationCommands';
 import ContentTab from './components/extensions/HostDetails/Tabs/ContentTab';
-import ContentViewDetailsCard from './components/extensions/HostDetails/Cards/ContentViewDetailsCard';
+import ContentViewDetailsCard from './components/extensions/HostDetails/Cards/ContentViewDetailsCard/ContentViewDetailsCard';
 import ErrataOverviewCard from './components/extensions/HostDetails/Cards/ErrataOverviewCard';
+import InstalledProductsCard from './components/extensions/HostDetails/DetailsTabCards/InstalledProductsCard';
+import RegistrationCard from './components/extensions/HostDetails/DetailsTabCards/RegistrationCard';
 
-// import SubscriptionTab from './components/extensions/HostDetails/Tabs/SubscriptionTab';
-import RepositorySetsTab from './components/extensions/HostDetails/Tabs/RepositorySetsTab/RepositorySetsTab';
 import TracesTab from './components/extensions/HostDetails/Tabs/TracesTab/TracesTab.js';
 import extendReducer from './components/extensions/reducers';
 import rootReducer from './redux/reducers';
+import HostCollectionsCard from './components/extensions/HostDetails/Cards/HostCollectionsCard/HostCollectionsCard';
 import { hostIsNotRegistered } from './components/extensions/HostDetails/hostDetailsHelpers';
+import SystemPropertiesCardExtensions from './components/extensions/HostDetails/DetailsTabCards/SystemPropertiesCardExtensions';
+import HostActionsBar from './components/extensions/HostDetails/ActionsBar';
+import RecentCommunicationCardExtensions from './components/extensions/HostDetails/DetailsTabCards/RecentCommunicationCardExtensions';
 
 registerReducer('katelloExtends', extendReducer);
 registerReducer('katello', rootReducer);
 
 addGlobalFill('aboutFooterSlot', '[katello]AboutSystemStatuses', <SystemStatuses key="katello-system-statuses" />, 100);
 addGlobalFill('registrationAdvanced', '[katello]RegistrationCommands', <RegistrationCommands key="katello-reg" />, 100);
+
+// Host details page tabs
 addGlobalFill('host-details-page-tabs', 'Content', <ContentTab key="content" />, 900, { title: __('Content'), hideTab: hostIsNotRegistered });
-/* eslint-disable max-len */
-// addGlobalFill('host-details-page-tabs', 'Subscription', <SubscriptionTab key="subscription" />, 100, { title: __('Subscription') });
 addGlobalFill('host-details-page-tabs', 'Traces', <TracesTab key="traces" />, 800, { title: __('Traces'), hideTab: hostIsNotRegistered });
-addGlobalFill('host-details-page-tabs', 'Repository sets', <RepositorySetsTab key="repository-sets" />, 700, { title: __('Repository sets'), hideTab: hostIsNotRegistered });
 
+// Overview tab cards
 addGlobalFill(
-  'details-cards',
-  'Content View Details',
+  'host-overview-cards',
+  'Content view details',
   <ContentViewDetailsCard key="content-view-details" />,
   2000,
 );
-addGlobalFill('details-cards', 'Installable errata', <ErrataOverviewCard key="errata-overview" />, 1900);
+addGlobalFill(
+  'host-overview-cards',
+  'Host collections',
+  <HostCollectionsCard key="host-collections-details" />,
+  700,
+);
+addGlobalFill('host-overview-cards', 'Installable errata', <ErrataOverviewCard key="errata-overview" />, 1900);
+addGlobalFill('recent-communication-card-item', 'Recent communication', <RecentCommunicationCardExtensions key="recent-communication" />, 3000);
+
+// Details tab cards & card extensions
+addGlobalFill('host-tab-details-cards', 'Installed products', <InstalledProductsCard key="installed-products" />, 100);
+addGlobalFill('host-tab-details-cards', 'Registration details', <RegistrationCard key="registration-details" />, 200);
+addGlobalFill('host-details-tab-properties-1', 'Subscription UUID', <SystemPropertiesCardExtensions key="subscription-uuid" />);
+
+addGlobalFill(
+  'host-details-kebab',
+  'katello-host-details-kebab',
+  <HostActionsBar key="katello-host-details-kebab" />,
+  100,
+);

data/webpack/global_test_setup.js

@@ -1,7 +1,11 @@
+import nock from 'nock';
+
 // runs before each test to make sure console.error output will
 // fail a test (i.e. default PropType missing). Check the error
 // output and traceback for actual error.
+const originalConsoleError = global.console.error;
 global.console.error = (error, stack) => {
+  originalConsoleError(error); // ensure error is printed to console
   /* eslint-disable-next-line no-console */
   if (stack) console.log(stack); // Prints out original stack trace
   throw new Error(error);
@@ -14,3 +18,12 @@ afterAll(() => {
   jest.resetModules();
   if (global.gc) global.gc();
 });
+
+beforeEach(() => {
+  if (!nock.isActive()) { nock.activate(); }
+});
+
+afterEach(() => {
+  nock.restore();
+});
+

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

@@ -44,7 +44,7 @@ export const createEnabledRepoParams = (extendedParams = {}) => {
 
 export const disableRepository = repository => async (dispatch) => {
   const {
-    productId, contentId, arch, releasever,
+    productId, contentId, arch, releasever, id,
   } = repository;
 
   const repoData = {
@@ -52,6 +52,7 @@ export const disableRepository = repository => async (dispatch) => {
     product_id: productId,
     basearch: arch,
     releasever,
+    repository_id: id,
   };
   dispatch({ type: DISABLE_REPOSITORY_REQUEST, repository });
   const url = `/products/${productId}/repository_sets/${contentId}/disable`;

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

@@ -14,26 +14,31 @@ const recommendedRepositoriesRHEL = [
   'rhel-8-for-x86_64-baseos-kickstart',
   'rhel-8-for-x86_64-appstream-rpms',
   'rhel-8-for-x86_64-appstream-kickstart',
+  'rhel-8-for-x86_64-baseos-eus-rpms',
+  'rhel-8-for-x86_64-appstream-eus-rpms',
   'rhel-7-server-rpms',
   'rhel-7-server-optional-rpms',
   'rhel-7-server-extras-rpms',
-  'rhel-7-server-eus-rpms',
   'rhel-7-server-kickstart',
-  'rhel-6-server-els-rpms',
-  'rhel-6-server-kickstart',
 ];
 
 const recommendedRepositoriesSatTools = [
-  'satellite-tools-6.10-for-rhel-8-x86_64-rpms',
-  'rhel-7-server-satellite-tools-6.10-rpms',
-  'rhel-6-server-els-satellite-tools-6.10-rpms',
-  'rhel-7-server-satellite-maintenance-6-rpms',
+  'satellite-client-6-for-rhel-9-x86_64-rpms',
+  'satellite-client-6-for-rhel-8-x86_64-rpms',
+  'rhel-7-server-satellite-client-6-rpms',
+  'rhel-6-server-els-satellite-client-6-rpms',
 ];
 
 const recommendedRepositoriesMisc = [
   'rhel-server-rhscl-7-rpms',
-  'rhel-7-server-satellite-capsule-6.10-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',
+  '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',
 ];
 
 const recommendedRepositorySetLables = recommendedRepositoriesRHEL

data/webpack/scenes/AlternateContentSources/ACSActions.js

@@ -0,0 +1,65 @@
+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 { getResponseErrorMsgs } from '../../utils/helpers';
+import { renderTaskStartedToast } from '../Tasks/helpers';
+
+const acsSuccessToast = (response) => {
+  const { data: { name } } = response;
+  return __(`Alternate content source ${name} created`);
+};
+
+export const acsErrorToast = (error) => {
+  const message = getResponseErrorMsgs(error.response);
+  return message;
+};
+
+export const createACSParams = (extraParams) => {
+  const getParams = {
+    organization_id: orgId(),
+    ...extraParams,
+  };
+  return getParams;
+};
+
+const getAlternateContentSources = (extraParams, id = '') => get({
+  type: API_OPERATIONS.GET,
+  key: ACS_KEY + id,
+  url: api.getApiUrl('/alternate_content_sources'),
+  params: createACSParams(extraParams),
+});
+
+export const createACS = params => post({
+  type: API_OPERATIONS.POST,
+  key: CREATE_ACS_KEY,
+  url: api.getApiUrl('/alternate_content_sources'),
+  params,
+  successToast: response => acsSuccessToast(response),
+  errorToast: error => acsErrorToast(error),
+});
+
+export const deleteACS = (acsId, handleSuccess) => APIActions.delete({
+  type: API_OPERATIONS.DELETE,
+  key: DELETE_ACS_KEY,
+  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)}`),
+});
+
+export const refreshACS = (acsId, handleSuccess) => post({
+  type: API_OPERATIONS.POST,
+  key: acsRefreshKey(acsId),
+  url: api.getApiUrl(`/alternate_content_sources/${acsId}/refresh`),
+  params: { id: acsId },
+  handleSuccess: (response) => {
+    if (handleSuccess) handleSuccess();
+    return renderTaskStartedToast(response.data);
+  },
+  errorToast: error => __(`Something went wrong while refreshing this alternate content source! ${getResponseErrorMsgs(error.response)}`),
+});
+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

@@ -0,0 +1,18 @@
+import { translate as __ } from 'foremanReact/common/I18n';
+
+const ACS_KEY = 'ACS';
+export const CREATE_ACS_KEY = 'ACS_CREATE';
+export const DELETE_ACS_KEY = 'ACS_DELETE';
+export const SMART_PROXY_KEY = 'SMART_PROXY';
+export const SSL_CERTS = 'SSL_CERTS';
+export const acsRefreshKey = acsId => `${ACS_KEY}_REFRESH_${acsId}`;
+
+export const YUM = __('Yum');
+export const FILE = __('File');
+
+export const ACS_TYPE_TRANSLATIONS_ENUM = {
+  [YUM]: 'yum',
+  [FILE]: 'file',
+};
+
+export default ACS_KEY;

data/webpack/scenes/AlternateContentSources/ACSIndexPage.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { Grid, GridItem, TextContent, Text, TextVariants } from '@patternfly/react-core';
+import ACSTable from './MainTable/ACSTable';
+
+const ACSIndexPage = () => (
+  <>
+    <Grid className="margin-24">
+      <GridItem span={12}>
+        <TextContent>
+          <Text component={TextVariants.h1}>{__('Alternate content sources')}</Text>
+        </TextContent>
+      </GridItem>
+    </Grid>
+    <Grid>
+      <GridItem span={12}>
+        <ACSTable />
+      </GridItem>
+    </Grid>
+  </>
+);
+
+export default ACSIndexPage;

data/webpack/scenes/AlternateContentSources/ACSSelectors.js

@@ -0,0 +1,24 @@
+import {
+  selectAPIStatus,
+  selectAPIError,
+  selectAPIResponse,
+} from 'foremanReact/redux/API/APISelectors';
+import { STATUS } from 'foremanReact/constants';
+import ACS_KEY, { CREATE_ACS_KEY } from './ACSConstants';
+
+export const selectAlternateContentSources = (state, index = '') => selectAPIResponse(state, ACS_KEY + index) || {};
+
+export const selectAlternateContentSourcesStatus = (state, index = '') =>
+  selectAPIStatus(state, ACS_KEY + index) || STATUS.PENDING;
+
+export const selectAlternateContentSourcesError = (state, index = '') =>
+  selectAPIError(state, ACS_KEY + index);
+
+export const selectCreateACS = state =>
+  selectAPIResponse(state, CREATE_ACS_KEY) || {};
+
+export const selectCreateACSStatus = state =>
+  selectAPIStatus(state, CREATE_ACS_KEY) || STATUS.PENDING;
+
+export const selectCreateACSError = state =>
+  selectAPIError(state, CREATE_ACS_KEY);

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

@@ -0,0 +1,4 @@
+import { createContext } from 'react';
+
+const ACSCreateContext = createContext({});
+export default ACSCreateContext;

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

@@ -0,0 +1,160 @@
+import React, { useEffect, useState } from 'react';
+import { useDispatch } from 'react-redux';
+import PropTypes from 'prop-types';
+import { Wizard } from '@patternfly/react-core';
+import { translate as __ } from 'foremanReact/common/I18n';
+import ACSCreateContext from './ACSCreateContext';
+import SelectSource from './Steps/SelectSource';
+import NameACS from './Steps/NameACS';
+import AcsUrlPaths from './Steps/AcsUrlPaths';
+import ACSCredentials from './Steps/ACSCredentials';
+import ACSSmartProxies from './Steps/ACSSmartProxies';
+import ACSReview from './Steps/ACSReview';
+import ACSCreateFinish from './Steps/ACSCreateFinish';
+import { getContentCredentials } from '../../ContentCredentials/ContentCredentialActions';
+import { getSmartProxies } from '../../SmartProxy/SmartProxyContentActions';
+import { CONTENT_CREDENTIAL_CERT_TYPE } from '../../ContentCredentials/ContentCredentialConstants';
+
+const ACSCreateWizard = ({ show, setIsOpen }) => {
+  const [acsType, setAcsType] = useState(null);
+  const [contentType, setContentType] = useState('yum');
+  const [name, setName] = useState('');
+  const [description, setDescription] = useState('');
+  const [smartProxies, setSmartProxies] = useState([]);
+  const [url, setUrl] = useState('');
+  const [subpaths, setSubpaths] = useState('');
+  const [verifySSL, setVerifySSL] = useState(false);
+  const [authentication, setAuthentication] = useState('');
+  const [sslCert, setSslCert] = useState('');
+  const [sslKey, setSslKey] = useState('');
+  const [sslCertName, setSslCertName] = useState('');
+  const [sslKeyName, setSslKeyName] = useState('');
+  const [username, setUsername] = useState('');
+  const [password, setPassword] = useState('');
+  const [caCert, setCACert] = useState('');
+  const [caCertName, setCACertName] = useState('');
+  const [currentStep, setCurrentStep] = useState(1);
+  const dispatch = useDispatch();
+
+  useEffect(
+    () => {
+      dispatch(getContentCredentials({ content_type: CONTENT_CREDENTIAL_CERT_TYPE }));
+      dispatch(getSmartProxies());
+    },
+    [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,
+    },
+
+  ];
+
+  return (
+    <ACSCreateContext.Provider value={{
+      show,
+      setIsOpen,
+      currentStep,
+      setCurrentStep,
+      acsType,
+      setAcsType,
+      contentType,
+      setContentType,
+      name,
+      setName,
+      description,
+      setDescription,
+      smartProxies,
+      setSmartProxies,
+      url,
+      setUrl,
+      subpaths,
+      setSubpaths,
+      verifySSL,
+      setVerifySSL,
+      authentication,
+      setAuthentication,
+      sslCert,
+      setSslCert,
+      sslKey,
+      setSslKey,
+      sslCertName,
+      setSslCertName,
+      sslKeyName,
+      setSslKeyName,
+      username,
+      setUsername,
+      password,
+      setPassword,
+      caCert,
+      setCACert,
+      caCertName,
+      setCACertName,
+    }}
+    >
+      <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);
+        }}
+        isOpen={show}
+      />
+    </ACSCreateContext.Provider>
+  );
+};
+
+ACSCreateWizard.propTypes = {
+  show: PropTypes.bool,
+  setIsOpen: PropTypes.func,
+};
+
+ACSCreateWizard.defaultProps = {
+  show: false,
+  setIsOpen: null,
+};
+
+export default ACSCreateWizard;