removed some unnecessary ui elements

This commit is contained in:
Jelaletdin12
2026-02-02 16:22:27 +05:00
parent b8c871750a
commit c68ac335c6
12 changed files with 120 additions and 205 deletions

View File

@@ -81,13 +81,13 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
sessionStorage.setItem(
PENDING_CART_UPDATES_KEY,
JSON.stringify(pending)
JSON.stringify(pending),
);
} catch (error) {
console.error("Failed to save pending update:", error);
}
},
[item.product_id]
[item.product_id],
);
// Remove from sessionStorage
@@ -103,7 +103,7 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
} else {
sessionStorage.setItem(
PENDING_CART_UPDATES_KEY,
JSON.stringify(pending)
JSON.stringify(pending),
);
}
}
@@ -200,7 +200,7 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
retrySyncRef.current?.(quantity);
},
}
},
);
}
},
@@ -211,7 +211,7 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
removeItem,
onUpdate,
clearPendingUpdate,
]
],
);
// Update ref
@@ -235,7 +235,7 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
// Trigger sync after a short delay
setTimeout(
() => syncToServerRef.current?.(productPending.quantity),
500
500,
);
}
}
@@ -336,14 +336,6 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
</div>
<div className="flex flex-col gap-2">
<h3 className="font-semibold text-base">{item.product.name}</h3>
<p className="text-sm text-gray-600">
{item.seller?.name || "Store"}
</p>
{availableStock <= 5 && (
<p className="text-xs text-orange-600 font-medium">
{t("only_left", { count: availableStock })}
</p>
)}
<Button
variant="ghost"
size="sm"

View File

