Repository: apache/superset
File: superset-frontend/src/features/databases/DatabaseModal/ExtraOptions.tsx (TypeScript)

Code before:
                    name="impersonate_user"
                    indeterminate={false}
                    checked={!!db?.impersonate_user}
                    onChange={onInputChange}
                  >
                    {t(
                      'Impersonate logged in user (Presto, Trino, Drill, Hive, and Google Sheets)',
                    )}
                  </Checkbox>
                  <InfoTooltip
                    tooltip={t(
                      'If Presto or Trino, all the queries in SQL Lab are going to be executed as the ' +
                        'currently logged on user who must have permission to run them. If Hive ' +
                        'and hive.server2.enable.doAs is enabled, will run the queries as ' +
                        'service account, but impersonate the currently logged on user via ' +
                        'hive.server2.proxy.user property.',
                    )}
                  />
                </div>
              </StyledInputContainer>
              {isFileUploadSupportedByEngine && (
                <StyledInputContainer
                  css={!db?.allow_file_upload ? no_margin_bottom : {}}
                >
                  <div className="input-container">
                    <Checkbox
                      id="allow_file_upload"
                      name="allow_file_upload"
                      indeterminate={false}
                      checked={!!db?.allow_file_upload}
                      onChange={onInputChange}
                    >
                      {t('Allow file uploads to database')}
                    </Checkbox>
                  </div>
                </StyledInputContainer>
              )}
              {isFileUploadSupportedByEngine && !!db?.allow_file_upload && (
                <StyledInputContainer css={no_margin_bottom}>
                  <div className="control-label">
                    {t('Schemas allowed for File upload')}
                  </div>
                  <div className="input-container">
                    <Input
                      type="text"
                      name="schemas_allowed_for_file_upload"
                      value={schemasText}
                      placeholder="schema1,schema2"
                      onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
                        setSchemasText(e.target.value)
                      }

Review comment (suggestion):
A type assertion here would be simpler than adding a seperate type definition above on the function definition

```suggestion
                      onBlur={() =>
                        onExtraInputChange({
                          target: {
                            type: 'text',
                            name: 'schemas_allowed_for_file_upload',
                            value: schemasText,
                          },
                        } as ChangeEvent<HTMLInputElement>)
                      }
```

Code after:
                      {t('Allow file uploads to database')}
                    </Checkbox>
                  </div>
                </StyledInputContainer>
              )}
              {isFileUploadSupportedByEngine && !!db?.allow_file_upload && (
                <StyledInputContainer css={no_margin_bottom}>
                  <div className="control-label">
                    {t('Schemas allowed for File upload')}
                  </div>
                  <div className="input-container">
                    <Input
                      type="text"
                      name="schemas_allowed_for_file_upload"
                      value={schemasText}
                      placeholder="schema1,schema2"
                      onChange={e => setSchemasText(e.target.value)}
                      onBlur={() =>
                        onExtraInputChange({
                          target: {
                            type: 'text',
                            name: 'schemas_allowed_for_file_upload',
                            value: schemasText,
                          },
                        } as ChangeEvent<HTMLInputElement>)
                      }
                    />
                  </div>
                  <div className="helper">
                    {t(
                      'A comma-separated list of schemas that files are allowed to upload to.',
                    )}
                  </div>
                </StyledInputContainer>
              )}
              <StyledInputContainer>
                <div className="control-label">{t('Secure extra')}</div>
                <div className="input-container">
                  <StyledJsonEditor
                    name="masked_encrypted_extra"
                    value={db?.masked_encrypted_extra || ''}
                    placeholder={t('Secure extra')}
                    onChange={(json: string) =>
                      onEditorChange({ json, name: 'masked_encrypted_extra' })
                    }
                    width="100%"
                    height="160px"
                    annotations={secureExtraAnnotations}
                  />
                </div>
                <div className="helper">