Update Favorites.jsx
This commit is contained in:
@@ -80,9 +80,8 @@ const Favorites = () => {
|
||||
id: item.ProductID,
|
||||
title: item.Name,
|
||||
price: parseFloat(item.Price),
|
||||
category: mapCategory(item.CategoryID), // 👈 map numeric category to a string
|
||||
category: mapCategory(item.CategoryID),
|
||||
image: item.image_url || "/default-image.jpg",
|
||||
condition: "Used", // or another field if you add `Condition` to your DB
|
||||
seller: item.SellerName,
|
||||
datePosted: formatDatePosted(item.Date),
|
||||
dateAdded: item.Date || new Date().toISOString(),
|
||||
@@ -118,62 +117,12 @@ const Favorites = () => {
|
||||
? sortedFavorites
|
||||
: sortedFavorites.filter((item) => item.category === filterCategory);
|
||||
|
||||
// rest of the JSX remains unchanged...
|
||||
|
||||
return (
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<div className="flex justify-between items-center mb-6">
|
||||
<h1 className="text-2xl font-bold text-gray-800">My Favorites</h1>
|
||||
<button
|
||||
className="flex items-center text-gray-600 hover:text-gray-800"
|
||||
onClick={() => setShowFilters(!showFilters)}
|
||||
>
|
||||
<Filter className="h-5 w-5 mr-1" />
|
||||
<span>Filter & Sort</span>
|
||||
<ChevronDown
|
||||
className={`h-4 w-4 ml-1 transition-transform ${showFilters ? "rotate-180" : ""}`}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Filters and Sorting */}
|
||||
{showFilters && (
|
||||
<div className="bg-white border border-gray-200 p-4 mb-6">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Sort by
|
||||
</label>
|
||||
<select
|
||||
value={sortBy}
|
||||
onChange={(e) => setSortBy(e.target.value)}
|
||||
className="w-full p-2 border border-gray-300 focus:outline-none focus:border-green-500"
|
||||
>
|
||||
<option value="dateAdded">Recently Added</option>
|
||||
<option value="priceHigh">Price (High to Low)</option>
|
||||
<option value="priceLow">Price (Low to High)</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Category
|
||||
</label>
|
||||
<select
|
||||
value={filterCategory}
|
||||
onChange={(e) => setFilterCategory(e.target.value)}
|
||||
className="w-full p-2 border border-gray-300 focus:outline-none focus:border-green-500"
|
||||
>
|
||||
{categories.map((category) => (
|
||||
<option key={category} value={category}>
|
||||
{category}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Favorites List */}
|
||||
{filteredFavorites.length === 0 ? (
|
||||
<div className="bg-white border border-gray-200 p-8 text-center">
|
||||
@@ -227,8 +176,6 @@ const Favorites = () => {
|
||||
<div className="flex items-center text-sm text-gray-500 mb-3">
|
||||
<Tag className="h-4 w-4 mr-1" />
|
||||
<span>{item.category}</span>
|
||||
<span className="mx-2">•</span>
|
||||
<span>{item.condition}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-between items-center pt-2 border-t border-gray-100">
|
||||
|
||||
Reference in New Issue
Block a user