From dc327f97fc142c268f43fb31bd7bbce52c273453 Mon Sep 17 00:00:00 2001 From: jaanvi Date: Mon, 31 Mar 2025 18:28:38 +0530 Subject: [PATCH] fix the bugs and add NoteFoundPage --- src/components/AddAdmin/index.tsx | 139 ---------------- .../{index.tsx => addBookingModal.tsx} | 14 +- .../addEditAdminModal.tsx} | 57 ++++--- .../{index.tsx => addManagerModal.tsx} | 14 +- .../{index.tsx => addSlotModal.tsx} | 0 .../{index.tsx => addStationModal.tsx} | 6 +- .../{index.tsx => addVehicleModal.tsx} | 0 .../{index.tsx => availableSlotsModal.tsx} | 0 .../{index.tsx => customTable.tsx} | 16 +- src/components/EditAdmin/index.tsx | 153 ------------------ .../{index.tsx => editManagerModal.tsx} | 5 +- .../{index.tsx => editSlotModal.tsx} | 14 +- .../{index.tsx => editSationModal.tsx} | 0 .../{index.tsx => editVehicleModal.tsx} | 0 src/components/Header/index.tsx | 2 +- .../{index.tsx => lineChartCard.tsx} | 51 +++--- .../MainGrid/{index.tsx => mainGrid.tsx} | 10 +- .../{index.tsx => resourcePieChart.tsx} | 3 - .../{index.tsx => sessionChart.tsx} | 68 ++++---- .../SideMenu/{index.tsx => sideMenu.tsx} | 6 +- src/components/SideMenuMobile/index.tsx | 6 +- .../StatCard/{index.tsx => statCard.tsx} | 0 src/components/barChartCard/barChartCard.tsx | 130 +++++++++++++++ src/components/barChartCard/index.tsx | 113 ------------- src/index.css | 5 +- src/layouts/DashboardLayout/index.tsx | 2 +- src/pages/AdminList/index.tsx | 9 +- src/pages/Auth/Login/index.tsx | 30 ++-- src/pages/BookingList/index.tsx | 4 +- src/pages/Dashboard/index.tsx | 2 +- src/pages/EvSlotList/index.tsx | 6 +- src/pages/ManagerList/index.tsx | 6 +- src/pages/NotFound/index.tsx | 120 +++++++++++++- src/pages/ProfilePage/index.tsx | 4 +- src/pages/RoleList/index.tsx | 3 +- src/pages/StationList/index.tsx | 6 +- src/pages/UserList/index.tsx | 6 +- src/pages/VehicleList/index.tsx | 6 +- src/router.tsx | 1 + 39 files changed, 429 insertions(+), 588 deletions(-) delete mode 100644 src/components/AddAdmin/index.tsx rename src/components/AddBookingModal/{index.tsx => addBookingModal.tsx} (97%) rename src/components/{AddEditCategoryModal/index.tsx => AddEditAdminModal/addEditAdminModal.tsx} (92%) rename src/components/AddManagerModal/{index.tsx => addManagerModal.tsx} (94%) rename src/components/AddSlotModal/{index.tsx => addSlotModal.tsx} (100%) rename src/components/AddStationModal/{index.tsx => addStationModal.tsx} (98%) rename src/components/AddVehicleModal/{index.tsx => addVehicleModal.tsx} (100%) rename src/components/AvailableSlotModal/{index.tsx => availableSlotsModal.tsx} (100%) rename src/components/CustomTable/{index.tsx => customTable.tsx} (97%) delete mode 100644 src/components/EditAdmin/index.tsx rename src/components/EditManagerModal/{index.tsx => editManagerModal.tsx} (94%) rename src/components/EditSlotModal/{index.tsx => editSlotModal.tsx} (96%) rename src/components/EditStationModal/{index.tsx => editSationModal.tsx} (100%) rename src/components/EditVehicleModal/{index.tsx => editVehicleModal.tsx} (100%) rename src/components/LineChartCard/{index.tsx => lineChartCard.tsx} (79%) rename src/components/MainGrid/{index.tsx => mainGrid.tsx} (84%) rename src/components/ResourcePieChart/{index.tsx => resourcePieChart.tsx} (94%) rename src/components/SessionsChart/{index.tsx => sessionChart.tsx} (67%) rename src/components/SideMenu/{index.tsx => sideMenu.tsx} (97%) rename src/components/StatCard/{index.tsx => statCard.tsx} (100%) create mode 100644 src/components/barChartCard/barChartCard.tsx delete mode 100644 src/components/barChartCard/index.tsx diff --git a/src/components/AddAdmin/index.tsx b/src/components/AddAdmin/index.tsx deleted file mode 100644 index f184486..0000000 --- a/src/components/AddAdmin/index.tsx +++ /dev/null @@ -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 = ({ open, handleClose, handleAdd }) => { -// const { control, handleSubmit, reset, formState: { errors } } = useForm({ -// defaultValues: { -// name: "", -// email: "", -// phone: "", -// registeredAddress: "", -// }, -// }); - -// const onSubmit = (data: FormData) => { -// handleAdd(data.name, data.email, data.phone, data.registeredAddress); -// handleClose(); -// reset(); -// }; - -// return ( -// -// Add Admin -// -// ( -// -// )} -// /> - -// ( -// -// )} -// /> - -// ( -// -// )} -// /> - -// ( -// -// )} -// /> -// -// -// -// -// -// -// ); -// }; - -// export default AddAdminModal; diff --git a/src/components/AddBookingModal/index.tsx b/src/components/AddBookingModal/addBookingModal.tsx similarity index 97% rename from src/components/AddBookingModal/index.tsx rename to src/components/AddBookingModal/addBookingModal.tsx index 06bfb82..71befb5 100644 --- a/src/components/AddBookingModal/index.tsx +++ b/src/components/AddBookingModal/addBookingModal.tsx @@ -5,12 +5,10 @@ import { Button, Typography, Modal, - IconButton, MenuItem, Select, InputLabel, FormControl, - TextField, } from "@mui/material"; import CloseIcon from "@mui/icons-material/Close"; import { useDispatch, useSelector } from "react-redux"; @@ -19,16 +17,15 @@ import { bookingList, getCarNames, getCarPorts, -} from "../../redux/slices/bookSlice"; -import { AppDispatch, RootState } from "../../redux/store/store"; +} from "../../redux/slices/bookSlice.ts"; +import { AppDispatch, RootState } from "../../redux/store/store.ts"; import { toast } from "sonner"; import { CustomIconButton, CustomTextField, } 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 dayjs from "dayjs"; export default function AddBookingModal({ open, @@ -53,7 +50,6 @@ export default function AddBookingModal({ const availableSlots = useSelector( (state: RootState) => state.slotReducer.availableSlots ); - console.log("first", availableSlots); useEffect(() => { dispatch(fetchAvailableSlots()); dispatch(getAllStations()); @@ -74,7 +70,7 @@ export default function AddBookingModal({ // Fetch the bookings after this dispatch(bookingList()); }, [dispatch]); -console.log("Car Ports: ", carPorts); + console.log("Car Ports: ", carPorts); // Get today's date in yyyy-mm-dd format const today = new Date().toISOString().split("T")[0]; @@ -164,7 +160,7 @@ console.log("Car Ports: ", carPorts); ))} - {errors.stationName && ( + {errors.stationId && ( {errors.stationName.message} diff --git a/src/components/AddEditCategoryModal/index.tsx b/src/components/AddEditAdminModal/addEditAdminModal.tsx similarity index 92% rename from src/components/AddEditCategoryModal/index.tsx rename to src/components/AddEditAdminModal/addEditAdminModal.tsx index d802b5d..aa2d913 100644 --- a/src/components/AddEditCategoryModal/index.tsx +++ b/src/components/AddEditAdminModal/addEditAdminModal.tsx @@ -1,12 +1,5 @@ import React, { useEffect, useState } from "react"; -import { - Box, - Button, - Typography, - Modal, - InputAdornment, - -} from "@mui/material"; +import { Box, Button, Typography, Modal, InputAdornment } from "@mui/material"; import CloseIcon from "@mui/icons-material/Close"; import Visibility from "@mui/icons-material/Visibility"; import VisibilityOff from "@mui/icons-material/VisibilityOff"; @@ -54,6 +47,7 @@ const AddEditCategoryModal: React.FC = ({ formState: { errors }, setValue, reset, + clearErrors, } = useForm({ defaultValues: { name: "", @@ -63,7 +57,7 @@ const AddEditCategoryModal: React.FC = ({ password: "", }, }); - + const onSubmit = (data: FormData) => { if (editRow) { handleUpdate( @@ -81,9 +75,9 @@ const AddEditCategoryModal: React.FC = ({ reset(); }; - const togglePasswordVisibility = () => { - setShowPassword((prev) => !prev); - }; + const togglePasswordVisibility = () => { + setShowPassword((prev) => !prev); + }; useEffect(() => { if (editRow) { @@ -91,22 +85,29 @@ const AddEditCategoryModal: React.FC = ({ setValue("email", editRow.email); setValue("phone", editRow.phone); setValue("registeredAddress", editRow.registeredAddress); + clearErrors(); } else { reset(); + clearErrors(); } }, [editRow, setValue, reset]); + const handleCloseModal = () => { + reset(); + clearErrors(); + handleClose(); + }; - - return ( { if (reason === "backdropClick") { return; } - handleClose(); // Close modal when clicking cross or cancel + + handleCloseModal(); }} aria-labelledby="add-edit-category-modal" > @@ -134,7 +135,7 @@ const AddEditCategoryModal: React.FC = ({ {editRow ? "Edit Admin" : "Add Admin"} - + @@ -334,19 +335,17 @@ const AddEditCategoryModal: React.FC = ({ control={control} rules={{ required: "Phone number is required", - pattern: { - value: /^[0-9]*$/, - message: "Only numbers are allowed", - }, - minLength: { - value: 6, - message: - "Phone number must be at least 6 digits", - }, - maxLength: { - value: 14, - message: - "Phone number must be at most 14 digits", + validate: (value) => { + if (!/^[0-9]*$/.test(value)) { + return "Only numbers are allowed"; + } + if (value.length < 6) { + return "Phone number must be at least 6 digits"; + } + if (value.length > 14) { + return "Phone number must be at most 14 digits"; + } + return true; // No errors }, }} render={({ field }) => ( diff --git a/src/components/AddManagerModal/index.tsx b/src/components/AddManagerModal/addManagerModal.tsx similarity index 94% rename from src/components/AddManagerModal/index.tsx rename to src/components/AddManagerModal/addManagerModal.tsx index 41f745c..300aa97 100644 --- a/src/components/AddManagerModal/index.tsx +++ b/src/components/AddManagerModal/addManagerModal.tsx @@ -14,7 +14,7 @@ import { import CloseIcon from "@mui/icons-material/Close"; import { Visibility, VisibilityOff } from "@mui/icons-material"; import { useDispatch, useSelector } from "react-redux"; -import { addManager, managerList } from "../../redux/slices/managerSlice"; +import { addManager, managerList } from "../../redux/slices/managerSlice.ts"; import { CustomIconButton, CustomTextField, @@ -38,13 +38,13 @@ export default function AddManagerModal({ reset, } = useForm(); const [showPassword, setShowPassword] = useState(false); - const stations = useSelector( + const stations = useSelector( (state: RootState) => state?.stationReducer.stations - ); - -useEffect(() => { - dispatch(stationList()); -}, [dispatch]); + ); + + useEffect(() => { + dispatch(stationList()); + }, [dispatch]); // Handle form submission const onSubmit = async (data: any) => { diff --git a/src/components/AddSlotModal/index.tsx b/src/components/AddSlotModal/addSlotModal.tsx similarity index 100% rename from src/components/AddSlotModal/index.tsx rename to src/components/AddSlotModal/addSlotModal.tsx diff --git a/src/components/AddStationModal/index.tsx b/src/components/AddStationModal/addStationModal.tsx similarity index 98% rename from src/components/AddStationModal/index.tsx rename to src/components/AddStationModal/addStationModal.tsx index 2919838..64e86db 100644 --- a/src/components/AddStationModal/index.tsx +++ b/src/components/AddStationModal/addStationModal.tsx @@ -19,7 +19,7 @@ import { RootState } from "../../redux/reducers.ts"; import { fetchVehicleBrands, vehicleList, -} from "../../redux/slices/VehicleSlice"; // Adjust this import path accordingly +} from "../../redux/slices/VehicleSlice.ts"; // Adjust this import path accordingly import { CustomIconButton, CustomTextField, @@ -304,9 +304,7 @@ export default function AddStationModal({ - - + /> )) ) : ( diff --git a/src/components/AddVehicleModal/index.tsx b/src/components/AddVehicleModal/addVehicleModal.tsx similarity index 100% rename from src/components/AddVehicleModal/index.tsx rename to src/components/AddVehicleModal/addVehicleModal.tsx diff --git a/src/components/AvailableSlotModal/index.tsx b/src/components/AvailableSlotModal/availableSlotsModal.tsx similarity index 100% rename from src/components/AvailableSlotModal/index.tsx rename to src/components/AvailableSlotModal/availableSlotsModal.tsx diff --git a/src/components/CustomTable/index.tsx b/src/components/CustomTable/customTable.tsx similarity index 97% rename from src/components/CustomTable/index.tsx rename to src/components/CustomTable/customTable.tsx index 9d9703d..de134c4 100644 --- a/src/components/CustomTable/index.tsx +++ b/src/components/CustomTable/customTable.tsx @@ -7,10 +7,10 @@ import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; import Paper, { paperClasses } from "@mui/material/Paper"; -import { adminList, deleteAdmin } from "../../redux/slices/adminSlice"; -import { vehicleList, deleteVehicle } from "../../redux/slices/VehicleSlice"; +import { adminList, deleteAdmin } from "../../redux/slices/adminSlice.ts"; +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 { Box, @@ -23,15 +23,15 @@ import { Typography, } from "@mui/material"; import MoreHorizRoundedIcon from "@mui/icons-material/MoreHorizRounded"; -import DeleteModal from "../Modals/DeleteModal"; -import { AppDispatch, RootState } from "../../redux/store/store"; -import ViewModal from "../Modals/ViewModal"; -import VehicleViewModal from "../Modals/VehicleViewModal"; +import DeleteModal from "../Modals/DeleteModal/index.tsx"; +import { AppDispatch, RootState } from "../../redux/store/store.ts"; +import ViewModal from "../Modals/ViewModal/index.tsx"; +import VehicleViewModal from "../Modals/VehicleViewModal/index.tsx"; import SearchIcon from "@mui/icons-material/Search"; import TuneIcon from "@mui/icons-material/Tune"; 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 { deleteUser, userList } from "../../redux/slices/userSlice.ts"; import { deleteStation, stationList } from "../../redux/slices/stationSlice.ts"; diff --git a/src/components/EditAdmin/index.tsx b/src/components/EditAdmin/index.tsx deleted file mode 100644 index f2e1a97..0000000 --- a/src/components/EditAdmin/index.tsx +++ /dev/null @@ -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 = ({ open, handleClose, editRow, handleUpdate }) => { -// const { control, handleSubmit, setValue, reset, formState: { errors } } = useForm({ -// 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 ( -// -// Edit Admin -// -// ( -// -// )} -// /> - -// ( -// -// )} -// /> - -// ( -// -// )} -// /> - -// ( -// -// )} -// /> -// -// -// -// -// -// -// ); -// }; - -// export default EditAdminModal; diff --git a/src/components/EditManagerModal/index.tsx b/src/components/EditManagerModal/editManagerModal.tsx similarity index 94% rename from src/components/EditManagerModal/index.tsx rename to src/components/EditManagerModal/editManagerModal.tsx index ac0d1f6..7cc5561 100644 --- a/src/components/EditManagerModal/index.tsx +++ b/src/components/EditManagerModal/editManagerModal.tsx @@ -9,7 +9,7 @@ import { import CloseIcon from "@mui/icons-material/Close"; import { useForm, Controller } from "react-hook-form"; 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 { CustomIconButton, CustomTextField, @@ -82,7 +82,6 @@ const EditManagerModal: React.FC = ({ email: data.email, phone: data.phone, stationId: data.stationId, - }, }) ).unwrap(); // Ensure that it throws an error if the update fails @@ -273,4 +272,4 @@ const EditManagerModal: React.FC = ({ ); }; -export default EditManagerModal; \ No newline at end of file +export default EditManagerModal; diff --git a/src/components/EditSlotModal/index.tsx b/src/components/EditSlotModal/editSlotModal.tsx similarity index 96% rename from src/components/EditSlotModal/index.tsx rename to src/components/EditSlotModal/editSlotModal.tsx index f227886..4b9b095 100644 --- a/src/components/EditSlotModal/index.tsx +++ b/src/components/EditSlotModal/editSlotModal.tsx @@ -9,7 +9,10 @@ import { import CloseIcon from "@mui/icons-material/Close"; import { useForm, Controller } from "react-hook-form"; 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 { CustomIconButton, CustomTextField, @@ -40,7 +43,7 @@ const EditSlotModal: React.FC = ({ handleClose, editRow, }) => { - const dispatch = useDispatch(); + const dispatch = useDispatch(); const { control, handleSubmit, @@ -65,7 +68,7 @@ const EditSlotModal: React.FC = ({ if (editRow) { setValue("startTime", editRow.startTime); setValue("endTime", editRow.endTime); - setIsAvailable(editRow.isAvailable); + setIsAvailable(editRow.isAvailable); } else { reset(); } @@ -73,10 +76,9 @@ const EditSlotModal: React.FC = ({ const onSubmit = async (data: FormData) => { if (editRow) { - setLoading(true); + setLoading(true); try { - const availabilityStatus = isAvailable ? true : false; await dispatch( @@ -86,7 +88,7 @@ const EditSlotModal: React.FC = ({ endTime: data.endTime, isAvailable: availabilityStatus, }) - ).unwrap(); + ).unwrap(); dispatch(fetchAvailableSlots()); handleClose(); // Close modal on success reset(); // Reset form fields after submit diff --git a/src/components/EditStationModal/index.tsx b/src/components/EditStationModal/editSationModal.tsx similarity index 100% rename from src/components/EditStationModal/index.tsx rename to src/components/EditStationModal/editSationModal.tsx diff --git a/src/components/EditVehicleModal/index.tsx b/src/components/EditVehicleModal/editVehicleModal.tsx similarity index 100% rename from src/components/EditVehicleModal/index.tsx rename to src/components/EditVehicleModal/editVehicleModal.tsx diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx index 80247c2..8e8501d 100644 --- a/src/components/Header/index.tsx +++ b/src/components/Header/index.tsx @@ -9,7 +9,7 @@ import Divider from "@mui/material/Divider"; import MenuButton from "../MenuButton"; import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown"; import NotificationsRoundedIcon from "@mui/icons-material/NotificationsRounded"; -import SideMenu from "../SideMenu"; +import SideMenu from "../SideMenu/sideMenu"; import { useDispatch, useSelector } from "react-redux"; import { AppDispatch, RootState } from "../../redux/store/store"; import { fetchAdminProfile } from "../../redux/slices/profileSlice"; diff --git a/src/components/LineChartCard/index.tsx b/src/components/LineChartCard/lineChartCard.tsx similarity index 79% rename from src/components/LineChartCard/index.tsx rename to src/components/LineChartCard/lineChartCard.tsx index 61d367a..f7e465a 100644 --- a/src/components/LineChartCard/index.tsx +++ b/src/components/LineChartCard/lineChartCard.tsx @@ -2,13 +2,12 @@ import * as React from "react"; import { useTheme } from "@mui/material/styles"; import Card from "@mui/material/Card"; import CardContent from "@mui/material/CardContent"; -import Chip from "@mui/material/Chip"; import Typography from "@mui/material/Typography"; -import Stack from "@mui/material/Stack"; 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"; function AreaGradient({ color, id }: { color: string; id: string }) { + return ( @@ -39,6 +38,12 @@ export default function LineChartCard() { const data = getDaysInMonth(4, 2024); const colorPalette = [theme.palette.primary.light]; + const [selectedOption, setSelectedOption] = React.useState("Weekly"); + + const handleChange = (event: { target: { value: React.SetStateAction; }; }) => { + setSelectedOption(event.target.value); + }; + return ( Sales Stats - - - Weekly - - - + Monthly + Weekly + Daily + Yearly + + ; }; }) => { + setSelectedStation(event.target.value); + }; + return ( @@ -42,40 +51,43 @@ export default function SessionsChart() { Charging prices - {/* Responsive dropdown box */} - - - Delhi NCR EV Station - - - + + Delhi NCR EV Station + + + Mumbai EV Station + + + Bangalore EV Station + + + Pune EV Station + + + {/* Grid container for the four boxes */} (); const { user } = useSelector((state: RootState) => state?.profileReducer); - useEffect(() => { - dispatch(fetchAdminProfile()); - }, [dispatch]); + // useEffect(() => { + // dispatch(fetchAdminProfile()); + // }, [dispatch]); return ( (); const { user } = useSelector((state: RootState) => state?.profileReducer); - React.useEffect(() => { - dispatch(fetchAdminProfile()); - }, [dispatch]); + // React.useEffect(() => { + // dispatch(fetchAdminProfile()); + // }, [dispatch]); return ( `${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) => { + setSelectedOption(event.target.value); + }; + + return ( + + + + + Charge Stats + + + + + + + + + + + ); +} diff --git a/src/components/barChartCard/index.tsx b/src/components/barChartCard/index.tsx deleted file mode 100644 index 5bf70ec..0000000 --- a/src/components/barChartCard/index.tsx +++ /dev/null @@ -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 ( - - -
- - Charge Stats - - - - Monthly - - - -
- - - - `${value}`} /> - - - - - - - ); -} diff --git a/src/index.css b/src/index.css index ec2585e..f6a5045 100644 --- a/src/index.css +++ b/src/index.css @@ -1,8 +1,9 @@ body { 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', - sans-serif; + sans-serif; */ + font-family: "Gliroy"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } diff --git a/src/layouts/DashboardLayout/index.tsx b/src/layouts/DashboardLayout/index.tsx index eb1ca8e..a11f3b5 100644 --- a/src/layouts/DashboardLayout/index.tsx +++ b/src/layouts/DashboardLayout/index.tsx @@ -1,7 +1,7 @@ import * as React from "react"; import { Box, Stack } from "@mui/material"; import { Outlet } from "react-router-dom"; -import SideMenu from "../../components/SideMenu"; +import SideMenu from "../../components/SideMenu/sideMenu"; import AppNavbar from "../../components/AppNavbar"; import Header from "../../components/Header"; import AppTheme from "../../shared-theme/AppTheme"; diff --git a/src/pages/AdminList/index.tsx b/src/pages/AdminList/index.tsx index b064f9c..a5c475c 100644 --- a/src/pages/AdminList/index.tsx +++ b/src/pages/AdminList/index.tsx @@ -1,8 +1,8 @@ import React, { useEffect, useState } from "react"; 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 CustomTable, { Column } from "../../components/CustomTable"; +import CustomTable, { Column } from "../../components/CustomTable/customTable"; import { useDispatch, useSelector } from "react-redux"; import { adminList, @@ -96,7 +96,7 @@ export default function AdminList() { email: string; phone: string; Admins: { registeredAddress: string }[]; - userType:string; + userType: string; }, index: number ) => ({ @@ -106,11 +106,10 @@ export default function AdminList() { email: admin?.email, phone: admin?.phone, registeredAddress: admin?.Admins?.[0]?.registeredAddress || "NA", - userType:admin?.userType||"NA", + userType: admin?.userType || "NA", }) ); - return ( <> ({ mode: "onChange" }); const dispatch = useDispatch(); const router = useNavigate(); @@ -55,6 +54,10 @@ export default function Login(props: { disableCustomTheme?: boolean }) { }; const onSubmit: SubmitHandler = async (data: ILoginForm) => { + const isValid = await trigger(); // This triggers validation for all fields + if (!isValid) { + return; // Stop submission if there are errors + } try { const response = await dispatch(loginUser(data)).unwrap(); if (response?.data?.token) { @@ -88,6 +91,8 @@ export default function Login(props: { disableCustomTheme?: boolean }) { item xs={12} md={5} + width="408px" + height="498px" sx={{ backgroundColor: "black", display: "flex", @@ -101,21 +106,23 @@ export default function Login(props: { disableCustomTheme?: boolean }) { Logo @@ -443,7 +453,7 @@ export default function Login(props: { disableCustomTheme?: boolean }) { alignSelf: "center", fontFamily: "Gilroy, sans-serif", color: "#01579b", - textDecoration: "none", // ✅ Removes underline + textDecoration: "none", }} > Forgot password? diff --git a/src/pages/BookingList/index.tsx b/src/pages/BookingList/index.tsx index a2832fb..f77df1b 100644 --- a/src/pages/BookingList/index.tsx +++ b/src/pages/BookingList/index.tsx @@ -1,11 +1,11 @@ import React, { useEffect, useState } from "react"; 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 { RootState, AppDispatch } from "../../redux/store/store"; import { useForm } from "react-hook-form"; import { addBooking, bookingList } from "../../redux/slices/bookSlice"; -import AddBookingModal from "../../components/AddBookingModal"; +import AddBookingModal from "../../components/AddBookingModal/addBookingModal"; export default function BookingList() { const [addModalOpen, setAddModalOpen] = useState(false); diff --git a/src/pages/Dashboard/index.tsx b/src/pages/Dashboard/index.tsx index b8593ab..c31ceed 100644 --- a/src/pages/Dashboard/index.tsx +++ b/src/pages/Dashboard/index.tsx @@ -10,7 +10,7 @@ import { treeViewCustomizations, } from "./theme/customizations"; import AppTheme from "../../shared-theme/AppTheme"; -import MainGrid from "../../components/MainGrid"; +import MainGrid from "../../components/MainGrid/mainGrid"; const xThemeComponents = { diff --git a/src/pages/EvSlotList/index.tsx b/src/pages/EvSlotList/index.tsx index ef4f174..9ae02aa 100644 --- a/src/pages/EvSlotList/index.tsx +++ b/src/pages/EvSlotList/index.tsx @@ -1,5 +1,5 @@ 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 { RootState, AppDispatch } from "../../redux/store/store"; import { useForm } from "react-hook-form"; @@ -8,9 +8,9 @@ import { fetchAvailableSlots, updateSlot, } from "../../redux/slices/slotSlice"; -import AddSlotModal from "../../components/AddSlotModal"; +import AddSlotModal from "../../components/AddSlotModal/addSlotModal"; import dayjs from "dayjs"; -import EditSlotModal from "../../components/EditSlotModal"; +import EditSlotModal from "../../components/EditSlotModal/editSlotModal"; export default function EVSlotList() { const [addModalOpen, setAddModalOpen] = useState(false); const [editModalOpen, setEditModalOpen] = useState(false); diff --git a/src/pages/ManagerList/index.tsx b/src/pages/ManagerList/index.tsx index a2db5ca..146715e 100644 --- a/src/pages/ManagerList/index.tsx +++ b/src/pages/ManagerList/index.tsx @@ -1,8 +1,8 @@ import React, { useEffect, useState } from "react"; import { Box, Button, TextField, Typography } from "@mui/material"; -import CustomTable, { Column } from "../../components/CustomTable"; -import AddManagerModal from "../../components/AddManagerModal"; -import EditManagerModal from "../../components/EditManagerModal"; +import CustomTable, { Column } from "../../components/CustomTable/customTable"; +import AddManagerModal from "../../components/AddManagerModal/addManagerModal"; +import EditManagerModal from "../../components/EditManagerModal/editManagerModal"; import { useDispatch, useSelector } from "react-redux"; import { RootState, AppDispatch } from "../../redux/store/store"; import { diff --git a/src/pages/NotFound/index.tsx b/src/pages/NotFound/index.tsx index 578bc48..6a2cc09 100644 --- a/src/pages/NotFound/index.tsx +++ b/src/pages/NotFound/index.tsx @@ -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() { - return ( -
NotFoundPage
- ) -} +// Animation for the car icon +const pulse = keyframes` + 0% { + transform: scale(1); + } + 50% { + transform: scale(1.1); + } + 100% { + transform: scale(1); + } +`; -export default NotFoundPage; \ No newline at end of file +const NotFoundPage = () => { + return ( + + + + + 404 + + + Oops! Page Not Found + + + The path you’re looking for seems to be off the grid. Maybe + the charging station is offline? ⚡ + + + + + + + + + + + + + ); +}; + +export default NotFoundPage; diff --git a/src/pages/ProfilePage/index.tsx b/src/pages/ProfilePage/index.tsx index 0de4db3..6cf6e7c 100644 --- a/src/pages/ProfilePage/index.tsx +++ b/src/pages/ProfilePage/index.tsx @@ -120,13 +120,13 @@ const ProfilePage = () => { > Personal Information - Edit - + */} - {showPermissions ? ( ) : ( diff --git a/src/pages/StationList/index.tsx b/src/pages/StationList/index.tsx index 67dae63..efef763 100644 --- a/src/pages/StationList/index.tsx +++ b/src/pages/StationList/index.tsx @@ -1,7 +1,7 @@ import { Chip } from "@mui/material"; -import AddStationModal from "../../components/AddStationModal"; -import CustomTable, { Column } from "../../components/CustomTable"; -import EditStationModal from "../../components/EditStationModal"; +import AddStationModal from "../../components/AddStationModal/addStationModal"; +import CustomTable, { Column } from "../../components/CustomTable/customTable"; +import EditStationModal from "../../components/EditStationModal/editSationModal"; import { createStation, stationList, diff --git a/src/pages/UserList/index.tsx b/src/pages/UserList/index.tsx index 52f1579..620235e 100644 --- a/src/pages/UserList/index.tsx +++ b/src/pages/UserList/index.tsx @@ -1,8 +1,8 @@ import React, { useEffect, useState } from "react"; 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 CustomTable, { Column } from "../../components/CustomTable"; +import CustomTable, { Column } from "../../components/CustomTable/customTable"; import { useDispatch, useSelector } from "react-redux"; import { createUser, updateUser, userList } from "../../redux/slices/userSlice"; import { AppDispatch, RootState } from "../../redux/store/store"; @@ -41,7 +41,6 @@ export default function UserList() { name: string; email: string; phone: string; - }) => { try { await dispatch(createUser(data)); @@ -65,7 +64,6 @@ export default function UserList() { name, email, phone, - }) ); await dispatch(userList()); diff --git a/src/pages/VehicleList/index.tsx b/src/pages/VehicleList/index.tsx index 5edaa6d..388af12 100644 --- a/src/pages/VehicleList/index.tsx +++ b/src/pages/VehicleList/index.tsx @@ -1,6 +1,6 @@ import { useEffect, useState } from "react"; 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 { useDispatch, useSelector } from "react-redux"; import { AppDispatch } from "../../redux/store/store"; @@ -9,8 +9,8 @@ import { updateVehicle, vehicleList, } from "../../redux/slices/VehicleSlice"; -import AddVehicleModal from "../../components/AddVehicleModal"; -import EditVehicleModal from "../../components/EditVehicleModal"; +import AddVehicleModal from "../../components/AddVehicleModal/addVehicleModal"; +import EditVehicleModal from "../../components/EditVehicleModal/editVehicleModal"; export default function VehicleList() { const [addModalOpen, setAddModalOpen] = useState(false); diff --git a/src/router.tsx b/src/router.tsx index a0de92b..d9dc871 100644 --- a/src/router.tsx +++ b/src/router.tsx @@ -108,6 +108,7 @@ export default function AppRouter() { path="slot-list" element={} />} /> + {/* Catch-all Route */}