Merge pull request #78 from input-output-hk/PLT-5535

PLT-5535 (Bug) Not landing on User profile page after signing up
input-output-hk · Aug 11, 2023 · 0293e50 · 0293e50
2 parents 4939cab + e8a3de5
commit 0293e50
Show file tree

Hide file tree

Showing 15 changed files with 524 additions and 286 deletions.
diff --git a/react-web/src/api/onRequest.ts b/react-web/src/api/onRequest.ts
@@ -1,8 +1,9 @@
 import { AxiosError, AxiosRequestConfig } from "axios";
+import { LocalStorageKeys } from "constants/constants";
 
 // Add a request interceptor
 export function onRequest(config: AxiosRequestConfig) {
-  const address: any = localStorage.getItem('authToken');
+  const address: any = localStorage.getItem(LocalStorageKeys.authToken);
   const TokenAuth = 'Bearer ' + address;
 
   if (address) {
@@ -22,7 +23,7 @@ export function onRequestError(error: AxiosError) {
 
 
 export function onRepoAccessRequest(config: AxiosRequestConfig) {
-  const accessToken: any = localStorage.getItem('accessToken')
+  const accessToken: any = localStorage.getItem(LocalStorageKeys.accessToken)
   const TokenAuth = accessToken;
 
   if (accessToken && accessToken !== 'undefined') {

diff --git a/react-web/src/app/App.tsx b/react-web/src/app/App.tsx
@@ -1,4 +1,4 @@
-import React, { lazy, memo, Suspense } from "react";
+import { lazy, Suspense } from "react";
 import { Routes, Route, Outlet } from "react-router-dom";
 import { BASE_URL } from "constants/route";
 import Alert from '@mui/material/Alert';
@@ -10,7 +10,7 @@ import NotFound from "components/NotFound/NotFound";
 import Loader from "components/Loader/Loader";
 import { useAppSelector } from "store/store";
 
-const Certification = lazy(() => import("../pages/certification/Certification"));
+const Home = lazy(() => import("../pages/home/Home"));
 const MaintenancePage = lazy(() => import("../pages/maintenance/Maintenance"));
 const Community = lazy(() => import("../pages/community/Community"));
 const TestHistory = lazy(() => import("../pages/testHistory/TestHistory"));
@@ -23,28 +23,27 @@ const Payment = lazy(() => import("../pages/subscription/payment/Payment"));
 const Auditor = lazy(() => import("../pages/auditor/Auditor"));
 const SubscriptionHistory = lazy(() => import("../pages/subscription/history/SubscriptionHistory"));
 
+const Banner = () => {
+  const { network } = useAppSelector((state) => state.auth);
+  const networkEnvVar: any = process.env.REACT_APP_WALLET_NETWORK
+
+  return (<>
+    {network !== null && network !== 1 ? 
+      // always show Info if not in Mainnet
+      <Alert severity="info" style={{marginBottom: '10px'}}>Your connected wallet is not in Mainnet.</Alert> : null}
+      {/* if not in Mainnet and app-wallet not Mainnet (i.e. in Testnet), show Warning to connect to Preprod. */}
+    {network !== null && network !== 1 && networkEnvVar !== '1' ? 
+      <Alert severity="warning">Your wallet is connected to a Testnet which is expected while the tool is in Beta. Please ensure that you are connected to the <strong>Preprod</strong> network.</Alert> : null}
+  </>)
+}
 
 const PageLayout = () => {
-  const { network } = useAppSelector((state) => state.auth);
 
   // const networkNames:{[x:string]:string} = {
   //   '0': 'Testnet',
   //   '1': 'Mainnet'
   // }
 
-  const Banner = memo(() => {
-    const networkEnvVar: any = process.env.REACT_APP_WALLET_NETWORK
-
-    return (<>
-      {network !== null && network !== 1 ? 
-        // always show Info if not in Mainnet
-        <Alert severity="info" style={{marginBottom: '10px'}}>Your connected wallet is not in Mainnet.</Alert> : null}
-        {/* if not in Mainnet and app-wallet not Mainnet (i.e. in Testnet), show Warning to connect to Preprod. */}
-      {network !== null && network !== 1 && networkEnvVar !== '1' ? 
-        <Alert severity="warning">Being in a test network, please make sure you are connected to wallet in <strong>Preprod</strong> to avail services without any issues.</Alert> : null}
-    </>)
-  })
-
   return (
     <>
       <Header />
@@ -67,10 +66,10 @@ const App = () => {
       <Routes>
         <Route path={BASE_URL} element={<PageLayout />}>
           <Route element={<PrivateRoutes />}>
-            <Route path="/" element={<Certification />} />
+            <Route path="/" element={<Home />} />
             <Route path="/auditor" element={<Auditor />} />
             <Route path="/subscription" element={<Subscription />}>
-              <Route path="" element={<SubscriptionContent/>} />  
+              <Route index element={<SubscriptionContent />} />  
               <Route path="payment" element={<Payment />} />
               <Route path="history" element={<SubscriptionHistory />} />
             </Route>

diff --git a/react-web/src/components/AvatarDropdown/AvatarDropdown.tsx b/react-web/src/components/AvatarDropdown/AvatarDropdown.tsx
@@ -7,13 +7,26 @@ import Menu from "@mui/material/Menu";
 import MenuItem from "@mui/material/MenuItem";
 import Avatar from "@mui/material/Avatar";
 import "./AvatarDropDown.scss";
+import useLocalStorage from "hooks/useLocalStorage";
+import { LocalStorageKeys } from 'constants/constants';
 
 const AvatarDropDown = () => {
   const navigate = useNavigate();
   const dispatch = useAppDispatch();
   const logOut = () => {
     dispatch(logout());
   };
+  const [, setIsLoggedIn] = useLocalStorage(
+    LocalStorageKeys.isLoggedIn,
+    localStorage.getItem(LocalStorageKeys.isLoggedIn) === "true" ? true : false
+  );
+
+  const [, setUserDetails] = useLocalStorage(
+    LocalStorageKeys.userDetails,
+    localStorage.getItem(LocalStorageKeys.userDetails)
+      ? JSON.parse(localStorage.getItem(LocalStorageKeys.userDetails)!)
+      : null
+  );
 
   const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
   const open = Boolean(anchorEl);