Skip to content

Commit

Permalink
Add history graph (#51)
Browse files Browse the repository at this point in the history
  • Loading branch information
rafaveira3 authored and joserenatosilva committed Oct 15, 2019
1 parent 1fa4150 commit 39d47ef
Show file tree
Hide file tree
Showing 3 changed files with 270 additions and 8 deletions.
2 changes: 1 addition & 1 deletion src/App.css
Original file line number Diff line number Diff line change
Expand Up @@ -53,5 +53,5 @@ license that can be found in the LICENSE file.
color:#6e6e6e;
font-size: 20px;
width: 100%;
padding-top: 5%;
padding-top: 1%;
}
250 changes: 244 additions & 6 deletions src/components/Dashboard.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ const huskyCIAnalysisRoute = `${huskyCIAPIAddress}/stats/analysis`;
const huskyCILanguageRoute = `${huskyCIAPIAddress}/stats/language`;
const huskyCIContainerRoute = `${huskyCIAPIAddress}/stats/container`;
const huskyCIRepositoryRoute = `${huskyCIAPIAddress}/stats/repository`;
const huskyCIHistoryAnalysisRoute = `${huskyCIAPIAddress}/stats/historyanalysis?time_range=today`;
const huskyCISeverityRoute = `${huskyCIAPIAddress}/stats/severity`;

const colorBlue = "#4fc0e8";
Expand Down Expand Up @@ -75,6 +76,58 @@ class Dashboard extends Component {
snackOpen: false,
variantValue: "",
snackMessage: "",
passingList: [
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
],
failingList: [
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
],
};
this.timeoutID = 0;
this.refreshCharts();
Expand All @@ -95,6 +148,8 @@ class Dashboard extends Component {
this.openSnack("error", "Service is unavailable");
return response.status;
}

// get authors metrics
if (huskyRoute === huskyCIAuthorRoute) {
response.json().then(authorResultJSON => {
if (Array.isArray(authorResultJSON) && authorResultJSON.length) {
Expand All @@ -106,6 +161,8 @@ class Dashboard extends Component {
}
});
}

// get Analysis metrics + Results graph
if (huskyRoute === huskyCIAnalysisRoute) {
response.json().then(analysisResultJSON => {
let [
Expand Down Expand Up @@ -147,6 +204,98 @@ class Dashboard extends Component {
}
});
}

// get History graph
if (huskyRoute === huskyCIHistoryAnalysisRoute) {
response.json().then(historyResultJSON => {
const [newPassingList, newFailingList] = [
[
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
],
[
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
],
];

Object.keys(historyResultJSON).forEach(key => {
const rawDateJSON = Date.parse(historyResultJSON[key].date);
const hour = new Date(rawDateJSON).getHours();

historyResultJSON[key].results.forEach(currentResult => {
if (currentResult.result === "passed") {
newPassingList[hour] = currentResult.count;
}

if (currentResult.result === "failed") {
newFailingList[hour] = currentResult.count;
}
});
});

const { passingList } = this.state;
const { failingList } = this.state;

if (!_.isEqual(passingList, newPassingList)) {
this.setState({
passingList: newPassingList,
});
}

if (!_.isEqual(failingList, newFailingList)) {
this.setState({
failingList: newFailingList,
});
}
});
}

// get languages graph
if (huskyRoute === huskyCILanguageRoute) {
let [
numGolangResult,
Expand Down Expand Up @@ -181,6 +330,8 @@ class Dashboard extends Component {
}
});
}

// get severity graph
if (huskyRoute === huskyCISeverityRoute) {
let [numNosec, numLow, numMedium, numHigh] = [0, 0, 0, 0];
response.json().then(severityResultJSON => {
Expand Down Expand Up @@ -210,6 +361,8 @@ class Dashboard extends Component {
}
});
}

// get container graph
if (huskyRoute === huskyCIContainerRoute) {
let [
numGosecResult,
Expand Down Expand Up @@ -254,6 +407,8 @@ class Dashboard extends Component {
}
});
}

