fix: incorporated feedback comments and update the code

src/payment/PaymentPage.jsx

@@ -43,13 +43,25 @@ class PaymentPage extends React.Component {
   }
 
   componentDidMount() {
-    const sku = localStorage.getItem('sku');
+    const rawSkus = localStorage.getItem('skus');
+    const skus = JSON.parse(rawSkus);
 
     // Check if SKU is not null
-    if (sku !== null) {
-      const paymentPage = `${getConfig().ECOMMERCE_BASE_URL}/basket/add/?sku=${sku}`;
+    if (skus !== null) {
+      const baseURL = getConfig().ECOMMERCE_BASE_URL;
+
+      // Constructing the URL with the sku parameters
+      let paymentPage = `${baseURL}/basket/add/?`;
+      // Appending each sku value to the URL
+      Object.values(skus).forEach(sku => { paymentPage += `sku=${sku}&`; });
+      // for (const sku of skus) {
+      //   paymentPage += `sku=${sku}&`;
+      // }
+      // Removing the extra '&' character at the end
+      paymentPage = paymentPage.slice(0, -1);
+      // const paymentPage = `${getConfig().ECOMMERCE_BASE_URL}/basket/add/?sku=${sku}`;
       window.location.href = paymentPage;
-      localStorage.removeItem('sku');
+      localStorage.removeItem('skus');
     } else {
       this.props.fetchBasket();
       sendPageEvent();

src/payment/checkout/Checkout.jsx

@@ -47,6 +47,14 @@ class Checkout extends React.Component {
     );
 
     this.props.submitPayment({ method: 'paypal' });
+
+    const { products } = this.props;
+    const skus = [];
+
+    for (const product of products){
+      skus.push(product.sku)
+    }
+    localStorage.setItem('skus', JSON.stringify(skus));
   };
 
   // eslint-disable-next-line react/no-unused-class-component-methods

src/payment/data/reducers.js

@@ -36,9 +36,6 @@ const basket = (state = basketInitialState, action = null) => {
       };
 
       case BASKET_DATA_RECEIVED:
-        if (action.payload.products && action.payload.products.length > 0) {
-          localStorage.setItem('sku', action.payload.products[0].sku);
-        }
         return { ...state, ...action.payload };
 
       case BASKET_PROCESSING: return {