[wip] 🔥 Integrate Swell into the shop

Create a custom and internal API for fetching and updating content to Swell Admin API (using swell-node)

src/components/layouts/PosterLayout.svelte

@@ -4,8 +4,10 @@
     import Button from '$components/atoms/Button.svelte'
     import Image from '$components/atoms/Image.svelte'
     import Carousel from '$components/organisms/Carousel.svelte'
+import { cartData, cartId } from '$utils/store';
 
     export let product: any
+    export let productShop: any
 
 
     /**
@@ -51,6 +53,33 @@
             ratio: 0.68,
         },
     ]
+
+
+    /**
+     * Handling add to cart
+     */
+    const addToCart = async () => {
+        // const addedReturn = await swell.cart.addItem({
+        //     product_id: product.product_id,
+        //     quantity: 1,
+        // })
+
+        const addedReturn = await fetch('/api/swell', {
+            method: 'POST',
+            body: JSON.stringify({
+                action: 'addToCart',
+                cartId: $cartId,
+                productId: product.product_id,
+                quantity: 1,
+            })
+        })
+
+        if (addedReturn.ok) {
+            const newCart = await addedReturn.json()
+            $cartData = newCart
+            console.log('Show mini product added to cart')
+        }
+    }
 </script>
 
 <section class="poster-layout grid">
@@ -62,11 +91,12 @@
         <div class="poster-layout__info">
             <dl>
                 <dt>{capitalizeFirstLetter(product.type)}</dt>
-                <dd>{product.name} – 30€</dd>
+                <dd>{productShop.name} – {productShop.price}€</dd>
             </dl>
             <Button
                 text="Add to cart"
                 color="pinklight"
+                on:click={addToCart}
             />
         </div>