This commit is contained in:
Samandar Turgunboyev
2026-03-04 15:54:00 +05:00
parent 3fcbf22b70
commit f04ae13c39
2 changed files with 78 additions and 57 deletions

View File

@@ -146,12 +146,6 @@ const CartPage = () => {
});
};
const price = cartItems?.map((item) =>
item.product.prices.find((p) => p.price_type.code === '1')
? item.product.prices.find((p) => p.price_type.code === '1')?.price
: Math.min(...item.product.prices.map((p) => Number(p.price))),
);
if (isLoading)
return (
<div className="min-h-screen flex items-center justify-center">
@@ -254,7 +248,25 @@ const CartPage = () => {
<div className="flex items-center gap-2 mb-3">
<span className="text-blue-600 font-bold text-xl">
{formatPrice(Number(price), true)}
{item.product.prices.find(
(p) => p.price_type.code === '1',
)
? formatPrice(
Number(
item.product.prices.find(
(p) => p.price_type.code === '1',
)?.price,
),
true,
)
: formatPrice(
Math.min(
...item.product.prices.map((p) =>
Number(p.price),
),
),
true,
)}
</span>
<span className="text-sm text-gray-500">
/{measurementDisplay}

View File

@@ -23,10 +23,14 @@ const ProductDetail = () => {
const queryClient = useQueryClient();
const { cart_id } = useCartId();
/** ✅ number | string */
const [quantity, setQuantity] = useState<number | string>(1);
// ✅ debounce ref
const debounceRef = useRef<NodeJS.Timeout | null>(null);
// ✅ Flag: faqat manual input (klaviatura) da debounce ishlaydi
const isManualInputRef = useRef(false);
/* ---------------- PRODUCT DETAIL ---------------- */
const { data, isLoading } = useQuery({
queryKey: ['product_detail', product],
@@ -42,8 +46,6 @@ const ProductDetail = () => {
enabled: !!cart_id,
});
const maxBalance = data?.balance ?? 0;
const measurement = data?.meansurement?.name?.toLowerCase() || '';
const isGram = measurement === 'gr';
@@ -52,7 +54,7 @@ const ProductDetail = () => {
const measurementDisplay = data?.meansurement?.name || 'шт.';
/** Safe numeric */
/** Safe numeric value */
const numericQty =
quantity === '' || quantity === '.' || quantity === ','
? 0
@@ -60,8 +62,12 @@ const ProductDetail = () => {
/* ---------------- HELPERS ---------------- */
const clampQuantity = (value: number) => {
if (!maxBalance) return value;
return Math.min(value, maxBalance);
if (isNaN(value)) return MIN_QTY;
let safe = Math.max(value, MIN_QTY);
safe = Math.min(safe);
return safe;
};
const getQuantityMessage = (qty: number, measurement: string | null) => {
@@ -69,7 +75,7 @@ const ProductDetail = () => {
return `${qty} ${measurement}`;
};
/* ---------------- SYNC CART ---------------- */
/* ---------------- SYNC CART (boshlang'ich holat) ---------------- */
useEffect(() => {
if (!data || !cartItems) return;
@@ -82,35 +88,11 @@ const ProductDetail = () => {
} else {
setQuantity(MIN_QTY);
}
// isManualInputRef ni reset qilish shart - bu sync, manual input emas
isManualInputRef.current = false;
}, [data, cartItems, MIN_QTY]);
/* ---------------- DEBOUNCE UPDATE ---------------- */
useEffect(() => {
if (!cart_id || !data || !cartItems) return;
const cartItem = cartItems.data.cart_item.find(
(i) => Number(i.product.id) === data.id,
);
if (!cartItem || cartItem.quantity === numericQty) return;
if (debounceRef.current) clearTimeout(debounceRef.current);
debounceRef.current = setTimeout(() => {
if (numericQty > 0) {
updateCartItem({
cart_item_id: cartItem.id.toString(),
body: { quantity: numericQty },
});
}
}, 500);
return () => {
if (debounceRef.current) clearTimeout(debounceRef.current);
};
}, [numericQty]);
/* ---------------- ADD ---------------- */
/* ---------------- MUTATIONS ---------------- */
const { mutate: addToCart } = useMutation({
mutationFn: (body: { product: string; quantity: number; cart: string }) =>
cart_api.cart_item(body),
@@ -121,10 +103,7 @@ const ProductDetail = () => {
const measurementName = data?.meansurement?.name || null;
toast.success(
`${getQuantityMessage(
variables.quantity,
measurementName,
)} ${t("savatga qo'shildi")}`,
`${getQuantityMessage(variables.quantity, measurementName)} ${t("savatga qo'shildi")}`,
{ richColors: true, position: 'top-center' },
);
},
@@ -132,7 +111,6 @@ const ProductDetail = () => {
onError: (err: AxiosError) => {
const msg =
(err.response?.data as { detail: string })?.detail || err.message;
toast.error(msg, { richColors: true });
},
});
@@ -149,17 +127,47 @@ const ProductDetail = () => {
const measurementName = data?.meansurement?.name || null;
toast.success(
`${t('Miqdor')} ${getQuantityMessage(
variables.body.quantity,
measurementName,
)} ${t('ga yangilandi')}`,
`${t('Miqdor')} ${getQuantityMessage(variables.body.quantity, measurementName)} ${t('ga yangilandi')}`,
{ richColors: true, position: 'top-center' },
);
},
});
/* ---------------- DEBOUNCE UPDATE (faqat manual input uchun) ---------------- */
useEffect(() => {
// ✅ Faqat klaviatura orqali yozilganda ishlaydi
if (!isManualInputRef.current) return;
if (!cart_id || !data || !cartItems) return;
const cartItem = cartItems.data.cart_item.find(
(i) => Number(i.product.id) === data.id,
);
if (!cartItem || cartItem.quantity === numericQty) return;
if (debounceRef.current) clearTimeout(debounceRef.current);
debounceRef.current = setTimeout(() => {
if (numericQty >= MIN_QTY) {
updateCartItem({
cart_item_id: cartItem.id.toString(),
body: { quantity: numericQty },
});
}
isManualInputRef.current = false;
}, 500);
return () => {
if (debounceRef.current) clearTimeout(debounceRef.current);
};
}, [numericQty]);
/* ---------------- HANDLERS ---------------- */
const handleAddToCart = () => {
// ✅ Debounce-ni bekor qil - double request oldini olish
if (debounceRef.current) clearTimeout(debounceRef.current);
isManualInputRef.current = false;
if (!data || !cart_id) {
toast.error(t('Tizimga kirilmagan'), {
richColors: true,
@@ -186,28 +194,29 @@ const ProductDetail = () => {
quantity: normalizedQty,
});
}
setQuantity(normalizedQty);
};
const handleIncrease = () => {
// ✅ Bu manual input emas - flag ni false qoldirish
isManualInputRef.current = false;
setQuantity((q) => {
const base = q === '' || q === '.' || q === ',' ? 0 : Number(q);
let next = base + STEP;
if (isGram) next = Math.ceil(next / STEP) * STEP;
return next;
});
};
const handleDecrease = () => {
// ✅ Bu manual input emas - flag ni false qoldirish
isManualInputRef.current = false;
setQuantity((q) => {
const base = q === '' || q === '.' || q === ',' ? MIN_QTY : Number(q);
let next = base - STEP;
if (isGram) next = Math.floor(next / STEP) * STEP;
return Math.max(next, MIN_QTY);
});
};
@@ -257,7 +266,6 @@ const ProductDetail = () => {
<span className="text-xl text-gray-500">/{measurementDisplay}</span>
</div>
{/* ✅ INPUT FIXED */}
<div className="mb-6">
<label className="block text-sm font-medium mb-2">
{t('Miqdor')}
@@ -278,9 +286,10 @@ const ProductDetail = () => {
onChange={(e) => {
const v = e.target.value;
/** ✅ allow 0 + decimal + comma */
if (!/^\d*([.,]\d*)?$/.test(v)) return;
// ✅ Faqat shu yerda manual input flag yoqiladi
isManualInputRef.current = true;
setQuantity(v);
}}
className="w-24 text-center"