From de64b6d99119362730f8f8d391a5e0cf1702a822 Mon Sep 17 00:00:00 2001
From: okbel <curciobel@gmail.com>
Date: Fri, 12 Feb 2021 17:10:17 -0300
Subject: [PATCH] New changes and initial Features API

---
 components/common/UserNav/UserNav.tsx          | 18 +++++++++++-------
 components/product/ProductCard/ProductCard.tsx | 10 +++++++---
 .../wishlist/WishlistButton/WishlistButton.tsx |  2 +-
 components/wishlist/WishlistButton/index.ts    |  1 +
 components/wishlist/index.ts                   |  1 +
 pages/index.tsx                                |  2 +-
 pages/orders.tsx                               |  6 +++---
 tsconfig.json                                  |  4 ++--
 yarn.lock                                      |  6 +++---
 9 files changed, 30 insertions(+), 20 deletions(-)
 create mode 100644 components/wishlist/WishlistButton/index.ts

diff --git a/components/common/UserNav/UserNav.tsx b/components/common/UserNav/UserNav.tsx
index c615c18b1..19151c38b 100644
--- a/components/common/UserNav/UserNav.tsx
+++ b/components/common/UserNav/UserNav.tsx
@@ -9,6 +9,7 @@ import { useUI } from '@components/ui/context'
 import DropdownMenu from './DropdownMenu'
 import s from './UserNav.module.css'
 import { Avatar } from '@components/common'
+import frameworkConfig from '@framework/config.json'
 
 interface Props {
   className?: string
@@ -21,6 +22,7 @@ const UserNav: FC<Props> = ({ className }) => {
   const { data: customer } = useCustomer()
   const { toggleSidebar, closeSidebarIfPresent, openModal } = useUI()
   const itemsCount = data?.lineItems.reduce(countItem, 0) ?? 0
+  const isWishlistEnabled = !!frameworkConfig.features.wishlist
 
   return (
     <nav className={cn(s.root, className)}>
@@ -30,13 +32,15 @@ const UserNav: FC<Props> = ({ className }) => {
             <Bag />
             {itemsCount > 0 && <span className={s.bagCount}>{itemsCount}</span>}
           </li>
-          <li className={s.item}>
-            <Link href="/wishlist">
-              <a onClick={closeSidebarIfPresent} aria-label="Wishlist">
-                <Heart />
-              </a>
-            </Link>
-          </li>
+          {isWishlistEnabled && (
+            <li className={s.item}>
+              <Link href="/wishlist">
+                <a onClick={closeSidebarIfPresent} aria-label="Wishlist">
+                  <Heart />
+                </a>
+              </Link>
+            </li>
+          )}
           <li className={s.item}>
             {customer ? (
               <DropdownMenu />
diff --git a/components/product/ProductCard/ProductCard.tsx b/components/product/ProductCard/ProductCard.tsx
index 464f097e8..66233df79 100644
--- a/components/product/ProductCard/ProductCard.tsx
+++ b/components/product/ProductCard/ProductCard.tsx
@@ -3,7 +3,9 @@ import cn from 'classnames'
 import Link from 'next/link'
 import s from './ProductCard.module.css'
 import Image, { ImageProps } from 'next/image'
-// import WishlistButton from '@components/wishlist/WishlistButton'
+import frameworkConfig from '@framework/config.json'
+const isWishlistEnabled = !!frameworkConfig.features.wishlist
+import WishlistButton from '@components/wishlist/WishlistButton'
 
 interface Props {
   className?: string
@@ -56,11 +58,13 @@ const ProductCard: FC<Props> = ({
                 {product.price.currencyCode}
               </span>
             </div>
-            {/* <WishlistButton
+            {isWishlistEnabled && (
+              <WishlistButton
                 className={s.wishlistButton}
                 productId={product.id}
                 variant={product.variants[0]}
-              /> */}
+              />
+            )}
           </div>
           <div className={s.imageContainer}>
             {product?.images && (
diff --git a/components/wishlist/WishlistButton/WishlistButton.tsx b/components/wishlist/WishlistButton/WishlistButton.tsx
index dced18a89..f7e478293 100644
--- a/components/wishlist/WishlistButton/WishlistButton.tsx
+++ b/components/wishlist/WishlistButton/WishlistButton.tsx
@@ -7,7 +7,7 @@ import useCustomer from '@framework/customer/use-customer'
 import useAddItem from '@framework/wishlist/use-add-item'
 import useRemoveItem from '@framework/wishlist/use-remove-item'
 import useWishlist from '@framework/wishlist/use-add-item'
-
+import type { Product } from '@framework/types'
 type Props = {
   productId: Product['id']
   variant: ProductVariant
diff --git a/components/wishlist/WishlistButton/index.ts b/components/wishlist/WishlistButton/index.ts
new file mode 100644
index 000000000..66e88074b
--- /dev/null
+++ b/components/wishlist/WishlistButton/index.ts
@@ -0,0 +1 @@
+export { default } from './WishlistButton'
diff --git a/components/wishlist/index.ts b/components/wishlist/index.ts
index 470e6682c..8aee9f816 100644
--- a/components/wishlist/index.ts
+++ b/components/wishlist/index.ts
@@ -1 +1,2 @@
 export { default as WishlistCard } from './WishlistCard'
+export { default as WishlistButton } from './WishlistButton'
diff --git a/pages/index.tsx b/pages/index.tsx
index 811472674..3a84112e5 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -1,7 +1,7 @@
 import { Layout } from '@components/common'
 import { Grid, Marquee, Hero } from '@components/ui'
 import { ProductCard } from '@components/product'
-import HomeAllProductsGrid from '@components/common/HomeAllProductsGrid'
+// import HomeAllProductsGrid from '@components/common/HomeAllProductsGrid'
 import type { GetStaticPropsContext, InferGetStaticPropsType } from 'next'
 
 import { getConfig } from '@framework/api'
diff --git a/pages/orders.tsx b/pages/orders.tsx
index 08e32c2b2..db4ab55b2 100644
--- a/pages/orders.tsx
+++ b/pages/orders.tsx
@@ -1,9 +1,9 @@
 import type { GetStaticPropsContext } from 'next'
-import { getConfig } from '@framework/api'
-import getAllPages from '@framework/common/get-all-pages'
+import { Bag } from '@components/icons'
 import { Layout } from '@components/common'
 import { Container, Text } from '@components/ui'
-import { Bag } from '@components/icons'
+import { getConfig } from '@framework/api'
+import getAllPages from '@framework/common/get-all-pages'
 
 export async function getStaticProps({
   preview,
diff --git a/tsconfig.json b/tsconfig.json
index 67de1ee36..43dfd2a27 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -26,6 +26,6 @@
       "@framework": ["framework/bigcommerce"]
     }
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "**/*.js"],
-  "exclude": ["node_modules", "components/wishlist"]
+  "include": ["next-env.d.ts", "**/*.d.ts", "**/*.ts", "**/*.tsx", "**/*.js"],
+  "exclude": ["node_modules"]
 }
diff --git a/yarn.lock b/yarn.lock
index b46f7acce..c23252b2b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2135,9 +2135,9 @@ camelcase@^6.0.0:
   integrity sha512-c7wVvbw3f37nuobQNtgsgG9POC9qMbNuMQmTCqZv23b6MIz0fcYpBiOlv9gEN/hdLdnZTDQhg6e9Dq5M1vKvfg==
 
 caniuse-lite@^1.0.30000981, caniuse-lite@^1.0.30001093, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001113, caniuse-lite@^1.0.30001154, caniuse-lite@^1.0.30001173:
-  version "1.0.30001174"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001174.tgz#0f2aca2153fd88ceb07a2bb982fc2acb787623c4"
-  integrity sha512-tqClL/4ThQq6cfFXH3oJL4rifFBeM6gTkphjao5kgwMaW9yn0tKgQLAEfKzDwj6HQWCB/aWo8kTFlSvIN8geEA==
+  version "1.0.30001187"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001187.tgz"
+  integrity sha512-w7/EP1JRZ9552CyrThUnay2RkZ1DXxKe/Q2swTC4+LElLh9RRYrL1Z+27LlakB8kzY0fSmHw9mc7XYDUKAKWMA==
 
 caseless@~0.12.0:
   version "0.12.0"