jaanvi/bulk-email
1
0
Fork 0
Code Issues Pull requests 1 Actions Packages Projects Releases Wiki Activity

dev-jaanvi #1

Open
jaanvi wants to merge 155 commits from dev-jaanvi into main
pull from: dev-jaanvi
merge into: jaanvi:main
Conversation 1 Commits 155 Files changed 39 +250 -359
13 changed files with 250 additions and 359 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit 47d4b1254b - Show all commits

2
src/components/LogOut/logOutfunc.tsx
View file

@ -14,7 +14,7 @@ const Logout: React.FC<LogoutProps> = ({ setLogoutModal, logoutModal }) => {
const handlelogout = () => { const handlelogout = () => {
localStorage.clear(); localStorage.clear();
navigate("/auth/login"); navigate("/login");
toast.success("Logged out successfully"); toast.success("Logged out successfully");
setLogoutModal(false); setLogoutModal(false);
}; };

2
src/components/LogOutFunction/LogOutFunction.tsx
View file

@ -14,7 +14,7 @@ const Logout: React.FC<LogoutProps> = ({ setLogoutModal, logoutModal }) => {
const handlelogout = () => { const handlelogout = () => {
localStorage.clear(); localStorage.clear();
navigate("/auth/login"); navigate("/login");
toast.success("Logged out successfully"); toast.success("Logged out successfully");
setLogoutModal(false); setLogoutModal(false);
}; };

133
src/components/MainGrid/index.tsx
View file

@ -1,79 +1,66 @@
import * as React from 'react'; import * as React from "react";
import Grid from '@mui/material/Grid2'; import Grid from "@mui/material/Grid2";
import Box from '@mui/material/Box'; import Box from "@mui/material/Box";
import Stack from '@mui/material/Stack'; import Stack from "@mui/material/Stack";
import Typography from '@mui/material/Typography'; import Typography from "@mui/material/Typography";
import Copyright from '../../pages/Dashboard/internals/components/Copyright'; import Copyright from "../../pages/Dashboard/internals/components/Copyright";
import ChartUserByCountry from '../ChartUserByCountry'; import ChartUserByCountry from "../ChartUserByCountry";
import CustomizedTreeView from '../CustomizedTreeView'; import CustomizedTreeView from "../CustomizedTreeView";
import CustomizedDataGrid from '../CustomizedDataGrid'; import CustomizedDataGrid from "../CustomizedDataGrid";
import HighlightedCard from '../HighlightedCard'; import HighlightedCard from "../HighlightedCard";
import PageViewsBarChart from '../PageViewsBarChart'; import PageViewsBarChart from "../PageViewsBarChart";
import SessionsChart from '../SessionsChart'; import SessionsChart from "../SessionsChart";
import StatCard, { StatCardProps } from '../StatCard'; import StatCard, { StatCardProps } from "../StatCard";
const data: StatCardProps[] = [ const data: StatCardProps[] = [
{ {
title: 'Users', title: "Total Charge Stations",
value: '14k', value: "86",
interval: 'Last 30 days', },
trend: 'up', {
data: [ title: "Charging Completed",
200, 24, 220, 260, 240, 380, 100, 240, 280, 240, 300, 340, 320, 360, 340, value: "12",
380, 360, 400, 380, 420, 400, 640, 340, 460, 440, 480, 460, 600, 880, 920, },
], {
}, title: "Active Users",
{ value: "24",
title: 'Conversions', },
value: '325', {
interval: 'Last 30 days', title: "Total Energy Consumed",
trend: 'down', value: "08",
data: [ },
1640, 1250, 970, 1130, 1050, 900, 720, 1080, 900, 450, 920, 820, 840, 600,
820, 780, 800, 760, 380, 740, 660, 620, 840, 500, 520, 480, 400, 360, 300,
220,
],
},
{
title: 'Event count',
value: '200k',
interval: 'Last 30 days',
trend: 'neutral',
data: [
500, 400, 510, 530, 520, 600, 530, 520, 510, 730, 520, 510, 530, 620, 510,
530, 520, 410, 530, 520, 610, 530, 520, 610, 530, 420, 510, 430, 520, 510,
],
},
]; ];
export default function MainGrid() { export default function MainGrid() {
return ( return (
<Box sx={{ width: '100%', maxWidth: { sm: '100%', md: '1700px' } }}> <Box sx={{ width: "100%", maxWidth: { sm: "100%", md: "1700px" } }}>
{/* cards */} {/* cards */}
<Typography component="h2" variant="h6" sx={{ mb: 2 }}> <Typography component="h2" variant="h6" sx={{ mb: 2 }}>
Overview Overview
</Typography> </Typography>
<Grid <Grid
container container
spacing={2} spacing={2}
columns={12} columns={12}
sx={{ mb: (theme) => theme.spacing(2) }} sx={{ mb: (theme) => theme.spacing(2) }}
> >
{data.map((card, index) => ( {data.map((card, index) => (
<Grid key={index} size={{ xs: 12, sm: 6, lg: 3 }}> <Grid key={index} size={{ xs: 12, sm: 6, lg: 3 }}>
<StatCard {...card} /> <StatCard {...card} />
</Grid> </Grid>
))} ))}
<Grid size={{ xs: 12, sm: 6, lg: 3 }}>
<HighlightedCard />
</Grid> <Grid size={{ xs: 12, md: 6 }}>
<Grid size={{ xs: 12, md: 6 }}> <SessionsChart />
<SessionsChart /> <Grid size={{ xs: 12, md: 6 }}>
</Grid> <ChartUserByCountry />
<Grid size={{ xs: 12, md: 6 }}> </Grid>
<PageViewsBarChart /> </Grid>
</Grid> <Grid size={{ xs: 12, md: 6 }}>
</Grid> <PageViewsBarChart />
</Box> </Grid>
); </Grid>
</Box>
);
} }

25
src/components/MenuContent/index.tsx
View file

@ -19,11 +19,11 @@ const baseMenuItems = [
icon: <DashboardOutlinedIcon />, icon: <DashboardOutlinedIcon />,
url: "/panel/dashboard", url: "/panel/dashboard",
}, },
{ // {
text: "Admins", // text: "Admins",
icon: <AnalyticsRoundedIcon />, // icon: <AnalyticsRoundedIcon />,
url: "/panel/admin-list", // url: "/panel/admin-list",
}, // },
]; ];
@ -35,7 +35,7 @@ const superAdminOnlyItems = [
{ {
text: "Admin List", text: "Admin List",
icon: <ManageAccountsOutlinedIcon />, icon: <ManageAccountsOutlinedIcon />,
url: "/panel/adminlist", url: "/panel/admin-list",
}, },
]; ];
@ -53,7 +53,18 @@ export default function MenuContent({ hidden }: PropType) {
...baseMenuItems, ...baseMenuItems,
...(userRole === "superadmin" ? superAdminOnlyItems : []), ...(userRole === "superadmin" ? superAdminOnlyItems : []),
]; ];
// const mainListItems = [
// ...baseMenuItems,
// // ...(userRole === "superadmin"
// // ? [
// // // {
// // // text: "Admin List",
// // // icon: <ManageAccountsOutlinedIcon />,
// // // url: "/panel/admin-list",
// // // },
// // ]
// // : []),
// ];
return ( return (
<Stack sx={{ flexGrow: 1, p: 1, justifyContent: "space-between" }}> <Stack sx={{ flexGrow: 1, p: 1, justifyContent: "space-between" }}>
<List dense> <List dense>

286
src/components/SessionsChart/index.tsx
View file

@ -1,150 +1,144 @@
import * as React from 'react'; import * as React from "react";
import { useTheme } from '@mui/material/styles'; import { useTheme } from "@mui/material/styles";
import Card from '@mui/material/Card'; import Card from "@mui/material/Card";
import CardContent from '@mui/material/CardContent'; import CardContent from "@mui/material/CardContent";
import Chip from '@mui/material/Chip'; import Chip from "@mui/material/Chip";
import Typography from '@mui/material/Typography'; import Typography from "@mui/material/Typography";
import Stack from '@mui/material/Stack'; import Stack from "@mui/material/Stack";
import { LineChart } from '@mui/x-charts/LineChart'; import { LineChart } from "@mui/x-charts/LineChart";
import Box from "@mui/material/Box";
function AreaGradient({ color, id }: { color: string; id: string }) { import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
return (
<defs>
<linearGradient id={id} x1="50%" y1="0%" x2="50%" y2="100%">
<stop offset="0%" stopColor={color} stopOpacity={0.5} />
<stop offset="100%" stopColor={color} stopOpacity={0} />
</linearGradient>
</defs>
);
}
function getDaysInMonth(month: number, year: number) {
const date = new Date(year, month, 0);
const monthName = date.toLocaleDateString('en-US', {
month: 'short',
});
const daysInMonth = date.getDate();
const days = [];
let i = 1;
while (days.length < daysInMonth) {
days.push(`${monthName} ${i}`);
i += 1;
}
return days;
}
export default function SessionsChart() { export default function SessionsChart() {
const theme = useTheme(); return (
const data = getDaysInMonth(4, 2024); <Card variant="outlined" sx={{ width: "100%", height: "42%" }}>
<CardContent>
<Typography
variant="h6"
align="left"
color="text.secondary"
sx={{
fontFamily: "Gilroy",
fontWeight: 500,
fontSize: "18px",
lineHeight: "24px",
letterSpacing: "0%",
}}
>
Charging prices
</Typography>
<Box
sx={{
mt: "12px",
mb: "16px",
backgroundColor: "#F2F2F2",
color: "#212121",
fontSize: "14px",
lineHeight: "20px",
width: "700px",
height: "48px",
display: "flex",
justifyContent: "space-between",
alignItems: "center",
padding: "12px",
borderRadius: "8px",
border: "1px solid #454545",
}}
>
<Typography
sx={{
fontFamily: "Gilroy",
fontWeight: 500,
fontSize: "14px",
lineHeight: "24px",
letterSpacing: "0%",
backgroundColor: "#F2F2F2",
padding: "4px",
}}
>
Delhi NCR EV Station
</Typography>
<ArrowDropDownIcon />
</Box>
const colorPalette = [ {/* Grid container for the four boxes */}
theme.palette.primary.light, <Box
theme.palette.primary.main, sx={{
theme.palette.primary.dark, display: "grid",
]; gridTemplateColumns: "repeat(2, 1fr)",
gap: "40px",
return ( width: "700px",
<Card variant="outlined" sx={{ width: '100%' }}> mx: "auto",
<CardContent> }}
<Typography component="h2" variant="subtitle2" gutterBottom> >
Sessions <Box
</Typography> sx={{
<Stack sx={{ justifyContent: 'space-between' }}> height: "84px",
<Stack borderRadius: "8px",
direction="row" padding: "12px 16px",
sx={{ backgroundColor: "#F2F2F2",
alignContent: { xs: 'center', sm: 'flex-start' }, color: "#212121",
alignItems: 'center', }}
gap: 1, >
}} {/* Box 1 Content */}
> <Typography component="h1" variant="body2" gutterBottom>
<Typography variant="h4" component="p"> Basic Charging
13,277 </Typography>
</Typography> <Typography component="h1" variant="h5" gutterBottom>
<Chip size="small" color="success" label="+35%" /> 16.83 cents/kWh
</Stack> </Typography>
<Typography variant="caption" sx={{ color: 'text.secondary' }}> </Box>
Sessions per day for the last 30 days <Box
</Typography> sx={{
</Stack> height: "84px",
<LineChart borderRadius: "8px",
colors={colorPalette} padding: "12px 16px",
xAxis={[ backgroundColor: "#F2F2F2",
{ color: "#212121",
scaleType: 'point', }}
data, >
tickInterval: (index, i) => (i + 1) % 5 === 0, {/* Box 2 Content */}
}, <Typography component="h1" variant="body2" gutterBottom>
]} Basic Charging
series={[ </Typography>
{ <Typography component="h1" variant="h5" gutterBottom>
id: 'direct', 16.83 cents/kWh
label: 'Direct', </Typography>
showMark: false, </Box>
curve: 'linear', <Box
stack: 'total', sx={{
area: true, height: "84px",
stackOrder: 'ascending', borderRadius: "8px",
data: [ padding: "12px 16px",
300, 900, 600, 1200, 1500, 1800, 2400, 2100, 2700, 3000, 1800, 3300, backgroundColor: "#F2F2F2",
3600, 3900, 4200, 4500, 3900, 4800, 5100, 5400, 4800, 5700, 6000, color: "#212121",
6300, 6600, 6900, 7200, 7500, 7800, 8100, }}
], >
}, <Typography component="h1" variant="body2" gutterBottom>
{ Basic Charging
id: 'referral', </Typography>
label: 'Referral', <Typography component="h1" variant="h5" gutterBottom>
showMark: false, 16.83 cents/kWh
curve: 'linear', </Typography>
stack: 'total', </Box>
area: true, <Box
stackOrder: 'ascending', sx={{
data: [ height: "84px",
500, 900, 700, 1400, 1100, 1700, 2300, 2000, 2600, 2900, 2300, 3200, borderRadius: "8px",
3500, 3800, 4100, 4400, 2900, 4700, 5000, 5300, 5600, 5900, 6200, padding: "12px 16px",
6500, 5600, 6800, 7100, 7400, 7700, 8000, color: "#212121",
], backgroundColor: "#F2F2F2",
}, }}
{ >
id: 'organic', <Typography component="h1" variant="body2" gutterBottom>
label: 'Organic', Basic Charging
showMark: false, </Typography>
curve: 'linear', <Typography component="h1" variant="h5" gutterBottom>
stack: 'total', 16.83 cents/kWh
stackOrder: 'ascending', </Typography>
data: [ </Box>
1000, 1500, 1200, 1700, 1300, 2000, 2400, 2200, 2600, 2800, 2500, </Box>
3000, 3400, 3700, 3200, 3900, 4100, 3500, 4300, 4500, 4000, 4700, </CardContent>
5000, 5200, 4800, 5400, 5600, 5900, 6100, 6300, </Card>
], );
area: true,
},
]}
height={250}
margin={{ left: 50, right: 20, top: 20, bottom: 20 }}
grid={{ horizontal: true }}
sx={{
'& .MuiAreaElement-series-organic': {
fill: "url('#organic')",
},
'& .MuiAreaElement-series-referral': {
fill: "url('#referral')",
},
'& .MuiAreaElement-series-direct': {
fill: "url('#direct')",
},
}}
slotProps={{
legend: {
hidden: true,
},
}}
>
<AreaGradient color={theme.palette.primary.dark} id="organic" />
<AreaGradient color={theme.palette.primary.main} id="referral" />
<AreaGradient color={theme.palette.primary.light} id="direct" />
</LineChart>
</CardContent>
</Card>
);
} }

114
src/components/StatCard/index.tsx
View file

@ -12,118 +12,26 @@ import { areaElementClasses } from '@mui/x-charts/LineChart';
export type StatCardProps = { export type StatCardProps = {
title: string; title: string;
value: string; value: string;
interval: string;
trend: 'up' | 'down' | 'neutral';
data: number[];
}; };
function getDaysInMonth(month: number, year: number) {
const date = new Date(year, month, 0);
const monthName = date.toLocaleDateString('en-US', {
month: 'short',
});
const daysInMonth = date.getDate();
const days = [];
let i = 1;
while (days.length < daysInMonth) {
days.push(`${monthName} ${i}`);
i += 1;
}
return days;
}
function AreaGradient({ color, id }: { color: string; id: string }) {
return (
<defs>
<linearGradient id={id} x1="50%" y1="0%" x2="50%" y2="100%">
<stop offset="0%" stopColor={color} stopOpacity={0.3} />
<stop offset="100%" stopColor={color} stopOpacity={0} />
</linearGradient>
</defs>
);
}
export default function StatCard({ export default function StatCard({
title, title,
value, value,
interval,
trend,
data,
}: StatCardProps) { }: StatCardProps) {
const theme = useTheme();
const daysInWeek = getDaysInMonth(4, 2024);
const trendColors = {
up:
theme.palette.mode === 'light'
? theme.palette.success.main
: theme.palette.success.dark,
down:
theme.palette.mode === 'light'
? theme.palette.error.main
: theme.palette.error.dark,
neutral:
theme.palette.mode === 'light'
? theme.palette.grey[400]
: theme.palette.grey[700],
};
const labelColors = {
up: 'success' as const,
down: 'error' as const,
neutral: 'default' as const,
};
const color = labelColors[trend];
const chartColor = trendColors[trend];
const trendValues = { up: '+25%', down: '-25%', neutral: '+5%' };
return ( return (
<Card variant="outlined" sx={{ height: '100%', flexGrow: 1 }}> <Card variant="outlined" sx={{ height: "100%"}}>
<CardContent> <CardContent>
<Typography component="h2" variant="subtitle2" gutterBottom> <Typography component="h2" variant="subtitle2" gutterBottom>
{title} {title}
</Typography> </Typography>
<Stack <Typography component="h1" variant="body1" fontSize={30} fontWeight={700} gutterBottom>
direction="column" {value}
sx={{ justifyContent: 'space-between', flexGrow: '1', gap: 1 }} </Typography>
> </CardContent>
<Stack sx={{ justifyContent: 'space-between' }}> </Card>
<Stack
direction="row"
sx={{ justifyContent: 'space-between', alignItems: 'center' }}
>
<Typography variant="h4" component="p">
{value}
</Typography>
<Chip size="small" color={color} label={trendValues[trend]} />
</Stack>
<Typography variant="caption" sx={{ color: 'text.secondary' }}>
{interval}
</Typography>
</Stack>
<Box sx={{ width: '100%', height: 50 }}>
<SparkLineChart
colors={[chartColor]}
data={data}
area
showHighlight
showTooltip
xAxis={{
scaleType: 'band',
data: daysInWeek, // Use the correct property 'data' for xAxis
}}
sx={{
[`& .${areaElementClasses.root}`]: {
fill: `url(#area-gradient-${value})`,
},
}}
>
<AreaGradient color={chartColor} id={`area-gradient-${value}`} />
</SparkLineChart>
</Box>
</Stack>
</CardContent>
</Card>
); );
} }

2
src/pages/Auth/Login/index.tsx
View file

@ -328,7 +328,7 @@ export default function Login(props: { disableCustomTheme?: boolean }) {
<Typography sx={{ textAlign: "center" }}> <Typography sx={{ textAlign: "center" }}>
Don&apos;t have an account?{" "} Don&apos;t have an account?{" "}
<Link <Link
href="/auth/signup" href="/signup"
variant="body2" variant="body2"
sx={{ alignSelf: "center" }} sx={{ alignSelf: "center" }}
> >

4
src/pages/Auth/SignUp/index.tsx
View file

@ -133,7 +133,7 @@ export default function SignUp(props: { disableCustomTheme?: boolean }) {
}; };
await dispatch(registerUser(payload)).unwrap(); await dispatch(registerUser(payload)).unwrap();
navigate("/auth/login"); navigate("/login");
toast.success("Registration successful!"); toast.success("Registration successful!");
} catch (error: any) { } catch (error: any) {
toast.error(error?.message || "Registration failed"); toast.error(error?.message || "Registration failed");
@ -347,7 +347,7 @@ export default function SignUp(props: { disableCustomTheme?: boolean }) {
<Typography sx={{ textAlign: "center" }}> <Typography sx={{ textAlign: "center" }}>
Already have an account? &nbsp; Already have an account? &nbsp;
<Link <Link
href="/auth/login" href="/login"
variant="body2" variant="body2"
sx={{ alignSelf: "center" }} sx={{ alignSelf: "center" }}
> >

6
src/pages/Dashboard/index.tsx
View file

@ -30,7 +30,7 @@ const Dashboard: React.FC<DashboardProps> = ({ disableCustomTheme = false }) =>
<AppTheme {...{ disableCustomTheme }} themeComponents={xThemeComponents}> <AppTheme {...{ disableCustomTheme }} themeComponents={xThemeComponents}>
<CssBaseline enableColorScheme /> <CssBaseline enableColorScheme />
{!disableCustomTheme ? ( {!disableCustomTheme ? (
<><MainGrid /><AdminList /></> <><MainGrid /></>
) : ( ) : (
<Box <Box
sx={{ sx={{
@ -46,9 +46,7 @@ const Dashboard: React.FC<DashboardProps> = ({ disableCustomTheme = false }) =>
<Typography variant="h6" component="h1" gutterBottom> <Typography variant="h6" component="h1" gutterBottom>
Dashboard Dashboard
</Typography> </Typography>
<Typography variant="body1" sx={{ marginTop: 2 }}>
No content available on the Dashboard yet.
</Typography>
</Box> </Box>
</Box> </Box>
)} )}

13
src/redux/slices/adminSlice.ts
View file

@ -37,7 +37,7 @@ export const adminList = createAsyncThunk<
{ rejectValue: string } { rejectValue: string }
>("FetchAdminList", async (_, { rejectWithValue }) => { >("FetchAdminList", async (_, { rejectWithValue }) => {
try { try {
const response = await http.get("auth/admin-list"); const response = await http.get("/admin-list");
return response?.data?.data; return response?.data?.data;
} catch (error: any) { } catch (error: any) {
toast.error("Error fetching users list" + error); toast.error("Error fetching users list" + error);
@ -55,7 +55,7 @@ export const deleteAdmin = createAsyncThunk<
{ rejectValue: string } { rejectValue: string }
>("deleteAdmin", async (id, { rejectWithValue }) => { >("deleteAdmin", async (id, { rejectWithValue }) => {
try { try {
const response = await http.delete(`auth/${id}/delete-admin`); const response = await http.delete(`/${id}/delete-admin`);
toast.success(response.data?.message); toast.success(response.data?.message);
return id; return id;
} catch (error: any) { } catch (error: any) {
@ -76,9 +76,9 @@ export const createAdmin = createAsyncThunk<
registeredAddress: string; registeredAddress: string;
}, },
{ rejectValue: string } { rejectValue: string }
>("auth/signup", async (data, { rejectWithValue }) => { >("/create-admin", async (data, { rejectWithValue }) => {
try { try {
const response = await http.post("auth/create-admin", data); const response = await http.post("/create-admin", data);
return response.data; return response.data;
} catch (error: any) { } catch (error: any) {
return rejectWithValue( return rejectWithValue(
@ -92,10 +92,7 @@ export const updateAdmin = createAsyncThunk(
"updateAdmin", "updateAdmin",
async ({ id, ...userData }: User, { rejectWithValue }) => { async ({ id, ...userData }: User, { rejectWithValue }) => {
try { try {
const response = await http.put( const response = await http.put(`/${id}/update-admin`, userData);
`auth/${id}/update-admin`,
userData
);
toast.success("Admin updated successfully"); toast.success("Admin updated successfully");
return response?.data; return response?.data;
} catch (error: any) { } catch (error: any) {

4
src/redux/slices/authSlice.ts
View file

@ -45,7 +45,7 @@ export const loginUser = createAsyncThunk<
//use below commented endpoint if using deployed backend........ //use below commented endpoint if using deployed backend........
// const response = await http.post("admin/login", { // const response = await http.post("admin/login", {
const response = await http.post("admin/login", { const response = await http.post("/login", {
email, email,
password, password,
}); });
@ -75,7 +75,7 @@ export const registerUser = createAsyncThunk<
{ rejectValue: string } { rejectValue: string }
>("SignUpUser", async (data, { rejectWithValue }) => { >("SignUpUser", async (data, { rejectWithValue }) => {
try { try {
const response = await http.post("auth/signup", data); const response = await http.post("/signup", data);
return response.data; return response.data;
} catch (error: any) { } catch (error: any) {
return rejectWithValue( return rejectWithValue(

2
src/redux/slices/profileSlice.ts
View file

@ -26,7 +26,7 @@ export const fetchAdminProfile = createAsyncThunk<
const token = localStorage?.getItem("authToken"); const token = localStorage?.getItem("authToken");
if (!token) throw new Error("No token found"); if (!token) throw new Error("No token found");
const response = await http.get("/auth/profile"); const response = await http.get("/profile");
if (!response.data?.data) throw new Error("Invalid API response"); if (!response.data?.data) throw new Error("Invalid API response");

16
src/router.tsx
View file

@ -1,8 +1,4 @@
import { import { Routes as BaseRoutes, Navigate, Route } from "react-router-dom";
Routes as BaseRoutes,
Navigate,
Route,
} from "react-router-dom";
import React, { lazy, Suspense } from "react"; import React, { lazy, Suspense } from "react";
import LoadingComponent from "./components/Loading"; import LoadingComponent from "./components/Loading";
import DashboardLayout from "./layouts/DashboardLayout"; import DashboardLayout from "./layouts/DashboardLayout";
@ -24,7 +20,7 @@ interface ProtectedRouteProps {
// Protected Route Component // Protected Route Component
const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ caps, component }) => { const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ caps, component }) => {
if (!localStorage.getItem("authToken")) { if (!localStorage.getItem("authToken")) {
return <Navigate to="/auth/login" replace />; return <Navigate to="/login" replace />;
} }
return component; return component;
}; };
@ -35,13 +31,13 @@ export default function AppRouter() {
<Suspense fallback={<LoadingComponent />}> <Suspense fallback={<LoadingComponent />}>
<BaseRoutes> <BaseRoutes>
{/* Default Route */} {/* Default Route */}
<Route element={<Navigate to="/auth/login" replace />} index /> <Route element={<Navigate to="/login" replace />} index />
{/* Auth Routes */} {/* Auth Routes */}
<Route path="/auth"> <Route path="">
<Route <Route
path="" path=""
element={<Navigate to="/auth/login" replace />} element={<Navigate to="/login" replace />}
index index
/> />
<Route path="login" element={<Login />} /> <Route path="login" element={<Login />} />
@ -90,7 +86,7 @@ export default function AppRouter() {
</Route> </Route>
{/* Catch-all Route */} {/* Catch-all Route */}
<Route path="*" element={<NotFoundPage/>} /> <Route path="*" element={<NotFoundPage />} />
</BaseRoutes> </BaseRoutes>
</Suspense> </Suspense>
); );