refact: changed ChartjsChart to CharjsDataset

src/Models/Chart/ChartjsDataset.js

@@ -1,16 +1,12 @@
 import Chart from './Chart.js'
 import { GroupByNodule } from 'lovelacejs'
 
-class ChartJsChart extends Chart {
+class ChartJsDataset extends Chart {
-  constructor (props) {
-    super(props)
-  }
-
   get props () {
 
     const groupByNodule = new GroupByNodule({
       id: this.table.id,
-      label: `${this.table.label} groupedBy something`,
+      label: `${this.table.label} groupedBy ${this.groupByValue}`,
       tables: [this.table],
       groupByValue: this.groupByValue
     }).export()
@@ -30,12 +26,6 @@ class ChartJsChart extends Chart {
         backgroundColor: this._getbackgroundColors()
       }],
     }
-
-    // return [{
-    //   label: this.label,
-    //   data: groupByCounts,
-    //   backgroundColor: this._getbackgroundColors()
-    // }]
   }
 
   _generateRandomRGBNumber () {
@@ -53,4 +43,4 @@ class ChartJsChart extends Chart {
   }
 }
 
-export default ChartJsChart
+export default ChartJsDataset

src/views/Chart/ChartViewer.js

@@ -1,5 +1,5 @@
 import React, { Component } from 'react'
-import ChartJsChart from '../../Models/Chart/ChartjsChart'
+import ChartJsDataset from '../../Models/Chart/ChartjsDataset'
 import FocusTable from '../../Models/FocusTable'
 import { Doughnut } from 'react-chartjs-2'
 import { Dropdown } from 'semantic-ui-react'
@@ -32,14 +32,14 @@ class ChartViewer extends Component {
 
   renderChart = () => {
     if (!this.state.table) return
-    const chart = new ChartJsChart({
+    const chart = new ChartJsDataset({
-      label: 'test chart',
+      label: this.state.label,
       type: 'bar',
       table: this.state.table,
       groupByValue: this.state.groupByValue
     })
 
-    console.log(chart.props)
+    console.log(chart)
 
     return <Doughnut data={chart.props} width={600} height={600} />
   }
@@ -59,7 +59,7 @@ class ChartViewer extends Component {
     return (
       <div className='ChartViewer'>
         <Dropdown
-          placeholder='Select a Comparison Type'
+          placeholder='Select Value to Report'
           fluid
           selection
           options={this.state.headers}