katello 4.5.0.rc1 → 4.5.0.rc2

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

@@ -0,0 +1,199 @@
+import React, { useContext } from 'react';
+import { useSelector } from 'react-redux';
+import { translate as __ } from 'foremanReact/common/I18n';
+import {
+  Form,
+  FormGroup,
+  FormSelect,
+  FormSelectOption,
+  TextInput,
+  Radio,
+} from '@patternfly/react-core';
+import { STATUS } from 'foremanReact/constants';
+import ACSCreateContext from '../ACSCreateContext';
+import WizardHeader from '../../../ContentViews/components/WizardHeader';
+import { selectContentCredentials, selectContentCredentialsStatus } from '../../../ContentCredentials/ContentCredentialSelectors';
+import Loading from '../../../../components/Loading';
+
+const ACSCredentials = () => {
+  const {
+    authentication, setAuthentication, username, setUsername, password, setPassword,
+    sslCert, setSslCert, sslKey, setSslKey, caCert, setCACert,
+    setSslCertName, setSslKeyName, setCACertName,
+  } = useContext(ACSCreateContext);
+
+  const contentCredentials = useSelector(selectContentCredentials);
+  const contentCredentialsStatus = useSelector(selectContentCredentialsStatus);
+
+  if (contentCredentialsStatus === STATUS.PENDING) {
+    return <Loading loadingText={__('Fetching content credentials')} />;
+  }
+
+  const getCertName = id => contentCredentials?.filter(cc => Number(cc.id) === Number(id))[0]?.name;
+
+  return (
+    <>
+      <WizardHeader
+        title={__('Credentials')}
+        description={__('Enter basic authentication information or choose content credentials if required for this source.')}
+      />
+      <Form>
+        <Radio
+          label={__('Manual authentication')}
+          id="manual_auth"
+          name="manual_auth"
+          aria-label="manual_auth"
+          isChecked={authentication === 'manual'}
+          onChange={() => {
+            setAuthentication('manual');
+            setSslCert('');
+            setSslKey('');
+            setSslCertName('');
+            setSslKeyName('');
+          }}
+        />
+        {(authentication === 'manual') &&
+          <>
+            <FormGroup
+              label={__('Username')}
+              type="string"
+              fieldId="acs_username"
+              isRequired
+            >
+              <TextInput
+                isRequired
+                type="text"
+                id="acs_username_field"
+                name="acs_username_field"
+                aria-label="acs_username_field"
+                value={username}
+                onChange={(value) => { setUsername(value); }}
+              />
+
+            </FormGroup>
+            <FormGroup
+              label={__('Password')}
+              type="password"
+              fieldId="acs_password"
+            >
+              <TextInput
+                isRequired
+                type="password"
+                id="acs_password_field"
+                name="acs_password_field"
+                aria-label="acs_password_field"
+                value={password}
+                onChange={(value) => { setPassword(value); }}
+              />
+            </FormGroup>
+          </>
+        }
+        <Radio
+          label={__('Content credentials')}
+          id="content_credentials"
+          aria-label="content_credentials"
+          name="content_cred_auth"
+          isChecked={authentication === 'content_credentials'}
+          onChange={() => {
+            setAuthentication('content_credentials');
+            setUsername('');
+            setPassword('');
+          }}
+        />
+        {(authentication === 'content_credentials') &&
+        <>
+          <FormGroup
+            label={__('SSL client certificate')}
+            type="string"
+            fieldId="client_cert"
+          >
+            <FormSelect isRequired value={sslCert} onChange={(value) => { setSslCert(value); setSslCertName(getCertName(value)); }} aria-label="sslCert_select">
+              {
+                [
+                  <FormSelectOption
+                    key="placeholder"
+                    value=""
+                    label={__('Select a client certificate')}
+                    isDisabled
+                  />,
+                ].concat(contentCredentials?.map(cc => (
+                  <FormSelectOption
+                    key={cc.id}
+                    value={cc.id}
+                    label={cc.name}
+                  />
+                )))
+              }
+            </FormSelect>
+          </FormGroup>
+          <FormGroup
+            label={__('SSL client key')}
+            type="string"
+            fieldId="client_key"
+          >
+            <FormSelect isRequired value={sslKey} onChange={(value) => { setSslKey(value); setSslKeyName(getCertName(value)); }} aria-label="sslKey_select">
+              {
+                [
+                  <FormSelectOption
+                    key="placeholder"
+                    value=""
+                    label={__('Select a client key')}
+                    isDisabled
+                  />,
+                ].concat(contentCredentials?.map(cc => (
+                  <FormSelectOption
+                    key={cc.id}
+                    value={cc.id}
+                    label={cc.name}
+                  />
+                )))
+              }
+            </FormSelect>
+          </FormGroup>
+        </>
+        }
+        <Radio
+          label={__('None')}
+          id="none"
+          name="none"
+          aria-label="none"
+          isChecked={authentication === ''}
+          onChange={() => {
+            setAuthentication('');
+            setSslCert('');
+            setSslKey('');
+            setSslCertName('');
+            setSslKeyName('');
+            setUsername('');
+            setPassword('');
+          }}
+        />
+        <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">
+            {
+              [
+                <FormSelectOption
+                  key="placeholder"
+                  value=""
+                  label={__('Select a CA certificate')}
+                />,
+              ].concat(contentCredentials?.map(cc => (
+                <FormSelectOption
+                  key={cc.id}
+                  value={cc.id}
+                  label={cc.name}
+                />
+              )))
+            }
+          </FormSelect>
+        </FormGroup>
+      </Form>
+    </>
+  );
+};
+
+export default ACSCredentials;

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

