diff --git a/src/components/common/CartDrawer/CartDrawer.tsx b/src/components/common/CartDrawer/CartDrawer.tsx
index 31da985ef..9410cfd9c 100644
--- a/src/components/common/CartDrawer/CartDrawer.tsx
+++ b/src/components/common/CartDrawer/CartDrawer.tsx
@@ -25,7 +25,7 @@ const CartDrawer = ({ visible, onClose }: Props) => {
         </div>
         <div>
           <CartMessage />
-          <CartCheckoutButton />
+          <CartCheckoutButton onClose={onClose}/>
         </div>
       </div>
     </DrawerCommon>
diff --git a/src/components/common/CartDrawer/components/CartCheckoutButton/CartCheckoutButton.tsx b/src/components/common/CartDrawer/components/CartCheckoutButton/CartCheckoutButton.tsx
index 5cc8f5f6f..97cb3e0eb 100644
--- a/src/components/common/CartDrawer/components/CartCheckoutButton/CartCheckoutButton.tsx
+++ b/src/components/common/CartDrawer/components/CartCheckoutButton/CartCheckoutButton.tsx
@@ -4,11 +4,16 @@ import s from './CartCheckoutButton.module.scss';
 import Link from 'next/link'
 import { ROUTE } from 'src/utils/constanst.utils';
 
-const CartCheckoutButton = memo(() => {
+interface Props {
+  onClose: () => void
+}
+
+
+const CartCheckoutButton = memo(({ onClose }: Props) => {
   return (
     <Link href={ROUTE.CHECKOUT}>
       <a className={s.cartCheckoutButton}>
-        <ButtonCommon size='large'>Check out - Rp 120.500</ButtonCommon>
+        <ButtonCommon size='large' onClick={onClose}>Check out - Rp 120.500</ButtonCommon>
       </a>
     </Link>
   )