Repository: apache/superset
File: superset-frontend/src/components/Datasource/DatasourceEditor.jsx (JavaScript)

Code before:
                        'If changes are made to your SQL query, ' +
                        'columns in your dataset will be synced when saving the dataset.',
                    )}
                    control={
                      this.props.isQueryRunning ? (
                        <>
                          {this.renderSqlEditotOverlay()}
                          <TextAreaControl
                            language="sql"
                            offerEditInModal={false}
                            minLines={10}
                            maxLines={Infinity}
                            readOnly={!this.state.isEditMode}
                            resize="both"
                          />
                        </>
                      ) : (
                        <TextAreaControl
                          language="sql"
                          offerEditInModal={false}
                          minLines={10}
                          maxLines={Infinity}
                          readOnly={!this.state.isEditMode}
                          resize="both"
                        />
                      )
                    }
                    additionalControl={
                      <div
                        css={{
                          position: 'absolute',
                          right: 0,
                          top: 0,
                          zIndex: 2,
                        }}
                      >
                        <Button
                          disabled={this.props.isQueryRunning}
                          tooltip={t('Open SQL Lab in a new tab')}
                          css={floatingButtonCss}
                          size="small"
                        >
                          <Icons.ExportOutlined
                            iconSize="s"
                            css={theme => ({
                              color: theme.colors.primary.dark1,
                            })}
                            onClick={() => {
                              this.openOnSqlLab();
                            }}
                          />

Review comment (suggestion):
The condition only affects `this.renderSqlEditorOverlay()` Can't this be shortened then to something like this:

```suggestion
                        <>
                          {this.props.isQueryRunning && this.renderSqlEditotOverlay()}
                          <TextAreaControl
                            language="sql"
                            offerEditInModal={false}
                            minLines={10}
                            maxLines={Infinity}
                            readOnly={!this.state.isEditMode}
                            resize="both"
                          />
                        </>
```

Code after:
                              this.state.isEditMode &&
                              this.onDatasourcePropChange('database', database)
                            }
                            formMode={false}
                            handleError={this.props.addDangerToast}
                            readOnly={!this.state.isEditMode}
                          />
                        </div>
                      }
                    />
                    <div css={{ width: 'calc(100% - 34px)', marginTop: -16 }}>
                      <Field
                        fieldKey="table_name"
                        label={t('Name')}
                        control={
                          <TextControl
                            controlId="table_name"
                            onChange={table => {
                              this.onDatasourcePropChange('table_name', table);
                            }}
                            placeholder={t('Dataset name')}
                            disabled={!this.state.isEditMode}
                          />
                        }
                      />
                    </div>
                  </Col>
                  <Field
                    fieldKey="sql"
                    label={t('SQL')}
                    description={t(
                      'When specifying SQL, the datasource acts as a view. ' +
                        'Superset will use this statement as a subquery while grouping and filtering ' +
                        'on the generated parent queries.' +
                        'If changes are made to your SQL query, ' +
                        'columns in your dataset will be synced when saving the dataset.',
                    )}
                    control={
                      this.props.database?.isLoading ? (
                        <>
                          {this.renderSqlEditorOverlay()}
                          <TextAreaControl
                            language="sql"
                            offerEditInModal={false}
                            minLines={10}
                            maxLines={Infinity}
                            readOnly={!this.state.isEditMode}
                            resize="both"
                          />
                        </>
                      ) : (