render()

in public/pages/Destinations/containers/CreateDestination/ManageEmailGroups/ManageEmailGroups.js [271:331]
58 lines of code
6 McCabe index (conditional complexity)

  render() {
    const { isEmailAllowed, isVisible, onClickCancel, onClickSave } = this.props;
    const { initialValues, loadingEmailGroups } = this.state;
    return isVisible ? (
      <Formik
        initialValues={initialValues}
        onSubmit={(values, formikBag) => {
          this.processEmailGroups(values).then(() => onClickSave());
        }}
        validateOnChange={false}
      >
        {({ values, handleSubmit, isSubmitting }) => (
          <EuiOverlayMask>
            <EuiModal
              className="modal-manage-email"
              maxWidth={1000}
              onClose={ignoreEscape(onClickCancel)}
            >
              <EuiModalHeader>
                <EuiModalHeaderTitle>Manage email groups</EuiModalHeaderTitle>
              </EuiModalHeader>

              <EuiHorizontalRule margin="s" />

              <EuiModalBody>
                <FieldArray name="emailGroups" validateOnChange={true}>
                  {(arrayHelpers) =>
                    !isEmailAllowed || loadingEmailGroups ? (
                      <div style={{ display: 'flex', justifyContent: 'center' }}>
                        {isEmailAllowed ? 'Loading Email Groups...' : 'Email is disallowed'}
                      </div>
                    ) : (
                      this.renderEmailGroups({ values, arrayHelpers })
                    )
                  }
                </FieldArray>
              </EuiModalBody>

              {this.hasEmailGroupsToProcess(values) ? (
                <div>
                  <EuiHorizontalRule margin="s" />
                  <EuiModalFooter>
                    <EuiFlexGroup alignItems="center" justifyContent="flexEnd">
                      <EuiFlexItem grow={false}>
                        <EuiButtonEmpty onClick={onClickCancel}>Cancel</EuiButtonEmpty>
                      </EuiFlexItem>
                      <EuiFlexItem grow={false}>
                        <EuiButton onClick={handleSubmit} isLoading={isSubmitting} fill>
                          Save
                        </EuiButton>
                      </EuiFlexItem>
                    </EuiFlexGroup>
                  </EuiModalFooter>
                </div>
              ) : null}
            </EuiModal>
          </EuiOverlayMask>
        )}
      </Formik>
    ) : null;
  }