From 9596e458c642f2ee3e754df822a80c84cb16808f Mon Sep 17 00:00:00 2001 From: Ross Mabbett <92495987+rtexelm@users.noreply.github.com> Date: Tue, 3 Sep 2024 04:13:37 -0400 Subject: [PATCH] refactor(databases): Create constants.ts, move interface to types.ts (#30027) --- .../DatabaseConnectionForm/constants.ts | 89 +++++++++++++ .../DatabaseConnectionForm/index.tsx | 120 ++---------------- .../src/features/databases/types.ts | 29 +++++ 3 files changed, 130 insertions(+), 108 deletions(-) create mode 100644 superset-frontend/src/features/databases/DatabaseModal/DatabaseConnectionForm/constants.ts diff --git a/superset-frontend/src/features/databases/DatabaseModal/DatabaseConnectionForm/constants.ts b/superset-frontend/src/features/databases/DatabaseModal/DatabaseConnectionForm/constants.ts new file mode 100644 index 0000000000000..3ba0f3689eb0b --- /dev/null +++ b/superset-frontend/src/features/databases/DatabaseModal/DatabaseConnectionForm/constants.ts @@ -0,0 +1,89 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ +import { getExtensionsRegistry } from '@superset-ui/core'; +import { + accessTokenField, + databaseField, + defaultCatalogField, + defaultSchemaField, + displayField, + forceSSLField, + hostField, + httpPath, + httpPathField, + passwordField, + portField, + queryField, + usernameField, +} from './CommonParameters'; +import { validatedInputField } from './ValidatedInputField'; +import { EncryptedField } from './EncryptedField'; +import { TableCatalog } from './TableCatalog'; +import SSHTunnelSwitch from '../SSHTunnelSwitch'; + +export const FormFieldOrder = [ + 'host', + 'port', + 'database', + 'default_catalog', + 'default_schema', + 'username', + 'password', + 'access_token', + 'http_path', + 'http_path_field', + 'database_name', + 'credentials_info', + 'service_account_info', + 'catalog', + 'query', + 'encryption', + 'account', + 'warehouse', + 'role', + 'ssh', +]; + +const extensionsRegistry = getExtensionsRegistry(); + +const SSHTunnelSwitchComponent = + extensionsRegistry.get('ssh_tunnel.form.switch') ?? SSHTunnelSwitch; + +export const FORM_FIELD_MAP = { + host: hostField, + http_path: httpPath, + http_path_field: httpPathField, + port: portField, + database: databaseField, + default_catalog: defaultCatalogField, + default_schema: defaultSchemaField, + username: usernameField, + password: passwordField, + access_token: accessTokenField, + database_name: displayField, + query: queryField, + encryption: forceSSLField, + credentials_info: EncryptedField, + service_account_info: EncryptedField, + catalog: TableCatalog, + warehouse: validatedInputField, + role: validatedInputField, + account: validatedInputField, + ssh: SSHTunnelSwitchComponent, +}; diff --git a/superset-frontend/src/features/databases/DatabaseModal/DatabaseConnectionForm/index.tsx b/superset-frontend/src/features/databases/DatabaseModal/DatabaseConnectionForm/index.tsx index 545403a361073..9cec0b827db67 100644 --- a/superset-frontend/src/features/databases/DatabaseModal/DatabaseConnectionForm/index.tsx +++ b/superset-frontend/src/features/databases/DatabaseModal/DatabaseConnectionForm/index.tsx @@ -16,115 +16,11 @@ * specific language governing permissions and limitations * under the License. */ -import { FormEvent } from 'react'; -import { - SupersetTheme, - JsonObject, - getExtensionsRegistry, -} from '@superset-ui/core'; -import { InputProps } from 'antd/lib/input'; +import { SupersetTheme } from '@superset-ui/core'; import { Form } from 'src/components/Form'; -import { - accessTokenField, - databaseField, - defaultCatalogField, - defaultSchemaField, - displayField, - forceSSLField, - hostField, - httpPath, - httpPathField, - passwordField, - portField, - queryField, - usernameField, -} from './CommonParameters'; -import { validatedInputField } from './ValidatedInputField'; -import { EncryptedField } from './EncryptedField'; -import { TableCatalog } from './TableCatalog'; +import { FormFieldOrder, FORM_FIELD_MAP } from './constants'; import { formScrollableStyles, validatedFormStyles } from '../styles'; -import { DatabaseForm, DatabaseObject } from '../../types'; -import SSHTunnelSwitch from '../SSHTunnelSwitch'; - -export const FormFieldOrder = [ - 'host', - 'port', - 'database', - 'default_catalog', - 'default_schema', - 'username', - 'password', - 'access_token', - 'http_path', - 'http_path_field', - 'database_name', - 'credentials_info', - 'service_account_info', - 'catalog', - 'query', - 'encryption', - 'account', - 'warehouse', - 'role', - 'ssh', -]; - -const extensionsRegistry = getExtensionsRegistry(); - -const SSHTunnelSwitchComponent = - extensionsRegistry.get('ssh_tunnel.form.switch') ?? SSHTunnelSwitch; - -const FORM_FIELD_MAP = { - host: hostField, - http_path: httpPath, - http_path_field: httpPathField, - port: portField, - database: databaseField, - default_catalog: defaultCatalogField, - default_schema: defaultSchemaField, - username: usernameField, - password: passwordField, - access_token: accessTokenField, - database_name: displayField, - query: queryField, - encryption: forceSSLField, - credentials_info: EncryptedField, - service_account_info: EncryptedField, - catalog: TableCatalog, - warehouse: validatedInputField, - role: validatedInputField, - account: validatedInputField, - ssh: SSHTunnelSwitchComponent, -}; - -interface DatabaseConnectionFormProps { - isEditMode?: boolean; - sslForced: boolean; - editNewDb?: boolean; - dbModel: DatabaseForm; - db: Partial | null; - onParametersChange: ( - event: FormEvent | { target: HTMLInputElement }, - ) => void; - onChange: ( - event: FormEvent | { target: HTMLInputElement }, - ) => void; - onQueryChange: ( - event: FormEvent | { target: HTMLInputElement }, - ) => void; - onParametersUploadFileChange?: ( - event: FormEvent | { target: HTMLInputElement }, - ) => void; - onExtraInputChange: ( - event: FormEvent | { target: HTMLInputElement }, - ) => void; - onAddTableCatalog: () => void; - onRemoveTableCatalog: (idx: number) => void; - validationErrors: JsonObject | null; - getValidation: () => void; - clearValidationErrors: () => void; - getPlaceholder?: (field: string) => string | undefined; -} +import { DatabaseConnectionFormProps } from '../../types'; const DatabaseConnectionForm = ({ dbModel, @@ -144,7 +40,15 @@ const DatabaseConnectionForm = ({ validationErrors, clearValidationErrors, }: DatabaseConnectionFormProps) => { - const parameters = dbModel?.parameters; + const parameters = dbModel?.parameters as { + properties: { + [key: string]: { + default?: any; + description?: string; + }; + }; + required?: string[]; + }; return (
diff --git a/superset-frontend/src/features/databases/types.ts b/superset-frontend/src/features/databases/types.ts index c46296a2a4079..b170c7d6c94eb 100644 --- a/superset-frontend/src/features/databases/types.ts +++ b/superset-frontend/src/features/databases/types.ts @@ -330,3 +330,32 @@ export type SwitchProps = { changeMethods: SwitchPropsChangeMethodsType; clearValidationErrors: () => void; }; + +export interface DatabaseConnectionFormProps { + isEditMode?: boolean; + sslForced: boolean; + editNewDb?: boolean; + dbModel: DatabaseForm; + db: Partial | null; + onParametersChange: ( + event: FormEvent | { target: HTMLInputElement }, + ) => void; + onChange: ( + event: FormEvent | { target: HTMLInputElement }, + ) => void; + onQueryChange: ( + event: FormEvent | { target: HTMLInputElement }, + ) => void; + onParametersUploadFileChange?: ( + event: FormEvent | { target: HTMLInputElement }, + ) => void; + onExtraInputChange: ( + event: FormEvent | { target: HTMLInputElement }, + ) => void; + onAddTableCatalog: () => void; + onRemoveTableCatalog: (idx: number) => void; + validationErrors: JsonObject | null; + getValidation: () => void; + clearValidationErrors: () => void; + getPlaceholder?: (field: string) => string | undefined; +}