You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@inlong.apache.org by go...@apache.org on 2021/11/05 10:44:31 UTC
[incubator-inlong] branch master updated: [INLONG-1756] Use
metadata to manage data sources and flow fields (#1757)
This is an automated email from the ASF dual-hosted git repository.
gosonzhang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-inlong.git
The following commit(s) were added to refs/heads/master by this push:
new 5466390 [INLONG-1756] Use metadata to manage data sources and flow fields (#1757)
5466390 is described below
commit 546639067834029c5966f66cd78d694cf62394ae
Author: Daniel <le...@outlook.com>
AuthorDate: Fri Nov 5 18:44:26 2021 +0800
[INLONG-1756] Use metadata to manage data sources and flow fields (#1757)
---
.../AccessHelper/DataSourcesEditor/CreateModal.tsx | 4 +-
.../AccessHelper/DataSourcesEditor/DbConfig.tsx | 26 ----------
.../AccessHelper/DataSourcesEditor/index.tsx | 5 +-
.../AccessHelper/DataStorageEditor/DetailModal.tsx | 11 ++---
.../AccessHelper/DataStorageEditor/Editor.tsx | 2 +-
.../AccessHelper/FieldsConfig/dataFields.tsx | 2 +-
.../AccessHelper/FieldsConfig/sourceFields.ts | 27 -----------
.../src/components/AccessHelper/index.ts | 14 ------
.../FileConfig.tsx => MetaData/DataSourcesFile.ts} | 0
.../src/components/MetaData/SourceDataFields.ts | 56 ++++++++++++++++++++++
.../hiveConfig.tsx => MetaData/StorageHive.tsx} | 56 ++++++++--------------
.../src/pages/AccessDetail/DataSources/index.tsx | 9 ++--
.../src/pages/AccessDetail/DataStorage/index.tsx | 5 +-
13 files changed, 91 insertions(+), 126 deletions(-)
diff --git a/inlong-website/src/components/AccessHelper/DataSourcesEditor/CreateModal.tsx b/inlong-website/src/components/AccessHelper/DataSourcesEditor/CreateModal.tsx
index ee097d1..527639f 100644
--- a/inlong-website/src/components/AccessHelper/DataSourcesEditor/CreateModal.tsx
+++ b/inlong-website/src/components/AccessHelper/DataSourcesEditor/CreateModal.tsx
@@ -23,8 +23,7 @@ import { ModalProps } from 'antd/es/modal';
import FormGenerator, { useForm } from '@/components/FormGenerator';
import { useRequest, useUpdateEffect } from '@/hooks';
import { useTranslation } from 'react-i18next';
-import { getCreateFormContent as getFileCreateFormContent } from './FileConfig';
-import { getCreateFormContent as getDbCreateFormContent } from './DbConfig';
+import { getCreateFormContent as getFileCreateFormContent } from '@/components/MetaData/DataSourcesFile';
export interface Props extends ModalProps {
type: 'DB' | 'FILE';
@@ -68,7 +67,6 @@ const Comp: React.FC<Props> = ({ type, id, content = [], record, ...modalProps }
const getCreateFormContent = useMemo(() => {
return {
- DB: getDbCreateFormContent,
FILE: getFileCreateFormContent,
}[type];
}, [type]);
diff --git a/inlong-website/src/components/AccessHelper/DataSourcesEditor/DbConfig.tsx b/inlong-website/src/components/AccessHelper/DataSourcesEditor/DbConfig.tsx
deleted file mode 100644
index b115e90..0000000
--- a/inlong-website/src/components/AccessHelper/DataSourcesEditor/DbConfig.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-/*
- * 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 { ColumnsType } from 'antd/es/table';
-
-export const getCreateFormContent = () => {
- return [];
-};
-
-export const tableColumns: ColumnsType = [];
diff --git a/inlong-website/src/components/AccessHelper/DataSourcesEditor/index.tsx b/inlong-website/src/components/AccessHelper/DataSourcesEditor/index.tsx
index 1359eee..5858dc7 100644
--- a/inlong-website/src/components/AccessHelper/DataSourcesEditor/index.tsx
+++ b/inlong-website/src/components/AccessHelper/DataSourcesEditor/index.tsx
@@ -22,8 +22,7 @@ import { Button, Table, Modal, message } from 'antd';
import { useTranslation } from 'react-i18next';
import request from '@/utils/request';
import { useUpdateEffect, usePrevious } from '@/hooks';
-import { tableColumns as dbColumns } from './DbConfig';
-import { tableColumns as fileColumns } from './FileConfig';
+import { tableColumns as fileColumns } from '@/components/MetaData/DataSourcesFile';
import CreateModal from './CreateModal';
export interface DataSourcesEditorProps {
@@ -158,7 +157,7 @@ const Comp = ({
setData(newData);
};
- const columns = (type === 'DB' ? dbColumns : fileColumns).concat(
+ const columns = fileColumns.concat(
readonly
? []
: [
diff --git a/inlong-website/src/components/AccessHelper/DataStorageEditor/DetailModal.tsx b/inlong-website/src/components/AccessHelper/DataStorageEditor/DetailModal.tsx
index c3bf540..7763b48 100644
--- a/inlong-website/src/components/AccessHelper/DataStorageEditor/DetailModal.tsx
+++ b/inlong-website/src/components/AccessHelper/DataStorageEditor/DetailModal.tsx
@@ -26,7 +26,7 @@ import FormGenerator, {
FormItemProps,
FormGeneratorProps,
} from '@/components/FormGenerator';
-import { getHiveForm, getHiveColumns } from './hiveConfig';
+import { getHiveForm, getHiveColumns } from '@/components/MetaData/StorageHive';
export interface DetailModalProps extends ModalProps {
inlongGroupId: string;
@@ -148,14 +148,13 @@ const Comp: React.FC<DetailModalProps> = ({
const formContent = useMemo(() => {
const map = {
- HIVE: {
- content: getHiveForm(dataType, !!id, form),
- },
+ HIVE: getHiveForm,
+ // CLICK_HOUSE: getClickhouseForm,
};
const item = map[storageType];
- return item.content;
- }, [storageType, dataType, id, form]);
+ return item(dataType, !!id, inlongGroupId, currentValues, form);
+ }, [storageType, dataType, inlongGroupId, id, currentValues, form]);
const onOk = async () => {
const values = await form.validateFields();
diff --git a/inlong-website/src/components/AccessHelper/DataStorageEditor/Editor.tsx b/inlong-website/src/components/AccessHelper/DataStorageEditor/Editor.tsx
index 919e8a5..3308615 100644
--- a/inlong-website/src/components/AccessHelper/DataStorageEditor/Editor.tsx
+++ b/inlong-website/src/components/AccessHelper/DataStorageEditor/Editor.tsx
@@ -23,7 +23,7 @@ import request from '@/utils/request';
import isEqual from 'lodash/isEqual';
import { useTranslation } from 'react-i18next';
import DetailModal from './DetailModal';
-import { hiveTableColumns } from './hiveConfig';
+import { hiveTableColumns } from '@/components/MetaData/StorageHive';
export interface Props {
value?: Record<string, any>[];
diff --git a/inlong-website/src/components/AccessHelper/FieldsConfig/dataFields.tsx b/inlong-website/src/components/AccessHelper/FieldsConfig/dataFields.tsx
index fc32e75..c30d105 100644
--- a/inlong-website/src/components/AccessHelper/FieldsConfig/dataFields.tsx
+++ b/inlong-website/src/components/AccessHelper/FieldsConfig/dataFields.tsx
@@ -25,7 +25,7 @@ import DataSourcesEditor from '../DataSourcesEditor';
import DataStorageEditor from '../DataStorageEditor/Editor';
import EditableTable from '@/components/EditableTable';
import i18n from '@/i18n';
-import { fieldTypes as sourceFieldsTypes } from './sourceFields';
+import { fieldTypes as sourceFieldsTypes } from '@/components/MetaData/SourceDataFields';
type RestParams = {
inlongGroupId?: string;
diff --git a/inlong-website/src/components/AccessHelper/FieldsConfig/sourceFields.ts b/inlong-website/src/components/AccessHelper/FieldsConfig/sourceFields.ts
deleted file mode 100644
index 133c24f..0000000
--- a/inlong-website/src/components/AccessHelper/FieldsConfig/sourceFields.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-/*
- * 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.
- */
-
-/**
- * Source data configuration related definitions
- */
-
-export const fieldTypes = ['int', 'float', 'double', 'string', 'date', 'timestamp'].map(item => ({
- label: item,
- value: item,
-}));
diff --git a/inlong-website/src/components/AccessHelper/index.ts b/inlong-website/src/components/AccessHelper/index.ts
index b19529a..eb465be 100644
--- a/inlong-website/src/components/AccessHelper/index.ts
+++ b/inlong-website/src/components/AccessHelper/index.ts
@@ -24,23 +24,9 @@ export { default as genDataFields } from './FieldsConfig/dataFields';
// Data source creation/selector
export { default as DataSourcesCreateModal } from './DataSourcesEditor/CreateModal';
-// Columns configuration related to all data sources
-export {
- tableColumns as dataSourcesDbColumns,
- getCreateFormContent as getDataSourcesDbCreateFormContent,
-} from './DataSourcesEditor/DbConfig';
-
-export {
- tableColumns as dataSourcesFileColumns,
- getCreateFormContent as getDataSourcesFileCreateFormContent,
-} from './DataSourcesEditor/FileConfig';
-
// Data source configuration editor
export { default as DataSourcesEditor } from './DataSourcesEditor';
-// All flow-related columns configuration
-export { hiveTableColumns as dataStorageHiveColumns } from './DataStorageEditor/hiveConfig';
-
// Flow editor
export { default as DataStorageEditor } from './DataStorageEditor/Editor';
export { default as DataStorageDetailModal } from './DataStorageEditor/DetailModal';
diff --git a/inlong-website/src/components/AccessHelper/DataSourcesEditor/FileConfig.tsx b/inlong-website/src/components/MetaData/DataSourcesFile.ts
similarity index 100%
rename from inlong-website/src/components/AccessHelper/DataSourcesEditor/FileConfig.tsx
rename to inlong-website/src/components/MetaData/DataSourcesFile.ts
diff --git a/inlong-website/src/components/MetaData/SourceDataFields.ts b/inlong-website/src/components/MetaData/SourceDataFields.ts
new file mode 100644
index 0000000..899a42d
--- /dev/null
+++ b/inlong-website/src/components/MetaData/SourceDataFields.ts
@@ -0,0 +1,56 @@
+/*
+ * 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 i18n from '@/i18n';
+
+export const fieldTypes = ['int', 'long', 'float', 'double', 'string', 'date', 'timestamp'].map(
+ item => ({
+ label: item,
+ value: item,
+ }),
+);
+
+export const sourceDataFields = [
+ {
+ title: i18n.t('components.AccessHelper.DataStorageEditor.hiveConfig.SourceFieldName'),
+ dataIndex: 'sourceFieldName',
+ initialValue: '',
+ rules: [
+ { required: true },
+ {
+ pattern: /^[a-zA-Z][a-zA-Z0-9_]*$/,
+ message: i18n.t('components.AccessHelper.DataStorageEditor.hiveConfig.fieldNameRule'),
+ },
+ ],
+ props: (text, record, idx, isNew) => ({
+ disabled: text && !isNew,
+ }),
+ },
+ {
+ title: i18n.t('components.AccessHelper.DataStorageEditor.hiveConfig.SourceFieldType'),
+ dataIndex: 'sourceFieldType',
+ initialValue: fieldTypes[0].value,
+ type: 'select',
+ rules: [{ required: true }],
+ props: (text, record, idx, isNew) => ({
+ disabled: text && !isNew,
+ options: fieldTypes,
+ }),
+ },
+];
diff --git a/inlong-website/src/components/AccessHelper/DataStorageEditor/hiveConfig.tsx b/inlong-website/src/components/MetaData/StorageHive.tsx
similarity index 80%
rename from inlong-website/src/components/AccessHelper/DataStorageEditor/hiveConfig.tsx
rename to inlong-website/src/components/MetaData/StorageHive.tsx
index 1688e26..e1418db 100644
--- a/inlong-website/src/components/AccessHelper/DataStorageEditor/hiveConfig.tsx
+++ b/inlong-website/src/components/MetaData/StorageHive.tsx
@@ -22,7 +22,7 @@ import { Button, message } from 'antd';
import EditableTable, { ColumnsItemProps } from '@/components/EditableTable';
import request from '@/utils/request';
import i18n from '@/i18n';
-import { fieldTypes } from '../FieldsConfig/sourceFields';
+import { sourceDataFields } from './SourceDataFields';
// hiveFieldTypes
const hiveFieldTypes = [
@@ -69,38 +69,14 @@ export const hiveTableColumns = [
},
];
-export const getHiveColumns = (dataType: string, storageType: string): ColumnsItemProps[] => [
+export const getHiveColumns = (
+ dataType: string,
+ currentValues: Record<string, unknown>,
+): ColumnsItemProps[] => [
...([
+ ...sourceDataFields,
{
- title: i18n.t('components.AccessHelper.DataStorageEditor.hiveConfig.SourceFieldName'),
- dataIndex: 'sourceFieldName',
- initialValue: '',
- rules: [
- { required: true },
- {
- pattern: /^[a-zA-Z][a-zA-Z0-9_]*$/,
- message: i18n.t('components.AccessHelper.DataStorageEditor.hiveConfig.fieldNameRule'),
- },
- ],
- props: (text, record, idx, isNew) => ({
- disabled: text && !isNew,
- }),
- },
- {
- title: i18n.t('components.AccessHelper.DataStorageEditor.hiveConfig.SourceFieldType'),
- dataIndex: 'sourceFieldType',
- initialValue: fieldTypes[0].value,
- type: 'select',
- rules: [{ required: true }],
- props: (text, record, idx, isNew) => ({
- disabled: text && !isNew,
- options: fieldTypes,
- }),
- },
- {
- title: `${storageType}${i18n.t(
- 'components.AccessHelper.DataStorageEditor.hiveConfig.FieldName',
- )}`,
+ title: `HIVE${i18n.t('components.AccessHelper.DataStorageEditor.hiveConfig.FieldName')}`,
dataIndex: 'fieldName',
initialValue: '',
rules: [
@@ -112,17 +88,17 @@ export const getHiveColumns = (dataType: string, storageType: string): ColumnsIt
],
props: (text, record, idx, isNew) => ({
disabled: text && !isNew,
+ // disabled: [110, 130].includes(currentValues?.status as number) && !isNew,
}),
},
{
- title: `${storageType}${i18n.t(
- 'components.AccessHelper.DataStorageEditor.hiveConfig.FieldType',
- )}`,
+ title: `HIVE${i18n.t('components.AccessHelper.DataStorageEditor.hiveConfig.FieldType')}`,
dataIndex: 'fieldType',
initialValue: hiveFieldTypes[0].value,
type: 'select',
- props: () => ({
+ props: (text, record, idx, isNew) => ({
options: hiveFieldTypes,
+ disabled: text && !isNew,
}),
rules: [{ required: true }],
},
@@ -134,7 +110,13 @@ export const getHiveColumns = (dataType: string, storageType: string): ColumnsIt
] as ColumnsItemProps[]),
];
-export const getHiveForm = (dataType: string, isEdit: boolean, form) => [
+export const getHiveForm = (
+ dataType: string,
+ isEdit: boolean,
+ inlongGroupId: string,
+ currentValues: Record<string, unknown>,
+ form,
+) => [
{
type: 'input',
label: i18n.t('components.AccessHelper.DataStorageEditor.hiveConfig.Db'),
@@ -239,7 +221,7 @@ export const getHiveForm = (dataType: string, isEdit: boolean, form) => [
type: (
<EditableTable
size="small"
- columns={getHiveColumns(dataType, 'HIVE')}
+ columns={getHiveColumns(dataType, currentValues)}
canDelete={(record, idx, isNew) => !isEdit || isNew}
/>
),
diff --git a/inlong-website/src/pages/AccessDetail/DataSources/index.tsx b/inlong-website/src/pages/AccessDetail/DataSources/index.tsx
index 9d5e772..1a8bd5f 100644
--- a/inlong-website/src/pages/AccessDetail/DataSources/index.tsx
+++ b/inlong-website/src/pages/AccessDetail/DataSources/index.tsx
@@ -22,11 +22,8 @@ import { Button, Modal, message } from 'antd';
import HighTable from '@/components/HighTable';
import { defaultSize } from '@/configs/pagination';
import { useRequest } from '@/hooks';
-import {
- dataSourcesDbColumns,
- dataSourcesFileColumns,
- DataSourcesCreateModal,
-} from '@/components/AccessHelper';
+import { DataSourcesCreateModal } from '@/components/AccessHelper';
+import { tableColumns as fileColumns } from '@/components/MetaData/DataSourcesFile';
import i18n from '@/i18n';
import request from '@/utils/request';
import { CommonInterface } from '../common';
@@ -151,7 +148,7 @@ const Comp: React.FC<Props> = ({ inlongGroupId }) => {
width: 100,
} as any,
]
- .concat(options.type === 'file' ? dataSourcesFileColumns : dataSourcesDbColumns)
+ .concat(fileColumns)
.concat([
{
title: i18n.t('basic.Status'),
diff --git a/inlong-website/src/pages/AccessDetail/DataStorage/index.tsx b/inlong-website/src/pages/AccessDetail/DataStorage/index.tsx
index 738917c..9346f63 100644
--- a/inlong-website/src/pages/AccessDetail/DataStorage/index.tsx
+++ b/inlong-website/src/pages/AccessDetail/DataStorage/index.tsx
@@ -23,7 +23,8 @@ import HighTable from '@/components/HighTable';
import { defaultSize } from '@/configs/pagination';
import { useRequest } from '@/hooks';
import i18n from '@/i18n';
-import { DataStorageDetailModal, dataStorageHiveColumns } from '@/components/AccessHelper';
+import { DataStorageDetailModal } from '@/components/AccessHelper';
+import { hiveTableColumns } from '@/components/MetaData/StorageHive';
import request from '@/utils/request';
import { CommonInterface } from '../common';
import { genStatusTag } from './status';
@@ -158,7 +159,7 @@ const Comp: React.FC<Props> = ({ inlongGroupId }) => {
};
const columnsMap = {
- HIVE: dataStorageHiveColumns,
+ HIVE: hiveTableColumns,
};
const createContent = useMemo(