import React from 'react';
import './index.less';
import mysql from './imgs/mysql.svg';
import impala from './imgs/impala.svg';
import drds from './imgs/drds.svg';
import oceanbase from './imgs/oceanbase.svg';
import postgresql from './imgs/postgresql.svg';
import sqlserver from './imgs/sqlserver.svg';
import mongodb from './imgs/mongodb.svg';
import hive from './imgs/hive.svg';
import oss from './imgs/oss.svg';
import hbase from './imgs/hbase.svg';
import oracle from './imgs/oracle.svg';
import clickhouse from './imgs/clickhouse.svg';
import hdfs from './imgs/hdfs.svg';
import kingbase from './imgs/kingbase.svg';
import sparksql from './imgs/sparksql.svg';
import starrocks from './imgs/starrocks.svg';
import excel from './imgs/excel.svg';
import api from './imgs/api.svg';
export var LinkCategoryLogo = {
  mysql: mysql,
  impala: impala,
  drds: drds,
  oceanbase: oceanbase,
  postgresql: postgresql,
  sqlserver: sqlserver,
  mongodb: mongodb,
  hive: hive,
  oss: oss,
  hbase: hbase,
  oracle: oracle,
  clickhouse: clickhouse,
  hdfs: hdfs,
  kingbase: kingbase,
  sparksql: sparksql,
  starrocks: starrocks,
  excel: excel,
  api: api
};
var Category = function Category(_ref) {
  var category = _ref.category,
    _onClick = _ref.onClick;
  return /*#__PURE__*/React.createElement("div", {
    className: "cdp-category-item",
    onClick: function onClick() {
      if (_onClick) _onClick(category);
    }
  }, /*#__PURE__*/React.createElement("img", {
    src: LinkCategoryLogo[category.name.toLowerCase()]
  }), /*#__PURE__*/React.createElement("div", {
    className: "cdp-category-label"
  }, category.label));
};
export default Category;