test csv

1 files changed, 32 insertions, 10 deletions

diff --git a/client/table/file.table.js b/client/table/file.table.js
index 92f5cf72..82c01ac5 100644
--- a/client/table/file.table.js
+++ b/client/table/file.table.js
@@ -1,25 +1,32 @@
 import React, { Component } from 'react'
 import { bindActionCreators } from 'redux'
 import { connect } from 'react-redux'
-import { toArray, toTuples } from '../util'
+import { ReactTabulator } from 'react-tabulator'
 
+import { toArray, toTuples, domainFromUrl } from '../util'
 import { Loader } from '../common'
 
 import csv from 'parse-csv'
 
 class FileTable extends Component {
   state = {
-    data: []
+    keys: [],
+    data: [],
+    columns: [],
   }
   
   componentDidMount() {
+    const { payload } = this.props
     console.log(payload.url)
     fetch(payload.url, { mode: 'cors' })
       .then(r => r.text())
       .then(text => {
         try {
+          const keys = text.split('\n')[0].split(',').map(s => s.trim().replace(/\"/,''))
           const data = csv.toJSON(text, { headers: { included: true } })
-          this.setState({ data })
+          // console.log(data)
+          const columns = this.getColumns(keys, data, payload.fields)
+          this.setState({ keys, data, columns })
         } catch (e) {
           console.error("error making json:", payload.url)
           console.error(e)
@@ -27,26 +34,41 @@ class FileTable extends Component {
       })
   }
 
-  getColumns(payload) {
-    let { cmd, url, fields } = payload
-    return ((fields && fields.length) ? fields[0] : '').split(', ').map(field => {
+  getColumns(keys, data, fields) {
+    let titles = fields.length ? fields[0].split(', ') : keys
+    let numberFields = []
+    let columns = keys.map((field, i) => {
+      const title = titles[i] || field
+      if (field.match('url')) {
+        let textField = field.replace('url', 'label')
+        data.forEach(el => el[textField] = domainFromUrl(el[field]))
+        return {
+          title,
+          field: textField,
+          formatter: 'link',
+          formatterParams: { target: "_blank", urlField: field, },
+          sorter: 'string'
+        }
+      }
       switch (field) {
+        case 'images':
+        case 'year':
+          return { title, field: field.toLowerCase(), sorter: 'number' }
         default:
-          return { title: field, field: field.toLowerCase(), sorter: 'string' }
+          return { title, field: field.toLowerCase(), sorter: 'string' }
       }
     })
+    return columns
   }
 
   render() {
     const { payload } = this.props
-    const { paper, citations } = payload.data
-    const columns = getColumns(payload)
     if (!this.state.data.length) {
       return <Loader />
     }
     return (
       <ReactTabulator
-        columns={citationsColumns}
+        columns={this.state.columns}
         data={this.state.data}
         options={{
           height: 311,