Merge pull request #8232 from mabashian/8219-extra-GET-requests

Fix extra GET requests on Notif Template/Container Groups forms

Reviewed-by: https://github.com/apps/softwarefactory-project-zuul
This commit is contained in:
softwarefactory-project-zuul[bot]
2020-09-25 13:37:43 +00:00
committed by GitHub
2 changed files with 28 additions and 13 deletions

View File

@@ -1,6 +1,6 @@
import React from 'react'; import React, { useCallback } from 'react';
import { func, shape } from 'prop-types'; import { func, shape } from 'prop-types';
import { Formik, useField } from 'formik'; import { Formik, useField, useFormikContext } from 'formik';
import { withI18n } from '@lingui/react'; import { withI18n } from '@lingui/react';
import { t } from '@lingui/macro'; import { t } from '@lingui/macro';
import { Form, FormGroup } from '@patternfly/react-core'; import { Form, FormGroup } from '@patternfly/react-core';
@@ -21,12 +21,20 @@ import {
import CredentialLookup from '../../../components/Lookup/CredentialLookup'; import CredentialLookup from '../../../components/Lookup/CredentialLookup';
import { VariablesField } from '../../../components/CodeMirrorInput'; import { VariablesField } from '../../../components/CodeMirrorInput';
function ContainerGroupFormFields({ i18n }) { function ContainerGroupFormFields({ i18n, instanceGroup }) {
const { setFieldValue } = useFormikContext();
const [credentialField, credentialMeta, credentialHelpers] = useField( const [credentialField, credentialMeta, credentialHelpers] = useField(
'credential' 'credential'
); );
const [overrideField] = useField('override'); const [overrideField] = useField('override');
const onCredentialChange = useCallback(
value => {
setFieldValue('credential', value);
},
[setFieldValue]
);
return ( return (
<> <>
<FormField <FormField
@@ -43,14 +51,13 @@ function ContainerGroupFormFields({ i18n }) {
helperTextInvalid={credentialMeta.error} helperTextInvalid={credentialMeta.error}
isValid={!credentialMeta.touched || !credentialMeta.error} isValid={!credentialMeta.touched || !credentialMeta.error}
onBlur={() => credentialHelpers.setTouched()} onBlur={() => credentialHelpers.setTouched()}
onChange={value => { onChange={onCredentialChange}
credentialHelpers.setValue(value);
}}
value={credentialField.value} value={credentialField.value}
required required
tooltip={i18n._( tooltip={i18n._(
t`Credential to authenticate with Kubernetes or OpenShift. Must be of type "Kubernetes/OpenShift API Bearer Token”.` t`Credential to authenticate with Kubernetes or OpenShift. Must be of type "Kubernetes/OpenShift API Bearer Token”.`
)} )}
autoPopulate={!instanceGroup?.id}
/> />
<FormGroup <FormGroup
@@ -114,7 +121,7 @@ function ContainerGroupForm({
{formik => ( {formik => (
<Form autoComplete="off" onSubmit={formik.handleSubmit}> <Form autoComplete="off" onSubmit={formik.handleSubmit}>
<FormColumnLayout> <FormColumnLayout>
<ContainerGroupFormFields {...rest} /> <ContainerGroupFormFields instanceGroup={instanceGroup} {...rest} />
{submitError && <FormSubmitError error={submitError} />} {submitError && <FormSubmitError error={submitError} />}
<FormActionGroup <FormActionGroup
onCancel={onCancel} onCancel={onCancel}

View File

@@ -1,6 +1,6 @@
import React from 'react'; import React, { useCallback } from 'react';
import { shape, func } from 'prop-types'; import { shape, func } from 'prop-types';
import { Formik, useField } from 'formik'; import { Formik, useField, useFormikContext } from 'formik';
import { withI18n } from '@lingui/react'; import { withI18n } from '@lingui/react';
import { t } from '@lingui/macro'; import { t } from '@lingui/macro';
import { Form, FormGroup } from '@patternfly/react-core'; import { Form, FormGroup } from '@patternfly/react-core';
@@ -16,13 +16,21 @@ import CustomMessagesSubForm from './CustomMessagesSubForm';
import hasCustomMessages from './hasCustomMessages'; import hasCustomMessages from './hasCustomMessages';
import typeFieldNames, { initialConfigValues } from './typeFieldNames'; import typeFieldNames, { initialConfigValues } from './typeFieldNames';
function NotificationTemplateFormFields({ i18n, defaultMessages }) { function NotificationTemplateFormFields({ i18n, defaultMessages, template }) {
const { setFieldValue } = useFormikContext();
const [orgField, orgMeta, orgHelpers] = useField('organization'); const [orgField, orgMeta, orgHelpers] = useField('organization');
const [typeField, typeMeta] = useField({ const [typeField, typeMeta] = useField({
name: 'notification_type', name: 'notification_type',
validate: required(i18n._(t`Select a value for this field`), i18n), validate: required(i18n._(t`Select a value for this field`), i18n),
}); });
const onOrganizationChange = useCallback(
value => {
setFieldValue('organization', value);
},
[setFieldValue]
);
return ( return (
<> <>
<FormField <FormField
@@ -43,13 +51,12 @@ function NotificationTemplateFormFields({ i18n, defaultMessages }) {
helperTextInvalid={orgMeta.error} helperTextInvalid={orgMeta.error}
isValid={!orgMeta.touched || !orgMeta.error} isValid={!orgMeta.touched || !orgMeta.error}
onBlur={() => orgHelpers.setTouched()} onBlur={() => orgHelpers.setTouched()}
onChange={value => { onChange={onOrganizationChange}
orgHelpers.setValue(value);
}}
value={orgField.value} value={orgField.value}
touched={orgMeta.touched} touched={orgMeta.touched}
error={orgMeta.error} error={orgMeta.error}
required required
autoPopulate={!template?.id}
/> />
<FormGroup <FormGroup
fieldId="notification-type" fieldId="notification-type"
@@ -179,6 +186,7 @@ function NotificationTemplateForm({
<NotificationTemplateFormFields <NotificationTemplateFormFields
i18n={i18n} i18n={i18n}
defaultMessages={defaultMessages} defaultMessages={defaultMessages}
template={template}
/> />
<FormSubmitError error={submitError} /> <FormSubmitError error={submitError} />
<FormActionGroup <FormActionGroup