✨ Show a notification when adding a product to Cart

src/components/layouts/PosterLayout.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
     import { capitalizeFirstLetter } from '$utils/functions'
+    import { cartId, cartData } from '$utils/store'
+    import { addNotification } from '$utils/notifications'
     // Components
     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
@@ -59,12 +60,7 @@ import { cartData, cartId } from '$utils/store';
      * 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', {
+        const updatedCart = await fetch('/api/swell', {
             method: 'POST',
             body: JSON.stringify({
                 action: 'addToCart',
@@ -73,11 +69,16 @@ import { cartData, cartId } from '$utils/store';
                 quantity: 1,
             })
         })
-
-        if (addedReturn.ok) {
-            const newCart = await addedReturn.json()
+        if (updatedCart.ok) {
+            const newCart = await updatedCart.json()
             $cartData = newCart
-            console.log('Show mini product added to cart')
+
+            // Show notification
+            addNotification({
+                title: 'Added to cart',
+                name: `${productShop.name} - x1`,
+                image: productShop.images[0].file.url,
+            })
         }
     }
 </script>