correct form submission errors for credential form

This commit is contained in:
John Mitchell
2020-03-19 13:12:58 -04:00
parent 3d7420959e
commit 16e672dd38
3 changed files with 11 additions and 3 deletions

View File

@@ -12,6 +12,7 @@ function CredentialAdd({ me }) {
const [error, setError] = useState(null); const [error, setError] = useState(null);
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
const [credentialTypes, setCredentialTypes] = useState(null); const [credentialTypes, setCredentialTypes] = useState(null);
const [formSubmitError, setFormSubmitError] = useState(null);
const history = useHistory(); const history = useHistory();
useEffect(() => { useEffect(() => {
@@ -36,6 +37,7 @@ function CredentialAdd({ me }) {
const handleSubmit = async values => { const handleSubmit = async values => {
const { organization, ...remainingValues } = values; const { organization, ...remainingValues } = values;
setFormSubmitError(null);
try { try {
const { const {
data: { id: credentialId }, data: { id: credentialId },
@@ -47,7 +49,7 @@ function CredentialAdd({ me }) {
const url = `/credentials/${credentialId}/details`; const url = `/credentials/${credentialId}/details`;
history.push(`${url}`); history.push(`${url}`);
} catch (err) { } catch (err) {
setError(err); setFormSubmitError(err);
} }
}; };
@@ -73,6 +75,7 @@ function CredentialAdd({ me }) {
onCancel={handleCancel} onCancel={handleCancel}
onSubmit={handleSubmit} onSubmit={handleSubmit}
credentialTypes={credentialTypes} credentialTypes={credentialTypes}
submitError={formSubmitError}
/> />
</CardBody> </CardBody>
</Card> </Card>

View File

@@ -12,6 +12,7 @@ function CredentialEdit({ credential, me }) {
const [error, setError] = useState(null); const [error, setError] = useState(null);
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
const [credentialTypes, setCredentialTypes] = useState(null); const [credentialTypes, setCredentialTypes] = useState(null);
const [formSubmitError, setFormSubmitError] = useState(null);
const history = useHistory(); const history = useHistory();
useEffect(() => { useEffect(() => {
@@ -38,6 +39,7 @@ function CredentialEdit({ credential, me }) {
const handleSubmit = async values => { const handleSubmit = async values => {
const { organization, ...remainingValues } = values; const { organization, ...remainingValues } = values;
setFormSubmitError(null);
try { try {
const { const {
data: { id: credentialId }, data: { id: credentialId },
@@ -49,7 +51,7 @@ function CredentialEdit({ credential, me }) {
const url = `/credentials/${credentialId}/details`; const url = `/credentials/${credentialId}/details`;
history.push(`${url}`); history.push(`${url}`);
} catch (err) { } catch (err) {
setError(err); setFormSubmitError(err);
} }
}; };
@@ -68,6 +70,7 @@ function CredentialEdit({ credential, me }) {
onSubmit={handleSubmit} onSubmit={handleSubmit}
credential={credential} credential={credential}
credentialTypes={credentialTypes} credentialTypes={credentialTypes}
submitError={formSubmitError}
/> />
</CardBody> </CardBody>
); );

View File

@@ -4,7 +4,7 @@ import { withI18n } from '@lingui/react';
import { t } from '@lingui/macro'; import { t } from '@lingui/macro';
import { func, shape } from 'prop-types'; import { func, shape } from 'prop-types';
import { Form, FormGroup, Title } from '@patternfly/react-core'; import { Form, FormGroup, Title } from '@patternfly/react-core';
import FormField from '@components/FormField'; import FormField, { FormSubmitError } from '@components/FormField';
import FormActionGroup from '@components/FormActionGroup/FormActionGroup'; import FormActionGroup from '@components/FormActionGroup/FormActionGroup';
import AnsibleSelect from '@components/AnsibleSelect'; import AnsibleSelect from '@components/AnsibleSelect';
import { required } from '@util/validators'; import { required } from '@util/validators';
@@ -118,6 +118,7 @@ function CredentialForm({
credentialTypes, credentialTypes,
onSubmit, onSubmit,
onCancel, onCancel,
submitError,
...rest ...rest
}) { }) {
const initialValues = { const initialValues = {
@@ -193,6 +194,7 @@ function CredentialForm({
sshCredentialTypeId={sshCredentialTypeId} sshCredentialTypeId={sshCredentialTypeId}
{...rest} {...rest}
/> />
<FormSubmitError error={submitError} />
<FormActionGroup <FormActionGroup
onCancel={onCancel} onCancel={onCancel}
onSubmit={formik.handleSubmit} onSubmit={formik.handleSubmit}