diff --git a/src/Controllers/TableListController.js b/src/Controllers/TableListController.js index 76e9901..6265694 100644 --- a/src/Controllers/TableListController.js +++ b/src/Controllers/TableListController.js @@ -1,8 +1,10 @@ import Tables from '../Models/Tables' +import FocusTable from '../Models/FocusTable' class TableListController { constructor() { this.tables = new Tables() + this.focusTable = new FocusTable() this.updatedTablesEvent = new Event('updateTables') this.setSelectedTableEvent = new Event('setSelectedTable') } @@ -13,7 +15,8 @@ class TableListController { } selectTableToView = id => { - this.tables.setSelectedTableById(id) + const table = this.tables.getById(id) + this.focusTable.table = table document.dispatchEvent(this.setSelectedTableEvent) } } diff --git a/src/Models/FocusTable.js b/src/Models/FocusTable.js new file mode 100644 index 0000000..1ebcdec --- /dev/null +++ b/src/Models/FocusTable.js @@ -0,0 +1,26 @@ +let instance = null + +class FocusTable { + constructor (table) { + if (instance === null) instance = this + this._value = table + return instance + } + + set table (table) { + if (table.type === 'Nodule' || table.type === 'Table') this._value = table + else { + this._value = null + console.error('Focus Tablw value must be of type "Nodule" or "Table"') + } + } + + get table () { + if (this._value.type === 'Table') return this._value + else if (this._value.type === 'Nodule') return this._value.asTable() + else return {} + + } +} + +export default FocusTable diff --git a/src/Models/Tables.js b/src/Models/Tables.js index dbd5aa4..190c25c 100644 --- a/src/Models/Tables.js +++ b/src/Models/Tables.js @@ -7,7 +7,6 @@ class Tables { constructor () { if (!instance) instance = this this.collection = [] - this.selectedTable = null return instance } @@ -32,12 +31,6 @@ class Tables { getCollectionProps = () => this.collection.map(table => table.getProperties()) getById = id => this.collection.find(t => id === t.id) - - setSelectedTableById = id => { - const table = this.collection.find(t => id === t.id) - if (table) this.selectedTable = table - else this.selectedTable = null - } } export default Tables diff --git a/src/views/DataTable/DataTable.js b/src/views/DataTable/DataTable.js index 9ff4c60..6fea54b 100644 --- a/src/views/DataTable/DataTable.js +++ b/src/views/DataTable/DataTable.js @@ -2,25 +2,27 @@ import React, { Component } from 'react' import { Table } from 'semantic-ui-react' import Tables from '../../Models/Tables' +import FocusTable from '../../Models/FocusTable' class DataTable extends Component { constructor (props) { super(props) this.tables = new Tables() + this.focusTable = new FocusTable() this.state = { headers: [], tableData: [] } - document.addEventListener('setSelectedTable', this.setSelectedTable) + document.addEventListener('setSelectedTable', this.setFocusTable) } - setSelectedTable = () => { - const selectedTable = this.tables.selectedTable - if (selectedTable) { + setFocusTable = () => { + const focusTable = this.focusTable.table + if (focusTable) { this.setState({ - headers: selectedTable.headers, - tableData: selectedTable.rows + headers: focusTable.headers, + tableData: focusTable.rows }) } } @@ -39,11 +41,8 @@ class DataTable extends Component { renderTableRowElements = () => { - const { tableData, headers } = this.state - const tableRowElements = tableData.map(d => { - return { this.renderCellElements(d) } - }) - + const { tableData } = this.state + const tableRowElements = tableData.map(d => { this.renderCellElements(d) } ) return tableRowElements }