✨ Show a notification when adding a product to Cart

src/components/molecules/NotificationCart.svelte

@@ -1,19 +1,28 @@
 <script lang="ts">
-    import { getContext } from 'svelte'
-    // Components
-    import Button from '$components/atoms/Button.svelte'
-    import Image from '$components/atoms/Image.svelte'
+    import { fly } from 'svelte/transition'
+    import { quartOut } from 'svelte/easing'
+    import { cartOpen } from '$utils/store'
 
-    const { locations, shop } = getContext('global')
+    export let title: string
+    export let name: string
+    export let image: string
 
+
+    const closeNotification = () => {
+        // Open cart
+        $cartOpen = true
+    }
 </script>
 
-<aside class="notification-cart shadow-small">
+<div class="notification-cart shadow-small"
+    on:click={closeNotification}
+    transition:fly={{ y: 20, duration: 700, easing: quartOut }}
+>
     <div class="notification-cart__left">
-        <img src="/images/issue-1.jpg" width={58} height={88} alt="">
+        <img src={image} width={58} height={88} alt={title}>
     </div>
     <div class="notification-cart__right">
-        <h3>Added to cart</h3>
-        <p>Houses Of Melbourne</p>
+        <h3>{title}</h3>
+        <p>{name}</p>
     </div>
-</aside>
+</div>