Changes with Alex

dscfuto-org · Mar 29, 2023 · 07197dd · 07197dd
1 parent a8c9ad0
commit 07197dd
Show file tree

Hide file tree

Showing 6 changed files with 40 additions and 12 deletions.
diff --git a/src/Components/Buttons/AcceptButton.js b/src/Components/Buttons/AcceptButton.js
@@ -43,6 +43,7 @@ export default function Buttons({ id, name, color }) {
       }
     } catch (error) {
       console.log(error);
+      setSpin(false);
     }
   };
   return (

diff --git a/src/pages/Dashboard/Dashboard.js b/src/pages/Dashboard/Dashboard.js
@@ -13,7 +13,7 @@ import {
   useParams,
 } from "react-router-dom";
 import { handleCloseNavbar, handleToggleNavbar } from "../MainNavigation";
-import { FaHistory, FaHome } from "react-icons/fa";
+import { FcHome, FcExport, FcTimeline } from 'react-icons/fc'
 
 const Dashboard = () => {
   // ** GET CURRENT ROUTE FROM REACT ROUTER DOM
@@ -22,7 +22,8 @@ const Dashboard = () => {
 
   const dispatch = useDispatch();
   const data = useLoaderData();
-  const { businessName } = data.user;
+
+  const { businessName } = data?.user;
   const {
     items,
     completed: complete,
@@ -88,7 +89,7 @@ const Dashboard = () => {
               my={1.5}
               _hover={{ bg: "#eee" }}
             >
-              <FaHome style={{ fontSize: "20px", margin: "auto 5px" }} />
+              <FcHome style={{ fontSize: "20px", margin: "auto 5px" }} />
               <span className="nav-item">Dashboard</span>
             </Box>
           </Link>
@@ -103,11 +104,36 @@ const Dashboard = () => {
               my={1.5}
               _hover={{ bg: "#eee" }}
             >
-              <FaHistory style={{ fontSize: "20px", margin: "auto 5px" }} />
+              <FcTimeline style={{ fontSize: "20px", margin: "auto 5px" }} />
               <span className="nav-item">View History</span>
             </Box>
           </Link>
         </Box>
+        <Box
+          width="100%"
+          borderTop="1px solid rgba(0, 0, 0, 30%)"
+          position='absolute'
+          bottom={'10px'}
+          px={3}
+          left={0}
+        >
+          <Link onClick={handleCloseNavbar} to={`/logout`}>
+            <Box
+              bg='#0009'
+              display="flex"
+              p={2}
+              cursor="pointer"
+              fontWeight={600}
+              borderRadius="sm"
+              mt={'10px'}
+              color={'#fff'}
+              _hover={{ bg: "#eee", color: '#000' }}
+            >
+              <FcExport style={{ fontSize: "20px", margin: "auto 5px" }} />
+              <span className="nav-item">Sign Out</span>
+            </Box>
+          </Link>
+        </Box>
       </Box>
       {/** DASHBOARD MAIN SECTION */}
       <Box id="main-section" className="main">

diff --git a/src/pages/MainNavigation.js b/src/pages/MainNavigation.js
@@ -4,6 +4,7 @@ import { useColors } from "../App";
 import React, { useRef, useEffect } from "react";
 import { useAppContext } from "../context";
 import { FaTimes } from "react-icons/fa";
+import { checkToken } from "../Auth/getToken";
 
 export const handleToggleNavbar = () => {
   document.getElementById("collapse-sidebar").classList.toggle("collapse");
@@ -19,7 +20,7 @@ export const handleCloseNavbar = () => {
 };
 
 function MainNavigation() {
-  const token = useRouteLoaderData("root");
+  const token = checkToken()
 
   // ** GET CURRENT ROUTE FROM REACT ROUTER DOM
   const { pathname } = useLocation();
@@ -110,7 +111,7 @@ function MainNavigation() {
       {/** WEBSITE LOGO SECTION */}
       {!pathname.includes("/dashboard") && (
         <Box
-          fontSize={{ base: "1xl", md: "18px", lg: "20px" }}
+          fontSize={{ base: "21px", md: "18px", lg: "20px" }}
           fontWeight={700}
           bgGradient="linear(to-l, #FAB20F, #2A8D00)"
           bgClip="text"
@@ -146,7 +147,7 @@ function MainNavigation() {
             </Box>
             <Box className="responsive-nav-logo">
               <Box
-                fontSize={{ base: "1xl", md: "18px", lg: "20px" }}
+                fontSize={{ base: "21px", md: "18px", lg: "20px" }}
                 fontWeight={700}
                 bgGradient="linear(to-l, #FAB20F, #2A8D00)"
                 bgClip="text"

diff --git a/src/pages/login.js b/src/pages/login.js
@@ -103,7 +103,7 @@ export default function Login() {
         </Box>
       </Box>
 
-      <Box width={{ lg: "30%", sm: "80%" }} margin="auto">
+      <Box px={{ base: 3 }} width={{ lg: "30%", sm: "80%" }} margin="auto">
         <Heading size="lg">Welcome Back!</Heading>
         {message && (
           <Text
@@ -162,9 +162,9 @@ export default function Login() {
             type="submit"
             disable={isSubmiting.toString()}
           >
-            {isSubmiting ? "Loading..." : "Login"}
+            {isSubmiting ? "Signing you in..." : "Login"}
           </Button>
-          <Text marginLeft="16px" marginTop="20px" fontWeight="bold">
+          <Text textAlign='center' marginLeft="16px" marginTop="20px" fontWeight="bold">
             By Logging in you accept our{" "}
             <Link href="/legal/privacy-policy" color={useColors.appGreen}>
               privacy policy{" "}

diff --git a/src/store/alerts.js b/src/store/alerts.js
@@ -52,7 +52,7 @@ const Alertdata = createSlice({
     Accepted(state, action) {
       const actions = action.payload;
       const pending = state.items.find((item) => item._id === actions.id);
-      console.log(actions);
+      console.log(state.items);
       if (pending?.status === "pending") {
         pending.status = "accepted";
         Alertdata.caseReducers.update(state);

diff --git a/src/util/useActiveNav.js b/src/util/useActiveNav.js
@@ -11,7 +11,7 @@ export const useActiveNav = (navLinkId) => {
     const options = {
         root: null,
         rootMargin: '0px',
-        threshold: tenBreakpointThreshold
+        threshold: 0.5
     }
     const isOnScreen = useElementOnScreen(options, ref);