-
-
- Total:
- ${total} -
+
+ )}
+ {cartItems.length === 0 && (
+ Total:
+ ${total} +Cart Empty
+ )} + {cartItems.length > 0 && ( +
diff --git a/src/components/Cart/CartItem.tsx b/src/components/Cart/CartItem.tsx
index a6deef70..250e8f2d 100644
--- a/src/components/Cart/CartItem.tsx
+++ b/src/components/Cart/CartItem.tsx
@@ -10,9 +10,10 @@ interface CartProps {
price: number;
name: string;
quantity: number;
+ image: string;
}
-function CartItem({ id, price, name, quantity }: CartProps) {
+function CartItem({ id, price, name, quantity, image }: CartProps) {
const dispatch = useAppDispatch();
const [size, setSize] = useState<'M' | 'S' | 'L'>('M');
@@ -33,59 +34,15 @@ function CartItem({ id, price, name, quantity }: CartProps) {
return (
{name}
-
-
- Color
-
-
-
-
-
-
-
- Size
-
-
-
-
-
-
-
+
+
Quantity
);
diff --git a/src/components/TopCategories.tsx b/src/components/TopCategories.tsx
index 087357d1..bdce3c7d 100644
--- a/src/components/TopCategories.tsx
+++ b/src/components/TopCategories.tsx
@@ -29,7 +29,7 @@ function TopCategories() {
}, [token]);
return (
-
+
Top Categories
Categories
diff --git a/src/components/dashBoard/BestSellingProducts.tsx b/src/components/dashBoard/BestSellingProducts.tsx index 2c50bbac..6c4d2158 100644 --- a/src/components/dashBoard/BestSellingProducts.tsx +++ b/src/components/dashBoard/BestSellingProducts.tsx @@ -19,13 +19,13 @@ function ProductTable() { }); }, [token]); return ( -
+
Best selling Products
-
+
-
| ID | +||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| No | IMAGE | PRODUCT NAME | CATEGORY | @@ -35,7 +35,7 @@ function ProductTable() {|||||||||||||||||||||||||
| {idx + 1} |
{item.icon}
- {item.name}
+
+ {item.name}
+
{item.subItems &&
(expanded ? (
@@ -120,20 +181,26 @@ function SideBarItem({ item, activeItem, setActiveItem }: SideBarItemProps) {
{expanded && item.subItems && (
-
-
-
-
- Total Sales Available- -Sales Summary -
-
-
diff --git a/src/features/Cart/cartSlice.tsx b/src/features/Cart/cartSlice.tsx
index a6837279..914986ed 100644
--- a/src/features/Cart/cartSlice.tsx
+++ b/src/features/Cart/cartSlice.tsx
@@ -2,12 +2,7 @@ import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
import axios from 'axios';
import Cart from '@/interfaces/cart';
import { RootState } from '../../app/store';
-import {
- showSuccessToast,
- showErrorToast,
- showInfoToast,
-} from '@/utils/ToastConfig';
-
+import { showErrorToast } from '@/utils/ToastConfig';
interface CartState {
cartItems: Cart[];
@@ -40,7 +35,19 @@ export const fetchCartItems = createAsyncThunk(
Authorization: `Bearer ${tokenFromStorage}`,
},
});
- return response.data.cartItems;
+ const res = response.data.cartItems;
+ res.reduce((acc: Cart[], curr: Cart) => {
+ const existingItem = acc.find(
+ (item) => item.product.id === curr.product.id
+ );
+ if (existingItem) {
+ existingItem.quantity += curr.quantity;
+ } else {
+ acc.push(curr);
+ }
+ return acc;
+ }, []);
+ return res;
}
);
@@ -76,7 +83,10 @@ export const removeCartItem = createAsyncThunk(
export const addCartItem = createAsyncThunk(
'cart/addCartItem',
- async ({ productId, quantity }: { productId: number; quantity: number }, { rejectWithValue }) => {
+ async (
+ { productId, quantity }: { productId: number; quantity: number },
+ { rejectWithValue }
+ ) => {
try {
const tokenFromStorage = localStorage.getItem('token') || '';
const response = await axios.post
-
-
-
- 
-
-
- {sum}$
-
- Total Sales
+ {Role === 'Admin' && (
+ <>
+
+
-
+
- Total Sales Available+All Products Sales -
-
- {Array.from({ length: Math.floor(4 - product.averageRating) }).map(
+ {Array.from({ length: Math.floor(5 - product.averageRating) }).map(
(_, index) => {
return (
-
);
diff --git a/src/components/dashBoard/UserRole.tsx b/src/components/dashBoard/UserRole.tsx
new file mode 100644
index 00000000..6ac15ba7
--- /dev/null
+++ b/src/components/dashBoard/UserRole.tsx
@@ -0,0 +1,357 @@
+/* eslint-disable react/button-has-type */
+import { useEffect, useState, useCallback } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import { FaRegTrashAlt } from 'react-icons/fa';
+import { MdOutlineEdit } from 'react-icons/md';
+import BeatLoader from 'react-spinners/BeatLoader';
+import { RootState, AppDispatch } from '@/app/store';
+import { showErrorToast, showSuccessToast } from '@/utils/ToastConfig';
+import {
+ fetchUserRoles,
+ deleteUserRole,
+ createUserRole,
+ updateUserRole,
+} from '@/features/userRole/userRoleSlice';
+import ConfirmationCard from './ConfirmationCard';
+import CircularPagination from './NavigateonPage';
+import TableLogo from '@/assets/TableLogo.png';
+
+function TableUserRole() {
+ const dispatch: AppDispatch = useDispatch();
+ const { roles, status } = useSelector((state: RootState) => state.userRoles);
+ const [editRole, setEditRole] = useState<{
+ id: number;
+ name: string;
+ permissions: string[];
+ } | null>(null);
+
+ const [isConfirmationModalVisible, setModalVisible] = useState(false);
+ const [itemSelected, setItemSelected] = useState
-
- 
+ Sales Summary +
+
-
+
-
+
+
+
+
+
+
+ {sum}$
+
+ Total Sales
+
+ + All Products Sales + {order.length}
-
- Total Order
-
- All Orders -
-
-
-
-
- 
+
+
-
+
+
+
+
+ {order.length}
+
+ Total Order
+
+ All Orders {tproduct}
-
- Product Sold
-
- All Products Sold -
-
-
-
-
-
- 
+
+
-
+
+
+
+
+ {tproduct}
+
+ Product Sold
+
+ + All Products Sold{' '} +
- {buyers &&
- buyers.filter(
- (user) => user.userType && user.userType.name === 'Buyer'
- ).length}
+
-
+
+
+
+
+
+
+ {buyers &&
+ buyers.filter(
+ (user) =>
+ user.userType && user.userType.name === 'Buyer'
+ ).length}
+
+
+ New Customers
+
+ All Buyers
- New Customers
-
- All Buyers
-
-
-
-
-
+
+
+
+
+
+ )}
+
+ );
+}
+
+export default TableUserRole;
diff --git a/src/components/dashBoard/addProducts.tsx b/src/components/dashBoard/addProducts.tsx
index b2a2206a..36fed32b 100644
--- a/src/components/dashBoard/addProducts.tsx
+++ b/src/components/dashBoard/addProducts.tsx
@@ -1,4 +1,3 @@
-/* eslint-disable jsx-a11y/label-has-associated-control */
import React, { useState, ChangeEvent, useEffect } from 'react';
import {
Formik,
diff --git a/src/components/home/ProductCard.tsx b/src/components/home/ProductCard.tsx
index 0e7755b9..5afa3a60 100644
--- a/src/components/home/ProductCard.tsx
+++ b/src/components/home/ProductCard.tsx
@@ -1,18 +1,22 @@
import { useNavigate } from 'react-router-dom';
+import { useState } from 'react';
import { FaRegHeart, FaHeart } from 'react-icons/fa';
import { useAppDispatch, useAppSelector } from '@/app/hooks';
+import Cart from '@/interfaces/cart';
import {
addToWishlist,
removeFromWishlist,
} from '@/features/Products/ProductSlice';
import { Product } from '@/types/Product';
-import { addCartItem } from '@/features/Cart/cartSlice';
+import { addCartItem, removeCartItem } from '@/features/Cart/cartSlice';
+import { showSuccessToast } from '@/utils/ToastConfig';
interface ProductCardProps {
product: Product;
}
function ProductCard({ product }: ProductCardProps) {
+ const [cartId, setCartId] = useStateManage User Role +
+
+
+
+
+
+
+
+
+ {mode === 'delete' && (
+
+
+ Register Role +
+
+ setRoleName(e.target.value)}
+ className="w-[100%] border relative bg-grayLight text-black duration-100 outline-none justify-between flex items-center gap-2 px-3 rounded-md font-light group-hover:border-grayDark p-3 mb-5 lg:w-[70%] md:w-[70%]"
+ />
+
+
+
+
+
+
+
+
+
+ {permissions.map((permission, index) => (
+
+ {permission}
+
+
+ ))}
+
+
+ setNewPermission(e.target.value)}
+ className="w-[100%] border relative bg-grayLight duration-100 outline-none justify-between flex items-center gap-2 px-3 rounded-md font-light group-hover:border-grayDark p-3 lg:w-[70%] md:w-[70%]"
+ />
+
+
+
+ {editRole ? (
+
+ ) : (
+
+ )}
+
+
+
+ )}
+
+ {isPopupVisible && (
+
+
+ )}
+
+
+
+
+
+
+
+ DELETE ROLE +{popupMessage} +
@@ -162,13 +194,25 @@ function ProductCard({ product }: ProductCardProps) {
${product.regularPrice}
-
+
+ );
+}
+
+export default CouponForm;
diff --git a/src/pages/Coupons.tsx b/src/pages/Coupons.tsx
new file mode 100644
index 00000000..2842afa1
--- /dev/null
+++ b/src/pages/Coupons.tsx
@@ -0,0 +1,353 @@
+import React, { useEffect, useState } from 'react';
+import { Link } from 'react-router-dom';
+import { FaRegTrashAlt } from 'react-icons/fa';
+import { MdOutlineEdit } from 'react-icons/md';
+import { IoIosArrowDown, IoIosSearch } from 'react-icons/io';
+import PuffLoader from 'react-spinners/PuffLoader';
+import { useDispatch, useSelector } from 'react-redux';
+import { AppDispatch, RootState } from '@/app/store';
+import {
+ fetchCoupons,
+ deleteCoupon,
+ selectCoupons,
+ fetchMyCoupons,
+} from '@/features/Coupons/CouponsFeature';
+
+import CircularPagination from '@/components/dashBoard/NavigateonPage';
+import { useAppSelector } from '@/app/hooks';
+import { showErrorToast } from '@/utils/ToastConfig';
+import Button from '@/components/form/Button';
+
+function Coupons() {
+ const [currentPage, setCurrentPage] = useState(1);
+ const [searchTerm, setSearchTerm] = useState('');
+ const [expandedRows, setExpandedRows] = useState
+
+ Create New Coupon+
+
+ );
+}
+
+export default Coupons;
diff --git a/src/pages/EditCoupon.tsx b/src/pages/EditCoupon.tsx
new file mode 100644
index 00000000..a1fdd75f
--- /dev/null
+++ b/src/pages/EditCoupon.tsx
@@ -0,0 +1,320 @@
+import { useEffect, useState } from 'react';
+import axios from 'axios';
+import { useParams, useNavigate } from 'react-router-dom';
+import * as Yup from 'yup';
+import { Formik, Field, Form, FieldArray, ErrorMessage } from 'formik';
+import BeatLoader from 'react-spinners/BeatLoader';
+import { IoIosCloseCircle } from 'react-icons/io';
+import PuffLoader from 'react-spinners/PuffLoader';
+import { useAppSelector, useAppDispatch } from '@/app/hooks';
+import { updateCoupon } from '@/features/Coupons/CouponsFeature';
+import { RootState } from '@/app/store';
+import { showErrorToast } from '@/utils/ToastConfig';
+import Product from '@/interfaces/product';
+
+interface CouponFormData {
+ description: string;
+ percentage: number;
+ expirationDate: string;
+ applicableProducts: Product[];
+}
+
+function EditCoupon() {
+ const [products, setProducts] = useState
+
+ Coupons+
+
+ {/* Table */}
+ {deleteModal && (
+
+
+
+
+ )}
+ {loading ? (
+
+
+
+ Are you sure you want to Delete?
+
+
+
+ This coupons +
+
+
+
+
+
+ ) : error ? (
+ <>{showErrorToast(error)}
+ ) : (
+
+
+ )}
+
+
+
+
+ );
+ }
+
+ return (
+
+
+ );
+}
+
+export default EditCoupon;
diff --git a/src/pages/ProductDetails.tsx b/src/pages/ProductDetails.tsx
index aed5e19a..37d2583e 100644
--- a/src/pages/ProductDetails.tsx
+++ b/src/pages/ProductDetails.tsx
@@ -6,6 +6,8 @@ import ClipLoader from 'react-spinners/ClipLoader';
import { IoClose } from 'react-icons/io5';
import { useAppDispatch, useAppSelector } from '@/app/hooks';
import Button from '@/components/form/Button';
+import { addCartItem, removeCartItem } from '@/features/Cart/cartSlice';
+import Cart from '@/interfaces/cart';
import {
addToWishlist,
fetchProductDetails,
@@ -161,6 +163,7 @@ function ProductDetails() {
const [toggleLoginOverlay, setToggleLoginOverlay] = useState(false);
const [isVisible, setIsVisible] = useState({ state: true, name: 'details' });
const [activeImg, setActiveImg] = useState('');
+ const [cartId, setCartId] = useState
+
+ Edit Coupon+
@@ -343,45 +365,47 @@ function ProductDetails() {
);
})}
{Array.from({
- length: Math.floor(4 - product.averageRating),
+ length: Math.floor(5 - product.averageRating),
}).map((_, index) => {
return (
-
+ {product.averageRating % 1 !== 0 && (
+
+ )}
@@ -436,6 +460,7 @@ function ProductDetails() {
|