From ebc09c5062cc7996b0f2aaf879062fc950c2e1c2 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Wed, 25 Jan 2023 11:17:37 +0700
Subject: Transaction detail and variant card component

---
 src/pages/shop/checkout.js | 30 ++++++------------------------
 1 file changed, 6 insertions(+), 24 deletions(-)

(limited to 'src/pages/shop')

diff --git a/src/pages/shop/checkout.js b/src/pages/shop/checkout.js
index 1849e0fe..49d1a848 100644
--- a/src/pages/shop/checkout.js
+++ b/src/pages/shop/checkout.js
@@ -17,6 +17,7 @@ import { useRouter } from "next/router";
 import WithAuth from "@/components/auth/WithAuth";
 import { toast } from "react-hot-toast";
 import getFileBase64 from "@/core/utils/getFileBase64";
+import VariantCard from "@/components/variants/VariantCard";
 
 export default function Checkout() {
   const router = useRouter();
@@ -201,30 +202,11 @@ export default function Checkout() {
 
                 <div className="p-4 flex flex-col gap-y-4">
                   {products.map((product, index) => (
-                    <div className="flex gap-x-3" key={index}>
-                      <div className="w-4/12 flex items-center gap-x-2">
-                        <Image
-                          src={product.parent.image} 
-                          alt={product.parent.name} 
-                          className="object-contain object-center border border-gray_r-6 h-32 w-full rounded-md"
-                        />
-                      </div>
-                      <div className="w-8/12 flex flex-col">
-                        <p className="product-card__title wrap-line-ellipsis-2">
-                          {product.parent.name}
-                        </p>
-                        <p className="text-caption-2 text-gray_r-11 mt-1">
-                          {product.code || '-'}
-                          {product.attributes.length > 0 ? ` | ${product.attributes.join(', ')}` : ''}
-                        </p>
-                        <p className="text-caption-2 text-gray_r-11 mt-1">
-                          {currencyFormat(product.price.price_discount)} × {product.quantity} Barang
-                        </p>
-                        <p className="text-caption-2 text-gray_r-12 font-bold mt-2">
-                          {currencyFormat(product.quantity * product.price.price_discount)}
-                        </p>
-                      </div>
-                    </div>
+                    <VariantCard
+                      data={product}
+                      openOnClick={false}
+                      key={index}
+                    />
                   ))}
                 </div>
 
-- 
cgit v1.2.3