Merge branch 'master' of github.com:UTSCC09/project-migos

MohanVashist1 · Apr 12, 2020 · a48c5fe · a48c5fe
2 parents a893671 + 367ce94
commit a48c5fe
Show file tree

Hide file tree

Showing 14 changed files with 53 additions and 34 deletions.
diff --git a/backend/main.py b/backend/main.py
@@ -114,6 +114,16 @@ class CryptoRequest(BaseModel):
 @app.middleware("http")
 async def cookie_set(request: Request, call_next):
     response = await call_next(request)
+    for idx, header in enumerate(response.raw_headers):
+        if header[0].decode("utf-8") == "set-cookie":
+            cookie = header[1].decode("utf-8")
+            cookie_arr = cookie.split('=')
+            if cookie_arr[0] == 'user_auth':
+                if cookie_arr[1].split(';')[0] == '""':
+                    response.set_cookie("isLoggedIn", False, secure=True)
+                else:
+                    response.set_cookie("isLoggedIn", True, secure=True)
+                break
     for idx, header in enumerate(response.raw_headers):
         if header[0].decode("utf-8") == "set-cookie":
             cookie = header[1].decode("utf-8")

diff --git a/frontend/cryptoviz/package.json b/frontend/cryptoviz/package.json
@@ -7,6 +7,7 @@
     "@testing-library/react": "^9.5.0",
     "@testing-library/user-event": "^7.2.1",
     "bootswatch": "^4.4.1",
+    "js-cookie": "^2.2.1",
     "react": "^16.13.0",
     "react-autosuggest": "^10.0.0",
     "react-bootstrap": "^1.0.0",

diff --git a/frontend/cryptoviz/src/js/components/AdvancedCharts.js b/frontend/cryptoviz/src/js/components/AdvancedCharts.js
@@ -1,13 +1,22 @@
 import React from "react";
 import Navbar from "./Navbar";
 import { TVChartContainer } from "../../components/TVChartContainer/index";
+import Loader from "react-loader-spinner";
+import Cookie from 'js-cookie';
 
 function AdvancedLandingPage({ match }) {
   return (
-    <div>
-      <Navbar />
-      <TVChartContainer tickerId={match.params.ticker}></TVChartContainer>
-    </div>
+    <>
+    {(Cookie.get('isLoggedIn') && Cookie.get('isLoggedIn').toLocaleLowerCase() === 'true' && authState.isAuthenticated) ||
+      ((!Cookie.get('isLoggedIn') || Cookie.get('isLoggedIn').toLocaleLowerCase() === 'false') && !authState.isAuthenticated) ?
+      <div>
+        <Navbar />
+        <TVChartContainer tickerId={match.params.ticker}></TVChartContainer>
+      </div> :
+      <div style={{ textAlign: "center", marginTop: "20em" }}>
+        <Loader type="ThreeDots" color="#2BAD60" />
+      </div>}
+    </>
   );
 }
 

diff --git a/frontend/cryptoviz/src/js/components/App.js b/frontend/cryptoviz/src/js/components/App.js
@@ -13,17 +13,16 @@ import { useInterval } from "../common";
 import { getCurrUser } from "../api";
 import { reducer } from "../reducer";
 import "../../style/App.css";
