1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
|
import React, { Component } from 'react'
import { bindActionCreators } from 'redux'
import { connect } from 'react-redux'
import { ReactTabulator } from 'react-tabulator'
import csv from 'parse-csv'
import { toArray, toTuples, domainFromUrl } from '../util'
import { Loader } from '../common'
class FileTable extends Component {
state = {
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 } })
// 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)
}
})
}
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.toLowerCase(), sorter: 'string' }
}
})
return columns
}
render() {
if (!this.state.data.length) {
return <Loader />
}
return (
<ReactTabulator
columns={this.state.columns}
data={this.state.data}
options={{
height: Math.min(37 * this.state.data.length + 29, 311),
layout: 'fitColumns',
placeholder: 'No Data Set',
}}
/>
)
}
}
export default FileTable
|
