katello 4.6.2.1 → 4.7.0.rc1

data/webpack/scenes/AlternateContentSources/ACSActions.js

@@ -8,6 +8,8 @@ import 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';
@@ -25,6 +27,7 @@ export const acsErrorToast = (error) => {
 export const createACSParams = (extraParams) => {
   const getParams = {
     organization_id: orgId(),
+    include_permissions: true,
     ...extraParams,
   };
   return getParams;
@@ -42,13 +45,15 @@ export const getACSDetails = (acsId, extraParams = {}) => 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 => post({
+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),
 });
@@ -59,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({
@@ -68,10 +73,36 @@ 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({
@@ -91,7 +122,7 @@ export const editACS = (acsId, params, handleSuccess, handleError) => APIActions
   handleSuccess,
   handleError,
   successToast: () => __('Alternate content source edited'),
-  errorToast: error => __(`Something went wrong while editing the alternate content source! ${getResponseErrorMsgs(error.response)}`),
+  errorToast: error => acsErrorToast(error),
 });
 
 export default getAlternateContentSources;

data/webpack/scenes/AlternateContentSources/ACSConstants.js

@@ -7,6 +7,8 @@ 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}`;
 

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

@@ -10,14 +10,14 @@ 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)) || {};

data/webpack/scenes/AlternateContentSources/Acs.scss

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

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

@@ -16,6 +16,8 @@ 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);
@@ -25,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('');
@@ -49,6 +52,16 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
     [dispatch],
   );
 
+  const credentialsFilled = () => {
+    if (authentication === 'manual') {
+      return username !== '';
+    }
+    return true;
+  };
+
+  const subPathValidated = areSubPathsValid(subpaths) ? 'default' : 'error';
+  const urlValidated = (url === '' || isValidUrl(url)) ? 'default' : 'error';
+
   const sourceTypeStep = {
     id: 1,
     name: __('Select source type'),
@@ -60,6 +73,7 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
     id: 2,
     name: __('Name source'),
     component: <NameACS />,
+    canJumpTo: acsType && contentType,
     enableNext: name !== '',
   };
 
@@ -67,6 +81,7 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
     id: 3,
     name: __('Select smart proxy'),
     component: <ACSSmartProxies />,
+    canJumpTo: name !== '',
     enableNext: smartProxies.length,
   };
 
@@ -74,6 +89,7 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
     id: 4,
     name: __('Select products'),
     component: <ACSProducts />,
+    canJumpTo: smartProxies.length,
     enableNext: productIds.length,
   };
 
@@ -81,14 +97,16 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
     id: 5,
     name: __('URL and paths'),
     component: <AcsUrlPaths />,
-    enableNext: url !== '',
+    canJumpTo: (acsType === 'custom' || acsType === 'rhui') && (smartProxies.length),
+    enableNext: url !== '' && urlValidated !== 'error' && subPathValidated !== 'error',
   };
 
   const credentialsStep = {
     id: 6,
     name: __('Credentials'),
     component: <ACSCredentials />,
-    enableNext: (url !== '' || productIds.length) && smartProxies.length && name !== '' && acsType && contentType,
+    canJumpTo: url !== '' && urlValidated !== 'error' && subPathValidated !== 'error',
+    enableNext: (url !== '' || productIds.length) && smartProxies.length && name !== '' && acsType && contentType && credentialsFilled(),
   };
 
   const reviewStep = {
@@ -96,6 +114,7 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
     name: __('Review details'),
     component: <ACSReview />,
     nextButtonText: __('Add'),
+    canJumpTo: (url !== '' || productIds.length) && smartProxies.length && name !== '' && acsType && contentType && credentialsFilled(),
     enableNext: (url !== '' || productIds.length) && smartProxies.length && name !== '' && acsType && contentType,
   };
 
@@ -110,7 +129,7 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
     sourceTypeStep,
     nameStep,
     smartProxyStep,
-    ...(acsType === 'custom' ? [urlPathStep, credentialsStep] : []),
+    ...((acsType === 'custom' || acsType === 'rhui') ? [urlPathStep, credentialsStep] : []),
     ...(acsType === 'simplified' ? [productStep] : []),
     reviewStep,
     finishStep,
@@ -140,6 +159,8 @@ const ACSCreateWizard = ({ show, setIsOpen }) => {
       setUrl,
       subpaths,
       setSubpaths,
+      useHttpProxies,
+      setUseHttpProxies,
       verifySSL,
       setVerifySSL,
       authentication,

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

@@ -6,7 +6,7 @@ import { translate as __ } from 'foremanReact/common/I18n';
 import { STATUS } from 'foremanReact/constants';
 import ACSCreateContext from '../ACSCreateContext';
 import { selectCreateACS, selectCreateACSError, selectCreateACSStatus } from '../../ACSSelectors';
-import { createACS } from '../../ACSActions';
+import getAlternateContentSources, { createACS } from '../../ACSActions';
 import Loading from '../../../../components/Loading';
 
 const ACSCreateFinish = () => {
@@ -21,6 +21,7 @@ const ACSCreateFinish = () => {
     smartProxies,
     url,
     subpaths,
+    useHttpProxies,
     verifySSL,
     authentication,
     sslCert,
@@ -31,15 +32,15 @@ const ACSCreateFinish = () => {
     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') {
+    if (type === 'custom' || type === 'rhui') {
       acsParams = {
         base_url: url, verify_ssl: verifySSL, ssl_ca_cert_id: caCert, ...acsParams,
       };
@@ -60,6 +61,7 @@ const ACSCreateFinish = () => {
         name,
         description,
         smart_proxy_names: smartProxies,
+        use_http_proxies: useHttpProxies,
         content_type: contentType,
         alternate_content_source_type: acsType,
       };
@@ -70,18 +72,18 @@ const ACSCreateFinish = () => {
       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,
+    smartProxies, contentType, useHttpProxies, verifySSL, caCert, sslCert, sslKey,
     username, password, currentStep, acsTypeParams]);
 
   useDeepCompareEffect(() => {
     const { id } = response;
     if (id && status === STATUS.RESOLVED && saving) {
       setSaving(false);
-      push(`/labs/alternate_content_sources/${id}/details`);
+      window.location.assign(`/alternate_content_sources/${id}/details`);
       setIsOpen(false);
     } else if (status === STATUS.ERROR) {
       setSaving(false);

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

@@ -8,6 +8,7 @@ import {
   FormSelectOption,
   TextInput,
   Radio,
+  Switch,
 } from '@patternfly/react-core';
 import { STATUS } from 'foremanReact/constants';
 import ACSCreateContext from '../ACSCreateContext';
@@ -17,9 +18,9 @@ import Loading from '../../../../components/Loading';
 
 const ACSCredentials = () => {
   const {
-    authentication, setAuthentication, username, setUsername, password, setPassword,
+    acsType, authentication, setAuthentication, username, setUsername, password, setPassword,
     sslCert, setSslCert, sslKey, setSslKey, caCert, setCACert,
-    setSslCertName, setSslKeyName, setCACertName,
+    setSslCertName, setSslKeyName, setCACertName, verifySSL, setVerifySSL,
   } = useContext(ACSCreateContext);
 
   const contentCredentials = useSelector(selectContentCredentials);
@@ -31,13 +32,18 @@ const ACSCredentials = () => {
 
   const getCertName = id => contentCredentials?.filter(cc => Number(cc.id) === Number(id))[0]?.name;
 
+  const description = acsType === 'rhui' ?
+    __('Choose content credentials if required for this RHUI source.') :
+    __('Enter basic authentication information or choose content credentials if required for this source.');
+
   return (
     <>
       <WizardHeader
         title={__('Credentials')}
-        description={__('Enter basic authentication information or choose content credentials if required for this source.')}
+        description={description}
       />
       <Form>
+        {(acsType !== 'rhui') &&
         <Radio
           label={__('Manual authentication')}
           id="manual_auth"
@@ -52,6 +58,7 @@ const ACSCredentials = () => {
             setSslKeyName('');
           }}
         />
+        }
         {(authentication === 'manual') &&
           <>
             <FormGroup
@@ -168,12 +175,26 @@ const ACSCredentials = () => {
             setPassword('');
           }}
         />
+        <FormGroup label={__('Verify SSL')} fieldId="verify_ssl">
+          <Switch
+            id="verify-ssl-switch"
+            aria-label="verify-ssl-switch"
+            isChecked={verifySSL}
+            onChange={checked => setVerifySSL(checked)}
+          />
+        </FormGroup>
         <FormGroup
           label={__('SSL CA certificate')}
           type="string"
           fieldId="ca_cert"
         >
-          <FormSelect isRequired value={caCert} onChange={(value) => { setCACert(value); setCACertName(getCertName(value)); }} aria-label="sslCAcert_select">
+          <FormSelect
+            isDisabled={!verifySSL}
+            isRequired
+            value={caCert}
+            onChange={(value) => { setCACert(value); setCACertName(getCertName(value)); }}
+            aria-label="sslCAcert_select"
+          >
             {
               [
                 <FormSelectOption

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

@@ -1,13 +1,15 @@
 import React, { useContext } from 'react';
+import { capitalize, upperCase } from 'lodash';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { TextContent, TextList, TextListItem, TextListItemVariants, TextListVariants } from '@patternfly/react-core';
 import ACSCreateContext from '../ACSCreateContext';
 import WizardHeader from '../../../ContentViews/components/WizardHeader';
+import InactiveText from '../../../ContentViews/components/InactiveText';
 
 const ACSReview = () => {
   const {
     name, description, acsType, contentType,
-    smartProxies, url, subpaths, verifySSL,
+    smartProxies, useHttpProxies, url, subpaths, verifySSL,
     authentication, sslCertName, sslKeyName, username,
     password, caCertName, productNames,
   } = useContext(ACSCreateContext);
@@ -15,9 +17,14 @@ const ACSReview = () => {
   return (
     <>
       <WizardHeader
-        title={__('Review Details')}
-        description={__('Review the information below and click Add to add your source. ' +
-                'To edit details in previous steps, click Back or any step on the left.')}
+        title={__('Review details')}
+        description={
+          <>
+            {__('Review the information below and click ')}<strong>{__('Add')}</strong>{__(' to add your source. ' +
+                'To edit details in previous steps, click ')}<strong>{__('Back')}</strong>{__(' or any step on the left.')
+            }
+          </>
+        }
       />
       <TextContent>
         <TextList component={TextListVariants.dl}>
@@ -27,7 +34,7 @@ const ACSReview = () => {
           </TextListItem>
           <TextListItem component={TextListItemVariants.dt}>{__('Source type')}</TextListItem>
           <TextListItem component={TextListItemVariants.dd}>
-            {acsType}
+            {acsType === 'rhui' ? upperCase(acsType) : capitalize(acsType)}
           </TextListItem>
           <TextListItem component={TextListItemVariants.dt}>{__('Description')}</TextListItem>
           <TextListItem component={TextListItemVariants.dd}>
@@ -35,13 +42,17 @@ const ACSReview = () => {
           </TextListItem>
           <TextListItem component={TextListItemVariants.dt}>{__('Content type')}</TextListItem>
           <TextListItem component={TextListItemVariants.dd}>
-            {contentType}
+            {capitalize(contentType)}
           </TextListItem>
           <TextListItem component={TextListItemVariants.dt}>{__('Smart proxies')}</TextListItem>
           <TextListItem component={TextListItemVariants.dd}>
             {smartProxies.join(', ')}
           </TextListItem>
-          {acsType === 'custom' &&
+          <TextListItem component={TextListItemVariants.dt}>{__('Use HTTP Proxies')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {useHttpProxies ? __('Yes') : __('No')}
+          </TextListItem>
+          {(acsType === 'custom' || acsType === 'rhui') &&
             <>
               <TextListItem component={TextListItemVariants.dt}>
                 {__('Base URL')}
@@ -57,7 +68,7 @@ const ACSReview = () => {
               <TextListItem component={TextListItemVariants.dd}>
                 {verifySSL ? __('Yes') : __('No')}
               </TextListItem>
-              <TextListItem component={TextListItemVariants.dt}>{__('CA Cert')}</TextListItem>
+              <TextListItem component={TextListItemVariants.dt}>{__('SSL CA certificate')}</TextListItem>
               <TextListItem component={TextListItemVariants.dd}>
                 {caCertName}
               </TextListItem>
@@ -76,7 +87,7 @@ const ACSReview = () => {
                   </TextListItem>
                   <TextListItem component={TextListItemVariants.dt}>{__('Password')}</TextListItem>
                   <TextListItem component={TextListItemVariants.dd}>
-                    {password}
+                    {password.length > 0 ? '••••••••' : <InactiveText text={__('N/A')} />}
                   </TextListItem>
                 </>
               )}
@@ -89,11 +100,11 @@ const ACSReview = () => {
                   <TextListItem component={TextListItemVariants.dd}>
                     {__('Content credential')}
                   </TextListItem>
-                  <TextListItem component={TextListItemVariants.dt}>{__('SSL Cert')}</TextListItem>
+                  <TextListItem component={TextListItemVariants.dt}>{__('SSL client certificate')}</TextListItem>
                   <TextListItem component={TextListItemVariants.dd}>
                     {sslCertName}
                   </TextListItem>
-                  <TextListItem component={TextListItemVariants.dt}>{__('Client key')}</TextListItem>
+                  <TextListItem component={TextListItemVariants.dt}>{__('SSL client key')}</TextListItem>
                   <TextListItem component={TextListItemVariants.dd}>
                     {sslKeyName}
                   </TextListItem>

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

@@ -1,14 +1,21 @@
 import React, { useContext, useState } from 'react';
 import { useSelector } from 'react-redux';
 import { translate as __ } from 'foremanReact/common/I18n';
-import { DualListSelector } from '@patternfly/react-core';
+import {
+  DualListSelector,
+  FormGroup,
+  Switch,
+  Flex,
+  FlexItem,
+} from '@patternfly/react-core';
 import ACSCreateContext from '../ACSCreateContext';
 import WizardHeader from '../../../ContentViews/components/WizardHeader';
 import { selectSmartProxy } from '../../../SmartProxy/SmartProxyContentSelectors';
+import { HelpToolTip } from '../../../ContentViews/Create/ContentViewFormComponents';
 
 const ACSSmartProxies = () => {
   const {
-    smartProxies, setSmartProxies,
+    smartProxies, setSmartProxies, useHttpProxies, setUseHttpProxies,
   } = useContext(ACSCreateContext);
   const availableSmartProxies = useSelector(selectSmartProxy);
   const { results } = availableSmartProxies;
@@ -35,6 +42,24 @@ const ACSSmartProxies = () => {
         removeSelected={onListChange}
         id="selector"
       />
+      <FormGroup
+        label={
+          <Flex spaceItems={{ default: 'spaceItemsNone' }}>
+            <FlexItem>{__('Use HTTP proxies')}</FlexItem>
+            <FlexItem>
+              <HelpToolTip tooltip={__('Alternate content sources use the HTTP proxy of their assigned smart proxy for communication.')} />
+            </FlexItem>
+          </Flex>
+          }
+        fieldId="use_http_proxies"
+      >
+        <Switch
+          id="use-http-proxies-switch"
+          aria-label="use-http-proxies-switch"
+          isChecked={useHttpProxies}
+          onChange={checked => setUseHttpProxies(checked)}
+        />
+      </FormGroup>
     </>
   );
 };

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

@@ -1,67 +1,99 @@
 import React, { useContext } from 'react';
 import { translate as __ } from 'foremanReact/common/I18n';
 import {
+  ClipboardCopy,
   Form,
   FormGroup,
   TextInput,
   TextArea,
-  Switch,
 } from '@patternfly/react-core';
 import ACSCreateContext from '../ACSCreateContext';
 import WizardHeader from '../../../ContentViews/components/WizardHeader';
+import { areSubPathsValid, isValidUrl } from '../../helpers';
 
 const AcsUrlPaths = () => {
   const {
-    url, setUrl, subpaths, setSubpaths, verifySSL, setVerifySSL,
+    acsType, url, setUrl, subpaths, setSubpaths,
   } = useContext(ACSCreateContext);
 
+  const subPathValidated = areSubPathsValid(subpaths) ? 'default' : 'error';
+  const [urlValidated, setUrlValidated] = React.useState('default');
+  const handleUrlChange = (newUrl, _event) => {
+    setUrl(newUrl);
+    if (isValidUrl(newUrl, acsType)) {
+      setUrlValidated('success');
+    } else {
+      setUrlValidated('error');
+    }
+  };
+
+  const baseURLplaceholder = acsType === 'rhui' ?
+    'https://rhui-server.example.com/pulp/content' :
+    'http:// or https://';
+  const helperTextInvalid = acsType === 'rhui' ?
+    'http://rhui-server.example.com/pulp/content or https://rhui-server.example.com/pulp/content' :
+    'http://, https:// or file://';
+  let headerDescription =
+    __('Enter in the base path and any subpaths that should be searched for alternate content.');
+  headerDescription = acsType === 'rhui' ?
+    `${headerDescription}${__(' The base path must be a web address pointing to the root RHUI content directory.')}` :
+    `${headerDescription}${__(' The base path can be a web address or a filesystem location.')}`;
+
   return (
     <>
       <WizardHeader
         title={__('URL and paths')}
-        description={__('Enter in the base path and any subpaths that should be searched for alternate content. ' +
-          'The base path can be a web address or a filesystem location.')}
+        description={headerDescription}
       />
       <Form>
         <FormGroup
           label={__('Base URL')}
-          type="string"
           fieldId="acs_base_url"
+          helperTextInvalid={helperTextInvalid}
+          validated={urlValidated}
           isRequired
         >
           <TextInput
             isRequired
-            type="text"
+            type="url"
             id="acs_base_url_field"
             name="acs_base_url_field"
             aria-label="acs_base_url_field"
-            placeholder="https:// or file://"
+            placeholder={baseURLplaceholder}
             value={url}
-            onChange={(value) => { setUrl(value); }}
+            validated={urlValidated}
+            onChange={handleUrlChange}
           />
         </FormGroup>
+        {acsType === 'rhui' &&
+        <>
+          {__('On the RHUA Instance, check the available repositories.')}
+          <ClipboardCopy hoverTip="Copy" clickTip="Copied" variant="inline-compact" isBlock>
+            rhui-manager repo list
+          </ClipboardCopy>
+          {__('Find the relative path for each RHUI repository and combine them in a comma-separated list.')}
+          <ClipboardCopy hoverTip="Copy" clickTip="Copied" variant="inline-compact" isBlock>
+            rhui-manager repo info --repo_id your_repo_id
+          </ClipboardCopy>
+        </>
+        }
         <FormGroup
           label={__('Subpaths')}
           type="string"
           fieldId="acs_subpaths"
+          helperTextInvalid={__('Comma-separated list of subpaths. All subpaths must have a slash at the end and none at the front.')}
+          validated={subPathValidated}
         >
           <TextArea
             placeholder="test/repo1/, test/repo2/,"
             value={subpaths}
-            onChange={(value) => { setSubpaths(value); }}
+            validated={subPathValidated}
+            onChange={value => setSubpaths(value)}
             name="acs_subpath_field"
             id="acs_subpath_field"
             aria-label="acs_subpath_field"
           />
         </FormGroup>
-        <FormGroup label={__('Verify SSL')} fieldId="verify_ssl">
-          <Switch
-            id="verify-ssl-switch"
-            aria-label="verify-ssl-switch"
-            isChecked={verifySSL}
-            onChange={checked => setVerifySSL(checked)}
-          />
-        </FormGroup>
       </Form>
     </>
   );