Explanation

src/__tests__/components/chart/HorizontalBarChartCard.test.js

@@ -16,11 +16,7 @@ describe('HorizontalBarChartCard', () => {
   it('renders with empty labels', () => {
     const element = shallow(<HorizontalBarChartCard data={values} labels={[]}/>);
     expect(element).toBeDefined();
-    expect(element.find(ReactApexChart).length).toBe(1);
-
-    const chartProps = element.find(ReactApexChart).props();
-    expect(chartProps.options.xaxis.categories.length).toBe(0);
-    expect(chartProps.series[0].data.length).toBe(5);
+    expect(element.find(ReactApexChart).length).toBe(0);
   });
 
   it('renders with non empty data and label', () => {

src/__tests__/components/explanation/CfFeedback.test.js

@@ -5,7 +5,7 @@ import {retrainResult, cfFeedbackResult, uniqueEncodedDecodedValues} from '../..
 import CfFeedback from '../../../components/explanation/CfFeedback';
 import RetrainResultTable from '../../../components/explanation/RetrainResultTable';
 import {TextField, SelectField} from 'react-md';
-import CfFeedbackResulttTable from '../../../components/explanation/CfFeedbackResulttTable';
+import CfFeedbackResultTable from '../../../components/explanation/CfFeedbackResultTable';
 import {getUniqueFeatureValues, getFeatureNames, encodePatternsForDropdown} from '../../../util/dataReducers';
 
 const onSubmitTopK = jest.fn();
@@ -30,7 +30,7 @@ describe('CfFeedback result', () => {
         element.setState({numberOfDropdownPatterns: 1});
 
         expect(element.find(TextField).length).toBe(1);
-        expect(element.find(CfFeedbackResulttTable).length).toBe(1);
+        expect(element.find(CfFeedbackResultTable).length).toBe(1);
         expect(element.find(RetrainResultTable).length).toBe(1);
         expect(element.find(TextField).at(0).props().min).toBe(0);
         expect(element.find(SelectField).length).toBe(3);
@@ -56,7 +56,7 @@ describe('CfFeedback result', () => {
         element.setState({numberOfDropdownPatterns: 1});
 
         expect(element.find(TextField).length).toBe(1);
-        expect(element.find(CfFeedbackResulttTable).length).toBe(1);
+        expect(element.find(CfFeedbackResultTable).length).toBe(1);
         expect(element.find(RetrainResultTable).length).toBe(1);
         expect(element.find(TextField).at(0).props().min).toBe(0);
         expect(element.find(SelectField).length).toBe(3);

src/__tests__/components/explanation/post_hoc.test.js

@@ -13,7 +13,7 @@ describe('Lime result', () => {
                                     traceId={1}
                                     limeValueList={{labels: [], values: []}}/>);
         expect(element).toBeDefined();
-        expect(element.find(HorizontalBarChartCard).length).toBe(0);
+        expect(element.find(HorizontalBarChartCard).length).toBe(1);
     });
 
     it('renders with data', () => {

src/components/chart/HorizontalBarChartCard.js

@@ -74,7 +74,7 @@ class HorizontalBarChartCard extends React.Component {
       />
     );
 
-    return <div id="chart">{this.props.data.length === 0 ? '' : chart}</div>;
+    return <div id="chart">{this.props.data.length === 0 || this.props.labels.length === 0 ? '' : chart}</div>;
   }
 }
 

src/components/chart/PredictionLineChart.js

@@ -51,7 +51,7 @@ class PredictionLineChart extends React.Component {
               },
               labels: {
                 formatter: function (val, i) {
-                  return val;
+                  return val.toFixed(2);
                 }
               }
             },

src/components/explanation/CfFeedback.js

@@ -3,7 +3,7 @@ import {Card, CardTitle, CardText} from 'react-md/lib/Cards/index';
 import PropTypes from 'prop-types';
 import CircularProgress from 'react-md/lib/Progress/CircularProgress';
 import {TextField} from 'react-md';
-import CfFeedbackResulttTable from './CfFeedbackResulttTable';
+import CfFeedbackResultTable from './CfFeedbackResultTable';
 import SelectField from 'react-md/lib/SelectFields';
 import {Row} from 'react-grid-system';
 import RetrainResultTable from './RetrainResultTable';
@@ -321,7 +321,7 @@ class CfFeedback extends PureComponent {
                     </Row>
                  </div>
                  {!this.props.isCfFeedbackValuesLoaded ? <CircularProgress id="query-indeterminate-progress"/> : null}
-                 <CfFeedbackResulttTable
+                 <CfFeedbackResultTable
                    cfFeedbackResult={this.props.cfFeedbackValue}
                    onSelectedMatrixChange={this.onSelectedMatrixChange.bind(this)}
                    selectedMatrix={this.state.selectedMatrix}

src/components/explanation/CfFeedbackResultTable.js

@@ -47,7 +47,7 @@ class CfFeedbackResultTable extends PureComponent {
       <DataTable baseId="simple-pagination" plain>
         <TableHeader>
           <TableRow selectable={false}>
-            {this.getHeaderColumns(['Matrix', 'Pattern', 'Value'])}
+            {this.getHeaderColumns(['Class', 'Pattern', 'Frequency'])}
           </TableRow>
         </TableHeader>
         <TableBody>

src/components/explanation/post_hoc.js

@@ -22,7 +22,7 @@ const PostHocExplanation = (props) => {
         {!props.isLimeValuesLoaded ? <CircularProgress id="query-indeterminate-progress"/> : null}
         <CardText>
             <div className="md-cell md-cell--12" key="1">
-                {props.limeValueList.values.length > 0 ? horizontalBarChart : null}
+                 {horizontalBarChart}
             </div>
         </CardText>
     </Card>;

src/reducers/Explanation.js

@@ -45,6 +45,7 @@ const explanation = (state = initialState, action) => {
             case LIME_VALUE_LIST_REQUESTED: {
                 return {
                     ...state,
+                    limeValueList: {},
                     fetchState: {inFlight: true},
                     isLimeValuesLoaded: false,
 
@@ -74,6 +75,7 @@ const explanation = (state = initialState, action) => {
             case SHAP_VALUE_LIST_REQUESTED: {
                 return {
                     ...state,
+                    shapValueList: {},
                     fetchState: {inFlight: true},
                     isShapValuesLoaded: false,
 
@@ -103,6 +105,7 @@ const explanation = (state = initialState, action) => {
             case SKATER_VALUE_LIST_REQUESTED: {
                 return {
                     ...state,
+                    skaterValueList: {},
                     fetchState: {inFlight: true},
                     isSkaterValuesLoaded: false,
 
@@ -132,6 +135,7 @@ const explanation = (state = initialState, action) => {
             case ICE_VALUE_LIST_REQUESTED: {
                 return {
                     ...state,
+                    iceValueList: {},
                     fetchState: {inFlight: true},
                     isIceValuesLoaded: false,
 
@@ -161,6 +165,7 @@ const explanation = (state = initialState, action) => {
             case CFFEEDBACK_VALUE_LIST_REQUESTED: {
                 return {
                     ...state,
+                    cfFeedbackValue: {},
                     fetchState: {inFlight: true},
                     isCfFeedbackLoaded: false,
 
@@ -190,6 +195,7 @@ const explanation = (state = initialState, action) => {
             case RETRAIN_VALUE_LIST_REQUESTED: {
                 return {
                     ...state,
+                    retrainValue: {},
                     fetchState: {inFlight: true},
                     isRetrainLoaded: false,