@treely/strapi-slices 5.4.0 → 5.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@treely/strapi-slices",
-  "version": "5.4.0",
+  "version": "5.5.0",
   "license": "MIT",
   "author": "Tree.ly GmbH",
   "description": "@treely/strapi-slices is a open source library maintained by Tree.ly.",

package/src/components/portfolio/SmallCheckout/SmallCheckout.test.tsx

@@ -80,7 +80,7 @@ describe('The SmallCheckout component', () => {
 
     await waitFor(() => {
       expect(pushSpy).toHaveBeenCalledWith(
-        'https://api.fpm.t-staging.com/v1/webhooks/shop/checkout?batchId=batchId&quantity=2000'
+        'https://api.fpm.t-staging.com/v1/webhooks/shop/checkout?batchId=batchId&quantity=2000&cancelPath=%2F'
       );
     });
   });
@@ -106,7 +106,7 @@ describe('The SmallCheckout component', () => {
 
     await waitFor(() => {
       expect(pushSpy).toHaveBeenCalledWith(
-        'https://api.fpm.t-staging.com/v1/webhooks/shop/checkout?batchId=batchId&quantity=3000'
+        'https://api.fpm.t-staging.com/v1/webhooks/shop/checkout?batchId=batchId&quantity=3000&cancelPath=%2F'
       );
     });
   });

package/src/components/portfolio/SmallCheckout/SmallCheckout.tsx

@@ -56,7 +56,7 @@ const SmallCheckout = ({
   button,
 }: SmallCheckoutProps) => {
   const { formatNumber, formatMessage, locale } = useContext(IntlContext);
-  const { push } = useRouter();
+  const { asPath, push } = useRouter();
 
   const validateForm = useCallback(
     (values: SmallCheckoutForm) => {
@@ -85,13 +85,21 @@ const SmallCheckout = ({
     [locale]
   );
 
-  const onSubmit = async ({ contributionValueCurrency }: SmallCheckoutForm) =>
-    push(
-      `${FPM_API_URI}/v1/webhooks/shop/checkout?batchId=${batchId}&quantity=${Math.floor(
-        contributionValueCurrency / pricePerKg
-      )}`
+  const onSubmit = async ({ contributionValueCurrency }: SmallCheckoutForm) => {
+    const url = new URL(`${FPM_API_URI}/v1/webhooks/shop/checkout`);
+
+    url.searchParams.append('batchId', batchId);
+
+    url.searchParams.append(
+      'quantity',
+      Math.floor(contributionValueCurrency / pricePerKg).toString()
     );
 
+    url.searchParams.append('cancelPath', asPath);
+
+    push(url.toString());
+  };
+
   return (
     <Flex
       width="full"

package/src/slices/ShopCheckout/ShopCheckout.test.tsx

@@ -58,7 +58,7 @@ describe('The ShowCheckout section', () => {
 
     await waitFor(() => {
       expect(pushSpy).toHaveBeenCalledWith(
-        'https://api.fpm.t-staging.com/v1/webhooks/shop/checkout?batchId=batchId&quantity=1000'
+        'https://api.fpm.t-staging.com/v1/webhooks/shop/checkout?batchId=batchId&quantity=1000&cancelPath=%2F'
       );
     });
   });
@@ -72,7 +72,7 @@ describe('The ShowCheckout section', () => {
 
     await waitFor(() => {
       expect(pushSpy).toHaveBeenCalledWith(
-        'https://api.fpm.t-staging.com/v1/webhooks/shop/checkout?batchId=batchId&quantity=1000&couponId=coupon-id'
+        'https://api.fpm.t-staging.com/v1/webhooks/shop/checkout?batchId=batchId&quantity=1000&cancelPath=%2F&couponId=coupon-id'
       );
     });
   });

package/src/slices/ShopCheckout/ShopCheckout.tsx

@@ -18,7 +18,6 @@ import {
   Wrapper,
 } from 'boemly';
 import { Field, FieldProps, Form, Formik, FormikProps } from 'formik';
-import { useRouter } from 'next/router';
 import { FPM_API_URI } from '../../constants/api';
 import CheckoutForm from '../../models/forms/CheckoutForm';
 import {
@@ -26,6 +25,7 @@ import {
   MINIMUM_CONTRIBUTION_VALUE_IN_MONEY,
 } from '../../constants/domain';
 import { IntlContext } from '../../components/ContextProvider';
+import { useRouter } from 'next/router';
 
 export interface ShopCheckoutProps {
   slice: {
@@ -45,7 +45,7 @@ export interface ShopCheckoutProps {
 export const ShopCheckout = ({ slice }: ShopCheckoutProps): JSX.Element => {
   const [primary50] = useToken('colors', ['primary.50']);
   const { formatMessage, formatNumber, locale } = useContext(IntlContext);
-  const { push } = useRouter();
+  const { asPath, push } = useRouter();
 
   const validateForm = useCallback(
     (values: CheckoutForm) => {
@@ -84,6 +84,8 @@ export const ShopCheckout = ({ slice }: ShopCheckoutProps): JSX.Element => {
       Math.floor(contributionValue / slice.pricePerKg).toString()
     );
 
+    url.searchParams.append('cancelPath', asPath);
+
     if (slice.couponId) url.searchParams.append('couponId', slice.couponId);
 
     push(url.toString());