From 7b41e078e34e2a5328f409c225344a10e6c897d9 Mon Sep 17 00:00:00 2001 From: Kirill Chernikov <72095428+Zabilsya@users.noreply.github.com> Date: Wed, 11 Dec 2024 13:51:13 +0600 Subject: [PATCH] [DOP-22196] add clickhouse, mssql, mysql connection types (#50) * [DOP-22196] add clickhouse, mssql, mysql connection types * [DOP-22196] fix after review --------- Co-authored-by: Zabilsya --- src/entities/connection/api/types.ts | 52 ++++++++++++++++++- src/entities/connection/constants.ts | 28 ++++++++-- .../components/ConnectionClickhouse/index.tsx | 29 +++++++++++ .../components/ConnectionMsSql/index.tsx | 29 +++++++++++ .../components/ConnectionMySql/index.tsx | 29 +++++++++++ .../ui/ConnectionTypeForm/components/index.ts | 3 ++ .../ui/ConnectionTypeForm/constants.tsx | 14 ++++- .../utils/adaptConnectionClickhouse/index.ts | 20 +++++++ .../utils/adaptConnectionClickhouse/types.ts | 4 ++ .../utils/adaptConnectionMsSql/index.ts | 20 +++++++ .../utils/adaptConnectionMsSql/types.ts | 3 ++ .../utils/adaptConnectionMySql/index.ts | 20 +++++++ .../utils/adaptConnectionMySql/types.ts | 3 ++ src/entities/connection/utils/index.ts | 3 ++ src/entities/transfer/api/types.ts | 21 ++++++++ .../connection/ConnectionDetailInfo/index.tsx | 3 +- .../utils/getConnectionAuthData/index.ts | 3 ++ .../utils/getConnectionData/index.ts | 3 ++ .../connection/ConnectionList/constants.tsx | 6 +-- .../getUpdateConnectionInitialValues/index.ts | 27 ++++++++++ .../utils/adaptConnectionTypeRequest/index.ts | 9 ++++ .../components/SourceParams/constants.tsx | 6 +++ .../components/TargetParams/constants.tsx | 6 +++ .../TransferConnectionClickhouse/index.tsx | 12 +++++ .../TransferConnectionClickhouse/types.ts | 3 ++ .../TransferConnectionMsSql/index.tsx | 12 +++++ .../TransferConnectionMsSql/types.ts | 3 ++ .../TransferConnectionMySql/index.tsx | 12 +++++ .../TransferConnectionMySql/types.ts | 3 ++ .../components/TransferParams/index.tsx | 3 +- .../utils/getDescriptionItems/index.tsx | 3 ++ src/shared/types/connection.ts | 5 +- 32 files changed, 385 insertions(+), 12 deletions(-) create mode 100644 src/entities/connection/ui/ConnectionTypeForm/components/ConnectionClickhouse/index.tsx create mode 100644 src/entities/connection/ui/ConnectionTypeForm/components/ConnectionMsSql/index.tsx create mode 100644 src/entities/connection/ui/ConnectionTypeForm/components/ConnectionMySql/index.tsx create mode 100644 src/entities/connection/utils/adaptConnectionClickhouse/index.ts create mode 100644 src/entities/connection/utils/adaptConnectionClickhouse/types.ts create mode 100644 src/entities/connection/utils/adaptConnectionMsSql/index.ts create mode 100644 src/entities/connection/utils/adaptConnectionMsSql/types.ts create mode 100644 src/entities/connection/utils/adaptConnectionMySql/index.ts create mode 100644 src/entities/connection/utils/adaptConnectionMySql/types.ts create mode 100644 src/features/transfer/MutateTransferForm/components/TransferConnectionClickhouse/index.tsx create mode 100644 src/features/transfer/MutateTransferForm/components/TransferConnectionClickhouse/types.ts create mode 100644 src/features/transfer/MutateTransferForm/components/TransferConnectionMsSql/index.tsx create mode 100644 src/features/transfer/MutateTransferForm/components/TransferConnectionMsSql/types.ts create mode 100644 src/features/transfer/MutateTransferForm/components/TransferConnectionMySql/index.tsx create mode 100644 src/features/transfer/MutateTransferForm/components/TransferConnectionMySql/types.ts diff --git a/src/entities/connection/api/types.ts b/src/entities/connection/api/types.ts index 1533949..d6943f3 100644 --- a/src/entities/connection/api/types.ts +++ b/src/entities/connection/api/types.ts @@ -7,7 +7,15 @@ export type Connection = { description: string; } & ConnectionData; -export type ConnectionData = ConnectionHive | ConnectionHdfs | ConnectionOracle | ConnectionPostgres | ConnectionS3; +export type ConnectionData = + | ConnectionHive + | ConnectionHdfs + | ConnectionOracle + | ConnectionPostgres + | ConnectionClickhouse + | ConnectionMySql + | ConnectionMsSql + | ConnectionS3; export type ConnectionBucketStyle = 'domain' | 'path'; @@ -66,6 +74,48 @@ export interface ConnectionPostgres { }; } +export interface ConnectionClickhouse { + auth_data: { + type: ConnectionType.CLICKHOUSE; + user: string; + password?: string; + }; + connection_data: { + type: ConnectionType.CLICKHOUSE; + host: string; + port: number; + database_name: string; + }; +} + +export interface ConnectionMySql { + auth_data: { + type: ConnectionType.MY_SQL; + user: string; + password?: string; + }; + connection_data: { + type: ConnectionType.MY_SQL; + host: string; + port: number; + database_name: string; + }; +} + +export interface ConnectionMsSql { + auth_data: { + type: ConnectionType.MS_SQL; + user: string; + password?: string; + }; + connection_data: { + type: ConnectionType.MS_SQL; + host: string; + port: number; + database_name: string; + }; +} + export interface ConnectionS3 { auth_data: { type: ConnectionType.S3; diff --git a/src/entities/connection/constants.ts b/src/entities/connection/constants.ts index d25edff..9739107 100644 --- a/src/entities/connection/constants.ts +++ b/src/entities/connection/constants.ts @@ -3,10 +3,30 @@ import { prepareOptionsForSelect } from '@shared/ui'; import { ConnectionBucketStyle, ConnectionProtocol } from './api'; -export const CONNECTION_TYPE_SELECT_OPTIONS = prepareOptionsForSelect({ - data: Object.values(ConnectionType), - renderLabel: (data) => data, - renderValue: (data) => data, +export const CONNECTION_TYPE_NAMES: Record = { + [ConnectionType.CLICKHOUSE]: 'ClickHouse', + [ConnectionType.HDFS]: 'HDFS', + [ConnectionType.HIVE]: 'Hive', + [ConnectionType.MS_SQL]: 'MSSQL', + [ConnectionType.MY_SQL]: 'MySQL', + [ConnectionType.ORACLE]: 'Oracle', + [ConnectionType.POSTGRES]: 'Postgres', + [ConnectionType.S3]: 'S3', +}; + +export const CONNECTION_TYPE_SELECT_OPTIONS = prepareOptionsForSelect({ + data: [ + { value: ConnectionType.CLICKHOUSE, label: CONNECTION_TYPE_NAMES[ConnectionType.CLICKHOUSE] }, + { value: ConnectionType.HDFS, label: CONNECTION_TYPE_NAMES[ConnectionType.HDFS] }, + { value: ConnectionType.HIVE, label: CONNECTION_TYPE_NAMES[ConnectionType.HIVE] }, + { value: ConnectionType.MS_SQL, label: CONNECTION_TYPE_NAMES[ConnectionType.MS_SQL] }, + { value: ConnectionType.MY_SQL, label: CONNECTION_TYPE_NAMES[ConnectionType.MY_SQL] }, + { value: ConnectionType.ORACLE, label: CONNECTION_TYPE_NAMES[ConnectionType.ORACLE] }, + { value: ConnectionType.POSTGRES, label: CONNECTION_TYPE_NAMES[ConnectionType.POSTGRES] }, + { value: ConnectionType.S3, label: CONNECTION_TYPE_NAMES[ConnectionType.S3] }, + ], + renderLabel: (data) => data.label, + renderValue: (data) => data.value, }); export const CONNECTION_BUCKET_STYLE_SELECT_OPTIONS = prepareOptionsForSelect({ diff --git a/src/entities/connection/ui/ConnectionTypeForm/components/ConnectionClickhouse/index.tsx b/src/entities/connection/ui/ConnectionTypeForm/components/ConnectionClickhouse/index.tsx new file mode 100644 index 0000000..a76c367 --- /dev/null +++ b/src/entities/connection/ui/ConnectionTypeForm/components/ConnectionClickhouse/index.tsx @@ -0,0 +1,29 @@ +import React from 'react'; +import { Form, Input, InputNumber } from 'antd'; + +import { useSensitiveFields } from '../../hooks'; +import { MAX_ALLOWED_PORT, MIN_ALLOWED_PORT } from '../../constants'; + +export const ConnectionClickhouse = () => { + const { isRequired } = useSensitiveFields(); + + return ( + <> + + + + + + + + + + + + + + + + + ); +}; diff --git a/src/entities/connection/ui/ConnectionTypeForm/components/ConnectionMsSql/index.tsx b/src/entities/connection/ui/ConnectionTypeForm/components/ConnectionMsSql/index.tsx new file mode 100644 index 0000000..0eada6e --- /dev/null +++ b/src/entities/connection/ui/ConnectionTypeForm/components/ConnectionMsSql/index.tsx @@ -0,0 +1,29 @@ +import React from 'react'; +import { Form, Input, InputNumber } from 'antd'; + +import { useSensitiveFields } from '../../hooks'; +import { MAX_ALLOWED_PORT, MIN_ALLOWED_PORT } from '../../constants'; + +export const ConnectionMsSql = () => { + const { isRequired } = useSensitiveFields(); + + return ( + <> + + + + + + + + + + + + + + + + + ); +}; diff --git a/src/entities/connection/ui/ConnectionTypeForm/components/ConnectionMySql/index.tsx b/src/entities/connection/ui/ConnectionTypeForm/components/ConnectionMySql/index.tsx new file mode 100644 index 0000000..9ced6db --- /dev/null +++ b/src/entities/connection/ui/ConnectionTypeForm/components/ConnectionMySql/index.tsx @@ -0,0 +1,29 @@ +import React from 'react'; +import { Form, Input, InputNumber } from 'antd'; + +import { useSensitiveFields } from '../../hooks'; +import { MAX_ALLOWED_PORT, MIN_ALLOWED_PORT } from '../../constants'; + +export const ConnectionMySql = () => { + const { isRequired } = useSensitiveFields(); + + return ( + <> + + + + + + + + + + + + + + + + + ); +}; diff --git a/src/entities/connection/ui/ConnectionTypeForm/components/index.ts b/src/entities/connection/ui/ConnectionTypeForm/components/index.ts index 22c76bd..3b13a3a 100644 --- a/src/entities/connection/ui/ConnectionTypeForm/components/index.ts +++ b/src/entities/connection/ui/ConnectionTypeForm/components/index.ts @@ -3,3 +3,6 @@ export * from './ConnectionHive'; export * from './ConnectionOracle'; export * from './ConnectionPostgres'; export * from './ConnectionS3'; +export * from './ConnectionClickhouse'; +export * from './ConnectionMySql'; +export * from './ConnectionMsSql'; diff --git a/src/entities/connection/ui/ConnectionTypeForm/constants.tsx b/src/entities/connection/ui/ConnectionTypeForm/constants.tsx index 32780b3..905b767 100644 --- a/src/entities/connection/ui/ConnectionTypeForm/constants.tsx +++ b/src/entities/connection/ui/ConnectionTypeForm/constants.tsx @@ -3,7 +3,16 @@ import { createContext } from 'react'; import { ConnectionType } from '@shared/types'; import { SensitiveFieldsContextProps } from './types'; -import { ConnectionHdfs, ConnectionHive, ConnectionOracle, ConnectionPostgres, ConnectionS3 } from './components'; +import { + ConnectionClickhouse, + ConnectionHdfs, + ConnectionHive, + ConnectionMsSql, + ConnectionMySql, + ConnectionOracle, + ConnectionPostgres, + ConnectionS3, +} from './components'; const SENSITIVE_FIELDS_CONTEXT_INITIAL_VALUE: SensitiveFieldsContextProps = { isRequired: true, @@ -21,5 +30,8 @@ export const CONNECTION_TYPE_COMPONENT = { [ConnectionType.HIVE]: , [ConnectionType.ORACLE]: , [ConnectionType.POSTGRES]: , + [ConnectionType.CLICKHOUSE]: , + [ConnectionType.MY_SQL]: , + [ConnectionType.MS_SQL]: , [ConnectionType.S3]: , }; diff --git a/src/entities/connection/utils/adaptConnectionClickhouse/index.ts b/src/entities/connection/utils/adaptConnectionClickhouse/index.ts new file mode 100644 index 0000000..da85f9f --- /dev/null +++ b/src/entities/connection/utils/adaptConnectionClickhouse/index.ts @@ -0,0 +1,20 @@ +import { ConnectionClickhouse } from '../../api'; + +import { AdaptConnectionClickhouseProps } from './types'; + +/* Util for creating a ConnectionData object for "Clickhouse" connection by its fields */ +export const adaptConnectionClickhouse = (data: AdaptConnectionClickhouseProps): ConnectionClickhouse => { + return { + auth_data: { + type: data.type, + user: data.user, + password: data.password, + }, + connection_data: { + type: data.type, + database_name: data.database_name, + host: data.host, + port: data.port, + }, + }; +}; diff --git a/src/entities/connection/utils/adaptConnectionClickhouse/types.ts b/src/entities/connection/utils/adaptConnectionClickhouse/types.ts new file mode 100644 index 0000000..84bb1af --- /dev/null +++ b/src/entities/connection/utils/adaptConnectionClickhouse/types.ts @@ -0,0 +1,4 @@ +import { ConnectionClickhouse } from '../../api'; + +export type AdaptConnectionClickhouseProps = ConnectionClickhouse['auth_data'] & + ConnectionClickhouse['connection_data']; diff --git a/src/entities/connection/utils/adaptConnectionMsSql/index.ts b/src/entities/connection/utils/adaptConnectionMsSql/index.ts new file mode 100644 index 0000000..5d7fda2 --- /dev/null +++ b/src/entities/connection/utils/adaptConnectionMsSql/index.ts @@ -0,0 +1,20 @@ +import { ConnectionMsSql } from '../../api'; + +import { AdaptConnectionMsSqlProps } from './types'; + +/* Util for creating a ConnectionData object for "MsSQL" connection by its fields */ +export const adaptConnectionMsSql = (data: AdaptConnectionMsSqlProps): ConnectionMsSql => { + return { + auth_data: { + type: data.type, + user: data.user, + password: data.password, + }, + connection_data: { + type: data.type, + database_name: data.database_name, + host: data.host, + port: data.port, + }, + }; +}; diff --git a/src/entities/connection/utils/adaptConnectionMsSql/types.ts b/src/entities/connection/utils/adaptConnectionMsSql/types.ts new file mode 100644 index 0000000..cf7ca0d --- /dev/null +++ b/src/entities/connection/utils/adaptConnectionMsSql/types.ts @@ -0,0 +1,3 @@ +import { ConnectionMsSql } from '../../api'; + +export type AdaptConnectionMsSqlProps = ConnectionMsSql['auth_data'] & ConnectionMsSql['connection_data']; diff --git a/src/entities/connection/utils/adaptConnectionMySql/index.ts b/src/entities/connection/utils/adaptConnectionMySql/index.ts new file mode 100644 index 0000000..0d21bb8 --- /dev/null +++ b/src/entities/connection/utils/adaptConnectionMySql/index.ts @@ -0,0 +1,20 @@ +import { ConnectionMySql } from '../../api'; + +import { AdaptConnectionMySqlProps } from './types'; + +/* Util for creating a ConnectionData object for "MySQL" connection by its fields */ +export const adaptConnectionMySql = (data: AdaptConnectionMySqlProps): ConnectionMySql => { + return { + auth_data: { + type: data.type, + user: data.user, + password: data.password, + }, + connection_data: { + type: data.type, + database_name: data.database_name, + host: data.host, + port: data.port, + }, + }; +}; diff --git a/src/entities/connection/utils/adaptConnectionMySql/types.ts b/src/entities/connection/utils/adaptConnectionMySql/types.ts new file mode 100644 index 0000000..a629f96 --- /dev/null +++ b/src/entities/connection/utils/adaptConnectionMySql/types.ts @@ -0,0 +1,3 @@ +import { ConnectionMySql } from '../../api'; + +export type AdaptConnectionMySqlProps = ConnectionMySql['auth_data'] & ConnectionMySql['connection_data']; diff --git a/src/entities/connection/utils/index.ts b/src/entities/connection/utils/index.ts index 9d5ec57..7b32b23 100644 --- a/src/entities/connection/utils/index.ts +++ b/src/entities/connection/utils/index.ts @@ -3,3 +3,6 @@ export * from './adaptConnectionHive'; export * from './adaptConnectionOracle'; export * from './adaptConnectionPostgres'; export * from './adaptConnectionS3'; +export * from './adaptConnectionClickhouse'; +export * from './adaptConnectionMySql'; +export * from './adaptConnectionMsSql'; diff --git a/src/entities/transfer/api/types.ts b/src/entities/transfer/api/types.ts index b0cbfb7..b16f4cc 100644 --- a/src/entities/transfer/api/types.ts +++ b/src/entities/transfer/api/types.ts @@ -12,12 +12,18 @@ export interface Transfer { | TransferParamsHive | TransferParamsOracle | TransferParamsPostgres + | TransferParamsClickhouse + | TransferParamsMsSql + | TransferParamsMySql | TransferSourceParamsHdfs | TransferSourceParamsS3; target_params: | TransferParamsHive | TransferParamsOracle | TransferParamsPostgres + | TransferParamsClickhouse + | TransferParamsMsSql + | TransferParamsMySql | TransferTargetParamsHdfs | TransferTargetParamsS3; strategy_params: TransferStrategyParams; @@ -46,6 +52,21 @@ interface TransferParamsPostgres { table_name: string; } +interface TransferParamsMySql { + type: ConnectionType.MY_SQL; + table_name: string; +} + +interface TransferParamsMsSql { + type: ConnectionType.MS_SQL; + table_name: string; +} + +interface TransferParamsClickhouse { + type: ConnectionType.CLICKHOUSE; + table_name: string; +} + interface TransferParamsHdfs { type: ConnectionType.HDFS; directory_path: string; diff --git a/src/features/connection/ConnectionDetailInfo/index.tsx b/src/features/connection/ConnectionDetailInfo/index.tsx index 123e9f0..5251ed4 100644 --- a/src/features/connection/ConnectionDetailInfo/index.tsx +++ b/src/features/connection/ConnectionDetailInfo/index.tsx @@ -1,6 +1,7 @@ import React from 'react'; import { Descriptions } from 'antd'; import { Link } from 'react-router-dom'; +import { CONNECTION_TYPE_NAMES } from '@entities/connection'; import { ConnectionDetailInfoProps } from './types'; import { getConnectionAuthData, getConnectionData } from './utils'; @@ -21,7 +22,7 @@ export const ConnectionDetailInfo = ({ connection, group, ...props }: Connection {group.name} - {connection.connection_data.type} + {CONNECTION_TYPE_NAMES[connection.connection_data.type]} {getConnectionAuthData({ data: connection.auth_data }).map((item, index) => ( diff --git a/src/features/connection/ConnectionDetailInfo/utils/getConnectionAuthData/index.ts b/src/features/connection/ConnectionDetailInfo/utils/getConnectionAuthData/index.ts index b6a3dc4..d0d6c54 100644 --- a/src/features/connection/ConnectionDetailInfo/utils/getConnectionAuthData/index.ts +++ b/src/features/connection/ConnectionDetailInfo/utils/getConnectionAuthData/index.ts @@ -16,6 +16,9 @@ export const getConnectionAuthData = ({ data }: GetDescriptionItemsProps): Descr case ConnectionType.HDFS: case ConnectionType.ORACLE: case ConnectionType.POSTGRES: + case ConnectionType.CLICKHOUSE: + case ConnectionType.MY_SQL: + case ConnectionType.MS_SQL: return [ { label: 'User', diff --git a/src/features/connection/ConnectionDetailInfo/utils/getConnectionData/index.ts b/src/features/connection/ConnectionDetailInfo/utils/getConnectionData/index.ts index 726e063..d8ea15a 100644 --- a/src/features/connection/ConnectionDetailInfo/utils/getConnectionData/index.ts +++ b/src/features/connection/ConnectionDetailInfo/utils/getConnectionData/index.ts @@ -21,6 +21,9 @@ export const getConnectionData = ({ data }: GetDescriptionItemsProps): Descripti }, ]; case ConnectionType.POSTGRES: + case ConnectionType.CLICKHOUSE: + case ConnectionType.MY_SQL: + case ConnectionType.MS_SQL: return [ { label: 'Database name', diff --git a/src/features/connection/ConnectionList/constants.tsx b/src/features/connection/ConnectionList/constants.tsx index 0145d04..abee7f5 100644 --- a/src/features/connection/ConnectionList/constants.tsx +++ b/src/features/connection/ConnectionList/constants.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { PaginationResponse } from '@shared/types'; import { TableColumns } from '@shared/ui'; import { Link } from 'react-router-dom'; -import { Connection } from '@entities/connection'; +import { Connection, CONNECTION_TYPE_NAMES } from '@entities/connection'; export const CONNECTION_LIST_COLUMNS: TableColumns> = [ { @@ -19,8 +19,8 @@ export const CONNECTION_LIST_COLUMNS: TableColumns record.connection_data.type, - width: 100, + render: (data, record) => CONNECTION_TYPE_NAMES[record.connection_data.type], + width: 150, }, { title: 'Description', diff --git a/src/features/connection/UpdateConnection/utils/getUpdateConnectionInitialValues/index.ts b/src/features/connection/UpdateConnection/utils/getUpdateConnectionInitialValues/index.ts index e1e5eec..5617e57 100644 --- a/src/features/connection/UpdateConnection/utils/getUpdateConnectionInitialValues/index.ts +++ b/src/features/connection/UpdateConnection/utils/getUpdateConnectionInitialValues/index.ts @@ -47,6 +47,33 @@ export const getUpdateConnectionInitialValues = (connection: Connection): Update ...connection.auth_data, }); } + if ( + connection.auth_data.type === ConnectionType.MS_SQL && + connection.connection_data.type === ConnectionType.MS_SQL + ) { + return Object.assign(baseFormData, { + ...connection.connection_data, + ...connection.auth_data, + }); + } + if ( + connection.auth_data.type === ConnectionType.MY_SQL && + connection.connection_data.type === ConnectionType.MY_SQL + ) { + return Object.assign(baseFormData, { + ...connection.connection_data, + ...connection.auth_data, + }); + } + if ( + connection.auth_data.type === ConnectionType.CLICKHOUSE && + connection.connection_data.type === ConnectionType.CLICKHOUSE + ) { + return Object.assign(baseFormData, { + ...connection.connection_data, + ...connection.auth_data, + }); + } return { name: connection.name, description: connection.description, diff --git a/src/features/connection/utils/adaptConnectionTypeRequest/index.ts b/src/features/connection/utils/adaptConnectionTypeRequest/index.ts index 573a474..9fa408a 100644 --- a/src/features/connection/utils/adaptConnectionTypeRequest/index.ts +++ b/src/features/connection/utils/adaptConnectionTypeRequest/index.ts @@ -1,7 +1,10 @@ import { ConnectionType } from '@shared/types'; import { + adaptConnectionClickhouse, adaptConnectionHdfs, adaptConnectionHive, + adaptConnectionMsSql, + adaptConnectionMySql, adaptConnectionOracle, adaptConnectionPostgres, adaptConnectionS3, @@ -21,6 +24,12 @@ export const adaptConnectionTypeRequest = (values: AdaptConnectionTypeRequestPro return adaptConnectionOracle(values); case ConnectionType.POSTGRES: return adaptConnectionPostgres(values); + case ConnectionType.CLICKHOUSE: + return adaptConnectionClickhouse(values); + case ConnectionType.MY_SQL: + return adaptConnectionMySql(values); + case ConnectionType.MS_SQL: + return adaptConnectionMsSql(values); case ConnectionType.S3: return adaptConnectionS3(values); } diff --git a/src/features/transfer/MutateTransferForm/components/SourceParams/constants.tsx b/src/features/transfer/MutateTransferForm/components/SourceParams/constants.tsx index ad6903e..d137be4 100644 --- a/src/features/transfer/MutateTransferForm/components/SourceParams/constants.tsx +++ b/src/features/transfer/MutateTransferForm/components/SourceParams/constants.tsx @@ -6,11 +6,17 @@ import { TransferConnectionHive } from '../TransferConnectionHive'; import { TransferConnectionOracle } from '../TransferConnectionOracle'; import { TransferConnectionPostgres } from '../TransferConnectionPostgres'; import { TransferConnectionS3 } from '../TransferConnectionS3'; +import { TransferConnectionClickhouse } from '../TransferConnectionClickhouse'; +import { TransferConnectionMySql } from '../TransferConnectionMySql'; +import { TransferConnectionMsSql } from '../TransferConnectionMsSql'; export const TRANSFER_SOURCE_CONNECTION_TYPE_COMPONENT = { [ConnectionType.HDFS]: , [ConnectionType.HIVE]: , [ConnectionType.ORACLE]: , [ConnectionType.POSTGRES]: , + [ConnectionType.CLICKHOUSE]: , + [ConnectionType.MY_SQL]: , + [ConnectionType.MS_SQL]: , [ConnectionType.S3]: , }; diff --git a/src/features/transfer/MutateTransferForm/components/TargetParams/constants.tsx b/src/features/transfer/MutateTransferForm/components/TargetParams/constants.tsx index 093860d..9235db9 100644 --- a/src/features/transfer/MutateTransferForm/components/TargetParams/constants.tsx +++ b/src/features/transfer/MutateTransferForm/components/TargetParams/constants.tsx @@ -6,11 +6,17 @@ import { TransferConnectionHive } from '../TransferConnectionHive'; import { TransferConnectionOracle } from '../TransferConnectionOracle'; import { TransferConnectionPostgres } from '../TransferConnectionPostgres'; import { TransferConnectionS3 } from '../TransferConnectionS3'; +import { TransferConnectionClickhouse } from '../TransferConnectionClickhouse'; +import { TransferConnectionMySql } from '../TransferConnectionMySql'; +import { TransferConnectionMsSql } from '../TransferConnectionMsSql'; export const TRANSFER_TARGET_CONNECTION_TYPE_COMPONENT = { [ConnectionType.HDFS]: , [ConnectionType.HIVE]: , [ConnectionType.ORACLE]: , [ConnectionType.POSTGRES]: , + [ConnectionType.CLICKHOUSE]: , + [ConnectionType.MY_SQL]: , + [ConnectionType.MS_SQL]: , [ConnectionType.S3]: , }; diff --git a/src/features/transfer/MutateTransferForm/components/TransferConnectionClickhouse/index.tsx b/src/features/transfer/MutateTransferForm/components/TransferConnectionClickhouse/index.tsx new file mode 100644 index 0000000..3806252 --- /dev/null +++ b/src/features/transfer/MutateTransferForm/components/TransferConnectionClickhouse/index.tsx @@ -0,0 +1,12 @@ +import React from 'react'; +import { Form, Input } from 'antd'; + +import { TransferConnectionClickhouseProps } from './types'; + +export const TransferConnectionClickhouse = ({ name }: TransferConnectionClickhouseProps) => { + return ( + + + + ); +}; diff --git a/src/features/transfer/MutateTransferForm/components/TransferConnectionClickhouse/types.ts b/src/features/transfer/MutateTransferForm/components/TransferConnectionClickhouse/types.ts new file mode 100644 index 0000000..2394b75 --- /dev/null +++ b/src/features/transfer/MutateTransferForm/components/TransferConnectionClickhouse/types.ts @@ -0,0 +1,3 @@ +import { ConnectionParamFieldName } from '../../types'; + +export interface TransferConnectionClickhouseProps extends ConnectionParamFieldName {} diff --git a/src/features/transfer/MutateTransferForm/components/TransferConnectionMsSql/index.tsx b/src/features/transfer/MutateTransferForm/components/TransferConnectionMsSql/index.tsx new file mode 100644 index 0000000..8ff1c7e --- /dev/null +++ b/src/features/transfer/MutateTransferForm/components/TransferConnectionMsSql/index.tsx @@ -0,0 +1,12 @@ +import React from 'react'; +import { Form, Input } from 'antd'; + +import { TransferConnectionMsSqlProps } from './types'; + +export const TransferConnectionMsSql = ({ name }: TransferConnectionMsSqlProps) => { + return ( + + + + ); +}; diff --git a/src/features/transfer/MutateTransferForm/components/TransferConnectionMsSql/types.ts b/src/features/transfer/MutateTransferForm/components/TransferConnectionMsSql/types.ts new file mode 100644 index 0000000..f00ecfc --- /dev/null +++ b/src/features/transfer/MutateTransferForm/components/TransferConnectionMsSql/types.ts @@ -0,0 +1,3 @@ +import { ConnectionParamFieldName } from '../../types'; + +export interface TransferConnectionMsSqlProps extends ConnectionParamFieldName {} diff --git a/src/features/transfer/MutateTransferForm/components/TransferConnectionMySql/index.tsx b/src/features/transfer/MutateTransferForm/components/TransferConnectionMySql/index.tsx new file mode 100644 index 0000000..a33f2e0 --- /dev/null +++ b/src/features/transfer/MutateTransferForm/components/TransferConnectionMySql/index.tsx @@ -0,0 +1,12 @@ +import React from 'react'; +import { Form, Input } from 'antd'; + +import { TransferConnectionMySqlProps } from './types'; + +export const TransferConnectionMySql = ({ name }: TransferConnectionMySqlProps) => { + return ( + + + + ); +}; diff --git a/src/features/transfer/MutateTransferForm/components/TransferConnectionMySql/types.ts b/src/features/transfer/MutateTransferForm/components/TransferConnectionMySql/types.ts new file mode 100644 index 0000000..0dfa8b9 --- /dev/null +++ b/src/features/transfer/MutateTransferForm/components/TransferConnectionMySql/types.ts @@ -0,0 +1,3 @@ +import { ConnectionParamFieldName } from '../../types'; + +export interface TransferConnectionMySqlProps extends ConnectionParamFieldName {} diff --git a/src/features/transfer/TransferDetailInfo/components/TransferParams/index.tsx b/src/features/transfer/TransferDetailInfo/components/TransferParams/index.tsx index e4e0d9f..e0b8063 100644 --- a/src/features/transfer/TransferDetailInfo/components/TransferParams/index.tsx +++ b/src/features/transfer/TransferDetailInfo/components/TransferParams/index.tsx @@ -1,5 +1,6 @@ import React from 'react'; import { Descriptions } from 'antd'; +import { CONNECTION_TYPE_NAMES } from '@entities/connection'; import { TransferParamsProps } from './types'; import { getDescriptionItems } from './utils'; @@ -8,7 +9,7 @@ export const TransferParams = ({ data, ...props }: TransferParamsProps) => { return ( - {data.type} + {CONNECTION_TYPE_NAMES[data.type]} {getDescriptionItems({ data }).map((item, index) => ( diff --git a/src/features/transfer/TransferDetailInfo/components/TransferParams/utils/getDescriptionItems/index.tsx b/src/features/transfer/TransferDetailInfo/components/TransferParams/utils/getDescriptionItems/index.tsx index 6bac868..40bad5b 100644 --- a/src/features/transfer/TransferDetailInfo/components/TransferParams/utils/getDescriptionItems/index.tsx +++ b/src/features/transfer/TransferDetailInfo/components/TransferParams/utils/getDescriptionItems/index.tsx @@ -23,6 +23,9 @@ export const getDescriptionItems = ({ data }: GetDescriptionItemsProps): Descrip case ConnectionType.HIVE: case ConnectionType.ORACLE: case ConnectionType.POSTGRES: + case ConnectionType.CLICKHOUSE: + case ConnectionType.MY_SQL: + case ConnectionType.MS_SQL: return [ { label: 'Table name', diff --git a/src/shared/types/connection.ts b/src/shared/types/connection.ts index 17b6c4c..5070658 100644 --- a/src/shared/types/connection.ts +++ b/src/shared/types/connection.ts @@ -1,6 +1,9 @@ export enum ConnectionType { - HIVE = 'hive', + CLICKHOUSE = 'clickhouse', HDFS = 'hdfs', + HIVE = 'hive', + MS_SQL = 'mssql', + MY_SQL = 'mysql', ORACLE = 'oracle', POSTGRES = 'postgres', S3 = 's3',