69 lines
1.7 KiB
JavaScript
69 lines
1.7 KiB
JavaScript
import React, { Component } from "react";
|
|
|
|
import { callAPI } from "../actions/API";
|
|
import Cards from "./Pages/Cards";
|
|
import SideMigrations from "./common/Migrations/SideMigrations";
|
|
|
|
// Homepage/Cards, first API call here to pass down to cards
|
|
// and the pending migration list, if there's no data, nothing will show
|
|
// This would benefit from an error/notification if there is no data
|
|
//
|
|
// Two main components linked here are the Dashboard, and the SideMigrations comp,
|
|
// SideMigrations calls the pending migration list, with its own API call
|
|
// Dashboard performs the rendering of the cards and the numbers from each migration status.
|
|
|
|
export class Home extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
migs: [],
|
|
};
|
|
}
|
|
|
|
componentDidMount() {
|
|
callAPI
|
|
.get()
|
|
.then((request) => {
|
|
this.setState({
|
|
migs: request.data,
|
|
});
|
|
})
|
|
.catch((error) => {
|
|
this.setState({
|
|
error: true,
|
|
});
|
|
});
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div className="container">
|
|
<div className="row">
|
|
<div className="divider"></div>
|
|
|
|
<div className="section">
|
|
<div className="col s7">
|
|
<Cards migs={this.state.migs} />
|
|
</div>
|
|
<div className="col s5">
|
|
<p>Migrations tracker</p>
|
|
</div>
|
|
<div className="divider"></div>
|
|
<div className="section">
|
|
<div className="col s12">
|
|
<SideMigrations />
|
|
</div>
|
|
</div>
|
|
<div className="divider"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default Home;
|
|
|
|
// Broken
|
|
// <SideMigrations migs={this.state.migs} />
|