Merge pull request #510 from CotripperPlatform/bug-token-refresh

updated cached token issue
CotripperPlatform · Apr 6, 2020 · f7821d2 · f7821d2
2 parents 8505612 + 0f952ba
commit f7821d2
Showing 1 changed file with 41 additions and 31 deletions.
diff --git a/client/src/App.js b/client/src/App.js
@@ -21,7 +21,7 @@ import {
   faAngleLeft,
   faAngleRight,
   faCommentDots,
-  faEdit
+  faEdit,
 } from "@fortawesome/free-solid-svg-icons";
 import { fab } from "@fortawesome/free-brands-svg-icons";
 import { fas } from "@fortawesome/free-solid-svg-icons";
@@ -51,48 +51,52 @@ class App extends Component {
         localStorage.getItem("token") && localStorage.getItem("token") != undefined ? true : false,
       email: "",
       first_name: "",
-      image: ""
+      image: "",
     };
   }
   componentDidMount() {
     if (this.state.logged_in) {
       fetch("http://localhost:8000/auth/user", {
         headers: {
-          Authorization: `Token ${localStorage.getItem("token")}`
-        }
+          Authorization: `Token ${localStorage.getItem("token")}`,
+        },
       })
-        .then(res => res.json())
-        .then(json => {
+        .then((res) => res.json())
+        .then((json) => {
           console.log(json);
-          this.setState({
-            email: json.email,
-            first_name: json.profile.first_name,
-            image: json.profile.image
-          });
+          if (json.detail == "Invalid token.") {
+            this.handle_logout();
+          } else {
+            this.setState({
+              email: json.email,
+              first_name: json.profile.first_name,
+              image: json.profile.image,
+            });
+          }
         });
     }
   }
   handle_login = (data, history) => {
     fetch("http://localhost:8000/auth/login", {
       method: "POST",
       headers: {
-        "Content-Type": "application/json"
+        "Content-Type": "application/json",
       },
-      body: JSON.stringify(data)
+      body: JSON.stringify(data),
     })
-      .then(res => res.json())
-      .then(json => {
+      .then((res) => res.json())
+      .then((json) => {
         console.log(json.token);
         json.token ? localStorage.setItem("token", json.token) : console.log("no token");
         this.setState({
           logged_in: json.token != undefined ? true : false,
           email: json.user.email,
           first_name: json.user.profile.first_name,
-          image: json.user.profile.image
+          image: json.user.profile.image,
         });
         history.push("/home");
       })
-      .catch(err => {
+      .catch((err) => {
         console.log(err);
         alert("Please enter valid email and password");
       });
@@ -101,23 +105,23 @@ class App extends Component {
     fetch("http://localhost:8000/auth/register", {
       method: "POST",
       headers: {
-        "Content-Type": "application/json"
+        "Content-Type": "application/json",
       },
-      body: JSON.stringify(data)
+      body: JSON.stringify(data),
     })
-      .then(res => res.json())
-      .then(json => {
+      .then((res) => res.json())
+      .then((json) => {
         console.log(json);
         json.token ? localStorage.setItem("token", json.token) : console.log("no token");
         this.setState({
           logged_in: json.token != undefined ? true : false,
           email: json.user.email,
           first_name: json.user.profile.first_name,
-          image: json.user.profile.image
+          image: json.user.profile.image,
         });
         history.push("/home");
       })
-      .catch(err => {
+      .catch((err) => {
         console.log(err);
       });
   };
@@ -134,37 +138,43 @@ class App extends Component {
           <Route
             path="/hawaii-2020"
             exact
-            render={routerProps => <Hawaii2020 tripName={"Hawaii"} handle_logout={this.handle_logout} {...routerProps} />}
+            render={(routerProps) => (
+              <Hawaii2020 tripName={"Hawaii"} handle_logout={this.handle_logout} {...routerProps} />
+            )}
           ></Route>
           <Route
             path="/book-a-trip"
             exact
-            render={routerProps => <BookATripPage handle_logout={this.handle_logout} {...routerProps} />}
+            render={(routerProps) => (
+              <BookATripPage handle_logout={this.handle_logout} {...routerProps} />
+            )}
           ></Route>
-         
+
           <Route
             path="/member-page"
             exact
-            render={routerProps => <MemberPage  handle_logout={this.handle_logout} {...routerProps} />}
+            render={(routerProps) => (
+              <MemberPage handle_logout={this.handle_logout} {...routerProps} />
+            )}
           ></Route>
           <Route
             path="/coming_soon"
             exact
-            render={routerProps => (
+            render={(routerProps) => (
               <ComingSoonPage handle_logout={this.handle_logout} {...routerProps} {...this.state} />
             )}
           ></Route>
           <Route
             path="/login"
             exact
-            render={routerProps => (
+            render={(routerProps) => (
               <LoginPage handleLogin={this.handle_login} {...routerProps} {...this.state} />
             )}
           ></Route>
           <Route
             path="/register"
             exact
-            render={routerProps => (
+            render={(routerProps) => (
               <OnboardingPage
                 handleSignup={this.handle_signup}
                 {...routerProps}
@@ -175,7 +185,7 @@ class App extends Component {
           <Route
             path="/home"
             exact
-            render={routerProps => (
+            render={(routerProps) => (
               <HomePage handle_logout={this.handle_logout} {...routerProps} {...this.state} />
             )}
           ></Route>