Added i18n configs

components/core/Layout/Layout.tsx

@@ -21,6 +21,7 @@ const Layout: FC<Props> = ({ children, pageProps }) => {
   const [hasScrolled, setHasScrolled] = useState(false)
 
   // TODO: Update code, add throttle and more.
+  // TODO: Make sure to not do any unnecessary updates as it's doing right now
   useEffect(() => {
     const offset = 0
     function handleScroll() {

next.config.js

@@ -3,9 +3,11 @@ module.exports = {
     sizes: [320, 480, 820, 1200, 1600],
     domains: ['cdn11.bigcommerce.com'],
   },
-  i18n: {
-    locales: ['en', 'es'],
-    defaultLocale: 'en',
+  experimental: {
+    i18n: {
+      locales: ['en-US', 'es'],
+      defaultLocale: 'en-US',
+    },
   },
   rewrites() {
     return [

pages/index.tsx

@@ -8,7 +8,12 @@ import { Layout } from '@components/core'
 import { Grid, Marquee, Hero } from '@components/ui'
 import { ProductCard } from '@components/product'
 
-export async function getStaticProps({ preview }: GetStaticPropsContext) {
+export async function getStaticProps({
+  preview,
+  locale,
+}: GetStaticPropsContext) {
+  console.log('LOCALE', locale)
+
   const { products: featuredProducts } = await getAllProducts({
     variables: { field: 'featuredProducts', first: 6 },
   })