-
+
+
-
{/* Footer Sections */}
diff --git a/src/app/products/[id]/page.tsx b/src/app/products/[id]/page.tsx
index 954fe44..7969a2b 100644
--- a/src/app/products/[id]/page.tsx
+++ b/src/app/products/[id]/page.tsx
@@ -1,38 +1,31 @@
-// BuyerProductView
'use client';
import React, { useState } from 'react';
import { Swiper, SwiperSlide } from 'swiper/react';
import 'swiper/css';
import 'swiper/css/free-mode';
+import 'swiper/css/zoom';
import 'swiper/css/navigation';
import 'swiper/css/thumbs';
import { FreeMode, Navigation, Thumbs } from 'swiper/modules';
-import Image from 'next/image'; //@ts-ignore
+// @ts-ignore
import ReactStars from 'react-rating-stars-component';
import { MdOutlineShoppingCart } from 'react-icons/md';
import { FaRegHeart } from 'react-icons/fa6';
import { useParams } from 'next/navigation';
import { Product } from '@/utils/requests';
-import {
- ProductObj,
- ProductType,
- ReviewType,
- imageType,
-} from '@/types/Product';
+import { ProductType, ReviewType, imageType } from '@/types/Product';
import Card from '@/components/Card';
import Header from '@/components/Header';
import Footer from '@/components/Footer';
-import image from '../../../../public/product.png';
import { useQuery } from '@tanstack/react-query';
import ReviewCard from '@/components/ReviewCard';
import Button from '@/components/Button';
import { averageReviews } from '@/utils/averageReviews';
import { useAppDispatch } from '@/redux/store';
import { handleUserAddCart } from '@/redux/slices/userCartSlice';
-
function Page() {
const [thumbsSwiper, setThumbsSwiper] = useState(null);
- const { id } :any= useParams();
+ const { id } = useParams();
const handleSwiper = (swiper: any) => {
setThumbsSwiper(swiper);
};
@@ -44,174 +37,193 @@ function Page() {
const response: ProductType = (await Product.single(
_id,
)) as ProductType;
-
return response;
} catch (error) {
throw new Error('Error fetching product data');
}
},
});
- if (isLoading) return
Loading...;
-
if (error) return
Error: {error.message};
-
const {
productPictures,
productName,
productPrice,
productDescription,
reviews,
- } = data.product;
- console.log('this is reviews >>>>>>>>>', reviews);
- console.log(' this is average reviews', productPictures);
- const { relatedProducts } = data;
+ } = data?.product || {};
+ const { relatedProducts } = data || {};
const dispatch = useAppDispatch();
const handleNewItem = () => {
const productId = data.product.id;
dispatch(handleUserAddCart({ productPrice, productId }));
};
-
return (
-
-
-
-
-
- {productPictures && productPictures.length > 0 ? (
-
- {productPictures.map((image: imageType) => {
- return (
-
- 
-
- );
- })}
-
- ) : (
-
- )}
-
-
- {productPictures && productPictures.length > 0 ? (
-
+ <>
+ {isLoading ? (
+
+ ) : (
+
+
+
+
+
- {productPictures.map((image: imageType) => {
- return (
-
-
-
- );
- })}
+ {[
+ ...(!productPictures?.length
+ ? [
+ {
+ imgId: 'fail Image',
+ url: '/product.png',
+ },
+ ]
+ : productPictures),
+ ].map((image: imageType) => (
+
+
+ (e.currentTarget.src = '/product.png')
+ }
+ />
+
+ ))}
- ) : (
-
no image found!
- )}
-
-
-
-
-
{productName}
-
-
-
-
-
+
+ {productPictures && productPictures.length > 0 ? (
+
+
+ {productPictures.map((image: imageType) => (
+
+
+
+ ))}
+
+
+ ) : (
+
no image found!
+ )}
+
+
+
+
+
+ {productName}
+
-
-
{
- handleNewItem();
- }}
+
+
+
+
+
+
+ {
+ handleNewItem();
+ }}
+ />
+
+
+
+ {productPrice}{' '}
+ RWF
+
+
+
+
+
Description:
+
{productDescription}
+
-
- RWF {productPrice}
-
-
-
-
-
-
Description:
-
{productDescription}
+
+
Related products:
+
+ {relatedProducts && relatedProducts.length > 0 ? (
+ relatedProducts.map((product: ProductType) => (
+
+ ))
+ ) : (
+
+ No related products available.
+
+ )}
+
-
-
-
-
Related products:
-
-
- {relatedProducts && relatedProducts.length > 0 ? (
- relatedProducts.map((product: ProductType) => (
-
- ))
- ) : (
-
- No related products available.
-
- )}
+
+
+
Reviews:
+
+
+
+ {reviews && reviews.length > 0 ? (
+ reviews.map((review: ReviewType) => (
+
+ ))
+ ) : (
+
No ratings yet.
+ )}
+
-
-
-
Reviews:
-
-
-
- {reviews && reviews.length > 0 ? (
- reviews.map((review: ReviewType) => (
-
- ))
- ) : (
-
No ratings yet.
- )}
-
-
-
-
+ )}
+
);
}
-
export default Page;
diff --git a/src/app/sellers/products_/page.tsx b/src/app/sellers/products_/page.tsx
index 9d313e4..352b7b5 100644
--- a/src/app/sellers/products_/page.tsx
+++ b/src/app/sellers/products_/page.tsx
@@ -14,16 +14,16 @@ function SellerProductView() {
};
return (
<>
-
-
+
+
diff --git a/src/components/2faVerification.tsx b/src/components/2faVerification.tsx
index 974d755..729d336 100644
--- a/src/components/2faVerification.tsx
+++ b/src/components/2faVerification.tsx
@@ -13,7 +13,6 @@ import {
resendOTPCode,
} from '@/redux/slices/2faAuthenticationSlice';
import GlobarPopUp from './UsablePopUp';
-import request from '@/utils/axios';
interface OtpVerifyInterface {
isOpen: boolean;
@@ -32,7 +31,7 @@ const OtpVerify: React.FC
= ({ isOpen }) => {
useEffect(() => {
if (isAuthenticated) {
- router.push('/seller/dashboard/products');
+ router.push('/dashboard/home');
}
}, [isAuthenticated]);
@@ -45,12 +44,7 @@ const OtpVerify: React.FC = ({ isOpen }) => {
const VerifyOtp = async () => {
var otp = input.join('');
const result = otpValidation.safeParse({ otp });
- const result1 = await dispatch(handleOTPVerification(otp));
- if (result1) {
- const profile = await request.get(`${URL}/users/profile`);
- const userData = JSON.stringify(profile);
- localStorage.setItem('profile', userData);
- }
+ await dispatch(handleOTPVerification(otp));
};
const HandleInput = (
index: number,
diff --git a/src/components/AssigningRoles.tsx b/src/components/AssigningRoles.tsx
index 26bb93a..d78ea20 100644
--- a/src/components/AssigningRoles.tsx
+++ b/src/components/AssigningRoles.tsx
@@ -1,62 +1,81 @@
-"use client"
+'use client';
import React, { useEffect, useRef, useState } from 'react';
import request from '@/utils/axios';
-import { useQuery, useMutation, RefetchOptions, QueryObserverResult, useQueryClient } from "@tanstack/react-query";
-import Swal from 'sweetalert2'
+import {
+ useQuery,
+ useMutation,
+ RefetchOptions,
+ QueryObserverResult,
+ useQueryClient,
+} from '@tanstack/react-query';
+import Swal from 'sweetalert2';
interface AssignRoleInterface {
- id: string,
- currentRole: string,
- refetch: (options?: RefetchOptions) => Promise>
+ id: string;
+ currentRole: string;
+ refetch: (
+ options?: RefetchOptions,
+ ) => Promise>;
}
-const AssigningRole: React.FC = ({ id, currentRole, refetch }) => {
+const AssigningRole: React.FC = ({
+ id,
+ currentRole,
+ refetch,
+}) => {
const select = useRef(null);
const { isLoading, error, data } = useQuery({
queryKey: ['RolesList'],
queryFn: () => request.get('/roles'),
});
- var roles = data
+ var roles = data;
const mutation = useMutation({
mutationFn: (roleId: string) => {
- return request.patch(`/users/${id}/roles`, { roleId })
+ return request.patch(`/users/${id}/roles`, { roleId });
},
onError: (error) => console.log(error),
onSuccess: () => {
- refetch()
+ refetch();
Swal.fire({
- title: "Success",
- text: "Successfully Changed Role",
- icon: "success"
+ title: 'Success',
+ text: 'Successfully Changed Role',
+ icon: 'success',
});
- },
- })
+ },
+ });
const Assign = async () => {
- var role = select.current?.value as string
- mutation.mutate(role)
+ var role = select.current?.value as string;
+ mutation.mutate(role);
};
return (
<>
- {
- isLoading || mutation.isPending ? (
-
- ) : (
-
- )
- }
+ {isLoading || mutation.isPending ? (
+
+ ) : (
+
+ )}
);
};
diff --git a/src/components/Button.tsx b/src/components/Button.tsx
index 899b49b..dea261d 100644
--- a/src/components/Button.tsx
+++ b/src/components/Button.tsx
@@ -1,7 +1,7 @@
'use client';
import React from 'react';
import { IoChevronBack } from 'react-icons/io5';
-import { IoMdClose } from "react-icons/io";
+import { IoMdClose } from 'react-icons/io';
interface Properties {
name?: string;
handle?: () => void;
@@ -10,12 +10,20 @@ interface Properties {
rotate?: boolean;
background?: string;
border?: string;
- btnColor?:string;
- className?:string;
+ btnColor?: string;
+ className?: string;
}
-export const Button: React.FC = ({ name, handle, loading, isDisabled, rotate, background, btnColor }) => {
- const buttonClassName = ` relative min-h-[40px] min-w-[100%] bg-${background?background:'primaryBlue'}-600 ${btnColor? btnColor : ''} text-white p-1.5 px-8 border rounded-b-sm rounded-s-sm hover:bg-${background?background:'primaryBlue'}-700`
+export const Button: React.FC = ({
+ name,
+ handle,
+ loading,
+ isDisabled,
+ rotate,
+ background,
+ btnColor,
+}) => {
+ const buttonClassName = ` relative min-h-[40px] min-w-[100%] bg-${background ? background : 'primaryBlue'}-600 ${btnColor ? btnColor : ''} text-white p-1.5 px-8 border rounded-b-sm rounded-s-sm hover:bg-${background ? background : 'primaryBlue'}-700`;
return (