Skip to content

Commit 91ac1c0

Browse files
jenaepenjenaepen
authored
Merge pull request #1 from ben-mizel/dev
Dev
2 parents b34f331 + 08dc0a0 commit 91ac1c0

37 files changed

Lines changed: 12274 additions & 788 deletions

‎Main.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ ipcMain.on('submit', (message, newService) => {
5959
encoding: 'UTF-8',
6060
}),
6161
);
62-
// if statement is used to remove hard coded data.
62+
// if statement is used to replace hard coded data. Hard coded data and the michelleWasHere key is needed to avoid a load error caused by Electron querying the database before a user has added or selected a database.
6363
if (state.michelleWasHere) {
6464
state.setupRequired = false;
6565
state.michelleWasHere = false;
@@ -134,7 +134,6 @@ ipcMain.on('detailsRequest', (message, index) => {
134134
message.sender.send('detailsResponse', JSON.stringify(err));
135135
}
136136
const queryResults = JSON.stringify(data);
137-
console.log('QUERY RESULTS =>', queryResults);
138137
// Asynchronous event emitter used to transmit query results back to the render process.
139138
message.sender.send('detailsResponse', queryResults);
140139
});

test/spec.js renamed to __tests__/spec.js

File renamed without changes.

test.js renamed to __tests__/test.js

File renamed without changes.

‎app/charts/detail-chart-template.jsx‎

Lines changed: 0 additions & 50 deletions
This file was deleted.

‎app/charts/latency-chart.jsx‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import React, { useContext } from 'react';
2+
import { Line } from 'react-chartjs-2';
3+
import HealthContext from '../context/DetailsContext';
4+
5+
const LatencyChart = (props) => {
6+
const xAxis = [];
7+
const yAxis = [];
8+
const healthData = useContext(HealthContext).detailData;
9+
for (let i = 0; i < healthData.length; i++) {
10+
const element = healthData[i];
11+
if (element.currentmicroservice === props.service || element.currentMicroservice === props.service) {
12+
xAxis.push(i);
13+
yAxis.push(element.latency);
14+
}
15+
}
16+
const chartData = {
17+
datasets: [
18+
{
19+
label: `CPU latency of ${props.service}`,
20+
data: yAxis,
21+
backgroundColor: ['rgb(254, 255, 0)'],
22+
},
23+
],
24+
options: {
25+
xAxisID: 'TBD',
26+
yAxisID: 'TBD',
27+
},
28+
labels: xAxis,
29+
};
30+
return (
31+
<div>
32+
<Line data={chartData} />
33+
</div>
34+
);
35+
};
36+
37+
export default LatencyChart;

‎app/charts/memory-chart.jsx‎

Lines changed: 32 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,79 +1,69 @@
11
import React, { useContext } from 'react';
2-
import { Line } from 'react-chartjs-2';
2+
import { Bar } from 'react-chartjs-2';
33
import HealthContext from '../context/DetailsContext';
44

