fix(core): CATALYST-1579 Replace checkout redirect server action with /checkout route

core/app/[locale]/(default)/cart/page.tsx

@@ -8,7 +8,6 @@ import { getCartId } from '~/lib/cart';
 import { getPreferredCurrencyCode } from '~/lib/currency';
 import { exists } from '~/lib/utils';
 
-import { redirectToCheckout } from './_actions/redirect-to-checkout';
 import { updateCouponCode } from './_actions/update-coupon-code';
 import { updateGiftCertificate } from './_actions/update-gift-certificate';
 import { updateLineItem } from './_actions/update-line-item';
@@ -251,7 +250,7 @@ export default async function Cart({ params }: Props) {
               },
             ].filter(exists),
           }}
-          checkoutAction={redirectToCheckout}
+          checkoutAction="/checkout"
           checkoutLabel={t('proceedToCheckout')}
           couponCode={{
             action: updateCouponCode,

core/app/[locale]/(default)/checkout/route.ts

@@ -1,6 +1,7 @@
 import { BigCommerceAuthError } from '@bigcommerce/catalyst-client';
 import { unstable_rethrow as rethrow } from 'next/navigation';
 import { NextRequest, NextResponse } from 'next/server';
+import { getTranslations } from 'next-intl/server';
 
 import { getSessionCustomerAccessToken } from '~/auth';
 import { getChannelIdFromLocale } from '~/channels.config';
@@ -10,6 +11,7 @@ import { redirect } from '~/i18n/routing';
 import { getVisitIdCookie, getVisitorIdCookie } from '~/lib/analytics/bigcommerce';
 import { getCartId } from '~/lib/cart';
 import { getConsentCookie } from '~/lib/consent-manager/cookies/server';
+import { serverToast } from '~/lib/server-toast';
 
 const CheckoutRedirectMutation = graphql(`
   mutation CheckoutRedirectMutation(
@@ -55,8 +57,11 @@ export async function GET(req: NextRequest, { params }: { params: Promise<{ loca
   const cartId = req.nextUrl.searchParams.get('cartId') ?? (await getCartId());
   const customerAccessToken = await getSessionCustomerAccessToken();
   const channelId = getChannelIdFromLocale(locale);
+  const t = await getTranslations('Cart.Errors');
 
   if (!cartId) {
+    await serverToast.error(t('cartNotFound'));
+
     return redirect({ href: '/cart', locale });
   }
 
@@ -86,6 +91,8 @@ export async function GET(req: NextRequest, { params }: { params: Promise<{ loca
       data.cart.createCartRedirectUrls.errors.length > 0 ||
       !data.cart.createCartRedirectUrls.redirectUrls
     ) {
+      await serverToast.error(t('somethingWentWrong'));
+
       return redirect({ href: '/cart', locale });
     }
 

core/lib/server-toast.ts

@@ -35,7 +35,7 @@ async function setToastCookie(data: ServerToastData) {
     sameSite: 'strict',
     path: '/',
     partitioned: true,
-    maxAge: 0,
+    maxAge: 1,
   });
 }
 

core/messages/en.json

@@ -307,7 +307,7 @@
         "couponCode": "Coupon code",
         "removeCouponCode": "Remove coupon code",
         "invalidCouponCode": "Please enter a valid coupon code",
-        "cartNotFound": "No cartId cookie found."
+        "cartNotFound": "An error occurred when retrieving your cart"
       },
       "Shipping": {
         "shipping": "Shipping",
@@ -324,7 +324,7 @@
         "shippingOptions": "Shipping options",
         "updateShipping": "Update shipping",
         "addShipping": "Add shipping",
-        "cartNotFound": "No cartId cookie found.",
+        "cartNotFound": "An error occurred when retrieving your cart",
         "noShippingOptions": "There are no shipping options available for your address"
       }
     },
@@ -336,15 +336,15 @@
       "to": "To",
       "message": "Message",
       "invalidGiftCertificate": "Please enter a valid gift certificate code",
-      "cartNotFound": "No cartId cookie found."
+      "cartNotFound": "An error occurred when retrieving your cart"
     },
     "Empty": {
       "title": "Your cart is empty.",
       "subtitle": "Add some products to get started.",
       "cta": "Continue shopping"
     },
     "Errors": {
-      "cartNotFound": "No cartId cookie found.",
+      "cartNotFound": "An error occurred when retrieving your cart",
       "lineItemNotFound": "Line item not found.",
       "failedToUpdateQuantity": "Failed to update quantity.",
       "somethingWentWrong": "Something went wrong. Please try again later."

core/vibes/soul/sections/cart/client.tsx

@@ -149,7 +149,7 @@ export interface CartProps<LineItem extends CartLineItem> {
   summaryTitle?: string;
   emptyState?: CartEmptyState;
   lineItemAction: Action<CartState<LineItem>, FormData>;
-  checkoutAction: Action<SubmissionResult | null, FormData>;
+  checkoutAction: Action<SubmissionResult | null, FormData> | string;
   checkoutLabel?: string;
   deleteLineItemLabel?: string;
   decrementLineItemLabel?: string;
@@ -628,10 +628,19 @@ function CheckoutButton({
   isCartUpdatePending,
   ...props
 }: {
-  action: Action<SubmissionResult | null, FormData>;
+  action: Action<SubmissionResult | null, FormData> | string;
   isCartUpdatePending: boolean;
 } & ComponentPropsWithoutRef<typeof Button>) {
-  const [lastResult, formAction] = useActionState(action, null);
+  const [lastResult, formAction] = useActionState(
+    async (state: SubmissionResult | null, formData: FormData) => {
+      if (typeof action !== 'function') {
+        return null;
+      }
+
+      return action(state, formData);
+    },
+    null,
+  );
 
   const [form] = useForm({ lastResult });
 
@@ -644,7 +653,7 @@ function CheckoutButton({
   }, [form.errors]);
 
   return (
-    <form action={formAction}>
+    <form action={typeof action === 'string' ? action : formAction}>
       <SubmitButton {...props} isCartUpdatePending={isCartUpdatePending} />
     </form>
   );