@@ -0,0 +1,104 @@
+import React, { useContext } from 'react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import {
+  TextContent,
+  TextList,
+  TextListVariants,
+  TextListItem,
+  TextListItemVariants,
+} from '@patternfly/react-core';
+import ACSCreateContext from '../ACSCreateContext';
+import WizardHeader from '../../../ContentViews/components/WizardHeader';
+
+const ACSReview = () => {
+  const {
+    name, description, acsType, contentType,
+    smartProxies, url, subpaths, verifySSL,
+    authentication, sslCertName, sslKeyName, username,
+    password, caCertName,
+  } = useContext(ACSCreateContext);
+
+  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.')}
+      />
+      <TextContent>
+        <TextList component={TextListVariants.dl}>
+          <TextListItem component={TextListItemVariants.dt}>{__('Name')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {name}
+          </TextListItem>
+          <TextListItem component={TextListItemVariants.dt}>{__('Source type')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {acsType}
+          </TextListItem>
+          <TextListItem component={TextListItemVariants.dt}>{__('Description')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {description}
+          </TextListItem>
+          <TextListItem component={TextListItemVariants.dt}>{__('Content type')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {contentType}
+          </TextListItem>
+          <TextListItem component={TextListItemVariants.dt}>{__('Smart proxies')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {smartProxies}
+          </TextListItem>
+          <TextListItem component={TextListItemVariants.dt}>{__('Base URL')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {url}
+          </TextListItem>
+          <TextListItem component={TextListItemVariants.dt}>{__('Subpaths')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {subpaths}
+          </TextListItem>
+          <TextListItem component={TextListItemVariants.dt}>{__('Verify SSL')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {verifySSL ? __('Yes') : __('No')}
+          </TextListItem>
+          <TextListItem component={TextListItemVariants.dt}>{__('CA Cert')}</TextListItem>
+          <TextListItem component={TextListItemVariants.dd}>
+            {caCertName}
+          </TextListItem>
+          {authentication === 'manual' && (
+            <>
+              <TextListItem component={TextListItemVariants.dt}>{__('Authentication type')}</TextListItem>
+              <TextListItem component={TextListItemVariants.dd}>
+                {__('Manual')}
+              </TextListItem>
+              <TextListItem component={TextListItemVariants.dt}>{__('Username')}</TextListItem>
+              <TextListItem component={TextListItemVariants.dd}>
+                {username}
+              </TextListItem>
+              <TextListItem component={TextListItemVariants.dt}>{__('Password')}</TextListItem>
+              <TextListItem component={TextListItemVariants.dd}>
+                {password}
+              </TextListItem>
+            </>
+          )}
+          {authentication === 'content_credentials' && (
+            <>
+              <TextListItem component={TextListItemVariants.dt}>{__('Authentication type')}</TextListItem>
+              <TextListItem component={TextListItemVariants.dd}>
+                {__('Content credential')}
+              </TextListItem>
+              <TextListItem component={TextListItemVariants.dt}>{__('SSL Cert')}</TextListItem>
+              <TextListItem component={TextListItemVariants.dd}>
+                {sslCertName}
+              </TextListItem>
+              <TextListItem component={TextListItemVariants.dt}>{__('Client key')}</TextListItem>
+              <TextListItem component={TextListItemVariants.dd}>
+                {sslKeyName}
+              </TextListItem>
+            </>
+          )}
+        </TextList>
+      </TextContent>
+    </>
+  );
+};
+
+export default ACSReview;

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

@@ -0,0 +1,41 @@
+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 ACSCreateContext from '../ACSCreateContext';
+import WizardHeader from '../../../ContentViews/components/WizardHeader';
+import { selectSmartProxy } from '../../../SmartProxy/SmartProxyContentSelectors';
+
+const ACSSmartProxies = () => {
+  const {
+    smartProxies, setSmartProxies,
+  } = useContext(ACSCreateContext);
+  const availableSmartProxies = useSelector(selectSmartProxy);
+  const { results } = availableSmartProxies;
+  const [availableOptions, setAvailableOptions] = useState(results?.map(proxy => proxy.name));
+  const onListChange = (newAvailableOptions, newChosenOptions) => {
+    setAvailableOptions(newAvailableOptions);
+    setSmartProxies(newChosenOptions);
+  };
+
+  return (
+    <>
+      <WizardHeader
+        title={__('Name source')}
+        description={__('Enter a name for your source.')}
+      />
+      <DualListSelector
+        isSearchable
+        availableOptions={availableOptions}
+        chosenOptions={smartProxies}
+        addAll={onListChange}
+        removeAll={onListChange}
+        addSelected={onListChange}
+        removeSelected={onListChange}
+        id="selector"
+      />
+    </>
+  );
+};
+
+export default ACSSmartProxies;

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

@@ -0,0 +1,71 @@
+import React, { useContext } from 'react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import {
+  Form,
+  FormGroup,
+  TextInput,
+  TextArea,
+  Switch,
+} from '@patternfly/react-core';
+import ACSCreateContext from '../ACSCreateContext';
+import WizardHeader from '../../../ContentViews/components/WizardHeader';
+
+const AcsUrlPaths = () => {
+  const {
+    url, setUrl, subpaths, setSubpaths, verifySSL, setVerifySSL,
+  } = useContext(ACSCreateContext);
+
+  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.')}
+      />
+      <Form>
+        <FormGroup
+          label={__('Base URL')}
+          type="string"
+          fieldId="acs_base_url"
+          isRequired
+        >
+          <TextInput
+            isRequired
+            type="text"
+            id="acs_base_url_field"
+            name="acs_base_url_field"
+            aria-label="acs_base_url_field"
+            placeholder="https:// or file://"
+            value={url}
+            onChange={(value) => { setUrl(value); }}
+          />
+        </FormGroup>
+        <FormGroup
+          label={__('Subpaths')}
+          type="string"
+          fieldId="acs_subpaths"
+          isRequired
+        >
+          <TextArea
+            placeholder="test/repo1/, test/repo2/,"
+            value={subpaths}
+            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>
+    </>
+  );
+};
+
+export default AcsUrlPaths;

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

@@ -0,0 +1,57 @@
+import React, { useContext } from 'react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import {
+  Form,
+  FormGroup,
+  TextInput,
+  TextArea,
+} from '@patternfly/react-core';
+import ACSCreateContext from '../ACSCreateContext';
+import WizardHeader from '../../../ContentViews/components/WizardHeader';
+
+const NameACS = () => {
+  const {
+    name, setName, description, setDescription,
+  } = useContext(ACSCreateContext);
+
+  return (
+    <>
+      <WizardHeader
+        title={__('Name source')}
+        description={__('Enter a name for your source.')}
+      />
+      <Form>
+        <FormGroup
+          label={__('Name')}
+          type="string"
+          fieldId="acs_name"
+          isRequired
+        >
+          <TextInput
+            isRequired
+            type="text"
+            id="acs_name_field"
+            name="acs_name_field"
+            aria-label="acs_name_field"
+            value={name}
+            onChange={(value) => { setName(value); }}
+          />
+        </FormGroup>
+        <FormGroup
+          label={__('Description')}
+          type="string"
+          fieldId="acs_description"
+        >
+          <TextArea
+            value={description}
+            onChange={(value) => { setDescription(value); }}
+            name="acs_description_field"
+            id="acs_description_field"
+          />
+        </FormGroup>
+      </Form>
+    </>
+  );
+};
+
+export default NameACS;

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

@@ -0,0 +1,77 @@
+import React, { useContext } from 'react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import {
+  Tile,
+  Flex,
+  FlexItem,
+  Form,
+  FormGroup,
+  FormSelect,
+  FormSelectOption,
+} from '@patternfly/react-core';
+import ACSCreateContext from '../ACSCreateContext';
+import WizardHeader from '../../../ContentViews/components/WizardHeader';
+
+const SelectSource = () => {
+  const {
+    acsType, setAcsType, contentType, setContentType,
+  } = useContext(ACSCreateContext);
+
+  const onSelect = (event) => {
+    setAcsType(event.currentTarget.id);
+  };
+  const onKeyDown = (event) => {
+    if (event.key === ' ' || event.key === 'Enter') {
+      event.preventDefault();
+      setAcsType(event.currentTarget.id);
+    }
+  };
+
+  const typeOptions = [
+    { value: 'yum', label: __('Yum') },
+    { value: 'file', label: __('File') },
+  ];
+
+  return (
+    <>
+      <WizardHeader
+        title={__('Select source type')}
+        description={__('Indicate the source type.')}
+      />
+      <Form>
+        <FormGroup
+          label={__('Source type')}
+          type="string"
+          fieldId="source_type"
+          isRequired
+        >
+          <Flex>
+            <FlexItem>
+              <Tile title={__('Custom')} isStacked id="custom" onClick={onSelect} onKeyDown={onKeyDown} isSelected={acsType === 'custom'} />{' '}
+            </FlexItem>
+          </Flex>
+        </FormGroup>
+        <FormGroup
+          label={__('Content type')}
+          type="string"
+          fieldId="content_type"
+          isRequired
+        >
+          <FormSelect isRequired value={contentType} onChange={(value) => { setContentType(value); }} aria-label="FormSelect Input">
+            {
+          typeOptions.map(option => (
+            <FormSelectOption
+              key={option.value}
+              value={option.value}
+              label={option.label}
+            />
+          ))
+        }
+          </FormSelect>
+        </FormGroup>
+      </Form>
+    </>
+  );
+};
+
+export default SelectSource;