From f7ad3d78ebdcc21f5277396a8f2d7f00d245f101 Mon Sep 17 00:00:00 2001 From: mabashian Date: Wed, 26 Feb 2020 18:21:04 -0500 Subject: [PATCH] Fixes issues with organization when saving the project form. Changes helperTextInvalid prop type to node which matches more closely with what the upstream PF component supports. --- .../src/components/Lookup/CredentialLookup.jsx | 4 ++-- .../components/Lookup/OrganizationLookup.jsx | 4 ++-- .../src/components/Lookup/ProjectLookup.jsx | 4 ++-- .../screens/Project/ProjectAdd/ProjectAdd.jsx | 5 ++++- .../Project/ProjectEdit/ProjectEdit.jsx | 5 ++++- .../Project/ProjectEdit/ProjectEdit.test.jsx | 4 ++++ .../src/screens/Project/shared/ProjectForm.jsx | 18 ++++++------------ .../Project/shared/ProjectForm.test.jsx | 4 ++++ 8 files changed, 28 insertions(+), 20 deletions(-) diff --git a/awx/ui_next/src/components/Lookup/CredentialLookup.jsx b/awx/ui_next/src/components/Lookup/CredentialLookup.jsx index 37f8a2e3bb..72a587135f 100644 --- a/awx/ui_next/src/components/Lookup/CredentialLookup.jsx +++ b/awx/ui_next/src/components/Lookup/CredentialLookup.jsx @@ -1,5 +1,5 @@ import React, { useEffect, useState } from 'react'; -import { bool, func, number, string, oneOfType } from 'prop-types'; +import { bool, func, node, number, string, oneOfType } from 'prop-types'; import { withRouter } from 'react-router-dom'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; @@ -113,7 +113,7 @@ function CredentialLookup({ CredentialLookup.propTypes = { credentialTypeId: oneOfType([number, string]).isRequired, - helperTextInvalid: string, + helperTextInvalid: node, isValid: bool, label: string.isRequired, onBlur: func, diff --git a/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx b/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx index 51d3787ef0..7d208fb588 100644 --- a/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx +++ b/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx @@ -1,5 +1,5 @@ import React, { useState, useEffect } from 'react'; -import { string, func, bool } from 'prop-types'; +import { node, func, bool } from 'prop-types'; import { withRouter } from 'react-router-dom'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; @@ -103,7 +103,7 @@ function OrganizationLookup({ } OrganizationLookup.propTypes = { - helperTextInvalid: string, + helperTextInvalid: node, isValid: bool, onBlur: func, onChange: func.isRequired, diff --git a/awx/ui_next/src/components/Lookup/ProjectLookup.jsx b/awx/ui_next/src/components/Lookup/ProjectLookup.jsx index e586488dd5..1a16337e0f 100644 --- a/awx/ui_next/src/components/Lookup/ProjectLookup.jsx +++ b/awx/ui_next/src/components/Lookup/ProjectLookup.jsx @@ -1,5 +1,5 @@ import React, { useState, useEffect } from 'react'; -import { string, func, bool } from 'prop-types'; +import { node, string, func, bool } from 'prop-types'; import { withRouter } from 'react-router-dom'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; @@ -125,7 +125,7 @@ function ProjectLookup({ ProjectLookup.propTypes = { value: Project, - helperTextInvalid: string, + helperTextInvalid: node, isValid: bool, onBlur: func, onChange: func.isRequired, diff --git a/awx/ui_next/src/screens/Project/ProjectAdd/ProjectAdd.jsx b/awx/ui_next/src/screens/Project/ProjectAdd/ProjectAdd.jsx index f8a1950490..cb55541240 100644 --- a/awx/ui_next/src/screens/Project/ProjectAdd/ProjectAdd.jsx +++ b/awx/ui_next/src/screens/Project/ProjectAdd/ProjectAdd.jsx @@ -24,7 +24,10 @@ function ProjectAdd() { try { const { data: { id }, - } = await ProjectsAPI.create(values); + } = await ProjectsAPI.create({ + ...values, + organization: values.organization.id, + }); history.push(`/projects/${id}/details`); } catch (error) { setFormSubmitError(error); diff --git a/awx/ui_next/src/screens/Project/ProjectEdit/ProjectEdit.jsx b/awx/ui_next/src/screens/Project/ProjectEdit/ProjectEdit.jsx index 94fcaf3edc..8669af4ede 100644 --- a/awx/ui_next/src/screens/Project/ProjectEdit/ProjectEdit.jsx +++ b/awx/ui_next/src/screens/Project/ProjectEdit/ProjectEdit.jsx @@ -23,7 +23,10 @@ function ProjectEdit({ project }) { try { const { data: { id }, - } = await ProjectsAPI.update(project.id, values); + } = await ProjectsAPI.update(project.id, { + ...values, + organization: values.organization.id, + }); history.push(`/projects/${id}/details`); } catch (error) { setFormSubmitError(error); diff --git a/awx/ui_next/src/screens/Project/ProjectEdit/ProjectEdit.test.jsx b/awx/ui_next/src/screens/Project/ProjectEdit/ProjectEdit.test.jsx index 9b7dad04e4..6ab0602b53 100644 --- a/awx/ui_next/src/screens/Project/ProjectEdit/ProjectEdit.test.jsx +++ b/awx/ui_next/src/screens/Project/ProjectEdit/ProjectEdit.test.jsx @@ -29,6 +29,10 @@ describe('', () => { credential_type_id: 5, kind: 'insights', }, + organization: { + id: 2, + name: 'Default', + }, }, }; diff --git a/awx/ui_next/src/screens/Project/shared/ProjectForm.jsx b/awx/ui_next/src/screens/Project/shared/ProjectForm.jsx index cb08ef27fb..3b94773a4b 100644 --- a/awx/ui_next/src/screens/Project/shared/ProjectForm.jsx +++ b/awx/ui_next/src/screens/Project/shared/ProjectForm.jsx @@ -74,8 +74,6 @@ function ProjectFormFields({ scmTypeOptions, setScmSubFormState, scmSubFormState, - setOrganization, - organization, }) { const scmFormFields = { scm_url: '', @@ -94,12 +92,10 @@ function ProjectFormFields({ validate: required(i18n._(t`Set a value for this field`), i18n), }); const [venvField] = useField('custom_virtualenv'); - const orgFieldArr = useField({ + const [organizationField, organizationMeta, organizationHelpers] = useField({ name: 'organization', validate: required(i18n._(t`Select a value for this field`), i18n), }); - const organizationMeta = orgFieldArr[1]; - const organizationHelpers = orgFieldArr[2]; /* Save current scm subform field values to state */ const saveSubFormState = form => { @@ -164,10 +160,11 @@ function ProjectFormFields({ isValid={!organizationMeta.touched || !organizationMeta.error} onBlur={() => organizationHelpers.setTouched()} onChange={value => { - organizationHelpers.setValue(value.id); - setOrganization(value); + organizationHelpers.setValue(value); }} - value={organization} + value={organizationField.value} + touched={organizationMeta.touched} + error={organizationMeta.error} required /> ', () => { kind: 'scm', name: 'Foo', }, + organization: { + id: 2, + name: 'Default', + }, }, };