50 lines
1.1 KiB
JavaScript
50 lines
1.1 KiB
JavaScript
import React, { Component } from 'react'
|
|
import { Label, Icon } from 'semantic-ui-react'
|
|
import './CreateNodule.css'
|
|
|
|
import Tables from '../../Collections/Tables'
|
|
|
|
class TableSelect extends Component {
|
|
constructor () {
|
|
super()
|
|
this.tables = new Tables()
|
|
this.state = {
|
|
selectedTables: [],
|
|
tables: this.tables.getCollectionProps()
|
|
}
|
|
document.addEventListener('updateTables', this.updateTableList)
|
|
}
|
|
|
|
toggleSelect = label => {
|
|
console.log(label)
|
|
}
|
|
|
|
updateTableList = () => {
|
|
this.setState({tables: this.tables.getCollectionProps()})
|
|
}
|
|
|
|
renderTableLabels = () => {
|
|
const { selectedTables, tables } = this.state
|
|
const tableLabelElements = tables.map(t => {
|
|
const isSelected = label => selectedTables.includes(label)
|
|
return (
|
|
<Label onClick={() => this.toggleSelect(t.label)}>
|
|
{t.label}
|
|
{ isSelected ? <Icon name='delete' /> : '' }
|
|
</Label>
|
|
)
|
|
})
|
|
return tableLabelElements
|
|
}
|
|
|
|
render = () => {
|
|
return (
|
|
<div className='TableSelect'>
|
|
{ this.renderTableLabels() }
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default TableSelect
|