add whishlist heart

components/product/ProductView/ProductView.module.css

@@ -68,3 +68,7 @@
   min-width: 300px;
   text-align: center;
 }
+
+.wishlistButton {
+  @apply absolute right-12 text-white w-10 h-10 flex items-center justify-center bg-violet font-semibold leading-6 cursor-pointer;
+}

components/product/ProductView/ProductView.tsx

@@ -9,6 +9,8 @@ import useAddItem from '@lib/bigcommerce/cart/use-add-item'
 import { isDesktop } from '@lib/browser'
 import type { ProductNode } from '@lib/bigcommerce/api/operations/get-product'
 import { getProductOptions } from '../helpers'
+import { Heart } from '@components/icon'
+
 interface Props {
   className?: string
   children?: any
@@ -137,6 +139,9 @@ const ProductView: FC<Props> = ({ product, className }) => {
             </div>
           </section>
         </div>
+        <div className={s.wishlistButton}>
+          <Heart />
+        </div>
       </div>
     </Container>
   )