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 +429 -588
39 changed files with 429 additions and 588 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit dc327f97fc - Show all commits

139
src/components/AddAdmin/index.tsx
View file

@ -1,139 +0,0 @@
// import React from "react";
// import {
// Button,
// Dialog,
// DialogActions,
// DialogContent,
// DialogTitle,
// TextField,
// } from "@mui/material";
// import { useForm, Controller } from "react-hook-form";
// interface AddAdminModalProps {
// open: boolean;
// handleClose: () => void;
// handleAdd: (name: string, email: string, phone: string, registeredAddress: string) => void;
// }
// interface FormData {
// name: string;
// email: string;
// phone: string;
// registeredAddress: string;
// }
// const AddAdminModal: React.FC<AddAdminModalProps> = ({ open, handleClose, handleAdd }) => {
// const { control, handleSubmit, reset, formState: { errors } } = useForm<FormData>({
// defaultValues: {
// name: "",
// email: "",
// phone: "",
// registeredAddress: "",
// },
// });
// const onSubmit = (data: FormData) => {
// handleAdd(data.name, data.email, data.phone, data.registeredAddress);
// handleClose();
// reset();
// };
// return (
// <Dialog
// open={open}
// onClose={handleClose}
// maxWidth="md"
// fullWidth
// PaperProps={{
// component: "form",
// onSubmit: handleSubmit(onSubmit),
// }}
// >
// <DialogTitle>Add Admin</DialogTitle>
// <DialogContent>
// <Controller
// name="name"
// control={control}
// rules={{ required: "Admin Name is required" }}
// render={({ field }) => (
// <TextField
// {...field}
// autoFocus
// required
// margin="dense"
// label="Admin Name"
// type="text"
// fullWidth
// variant="standard"
// error={!!errors.name}
// helperText={errors.name?.message}
// />
// )}
// />
// <Controller
// name="email"
// control={control}
// rules={{ required: "Email is required" }}
// render={({ field }) => (
// <TextField
// {...field}
// required
// margin="dense"
// label="Email"
// type="text"
// fullWidth
// variant="standard"
// error={!!errors.email}
// helperText={errors.email?.message}
// />
// )}
// />
// <Controller
// name="phone"
// control={control}
// rules={{ required: "Phone number is required" }}
// render={({ field }) => (
// <TextField
// {...field}
// required
// margin="dense"
// label="Phone Number"
// type="text"
// fullWidth
// variant="standard"
// error={!!errors.phone}
// helperText={errors.phone?.message}
// />
// )}
// />
// <Controller
// name="registeredAddress"
// control={control}
// rules={{ required: "Address is required" }}
// render={({ field }) => (
// <TextField
// {...field}
// required
// margin="dense"
// label="Address"
// type="text"
// fullWidth
// variant="standard"
// error={!!errors.registeredAddress}
// helperText={errors.registeredAddress?.message}
// />
// )}
// />
// </DialogContent>
// <DialogActions>
// <Button onClick={handleClose}>Cancel</Button>
// <Button type="submit">Save</Button>
// </DialogActions>
// </Dialog>
// );
// };
// export default AddAdminModal;

12
src/components/AddBookingModal/index.tsx → src/components/AddBookingModal/addBookingModal.tsx
View file

