ClickHouse integration

Author: Sean Rabaut

app/components/Settings/Tabs/Tab.react.js

@@ -44,6 +44,8 @@ export default class ConnectionTab extends Component {
             label = connectionObject.storage;
         } else if (connectionObject.dialect === DIALECTS.BIGQUERY) {
             label = `Big Query ${connectionObject.database}`;
+        } else if(connectionObject.dialect === DIALECTS.CLICKHOUSE) {
+            label = `ClickHouse ${connectionObject.database}`;
         } else if (connectionObject.dialect === DIALECTS.DATA_WORLD) {
             const pathNames = getPathNames(connectionObject.url);
             if (pathNames.length >= 3) {

app/constants/constants.js

@@ -19,7 +19,8 @@ export const DIALECTS = {
     DATA_WORLD: 'data.world',
     ATHENA: 'athena',
     CSV: 'csv',
-    BIGQUERY: 'bigquery'
+    BIGQUERY: 'bigquery',
+    CLICKHOUSE: 'clickhouse'
 };
 
 export const SQL_DIALECTS_USING_EDITOR = [
@@ -36,7 +37,8 @@ export const SQL_DIALECTS_USING_EDITOR = [
     'data.world',
     'athena',
     'csv',
-    'bigquery'
+    'bigquery',
+    'clickhouse'
 ];
 
 const commonSqlOptions = [
@@ -270,6 +272,22 @@ export const CONNECTION_CONFIG = {
             'type': 'filedrop',
             'description': 'The location of the Google Service Account Key File'
         }
+    ],
+    [DIALECTS.CLICKHOUSE]: [
+        {'label': 'Username', 'value': 'username', 'type': 'text'},
+        {'label': 'Password', 'value': 'password', 'type': 'password'},
+        {
+            'label': 'Host',
+            'value': 'host',
+            'type': 'text'
+        },
+        {
+            'label': 'Port',
+            'value': 'port',
+            'type': 'number',
+            'description': 'Server port number (e.g. 8123)'
+        },
+        {'label': 'Database', 'value': 'database', 'type': 'text'},
     ]
 };
 
@@ -291,7 +309,8 @@ export const LOGOS = {
     [DIALECTS.APACHE_DRILL]: 'images/apache_drill-logo.png',
     [DIALECTS.DATA_WORLD]: 'images/dataworld-logo.png',
     [DIALECTS.ATHENA]: 'images/athena-logo.png',
-    [DIALECTS.BIGQUERY]: 'images/bigquery-logo.png'
+    [DIALECTS.BIGQUERY]: 'images/bigquery-logo.png',
+    [DIALECTS.CLICKHOUSE]: 'images/clickhouse-logo.png'
 };
 
 export function PREVIEW_QUERY(connection, table, elasticsearchIndex) {
@@ -311,6 +330,7 @@ export function PREVIEW_QUERY(connection, table, elasticsearchIndex) {
         case DIALECTS.DATA_WORLD:
         case DIALECTS.REDSHIFT:
         case DIALECTS.ATHENA:
+        case DIALECTS.CLICKHOUSE:
             return `SELECT * FROM ${table} LIMIT 1000`;
         case DIALECTS.MSSQL:
             return (connection.database) ?
@@ -485,6 +505,12 @@ export const SAMPLE_DBS = {
         projectId: 'Plotly',
         database: 'plotly',
         keyFilename: '/home/plotly/falcon/google-credentials.json'
+    },
+    [DIALECTS.CLICKHOUSE]: {
+        username: 'default',
+        password: 'connecttoplotly',
+        host: 'clickhouse.test.plotly.host',
+        port: 8123,
     }
 };
 

app/images/clickhouse-logo.png

@@ -15,6 +15,7 @@ import * as DataWorld from './dataworld';
 import * as DatastoreMock from './datastoremock';
 import * as Athena from './athena';
 import * as BigQuery from './bigquery';
+import * as ClickHouse from './clickhouse';
 
 const CSV = require('./csv');
 const Oracle = require('./oracle.js');
@@ -68,6 +69,8 @@ function getDatastoreClient(connection) {
         return Oracle;
     } else if (dialect === 'bigquery') {
         return BigQuery;
+    } else if (dialect === 'clickhouse') {
+        return ClickHouse;
     }
     return Sql;
 }

backend/persistent/datastores/Datastores.js

@@ -0,0 +1,89 @@
+import ClickHouse from '@apla/clickhouse';
+
+/**
+ * The following function will create a ClickHouse client
+ * @param {String} host
+ * @param {Number} port
+ * @param {String} username
+ * @param {String} password
+ * @param {String} database
+ * @returns {Object} ClickHouse client
+ */ 
+function createClient({ host, port, username = '', password = '', database }) {
+  return new ClickHouse({
+    host,
+    port,
+    auth: `${username}:${password}`,
+    queryOptions: {
+      database
+    }
+  });
+}
+
+/**
+ * The following function will connect to the datasource
+ * @param {Object} connection
+ * @returns {Promise} that resolves when the connection succeeds
+ */ 
+export function connect(connection) {
+  return createClient(connection).pinging()
+}
+
+/**
+ * The following function will return a list of schemas.  
+ * @param {Object} connection 
+ * @returns {Promise} that resolves to { 
+ *                    columnnames: [ 'tablename', 'column_name','data_type' ], 
+ *                    rows: [[tablename1, columnname1, datatype1], ...]] }
+ */
+export function schemas(connection) {
+  return query(`
+    SELECT table, name, type
+    FROM system.columns
+    WHERE database = '${connection.database}'
+    ORDER BY table
+  `, connection).then(({ rows }) => ({
+    columnnames: [ 'tablename', 'column_name','data_type' ],
+    rows
+  }))
+}
+
+
+/**
+ * The following function will return a list of tables.  
+ * @param {Object} connection
+ * @returns {Promise} that resolves to an array of table names
+ */
+export function tables(connection) {
+  return query('SHOW TABLES', connection).then(({ rows }) => rows.map(row => row[0]))
+}
+
+/**
+ * The following function will execute a query against the 
+ * data source.  The function should return a tuple which contains 
+ * two elements.  The first is an array of strings which is the column names
+ * The second is a two dimensional array which represents the rows to be displayed
+ * @param {String|Object} queryObject
+ * @param {Object} connection
+ * @returns {Promise} that resolves to { columnnames, rows }
+ */ 
+export function query(queryObject, connection) {
+  const client = createClient(connection)
+
+  const stream = client.query(queryObject)
+
+  let columnnames = []
+  const rows = [];
+
+  return new Promise((resolve, reject) => {
+    stream.on('metadata', columns => {
+      columnnames = columns.map(({ name }) => name)
+    })
+
+    stream.on('data', row => rows.push(row))
+
+    stream.on('error', err => reject(err))
+
+    stream.on('end', () => resolve({ columnnames, rows }))
+  })
+}

backend/persistent/datastores/clickhouse.js

@@ -241,6 +241,7 @@
     "yamljs": "^0.3.0"
   },
   "dependencies": {
+    "@apla/clickhouse": "^1.5.3",
     "alasql": "^0.4.5",
     "csv-parse": "^2.0.0",
     "dtrace-provider": "^0.8.6",