diff --git a/src/pages/App/DesktopLayout.js b/src/pages/App/DesktopLayout.js
index 6a7332b..75b8d2e 100644
--- a/src/pages/App/DesktopLayout.js
+++ b/src/pages/App/DesktopLayout.js
@@ -312,7 +312,9 @@ export const DesktopLayout = observer(() => {
                       </Link>
                     </Menu.Item>
                   )}
-                  {store.authentication.userData.role !== "Admin" && (
+                  {store.authentication.userData.role !== "Admin" &&
+                    store.authentication.userData.role !==
+                      "Customer Service" && (
                       <Menu.Item key="payback-from-user">
                         <Link to={LINKS.PAYBACK_CREATED}>
                           <AlipayOutlined />
diff --git a/src/pages/App/MenuList.js b/src/pages/App/MenuList.js
index 8cec5e6..a0d6af3 100644
--- a/src/pages/App/MenuList.js
+++ b/src/pages/App/MenuList.js
@@ -242,7 +242,8 @@ export const MenuList = observer((props) => {
               </Link>
             </Menu.Item>
           )}
-          {store.authentication.userData.role !== "Admin" && (
+          {store.authentication.userData.role !== "Admin" &&
+            store.authentication.userData.role !== "Customer Service" && (
               <Menu.Item key="payback-from-user">
                 <Link to={LINKS.PAYBACK_CREATED}>
                   <FileProtectOutlined />
diff --git a/src/pages/Payback/PaybackCreated.js b/src/pages/Payback/PaybackCreated.js
index 24e2fcd..47da21b 100644
--- a/src/pages/Payback/PaybackCreated.js
+++ b/src/pages/Payback/PaybackCreated.js
@@ -117,14 +117,14 @@ export const PaybackCreated = observer(() => {
     },
     {
       route: LINKS.PAYBACK_CREATED,
-      name: <span style={{ fontWeight: "bold" }}>Buat Pembayaran</span>,
+      name: <span style={{ fontWeight: "bold" }}>Bukti Pembayaran</span>,
     },
   ];
 
   const dataRoute = [
     {
       route: LINKS.PAYBACK_CREATED,
-      name: "Buat Pembayaran",
+      name: "Bukti Pembayaran",
     },
   ];
 
diff --git a/src/pages/Transaction/Transaction.js b/src/pages/Transaction/Transaction.js
index 69468dc..ca66f0c 100644
--- a/src/pages/Transaction/Transaction.js
+++ b/src/pages/Transaction/Transaction.js
@@ -1,4 +1,4 @@
-import React, { message, useContext, useEffect, useState } from "react";
+import React, { useContext, useEffect, useState } from "react";
 import { useStore } from "../../utils/useStore";
 import {
   Card,
@@ -11,8 +11,10 @@ import {
   Row,
   DatePicker,
   Form,
-  Input,
+  message,
+  Input
 } from "antd";
+
 import { BreadcumbComponent } from "../../component/BreadcumbComponent";
 import { Product } from "./Product";
 import { LINKS } from "../../routes/app";
@@ -89,6 +91,7 @@ export const Transaction = observer(() => {
       } else {
         message.error(response?.body?.error || "Gagal Beli Produk", 3);
       }
+      setVisibleModalBuy(false);
     } catch (e) {
       console.log("testingan");
       console.log(e.response, "testingan");
@@ -102,40 +105,43 @@ export const Transaction = observer(() => {
       console.log(e, "apa errornya");
       message.error("Gagal Beli Product");
     }
+   // message.success("Berhasil Beli Produk");
     setVisibleModalBuy(false);
     modalLoader.setLoading(false);
   };
 
-  const handleBuyStag = async (data, productCode) => {
-    modalLoader.setLoading(true);
-    try {
-      const response = await store.transaction.buyProduct({
-        ...data,
-        productCode: productCode,
-      });
-      if (response.status === 201) {
-        message.success(response?.body?.message || "Berhasil Beli Produk");
-      } else {
-        message.error(response?.body?.error || "Gagal Beli Produk", 3);
-      }
-    } catch (e) {
-      console.log("testingan");
-      console.log(e.response, "testingan");
-      console.log(e.result, "testingan1");
-      if (e.response?.body?.error) {
-        message.error(e.response.body.error);
-        setVisibleModalBuy(false);
-        modalLoader.setLoading(false);
-        return;
-      }
-      console.log(e, "apa errornya");
-      message.error("Gagal Beli Product");
-    }
-    // setDataProd(false);
-    // setDataStag(false);
-    setVisibleModalBuy(false);
-    modalLoader.setLoading(false);
-  };
+  // const handleBuyStag = async (data, productCode) => {
+  //   modalLoader.setLoading(true);
+  //   try {
+  //     const response = await store.transaction.buyProduct({
+  //       ...data,
+  //       productCode: productCode,
+  //     });
+  //     if (response.status === 201) {
+  //       message.success(response?.body?.message || "Berhasil Beli Produk");
+  //     } else {
+  //       message.error(response?.body?.error || "Gagal Beli Produk", 3);
+  //     }
+  //   } catch (e) {
+  //     console.log("testingan");
+  //     console.log(e.response, "testingan");
+  //     console.log(e.result, "testingan1");
+  //     if (e.response?.body?.error) {
+  //       message.error(e.response.body.error);
+  //       setVisibleModalBuy(false);
+  //       modalLoader.setLoading(false);
+  //       return;
+  //     }
+  //     console.log(e, "apa errornya");
+  //     message.error("Gagal Beli Product");
+  //   }
+  //   // setDataProd(false);
+  //   // setDataStag(false);
+  //   setVisibleModalBuy(false);
+  //   modalLoader.setLoading(false);
+  // };
+
+
   const handleCancel = () => {
     form.resetFields();
     setVisibleModalBuy(false);
@@ -241,6 +247,7 @@ export const Transaction = observer(() => {
                       onClick={() => {
                         setVisibleModalBuy(true);
                         setBarang(item);
+                        console.log(item?.product_name)
                       }}
                       hoverable
                       style={{