nurmuhammet/postshop-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed some bugs

Browse Source
This commit is contained in:
Jelaletdin12
2025-12-23 13:32:57 +05:00
parent cdc9fa686f
commit 2b46d525f2
30 changed files with 857 additions and 260 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
features/cart/components/CartItemCard.tsx
View File

@@ -1,7 +1,7 @@
"use client";
import { useState, useEffect, useRef, useCallback } from "react";
import Image from "next/image";
import { Minus, Plus, Trash2, Loader2, AlertTriangle } from "lucide-react";
import { Minus, Plus, Trash2, AlertTriangle } from "lucide-react";
import { Button } from "@/components/ui/button";
import { Card } from "@/components/ui/card";
import {
@@ -387,7 +387,7 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
variant="outline"
size="icon"
onClick={handleQuantityDecrease}
className={` cursor-pointer rounded-xl bg-blue-50 ${
className={` cursor-pointer rounded-lg bg-blue-50 ${
isSyncing ? "opacity-70" : ""
}`}
>
@@ -396,9 +396,6 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
<div className="w-12 text-center font-semibold relative">
{localQuantity}
{isSyncing && (
<Loader2 className="h-3 w-3 animate-spin absolute -top-1 -right-3 text-blue-500" />
)}
{syncError && (
<span
className="absolute -top-1 -right-3 h-2 w-2 bg-red-500 rounded-full"
@@ -412,7 +409,7 @@ export default function CartItemCard({ item, onUpdate }: CartItemCardProps) {
size="icon"
onClick={handleQuantityIncrease}
// disabled={localQuantity >= availableStock}
className={`rounded-xl cursor-pointer bg-blue-50 ${
className={`rounded-lg cursor-pointer bg-blue-50 ${
isSyncing ? "opacity-70" : ""
} ${
localQuantity >= availableStock

57
features/cart/components/CartItemSkeleton.tsx
View File

@@ -1,27 +1,36 @@
// import { Skeleton } from "@/components/ui/skeleton"
// import { Card } from "@/components/ui/card"
import { Card } from "@/components/ui/card";
import { Skeleton } from "@/components/ui/skeleton";
// export default function CartItemSkeleton() {
// return (
// <Card className="p-4 rounded-xl">
// <div className="flex gap-4">
// {/* Product Image */}
// <Skeleton className="w-24 h-24 rounded-lg flex-shrink-0 bg-gray-200" />
export default function CartItemSkeleton() {
return (
<Card className="p-4 shadow-none border">
<div className="flex flex-col sm:flex-row gap-4">
<div className="flex gap-4 flex-1">
<Skeleton className="w-[88px] h-[117px] rounded-xl" />
<div className="flex flex-col gap-2 flex-1">
<Skeleton className="h-5 w-3/4" />
<Skeleton className="h-4 w-1/2" />
<Skeleton className="h-4 w-1/3" />
<Skeleton className="h-5 w-5 rounded" />
</div>
</div>
<div className="flex flex-col sm:flex-row items-start sm:items-center gap-4 justify-between">
<div className="space-y-2">
<Skeleton className="h-4 w-32" />
<Skeleton className="h-4 w-24" />
<Skeleton className="h-8 w-40 rounded-lg" />
</div>
<div className="flex items-center gap-2">
<Skeleton className="h-10 w-10 rounded-xl" />
<Skeleton className="h-6 w-12" />
<Skeleton className="h-10 w-10 rounded-xl" />
</div>
</div>
</div>
</Card>
);
}
// {/* Product Info */}
// <div className="flex-1 space-y-2">
// <Skeleton className="h-4 w-3/4 bg-gray-200" />
// <Skeleton className="h-4 w-1/2 bg-gray-200" />
// <Skeleton className="h-6 w-20 bg-gray-200 mt-2" />
// </div>
// {/* Quantity Controls */}
// <div className="flex items-center gap-2">
// <Skeleton className="w-8 h-8 rounded-lg bg-gray-200" />
// <Skeleton className="w-8 h-8 bg-gray-200" />
// <Skeleton className="w-8 h-8 rounded-lg bg-gray-200" />
// </div>
// </div>
// </Card>
// )
// }

81
features/cart/components/OrderSummarySkeleton.tsx Normal file
View File

@@ -0,0 +1,81 @@
import { Card } from "@/components/ui/card";
import { Skeleton } from "@/components/ui/skeleton";
import { Separator } from "@/components/ui/separator";
export default function OrderSummarySkeleton() {
return (
<Card className="w-full md:w-[380px] p-4 md:p-6 rounded-xl h-fit sticky top-20">
{/* Customer Information */}
<div className="mb-6">
<Skeleton className="h-6 w-48 mb-3" />
<div className="space-y-4">
<div>
<Skeleton className="h-4 w-20 mb-2" />
<Skeleton className="h-10 w-full rounded-lg" />
</div>
<div>
<Skeleton className="h-4 w-24 mb-2" />
<Skeleton className="h-10 w-full rounded-lg" />
</div>
<div>
<Skeleton className="h-4 w-16 mb-2" />
<Skeleton className="h-10 w-full rounded-lg" />
</div>
</div>
</div>
{/* Payment Type */}
<div className="mb-6">
<Skeleton className="h-6 w-32 mb-3" />
<div className="flex gap-2">
<Skeleton className="flex-1 h-20 rounded-lg" />
<Skeleton className="flex-1 h-20 rounded-lg" />
</div>
</div>
{/* Region Selection */}
<div className="mb-6">
<Skeleton className="h-6 w-36 mb-3" />
<div className="flex flex-wrap gap-4">
{Array.from({ length: 4 }).map((_, i) => (
<div key={i} className="flex items-center gap-2">
<Skeleton className="h-4 w-4 rounded-full" />
<Skeleton className="h-4 w-16" />
</div>
))}
</div>
</div>
{/* Province Selection */}
<div className="mb-6">
<Skeleton className="h-6 w-40 mb-3" />
<Skeleton className="h-10 w-full rounded-lg" />
</div>
{/* Note */}
<div className="mb-6">
<Skeleton className="h-6 w-24 mb-3" />
<Skeleton className="h-24 w-full rounded-xl" />
</div>
{/* Billing */}
<div className="space-y-2 mb-4">
{Array.from({ length: 3 }).map((_, i) => (
<div key={i} className="flex justify-between">
<Skeleton className="h-5 w-24" />
<Skeleton className="h-5 w-20" />
</div>
))}
</div>
<Separator className="my-4" />
<div className="flex justify-between items-center mb-6">
<Skeleton className="h-6 w-32" />
<Skeleton className="h-6 w-28" />
</div>
<Skeleton className="h-12 w-full rounded-lg" />
</Card>
);
}