5-
const MemoryChart = () => {
6-
const healthData = useContext(HealthContext);
7-
// const health = healthData.detailData;
5+
const MemoryChart = (props) => {
6+
const healthData = useContext(HealthContext).detailData;
87

98
const createChart = () => {
10-
let free = [];
11-
let used= [];
12-
let active = [];
13-
let total = [];
9+
const xAxis = [];
10+
const free = [];
11+
const used = [];
12+
const active = [];
13+
const total = [];
1414

1515
for (let i = 0; i < healthData.length; i += 1) {
16+
xAxis.push(i);
1617
// If Mongo
17-
if (healthData[i].freeMemory && healthData[i].activeMemory && healthData[i].usedMemory && healthData[i].totalMemory) {
18+
if (healthData[i].currentMicroservice === props.service) {
1819
free.push(healthData[i].freeMemory);
1920
active.push(healthData[i].activeMemory);
2021
used.push(healthData[i].usedMemory);
2122
total.push(healthData[i].totalMemory);
22-
} else {
23+
}
24+
25+
// If SQL
26+
if (healthData[i].currentmicroservice === props.service) {
2327
free.push(healthData[i].freememory);
2428
active.push(healthData[i].activememory);
2529
used.push(healthData[i].usedmemory);
2630
total.push(healthData[i].totalmemory);
2731
}
2832
}
2933

30-
31-
32-
const memoryObj = {
33-
freeMem: free,
34-
usedMem: used,
35-
activeMem: active,
36-
totalMem: total
37-
}
38-
3934
const chartData = {
4035
datasets: [
4136
{
42-
label: "Free Memory",
43-
data: Object.values(memoryObj.freeMem),
44-
backgroundColor: [
45-
"rgb(2, 210, 249)"
46-
]
37+
label: 'Free Memory',
38+
backgroundColor: 'rgb(2, 210, 249)',
39+
data: free,
40+
// showLine: true,
4741
},
4842
{
49-
label: "Used Memory",
50-
data: Object.values(memoryObj.usedMem),
51-
backgroundColor: [
52-
"rgb(198, 42, 177)",
53-
]
43+
label: 'Used Memory',
44+
backgroundColor: 'rgb(239, 91, 145)',
45+
data: used,
46+
// showLine: true,
5447
},
5548
{
56-
label: "Active Memory",
57-
data: Object.values(memoryObj.activeMem),
58-
backgroundColor: [
59-
"rgb(252, 170, 52)"
60-
]
49+
label: 'Active Memory',
50+
backgroundColor: 'rgb(182, 219, 26)',
51+
data: active,
52+
// showLine: true,
6153
},
6254
{
63-
label: "Total Memory",
64-
data: Object.values(memoryObj.activeMem),
65-
backgroundColor: [
66-
"rgb(239, 91, 145)"
67-
]
55+
label: 'Total Memory',
56+
backgroundColor: 'rgb(252, 170, 52)',
57+
data: total,
58+
// showLine: true,
6859
},
6960
],
70-
labels: ["Free Memory", "Active Memory", "Used Memory", "Total Memory"]
61+
labels: xAxis,
7162
};
7263

73-
return <Line data={chartData} />;
64+
return <Bar data={chartData} />;
7465
};
7566

76-
// Return div with helper function invoked
7767
return <div>{createChart()}</div>;
7868
};
7969

‎app/charts/processes-chart.jsx‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
import React, { useContext } from 'react';
2+
import { Bar } from 'react-chartjs-2';
3+
import HealthContext from '../context/DetailsContext';
4+
5+
const ProcessesChart = (props) => {
6+
const healthData = useContext(HealthContext).detailData;
7+
const createChart = () => {
8+
const communicationLabel = [];
9+
const totalProcesses = [];
10+
const runningProcesses = [];
11+
const blockedProcesses = [];
12+
const sleepingProcesses = [];
13+
14+
for (let i = 0; i < healthData.length; i += 1) {
15+
const element = healthData[i];
16+
// If using a SQL Database
17+
if (element.currentmicroservice === props.service) {
18+
communicationLabel.push(i);
19+
totalProcesses.push(element.totalnumprocesses);
20+
runningProcesses.push(element.numrunningprocesses);
21+
blockedProcesses.push(element.numblockedprocesses);
22+
sleepingProcesses.push(element.numsleepingprocesses);
23+
}
24+
// If using a Mongo Database
25+
if (element.currentMicroservice === props.service && element.cpuCurrentSpeed) {
26+
communicationLabel.push(i);
27+
totalProcesses.push(element.numTotalProcesses);
28+
runningProcesses.push(element.numRunningProcesses);
29+
blockedProcesses.push(element.numBlockedProcesses);
30+
sleepingProcesses.push(element.numSleepingProcesses);
31+
}
32+
}
33+
34+
const chartData = {
35+
datasets: [{
36+
label: 'Blocked Processes',
37+
backgroundColor: 'rgb(198, 42, 177)',
38+
data: blockedProcesses,
39+
}, {
40+
label: 'Sleeping Processes',
41+
backgroundColor: 'rgb(252, 170, 52)',
42+
data: sleepingProcesses,
43+
}, {
44+
label: 'Running Processes',
45+
backgroundColor: 'rgb(239, 91, 145)',
46+
data: runningProcesses,
47+
}, {
48+
label: 'Total Processes',
49+
backgroundColor: 'rgb(182, 219, 26)',
50+
data: totalProcesses,
51+
}],
52+
labels: communicationLabel,
53+
};
54+
55+
return <Bar data={chartData} />;
56+
};
57+
58+
return <div>{createChart()}</div>;
59+
};
60+
61+
export default ProcessesChart;

‎app/charts/request-type-chart.jsx‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,8 @@ import React, { useContext } from 'react';
22
import { Doughnut } from 'react-chartjs-2';
33
import CommunicationsContext from '../context/OverviewContext';
44

5-
const RequestTypesChart = () => {
6-
const communicationsData = useContext(CommunicationsContext);
7-
const communications = communicationsData.overviewData;
5+
const RequestTypesChart = (props) => {
6+
const communicationsData = useContext(CommunicationsContext).overviewData;
87

98
const createRequestChart = () => {
109
const requestObj = {
@@ -16,18 +15,17 @@ const RequestTypesChart = () => {
1615
PUT: 0,
1716
};
1817

19-
for (let i = 0; i < communications.length; i += 1) {
20-
const element = communications[i];
18+
for (let i = 0; i < communicationsData.length; i += 1) {
19+
const element = communicationsData[i];
2120
// if Mongo
22-
if (element.reqType in requestObj) requestObj[element.reqType] += 1;
21+
if (element.currentMicroservice === props.service && element.reqType in requestObj) requestObj[element.reqType] += 1;
2322
// if SQL
24-
else if (element.reqtype in requestObj) requestObj[element.reqtype] += 1;
23+
else if (element.currentmicroservice === props.service && element.reqtype in requestObj) requestObj[element.reqtype] += 1;
2524
}
2625

2726
const chartData = {
2827
datasets: [
2928
{
30-
label: 'Breakdown of Requests by Type',
3129
data: Object.values(requestObj),
3230
backgroundColor: [
3331
'rgb(2, 210, 249)',

0 commit comments

Comments
 (0)