refactor(databases): Create constants.ts, move interface to types.ts (#…

…30027)
apache · Sep 3, 2024 · 9596e45 · 9596e45
1 parent 548d543
commit 9596e45
Show file tree

Hide file tree

Showing 3 changed files with 130 additions and 108 deletions.
diff --git a/superset-frontend/src/features/databases/DatabaseModal/DatabaseConnectionForm/constants.ts 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
@@ -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<DatabaseObject> | null;
-  onParametersChange: (
-    event: FormEvent<InputProps> | { target: HTMLInputElement },
-  ) => void;
-  onChange: (
-    event: FormEvent<InputProps> | { target: HTMLInputElement },
-  ) => void;
-  onQueryChange: (
-    event: FormEvent<InputProps> | { target: HTMLInputElement },
-  ) => void;
-  onParametersUploadFileChange?: (
-    event: FormEvent<InputProps> | { target: HTMLInputElement },
-  ) => void;
-  onExtraInputChange: (
-    event: FormEvent<InputProps> | { 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 (
     <Form>

diff --git 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<DatabaseObject> | null;
+  onParametersChange: (
+    event: FormEvent<InputProps> | { target: HTMLInputElement },
+  ) => void;
+  onChange: (
+    event: FormEvent<InputProps> | { target: HTMLInputElement },
+  ) => void;
+  onQueryChange: (
+    event: FormEvent<InputProps> | { target: HTMLInputElement },
+  ) => void;
+  onParametersUploadFileChange?: (
+    event: FormEvent<InputProps> | { target: HTMLInputElement },
+  ) => void;
+  onExtraInputChange: (
+    event: FormEvent<InputProps> | { target: HTMLInputElement },
+  ) => void;
+  onAddTableCatalog: () => void;
+  onRemoveTableCatalog: (idx: number) => void;
+  validationErrors: JsonObject | null;
+  getValidation: () => void;
+  clearValidationErrors: () => void;
+  getPlaceholder?: (field: string) => string | undefined;
+}