feat(MED-97): update cart flow for using benefits

This commit is contained in:
2025-09-26 13:24:09 +03:00
parent 56f84a003c
commit db38e602aa
15 changed files with 419 additions and 81 deletions

View File

@@ -2,9 +2,7 @@
import { useState } from 'react';
import { handleNavigateToPayment } from '@/lib/services/medusaCart.service';
import { formatCurrency } from '@/packages/shared/src/utils';
import { initiatePaymentSession } from '@lib/data/cart';
import { StoreCart, StoreCartLineItem } from '@medusajs/types';
import { Loader2 } from 'lucide-react';
import { useTranslation } from 'react-i18next';
@@ -16,27 +14,35 @@ import { Trans } from '@kit/ui/trans';
import AnalysisLocation from './analysis-location';
import CartItems from './cart-items';
import DiscountCode from './discount-code';
import { initiatePayment } from '../../_lib/server/cart-actions';
import { useRouter } from 'next/navigation';
import { AccountBalanceSummary } from '@kit/accounts/services/account-balance.service';
const IS_DISCOUNT_SHOWN = true as boolean;
export default function Cart({
accountId,
cart,
synlabAnalyses,
ttoServiceItems,
balanceSummary,
}: {
accountId: string;
cart: StoreCart | null;
synlabAnalyses: StoreCartLineItem[];
ttoServiceItems: StoreCartLineItem[];
balanceSummary: AccountBalanceSummary | null;
}) {
const {
i18n: { language },
} = useTranslation();
const [isInitiatingSession, setIsInitiatingSession] = useState(false);
const router = useRouter();
const items = cart?.items ?? [];
const hasCartItems = cart && Array.isArray(items) && items.length > 0;
if (!cart || items.length === 0) {
if (!hasCartItems) {
return (
<div className="content-container py-5 lg:px-4">
<div>
@@ -56,24 +62,35 @@ export default function Cart({
);
}
async function initiatePayment() {
async function initiateSession() {
setIsInitiatingSession(true);
const response = await initiatePaymentSession(cart!, {
provider_id: 'pp_montonio_montonio',
});
if (response.payment_collection) {
const { payment_sessions } = response.payment_collection;
const paymentSessionId = payment_sessions![0]!.id;
const url = await handleNavigateToPayment({ language, paymentSessionId });
window.location.href = url;
} else {
try {
const { url, isFullyPaidByBenefits, orderId } = await initiatePayment({
accountId,
balanceSummary: balanceSummary!,
cart: cart!,
language,
});
if (url) {
window.location.href = url;
} else if (isFullyPaidByBenefits) {
if (typeof orderId !== 'number') {
throw new Error('Order ID is missing');
}
router.push(`/home/order/${orderId}/confirmed`);
}
} catch (error) {
console.error('Failed to initiate payment', error);
setIsInitiatingSession(false);
}
}
const hasCartItems = Array.isArray(cart.items) && cart.items.length > 0;
const isLocationsShown = synlabAnalyses.length > 0;
const companyBenefitsTotal = balanceSummary?.totalBalance ?? 0;
const montonioTotal = cart && companyBenefitsTotal > 0 ? cart.total - companyBenefitsTotal : cart.total;
return (
<div className="small:grid-cols-[1fr_360px] grid grid-cols-1 gap-x-40 lg:px-4">
<div className="flex flex-col gap-y-6 bg-white">
@@ -106,7 +123,7 @@ export default function Cart({
</p>
</div>
</div>
<div className="flex gap-x-4 px-4 py-2 sm:justify-end sm:px-6 sm:py-4">
<div className="flex gap-x-4 px-4 pt-2 sm:justify-end sm:px-6 sm:pt-4">
<div className="w-full sm:mr-[42px] sm:w-auto">
<p className="text-muted-foreground ml-0 text-sm font-bold">
<Trans i18nKey="cart:order.promotionsTotal" />
@@ -122,6 +139,24 @@ export default function Cart({
</p>
</div>
</div>
{companyBenefitsTotal > 0 && (
<div className="flex gap-x-4 px-4 py-2 sm:justify-end sm:px-6 sm:py-4">
<div className="w-full sm:mr-[42px] sm:w-auto">
<p className="text-muted-foreground ml-0 text-sm font-bold">
<Trans i18nKey="cart:order.companyBenefitsTotal" />
</p>
</div>
<div className={`sm:mr-[112px] sm:w-[50px]`}>
<p className="text-right text-sm">
{formatCurrency({
value: (companyBenefitsTotal > cart.total ? cart.total : companyBenefitsTotal),
currencyCode: cart.currency_code,
locale: language,
})}
</p>
</div>
</div>
)}
<div className="flex gap-x-4 px-4 sm:justify-end sm:px-6">
<div className="w-full sm:mr-[42px] sm:w-auto">
<p className="ml-0 text-sm font-bold">
@@ -131,7 +166,7 @@ export default function Cart({
<div className={`sm:mr-[112px] sm:w-[50px]`}>
<p className="text-right text-sm">
{formatCurrency({
value: cart.total,
value: montonioTotal < 0 ? 0 : montonioTotal,
currencyCode: cart.currency_code,
locale: language,
})}
@@ -175,7 +210,7 @@ export default function Cart({
<div>
<Button
className="h-10"
onClick={initiatePayment}
onClick={initiateSession}
disabled={isInitiatingSession}
>
{isInitiatingSession && (