OSB-29: starting working on the statistics

.gitattributes

@@ -1855,6 +1855,7 @@ LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList.js -te
 LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationOverview.css -text
 LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationOverview.js -text
 LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationOverview.scss -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationStatistics.js -text
 LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationTestSummary.css -text
 LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationTestSummary.js -text
 LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/header.css -text

LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationStatistics.js

+import React, { Component } from 'react';
+import AutoLoadWrapper from '../utils/autoLoader.js'
+import { unique_id } from '../utils/utils.js'
+import ReactVegaLite from 'react-vega-lite'
+import { Table, Badge, Popover, PopoverHeader, PopoverBody } from 'reactstrap';
+/**
+ * SORow; Class to render the row for a station in the StationOverview.
+ */
+class SORow extends Component {
+    render() {
+
+        return (
+            <tr  className="hoverable">
+                <th scope="row">{ "ciao" }</th>
+            </tr>
+        );
+    }
+}
+
+class StationStatisticsC extends Component {
+    getErrorsPerStation() {
+        if(this.props.data.errors_per_station !== undefined){
+            return {values:this.props.data.errors_per_station};
+        }
+    }
+
+    getErrorsPerType() {
+        if(this.props.data.errors_per_type !== undefined){
+            return {values:this.props.data.errors_per_type};
+        }
+    }
+
+    getErrorsPerTypeSpec(){
+        return {"$schema": "https://vega.github.io/schema/vega-lite/v2.json",
+                "mark": "bar",
+                "encoding": {
+                    "x": {
+                        "field": "time",
+                        "type": "ordinal",
+                        "axis": {"title": "day"}
+                    },
+                    "y": {
+                        "field": "n_errors",
+                        "type": "quantitative",
+                        "axis": {"title": "number of errors"}
+                    },
+                    "color": {
+                        "field": "error_type",
+                        "type": "nominal"
+                    }
+            }
+        }
+    }
+    render() {
+        return (
+            <div className="station-statistics-ctrl">
+                <ReactVegaLite spec={this.getErrorsPerTypeSpec()}
+                 data={this.getErrorsPerType()} />
+            </div>
+        );
+    }
+}
+/* Add some magic; use the AutoLoadWrapper to create a HOC that handles the
+   auto-loading of the data for StationOverviewC.
+ */
+const StationStatistics = AutoLoadWrapper(StationStatisticsC);
+
+export default StationStatistics;