// get repositories metrics
if (huskyRoute === huskyCIRepositoryRoute) {
let newRepositoryResult = 0;
response.json().then(repositoryResultJSON => {
Expand All @@ -264,8 +419,10 @@ class Dashboard extends Component {
}
});
}

return response.status;
})

.catch(() => {
this.openSnack("error", "Service is unavailable");
return 500;
Expand Down Expand Up @@ -295,6 +452,7 @@ class Dashboard extends Component {
huskyCILanguageRoute,
huskyCISeverityRoute,
huskyCIRepositoryRoute,
huskyCIHistoryAnalysisRoute,
];
huskyCIRoutes.map(async huskyRoute => {
const status = await this.callHuskyAPI(huskyRoute);
Expand Down Expand Up @@ -332,7 +490,7 @@ class Dashboard extends Component {
const numWarningFound = [resultsAnalysis.warning];
const numPassedFound = [resultsAnalysis.passed];
const numErrorFound = [resultsAnalysis.error];
const infoAnalysis = {
const infoStatus = {
labels: ["Failed", "Warning", "Passed", "Error"],
datasets: [
{
Expand Down Expand Up @@ -375,14 +533,88 @@ class Dashboard extends Component {
};

const { numAuthors } = this.state;

const { numAnalysis } = this.state;

const { repositories } = this.state;

const { snackOpen } = this.state;
const { variantValue } = this.state;
const { snackOpen } = this.state;
const { snackMessage } = this.state;
const { failingList } = this.state;
const { passingList } = this.state;

const infoHistoryAnalysis = {
labels: [
"00:00h",
"01:00h",
"02:00h",
"03:00h",
"04:00h",
"05:00h",
"06:00h",
"07:00h",
"08:00h",
"09:00h",
"10:00h",
"11:00h",
"12:00h",
"13:00h",
"14:00h",
"15:00h",
"16:00h",
"17:00h",
"18:00h",
"19:00h",
"20:00h",
"21:00h",
"22:00h",
"23:00h",
],
datasets: [
{
label: "Passing Analyses",
fill: false,
lineTension: 0.1,
borderWidth: 5,
backgroundColor: colorGreen,
borderColor: colorGreenHover,
borderCapStyle: "butt",
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: "miter",
pointBorderColor: colorGreenHover,
pointBackgroundColor: "#fff",
pointBorderWidth: 4,
pointHoverRadius: 5,
pointHoverBackgroundColor: colorGreen,
pointHoverBorderColor: colorGreenHover,
pointHoverBorderWidth: 4,
pointRadius: 3,
pointHitRadius: 10,
data: passingList,
},
{
label: "Failing Analyses",
fill: false,
lineTension: 0.1,
borderWidth: 5,
backgroundColor: colorRed,
borderColor: colorRedHover,
borderCapStyle: "butt",
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: "miter",
pointBorderColor: colorRedHover,
pointBackgroundColor: "#fff",
pointBorderWidth: 4,
pointHoverRadius: 5,
pointHoverBackgroundColor: colorRed,
pointHoverBorderColor: colorRedHover,
pointHoverBorderWidth: 4,
pointRadius: 3,
pointHitRadius: 10,
data: failingList,
},
],
};

return (
<div>
Expand All @@ -398,9 +630,15 @@ class Dashboard extends Component {
</Grid>
</Grid>

<Grid container spacing={3} style={{ padding: "0rem 1rem 0rem 1rem" }}>
<Grid item xs={12} sm={12}>
<Graph data={infoHistoryAnalysis} type={GraphType.Line} />
</Grid>
</Grid>

<Grid container spacing={3} style={{ padding: "1rem" }}>
<Grid item xs={12} md={4}>
<Graph data={infoAnalysis} type={GraphType.Pie} />
<Graph data={infoStatus} type={GraphType.Pie} />
</Grid>
<Grid item xs={12} md={4}>
<Graph data={infoLanguages} type={GraphType.Bar} />
Expand Down
Loading

0 comments on commit 39d47ef

Please sign in to comment.