From f186f8fad7441825f1a5f6ab6ec94ee3f42e7a92 Mon Sep 17 00:00:00 2001
From: ysandler <ysandler@tzed.io>
Date: Tue, 28 Jul 2020 16:58:39 -0500
Subject: [PATCH] feat: SelectedTable get headers

---
 src/Controllers/TableListController.js |  6 ++++++
 src/Models/SelectedTable.js            | 26 ++++++++++++++++++++------
 src/Models/Tables.js                   |  2 +-
 src/views/CreateNodule/TableSelect.js  |  2 +-
 src/views/DataTable/DataTable.js       |  0
 src/views/NoduleList/NoduleList.js     |  2 +-
 src/views/TableList/TableList.js       |  2 +-
 src/views/TableList/TableListItem.js   | 15 ++++++++++-----
 8 files changed, 40 insertions(+), 15 deletions(-)
 create mode 100644 src/views/DataTable/DataTable.js

diff --git a/src/Controllers/TableListController.js b/src/Controllers/TableListController.js
index afe87a0..11b43f7 100644
--- a/src/Controllers/TableListController.js
+++ b/src/Controllers/TableListController.js
@@ -1,4 +1,5 @@
 import Tables from '../Models/Tables'
+import SelectedTable from '../Models/SelectedTable'
 
 class TableListController {
   constructor() {
@@ -10,6 +11,11 @@ class TableListController {
     this.tables.removeById(id)
     document.dispatchEvent(this.updatedTablesEvent)
   }
+
+  logExportById = id => {
+    const selectedTable = new SelectedTable(this.tables.getById(id))
+    console.log(selectedTable.headers)
+  }
 }
 
 export default TableListController
\ No newline at end of file
diff --git a/src/Models/SelectedTable.js b/src/Models/SelectedTable.js
index 7c1a831..d6c417f 100644
--- a/src/Models/SelectedTable.js
+++ b/src/Models/SelectedTable.js
@@ -1,15 +1,29 @@
 class SelectedTable {
-  constructor (props) {
-    this.table = props.table
+  constructor (table) {
+    this.assignTable(table)
   }
 
-  getHeaders = () => {
+  assignTable = table => {
+    if (table.type === "Nodule") {
+      this.table = table.asTable()
+    } else if (table.type === 'Table') {
+      this.table = table
+    } else {
+      this.table = {}
+    }
+  }
+
+  get headers () {
     const rows = this.table.rows
     const length = rows.length
     let lengthToSlice = 49
     if (length < 50) lengthToSlice = length - 1
     const firstSliceOfRows = rows.slice(0, lengthToSlice)
-    console.log(firstSliceOfRows)
-    // const uniqueHeaderSet = new Set(firstSliceOfRows)
+    const headersOfSplicedRows = firstSliceOfRows.map(r => Object.keys(r))
+    const flatenedHeaders = headersOfSplicedRows.flat()
+    const uniqueHeaders = Array.from(new Set(flatenedHeaders))
+    return uniqueHeaders
   }
-}
\ No newline at end of file
+}
+
+export default SelectedTable
diff --git a/src/Models/Tables.js b/src/Models/Tables.js
index c33945c..190c25c 100644
--- a/src/Models/Tables.js
+++ b/src/Models/Tables.js
@@ -30,7 +30,7 @@ class Tables {
 
   getCollectionProps = () => this.collection.map(table => table.getProperties())
 
-  getTableByLabel = label => this.collection.find(t => label === t.label)
+  getById = id => this.collection.find(t => id === t.id)
 }
 
 export default Tables
diff --git a/src/views/CreateNodule/TableSelect.js b/src/views/CreateNodule/TableSelect.js
index bb152d2..d93e310 100644
--- a/src/views/CreateNodule/TableSelect.js
+++ b/src/views/CreateNodule/TableSelect.js
@@ -39,7 +39,7 @@ class TableSelect extends Component {
     const tableLabelElements = tables.map(t => {
       const isSelected = selectedTablesLabels.includes(t.label)
       return (
-        <Label onClick={() => this.toggleSelect(t.label)} color={isSelected ? 'blue' : 'grey'} style={{ cursor: 'pointer' }}>
+        <Label key={t.label} onClick={() => this.toggleSelect(t.label)} color={isSelected ? 'blue' : 'grey'} style={{ cursor: 'pointer' }}>
           {t.label}
           { isSelected ? <Icon name='delete' /> : '' }
         </Label>
diff --git a/src/views/DataTable/DataTable.js b/src/views/DataTable/DataTable.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/NoduleList/NoduleList.js b/src/views/NoduleList/NoduleList.js
index c14914d..7500a41 100644
--- a/src/views/NoduleList/NoduleList.js
+++ b/src/views/NoduleList/NoduleList.js
@@ -1,5 +1,5 @@
 import React, { Component } from 'react'
-import { Card, Icon, CardContent } from 'semantic-ui-react'
+import { Card } from 'semantic-ui-react'
 import NoduleListItem from './NoduleListItem'
 import './NoduleList.css'
 
diff --git a/src/views/TableList/TableList.js b/src/views/TableList/TableList.js
index 56f1ec0..4178f44 100644
--- a/src/views/TableList/TableList.js
+++ b/src/views/TableList/TableList.js
@@ -23,7 +23,7 @@ class TableList extends Component {
 
   renderTableListElements = () => {
     const { tables } = this.state
-    const tableListElements = tables.map(t => <TableListItem table={t} /> )
+    const tableListElements = tables.map(t => <TableListItem key={t.id} table={t} /> )
     return tableListElements
   }
 
diff --git a/src/views/TableList/TableListItem.js b/src/views/TableList/TableListItem.js
index d35f982..6113f03 100644
--- a/src/views/TableList/TableListItem.js
+++ b/src/views/TableList/TableListItem.js
@@ -18,12 +18,17 @@ class TableListItem extends Component {
           <Card.Header>{ table.label }</Card.Header>
           <Card.Meta>{`${table.rows.length} rows`}</Card.Meta>
         </Card.Content>
-        <Card.Content
-          extra
+        <Card.Content extra>
+          <span 
           onClick={() => { this.controller.deleteTable(table.id) }}
-          style={{ cursor: 'pointer' }} 
-        >
-          Delete <Icon name='trash' />
+          style={{ cursor: 'pointer' }}>
+            Delete <Icon name='trash' />
+          </span>
+          <span 
+          onClick={() => { this.controller.logExportById(table.id) }}
+          style={{ cursor: 'pointer' }}>
+            View <Icon name='table' />
+          </span>
         </Card.Content>
       </Card>
     )