Merge branch 'AFP-111' into 'dev'

[AFP-111] 🔀  Manager service & proxy config

See merge request !14

package.json

@@ -2,6 +2,7 @@
   "name": "order-management-client",
   "version": "0.1.0",
   "private": true,
+  "proxy": "http://localhost:8080",
   "dependencies": {
     "@chakra-ui/react": "^1.6.0",
     "@emotion/react": "^11",
@@ -19,6 +20,7 @@
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",
     "@types/react-router-dom": "^5.1.7",
+    "axios": "^0.21.1",
     "bootstrap": "^4.6.0",
     "framer-motion": "^4",
     "react": "^17.0.2",

src/@types/Manager.d.ts

 declare module "Manager" {
     export interface Manager {
+        id?: string,
         firstName: string,
         lastName: string,
         googleId: string,
         email: string,
         imageUrl: string
-        managerId?: string
     }
 }
\ No newline at end of file

src/hooks/useGoogleAuth.tsx

 
-import React from 'react'
-import { useGoogleLogin, useGoogleLogout } from 'react-google-login'
+import { createContext, useContext, useEffect, useState, FC } from 'react'
+import { GoogleLoginResponse, useGoogleLogin, useGoogleLogout } from 'react-google-login'
 import { useHistory } from 'react-router-dom'
+
 import { Manager } from 'Manager'
-const GoogleAuthContext = React.createContext<any>({});
+import { ManagerService } from 'services'
+import { tokenStorage } from 'utils'
 
-export const useGoogleAuth = () => React.useContext(GoogleAuthContext);
-export default useGoogleAuth;
 
-export const GoogleAuthProvider: React.FC = ({ children }) => {
-    const {push: historyPush} = useHistory();
-    const [isSignedIn, setIsSignedIn] = React.useState(false)
-    const [staySignedIn, setStaySignedIn] = React.useState(true)
-    const [manager, setManager] = React.useState<Manager | null>()
-    const [authError, setAuthError] = React.useState<String | null>()
+const GoogleAuthContext = createContext<any>({});
 
-    const { signIn, loaded, } = useGoogleLogin({ 
+export const useGoogleAuth = () => useContext(GoogleAuthContext);
+export default useGoogleAuth;
+
+export const GoogleAuthProvider: FC = ({ children }) => {
+    const { push: historyPush } = useHistory();
+    const [isSignedIn, setIsSignedIn] = useState(false)
+    const [staySignedIn, setStaySignedIn] = useState(true)
+    const [manager, setManager] = useState<Manager | null>()
+    const [authError, setAuthError] = useState<string | null>()
+    const [accessToken, setAccessToken] = useState<string | null>()
+    const { signIn, loaded } = useGoogleLogin({ 
         clientId: (process.env.REACT_APP_GOOGLE_CLIENT_ID as string),
         onSuccess: (res: any) => {
             const {
-                email, 
-                familyName: lastName, 
-                givenName:firstName, 
-                googleId, 
-                imageUrl
-            } = res.profileObj;
-       
-            setManager(({
+                profileObj: {
+                    email, 
+                    familyName: lastName, 
+                    givenName: firstName, 
+                    googleId, 
+                    imageUrl
+                },
+                tokenId: token
+            } = res;
+
+            const managerData: Manager = {
                 email,
                 firstName,
                 lastName,
                 googleId,
                 imageUrl
-            }))
+            }
+       
+            setManager(managerData)
+            setAccessToken(token)
+            console.log(token)
 
-            // ManagerService.existByEmail(email) // GET api/managers/[email]
-            //     .then((exists: boolean) => {
-            //         if (exists) {
-            //             ManagerService.isLoggedin(email)
-            //         } else {
-            //            ManagerService.create([managerData])
-            //         }
-            //     }).finally(() => {
-                    setIsSignedIn(true);
-                    historyPush("/orders");
-            //     })
+            ManagerService.authenticate(token)
+                .then(() => {
+                    setIsSignedIn(true)
+                    historyPush("/orders")
+                })
  
          },
         onFailure: (err) =>  { 
             console.error("GOOGLE AUTH SIGN-IN ERROR: ", err) 
-            setAuthError(`Ooops. Something went wrong: ${err?.message}`);
+            setAuthError(`Ooops. Something went wrong: ${err?.message}`)
         },
         isSignedIn: staySignedIn,
         cookiePolicy: 'single_host_origin'
@@ -58,16 +64,21 @@ export const GoogleAuthProvider: React.FC = ({ children }) => {
     const { signOut } = useGoogleLogout({ 
         clientId: (process.env.REACT_APP_GOOGLE_CLIENT_ID as string),
         onLogoutSuccess: () =>  { 
-            setIsSignedIn(false);
+            setIsSignedIn(false)
             historyPush("/") 
         },
         onFailure: () =>  { 
             console.error("A GOOGLE AUTH SIGN-OUT ERROR OCCURED") 
-            setAuthError("Ooops. Something went wrong");
+            setAuthError("Ooops. Something went wrong")
         },
      })
 
+     useEffect(() => {
+        if (accessToken) tokenStorage.set(accessToken);
+     }, [accessToken])
+
     const authContextValues = {
+        accessToken,
         authError,
         isSignedIn,
         loaded, 

src/services/ManagerService.ts

+import { Manager } from 'Manager'
+import { tokenStorage } from 'utils'
+import Axios, { AxiosError } from 'axios'
+
+const BASE_PATH = '/api/managers'
+
+export const authenticate = async (token: string): Promise<Manager> => {
+    try {
+        const { data } = await Axios.post(
+            `${BASE_PATH}/auth`, 
+            {}, // Empty body
+            { headers: { Authorization: `Bearer ${token}` } }
+        )
+        return data;   
+    } catch (error) {
+        const { response } = error as AxiosError;
+        // Get Status Code
+        return response?.data;
+    }
+}
+
+export const getAccount = async (): Promise<Manager> => {
+    const token = tokenStorage.get();
+    try {
+        const { data } = await Axios.get(
+            `${BASE_PATH}/account`, 
+            { headers: { Authorization: `Bearer ${token}` } }
+        )
+        return data;
+    } catch (error) {
+        const { response } = error as AxiosError;
+        return response?.data;
+    }
+}
+
+export const updateAccount = async (): Promise<Manager>  => {
+    const token = tokenStorage.get();
+    try {
+        const { data } = await Axios.patch(
+            `${BASE_PATH}/account`, 
+            {}, // Empty body
+            { headers: { Authorization: `Bearer ${token}` } }
+        )
+        return data;
+    } catch (error) {
+        const { response } = error as AxiosError;
+        return response?.data;
+    }
+}
+
+export const deleteAccount = async () => {
+    const token = tokenStorage.get();
+    try {
+        await Axios.delete(
+            `${BASE_PATH}/account`, 
+            { headers: { Authorization: `Bearer ${token}` } }
+        )
+    } catch (error) {
+        const { response } = error as AxiosError;
+        return response?.data;
+    }
+}
+
+export default {
+    authenticate,
+    getAccount,
+    updateAccount,
+    deleteAccount
+}
\ No newline at end of file

src/services/index.ts

+export {default as ManagerService} from './ManagerService'
 export {default as OrderService} from './OrderService'
 export {default as GoogleAuthService } from './GoogleAuthService'
\ No newline at end of file

src/utils/index.ts

+export { default as tokenStorage } from "./tokenStorage"
\ No newline at end of file

src/utils/tokenStorage.ts

+const LOCAL_STORAGE_KEY = "TOKEN";
+
+export const set = (token: string) => { localStorage.setItem(LOCAL_STORAGE_KEY, token); }
+
+export const get = (): string => localStorage.getItem(LOCAL_STORAGE_KEY) || "";
+
+export default { set, get }
\ No newline at end of file

yarn.lock

@@ -3328,6 +3328,13 @@ axe-core@^4.0.2:
   resolved "https://registry.npmjs.org/axe-core/-/axe-core-4.1.2.tgz"
   integrity sha512-V+Nq70NxKhYt89ArVcaNL9FDryB3vQOd+BFXZIfO3RP6rwtj+2yqqqdHEkacutglPaZLkJeuXKCjCJDMGPtPqg==
 
+axios@^0.21.1:
+  version "0.21.1"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.21.1.tgz#22563481962f4d6bde9a76d516ef0e5d3c09b2b8"
+  integrity sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==
+  dependencies:
+    follow-redirects "^1.10.0"
+
 axobject-query@^2.2.0:
   version "2.2.0"
   resolved "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz"
@@ -5880,6 +5887,11 @@ follow-redirects@^1.0.0:
   resolved "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.13.2.tgz"
   integrity sha512-6mPTgLxYm3r6Bkkg0vNM0HTjfGrOEtsfbhagQvbxDEsEkpNhw582upBaoRZylzen6krEmxXJgt9Ju6HiI4O7BA==
 
+follow-redirects@^1.10.0:
+  version "1.14.1"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.14.1.tgz#d9114ded0a1cfdd334e164e6662ad02bfd91ff43"
+  integrity sha512-HWqDgT7ZEkqRzBvc2s64vSZ/hfOceEol3ac/7tKwzuvEyWx3/4UegXh5oBOIotkGsObyk3xznnSRVADBgWSQVg==
+
 for-in@^1.0.2:
   version "1.0.2"
   resolved "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz"