Merged in Feature/perf/product-detail (pull request #127)

Feature/perf/product detail

1 files changed, 76 insertions, 0 deletions

diff --git a/src-migrate/pages/shop/product/[slug].tsx b/src-migrate/pages/shop/product/[slug].tsx
new file mode 100644
index 00000000..733e10d9
--- /dev/null
+++ b/src-migrate/pages/shop/product/[slug].tsx
@@ -0,0 +1,76 @@
+import { GetServerSideProps, NextPage } from 'next'
+import React from 'react'
+import dynamic from 'next/dynamic'
+import cookie from 'cookie'
+
+import { getProductById } from '~/services/product'
+import { getIdFromSlug } from '~/libs/slug'
+import { IProductDetail } from '~/types/product'
+
+import { Seo } from '~/components/seo'
+import { useRouter } from 'next/router'
+
+const BasicLayout = dynamic(() => import('@/core/components/layouts/BasicLayout'), { ssr: false })
+const ProductDetail = dynamic(() => import('~/modules/product-detail'), { ssr: false })
+
+type PageProps = {
+  product: IProductDetail
+}
+
+export const getServerSideProps: GetServerSideProps<PageProps> = (async (context) => {
+  const { slug } = context.query
+  const cookieString = context.req.headers.cookie;
+  const cookies = cookieString ? cookie.parse(cookieString) : {};
+  const auth = cookies?.auth ? JSON.parse(cookies.auth) : {};
+  const tier = auth?.pricelist || ''
+
+  const productId = getIdFromSlug(slug as string)
+
+  const product = await getProductById(productId, tier)
+
+  if (!product) return { notFound: true }
+
+  return {
+    props: { product }
+  }
+})
+
+const SELF_HOST = process.env.NEXT_PUBLIC_SELF_HOST
+
+const ProductDetailPage: NextPage<PageProps> = ({ product }) => {
+  const router = useRouter();
+
+  return (
+    <BasicLayout>
+      <Seo
+        title={`${product.name} - Indoteknik.com`}
+        description='Temukan pilihan produk B2B Industri &amp; Alat Teknik untuk Perusahaan, UMKM &amp; Pemerintah dengan lengkap, mudah dan transparan.'
+        openGraph={{
+          url: SELF_HOST + router.asPath,
+          images: [
+            {
+              url: product?.image,
+              width: 800,
+              height: 800,
+              alt: product?.name,
+            },
+          ],
+          type: 'product',
+        }}
+        additionalMetaTags={[
+          {
+            name: 'keywords',
+            content: `${product?.name}, Harga ${product?.name}, Beli ${product?.name}, Spesifikasi ${product?.name}`,
+          }
+        ]}
+        canonical={SELF_HOST + router.asPath}
+      />
+
+      <div className='md:container pt-4 md:pt-6'>
+        <ProductDetail product={product} />
+      </div>
+    </BasicLayout>
+  )
+}
+
+export default ProductDetailPage
\ No newline at end of file