From 202eaad2df2358f15e0fec26fad6ae5500a735ce Mon Sep 17 00:00:00 2001
From: Ruidy Nemausat <ruidy.nemausat@gmail.com>
Date: Fri, 21 Feb 2020 20:53:51 +0100
Subject: [PATCH] redirect to error page if project get unsuccessful

---
 client/src/controllers/ProjectController.tsx | 31 +++++++++++++-------
 client/src/utils/http.ts                     |  2 ++
 client/src/utils/router.tsx                  |  7 ++++-
 3 files changed, 29 insertions(+), 11 deletions(-)

diff --git a/client/src/controllers/ProjectController.tsx b/client/src/controllers/ProjectController.tsx
index ad41468..472a15a 100644
--- a/client/src/controllers/ProjectController.tsx
+++ b/client/src/controllers/ProjectController.tsx
@@ -1,31 +1,42 @@
 import React, { FC, useState, useEffect } from "react";
-import { useParams } from "react-router-dom";
+import { useParams, Redirect } from "react-router-dom";
 import { ProjectPage } from "../pages/ProjectPage";
 import ProjectVM from "../VM/ProjectVM";
-import { Constants } from "../utils/Constants";
 import { Project } from "../types/Project";
 import { Preloader } from "../components/Preloader";
+import { Constants } from "../utils/Constants";
+import { HttpResponse, get } from "../utils/http";
 
 export const ProjectController: FC = () => {
   const [project, setProject] = useState({} as Project);
   const [isLoading, setIsLoading] = useState(true);
+  const [hasError, setHasError] = useState(false);
   const { id } = useParams();
 
-  const getProject: (id: string) => void = async (id: string) => {
-    await fetch(`${Constants.getProjectURI}/${id}`)
-      .then((res: Response) => res.json())
-      .catch(err => console.log(err))
-      .then(data => setProject(data))
-      .finally(() => setIsLoading(false));
-  };
+  async function httpGet(id: string): Promise<void> {
+    try {
+      const response: HttpResponse<Project> = await get<Project>(
+        `${Constants.getProjectURI}/${id}`
+      );
+      if (response.parsedBody !== undefined) {
+        setProject(response.parsedBody);
+        setIsLoading(false);
+      }
+    } catch (ex) {
+      setHasError(true);
+    }
+  }
 
   useEffect(() => {
     if (id !== undefined) {
-      getProject(id);
+      httpGet(id);
     }
   }, [id]);
 
   const viewModel = new ProjectVM(project);
 
+  if (hasError) {
+    return <Redirect to="/error" />;
+  }
   return isLoading ? <Preloader /> : <ProjectPage viewModel={viewModel} />;
 };
diff --git a/client/src/utils/http.ts b/client/src/utils/http.ts
index 9f9acf6..ceb53bc 100644
--- a/client/src/utils/http.ts
+++ b/client/src/utils/http.ts
@@ -1,3 +1,5 @@
+import { Redirect } from "react-router-dom";
+
 export interface HttpResponse<T> extends Response {
   parsedBody?: T;
 }
diff --git a/client/src/utils/router.tsx b/client/src/utils/router.tsx
index 56f8752..0031748 100644
--- a/client/src/utils/router.tsx
+++ b/client/src/utils/router.tsx
@@ -10,6 +10,7 @@ import * as creacteHistory from "history";
 // import { TicketPage } from "../pages/TicketPage";
 // import { HomeController } from "../controllers/HomeController";
 import { ProjectController } from "../controllers/ProjectController";
+import { ErrorPage } from "../pages/ErrorPage";
 // import { UserController } from "../controllers/UserController";
 // import { TicketController } from "../controllers/TicketController";
 
@@ -33,8 +34,12 @@ export const AppRouter = () => {
             <TicketController />
           </Route> */}
 
+          <Route path="/error">
+            <ErrorPage error="" />
+          </Route>
+
           <Route path="*">
-            <Redirect to="/404" />
+            <Redirect to="/error" />
           </Route>
         </Switch>
       </div>