From a7d39f3d1a27007ace37806aad6a11cde6f25bf6 Mon Sep 17 00:00:00 2001
From: lytrankieio123 <lytran@kie.io>
Date: Wed, 15 Sep 2021 14:37:21 +0700
Subject: [PATCH] :recycle: enhan: replace link in delivery item to button
 common

:%s
---
 .../OrderInformation/OrderInformation.tsx         |  6 +++---
 .../modules/account/DeliveryItem/DeliveryItem.tsx |  7 +++----
 .../components/ReOrder/ReOrder.module.scss        | 15 +--------------
 .../DeliveryItem/components/ReOrder/ReOrder.tsx   |  9 +++------
 4 files changed, 10 insertions(+), 27 deletions(-)

diff --git a/src/components/modules/account/AccountPage/components/OrderInformation/OrderInformation.tsx b/src/components/modules/account/AccountPage/components/OrderInformation/OrderInformation.tsx
index 211cebe3b..858526f26 100644
--- a/src/components/modules/account/AccountPage/components/OrderInformation/OrderInformation.tsx
+++ b/src/components/modules/account/AccountPage/components/OrderInformation/OrderInformation.tsx
@@ -25,7 +25,7 @@ const OrderInformation = ({ waiting, delivering, delivered} : OrderInformationPr
                         {
                             waiting.map((order, i) => {
                                 return (
-                                    <DeliveryItem key={order.id} id={order.id} status="waiting" products={order.products} totalPrice={order.totalPrice} />
+                                    <DeliveryItem key={order.id} id={order.id} status="Waiting" products={order.products} totalPrice={order.totalPrice} />
                                 )
                             }) 
                         }
@@ -36,7 +36,7 @@ const OrderInformation = ({ waiting, delivering, delivered} : OrderInformationPr
                         {
                             delivering.map((order, i) => {
                                 return (
-                                    <DeliveryItem key={order.id} id={order.id} status="delivering" products={order.products} totalPrice={order.totalPrice} />
+                                    <DeliveryItem key={order.id} id={order.id} status="Delivering" products={order.products} totalPrice={order.totalPrice} />
                                 )
                             }) 
                         }
@@ -47,7 +47,7 @@ const OrderInformation = ({ waiting, delivering, delivered} : OrderInformationPr
                         {
                             delivered.map((order, i) => {
                                 return (
-                                    <DeliveryItem key={order.id} id={order.id} status="delivered" products={order.products} totalPrice={order.totalPrice} />
+                                    <DeliveryItem key={order.id} id={order.id} status="Delivered" products={order.products} totalPrice={order.totalPrice} />
                                 )
                             }) 
                         }
diff --git a/src/components/modules/account/DeliveryItem/DeliveryItem.tsx b/src/components/modules/account/DeliveryItem/DeliveryItem.tsx
index fe8f5cdef..a8ccbb69d 100644
--- a/src/components/modules/account/DeliveryItem/DeliveryItem.tsx
+++ b/src/components/modules/account/DeliveryItem/DeliveryItem.tsx
@@ -9,20 +9,19 @@ import ReOrder from './components/ReOrder/ReOrder'
 
 interface DeliveryItemProps {
     id: string;
-    status: "waiting" | "delivering" | "delivered";
+    status: "Waiting" | "Delivering" | "Delivered";
     products: string[];
     totalPrice: number;
-    reOrderLink?: string;
 }
 
-const DeliveryItem = ({ id, status, products, totalPrice, reOrderLink } : DeliveryItemProps) => {
+const DeliveryItem = ({ id, status, products, totalPrice } : DeliveryItemProps) => {
     return (
         <section className={s.deliveryItem}>
             <IdAndStatus id={id} status={status} />
             <div className={s.separator}></div>
             <Products products={products} />
             <TotalPrice totalPrice={totalPrice} />
-            <ReOrder show={status==="delivered" ? true : false} href={reOrderLink} />
+            <ReOrder show={status === "Delivered" ? true : false}/>
         </section>
     )
 }
diff --git a/src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.module.scss b/src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.module.scss
index ce36380da..517dd2e4f 100644
--- a/src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.module.scss
+++ b/src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.module.scss
@@ -1,22 +1,9 @@
 @import '../../../../../../styles/utilities';
 
 .reOrder {
-    @apply text-white custom-border-radius hidden font-bold;
-    padding: .4rem .6rem;
+    @apply hidden;
     margin-right: 1.2rem;
-    background-color: var(--primary);
-
-    @screen lg {
-        padding: .8rem 1.2rem;
-        margin-right: 2.4rem;
-    }
-
     &.show {
         @apply block;
     }
-
-    &:hover {
-        @apply cursor-pointer;
-    }
-
 }
\ No newline at end of file
diff --git a/src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.tsx b/src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.tsx
index 2fbc546f4..aaef9153c 100644
--- a/src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.tsx
+++ b/src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.tsx
@@ -1,21 +1,18 @@
 import classNames from "classnames"
 import React from "react"
+import { ButtonCommon } from "src/components/common"
 import s from './ReOrder.module.scss'
-import Link from 'next/link'
 
 interface ReOrderProps {
     show: boolean;
-    href?: string;
 }
 
-const ReOrder = ({ show=false, href="#" } : ReOrderProps) => {
+const ReOrder = ({ show=false } : ReOrderProps) => {
     return (
         <div className={classNames(s.reOrder, {
             [s.show]: show
         })}>
-            <Link href={href}>
-                <a>Re-Order</a>
-            </Link>
+            <ButtonCommon>Re-Order</ButtonCommon>
         </div>
     )
 }