fixes

admin/server/controllers/systems.js

@@ -13,7 +13,6 @@ exports.isLoggedIn = function (req, res, next) {
 // -------------------------------------------
 
 exports.listSystems = async function (req, res, next) {
-  console.log("Listing Systems for: " + req.user._id);
   const userId = new mongoose.Types.ObjectId(req.user._id);
   const systems = await System.find({ userId: userId }).exec();
   if (systems == null) {
@@ -69,7 +68,6 @@ exports.listSystems = async function (req, res, next) {
   const stats = await SystemStat.find({ shortName: { $in: shortNames } }).exec();
   var sys_stats = {}
   for (var i = 0; i < stats.length; i++) {
-    console.log(stats[i])
     sys_stats[stats[i].shortName] = {
       uploadErrors: stats[i].uploadErrors,
       callTotals: stats[i].callTotals,
@@ -78,7 +76,6 @@ exports.listSystems = async function (req, res, next) {
     };
   }
 
-  console.log(sys_stats["test"]);
   res.json({
     success: true,
     systems: returnSys,

admin/src/System/CallChart.js

@@ -17,7 +17,7 @@ const CallChart = (props) => {
   }
 
   var callTotals = callData.callTotals;
-  var errorTotals = callData.errorTotals;
+  var uploadErrors = callData.uploadErrors;
 
   // Define the graph dimensions and margins
   const width = props.width;
@@ -50,6 +50,7 @@ const CallChart = (props) => {
       });
   }
 
+
   return (
     <svg width={width} height={height}>
       <Group left={margin.left} top={margin.top}>
@@ -59,13 +60,18 @@ const CallChart = (props) => {
           data={callTotals}
           x={x}
           y={y}
+          xScale={xScale}
+          yScale={yScale}
           strokeWidth={2}
+          stroke="#333"
           curve={curveStep}
         />
         <LinePath
-          data={errorTotals}
+          data={uploadErrors}
           x={x}
           y={y}
+          xScale={xScale}
+          yScale={yScale}
           strokeWidth={2}
           stroke="red"
           curve={curveStep}

admin/src/System/ErrorChart.js

@@ -5,11 +5,22 @@ import { scaleLinear, scaleTime, scaleOrdinal } from '@visx/scale';
 import { timeParse, timeFormat } from 'd3-time-format';
 import { AxisBottom, AxisLeft } from '@visx/axis';
 import { Loader } from "semantic-ui-react";
-import { LegendOrdinal} from '@visx/legend';
+import {
+  Legend,
+  LegendLinear,
+  LegendQuantile,
+  LegendOrdinal,
+  LegendSize,
+  LegendThreshold,
+  LegendItem,
+  LegendLabel,
+} from '@visx/legend';
 class ErrorChart extends Component {
 
 
   render() {
+
+const legendGlyphSize = 15;
     var errorData = this.props.data;
     if (!errorData) {
       return (
@@ -105,13 +116,35 @@ class ErrorChart extends Component {
           <LegendOrdinal
             scale={zScale}
             labelMargin="0 15px 0 0"
+            orientation="horizontal"
             onMouseOver={data => event => {
               console.log(
                 `mouse over: ${data.text}`,
                 `index: ${data.index}`,
               );
             }}
-          />
+          >
+          {(labels) => (
+            <div style={{ display: 'flex', flexDirection: 'row' }}>
+              {labels.map((label, i) => (
+                <LegendItem
+                  key={`legend-quantile-${i}`}
+                  margin="0 5px"
+              
+                >
+                  <svg width={legendGlyphSize} height={legendGlyphSize}>
+                    <rect fill={label.value} width={legendGlyphSize} height={legendGlyphSize} />
+                  </svg>
+                  <LegendLabel align="left" margin="0 0 0 4px">
+                    {label.text}
+                  </LegendLabel>
+                </LegendItem>
+              ))}
+            </div>
+          )}
+
+
+          </LegendOrdinal>
         </div>
       </div>
 

admin/src/System/System.js

@@ -39,11 +39,12 @@ const System = () => {
   const [groupVisible, setGroupVisible] = useState(false);
   const [editGroupId, setEditGroupId] = useState(false);
   const [errorData, setErrorData] = useState({});
-  const [callData, setCallData] = useState({});
+  const [callStatistics, setCallStatistics] = useState({});
   const [groupOrder, setGroupOrder] = useState([]);
 
 
-  const processErrors = (errors) => {
+  const processErrors = (statistics) => {
+    const errors = statistics.decodeErrorsFreq;
     var allData = [];
 
     var num = 0;
@@ -53,21 +54,25 @@ const System = () => {
     var minValue = 0;
     var maxValue = 0;
     var legend = [];
-    for (var j = 0; j < errors.length; j++) {
+    var MS_PER_MINUTE = 60000;
+    for (const freq in errors) {
+      const freqErrors = errors[freq];
       var data = [];
-      for (var i = 0; i < errors[j].values.length; i++) {
-        var time = new Date(errors[j].values[i].time);
-        if (errors[j].values[i].errors > maxValue)
-          maxValue = errors[j].values[i].errors;
+      for (var i = 0; i < freqErrors.errorHistory.length; i++) {
+        let spotsBack = freqErrors.errorHistory.length - i;
+        let time = new Date(now - spotsBack * 15 * MS_PER_MINUTE);
         if (time < minDate) minDate = time;
+        
+        if (freqErrors.errorHistory[i] > maxValue)
+          maxValue = freqErrors.errorHistory[i];
         var value = {
           id: num++,
-          y: errors[j].values[i].errors,
+          y: freqErrors.errorHistory[i],
           x: time
         };
         data.push(value);
       }
-      const id = Math.floor(errors[j]._id / 1000) / 1000 + "MHz";
+      const id = Math.floor(freq / 1000) / 1000 + "MHz";
       legend.push(id);
       var obj = {
         id: id,
@@ -116,16 +121,16 @@ const System = () => {
           maxValue = statistic.uploadErrors[j];
         uploadErrors.push({ x: time, y: statistic.uploadErrors[j] });
       }
-      const callData = {
+      const data = {
         minDate: minDate,
         maxDate: maxDate,
         minValue: minValue,
         maxValue: maxValue,
         callTotals: callTotals,
-        errorTotals: uploadErrors
+        uploadErrors: uploadErrors
       };
 
-      setCallData(callData);
+      setCallStatistics(data);
     }
   }
 
@@ -235,6 +240,7 @@ const System = () => {
   useEffect(() => {
     if (isSystemsSuccess) {
       processStatistics(systemsData.stats[shortName])
+      processErrors(systemsData.stats[shortName])
     }
   }, [isSystemsSuccess]);
 /*
@@ -492,7 +498,7 @@ const System = () => {
             <Icon name="microphone" />
             24-Hour Call History
           </Divider>
-          <CallChart data={callData} />
+          <CallChart data={callStatistics} />
           <Divider horizontal>
             <Icon name="microphone" />
             Hourly Vocoder Error Percentage