Skip to content

Commit 477f08d

Browse files
alon25alon25
authored
Merge pull request #6 from alon25/staging
Staging
2 parents 4b23a2c + 46b0dcc commit 477f08d

19 files changed

Lines changed: 102 additions & 176 deletions

‎app/charts/latency-chart.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,8 @@ const LatencyChart = (props) => {
3131
},
3232
}]}
3333
layout = {{
34-
width: 500,
35-
height: 500,
34+
height: 400,
35+
width: 400,
3636
paper_bgcolor: '#fffbe0',
3737
plot_bgcolor: '#fffbe0',
3838
showlegend: true,

‎app/charts/memory-chart.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -67,8 +67,8 @@ const MemoryChart = (props) => {
6767
{label: xAxis},
6868
]}
6969
layout = {{
70-
width: 500,
71-
height: 500,
70+
height: 400,
71+
width: 400,
7272
paper_bgcolor: '#fffbe0',
7373
plot_bgcolor: '#fffbe0',
7474
legend: {

‎app/charts/microservice-traffic.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -94,8 +94,8 @@ const MicroServiceTraffic = (props) => {
9494
}]}
9595
layout = {
9696
{
97-
width: 500,
98-
height: 500,
97+
height: 400,
98+
width: 400,
9999
paper_bgcolor: '#fffbe0',
100100
plot_bgcolor: '#fffbe0',
101101
legend: {

‎app/charts/processes-chart.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -71,8 +71,8 @@ const ProcessesChart = (props) => {
7171
{label: communicationLabel},
7272
]}
7373
layout = {{
74-
width: 500,
75-
height: 500,
74+
height: 400,
75+
width: 400,
7676
paper_bgcolor: '#fffbe0',
7777
plot_bgcolor: '#fffbe0',
7878
legend: {

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,8 +41,8 @@ const RequestTypesChart = (props) => {
4141
},
4242
}]}
4343
layout = {{
44-
height: 500,
45-
width: 500,
44+
height: 400,
45+
width: 400,
4646
displaylogo: false,
4747
paper_bgcolor: '#fffbe0',
4848
legend: {

‎app/charts/response-code-chart.jsx‎

Lines changed: 47 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -5,22 +5,20 @@ import CommunicationsContext from '../context/OverviewContext';
55
const ResponseCodeChart = (props) => {
66
const communicationsData = useContext(CommunicationsContext).overviewData;
77

8-
9-
108
const createChart = () => {
119
const responseCodes = {
1210
'100-199': 0,
1311
'200-299': 0,
1412
'300-399': 0,
1513
'400-499': 0,
1614
'500-599': 0,
17-
'NULL': 0,
15+
NULL: 0,
1816
};
1917

2018
for (let i = 0; i < communicationsData.length; i += 1) {
2119
const element = communicationsData[i];
2220
// If Mongo Else SQL
23-
if ((element.currentMicroservice === props.service) && element.resStatus) {
21+
if (element.currentMicroservice === props.service && element.resStatus) {
2422
const statusCode = element.resStatus;
2523
if (statusCode <= 199) {
2624
responseCodes['100-199'] += 1;
@@ -33,9 +31,12 @@ const ResponseCodeChart = (props) => {
3331
} else if (statusCode <= 599) {
3432
responseCodes['500-599'] += 1;
3533
} else {
36-
responseCodes['NULL'] += 1;
34+
responseCodes.NULL += 1;
3735
}
38-
} else if ((element.currentmicroservice === props.service) && element.resstatus) {
36+
} else if (
37+
element.currentmicroservice === props.service &&
38+
element.resstatus
39+
) {
3940
const statusCode = element.resstatus;
4041
if (statusCode <= 199) {
4142
responseCodes['100-199'] += 1;
@@ -48,44 +49,53 @@ const ResponseCodeChart = (props) => {
4849
} else if (statusCode <= 599) {
4950
responseCodes['500-599'] += 1;
5051
} else {
51-
responseCodes['NULL'] += 1;
52+
responseCodes.NULL += 1;
5253
}
5354
}
5455
}
5556

5657
return (
5758
<Plot
58-
data = {[{
59-
values: Object.values(responseCodes),
60-
labels: ['Informational 1xx', 'Successful 2xx', 'Redirection 3xx', 'Client Error 4xx', 'Server Error 5xx'],
61-
type: 'pie',
62-
domain: {y: [0 , 2]},
63-
marker: {
64-
'colors': [
65-
'#f38181',
66-
'#fce38a',
67-
'#fcbad3',
68-
'#95e1d3',
69-
'#a8d8ea',
70-
'#aa96da',
71-
]
72-
}
73-
}]}
74-
layout = {{
75-
height: 500,
76-
width: 500,
77-
displaylogo: false,
78-
paper_bgcolor: '#fffbe0',
79-
legend: {
80-
orientation: 'h',
81-
xanchor: 'center',
82-
x: .5,
83-
y: 5
84-
}
85-
}}
86-
/>)
59+
data={[
60+
{
61+
values: Object.values(responseCodes),
62+
labels: [
63+
'Informational 1xx',
64+
'Successful 2xx',
65+
'Redirection 3xx',
66+
'Client Error 4xx',
67+
'Server Error 5xx',
68+
],
69+
type: 'pie',
70+
domain: { y: [0, 2] },
71+
marker: {
72+
colors: [
73+
'#f38181',
74+
'#fce38a',
75+
'#fcbad3',
76+
'#95e1d3',
77+
'#a8d8ea',
78+
'#aa96da',
79+
],
80+
},
81+
},
82+
]}
83+
layout={{
84+
height: 400,
85+
width: 400,
86+
displaylogo: false,
87+
paper_bgcolor: '#fffbe0',
88+
legend: {
89+
orientation: 'h',
90+
xanchor: 'center',
91+
x: 0.5,
92+
y: 5,
93+
},
94+
}}
95+
/>
96+
);
8797
};
88-
98+
8999
return <div>{createChart()}</div>;
90100
};
91101

‎app/charts/speed-chart.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -50,8 +50,8 @@ const SpeedChart = (props) => {
5050
},
5151
}]}
5252
layout = {{
53-
height: 500,
54-
width: 500,
53+
height: 400,
54+
width: 400,
5555
paper_bgcolor: '#fffbe0',
5656
legend: {
5757
orientation: 'h',

‎app/charts/temperature-chart.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,8 @@ const TemperatureChart = (props) => {
3838
}]}
3939
layout = {
4040
{
41-
width: 500,
42-
height: 500,
41+
height: 400,
42+
width: 400,
4343
paper_bgcolor: '#fffbe0',
4444
plot_bgcolor: '#fffbe0',
4545
legend: {

‎app/components/ServiceDetails.jsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/* eslint-disable react/jsx-one-expression-per-line */
2-
import React, { useState } from 'react';
2+
import React from 'react';
33
// import Modal from './Modal.jsx';
44
import GraphsContainer from '../containers/GraphsContainer.jsx';
55

@@ -8,9 +8,12 @@ const ServiceDetails = (props) => {
88
// Renders health info detail buttons
99
const { service } = props;
1010

11+
//Capitalize service name
12+
const title = service[0].toUpperCase() + service.substring(1);
13+
1114
return (
1215
<div id="serviceDetailsContainer">
13-
<h3 id="microserviceHealthTitle">Microservice Health - {service}</h3>
16+
<h3 id="microserviceHealthTitle">{title}</h3>
1417
<GraphsContainer service={service} />
1518
</div>
1619
);

‎app/containers/DashboardContainer.jsx‎

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,19 +4,14 @@ import SidebarContainer from './SideBarContainer.jsx';
44
import '../stylesheets/dashboard.css';
55

66
const DashboardContainer = () => {
7-
87
const [detailsSelected, setDetails] = useState();
98

109
return (
11-
<div className="servicesDashboardContainer">
10+
<div className="MainDashboardContainer">
1211
<SidebarContainer setDetails={setDetails} />
13-
<div className="databsaseList">
14-
<Monitoring detailsSelected={detailsSelected} />
15-
</div>
12+
<Monitoring detailsSelected={detailsSelected} />
1613
</div>
1714
);
1815
};
1916

2017
export default DashboardContainer;
21-
22-

0 commit comments

Comments
 (0)