render()

in src/components/application/launch/sections/wdl-script/index.js [150:223]

• 74 lines of code
• 6 McCabe index (conditional complexity)

  render() {
    const {
      disabled,
      inputs,
      script,
    } = this.props;
    const {
      errors,
      pending,
      valid,
    } = this.state;
    return (
      <Section
        complete={valid}
        icon="code"
        title="WDL"
        description="Select, upload or edit WDL script"
      >
        <div
          key="actions"
          className={styles.actionsContainer}
        >
          <div className={styles.actions}>
            <WorkflowLibrary
              onSelect={(s, i) => this.onChangeWdlSources({inputs: i, script: s})}
              disabled={disabled || pending}
            />
            <Or />
            <UploadWDLButton
              disabled={disabled || pending}
              onFetch={this.disableComponentUntilDone(
                fetchWorkflow,
                {
                  args: [inputs],
                  callback: this.fetchWorkflowScriptCallback,
                  message: 'Fetching workflow...',
                },
              )}
              onUpload={file => this.onChangeWdlSources({script: file})}
            />
            <Or />
            <b>edit it manually</b>
            :
          </div>
          <ShowWDLGraphButton
            disabled={disabled || pending}
            wdl={script}
          />
        </div>
        <div
          key="code editor"
          className={styles.wdlEditorContainer}
        >
          <CodeEditor
            readOnly={disabled || pending}
            defaultCode={script || ''}
            language="wdl"
            onChange={this.onChangeWdlText}
            className={
              classNames(
                styles.wdlEditor,
                {
                  [styles.wdlEditorError]: !valid,
                },
              )}
          />
        </div>
        <WDLScriptErrors
          key="errors"
          errors={errors}
        />
      </Section>
    );
  }