-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(wishes):buyer should be able wish a products
-Buyer should wish a products -Buyer should add a wished products to cart -Seller should be able to see a wished products [Deliver #187419141]
- Loading branch information
1 parent
a738f89
commit b44cf44
Showing
12 changed files
with
198 additions
and
40 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,100 @@ | ||
import React, { useEffect, useState } from "react"; | ||
import { useDispatch, useSelector } from "react-redux"; | ||
|
||
import { fetchWishes } from "../../redux/reducers/wishListSlice"; | ||
import { RootState, AppDispatch } from "../../redux/store"; | ||
|
||
import Spinner from "./Spinner"; | ||
|
||
const WishesTable: React.FC = () => { | ||
const dispatch: AppDispatch = useDispatch(); | ||
const { wishes, isLoading, error } = useSelector( | ||
(state: RootState) => state.wishes, | ||
); | ||
useEffect(() => { | ||
const fetchData = async () => { | ||
try { | ||
await dispatch(fetchWishes()); | ||
} catch (error) { | ||
console.error(error); | ||
} | ||
}; | ||
|
||
fetchData(); | ||
}, [dispatch]); | ||
|
||
return ( | ||
<div className="relative"> | ||
<div className="overflow-x-scroll "> | ||
<table className="min-w-full bg-white border-collapse"> | ||
<thead className="border-b-2"> | ||
<tr className="px-3 bg-light-blue rounded-lg"> | ||
<th className="pr-6 rounded-l-[12px] py-2 pl-4 text-sm font-medium text-left whitespace-nowrap text-black"> | ||
Product | ||
</th> | ||
<th className="py-2 px-4 text-sm font-medium text-left text-black whitespace-nowrap"> | ||
Stock Quantity | ||
</th> | ||
<th className="py-2 px-4 text-sm font-medium text-left text-black whitespace-nowrap"> | ||
Price | ||
</th> | ||
<th className="py-2 px-4 text-sm font-medium text-left text-black whitespace-nowrap"> | ||
Buyer | ||
</th> | ||
<th className="py-2 px-4 text-sm font-medium text-left text-black whitespace-nowrap"> | ||
</th> | ||
</tr> | ||
</thead> | ||
<tbody> | ||
{isLoading ? ( | ||
<tr> | ||
<td colSpan={9} className="text-center py-4"> | ||
<Spinner /> | ||
</td> | ||
</tr> | ||
) : wishes.length === 0 ? ( | ||
<tr> | ||
<td | ||
colSpan={6} | ||
className="text-center py-10 text-dark-gray dark:text-white" | ||
> | ||
No products found. | ||
</td> | ||
</tr> | ||
) : ( | ||
wishes.map((item) => ( | ||
<tr key={item.id} className="px-2"> | ||
<td className="pl-4 pr-10 xl:pr-10 py-2 flex items-center whitespace-nowrap space-x-3"> | ||
<img | ||
src={item.product.images[0]} | ||
alt={item.product.name} | ||
className="w-10 h-10 object-cover mr-2" | ||
/> | ||
<span className="text-dark-gray text-sm"> | ||
{item?.product.name} | ||
</span> | ||
</td> | ||
<td className="py-3 px-4 text-gray-700 text-sm"> | ||
{item.product.stockQuantity} | ||
</td> | ||
<td className="py-3 px-4 text-gray-700 text-sm"> | ||
{item.product.price} | ||
</td> | ||
<td className="py-3 px-4 text-gray-700 text-sm whitespace-nowrap"> | ||
{item.user.name} | ||
</td> | ||
<td className="py-3 px-4 text-sm text-gray-700"> | ||
{item.user.email} | ||
</td> | ||
</tr> | ||
)) | ||
)} | ||
</tbody> | ||
</table> | ||
</div> | ||
</div> | ||
); | ||
}; | ||
|
||
export default WishesTable; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
import Layout from "../../components/layouts/SellerLayout"; | ||
import WishesTable from "../../components/dashboard/wishesTable"; | ||
|
||
const Wishes = () => ( | ||
<Layout> | ||
<div className="mt-24 mb-4"> | ||
<h1 className="text-2xl font-medium text-black">Wishes List</h1> | ||
<p className="text-dark-gray"> | ||
Detailed information about your wished products | ||
</p> | ||
</div> | ||
<section className="lg:pl-5 bg-white relative xl:w-full px-4"> | ||
<WishesTable /> | ||
</section> | ||
</Layout> | ||
); | ||
|
||
export default Wishes; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.