diff --git a/awx/ui_next/src/screens/Credential/shared/CredentialForm.jsx b/awx/ui_next/src/screens/Credential/shared/CredentialForm.jsx
index 9cf197842b..9d69aa7d13 100644
--- a/awx/ui_next/src/screens/Credential/shared/CredentialForm.jsx
+++ b/awx/ui_next/src/screens/Credential/shared/CredentialForm.jsx
@@ -1,4 +1,5 @@
import React, { useCallback, useEffect, useState } from 'react';
+import { useLocation } from 'react-router-dom';
import { shape } from 'prop-types';
import { Formik, useField, useFormikContext } from 'formik';
import { withI18n } from '@lingui/react';
@@ -11,6 +12,7 @@ import {
Select as PFSelect,
SelectOption as PFSelectOption,
SelectVariant,
+ Tooltip,
} from '@patternfly/react-core';
import styled from 'styled-components';
import FormField, { FormSubmitError } from '../../../components/FormField';
@@ -27,6 +29,7 @@ const Select = styled(PFSelect)`
ul {
max-width: 495px;
}
+ ${props => (props.isDisabled ? `cursor: not-allowed` : null)}
`;
const SelectOption = styled(PFSelectOption)`
@@ -36,6 +39,7 @@ const SelectOption = styled(PFSelectOption)`
`;
function CredentialFormFields({ i18n, initialTypeId, credentialTypes }) {
+ const { pathname } = useLocation();
const { setFieldValue, initialValues, setFieldTouched } = useFormikContext();
const [isSelectOpen, setIsSelectOpen] = useState(false);
const [credTypeField, credTypeMeta, credTypeHelpers] = useField({
@@ -128,6 +132,38 @@ function CredentialFormFields({ i18n, initialTypeId, credentialTypes }) {
[setFieldValue]
);
+ const isCredentialTypeDisabled = pathname.includes('edit');
+ const credentialTypeSelect = (
+
+ );
+
return (
<>
-
+ {isCredentialTypeDisabled ? (
+
+ {credentialTypeSelect}
+
+ ) : (
+ credentialTypeSelect
+ )}
{credentialTypeId !== undefined &&
credentialTypeId !== '' &&