src/components/App.js

@@ -37,17 +37,14 @@ class App extends Component {
               <GenericList {...props} APILINK="/completed/" />
             )} />
             <Route exact path="/pending-terminations" render={(props) => (
-              <GenericList {...props} APILINK="/waitingterm/" />
+              <GenericList {...props} APILINK="/pendingterm/" />
             )} />
             <Route exact path="/all-terminations" render={(props) => (
-              <GenericList {...props} APILINK="/pendingterm/" />
+              <GenericList {...props} APILINK="/waitingterm/" />
             )} />
             <Route exact path="/historical-migrations" render={(props) => (
               <GenericList {...props} APILINK="/all/" />
             )} />
-            <Route exact path="/booked" render={(props) => (
-              <GenericList {...props} APILINK="/booked/" />
-            )} />
           </Switch>
         </div>
       </Router>

src/components/root/Navigation.js

@@ -1,5 +1,5 @@
 import React, { Component } from "react";
-import { Link as a } from "react-router-dom";
+import { Link } from "react-router-dom";
 import InLineSearch from "./common/Functionality/InlineSearchBar";
 
 // Navbar class component, Just simple href's to retain styling
@@ -12,24 +12,24 @@ export class Navigation extends Component {
           <div className="nav-wrapper">
             <ul className="left">
               <li>
-                <a className="active" href="/">
+                <Link className="active" to="/">
                   Dashboard
-                </a>
+                </Link>
               </li>
               <li>
-                <a href="/upcoming-migrations">Upcoming Migrations</a>
+                <Link to="/upcoming-migrations">Upcoming Migrations</Link>
               </li>
               {/* <li>
                 <Link to="/migrations">Migrations</Link>
               </li> */}
               <li>
-                <a href="/reports" className="hide-on-med-and-down">Reports</a>
+                <Link to="/reports" className="hide-on-med-and-down">Reports</Link>
               </li>
               <li>
-                <a href="/historical-migrations" className="hide-on-med-and-down">Historical Migrations</a>
+                <Link to="/historical-migrations" className="hide-on-med-and-down">Historical Migrations</Link>
               </li>
               <li className="orange accent-4 active">
-                <a href="/book">Book</a>
+                <Link to="/book">Book</Link>
               </li>
             </ul>
             {/* Inline UUID search bar is here */}

src/components/root/Pages/Cards.js

@@ -5,14 +5,11 @@ import React, { Component } from "react";
 // is referenced on Home
 
 class Cards extends Component {
-  upcomingMig() {
-    return this.props.migs["upcoming_count"];
-  }
   bookedMig() {
-    return this.props.migs["booked_count"]
+    return this.props.migs["booked_count"];
   }
   waitingMig() {
-    return this.props.migs["pendterm_count"];
+    return this.props.migs["awaitterm_count"];
   }
   completedMig() {
     return this.props.migs["complete_count"];
@@ -32,10 +29,10 @@ class Cards extends Component {
           <div className="card grey darken-1">
             <div className="card-content white-text">
               <span className="card-title"></span>
-              {this.upcomingMig()}
+              {this.bookedMig()}
             </div>
             <div className="card-action">
-              <a href="/upcoming-migrations">upcoming</a>
+              <a href="/upcoming-migrations">booked</a>
             </div>
           </div>
         </div>
@@ -43,10 +40,23 @@ class Cards extends Component {
           <div className="card grey darken-1">
             <div className="card-content white-text">
               <span className="card-title"></span>
-              {this.bookedMig()}
+              <p></p>
+              {this.waitingMig()}
             </div>
             <div className="card-action">
-              <a href="/booked">booked</a>
+              <a href="/pending-terminations">waiting</a>
+            </div>
+          </div>
+        </div>
+
+        <div className="col s6 m4">
+          <div className="card grey darken-1">
+            <div className="card-content white-text">
+              <span className="card-title"></span>
+              {this.completedMig()}
+            </div>
+            <div className="card-action">
+              <a href="/completed">complete</a>
             </div>
           </div>
         </div>
@@ -61,18 +71,6 @@ class Cards extends Component {
             </div>
           </div>
         </div>
-        <div className="col s6 m4">
-          <div className="card grey darken-1">
-            <div className="card-content white-text">
-              <span className="card-title"></span>
-              <p></p>
-              {this.waitingMig()}
-            </div>
-            <div className="card-action">
-              <a href="/pending-terminations">pending term</a>
-            </div>
-          </div>
-        </div>
       </div>
     );
   }

src/components/root/Pages/Reports.js

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

src/components/root/common/Tables/CompTable.js

@@ -14,7 +14,7 @@ import ToolkitProvider, {
 const CompTable = (props) => {
   const [list, setList] = useState([]);
   const [loading, setLoading] = useState(false);
-
+  const [ticURl, setURL] = useState(null)
   const { SearchBar } = Search;
   const { ExportCSVButton } = CSVExport;
   const sizePerPageRenderer = ({
@@ -89,14 +89,9 @@ const CompTable = (props) => {
       formatter: (cell, row) => (
         <a
           href={
-            row.brand === "VentraIP"
+            row.brand === "VentraIP" ? "https://helpdesk.ventraip.com.au/profiles/ticket/" + row.ticket_id 
-              ? "https://helpdesk.ventraip.com.au/profiles/ticket/" +
+            : row.brand === "Zuver" ? "https://helpdesk.zuver.net.au/profiles/ticket/" + row.ticket_id 
-                row.ticket_id
+            : row.brand === "Synergy" ? "https://helpdesk.synergywholesale.com/profiles/ticket/" + row.ticket_id 
-              : row.brand === "Zuver"
-              ? "https://helpdesk.zuver.net.au/profiles/ticket/" + row.ticket_id
-              : row.brand === "Synergy"
-              ? "https://helpdesk.synergywholesale.com/profiles/ticket/" +
-                row.ticket_id
             : null
           }
           target="_blank"
@@ -120,6 +115,7 @@ const CompTable = (props) => {
     { dataField: "migration_type", text: "Type", sort: true },
     { dataField: "original_server", text: "Original Server", sort: true },
     { dataField: "new_server", text: "New Server", sort: true },
+    { dataField: "migration_status", text: "Status", sort: true },
     // { dataField: "term_date", text: "Termination Date", sort: true },
     { dataField: "notes", text: "Notes", sort: true },
     // { dataField: "submit_time", text: "Submit Time", sort: true },