+import Cookie from 'js-cookie';
 import {
   GET_USER_SUCCESS,
   GET_USER_FAILURE,
-  ERROR_CLOSE,
-  APPLICATION_MOUNTED,
+  ERROR_CLOSE
 } from "../constants/auth";
 import AdvancedLandingPage from "./AdvancedCharts";
 export const AuthContext = createContext();
 
 const initialState = {
-  applicationMounted: false,
   isAuthenticated: false,
   user: {},
   error: "",
@@ -34,17 +33,14 @@ function App() {
 
   useEffect(() => {
     getUserInfo();
-    dispatch({
-      type: APPLICATION_MOUNTED,
-    });
   }, []);
 
   useInterval(() => {
     getUserInfo();
-  }, 500);
+  }, 1000);
 
   const getUserInfo = () => {
-    if (!state.applicationMounted || state.isAuthenticated) {
+    if (Cookie.get('isLoggedIn') && Cookie.get('isLoggedIn').toLocaleLowerCase() === 'true') {
       getCurrUser()
         .then((res) => {
           dispatch({

diff --git a/frontend/cryptoviz/src/js/components/Credits.js b/frontend/cryptoviz/src/js/components/Credits.js
@@ -3,14 +3,16 @@ import "../../style/main.css";
 import Navbar from "./Navbar";
 import { AuthContext } from "./App";
 import Loader from "react-loader-spinner";
+import Cookie from 'js-cookie';
 
 function Credits() {
 
   const { state: authState } = useContext(AuthContext);
 
   return (
     <div>
-      {authState.applicationMounted && ((authState.isAuthenticated && Object.keys(authState.user).length > 0) || (!authState.isAuthenticated && Object.keys(authState.user).length === 0)) ?
+      {(Cookie.get('isLoggedIn') && Cookie.get('isLoggedIn').toLocaleLowerCase() === 'true' && authState.isAuthenticated) ||
+      ((!Cookie.get('isLoggedIn') || Cookie.get('isLoggedIn').toLocaleLowerCase() === 'false') && !authState.isAuthenticated) ?
       <div>
         <Navbar />
         <div className="container-fluid">

diff --git a/frontend/cryptoviz/src/js/components/CryptoLanding.js b/frontend/cryptoviz/src/js/components/CryptoLanding.js
@@ -18,6 +18,7 @@ import { useHistory } from "react-router-dom";
 import Loader from "react-loader-spinner";
 import { AuthContext } from "./App";
 import { updateUser } from "../api";
+import Cookie from 'js-cookie';
 import { UPDATE_USER_SUCCESS, UPDATE_USER_FAILURE } from "../constants/auth";
 
 const d = new Date();
@@ -143,7 +144,7 @@ function CryptoLanding({ match }) {
   };
 
   const displayWatchList = () => {
-    if (Object.keys(authState.user).length > 0) {
+    if (authState.isAuthenticated) {
       if (
         authState.user.watchlist.includes(
           match.params.ticker.replace("USDT", "")
@@ -202,9 +203,8 @@ function CryptoLanding({ match }) {
 
   return (
     <div>
-      {authState.applicationMounted &&
-      ((authState.isAuthenticated && Object.keys(authState.user).length > 0) ||
-      (!authState.isAuthenticated && Object.keys(authState.user).length === 0)) ? (
+      {(Cookie.get('isLoggedIn') && Cookie.get('isLoggedIn').toLocaleLowerCase() === 'true' && authState.isAuthenticated) ||
+      ((!Cookie.get('isLoggedIn') || Cookie.get('isLoggedIn').toLocaleLowerCase() === 'false') && !authState.isAuthenticated) ? (
         <div>
           <Navbar />
           <div style={{ textAlign: "center", marginTop: "4em" }}>

diff --git a/frontend/cryptoviz/src/js/components/Home.js b/frontend/cryptoviz/src/js/components/Home.js
@@ -4,14 +4,16 @@ import Table from './Table';
 import Navbar from "./Navbar";
 import { AuthContext } from "./App";
 import Loader from "react-loader-spinner";
+import Cookie from 'js-cookie';
 
 function Home() {
 
   const { state: authState } = useContext(AuthContext);
 
   return (
     <div>
-      {authState.applicationMounted && ((authState.isAuthenticated && Object.keys(authState.user).length > 0) || (!authState.isAuthenticated && Object.keys(authState.user).length === 0)) ?
+      {(Cookie.get('isLoggedIn') && Cookie.get('isLoggedIn').toLocaleLowerCase() === 'true' && authState.isAuthenticated) ||
+      ((!Cookie.get('isLoggedIn') || Cookie.get('isLoggedIn').toLocaleLowerCase() === 'false') && !authState.isAuthenticated) ?
         <div>
         <Navbar />
           <div>

diff --git a/frontend/cryptoviz/src/js/components/InvalidPage.js b/frontend/cryptoviz/src/js/components/InvalidPage.js
@@ -3,14 +3,16 @@ import React, { useContext } from "react";
 import Navbar from "./Navbar";
 import { AuthContext } from "./App";
 import Loader from "react-loader-spinner";
+import Cookie from 'js-cookie';
 
 function InvalidPage() {
 
   const { state: authState } = useContext(AuthContext);
 
   return (
     <div>
-      {authState.applicationMounted && ((authState.isAuthenticated && Object.keys(authState.user).length > 0) || (!authState.isAuthenticated && Object.keys(authState.user).length === 0)) ?
+      {(Cookie.get('isLoggedIn') && Cookie.get('isLoggedIn').toLocaleLowerCase() === 'true' && authState.isAuthenticated) ||
+      ((!Cookie.get('isLoggedIn') || Cookie.get('isLoggedIn').toLocaleLowerCase() === 'false') && !authState.isAuthenticated) ?
         <div>
             <Navbar />
             <div style={{ textAlign: "center" }}>

diff --git a/frontend/cryptoviz/src/js/components/SignIn.js b/frontend/cryptoviz/src/js/components/SignIn.js
@@ -7,6 +7,7 @@ import Navbar from "./Navbar";
 import { login } from '../api';
 import { AuthContext } from "./App";
 import Loader from "react-loader-spinner";
+import Cookie from 'js-cookie';
 
 function SignIn() {
 
@@ -24,7 +25,7 @@ function SignIn() {
     }, 500);
 
     const checkSignedIn = () => {
-        if(authState.applicationMounted && authState.isAuthenticated) {
+        if(Cookie.get('isLoggedIn') && Cookie.get('isLoggedIn').toLocaleLowerCase() === 'true') {
             history.push('/');
         }
     };
@@ -49,7 +50,7 @@ function SignIn() {
 
     return (
         <div>
-            {authState.applicationMounted && !authState.isAuthenticated && Object.keys(authState.user).length === 0 ?
+            {((!Cookie.get('isLoggedIn') || Cookie.get('isLoggedIn').toLocaleLowerCase() === 'false') && !authState.isAuthenticated) ?
             <div>
                 <Navbar />
                 <form style={{ width: "45%", margin: "auto", marginTop: "15vh" }} onSubmit={signIn}>

diff --git a/frontend/cryptoviz/src/js/components/SignUp.js b/frontend/cryptoviz/src/js/components/SignUp.js
@@ -6,6 +6,7 @@ import { REGISTER_FAILURE, REGISTER_SUCCESS, LOGIN_SUCCESS, LOGIN_FAILURE } from
 import Navbar from "./Navbar";
 import { AuthContext } from "./App";
 import { register, login } from '../api';
+import Cookie from 'js-cookie';
 import Loader from "react-loader-spinner";
 
 function SignUp() {
@@ -26,7 +27,7 @@ function SignUp() {
     }, 500);
 
     const checkSignedIn = () => {
-        if(authState.applicationMounted && authState.isAuthenticated) {
+        if(Cookie.get('isLoggedIn') && Cookie.get('isLoggedIn').toLocaleLowerCase() === 'true') {
             history.push('/');
         }
     };
@@ -64,7 +65,7 @@ function SignUp() {
 
     return (
         <div>
-            {authState.applicationMounted && !authState.isAuthenticated && Object.keys(authState.user).length === 0 ?
+            {((!Cookie.get('isLoggedIn') || Cookie.get('isLoggedIn').toLocaleLowerCase() === 'false') && !authState.isAuthenticated) ?
             <div>
                 <Navbar />
                 <form style={{ width: "45%", margin: "4em auto" }} onSubmit={signUp}>

diff --git a/frontend/cryptoviz/src/js/components/Table.js b/frontend/cryptoviz/src/js/components/Table.js
@@ -129,7 +129,7 @@ function Table({ isGainer }) {
         );
       }
       count += 6;
-      if (Object.keys(authState.user).length > 0) {
+      if (authState.isAuthenticated) {
         if (authState.user.watchlist.includes(data[i].symbol)) {
           cells.push(
             <td key={count}>
@@ -235,7 +235,7 @@ function Table({ isGainer }) {
                 <th scope="col"><h5>Price</h5></th>
                 <th scope="col"><h5>Volume</h5></th>
                 <th scope="col"><h5>%</h5></th>
-                {Object.keys(authState.user).length > 0 && <th scope="col"><h5>Action</h5></th>}
+                {authState.isAuthenticated && <th scope="col"><h5>Action</h5></th>}
               </tr>
             </thead>
             <tbody>{createTable(list)}</tbody>

diff --git a/frontend/cryptoviz/src/js/components/Watchlist.js b/frontend/cryptoviz/src/js/components/Watchlist.js
@@ -9,6 +9,7 @@ import { updateUser } from '../api';
 import { AuthContext } from "./App";
 import Navbar from "./Navbar";
 import Loader from "react-loader-spinner";
+import Cookie from 'js-cookie';
 
 function Watchlist() {
 
@@ -30,7 +31,7 @@ function Watchlist() {
     }, 500);
 
     const checkSignedIn = () => {
-        if(authState.applicationMounted && !authState.isAuthenticated) {
+        if(!Cookie.get('isLoggedIn') || Cookie.get('isLoggedIn').toLocaleLowerCase() === 'false') {
             history.push('/');
         }
     };
@@ -124,7 +125,7 @@ function Watchlist() {
 
     return (
         <div>
-            {authState.applicationMounted && authState.isAuthenticated && Object.keys(authState.user).length > 0 ?
+            {Cookie.get('isLoggedIn') && Cookie.get('isLoggedIn').toLocaleLowerCase() === 'true' && authState.isAuthenticated ?
             <div>
                 <Navbar />
                 <div style={{ textAlign: "center" }}>

diff --git a/frontend/cryptoviz/src/js/constants/auth.js b/frontend/cryptoviz/src/js/constants/auth.js
@@ -8,5 +8,4 @@ export const LOGOUT_SUCCESS = "LOGOUT_SUCCESS";
 export const LOGOUT_FAILURE = "LOGOUT_FAILURE";
 export const UPDATE_USER_SUCCESS = "UPDATE_USER_SUCCESS";
 export const UPDATE_USER_FAILURE = "UPDATE_USER_FAILURE";
-export const APPLICATION_MOUNTED = "APPLICATION_MOUNTED";
 export const ERROR_CLOSE = "ERROR_CLOSE";
diff --git a/frontend/cryptoviz/src/js/reducer.js b/frontend/cryptoviz/src/js/reducer.js
@@ -2,11 +2,6 @@ import * as authConstants from "./constants/auth";
 
 export const reducer = (state, action) => {
     switch (action.type) {
-      case authConstants.APPLICATION_MOUNTED:
-        return {
-          ...state,
-          applicationMounted: true,
-        };
       case authConstants.UPDATE_USER_FAILURE:
       case authConstants.LOGOUT_FAILURE:
       case authConstants.LOGIN_FAILURE:
@@ -37,7 +32,7 @@ export const reducer = (state, action) => {
       case authConstants.LOGIN_SUCCESS:
         return {
           ...state,
-          isAuthenticated: true,
+          // isAuthenticated: true,
           error: "",
         };
       case authConstants.LOGOUT_SUCCESS: