Merge branch 'master' of https://github.com/okbel/e-comm-example

pages/_app.tsx

@@ -5,10 +5,10 @@ import 'animate.css'
 import { FC } from 'react'
 import { DefaultSeo } from 'next-seo'
 import type { AppProps } from 'next/app'
-import { ThemeProvider } from 'next-themes'
-import { SSRProvider, OverlayProvider } from 'react-aria'
+
 import config from '../config.json'
 import Head from 'next/head'
+import { CommerceProvider } from '@lib/bigcommerce'
 
 const Noop: FC = ({ children }) => <>{children}</>
 
@@ -22,15 +22,11 @@ export default function MyApp({ Component, pageProps }: AppProps) {
         <link rel="manifest" href="/site.webmanifest" key="site-manifest" />
       </Head>
       <DefaultSeo {...config.seo} />
-      <ThemeProvider>
-        <SSRProvider>
-          <OverlayProvider>
-            <Layout pageProps={pageProps}>
-              <Component {...pageProps} />
-            </Layout>
-          </OverlayProvider>
-        </SSRProvider>
-      </ThemeProvider>
+      <CommerceProvider locale="en-us">
+        <Layout pageProps={pageProps}>
+          <Component {...pageProps} />
+        </Layout>
+      </CommerceProvider>
     </>
   )
 }

pages/cart.tsx

@@ -18,7 +18,7 @@ export default function Home({}: InferGetStaticPropsType<
 >) {
   return (
     <Container>
-      <h2 className="pt-1 pb-4 text-2xl leading-7 font-bold text-primary tracking-wide">
+      <h2 className="pt-1 pb-4 text-2xl leading-7 font-bold text-base tracking-wide">
         My Cart
       </h2>
     </Container>

pages/index.tsx

@@ -47,21 +47,21 @@ export default function Home({
       <div className="py-12 flex flex-row w-full px-12">
         <div className="pr-3 w-48">
           <ul className="mb-10">
-            <li className="py-1 text-primary font-bold tracking-wide">
+            <li className="py-1 text-base font-bold tracking-wide">
               All Categories
             </li>
             {categories.map((cat) => (
-              <li key={cat.path} className="py-1 text-default">
+              <li key={cat.path} className="py-1 text-accents-8">
                 <a href="#">{cat.name}</a>
               </li>
             ))}
           </ul>
           <ul className="">
-            <li className="py-1 text-primary font-bold tracking-wide">
+            <li className="py-1 text-base font-bold tracking-wide">
               All Designers
             </li>
             {brands.flatMap(({ node }) => (
-              <li key={node.path} className="py-1 text-default">
+              <li key={node.path} className="py-1 text-accents-8">
                 <a href="#">{node.name}</a>
               </li>
             ))}

pages/search.tsx

@@ -60,7 +60,7 @@ export default function Search({
       <div className="grid grid-cols-12 gap-8 mt-3 mb-20">
         <div className="col-span-2">
           <ul className="mb-10">
-            <li className="py-1 text-primary font-bold tracking-wide">
+            <li className="py-1 text-base font-bold tracking-wide">
               <Link href={{ pathname: getCategoryPath('', brand), query }}>
                 <a>All Categories</a>
               </Link>
@@ -68,7 +68,7 @@ export default function Search({
             {categories.map((cat) => (
               <li
                 key={cat.path}
-                className={cn('py-1 text-default', {
+                className={cn('py-1 text-accents-8', {
                   underline: activeCategory?.entityId === cat.entityId,
                 })}
               >
@@ -84,7 +84,7 @@ export default function Search({
             ))}
           </ul>
           <ul>
-            <li className="py-1 text-primary font-bold tracking-wide">
+            <li className="py-1 text-base font-bold tracking-wide">
               <Link href={{ pathname: getDesignerPath('', category), query }}>
                 <a>All Designers</a>
               </Link>
@@ -92,7 +92,7 @@ export default function Search({
             {brands.flatMap(({ node }) => (
               <li
                 key={node.path}
-                className={cn('py-1 text-default', {
+                className={cn('py-1 text-accents-8', {
                   underline: activeBrand?.entityId === node.entityId,
                 })}
               >
@@ -158,9 +158,9 @@ export default function Search({
         </div>
         <div className="col-span-2">
           <ul>
-            <li className="py-1 text-primary font-bold tracking-wide">Sort</li>
+            <li className="py-1 text-base font-bold tracking-wide">Sort</li>
             <li
-              className={cn('py-1 text-default', {
+              className={cn('py-1 text-accents-8', {
                 underline: !sort,
               })}
             >
@@ -171,7 +171,7 @@ export default function Search({
             {SORT.map(([key, text]) => (
               <li
                 key={key}
-                className={cn('py-1 text-default', {
+                className={cn('py-1 text-accents-8', {
                   underline: sort === key,
                 })}
               >

pages/wishlist.tsx

@@ -24,7 +24,7 @@ export default function Home({
       <div className="grid grid-cols-12 gap-8 mt-3 mb-20">
         <div className="col-span-2">
           <ul className="mb-10">
-            <li className="py-1 text-primary font-bold tracking-wide">
+            <li className="py-1 text-base font-bold tracking-wide">
               All Categories
             </li>
             {categories.map((cat) => (
@@ -35,7 +35,7 @@ export default function Home({
           </ul>
         </div>
         <div className="col-span-8">
-          <h2 className="pt-1 px-3 pb-4 text-2xl leading-7 font-bold text-primary tracking-wide">
+          <h2 className="pt-1 px-3 pb-4 text-2xl leading-7 font-bold text-base tracking-wide">
             My Wishlist
           </h2>
           <div className="group flex flex-col">
@@ -46,7 +46,7 @@ export default function Home({
         </div>
         <div className="col-span-2">
           <ul>
-            <li className="py-1 text-primary font-bold tracking-wide">
+            <li className="py-1 text-base font-bold tracking-wide">
               Relevance
             </li>
             <li className="py-1 text-secondary">Latest arrivals</li>