diff options
Diffstat (limited to 'client/table/file.table.js')
| -rw-r--r-- | client/table/file.table.js | 42 |
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, |
