import React from 'react';
import AceEditorBox from '../AceEditorBox';
import API from '../API';
import DTable from '../DTable';
import SQL from '../SQL';
import SOCKET from '../SOCKET';

// 数据源配置面板
const DataSourceTypeConfig = ({
  isPerson,
  dataType,
  dataConfig,
  sources,
  handlBlur,
  handleUpdate,
}) => {
  if (isPerson && dataType === 'static') return null;
  switch (dataType) {
    case 'static':
      return (
        <AceEditorBox
          height={'200px'}
          onBlur={handlBlur}
          value={JSON.stringify(dataConfig.data, null, '\t')}
        />
      );
    case 'oracle':
    case 'mssql':
    case 'mysql':
    case 'postgresql':
    case 'clickhouse':
    case 'damengdb':
    case 'db2':
      return <SQL onChange={handleUpdate} dataConfig={dataConfig.config} />;
    case 'api':
    case 'apiGateway':
    case 'dtInsight':
      return (
        <API
          type={dataType}
          onChange={handleUpdate}
          dataList={sources}
          dataConfig={dataConfig.config}
        />
      );
    case 'ws':
    case 'mqtt':
      return <SOCKET type={dataType}
      onChange={handleUpdate}
      dataList={sources}
      dataConfig={dataConfig.config} />;
    case 'dtableapi':
      return <DTable onChange={handleUpdate} dataConfig={dataConfig.config} />;
    case 'csv':
    default:
      return null;
  }
};

export default DataSourceTypeConfig;
