diff --git a/src/pages/App/MenuList.js b/src/pages/App/MenuList.js
index eeeb69b..770498b 100644
--- a/src/pages/App/MenuList.js
+++ b/src/pages/App/MenuList.js
@@ -73,33 +73,67 @@ export const MenuList = observer((props) => {
         </Menu.Item>
       )}
       {store.authentication.userData.role === "Admin" && (
-        <SubMenu
-          key="keanggotaan"
-          icon={<UsergroupAddOutlined />}
-          title="Keanggotaan"
-        >
-          <Menu.Item key="membership">
-            <Link to={LINKS.MEMBERSHIP}>
-              <UnorderedListOutlined />
-              <span>List Anggota</span>
-            </Link>
-          </Menu.Item>
-          <Menu.Item key="konfirmasi">
-            <Link to={LINKS.KONFIRMASI}>
-              <FormOutlined />
-              <span>Konfirm Retail</span>
-            </Link>
-          </Menu.Item>
-        </SubMenu>
-      )}
-      {store.authentication.userData.role === "Supervisor" && (
+          <SubMenu
+            key="keanggotaan"
+            icon={<UsergroupAddOutlined />}
+            title="Keanggotaan"
+          >
+            <Menu.Item key="membership">
+              <Link to={LINKS.MEMBERSHIP}>
+                <UnorderedListOutlined />
+                <span>List Anggota</span>
+              </Link>
+            </Menu.Item>
+            <Menu.Item key="konfirmasi">
+              <Link to={LINKS.KONFIRMASI}>
+                <FormOutlined />
+                <span>Konfirm Retail</span>
+              </Link>
+            </Menu.Item>
+          </SubMenu>
+        )}
+        {store.authentication.userData.role === "Supervisor" && (
+          <SubMenu
+            key="keanggotaan"
+            icon={<UsergroupAddOutlined />}
+            title="Keanggotaan"
+          >
+            <Menu.Item key="membership">
+              <Link to={LINKS.MEMBERSHIP}>
+                <UnorderedListOutlined />
+                <span>List Anggota</span>
+              </Link>
+            </Menu.Item>
+            <Menu.Item key="konfirmasi">
+              <Link to={LINKS.KONFIRMASI}>
+                <FormOutlined />
+                <span>Konfirm Retail</span>
+              </Link>
+            </Menu.Item>
+          </SubMenu>
+        )}
+        {/* {store.authentication.userData.role === "Sales" && (
+          <SubMenu
+            key="keanggotaan"
+            icon={<UsergroupAddOutlined />}
+            title="Keanggotaan"
+          >
+            <Menu.Item key="membership">
+              <Link to={LINKS.MEMBERSHIP}>
+                <UnorderedListOutlined />
+                <span>List Anggota</span>
+              </Link>
+            </Menu.Item>
+          </SubMenu>
+        )} */}
+      {/* {store.authentication.userData.role === "Supervisor" && (
         <Menu.Item key="membership">
           <Link to={LINKS.MEMBERSHIP}>
             <IdcardOutlined />
             <span>Keanggotaan</span>
           </Link>
         </Menu.Item>
-      )}
+      )} */}
       {store.authentication.userData.role === "Sales" && (
         <Menu.Item key="membership">
           <Link to={LINKS.MEMBERSHIP}>
diff --git a/src/pages/Membership/DetailUser.js b/src/pages/Membership/DetailUser.js
index 2d5c20b..196645a 100644
--- a/src/pages/Membership/DetailUser.js
+++ b/src/pages/Membership/DetailUser.js
@@ -63,9 +63,10 @@ export const DetailUser = observer(() => {
     ]);
   };
 
-  const changeStatus = async (id, isActive) => {
-    const status = isActive ? "inactive" : "active";
-    const status2 = isActive ? "Inactivating" : "Activating";
+  const changeStatus = async (id, is_active) => {
+    let status = is_active ? false : true;
+    let status2 = is_active ? "Inactivating" : "Activating";
+    console.log(status, "status terbaru");
     try {
       modalLoader.setLoading(true);
       const response = await store.membership.changeStatus(id, status);
@@ -136,6 +137,20 @@ export const DetailUser = observer(() => {
     setConfirmLoading(false);
   };
 
+  const handleResend = async (id) => {
+    modalLoader.setLoading(true);
+    try {
+      const response = await store.approval.resendUser(id);
+      console.log(response);
+      response.body.statusCode !== 201 && response.body.statusCode !== 200
+        ? message.error(response?.body?.message || `Failed Approve`)
+        : message.success(response?.body?.message || `Success Approve`);
+    } catch (e) {
+      console.error(e, "apa errornya");
+      message.error(e.response?.body?.message || "Fail Approve");
+    }
+    modalLoader.setLoading(false);
+  };
   const columns = [
     {
       title: "Amount",
@@ -299,85 +314,102 @@ export const DetailUser = observer(() => {
           <Title strong level={2}>
             Detail User
           </Title>
-
-          {store.authentication.userData.role === "Admin" && (
-            <Col lg={18} xs={18} style={{ textAlign: "right" }}>
-              <Space
-                size="middle"
-                align={"center"}
-                wrap={true}
-                style={{ textAlign: "center" }}
+          <Col
+            lg={store.authentication.userData.role === "Admin" ? 18 : 17}
+            xs={store.authentication.userData.role === "Admin" ? 18 : 17}
+            style={{ textAlign: "right" }}
+          >
+            <Space
+              size="small"
+              align={"center"}
+              wrap={true}
+              style={{ textAlign: "center" }}
+            >
+              <Button
+                type={
+                  store.membership.dataDetail.is_active === true
+                    ? "danger"
+                    : "primary"
+                }
+                onClick={() =>
+                  changeStatus(
+                    store.membership.dataDetail.id,
+                    store.membership.dataDetail.is_active
+                  )
+                }
               >
+                {store.membership.dataDetail.is_active === true
+                  ? "Inactive"
+                  : "Active"}
+              </Button>
+              <Button
+                onClick={() => {
+                  setInitialData({
+                    id: store.membership.dataDetail.id,
+                    name: store.membership.dataDetail.userDetail.name,
+                    username: store.membership.dataDetail.username,
+                    identity_number:
+                      store.membership.dataDetail.userDetail.identity_number,
+                    image_identity:
+                      store.membership.dataDetail?.userDetail.image_identity,
+                    image_store:
+                      store.membership.dataDetail?.userDetail.image_store,
+                    phone_number:
+                      store.membership.dataDetail.userDetail.phone_number,
+                    roleId: store.membership.dataDetail.roles.id,
+                    isChangePassword: false,
+                  });
+                  console.log(
+                    store.membership.dataDetail.userDetail.identity_number
+                  );
+                  console.log(store.membership.dataDetail.userDetail.id);
+                  console.log(
+                    store.membership.dataDetail.userDetail.image_identity
+                  );
+                  console.log(
+                    store.membership.dataDetail.userDetail.image_store,
+                    "ini store"
+                  );
+                  console.log(store.membership.dataDetail.username);
+                  setVisibleModal(true);
+                }}
+              >
+                Edit
+              </Button>
+              <Button
+                onClick={() => {
+                  setInitialData({
+                    id: store.membership.dataDetail.id,
+                    name: store.membership.dataDetail.userDetail.name,
+                    username: store.membership.dataDetail.username,
+                    phone_number:
+                      store.membership.dataDetail.userDetail.phone_number,
+                    roleId: store.membership.dataDetail.roles.id,
+                    isChangePassword: true,
+                  });
+                  setVisibleModal(true);
+                }}
+              >
+                Ganti Password
+              </Button>
+              {((store.authentication.userData.role === "Sales" &&
+                store.membership.dataDetail.is_rejected === true) ||
+                (store.authentication.userData.role === "Supervisor" &&
+                  store.membership.dataDetail.is_rejected === true)) && (
+                <Button
+                  style={{
+                    backgroundColor: "#1bb91d",
+                    color: "#fff",
+                  }}
+                  onClick={() => handleResend(store.membership.dataDetail.id)}
+                >
+                  Resend
+                </Button>
+              )}
+              {store.authentication.userData.role === "Admin" && (
                 <Button
                   type={
-                    store.membership.dataDetail.isActive === true
-                      ? "danger"
-                      : "primary"
-                  }
-                  onClick={() =>
-                    changeStatus(
-                      store.membership.dataDetail.id,
-                      store.membership.dataDetail.isActive
-                    )
-                  }
-                >
-                  {store.membership.dataDetail.isActive === true
-                    ? "Inactive"
-                    : "Active"}
-                </Button>
-                <Button
-                  onClick={() => {
-                    setInitialData({
-                      id: store.membership.dataDetail.id,
-                      name: store.membership.dataDetail.userDetail.name,
-                      username: store.membership.dataDetail.username,
-                      identity_number:
-                        store.membership.dataDetail.userDetail.identity_number,
-                      image_identity:
-                        store.membership.dataDetail?.userDetail.image_identity,
-                      image_store:
-                        store.membership.dataDetail?.userDetail.image_store,
-                      phone_number:
-                        store.membership.dataDetail.userDetail.phone_number,
-                      roleId: store.membership.dataDetail.roles.id,
-                      isChangePassword: false,
-                    });
-                    console.log(
-                      store.membership.dataDetail.userDetail.identity_number
-                    );
-                    console.log(store.membership.dataDetail.userDetail.id);
-                    console.log(
-                      store.membership.dataDetail.userDetail.image_identity
-                    );
-                    console.log(
-                      store.membership.dataDetail.userDetail.image_store,
-                      "ini store"
-                    );
-                    console.log(store.membership.dataDetail.username);
-                    setVisibleModal(true);
-                  }}
-                >
-                  Edit
-                </Button>
-                <Button
-                  onClick={() => {
-                    setInitialData({
-                      id: store.membership.dataDetail.id,
-                      name: store.membership.dataDetail.userDetail.name,
-                      username: store.membership.dataDetail.username,
-                      phone_number:
-                        store.membership.dataDetail.userDetail.phone_number,
-                      roleId: store.membership.dataDetail.roles.id,
-                      isChangePassword: true,
-                    });
-                    setVisibleModal(true);
-                  }}
-                >
-                  Ganti Password
-                </Button>
-                <Button
-                  type={
-                    store.membership.dataDetail.isActive === true
+                    store.membership.dataDetail.is_active === true
                       ? "danger"
                       : "primary"
                   }
@@ -385,159 +417,10 @@ export const DetailUser = observer(() => {
                 >
                   Withdraw Profit
                 </Button>
-              </Space>
-            </Col>
-          )}
-          {store.authentication.userData.role === "Supervisor" && (
-            <Col lg={16} xs={16} style={{ textAlign: "right" }}>
-              <Space
-                size="small"
-                align={"center"}
-                wrap={true}
-                style={{ textAlign: "center" }}
-              >
-                <Button
-                  type={
-                    store.membership.dataDetail.isActive === true
-                      ? "danger"
-                      : "primary"
-                  }
-                  onClick={() =>
-                    changeStatus(
-                      store.membership.dataDetail.id,
-                      store.membership.dataDetail.isActive
-                    )
-                  }
-                >
-                  {store.membership.dataDetail.isActive === true
-                    ? "Inactive"
-                    : "Active"}
-                </Button>
-                <Button
-                  onClick={() => {
-                    setInitialData({
-                      id: store.membership.dataDetail.id,
-                      name: store.membership.dataDetail.userDetail.name,
-                      username: store.membership.dataDetail.username,
-                      identity_number:
-                        store.membership.dataDetail.userDetail.identity_number,
-                      image_identity:
-                        store.membership.dataDetail?.userDetail.image_identity,
-                      image_store:
-                        store.membership.dataDetail?.userDetail.image_store,
-                      phone_number:
-                        store.membership.dataDetail.userDetail.phone_number,
-                      roleId: store.membership.dataDetail.roles.id,
-                      isChangePassword: false,
-                    });
-                    console.log(
-                      store.membership.dataDetail.userDetail.identity_number
-                    );
-                    console.log(store.membership.dataDetail.userDetail.id);
-                    console.log(
-                      store.membership.dataDetail.userDetail.image_identity
-                    );
-                    console.log(store.membership.dataDetail.username);
-                    setVisibleModal(true);
-                  }}
-                >
-                  Edit
-                </Button>
-                <Button
-                  onClick={() => {
-                    setInitialData({
-                      id: store.membership.dataDetail.id,
-                      name: store.membership.dataDetail.userDetail.name,
-                      username: store.membership.dataDetail.username,
-                      phone_number:
-                        store.membership.dataDetail.userDetail.phone_number,
-                      roleId: store.membership.dataDetail.roles.id,
-                      isChangePassword: true,
-                    });
-                    setVisibleModal(true);
-                  }}
-                >
-                  Ganti Password
-                </Button>
-              </Space>
-            </Col>
-          )}
-          {store.authentication.userData.role === "Sales" && (
-            <Col lg={16} xs={16} style={{ textAlign: "right" }}>
-              <Space
-                size="middle"
-                align={"center"}
-                wrap={true}
-                style={{ textAlign: "center" }}
-              >
-                <Button
-                  type={
-                    store.membership.dataDetail.isActive === true
-                      ? "danger"
-                      : "primary"
-                  }
-                  onClick={() =>
-                    changeStatus(
-                      store.membership.dataDetail.id,
-                      store.membership.dataDetail.isActive
-                    )
-                  }
-                >
-                  {store.membership.dataDetail.isActive === true
-                    ? "Inactive"
-                    : "Active"}
-                </Button>
-                <Button
-                  onClick={() => {
-                    setInitialData({
-                      id: store.membership.dataDetail.id,
-                      name: store.membership.dataDetail.userDetail.name,
-                      username: store.membership.dataDetail.username,
-                      identity_number:
-                        store.membership.dataDetail.userDetail.identity_number,
-                      image_identity:
-                        store.membership.dataDetail?.userDetail.image_identity,
-                      image_store:
-                        store.membership.dataDetail?.userDetail.image_store,
-                      phone_number:
-                        store.membership.dataDetail.userDetail.phone_number,
-                      roleId: store.membership.dataDetail.roles.id,
-                      isChangePassword: false,
-                    });
-                    console.log(
-                      store.membership.dataDetail.userDetail.identity_number
-                    );
-                    console.log(store.membership.dataDetail.userDetail.id);
-                    console.log(
-                      store.membership.dataDetail.userDetail.image_identity,"gambar id"
-                    );
-                    console.log(store.membership.dataDetail.username);
-                    setVisibleModal(true);
-                  }}
-                >
-                  Edit
-                </Button>
-                <Button
-                  onClick={() => {
-                    setInitialData({
-                      id: store.membership.dataDetail.id,
-                      name: store.membership.dataDetail.userDetail.name,
-                      username: store.membership.dataDetail.username,
-                      phone_number:
-                        store.membership.dataDetail.userDetail.phone_number,
-                      roleId: store.membership.dataDetail.roles.id,
-                      isChangePassword: true,
-                    });
-                    setVisibleModal(true);
-                  }}
-                >
-                  Ganti Password
-                </Button>
-              </Space>
-            </Col>
-          )}
+              )}
+            </Space>
+          </Col>
         </Row>
-
         <Row style={{ marginBottom: 20 }}>
           <Col lg={12} xs={24}>
             <Row>
@@ -580,7 +463,7 @@ export const DetailUser = observer(() => {
               </Col>
               <Col span={12}>
                 <Text>
-                  {store.authentication.dataProfit.isActive === true
+                  {store.authentication.dataProfit.is_active === true
                     ? "Aktif"
                     : "Inaktif"}
                 </Text>
@@ -623,47 +506,52 @@ export const DetailUser = observer(() => {
                   </Col>
                 </Row>
               )} */}
-              {store.authentication.userData.role === "Admin" && store.authentication.dataProfit.roles?.name !== "Admin Partner" && (
-                <Row>
-                  <Col span={12}>
-                    <Text strong>Foto Identitas</Text>
-                  </Col>
-                  <Col span={12}></Col>
-                  <Col span={12}>
-                    <Text>
-                      <Image
-                        src={
-                          store.authentication.dataProfit.userDetail
-                            ?.image_identity
-                            ? `${appConfig.apiUrl}/config/image/${store.authentication.dataProfit.userDetail?.image_identity}`
-                            : "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
-                        }
-                        style={{ width: "10vw" }}
-                      />
-                    </Text>
-                  </Col>
-                  {store.authentication.dataProfit.roles?.name === "Retail"  && (
-                    <Col span={24}>
-                    <Text strong>Foto Toko</Text>
-                    <Text>
-                      <Row>
-                        {store.authentication.listImage.map((item, index) => (
-                          <Image
-                            key={index}
-                            src={
-                              item
-                                ? `${appConfig.apiUrl}/config/image/${item}`
-                                : "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
-                            }
-                            style={{ width: "10vw", marginRight: 15 }}
-                          />
-                        ))}
-                      </Row>
-                    </Text>
-                  </Col>
-                  )}
-                </Row>
-              )}
+              {store.authentication.userData.role === "Admin" &&
+                store.authentication.dataProfit.roles?.name !==
+                  "Admin Partner" && (
+                  <Row>
+                    <Col span={12}>
+                      <Text strong>Foto Identitas</Text>
+                    </Col>
+                    <Col span={12}></Col>
+                    <Col span={12}>
+                      <Text>
+                        <Image
+                          src={
+                            store.authentication.dataProfit.userDetail
+                              ?.image_identity
+                              ? `${appConfig.apiUrl}/config/image/${store.authentication.dataProfit.userDetail?.image_identity}`
+                              : "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
+                          }
+                          style={{ width: "10vw" }}
+                        />
+                      </Text>
+                    </Col>
+                    {store.authentication.dataProfit.roles?.name ===
+                      "Retail" && (
+                      <Col span={24}>
+                        <Text strong>Foto Toko</Text>
+                        <Text>
+                          <Row>
+                            {store.authentication.listImage.map(
+                              (item, index) => (
+                                <Image
+                                  key={index}
+                                  src={
+                                    item
+                                      ? `${appConfig.apiUrl}/config/image/${item}`
+                                      : "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
+                                  }
+                                  style={{ width: "10vw", marginRight: 15 }}
+                                />
+                              )
+                            )}
+                          </Row>
+                        </Text>
+                      </Col>
+                    )}
+                  </Row>
+                )}
               {store.authentication.userData.role === "Sales" && (
                 <Row>
                   <Col span={12}>
diff --git a/src/pages/Membership/Konfirmasi.js b/src/pages/Membership/Konfirmasi.js
index 96b264c..0012e04 100644
--- a/src/pages/Membership/Konfirmasi.js
+++ b/src/pages/Membership/Konfirmasi.js
@@ -55,8 +55,7 @@ export const Konfirmasi = observer(() => {
     const init = async () => {
       try {
         modalLoader.setLoading(true);
-        await store.membership.getData();
-        await store.payback.getDataConfirmation();
+        await store.approval.getData();
         modalLoader.setLoading(false);
       } catch (e) {
         modalLoader.setLoading(false);
@@ -74,18 +73,18 @@ export const Konfirmasi = observer(() => {
   const columns = [
     {
       title: "Name",
-      dataIndex: "userData_name",
-      key: "userData_name",
+      dataIndex: "username",
+      key: "username",
     },
     {
       title: "Foto Identitas",
-      dataIndex: "image_prove",
-      key: "image_prove",
+      dataIndex: ["user_detail", "image_identity"],
+      key: "user_detail.image_identity",
       render: (text, record) => (
         <Image
           src={`${appConfig.apiUrl}/config/image/${text}`}
           style={{ width: "5vw" }}
-          alt={record.id}
+          alt={record.image_identity}
         />
       ),
     },
@@ -110,7 +109,7 @@ export const Konfirmasi = observer(() => {
             setToko(record);
             setVisibleModalToko(true);
           }}
-          style={{backgroundColor:"#7c3ea3",color:"white"}}
+          style={{ backgroundColor: "#7c3ea3", color: "white" }}
           // type="primary"
         >
           Lihat Foto
@@ -123,7 +122,7 @@ export const Konfirmasi = observer(() => {
       key: "action",
       width: "10%",
       render: (text, record) =>
-        PAYBACK_STATUS[record.status] === PAYBACK_STATUS[0] ? (
+        record.is_active === false ? (
           <Space size="middle">
             <Button
               onClick={async () => {
@@ -134,7 +133,8 @@ export const Konfirmasi = observer(() => {
                   cancelText: "Cancel",
                   okType: "primary",
                   onOk() {
-                    handleAction(record.id, "accept");
+                    handleApprove(record.id);
+                    console.log(record.id);
                   },
                   onCancel() {
                     console.log("Cancel");
@@ -159,7 +159,7 @@ export const Konfirmasi = observer(() => {
                   cancelText: "Cancel",
                   okType: "primary",
                   onOk() {
-                    handleAction(record.id, "reject");
+                    handleReject(record.id);
                   },
                   onCancel() {
                     console.log("Cancel");
@@ -178,19 +178,14 @@ export const Konfirmasi = observer(() => {
           </Space>
         ) : (
           <Tag
-            color={
-              PAYBACK_STATUS[record.status] === PAYBACK_STATUS[3]
-                ? "cyan"
-                : "red"
-            }
+            color={record.is_active === false ? "red" : "cyan"}
             style={{ color: "#4F566B" }}
           >
-            {PAYBACK_STATUS[record.status]}
+            {record.is_active === false ? "Tidak Aktif" : "Aktif"}
           </Tag>
         ),
     },
   ];
-
   if (store.authentication.userData.role === "Retail") columns.pop();
 
   const routeData = [
@@ -207,27 +202,36 @@ export const Konfirmasi = observer(() => {
   const dataRoute = [
     {
       route: LINKS.PAYBACK,
-      name: "Konfirmasi Pembayaran",
+      name: "Konfirmasi Retail",
     },
   ];
 
-  const handleAction = async (id, type) => {
+  const handleApprove = async (id) => {
     modalLoader.setLoading(true);
     try {
-      const response = await store.payback.confirmPayback(id, type);
+      const response = await store.approval.approveUser(id);
       console.log(response);
       response.body.statusCode !== 201 && response.body.statusCode !== 200
-        ? message.error(
-            response?.body?.message || `Failed ${capitalize(type)} Payback`
-          )
-        : message.success(
-            response?.body?.message || `Success ${capitalize(type)} Payback`
-          );
+        ? message.error(response?.body?.message || `Failed Approve`)
+        : message.success(response?.body?.message || `Success Approve`);
     } catch (e) {
       console.error(e, "apa errornya");
-      message.error(
-        e.response?.body?.message || "Failed Handler Action Payback"
-      );
+      message.error(e.response?.body?.message || "Fail Approve");
+    }
+    modalLoader.setLoading(false);
+  };
+
+  const handleReject = async (id) => {
+    modalLoader.setLoading(true);
+    try {
+      const response = await store.approval.rejectUser(id);
+      console.log(response);
+      response.body.statusCode !== 201 && response.body.statusCode !== 200
+        ? message.error(response?.body?.message || `Failed Reject`)
+        : message.success(response?.body?.message || `Success Reject`);
+    } catch (e) {
+      console.error(e, "apa errornya");
+      message.error(e.response?.body?.message || "Fail Approve");
     }
     modalLoader.setLoading(false);
   };
@@ -303,20 +307,7 @@ export const Konfirmasi = observer(() => {
       Apply
     </Button>,
   ];
-  const gambar = [
-    {
-      mobil:
-        "https://www.toyota.astra.co.id/sites/default/files/2021-11/4-avanza-silver-mica-metallic.png",
-    },
-    {
-      mobil:
-        "https://foto.kontan.co.id/B0DdG0ycDkrB5FyHTkyjMhz4opk=/smart/2021/04/22/1618664119p.jpg",
-    },
-    {
-      mobil:
-        "https://static.wixstatic.com/media/bce131_b85b43380cb44ad493776b810c0389ac~mv2.png/v1/fill/w_688,h_408,al_c/bce131_b85b43380cb44ad493776b810c0389ac~mv2.png",
-    },
-  ];
+
   return (
     <div className={["ppob-container"].join(" ")}>
       <BreadcumbComponent
@@ -324,10 +315,10 @@ export const Konfirmasi = observer(() => {
           store.authentication.userData.role === "Admin" ? routeData : dataRoute
         }
       />
-      <Card>
-        <div>
-          <Row style={{ marginBottom: 20 }}>
-            <Col span={12}>
+      <Card >
+        <div style={{ marginTop: 30 }}>
+          {/* <Row style={{ marginBottom: 20 }}> */}
+            {/* <Col span={12}>
               <Button
                 onClick={() => {
                   store.payback.visibleModalFilterPayback = true;
@@ -336,8 +327,8 @@ export const Konfirmasi = observer(() => {
                 <FilterOutlined />
                 Filter
               </Button>
-            </Col>
-            <Col span={12} style={{ textAlign: "right" }}>
+            </Col> */}
+            {/* <Col span={12} style={{ textAlign: "right" }}> */}
               {/* <Search
                 placeholder="input search text"
                 style={{
@@ -346,28 +337,28 @@ export const Konfirmasi = observer(() => {
                   marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
                 }}
               /> */}
-            </Col>
-          </Row>
+            {/* </Col> */}
+          {/* </Row> */}
           {store.ui.mediaQuery.isDesktop && (
             <Table
               key="1"
               hasEmpty
               columns={columns}
-              dataSource={store.payback.dataConfirmation}
+              dataSource={store.approval.data}
               bordered
               pagination={{
-                pageSize: store.payback.pageSizeConfirmation,
-                total: store.payback.totalDataConfirmation,
-                current: store.payback.pageSizeConfirmation + 1,
+                pageSize: store.approval.pageSize,
+                total: store.approval.total_data,
+                current: store.approval.pageSize + 1,
                 showSizeChanger: true,
                 simple: false,
               }}
               onChange={async (page) => {
                 let pageNumber = page.current;
-                store.payback.pageSizeConfirmation = page.pageSize;
-                store.payback.pageConfirmation = pageNumber - 1;
+                store.approval.pageSize = page.pageSize;
+                store.approval.page = pageNumber - 1;
                 modalLoader.setLoading(true);
-                await store.payback.getDataConfirmation();
+                await store.approval.getData();
                 modalLoader.setLoading(false);
               }}
             />
@@ -379,18 +370,18 @@ export const Konfirmasi = observer(() => {
               position={"top"}
               pagination={{
                 onChange: async (page) => {
-                  store.payback.pageSizeConfirmation = page.pageSize;
-                  store.payback.pageConfirmation = page.current - 1;
+                  store.approval.pageSize = page.pageSize;
+                  store.approval.page = page.current - 1;
                   modalLoader.setLoading(true);
-                  await store.payback.getDataConfirmation();
+                  await store.approval.getData();
                   modalLoader.setLoading(false);
                 },
-                pageSize: store.payback.pageSizeConfirmation,
-                total: store.payback.totalDataConfirmation,
-                current: store.payback.pageConfirmation + 1,
+                pageSize: store.approval.pageSize,
+                total: store.approval.total_data,
+                current: store.approval.page + 1,
                 style: { marginBottom: "1rem", marginRight: "1rem" },
               }}
-              dataSource={store.payback.dataConfirmation}
+              dataSource={store.approval.data}
               style={{ padding: 0 }}
               renderItem={(item) => {
                 return (
@@ -413,10 +404,9 @@ export const Konfirmasi = observer(() => {
                         description={
                           <div style={{}}>
                             <p>
-                              <small>Amount: {item.amount}</small>
+                              <small>Username: {item.username}</small>
                               <br />
-                              {PAYBACK_STATUS[item.status] ===
-                              PAYBACK_STATUS[0] ? (
+                              {item.is_active === false ? (
                                 <Space size="middle">
                                   <Button
                                     onClick={async () => {
@@ -427,7 +417,8 @@ export const Konfirmasi = observer(() => {
                                         cancelText: "Cancel",
                                         okType: "primary",
                                         onOk() {
-                                          handleAction(item.id, "accept");
+                                          handleApprove(item.id);
+                                          //console.log(record.id);
                                         },
                                         onCancel() {
                                           console.log("Cancel");
@@ -452,7 +443,7 @@ export const Konfirmasi = observer(() => {
                                         cancelText: "Cancel",
                                         okType: "primary",
                                         onOk() {
-                                          handleAction(item.id, "reject");
+                                          handleReject(item.id);
                                         },
                                         onCancel() {
                                           console.log("Cancel");
@@ -472,14 +463,13 @@ export const Konfirmasi = observer(() => {
                               ) : (
                                 <Tag
                                   color={
-                                    PAYBACK_STATUS[item.status] ===
-                                    PAYBACK_STATUS[3]
-                                      ? "cyan"
-                                      : "red"
+                                    item.is_active === false ? "red" : "cyan"
                                   }
                                   style={{ color: "#4F566B" }}
                                 >
-                                  {PAYBACK_STATUS[item.status]}
+                                  {item.is_active === false
+                                    ? "Tidak Aktif"
+                                    : "Aktif"}
                                 </Tag>
                               )}
                               <Button
@@ -499,12 +489,6 @@ export const Konfirmasi = observer(() => {
                               </Button>
                               <Button
                                 onClick={async () => {
-                                  // await store.transaction.getDataHistoryTopUp(record.id);
-                                  // await store.transaction.getDetailHistoryTransaction(record.id);
-                                  // await store.authentication.getProfit(record.id);
-                                  //await store.transaction.getDataHistoryTransaction()
-                                  // history.push(LINKS.USER_DETAIL.replace(":id", record.id));
-                                  // console.log(record.id);
                                   setToko(item);
                                   setVisibleModalToko(true);
                                 }}
@@ -541,7 +525,6 @@ export const Konfirmasi = observer(() => {
         visible={
           visibleModalToko === true ? visibleModalToko : VisibleModalIdentitas
         }
-        //title={`Are you sure buy ${barang?.product_name}?`}
         okText={"Confirm"}
         onCancel={() => {
           form.resetFields();
@@ -550,82 +533,10 @@ export const Konfirmasi = observer(() => {
         }}
         width={1000}
         footer={false}
-        // footer={footerLayoutFilter}
-        // footer={[
-        //   <Button
-        //     key="back"
-        //     style={{
-        //       backgroundColor: "#e74e5e",
-        //       color: "#fff",
-        //     }}
-        //     onClick={() => {
-        //       form.resetFields();
-        //       handleCancel();
-        //     }}
-        //   >
-        //     Cancel
-        //   </Button>,
-        //   <Button
-        //     key="Buy Prod"
-        //     style={{
-        //       backgroundColor: "#4e79e7",
-        //       color: "#fff",
-        //     }}
-        //     onClick={() => {
-        //       form
-        //         .validateFields()
-        //         .then((values) => {
-        //           console.log(values, "isi form");
-        //           handleBuyProduct(values, barang.product_code);
-        //           form.resetFields();
-        //         })
-        //         .catch((info) => {
-        //           console.error("Validate Failed:", info);
-        //         });
-        //     }}
-        //   >
-        //     Buy Prod
-        //   </Button>,
-        //   <Button
-        //     key="Buy Stag"
-        //     type="primary"
-        //     onClick={() => {
-        //       form
-        //         .validateFields()
-        //         .then((values) => {
-        //           console.log(values, "isi form");
-        //           handleBuyStag(values, barang.product_code);
-        //           form.resetFields();
-        //         })
-        //         .catch((info) => {
-        //           console.error("Validate Failed:", info);
-        //         });
-        //     }}
-        //   >
-        //     Buy Staging
-        //   </Button>,
-        // ]}
-        // cancelText="Cancel"
-        // onCancel={() => {
-        //   form.resetFields();
-        //   handleCancel();
-        // }}
-        // onOk={() => {
-        //   form
-        //     .validateFields()
-        //     .then((values) => {
-        //       console.log(values, "isi form");
-        //       handleBuyProduct(values, item.product_code);
-        //       form.resetFields();
-        //     })
-        //     .catch((info) => {
-        //       console.error("Validate Failed:", info);
-        //     });
-        // }}
       >
         {visibleModalToko === true ? (
           <Row>
-            {gambar.map((gmbr, idx) => (
+            {JSON.parse(toko.user_detail.image_store).map((gmbr, idx) => (
               <Card
                 style={
                   store.ui.mediaQuery.isDesktop
@@ -641,93 +552,22 @@ export const Konfirmasi = observer(() => {
                       }
                 }
               >
-                <Image src={`${gmbr.mobil}`} alt={idx} preview={false}/>
+                <Image
+                  src={`${appConfig.apiUrl}/config/image/${gmbr}`}
+                  alt={idx}
+                  preview={false}
+                />
               </Card>
             ))}
           </Row>
         ) : (
           <Image
-            src={`${appConfig.apiUrl}/config/image/${identitas.image_prove}`}
+            src={`${appConfig.apiUrl}/config/image/${identitas.user_detail?.image_identity}`}
             alt={identitas.id}
+            preview={false}
           />
         )}
-
-        {/* <Form form={form} layout="vertical">
-          <Form.Item
-            name="destination"
-            label="Destination"
-            rules={[
-              {
-                required: true,
-                message: "Please input Destination Number!",
-              },
-              // {
-              //   pattern: /^(?:\d*)$/,
-              //   message: "Value should contain just number",
-              // },
-              // {
-              //   pattern: /^[\d]{1,12}$/,
-              //   message: "Value should be 1 - 12 character",
-              // },
-            ]}
-          >
-            <Input />
-          </Form.Item>
-        </Form> */}
       </Modal>
-      {/* <Modal
-        visible={store.payback.visibleModalFilterPayback}
-        title={"Filter"}
-        footer={footerLayoutFilter}
-        onCancel={async () => {
-          //form.resetFields();
-          //setFilterMembership([]);
-          store.payback.filterMembership = null;
-          store.payback.filterStart = null;
-          store.payback.filterEnd = null;
-          store.payback.visibleModalFilterPayback = false;
-          await store.payback.getDataConfirmation();
-        }}
-      >
-        <Row>
-          <Col span={24}>
-            <Title level={5} type={"secondary"} strong>
-              Sender
-            </Title>
-            <Form layout="vertical" name="filter" form={form}>
-              <Select
-                mode={"multiple"}
-                placeholder="Pilih Pengirim"
-                onChange={(val) => {
-                  setFilterMembership(val);
-                }}
-                style={{ marginBottom: "20px", width: "100%" }}
-                value={filterMembership}
-              >
-                {store.payback.dataConfirmation.map((item) => (
-                  <Option value={item.id} key={item.id}>
-                    {item.userData_name}
-                  </Option>
-                ))}
-              </Select>
-              <Form.Item
-                name="start_date"
-                label="Dari"
-                rules={[{ required: true, message: "Please input Date!" }]}
-              >
-                <DatePicker style={{ width: "100%" }}/>
-              </Form.Item>
-              <Form.Item
-                name="end_date"
-                label="Sampai"
-                rules={[{ required: true, message: "Please input Date!" }]}
-              >
-                <DatePicker style={{ width: "100%" }} />
-              </Form.Item>
-            </Form>
-          </Col>
-        </Row>
-      </Modal> */}
     </div>
   );
 });
diff --git a/src/pages/Membership/Membership.js b/src/pages/Membership/Membership.js
index 631cff2..ab72a73 100644
--- a/src/pages/Membership/Membership.js
+++ b/src/pages/Membership/Membership.js
@@ -329,11 +329,7 @@ export const Membership = observer(() => {
       form.resetFields();
     }
   };
-  const handleClickRow = (record, index) => ({
-    onClick: (event) => {
-      history.push(LINKS.USER_DETAIL.replace(":id", record.id));
-    },
-  });
+
   return (
     <div className={["ppob-container"].join(" ")}>
       <BreadcumbComponent
@@ -379,7 +375,6 @@ export const Membership = observer(() => {
             <Table
               key="1"
               hasEmpty
-              onRow={handleClickRow}
               columns={columns}
               style={{ cursor: "pointer" }}
               dataSource={
diff --git a/src/store/approval.js b/src/store/approval.js
new file mode 100644
index 0000000..5192198
--- /dev/null
+++ b/src/store/approval.js
@@ -0,0 +1,67 @@
+import {makeAutoObservable} from "mobx";
+import {http} from "../utils/http";
+
+export class Approval {
+    page = 0;
+    pageSize = 10
+    data = [];
+    listImage=[];
+    total_data = 0;
+    
+    constructor(ctx) {
+        this.ctx = ctx;
+        makeAutoObservable(this);
+    }
+
+    async getData() {
+        try {
+            const response = await http.get(`/users/find-by-approval?page=${this.page}&pageSize=${this.pageSize}`);
+            console.log(response)
+            this.data = response.body.data ?? []
+            this.listImage= this.data.user_detail?.image_store ? JSON.parse(this.data.user_detail?.image_store) : []
+            this.total_data = response.body.count ?? 0
+        } catch (e) {
+            console.error(e);
+        }
+    }
+
+    async approveUser(id) {
+        try {
+            const response = await http.put(`/users/approve-user/${id}`);
+            await this.getData();
+            return response;
+        } catch (e) {
+            console.error(e);
+        }
+    }
+    async rejectUser(id) {
+        try {
+            const response = await http.put(`/users/reject-user/${id}`);
+            await this.getData();
+            return response;
+        } catch (e) {
+            console.error(e);
+        }
+    }
+
+    async resendUser(id) {
+        try {
+            const response = await http.put(`/users/resend-user/${id}`);
+            await this.getData();
+            return response;
+        } catch (e) {
+            console.error(e);
+        }
+    }
+    // async delete(id) {
+    //     try {
+    //         const response = await http.del(`/product/${id}`);
+    //         await this.getData();
+    //         return response;
+    //     } catch (e) {
+    //         console.error(e);
+    //     }
+    // }
+}
+
+
diff --git a/src/store/index.js b/src/store/index.js
index 138b277..c49f046 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -12,6 +12,8 @@ import { Category } from "./category";
 import { Subcategory } from "./subcategory";
 import { Payback } from "./payback";
 import { Role } from "./role";
+import { Approval } from "./approval";
+
 
 export class Store {
     ui = new UI(this);
@@ -27,6 +29,7 @@ export class Store {
     transaction = new Transaction(this);
     subcategory = new Subcategory(this);
     role = new Role(this);
+    approval = new Approval(this);
 
     constructor() {
         TokenUtil.loadToken();
diff --git a/src/store/membership.js b/src/store/membership.js
index 1f7f1f4..fda2a67 100644
--- a/src/store/membership.js
+++ b/src/store/membership.js
@@ -47,7 +47,7 @@ export class Membership {
     async getDetail(id) {
         try {
             const response = await http.get(`/users/`+id);
-            //console.log(response,'Data Detail')
+            console.log(response,'Data Detail')
             this.dataDetail = response.body.data
         } catch (e) {
             console.error(e);
@@ -114,6 +114,7 @@ export class Membership {
     async changeStatus(id, status) {
         try {
             const response = await http.get(`/users/${id}/${status}`);
+            console.log(status,"change status")
             await this.getData();
             return response;
         } catch (e) {