add dynamic urls in admin dashboard based on tabs

radekm2000 · Apr 7, 2024 · b49a785 · b49a785
1 parent e981fd4
commit b49a785
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 9 deletions.
diff --git a/client/ecommerce/src/App.tsx b/client/ecommerce/src/App.tsx
@@ -146,7 +146,7 @@ function App() {
                     <Route path="/inbox/:userId*">
                       <Inbox />
                     </Route>
-                    <Route path="/dashboard">
+                    <Route path="/dashboard/:tab">
                       <AdminDashboard />
                     </Route>
 

diff --git a/client/ecommerce/src/components/AdminDashboard/FeedbackNotifications.tsx b/client/ecommerce/src/components/AdminDashboard/FeedbackNotifications.tsx
@@ -27,16 +27,16 @@ export const FeedbackNotifications = () => {
   const { data, isLoading } = useFetchFeedbacks();
   const [featureType, setFeatureType] = useState<featureType>();
   const [location, setLocation] = useLocation();
-
+  console.log(location);
   useEffect(() => {
     const params = new URLSearchParams();
     if (featureType !== undefined) {
       params.set("featureType", featureType);
-      setLocation(`${location}?${params.toString()}`);
+      setLocation(`/dashboard/feedbacks?${params.toString()}`);
     } else {
       setLocation(location);
     }
-  }, [featureType, setLocation, location]);
+  }, [featureType]);
 
   if (isLoading) {
     return <AdminDashboardSkeleton />;

diff --git a/client/ecommerce/src/components/Navbar.tsx b/client/ecommerce/src/components/Navbar.tsx
@@ -390,7 +390,7 @@ export const Navbar = () => {
                       display: below800 ? "none" : null,
                     }}
                   >
-                    <Link href="/dashboard">
+                    <Link href="/dashboard/notifications">
                       <Typography
                         color="white"
                         fontFamily="Maison Neue"
@@ -426,7 +426,8 @@ export const Navbar = () => {
               </Button>
 
               <Box sx={{ display: { xs: "none", md: "flex", gap: "5px" } }}>
-                <IconButton size="large"
+                <IconButton
+                  size="large"
                   disableFocusRipple
                   onClick={handleClickOpen}
                 >

diff --git a/client/ecommerce/src/components/pages/AdminDashboard.tsx b/client/ecommerce/src/components/pages/AdminDashboard.tsx
@@ -12,8 +12,7 @@ import DisplayAdminNotifications from "../DisplayAdminNotifications";
 import { SyntheticEvent, useEffect, useState } from "react";
 import { FeedbackNotifications } from "../AdminDashboard/FeedbackNotifications";
 import { AdminDashboardSkeleton } from "../AdminDashboard/AdminDashboardSkeleton";
-import { useLocation } from "wouter";
-import { CatchingPokemonSharp } from "@mui/icons-material";
+import { useLocation, useRoute } from "wouter";
 const Container = styled(Box)({
   backgroundColor: "rgba(37,44,51,0.05)",
   display: "flex",
@@ -30,9 +29,20 @@ const Sidebar = styled(Box)({
 export const AdminDashboard = () => {
   const { data: adminNotifications, isLoading } = useFetchAdminNotifications();
   const [tabValue, setTabValue] = useState("notifications");
+  const [, setLocation] = useLocation();
+  const [, params] = useRoute("/dashboard/:tab");
+
+  useEffect(() => {
+    if (!params || !params.tab) {
+      setLocation(`/dashboard/${tabValue}`);
+    } else {
+      setTabValue(params.tab);
+    }
+  }, [params, setLocation, tabValue]);
 
   const handleTabChange = (e: SyntheticEvent, newValue: string) => {
     setTabValue(newValue);
+    setLocation(`/dashboard/${newValue}`);
   };
 
   if (isLoading) {

diff --git a/server/ecommerce/src/auth/auth.service.ts b/server/ecommerce/src/auth/auth.service.ts
@@ -27,7 +27,7 @@ export class AuthService {
     }
     const payload = { sub: user.id, username: user.username };
     const accessToken = await this.jwtService.signAsync(payload, {
-      expiresIn: '10s',
+      expiresIn: '24h',
     });
     const refreshToken = await this.jwtService.signAsync(payload, {
       expiresIn: '24h',