Changed table pages into generic

src/components/App.js

@@ -2,9 +2,8 @@ import React, { Component } from "react";
 import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
 
 // Routes
-import Upcoming from "./root/Pages/Upcoming";
 import Migrations from "./root/Pages/Migrations";
-import Historical from "./root/Pages/Historical";
+import GenericList from "./root/Pages/GenericList";
 import Reports from "./root/Pages/Reports";
 import Book from "./root/Pages/Book";
 import IDSingle from "./root/Pages/IDSingle";
@@ -12,6 +11,7 @@ import IDSingle from "./root/Pages/IDSingle";
 import Home from "./root/Home";
 import Navigation from "./root/Navigation";
 
+
 // Main app component, react-router comes from here,
 // and links to all of the sub pages
 
@@ -24,11 +24,27 @@ class App extends Component {
           <Switch>
             <Route exact path="/" component={Home} />
             <Route exact path="/book" component={Book} />
-            <Route exact path="/upcoming-migrations" component={Upcoming} />
             <Route exact path="/migrations" component={Migrations} />
             <Route exact path="/reports" component={Reports} />
-            <Route exact path="/historical-migrations" component={Historical} />
             <Route path="/migrations/:migrationId" component={IDSingle} />
+            <Route exact path="/upcoming-migrations" render={(props) => (
+              <GenericList {...props} APILINK="/pending/" />
+            )} />
+            <Route exact path="/missed" render={(props) => (
+              <GenericList {...props} APILINK="/missed/" />
+            )} />
+            <Route exact path="/completed" render={(props) => (
+              <GenericList {...props} APILINK="/completed/" />
+            )} />
+            <Route exact path="/pending-terminations" render={(props) => (
+              <GenericList {...props} APILINK="/pendingterm/" />
+            )} />
+            <Route exact path="/all-terminations" render={(props) => (
+              <GenericList {...props} APILINK="/waitingterm/" />
+            )} />
+            <Route exact path="/historical-migrations" render={(props) => (
+              <GenericList {...props} APILINK="/all/" />
+            )} />
           </Switch>
         </div>
       </Router>

src/components/root/Pages/GenericList.js

@@ -3,13 +3,13 @@ import CompTable from "../common/Tables/CompTable";
 import { callAPI } from "../../actions/API"
 import Error from "../../actions/Error";
 
-// Upcoming parent page,
+// Missing parent page,
 // Most of the good stuff is happening in UpcomingSingle, which does the
 // main rendering of the table,
 // may want to eventually do the API call here, to re-use the table
 // instead of duplicating it.
 
-class Upcoming extends Component {
+class GenericList extends Component {
   constructor(props) {
     super(props);
     this.state = {
@@ -18,8 +18,9 @@ class Upcoming extends Component {
   }
 
   renderItems() {
+      console.log(this.props.APILINK)
     if (!this.state.error) {
-      return <CompTable data={callAPI('/pending/')} />;
+      return <CompTable data={callAPI(this.props.APILINK)} />;
     } else {
       console.log("error");
       return <Error />;
@@ -43,4 +44,4 @@ class Upcoming extends Component {
   }
 }
 
-export default Upcoming;
+export default GenericList;

src/components/root/Pages/Historical.js

@@ -1,47 +0,0 @@
-import React, { Component } from "react";
-
-import { callAPI } from "../../actions/API";
-import CompTable from "../common/Tables/CompTable";
-import Error from "../../actions/Error";
-
-// Parent page for the /historical-migrations page,
-// is referenced in the react route, and calls the main table using
-// HIstoricalSingle,
-// All migrations are called, and can be searched
-// It actuall does error reporting, using `renderItems`
-
-class Historical extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      error: false,
-    };
-  }
-
-  renderItems() {
-    if (!this.state.error) {
-      return <CompTable data={callAPI('/all/')} />;
-    } else {
-      console.log("error");
-      return <Error />;
-    }
-  }
-
-  render() {
-    return (
-      <div className="row">
-        <div className="divider"></div>
-        <div className="section">
-          <div className="col s12"></div>
-        </div>
-        <div className="divider"></div>
-        <div className="section">
-          <div className="col s12">{this.renderItems()}</div>
-        </div>
-        <div className="divider"></div>
-      </div>
-    );
-  }
-}
-
-export default Historical;

src/components/root/Pages/Reports.js

@@ -1,4 +1,6 @@
 import React, { Component } from "react";
+import { Link } from "react-router-dom";
+
 
 // This page was should hold a way to generate reports/lists of
 // Migrations in varied statuses.
@@ -7,7 +9,10 @@ export default class Reports extends Component {
   render() {
     return (
       <div>
-        <h1>Reports</h1>
+        <Link to="/missed">Missed migrations</Link><p />
+        <Link to="/pending-terminations">Upcoming Terminations</Link><p />
+        <Link to="/all-terminations">All waiting terminations</Link><p />
+        <Link to="/completed">Completed Migrations</Link><p />
       </div>
     );
   }