@@ -189,47 +189,12 @@ export default function OrderSummary({
}`}
/>
{showValidation && !isPhoneValid && (
<p className="text-xs text-red-500 mt-1">
{t("requiredField")}
</p>
<p className="text-xs text-red-500 mt-1">{t("requiredField")}</p>
)}
</div>
</div>
</div>
{/* Payment Type */}
<div className="mb-6">
<h3 className="text-lg font-semibold mb-3">{t("payment_type")}</h3>
<div className="flex gap-2">
{paymentTypes.map((type) => (
<Card
key={type.id}
className={`flex-1 cursor-pointer transition-all ${
paymentType?.id === type.id
? "border-2 border-[#005bff] bg-blue-50"
: showValidation && !paymentType
? "border-2 border-red-500"
: "border-2 border-gray-200"
}`}
onClick={() => onPaymentTypeChange(type)}
>
<div className="flex flex-col items-center justify-center p-4 gap-2">
<span
className={`text-xs font-medium ${
paymentType?.id === type.id ? "text-[#005bff]" : ""
}`}
>
{type.name}
</span>
</div>
</Card>
))}
</div>
{showValidation && !paymentType && (
<p className="text-xs text-red-500 mt-1">{t("requiredField")}</p>
)}
</div>
{/* Region Selection */}
<div className="mb-6">
<Label className="text-lg font-semibold mb-3 block">

View File

@@ -299,21 +299,7 @@ export default function ProductCard({
)}
</Carousel>
<button
onClick={handleFavorite}
disabled={isFavoriteToggling || isFavoriteLoading}
className="absolute top-3 cursor-pointer right-3 z-10 rounded-full bg-white/80 p-2 hover:bg-white transition-all disabled:opacity-50"
>
{isFavoriteLoading ? (
<div className="w-5 h-5 border-2 border-gray-300 border-t-gray-600 rounded-full animate-spin" />
) : (
<Heart
className={`w-5 h-5 ${
isFavorite ? "text-[#005bff] fill-[#005bff]" : "text-gray-700"
}`}
/>
)}
</button>
{hasMultipleImages && (
<div className="absolute bottom-2 left-1/2 -translate-x-1/2 z-10 flex gap-1.5">
@@ -365,8 +351,24 @@ export default function ProductCard({
</p>
</CardContent>
<div className="flex">
<button
onClick={handleFavorite}
disabled={isFavoriteToggling || isFavoriteLoading}
className=" cursor-pointer z-10 rounded-full bg-white/80 p-2 hover:bg-white transition-all disabled:opacity-50"
>
{isFavoriteLoading ? (
<div className="w-5 h-5 border-2 border-gray-300 border-t-gray-600 rounded-full animate-spin" />
) : (
<Heart
className={`w-5 h-5 ${
isFavorite ? "text-[#005bff] fill-[#005bff]" : "text-gray-700"
}`}
/>
)}
</button>
{button && !isOutOfStock && (
<div className="px-1">
<div className="px-1 w-full">
{!isInCart ? (
<Button
onClick={handleAddToCart}
@@ -413,6 +415,7 @@ export default function ProductCard({
)}
</div>
)}
</div>
</Card>
</div>

View File

@@ -94,6 +94,7 @@ export default function CollectionSection({ collection, locale }: Props) {
price_color="#0059ff"
height={360}
width={250}
button={true}
/>
);
})}

View File

@@ -47,31 +47,8 @@ export function ProductInfoCard({
</>
)}
{stock !== undefined && (
<>
<div className="flex justify-between items-center py-2">
<span className="text-gray-500">{t("stock")}</span>
<span
className={`font-medium ${
stock === 0
? "text-red-500"
: stock <= 5
? "text-orange-600"
: "text-green-600"
}`}
>
{stock === 0
? t("out_of_stock")
: stock <= 5
? `${t("only_left", { count: stock })}`
: stock}
</span>
</div>
<Separator />
</>
)}
{barcode && (
{/* {barcode && (
<>
<div className="flex justify-between items-center py-2">
<span className="text-gray-500">{t("barcode")}</span>
@@ -79,7 +56,7 @@ export function ProductInfoCard({
</div>
<Separator />
</>
)}
)} */}
{colour && (
<>

View File

@@ -39,10 +39,6 @@ interface PendingUpdate {
retryCount: number;
}
// const DEBUG = true
// const log = (...args: any[]) => {
// if (DEBUG) console.log("[ProductPage]", ...args)
// }
export default function ProductPageContent({ slug }: ProductDetailProps) {
const [localQuantity, setLocalQuantity] = useState(1);
@@ -524,14 +520,14 @@ export default function ProductPageContent({ slug }: ProductDetailProps) {
/>
</div>
<ProductReviewsSection
{/* <ProductReviewsSection
reviews={reviews}
averageRating={averageRating}
isLoading={false}
onWriteReview={() => setShowReviewModal(true)}
/>
<RelatedProductsSection products={transformedRelatedProducts} />
<RelatedProductsSection products={transformedRelatedProducts} /> */}
</div>
<StockLimitModal

View File

@@ -2,7 +2,6 @@ import Link from "next/link";
import { Minus, Plus, Heart, ShoppingCart, Store } from "lucide-react";
import { Button } from "@/components/ui/button";
import { Card } from "@/components/ui/card";
import { Avatar, AvatarFallback } from "@/components/ui/avatar";
interface ProductPurchaseCardProps {
price: string;
@@ -163,28 +162,7 @@ export function ProductPurchaseCard({
</div>
</Card>
{channelName && (
<Card className="p-6 rounded-xl">
<div className="flex items-center gap-4 mb-4">
<Avatar className="w-14 h-14 bg-primary/10">
<AvatarFallback className="bg-transparent">
<Store className="h-6 w-6 text-primary" />
</AvatarFallback>
</Avatar>
<div>
<p className="text-sm text-gray-500">{t("store")}</p>
<h4 className="text-lg font-bold">{channelName}</h4>
</div>
</div>
<Button
variant="outline"
size="lg"
className="w-full cursor-pointer rounded-lg"
>
{t("write_to_store")}
</Button>
</Card>
)}
</div>
);
}