@ -5,12 +5,10 @@ import {
Button, Button,
Typography, Typography,
Modal, Modal,
IconButton,
MenuItem, MenuItem,
Select, Select,
InputLabel, InputLabel,
FormControl, FormControl,
TextField,
} from "@mui/material"; } from "@mui/material";
import CloseIcon from "@mui/icons-material/Close"; import CloseIcon from "@mui/icons-material/Close";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
@ -19,16 +17,15 @@ import {
bookingList, bookingList,
getCarNames, getCarNames,
getCarPorts, getCarPorts,
} from "../../redux/slices/bookSlice"; } from "../../redux/slices/bookSlice.ts";
import { AppDispatch, RootState } from "../../redux/store/store"; import { AppDispatch, RootState } from "../../redux/store/store.ts";
import { toast } from "sonner"; import { toast } from "sonner";
import { import {
CustomIconButton, CustomIconButton,
CustomTextField, CustomTextField,
} from "../AddEditUserModel/styled.css.tsx"; } from "../AddEditUserModel/styled.css.tsx";
import { getAllStations, stationList } from "../../redux/slices/stationSlice.ts"; import { getAllStations } from "../../redux/slices/stationSlice.ts";
import { fetchAvailableSlots } from "../../redux/slices/slotSlice.ts"; import { fetchAvailableSlots } from "../../redux/slices/slotSlice.ts";
import dayjs from "dayjs";
export default function AddBookingModal({ export default function AddBookingModal({
open, open,
@ -53,7 +50,6 @@ export default function AddBookingModal({
const availableSlots = useSelector( const availableSlots = useSelector(
(state: RootState) => state.slotReducer.availableSlots (state: RootState) => state.slotReducer.availableSlots
); );
console.log("first", availableSlots);
useEffect(() => { useEffect(() => {
dispatch(fetchAvailableSlots()); dispatch(fetchAvailableSlots());
dispatch(getAllStations()); dispatch(getAllStations());
@ -164,7 +160,7 @@ console.log("Car Ports: ", carPorts);
</MenuItem> </MenuItem>
))} ))}
</Select> </Select>
{errors.stationName && ( {errors.stationId && (
<Typography color="error" variant="body2"> <Typography color="error" variant="body2">
{errors.stationName.message} {errors.stationName.message}
</Typography> </Typography>

49
src/components/AddEditCategoryModal/index.tsx → src/components/AddEditAdminModal/addEditAdminModal.tsx
View file

@ -1,12 +1,5 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { import { Box, Button, Typography, Modal, InputAdornment } from "@mui/material";
Box,
Button,
Typography,
Modal,
InputAdornment,
} from "@mui/material";
import CloseIcon from "@mui/icons-material/Close"; import CloseIcon from "@mui/icons-material/Close";
import Visibility from "@mui/icons-material/Visibility"; import Visibility from "@mui/icons-material/Visibility";
import VisibilityOff from "@mui/icons-material/VisibilityOff"; import VisibilityOff from "@mui/icons-material/VisibilityOff";
@ -54,6 +47,7 @@ const AddEditCategoryModal: React.FC<AddEditCategoryModalProps> = ({
formState: { errors }, formState: { errors },
setValue, setValue,
reset, reset,
clearErrors,
} = useForm<FormData>({ } = useForm<FormData>({
defaultValues: { defaultValues: {
name: "", name: "",
@ -91,22 +85,29 @@ const AddEditCategoryModal: React.FC<AddEditCategoryModalProps> = ({
setValue("email", editRow.email); setValue("email", editRow.email);
setValue("phone", editRow.phone); setValue("phone", editRow.phone);
setValue("registeredAddress", editRow.registeredAddress); setValue("registeredAddress", editRow.registeredAddress);
clearErrors();
} else { } else {
reset(); reset();
clearErrors();
} }
}, [editRow, setValue, reset]); }, [editRow, setValue, reset]);
const handleCloseModal = () => {
reset();
clearErrors();
handleClose();
};
return ( return (
<Modal <Modal
open={open} open={open}
key={open ? "open" : "closed"}
onClose={(e, reason) => { onClose={(e, reason) => {
if (reason === "backdropClick") { if (reason === "backdropClick") {
return; return;
} }
handleClose(); // Close modal when clicking cross or cancel
handleCloseModal();
}} }}
aria-labelledby="add-edit-category-modal" aria-labelledby="add-edit-category-modal"
> >
@ -134,7 +135,7 @@ const AddEditCategoryModal: React.FC<AddEditCategoryModalProps> = ({
<Typography variant="h6" fontWeight={600}> <Typography variant="h6" fontWeight={600}>
{editRow ? "Edit Admin" : "Add Admin"} {editRow ? "Edit Admin" : "Add Admin"}
</Typography> </Typography>
<CustomIconButton onClick={handleClose}> <CustomIconButton onClick={handleCloseModal}>
<CloseIcon /> <CloseIcon />
</CustomIconButton> </CustomIconButton>
</Box> </Box>
@ -334,19 +335,17 @@ const AddEditCategoryModal: React.FC<AddEditCategoryModalProps> = ({
control={control} control={control}
rules={{ rules={{
required: "Phone number is required", required: "Phone number is required",
pattern: { validate: (value) => {
value: /^[0-9]*$/, if (!/^[0-9]*$/.test(value)) {
message: "Only numbers are allowed", return "Only numbers are allowed";
}, }
minLength: { if (value.length < 6) {
value: 6, return "Phone number must be at least 6 digits";
message: }
"Phone number must be at least 6 digits", if (value.length > 14) {
}, return "Phone number must be at most 14 digits";
maxLength: { }
value: 14, return true; // No errors
message:
"Phone number must be at most 14 digits",
}, },
}} }}
render={({ field }) => ( render={({ field }) => (

2
src/components/AddManagerModal/index.tsx → src/components/AddManagerModal/addManagerModal.tsx
View file

@ -14,7 +14,7 @@ import {
import CloseIcon from "@mui/icons-material/Close"; import CloseIcon from "@mui/icons-material/Close";
import { Visibility, VisibilityOff } from "@mui/icons-material"; import { Visibility, VisibilityOff } from "@mui/icons-material";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { addManager, managerList } from "../../redux/slices/managerSlice"; import { addManager, managerList } from "../../redux/slices/managerSlice.ts";
import { import {
CustomIconButton, CustomIconButton,
CustomTextField, CustomTextField,

0
src/components/AddSlotModal/index.tsx → src/components/AddSlotModal/addSlotModal.tsx
View file

4
src/components/AddStationModal/index.tsx → src/components/AddStationModal/addStationModal.tsx
View file

@ -19,7 +19,7 @@ import { RootState } from "../../redux/reducers.ts";
import { import {
fetchVehicleBrands, fetchVehicleBrands,
vehicleList, vehicleList,
} from "../../redux/slices/VehicleSlice"; // Adjust this import path accordingly } from "../../redux/slices/VehicleSlice.ts"; // Adjust this import path accordingly
import { import {
CustomIconButton, CustomIconButton,
CustomTextField, CustomTextField,
@ -305,8 +305,6 @@ export default function AddStationModal({
</FormControl> </FormControl>
</Box> </Box>
<Box <Box
sx={{ sx={{
display: "flex", display: "flex",

0
src/components/AddVehicleModal/index.tsx → src/components/AddVehicleModal/addVehicleModal.tsx
View file

0
src/components/AvailableSlotModal/index.tsx → src/components/AvailableSlotModal/availableSlotsModal.tsx
View file

16
src/components/CustomTable/index.tsx → src/components/CustomTable/customTable.tsx
View file

@ -7,10 +7,10 @@ import TableContainer from "@mui/material/TableContainer";
import TableHead from "@mui/material/TableHead"; import TableHead from "@mui/material/TableHead";
import TableRow from "@mui/material/TableRow"; import TableRow from "@mui/material/TableRow";
import Paper, { paperClasses } from "@mui/material/Paper"; import Paper, { paperClasses } from "@mui/material/Paper";
import { adminList, deleteAdmin } from "../../redux/slices/adminSlice"; import { adminList, deleteAdmin } from "../../redux/slices/adminSlice.ts";
import { vehicleList, deleteVehicle } from "../../redux/slices/VehicleSlice"; import { vehicleList, deleteVehicle } from "../../redux/slices/VehicleSlice.ts";
import { deleteManager, managerList } from "../../redux/slices/managerSlice"; import { deleteManager, managerList } from "../../redux/slices/managerSlice.ts";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { import {
Box, Box,
@ -23,15 +23,15 @@ import {
Typography, Typography,
} from "@mui/material"; } from "@mui/material";
jaanvi marked this conversation as resolved Outdated
arshdeep-dml commented 2025-06-02 09:50:36 +00:00
Outdated
Review
Copy link

Color codes are already defined in the theme; use theme values instead of hardcoded colors.
Theme file path src/shared-theme/AppTheme.tsx

Color codes are already defined in the theme; use theme values instead of hardcoded colors. Theme file path src/shared-theme/AppTheme.tsx
import MoreHorizRoundedIcon from "@mui/icons-material/MoreHorizRounded"; import MoreHorizRoundedIcon from "@mui/icons-material/MoreHorizRounded";
jaanvi marked this conversation as resolved Outdated
VishalMaurya commented 2025-06-02 07:24:14 +00:00
Outdated
Review
Copy link

Don't use the hardcoded color codes

Don't use the hardcoded color codes
import DeleteModal from "../Modals/DeleteModal"; import DeleteModal from "../Modals/DeleteModal/index.tsx";
import { AppDispatch, RootState } from "../../redux/store/store"; import { AppDispatch, RootState } from "../../redux/store/store.ts";
import ViewModal from "../Modals/ViewModal"; import ViewModal from "../Modals/ViewModal/index.tsx";
import VehicleViewModal from "../Modals/VehicleViewModal"; import VehicleViewModal from "../Modals/VehicleViewModal/index.tsx";
import SearchIcon from "@mui/icons-material/Search"; import SearchIcon from "@mui/icons-material/Search";
import TuneIcon from "@mui/icons-material/Tune"; import TuneIcon from "@mui/icons-material/Tune";
import { CustomIconButton } from "../AddEditUserModel/styled.css.tsx"; import { CustomIconButton } from "../AddEditUserModel/styled.css.tsx";
import ManagerViewModal from "../Modals/ViewManagerModal"; import ManagerViewModal from "../Modals/ViewManagerModal/index.tsx";
import UserViewModal from "../Modals/UserViewModal/index.tsx"; import UserViewModal from "../Modals/UserViewModal/index.tsx";
import { deleteUser, userList } from "../../redux/slices/userSlice.ts"; import { deleteUser, userList } from "../../redux/slices/userSlice.ts";
import { deleteStation, stationList } from "../../redux/slices/stationSlice.ts"; import { deleteStation, stationList } from "../../redux/slices/stationSlice.ts";

153
src/components/EditAdmin/index.tsx
View file

@ -1,153 +0,0 @@
// import React, { useEffect } from "react";
// import {
// Button,
// Dialog,
// DialogActions,
// DialogContent,
// DialogTitle,
// TextField,
// } from "@mui/material";
// import { useForm, Controller } from "react-hook-form";
// interface EditAdminModalProps {
// open: boolean;
// handleClose: () => void;
// handleUpdate: (id: string, name: string, email: string, phone: string, registeredAddress: string) => void;
// editRow: any;
// }
// interface FormData {
// name: string;
// email: string;
// phone: string;
// registeredAddress: string;
// }
// const EditAdminModal: React.FC<EditAdminModalProps> = ({ open, handleClose, editRow, handleUpdate }) => {
// const { control, handleSubmit, setValue, reset, formState: { errors } } = useForm<FormData>({
// defaultValues: {
// name: "",
// email: "",
// phone: "",
// registeredAddress: "",
// },
// });
// useEffect(() => {
// if (editRow) {
// setValue("name", editRow.name);
// setValue("email", editRow.email);
// setValue("phone", editRow.phone);
// setValue("registeredAddress", editRow.registeredAddress);
// } else {
// reset();
// }
// }, [editRow, setValue, reset]);
// const onSubmit = (data: FormData) => {
// if (editRow) {
// handleUpdate(editRow.id, data.name, data.email, data.phone, data.registeredAddress);
// handleClose();
// reset();
// }
// };
// return (
// <Dialog
// open={open}
// onClose={handleClose}
// maxWidth="md"
// fullWidth
// PaperProps={{
// component: "form",
// onSubmit: handleSubmit(onSubmit),
// }}
// >
// <DialogTitle>Edit Admin</DialogTitle>
// <DialogContent>
// <Controller
// name="name"
// control={control}
// rules={{ required: "Admin Name is required" }}
// render={({ field }) => (
// <TextField
// {...field}
// autoFocus
// required
// margin="dense"
// label="Admin Name"
// type="text"
// fullWidth
// variant="standard"
// error={!!errors.name}
// helperText={errors.name?.message}
// />
// )}
// />
// <Controller
// name="email"
// control={control}
// rules={{ required: "Email is required" }}
// render={({ field }) => (
// <TextField
// {...field}
// required
// margin="dense"
// label="Email"
// type="text"
// fullWidth
// variant="standard"
// error={!!errors.email}
// helperText={errors.email?.message}
// />
// )}
// />
// <Controller
// name="phone"
// control={control}
// rules={{ required: "Phone number is required" }}
// render={({ field }) => (
// <TextField
// {...field}
// required
// margin="dense"
// label="Phone Number"
// type="text"
// fullWidth
// variant="standard"
// error={!!errors.phone}
// helperText={errors.phone?.message}
// />
// )}
// />
// <Controller
// name="registeredAddress"
// control={control}
// rules={{ required: "Address is required" }}
// render={({ field }) => (
// <TextField
// {...field}
// required
// margin="dense"
// label="Address"
// type="text"
// fullWidth
// variant="standard"
// error={!!errors.registeredAddress}
// helperText={errors.registeredAddress?.message}
// />
// )}
// />
// </DialogContent>
// <DialogActions>
// <Button onClick={handleClose}>Cancel</Button>
// <Button type="submit">Save</Button>
// </DialogActions>
// </Dialog>
// );
// };
// export default EditAdminModal;

3
src/components/EditManagerModal/index.tsx → src/components/EditManagerModal/editManagerModal.tsx
View file

@ -9,7 +9,7 @@ import {
import CloseIcon from "@mui/icons-material/Close"; import CloseIcon from "@mui/icons-material/Close";
import { useForm, Controller } from "react-hook-form"; import { useForm, Controller } from "react-hook-form";
import { useDispatch } from "react-redux"; import { useDispatch } from "react-redux";
import { managerList, updateManager } from "../../redux/slices/managerSlice"; // Import the updateManager action import { managerList, updateManager } from "../../redux/slices/managerSlice.ts"; // Import the updateManager action
import { import {
CustomIconButton, CustomIconButton,
CustomTextField, CustomTextField,
@ -82,7 +82,6 @@ const EditManagerModal: React.FC<EditManagerModalProps> = ({
email: data.email, email: data.email,
phone: data.phone, phone: data.phone,
stationId: data.stationId, stationId: data.stationId,
}, },
}) })
).unwrap(); // Ensure that it throws an error if the update fails ).unwrap(); // Ensure that it throws an error if the update fails

6
src/components/EditSlotModal/index.tsx → src/components/EditSlotModal/editSlotModal.tsx
View file

@ -9,7 +9,10 @@ import {
import CloseIcon from "@mui/icons-material/Close"; import CloseIcon from "@mui/icons-material/Close";
import { useForm, Controller } from "react-hook-form"; import { useForm, Controller } from "react-hook-form";
import { useDispatch } from "react-redux"; import { useDispatch } from "react-redux";
import { updateSlot, fetchAvailableSlots } from "../../redux/slices/slotSlice"; // Update with correct action import {
updateSlot,
fetchAvailableSlots,
} from "../../redux/slices/slotSlice.ts"; // Update with correct action
import { import {
CustomIconButton, CustomIconButton,
CustomTextField, CustomTextField,
@ -76,7 +79,6 @@ const EditSlotModal: React.FC<EditSlotModalProps> = ({
setLoading(true); setLoading(true);
try { try {
const availabilityStatus = isAvailable ? true : false; const availabilityStatus = isAvailable ? true : false;
await dispatch( await dispatch(

0
src/components/EditStationModal/index.tsx → src/components/EditStationModal/editSationModal.tsx
View file

0
src/components/EditVehicleModal/index.tsx → src/components/EditVehicleModal/editVehicleModal.tsx
View file

2
src/components/Header/index.tsx
View file

@ -9,7 +9,7 @@ import Divider from "@mui/material/Divider";
import MenuButton from "../MenuButton"; import MenuButton from "../MenuButton";
import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown"; import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
import NotificationsRoundedIcon from "@mui/icons-material/NotificationsRounded"; import NotificationsRoundedIcon from "@mui/icons-material/NotificationsRounded";
import SideMenu from "../SideMenu"; import SideMenu from "../SideMenu/sideMenu";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { AppDispatch, RootState } from "../../redux/store/store"; import { AppDispatch, RootState } from "../../redux/store/store";
import { fetchAdminProfile } from "../../redux/slices/profileSlice"; import { fetchAdminProfile } from "../../redux/slices/profileSlice";

51
src/components/LineChartCard/index.tsx → src/components/LineChartCard/lineChartCard.tsx
View file

@ -2,13 +2,12 @@ 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 Typography from "@mui/material/Typography"; import Typography from "@mui/material/Typography";
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"; import { FormControl, MenuItem, Select } from "@mui/material";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
function AreaGradient({ color, id }: { color: string; id: string }) { function AreaGradient({ color, id }: { color: string; id: string }) {
return ( return (
<defs> <defs>
<linearGradient id={id} x1="50%" y1="0%" x2="50%" y2="100%"> <linearGradient id={id} x1="50%" y1="0%" x2="50%" y2="100%">
@ -39,6 +38,12 @@ export default function LineChartCard() {
const data = getDaysInMonth(4, 2024); const data = getDaysInMonth(4, 2024);
const colorPalette = [theme.palette.primary.light]; const colorPalette = [theme.palette.primary.light];
const [selectedOption, setSelectedOption] = React.useState("Weekly");
const handleChange = (event: { target: { value: React.SetStateAction<string>; }; }) => {
setSelectedOption(event.target.value);
};
return ( return (
<Card <Card
@ -73,7 +78,7 @@ export default function LineChartCard() {
> >
Sales Stats Sales Stats
</Typography> </Typography>
<Box <FormControl
sx={{ sx={{
mt: 2, mt: 2,
mb: 2, mb: 2,
@ -83,38 +88,32 @@ export default function LineChartCard() {
display: "flex", display: "flex",
justifyContent: "center", justifyContent: "center",
alignItems: "center", alignItems: "center",
p: 1.5, // p: 1.5,
borderRadius: "8px",
border: "1px solid #454545",
color: "#F2F2F2", color: "#F2F2F2",
width: "149px",
width: "129px",
height: "44px", height: "44px",
padding: "12px 16px", padding: "12px 16px",
gap: "8px", gap: "8px",
}} }}
> >
<Typography <Select
width={"69px"} value={selectedOption}
height={"16px"} onChange={handleChange}
sx={{ sx={{
fontWeight: 500, //backgroundColor: "#202020",
fontSize: "14px",
lineHeight: "24px",
color: "#D9D8D8", color: "#D9D8D8",
".MuiSelect-icon": {
textAlign: "center", color: "#F2F2F2", // Icon color
},
}} }}
IconComponent={ExpandMoreIcon}
> >
Weekly <MenuItem value="Monthly">Monthly</MenuItem>
</Typography> <MenuItem value="Weekly">Weekly</MenuItem>
<ExpandMoreIcon <MenuItem value="Daily">Daily</MenuItem>
width="20px" <MenuItem value="Yearly">Yearly</MenuItem>
height="20px" </Select>
</FormControl>
sx={{ color: "#F2F2F2" }}
/>
</Box>
</div> </div>
<LineChart <LineChart

10
src/components/MainGrid/index.tsx → src/components/MainGrid/mainGrid.tsx
View file

@ -9,13 +9,13 @@ 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/sessionChart";
import StatCard, { StatCardProps } from "../StatCard"; import StatCard, { StatCardProps } from "../StatCard/statCard";
import ResourcesPieChart from "../ResourcePieChart"; import ResourcesPieChart from "../ResourcePieChart/resourcePieChart";
import { BarChart } from "@mui/icons-material"; import { BarChart } from "@mui/icons-material";
import RoundedBarChart from "../barChartCard"; import RoundedBarChart from "../barChartCard/barChartCard";
import { LineHighlightPlot } from "@mui/x-charts"; import { LineHighlightPlot } from "@mui/x-charts";
import LineChartCard from "../LineChartCard"; import LineChartCard from "../LineChartCard/lineChartCard";
const data: StatCardProps[] = [ const data: StatCardProps[] = [
{ {

3
src/components/ResourcePieChart/index.tsx → src/components/ResourcePieChart/resourcePieChart.tsx
View file

@ -1,7 +1,4 @@
import * as React from "react";
import { PieChart } from "@mui/x-charts/PieChart"; import { PieChart } from "@mui/x-charts/PieChart";
import { useDrawingArea } from "@mui/x-charts/hooks";
import { styled } from "@mui/material/styles";
import Typography from "@mui/material/Typography"; import Typography from "@mui/material/Typography";
import Card from "@mui/material/Card"; import Card from "@mui/material/Card";
import CardContent from "@mui/material/CardContent"; import CardContent from "@mui/material/CardContent";

68
src/components/SessionsChart/index.tsx → src/components/SessionsChart/sessionChart.tsx
View file

@ -3,10 +3,20 @@ import Card from "@mui/material/Card";
import CardContent from "@mui/material/CardContent"; import CardContent from "@mui/material/CardContent";
import Typography from "@mui/material/Typography"; import Typography from "@mui/material/Typography";
import Box from "@mui/material/Box"; import Box from "@mui/material/Box";
import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown"; import Select from "@mui/material/Select";
import MenuItem from "@mui/material/MenuItem";
import FormControl from "@mui/material/FormControl";
import InputLabel from "@mui/material/InputLabel";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
export default function SessionsChart() { export default function SessionsChart() {
const [selectedStation, setSelectedStation] = React.useState(
"Delhi NCR EV Station"
);
const handleChange = (event: { target: { value: React.SetStateAction<string>; }; }) => {
setSelectedStation(event.target.value);
};
return ( return (
<Card <Card
variant="outlined" variant="outlined"
@ -19,7 +29,6 @@ export default function SessionsChart() {
"*:where([data-mui-color-scheme='dark']) &": { "*:where([data-mui-color-scheme='dark']) &": {
backgroundColor: "#202020", backgroundColor: "#202020",
}, },
}} }}
> >
<CardContent> <CardContent>
@ -42,40 +51,43 @@ export default function SessionsChart() {
Charging prices Charging prices
</Typography> </Typography>
{/* Responsive dropdown box */} {/* Dropdown button */}
<Box <FormControl
sx={{ sx={{
mt: 2, mt: 2,
mb: 2, mb: 2,
backgroundColor: "#202020", width: "100%",
fontSize: "14px", // backgroundColor: "#202020",
lineHeight: "20px",
width: { xs: "100%" },
height: "48px",
display: "flex",
justifyContent: "space-between",
alignItems: "center",
p: 1.5,
borderRadius: "8px",
border: "1px solid #454545", border: "1px solid #454545",
borderRadius: "8px",
}} }}
> >
<Typography
width="134px"
height="24px"
sx={{
fontFamily: "Gilroy",
fontWeight: 500,
fontSize: "14px",
lineHeight: "24px",
color: "#D9D8D8",
<Select
value={selectedStation}
onChange={handleChange}
label="Select Station"
sx={{
//backgroundColor: "#202020",
color: "#D9D8D8",
"& .MuiSvgIcon-root": { color: "#F2F2F2" },
}} }}
IconComponent={ExpandMoreIcon}
> >
<MenuItem value="Delhi NCR EV Station">
Delhi NCR EV Station Delhi NCR EV Station
</Typography> </MenuItem>
<ArrowDropDownIcon sx={{ color: "#F2F2F2" }} /> <MenuItem value="Mumbai EV Station">
</Box> Mumbai EV Station
</MenuItem>
<MenuItem value="Bangalore EV Station">
Bangalore EV Station
</MenuItem>
<MenuItem value="Pune EV Station">
Pune EV Station
</MenuItem>
</Select>
</FormControl>
{/* Grid container for the four boxes */} {/* Grid container for the four boxes */}
<Box <Box

6
src/components/SideMenu/index.tsx → src/components/SideMenu/sideMenu.tsx
View file

@ -32,9 +32,9 @@ export default function SideMenu() {
const dispatch = useDispatch<AppDispatch>(); const dispatch = useDispatch<AppDispatch>();
const { user } = useSelector((state: RootState) => state?.profileReducer); const { user } = useSelector((state: RootState) => state?.profileReducer);
useEffect(() => { // useEffect(() => {
dispatch(fetchAdminProfile()); // dispatch(fetchAdminProfile());
}, [dispatch]); // }, [dispatch]);
return ( return (
<Drawer <Drawer

6
src/components/SideMenuMobile/index.tsx
View file

@ -26,9 +26,9 @@ export default function SideMenuMobile({
}: SideMenuMobileProps) { }: SideMenuMobileProps) {
const dispatch = useDispatch<AppDispatch>(); const dispatch = useDispatch<AppDispatch>();
const { user } = useSelector((state: RootState) => state?.profileReducer); const { user } = useSelector((state: RootState) => state?.profileReducer);
React.useEffect(() => { // React.useEffect(() => {
dispatch(fetchAdminProfile()); // dispatch(fetchAdminProfile());
}, [dispatch]); // }, [dispatch]);
return ( return (
<Drawer <Drawer

0
src/components/StatCard/index.tsx → src/components/StatCard/statCard.tsx
View file

130
src/components/barChartCard/barChartCard.tsx Normal file
View file

@ -0,0 +1,130 @@
import * as React from "react";
import { useTheme } from "@mui/material/styles";
import {
Card,
CardContent,
Typography,
Box,
Select,
MenuItem,
FormControl,
SelectChangeEvent,
} from "@mui/material";
import { BarChart } from "@mui/x-charts/BarChart";
import { axisClasses } from "@mui/x-charts/ChartsAxis";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
// Sample Data
const data = [
{ name: "Jan", v1: 40 },
{ name: "Feb", v1: 50 },
{ name: "Mar", v1: 80 },
{ name: "Apr", v1: 20 },
{ name: "May", v1: 60 },
{ name: "Jun", v1: 30 },
];
// Chart Configuration
const chartSetting = {
yAxis: [
{
label: "Value",
tickFormatter: (value: number) => `${value}`, // Formatting Y-axis ticks
},
],
xAxis: [
{
dataKey: "name",
scaleType: "band" as const,
},
],
width: 500,
height: 300,
sx: {
[`.${axisClasses.left} .${axisClasses.label}`]: {
transform: "translate(-20px, 0)",
},
},
};
export default function RoundedBarChart() {
const theme = useTheme();
const [selectedOption, setSelectedOption] = React.useState("Monthly");
const handleChange = (event: SelectChangeEvent<string>) => {
setSelectedOption(event.target.value);
};
return (
<Card
variant="outlined"
sx={{
width: "553px",
height: "444px",
borderRadius: "16px",
"*:where([data-mui-color-scheme='dark']) &": {
backgroundColor: "#202020",
},
}}
>
<CardContent>
<Box display="flex" alignItems="center" color="#F2F2F2">
<Typography
variant="h6"
color="#F2F2F2"
sx={{
fontFamily: "Gilroy",
fontWeight: 500,
fontSize: "18px",
lineHeight: "24px",
}}
>
Charge Stats
</Typography>
<FormControl
sx={{
mt: 2,
ml: "auto",
backgroundColor: "#202020",
color: "#F2F2F2",
width: "149px",
height: "44px",
padding: "12px 16px",
gap: "8px",
}}
>
<Select
value={selectedOption}
onChange={handleChange}
sx={{
color: "#D9D8D8",
".MuiSelect-icon": {
color: "#F2F2F2",
},
}}
IconComponent={ExpandMoreIcon}
>
<MenuItem value="Monthly">Monthly</MenuItem>
<MenuItem value="Weekly">Weekly</MenuItem>
<MenuItem value="Daily">Daily</MenuItem>
<MenuItem value="Yearly">Yearly</MenuItem>
</Select>
</FormControl>
</Box>
<BarChart
dataset={data}
series={[
{
dataKey: "v1",
label: "Value",
color: "skyblue",
},
]}
{...chartSetting}
/>
</CardContent>
</Card>
);
}

113
src/components/barChartCard/index.tsx
View file

@ -1,113 +0,0 @@
import * as React from "react";
import { useTheme } from "@mui/material/styles";
import { BarChart, Bar, XAxis, YAxis, CartesianGrid } from "recharts";
import { Card, CardContent, Typography, Box } from "@mui/material";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
const data = [
{ name: "Jan", v1: 40 },
{ name: "Feb", v1: 50 },
{ name: "Mar", v1: 80 },
{ name: "Apr", v1: 20 },
{ name: "May", v1: 60 },
{ name: "Jun", v1: 30 },
];
export default function RoundedBarChart() {
const theme = useTheme();
return (
<Card
variant="outlined"
sx={{
width: "553px",
height: "444px",
borderRadius: "16px",
"*:where([data-mui-color-scheme='dark']) &": {
backgroundColor: "#202020",
},
}}
>
<CardContent>
<div
style={{
display: "flex",
alignItems: "center",
color: "#F2F2F2",
}}
>
<Typography
variant="h6"
align="left"
color="#F2F2F2"
sx={{
fontFamily: "Gilroy",
fontWeight: 500,
fontSize: "18px",
lineHeight: "24px",
}}
>
Charge Stats
</Typography>
<Box
sx={{
mt: 2,
mb: 2,
backgroundColor: "#202020",
marginLeft: "auto",
marginRight: "16px",
display: "flex",
justifyContent: "center",
alignItems: "center",
p: 1.5,
borderRadius: "8px",
border: "1px solid #454545",
// padding: "4px 8px",
color: "#F2F2F2",
width: "129px",
height: "44px",
padding: "12px 16px",
gap: "8px",
}}
>
<Typography
width={"69px"}
height={"16px"}
sx={{
fontWeight: 500,
fontSize: "14px",
lineHeight: "24px",
color: "#D9D8D8",
textAlign: "center",
}}
>
Monthly
</Typography>
<ExpandMoreIcon
width="20px"
height="20px"
sx={{ color: "#F2F2F2" ,textAlign: "center", }}
/>
</Box>
</div>
<BarChart
width={600}
height={300}
data={data}
margin={{ top: 20, right: 30, left: 20, bottom: 5 }}
style={{ width: "100%", height: "auto" }}
>
<CartesianGrid vertical={false} />
<XAxis />
<YAxis tickFormatter={(value) => `${value}`} />
<Bar dataKey="v1" fill="skyblue" radius={[10, 10, 0, 0]} />
<Bar dataKey="v2" fill="skyblue" radius={[10, 10, 0, 0]} />
</BarChart>
</CardContent>
</Card>
);
}

5
src/index.css
View file

@ -1,8 +1,9 @@
body { body {
margin: 0; margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', /* font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif; sans-serif; */
font-family: "Gliroy";
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }

2
src/layouts/DashboardLayout/index.tsx
View file

@ -1,7 +1,7 @@
import * as React from "react"; import * as React from "react";
import { Box, Stack } from "@mui/material"; import { Box, Stack } from "@mui/material";
import { Outlet } from "react-router-dom"; import { Outlet } from "react-router-dom";
import SideMenu from "../../components/SideMenu"; import SideMenu from "../../components/SideMenu/sideMenu";
import AppNavbar from "../../components/AppNavbar"; import AppNavbar from "../../components/AppNavbar";
import Header from "../../components/Header"; import Header from "../../components/Header";
import AppTheme from "../../shared-theme/AppTheme"; import AppTheme from "../../shared-theme/AppTheme";

5
src/pages/AdminList/index.tsx
View file

@ -1,8 +1,8 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { Box, Button, TextField, Typography } from "@mui/material"; import { Box, Button, TextField, Typography } from "@mui/material";
import AddEditCategoryModal from "../../components/AddEditCategoryModal"; import AddEditCategoryModal from "../../components/AddEditAdminModal/addEditAdminModal";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import CustomTable, { Column } from "../../components/CustomTable"; import CustomTable, { Column } from "../../components/CustomTable/customTable";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { import {
adminList, adminList,
@ -110,7 +110,6 @@ export default function AdminList() {
}) })
); );
return ( return (
<> <>
<CustomTable <CustomTable

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

@ -18,7 +18,6 @@ import { useDispatch } from "react-redux";
import { loginUser } from "../../../redux/slices/authSlice.ts"; import { loginUser } from "../../../redux/slices/authSlice.ts";
import AppTheme from "../../../shared-theme/AppTheme.tsx"; import AppTheme from "../../../shared-theme/AppTheme.tsx";
import ForgotPassword from "./ForgotPassword.tsx"; import ForgotPassword from "./ForgotPassword.tsx";
import { toast } from "sonner";
import { useNavigate } from "react-router-dom"; import { useNavigate } from "react-router-dom";
import { Visibility, VisibilityOff } from "@mui/icons-material"; import { Visibility, VisibilityOff } from "@mui/icons-material";
import { Card, SignInContainer } from "./styled.css.tsx"; import { Card, SignInContainer } from "./styled.css.tsx";
@ -36,7 +35,7 @@ export default function Login(props: { disableCustomTheme?: boolean }) {
const { const {
control, control,
handleSubmit, handleSubmit,
formState: { errors, isValid }, formState: { errors, isValid },trigger
} = useForm<ILoginForm>({ mode: "onChange" }); } = useForm<ILoginForm>({ mode: "onChange" });
const dispatch = useDispatch<AppDispatch>(); const dispatch = useDispatch<AppDispatch>();
const router = useNavigate(); const router = useNavigate();
@ -55,6 +54,10 @@ export default function Login(props: { disableCustomTheme?: boolean }) {
}; };
const onSubmit: SubmitHandler<ILoginForm> = async (data: ILoginForm) => { const onSubmit: SubmitHandler<ILoginForm> = async (data: ILoginForm) => {
const isValid = await trigger(); // This triggers validation for all fields
if (!isValid) {
return; // Stop submission if there are errors
}
try { try {
const response = await dispatch(loginUser(data)).unwrap(); const response = await dispatch(loginUser(data)).unwrap();
if (response?.data?.token) { if (response?.data?.token) {
@ -88,6 +91,8 @@ export default function Login(props: { disableCustomTheme?: boolean }) {
item item
xs={12} xs={12}
md={5} md={5}
width="408px"
height="498px"
sx={{ sx={{
backgroundColor: "black", backgroundColor: "black",
display: "flex", display: "flex",
@ -116,6 +121,8 @@ export default function Login(props: { disableCustomTheme?: boolean }) {
</Box> </Box>
<Typography <Typography
variant="h3" variant="h3"
width={"408px"}
height={"46px"}
sx={{ sx={{
color: "white", color: "white",
textAlign: "center", textAlign: "center",
@ -133,10 +140,13 @@ export default function Login(props: { disableCustomTheme?: boolean }) {
variant="outlined" variant="outlined"
sx={{ sx={{
width: { xs: "100%", sm: "300px", lg: "408px" }, width: { xs: "100%", sm: "300px", lg: "408px" },
height:{lg:"428px"},
padding: "24px", padding: "24px",
borderRadius: "12px", borderRadius: "9px",
border: "1px solidrgb(45, 48, 49)",
"*:where([data-mui-color-scheme='dark']) &": {
backgroundColor: "#1E1E1E", backgroundColor: "#1E1E1E",
border: "1px solid #4B5255", },
}} }}
> >
<Box <Box
@ -252,6 +262,7 @@ export default function Login(props: { disableCustomTheme?: boolean }) {
"#4b5255", "#4b5255",
}, },
}, },
"& input": { "& input": {
color: "white", color: "white",
fontSize: { fontSize: {
@ -330,7 +341,6 @@ export default function Login(props: { disableCustomTheme?: boolean }) {
? "error" ? "error"
: "primary" : "primary"
} }
InputProps={{ InputProps={{
endAdornment: ( endAdornment: (
<InputAdornment position="end"> <InputAdornment position="end">
@ -443,7 +453,7 @@ export default function Login(props: { disableCustomTheme?: boolean }) {
alignSelf: "center", alignSelf: "center",
fontFamily: "Gilroy, sans-serif", fontFamily: "Gilroy, sans-serif",
color: "#01579b", color: "#01579b",
textDecoration: "none", // ✅ Removes underline textDecoration: "none",
}} }}
> >
Forgot password? Forgot password?

4
src/pages/BookingList/index.tsx
View file

@ -1,11 +1,11 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { Box, Button, TextField, Typography } from "@mui/material"; import { Box, Button, TextField, Typography } from "@mui/material";
import CustomTable, { Column } from "../../components/CustomTable"; import CustomTable, { Column } from "../../components/CustomTable/customTable";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { RootState, AppDispatch } from "../../redux/store/store"; import { RootState, AppDispatch } from "../../redux/store/store";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import { addBooking, bookingList } from "../../redux/slices/bookSlice"; import { addBooking, bookingList } from "../../redux/slices/bookSlice";
import AddBookingModal from "../../components/AddBookingModal"; import AddBookingModal from "../../components/AddBookingModal/addBookingModal";
export default function BookingList() { export default function BookingList() {
const [addModalOpen, setAddModalOpen] = useState<boolean>(false); const [addModalOpen, setAddModalOpen] = useState<boolean>(false);

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

@ -10,7 +10,7 @@ import {
treeViewCustomizations, treeViewCustomizations,
} from "./theme/customizations"; } from "./theme/customizations";
import AppTheme from "../../shared-theme/AppTheme"; import AppTheme from "../../shared-theme/AppTheme";
import MainGrid from "../../components/MainGrid"; import MainGrid from "../../components/MainGrid/mainGrid";
const xThemeComponents = { const xThemeComponents = {

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

@ -1,5 +1,5 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import CustomTable, { Column } from "../../components/CustomTable"; import CustomTable, { Column } from "../../components/CustomTable/customTable";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { RootState, AppDispatch } from "../../redux/store/store"; import { RootState, AppDispatch } from "../../redux/store/store";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
@ -8,9 +8,9 @@ import {
fetchAvailableSlots, fetchAvailableSlots,
updateSlot, updateSlot,
} from "../../redux/slices/slotSlice"; } from "../../redux/slices/slotSlice";
import AddSlotModal from "../../components/AddSlotModal"; import AddSlotModal from "../../components/AddSlotModal/addSlotModal";
import dayjs from "dayjs"; import dayjs from "dayjs";
import EditSlotModal from "../../components/EditSlotModal"; import EditSlotModal from "../../components/EditSlotModal/editSlotModal";
export default function EVSlotList() { export default function EVSlotList() {
const [addModalOpen, setAddModalOpen] = useState<boolean>(false); const [addModalOpen, setAddModalOpen] = useState<boolean>(false);
const [editModalOpen, setEditModalOpen] = useState<boolean>(false); const [editModalOpen, setEditModalOpen] = useState<boolean>(false);

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

@ -1,8 +1,8 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { Box, Button, TextField, Typography } from "@mui/material"; import { Box, Button, TextField, Typography } from "@mui/material";
import CustomTable, { Column } from "../../components/CustomTable"; import CustomTable, { Column } from "../../components/CustomTable/customTable";
import AddManagerModal from "../../components/AddManagerModal"; import AddManagerModal from "../../components/AddManagerModal/addManagerModal";
import EditManagerModal from "../../components/EditManagerModal"; import EditManagerModal from "../../components/EditManagerModal/editManagerModal";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { RootState, AppDispatch } from "../../redux/store/store"; import { RootState, AppDispatch } from "../../redux/store/store";
import { import {

116
src/pages/NotFound/index.tsx
View file

@ -1,9 +1,115 @@
import React from 'react' import React from "react";
import { Box, Typography, Button, Card, Grid } from "@mui/material";
import ElectricCarIcon from "@mui/icons-material/ElectricCar";
import { keyframes } from "@emotion/react";
function NotFoundPage() { // Animation for the car icon
return ( const pulse = keyframes`
<div>NotFoundPage</div> 0% {
) transform: scale(1);
} }
50% {
transform: scale(1.1);
}
100% {
transform: scale(1);
}
`;
const NotFoundPage = () => {
return (
<Box
sx={{
display: "flex",
justifyContent: "center",
alignItems: "center",
flexDirection: "column",
height: "100vh",
background:
"linear-gradient(135deg,rgb(12, 14, 15),rgb(10, 10, 10))",
padding: 2,
}}
>
<Card
sx={{
backgroundColor: "#272727",
padding: "40px",
borderRadius: "20px",
boxShadow: "0 8px 24px rgba(0, 0, 0, 0.7)",
textAlign: "center",
maxWidth: "500px",
width: "100%",
color: "#E0E0E0",
animation: `${pulse} 1.5s infinite`,
}}
>
<ElectricCarIcon
sx={{
fontSize: 100,
color: "#52ACDF",
marginBottom: 2,
}}
/>
<Typography
variant="h3"
sx={{ fontWeight: 700, color: "#FFFFFF", marginBottom: 1 }}
>
404
</Typography>
<Typography
variant="h5"
sx={{ fontWeight: 500, color: "#FFFFFF", marginBottom: 3 }}
>
Oops! Page Not Found
</Typography>
<Typography
variant="body2"
sx={{ color: "#B0B0B0", marginBottom: 4 }}
>
The path you’re looking for seems to be off the grid. Maybe
the charging station is offline? ⚡
</Typography>
<Grid container spacing={2} justifyContent="center">
<Grid item>
<Button
variant="contained"
sx={{
backgroundColor: "#52ACDF",
color: "#FFFFFF",
padding: "12px 32px",
"&:hover": {
backgroundColor: "#52ACDF",
opacity: 0.9,
},
fontWeight: 600,
}}
onClick={() => (window.location.href = "/")}
>
Back to Login
</Button>
</Grid>
<Grid item>
<Button
variant="outlined"
sx={{
borderColor: "#52ACDF",
color: "#52ACDF",
padding: "12px 32px",
"&:hover": {
backgroundColor: "#52ACDF",
color: "#FFFFFF",
},
}}
onClick={() => window.history.back()}
>
Go Back
</Button>
</Grid>
</Grid>
</Card>
</Box>
);
};
export default NotFoundPage; export default NotFoundPage;

4
src/pages/ProfilePage/index.tsx
View file

@ -120,13 +120,13 @@ const ProfilePage = () => {
> >
Personal Information Personal Information
</Typography> </Typography>
<Link {/* <Link
variant="body1" variant="body1"
href="/edit-profile" href="/edit-profile"
color="#52ACDF" color="#52ACDF"
> >
Edit Edit
</Link> </Link> */}
</Stack> </Stack>
<Grid <Grid

3
src/pages/RoleList/index.tsx
View file

@ -3,7 +3,7 @@ import { Box, Button, Typography, TextField, Chip } from "@mui/material";
import AddEditRoleModal from "../../components/AddEditRoleModal"; import AddEditRoleModal from "../../components/AddEditRoleModal";
import PermissionsTable from "../../pages/PermissionTable"; import PermissionsTable from "../../pages/PermissionTable";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import CustomTable, { Column } from "../../components/CustomTable"; import CustomTable, { Column } from "../../components/CustomTable/customTable";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { import {
createRole, createRole,
@ -100,7 +100,6 @@ export default function RoleList() {
return ( return (
<> <>
{showPermissions ? ( {showPermissions ? (
<AddEditRolePage /> <AddEditRolePage />
) : ( ) : (

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

@ -1,7 +1,7 @@
import { Chip } from "@mui/material"; import { Chip } from "@mui/material";
import AddStationModal from "../../components/AddStationModal"; import AddStationModal from "../../components/AddStationModal/addStationModal";
import CustomTable, { Column } from "../../components/CustomTable"; import CustomTable, { Column } from "../../components/CustomTable/customTable";
import EditStationModal from "../../components/EditStationModal"; import EditStationModal from "../../components/EditStationModal/editSationModal";
import { import {
createStation, createStation,
stationList, stationList,

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

@ -1,8 +1,8 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { Box, Button, Typography } from "@mui/material"; import { Box, Button, Typography } from "@mui/material";
import AddEditCategoryModal from "../../components/AddEditCategoryModal"; import AddEditCategoryModal from "../../components/AddEditCategoryModal/addEdit";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import CustomTable, { Column } from "../../components/CustomTable"; import CustomTable, { Column } from "../../components/CustomTable/customTable";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { createUser, updateUser, userList } from "../../redux/slices/userSlice"; import { createUser, updateUser, userList } from "../../redux/slices/userSlice";
import { AppDispatch, RootState } from "../../redux/store/store"; import { AppDispatch, RootState } from "../../redux/store/store";
@ -41,7 +41,6 @@ export default function UserList() {
name: string; name: string;
email: string; email: string;
phone: string; phone: string;
}) => { }) => {
try { try {
await dispatch(createUser(data)); await dispatch(createUser(data));
@ -65,7 +64,6 @@ export default function UserList() {
name, name,
email, email,
phone, phone,
}) })
); );
await dispatch(userList()); await dispatch(userList());

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

@ -1,6 +1,6 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import CustomTable, { Column } from "../../components/CustomTable"; import CustomTable, { Column } from "../../components/CustomTable/customTable";
import { RootState } from "../../redux/reducers"; import { RootState } from "../../redux/reducers";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { AppDispatch } from "../../redux/store/store"; import { AppDispatch } from "../../redux/store/store";
@ -9,8 +9,8 @@ import {
updateVehicle, updateVehicle,
vehicleList, vehicleList,
} from "../../redux/slices/VehicleSlice"; } from "../../redux/slices/VehicleSlice";
import AddVehicleModal from "../../components/AddVehicleModal"; import AddVehicleModal from "../../components/AddVehicleModal/addVehicleModal";
import EditVehicleModal from "../../components/EditVehicleModal"; import EditVehicleModal from "../../components/EditVehicleModal/editVehicleModal";
export default function VehicleList() { export default function VehicleList() {
const [addModalOpen, setAddModalOpen] = useState<boolean>(false); const [addModalOpen, setAddModalOpen] = useState<boolean>(false);

1
src/router.tsx
View file

@ -108,6 +108,7 @@ export default function AppRouter() {
path="slot-list" path="slot-list"
element={<ProtectedRoute component={<EvSlotList />} />} element={<ProtectedRoute component={<EvSlotList />} />}
/> />
</Route> </Route>
{/* Catch-all Route */} {/* Catch-all Route */}