diff --git a/src/component/ProductComponent.js b/src/component/ProductComponent.js
index 34e0041..854f78d 100644
--- a/src/component/ProductComponent.js
+++ b/src/component/ProductComponent.js
@@ -220,8 +220,6 @@ export const ProductComponent = observer((props) => {
   const handleCancelFilter = async () => {
     store.product.filterSubCategory = null;
     store.product.filterSupplier = null;
-    // setFilterSubCategories([]);
-    // setFilterSupplier([]);
     store.product.visibleModalFilterProduct = false;
     await store.product.getData();
   };
@@ -232,21 +230,9 @@ export const ProductComponent = observer((props) => {
     modalLoader.setLoading(true);
     await store.product.getData();
     modalLoader.setLoading(false);
-    // setFilterSupplier([]);
-    // setFilterSubCategories([]);
     store.product.visibleModalFilterProduct = false;
   };
 
-  // const handleFilterCategory = async (value) => {
-  //   if (value) {
-  //     store.product.filterCategory = value;
-  //     await store.product.getDataSubCategories();
-  //   } else {
-  //     store.product.filterCategory = null;
-  //     await store.product.getDataSubCategories();
-  //   }
-  // };
-
   const footerLayoutFilter = [
     <Button
       key={"remove"}
diff --git a/src/pages/Membership/DetailUser.js b/src/pages/Membership/DetailUser.js
index 3ba837f..02a3d13 100644
--- a/src/pages/Membership/DetailUser.js
+++ b/src/pages/Membership/DetailUser.js
@@ -292,10 +292,6 @@ export const DetailUser = observer(() => {
         justifyContent: "center",
       }
     : null;
-  // console.log(
-  //   JSON.parse(store.authentication.dataProfit.userDetail?.image_store),
-  //   " ini dia"
-  // );
   const data = store.authentication.listImage;
   console.log(data, "ini data");
   console.log(
@@ -464,44 +460,6 @@ export const DetailUser = observer(() => {
                     : "Inactive"}
                 </Text>
               </Col>
-              {/* {store.authentication.userData.role === "Sales" && (
-                <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",marginLeft:10 }}
-                      />
-                    </Text>
-                  </Col>
-                  <Col span={24}>
-                    <Text strong>Foto Toko</Text>
-                    <Text>
-                    <Row>
-                        {store.authentication.listImage.map((item) => (
-                          <Image
-                            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" && (
@@ -587,7 +545,6 @@ export const DetailUser = observer(() => {
                   </Col>
                 </Row>
               )}
-
               {store.authentication.userData.role === "Supervisor" && (
                 <Row>
                   <Col span={12}>
@@ -664,7 +621,6 @@ export const DetailUser = observer(() => {
           <Col span={24}>
             <Tabs defaultActiveKey="1">
               <TabPane tab="History Top Up" key="1">
-                {/* {store.ui.mediaQuery.isDesktop && ( */}
                 <Table
                   key="1"
                   hasEmpty
@@ -687,36 +643,9 @@ export const DetailUser = observer(() => {
                     modalLoader.setLoading(false);
                   }}
                 />
-                {/* )} */}
-                {/* <Table
-                  columns={columns}
-                  dataSource={store.transaction.dataHistoryTopUp}
-                  bordered
-                /> */}
               </TabPane>
               <TabPane tab="History Transaction" key="2">
                 {store.ui.mediaQuery.isDesktop && (
-                  //   <Table
-                  //   columns={columns}
-                  //   bordered
-                  //   dataSource={store.transaction.dataHistoryTransaction}
-                  //   pagination={{
-                  //     pageSize: store.transaction.pageSizeHistoryTransaction,
-                  //     total: store.transaction.total_dataHistoryTransaction,
-                  //     current: store.transaction.pageHistoryTransaction + 1,
-                  //     showSizeChanger: true,
-                  //     simple: false,
-                  //   }}
-                  //   onChange={async (page) => {
-                  //     let pageNumber = page.current;
-                  //     store.transaction.pageSizeHistoryTransaction =
-                  //       page.pageSize;
-                  //     store.transaction.pageHistoryTransaction = pageNumber - 1;
-                  //     modalLoader.setLoading(true);
-                  //     await store.transaction.getDataHistoryTransaction();
-                  //     modalLoader.setLoading(false);
-                  //   }}
-                  // />
                   <Table
                     key="1"
                     hasEmpty
@@ -843,11 +772,6 @@ export const DetailUser = observer(() => {
                     }}
                   />
                 )}
-                {/* <Table
-                  columns={column}
-                  dataSource={store.transaction.dataDetailHistoryTransaction}
-                  bordered
-                /> */}
               </TabPane>
             </Tabs>
           </Col>
diff --git a/src/pages/Membership/FilterUser.js b/src/pages/Membership/FilterUser.js
index 814d3c6..5328009 100644
--- a/src/pages/Membership/FilterUser.js
+++ b/src/pages/Membership/FilterUser.js
@@ -1,82 +1,77 @@
 import React, { useState } from "react";
-import { Form, Input, Modal, Select, InputNumber,Row,Title,Col,Option } from "antd";
+import {
+  Form,
+  Input,
+  Modal,
+  Select,
+  InputNumber,
+  Row,
+  Title,
+  Col,
+  Option,
+} from "antd";
 import { useStore } from "../../utils/useStore";
 import { observer } from "mobx-react-lite";
 
-
 export const FilterUser = observer(() => {
-    const store = useStore();
-//   const [form] = Form.useForm();
-//   const { Option } = Select;
-//   const store = useStore();
-//   const [value, setValue] = useState();
-
+  const store = useStore();
   return (
     <Modal
-    visible={store.membership.visibleModalFilterMembership}
-    title={"Filter"}
-    //footer={footerLayoutFilter}
-  >
-    <Row>
-      <Col span={24}>
-        <Title level={5} type={"secondary"} strong>
-          Filter Supplier
-        </Title>
-        <Select
-          mode={"multiple"}
-          placeholder="Choose Supplier"
-        //   onChange={(val) => {
-        //     setFilterSupplier(val);
-        //   }}
-          style={{ marginBottom: "20px", width: "100%" }}
-        //   value={filterSupplier}
-        >
-          {store.supplier.data.map((item) => (
-            <Option value={item.id} key={item.id}>
-              {item.name}
-            </Option>
-          ))}
-        </Select>
-      </Col>
-      <Col span={24}>
-        <Title level={5} type={"secondary"} strong>
-          Filter Categories
-        </Title>
-        <Select
-          mode={"multiple"}
-          placeholder="Choose Category"
-        //   onChange={async (val) => handleFilterCategory(val)}
-          style={{ marginBottom: "20px", width: "100%" }}
-          value={store.product.filterCategory || []}
-        >
-          {store.category.data.map((item) => (
-            <Option value={item.id} key={item.id}>
-              {item.name}
-            </Option>
-          ))}
-        </Select>
-      </Col>
-      <Col span={24}>
-        <Title level={5} type={"secondary"} strong>
-          Filter Sub-Categories
-        </Title>
-        <Select
-          mode={"multiple"}
-          placeholder="Choose Sub-Category"
-        //   onChange={(val) => {
-        //     setFilterSubCategories(val);
-        //   }}
-          style={{ marginBottom: "20px", width: "100%" }}
-        //   value={filterSubCategories}
-        >
-          {store.product.dataSubCategories.map((item) => (
-            <Option value={item.id} key={item.id}>
-              {item.name}
-            </Option>
-          ))}
-        </Select>
-      </Col>
-    </Row>
-  </Modal>
+      visible={store.membership.visibleModalFilterMembership}
+      title={"Filter"}
+      //footer={footerLayoutFilter}
+    >
+      <Row>
+        <Col span={24}>
+          <Title level={5} type={"secondary"} strong>
+            Filter Supplier
+          </Title>
+          <Select
+            mode={"multiple"}
+            placeholder="Choose Supplier"
+            style={{ marginBottom: "20px", width: "100%" }}
+          >
+            {store.supplier.data.map((item) => (
+              <Option value={item.id} key={item.id}>
+                {item.name}
+              </Option>
+            ))}
+          </Select>
+        </Col>
+        <Col span={24}>
+          <Title level={5} type={"secondary"} strong>
+            Filter Categories
+          </Title>
+          <Select
+            mode={"multiple"}
+            placeholder="Choose Category"
+            style={{ marginBottom: "20px", width: "100%" }}
+            value={store.product.filterCategory || []}
+          >
+            {store.category.data.map((item) => (
+              <Option value={item.id} key={item.id}>
+                {item.name}
+              </Option>
+            ))}
+          </Select>
+        </Col>
+        <Col span={24}>
+          <Title level={5} type={"secondary"} strong>
+            Filter Sub-Categories
+          </Title>
+          <Select
+            mode={"multiple"}
+            placeholder="Choose Sub-Category"
+            style={{ marginBottom: "20px", width: "100%" }}
+          >
+            {store.product.dataSubCategories.map((item) => (
+              <Option value={item.id} key={item.id}>
+                {item.name}
+              </Option>
+            ))}
+          </Select>
+        </Col>
+      </Row>
+    </Modal>
   );
 });
diff --git a/src/pages/Membership/Konfirmasi.js b/src/pages/Membership/Konfirmasi.js
index d55bbab..d6c4f3f 100644
--- a/src/pages/Membership/Konfirmasi.js
+++ b/src/pages/Membership/Konfirmasi.js
@@ -93,24 +93,11 @@ export const Konfirmasi = observer(() => {
       dataIndex: "image_prove",
       key: "image_prove",
       render: (text, record) => (
-        // <Image
-        //   src={`${appConfig.apiUrl}/config/image/${text}`}
-        //   style={{ width: "5vw" }}
-        //   alt={record.id}
-        // />
         <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(record);
             setVisibleModalToko(true);
           }}
-        
-          // type="primary"
         >
           Lihat Foto
         </Button>
@@ -272,42 +259,6 @@ export const Konfirmasi = observer(() => {
     store.payback.visibleModalFilterPayback = false;
   };
 
-  const handleFilterCategory = async (value) => {
-    if (value) {
-      store.product.filterCategory = value;
-      await store.product.getDataSubCategories();
-    } else {
-      store.product.filterCategory = null;
-      await store.product.getDataSubCategories();
-    }
-  };
-
-  const footerLayoutFilter = [
-    <Button
-      key={"remove"}
-      onClick={handleRemoveFilter}
-      style={{
-        backgroundColor: "#e74e5e",
-        color: "#fff",
-      }}
-    >
-      Remove Filter
-    </Button>,
-    <Button key={"cancel"} onClick={handleCancelFilter}>
-      Cancel
-    </Button>,
-    <Button
-      key={"submit"}
-      onClick={handleSubmitFilter}
-      style={{
-        backgroundColor: "#4e79e7",
-        color: "#fff",
-      }}
-    >
-      Apply
-    </Button>,
-  ];
-
   return (
     <div className={["ppob-container"].join(" ")}>
       <BreadcumbComponent
@@ -317,28 +268,6 @@ export const Konfirmasi = observer(() => {
       />
       <Card>
         <div style={{ marginTop: 30 }}>
-          {/* <Row style={{ marginBottom: 20 }}> */}
-          {/* <Col span={12}>
-              <Button
-                onClick={() => {
-                  store.payback.visibleModalFilterPayback = true;
-                }}
-              >
-                <FilterOutlined />
-                Filter
-              </Button>
-            </Col> */}
-          {/* <Col span={12} style={{ textAlign: "right" }}> */}
-          {/* <Search
-                placeholder="input search text"
-                style={{
-                  width: store.ui.mediaQuery.isMobile ? 160 : 200,
-                  marginRight: store.ui.mediaQuery.isMobile ? 0 : 10,
-                  marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
-                }}
-              /> */}
-          {/* </Col> */}
-          {/* </Row> */}
           {store.ui.mediaQuery.isDesktop && (
             <Table
               key="1"
@@ -400,7 +329,6 @@ export const Konfirmasi = observer(() => {
                     >
                       <List.Item.Meta
                         className={[""].join(" ")}
-                        // title={item.username}
                         description={
                           <div style={{}}>
                             <p>
@@ -418,7 +346,6 @@ export const Konfirmasi = observer(() => {
                                         okType: "primary",
                                         onOk() {
                                           handleApprove(item.id);
-                                          //console.log(record.id);
                                         },
                                         onCancel() {
                                           console.log("Cancel");
@@ -473,20 +400,14 @@ export const Konfirmasi = observer(() => {
                                 </Tag>
                               )}
                               <Button
-                               style={
-                                item.is_active === true
-                                  ? {
-                                      marginTop: 5,
-                                    }
-                                  : { marginLeft: 10, marginTop: 5 }
-                              }
+                                style={
+                                  item.is_active === true
+                                    ? {
+                                        marginTop: 5,
+                                      }
+                                    : { marginLeft: 10, marginTop: 5 }
+                                }
                                 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);
                                   setIdentitas(item);
                                   setVisibleModalIdentitas(true);
                                 }}
@@ -497,9 +418,9 @@ export const Konfirmasi = observer(() => {
                                 style={
                                   item.is_active === true
                                     ? {
-                                        marginLeft:10,
+                                        marginLeft: 10,
                                       }
-                                    : {marginTop: 10 }
+                                    : { marginTop: 10 }
                                 }
                                 onClick={async () => {
                                   setToko(item);
@@ -512,19 +433,7 @@ export const Konfirmasi = observer(() => {
                           </div>
                         }
                       />
-                      <div style={{ marginRight: 16 }}>
-                        {/* <p
-                          style={{
-                            fontSize: 9,
-                            margin: 0,
-                          }}
-                        >
-                          <Image
-                            src={`${appConfig.apiUrl}/config/image/${item.image_prove}`}
-                            style={{ width: "10vw" }}
-                          />
-                        </p> */}
-                      </div>
+                      <div style={{ marginRight: 16 }}></div>
                     </List.Item>
                     <Divider plain style={{ margin: 0 }} />
                   </div>
diff --git a/src/pages/Membership/Membership.js b/src/pages/Membership/Membership.js
index ab72a73..522fd45 100644
--- a/src/pages/Membership/Membership.js
+++ b/src/pages/Membership/Membership.js
@@ -230,7 +230,6 @@ export const Membership = observer(() => {
               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);
             }}
diff --git a/src/pages/Membership/MembershipModal.js b/src/pages/Membership/MembershipModal.js
index e309648..d1bca04 100644
--- a/src/pages/Membership/MembershipModal.js
+++ b/src/pages/Membership/MembershipModal.js
@@ -114,36 +114,25 @@ export const MembershipModal = ({
   };
 
   const uploadHandler = async (args) => {
-    // if (fileList === "") {
     const file = args.file;
     const res = await store.payback.uploadImages(file);
     console.log(res, "ini respon 1");
     setImage(`${appConfig.apiUrl}/config/image/${res.body.filename}`);
-    //setResponseFilename(res.body.filename);
-    console.log(initialData.image_identity)
+    console.log(initialData.image_identity);
     initialData.image_identity !== ""
       ? file === ""
         ? setResponseFilename(initialData.image_identity)
         : setResponseFilename(res.body.filename)
       : setResponseFilename(res.body.filename);
     setFileList([
-          {
-            uid: "-1",
-            name: res.body.filename,
-            status: "done",
-            url: `${appConfig.apiUrl}/config/image/${res.body.filename}`,
-          },
-        ]);
+      {
+        uid: "-1",
+        name: res.body.filename,
+        status: "done",
+        url: `${appConfig.apiUrl}/config/image/${res.body.filename}`,
+      },
+    ]);
     setLoading(false);
-    // } else {
-    //   const file = args.file;
-    //   const res = await store.payback.uploadImages(file);
-    //   console.log(res, "ini respon 1");
-    //   setImage(`${appConfig.apiUrl}/config/image/${initialData.image_identity}`);
-    //   setResponseFilename(initialData.image_identity);
-    //   setFileList([initialData.image_identity]);
-    //   setLoading(false);
-    // }
   };
 
   const uploadHandlerStore = async (args) => {
@@ -335,9 +324,6 @@ export const MembershipModal = ({
                   <Upload
                     listType="picture-card"
                     fileList={fileList}
-                    // onPreview={(file) => {
-                    //   setPreviewImage(file.url || file.filename);
-                    // }}
                     showUploadList={true}
                     onPreview={handlePreviewData}
                     onChange={handleChange}
@@ -496,8 +482,6 @@ export const MembershipModal = ({
                   }}
                 />
               </Form.Item>
-              {/* <Row>
-                <Col> */}
               <Form.Item label="Upload Identity Image" name="image_identity">
                 <div>
                   <Upload
diff --git a/src/pages/Payback/Payback.js b/src/pages/Payback/Payback.js
index 618566d..7b59a33 100644
--- a/src/pages/Payback/Payback.js
+++ b/src/pages/Payback/Payback.js
@@ -35,8 +35,7 @@ import { capitalize } from "lodash";
 import { PAYBACK_STATUS } from "../../constants/payback";
 import moment from "moment";
 
-const { Search } = Input;
-const { RangePicker } = DatePicker;
+
 export const Payback = observer(() => {
   const { Option } = Select;
   const { Title } = Typography;
@@ -245,17 +244,7 @@ export const Payback = observer(() => {
     modalLoader.setLoading(false);
     store.payback.visibleModalFilterPayback = false;
   };
-
-  const handleFilterCategory = async (value) => {
-    if (value) {
-      store.product.filterCategory = value;
-      await store.product.getDataSubCategories();
-    } else {
-      store.product.filterCategory = null;
-      await store.product.getDataSubCategories();
-    }
-  };
-
+  
   const footerLayoutFilter = [
     <Button
       key={"remove"}
diff --git a/src/pages/Payback/PaybackCreated.js b/src/pages/Payback/PaybackCreated.js
index e55ba2e..4a126eb 100644
--- a/src/pages/Payback/PaybackCreated.js
+++ b/src/pages/Payback/PaybackCreated.js
@@ -28,11 +28,8 @@ import { appConfig } from "../../config/app";
 import { PAYBACK_STATUS } from "../../constants/payback";
 import moment from "moment";
 
-const { Search } = Input;
 
 export const PaybackCreated = observer(() => {
-  const { Option } = Select;
-  const { Title } = Typography;
   const [form] = Form.useForm();
   const store = useStore();
   const [filterMembership, setFilterMembership] = useState([]);
@@ -167,16 +164,6 @@ export const PaybackCreated = observer(() => {
     store.payback.visibleModalFilterCreate = false;
   };
 
-  // const handleFilterCategory = async (value) => {
-  //   if (value) {
-  //     store.product.filterCategory = value;
-  //     await store.product.getDataSubCategories();
-  //   } else {
-  //     store.product.filterCategory = null;
-  //     await store.product.getDataSubCategories();
-  //   }
-  // };
-
   const footerLayoutFilter = [
     <Button
       key={"remove"}
diff --git a/src/pages/Product/Category.js b/src/pages/Product/Category.js
index ca64fd7..1cbedc8 100644
--- a/src/pages/Product/Category.js
+++ b/src/pages/Product/Category.js
@@ -50,21 +50,7 @@ export const Category = observer(() => {
       <BreadcumbComponent data={routeData} />
       <Card>
         <Row style={{ marginBottom: 20 }}>
-          {/* <Col span={12}>
-            <Button>
-              <FilterOutlined />
-              Filter
-            </Button>
-          </Col> */}
           <Col span={24} style={{ textAlign: "right" }}>
-            {/* <Search
-              placeholder="input search text"
-              style={{
-                width: store.ui.mediaQuery.isMobile ? 160 : 200,
-                marginRight: store.ui.mediaQuery.isMobile ? 0 : 10,
-                marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
-              }}
-            /> */}
             <Button
               onClick={() => (store.category.visibleModalCategory = true)}
             >
diff --git a/src/pages/Product/Subcategory.js b/src/pages/Product/Subcategory.js
index 0594a68..b17dcb1 100644
--- a/src/pages/Product/Subcategory.js
+++ b/src/pages/Product/Subcategory.js
@@ -1,14 +1,14 @@
-import React, {useContext, useEffect} from "react";
-import {Button, Card, Col, Input, message, Row} from "antd";
-import {PlusSquareOutlined} from "@ant-design/icons";
-import {BreadcumbComponent} from "../../component/BreadcumbComponent";
-import {useStore} from "../../utils/useStore";
-import {observer} from "mobx-react-lite";
-import {LINKS} from "../../routes/app";
-import {SubcategoryComponent} from "../../component/SubcategoryComponent";
-import {ModalLoaderContext} from "../../utils/modal";
+import React, { useContext, useEffect } from "react";
+import { Button, Card, Col, Input, message, Row } from "antd";
+import { PlusSquareOutlined } from "@ant-design/icons";
+import { BreadcumbComponent } from "../../component/BreadcumbComponent";
+import { useStore } from "../../utils/useStore";
+import { observer } from "mobx-react-lite";
+import { LINKS } from "../../routes/app";
+import { SubcategoryComponent } from "../../component/SubcategoryComponent";
+import { ModalLoaderContext } from "../../utils/modal";
 
-const {Search} = Input;
+const { Search } = Input;
 
 export const Subcategory = observer(() => {
   const store = useStore();
@@ -45,38 +45,24 @@ export const Subcategory = observer(() => {
     },
     {
       route: LINKS.SUBCATEGORY,
-      name: <span style={{fontWeight: "bold"}}>Sub Kategori</span>,
+      name: <span style={{ fontWeight: "bold" }}>Sub Kategori</span>,
     },
   ];
 
   return (
     <div className={["ppob-container"].join(" ")}>
-      <BreadcumbComponent data={routeData}/>
+      <BreadcumbComponent data={routeData} />
       <Card>
-        <Row style={{marginBottom: 20}}>
-          {/* <Col span={12}>
-            <Button>
-              <FilterOutlined />
-              Filter
-            </Button>
-          </Col> */}
-          <Col span={24} style={{textAlign: "right"}}>
-            {/* <Search
-              placeholder="input search text"
-              style={{
-                width: store.ui.mediaQuery.isMobile ? 160 : 200,
-                marginRight: store.ui.mediaQuery.isMobile ? 0 : 10,
-                marginBottom: store.ui.mediaQuery.isMobile ? 10 : 0,
-              }}
-            /> */}
+        <Row style={{ marginBottom: 20 }}>
+          <Col span={24} style={{ textAlign: "right" }}>
             <Button
               onClick={() => (store.subcategory.visibleModalSubcategory = true)}
             >
-              <PlusSquareOutlined/> New
+              <PlusSquareOutlined /> New
             </Button>
           </Col>
         </Row>
-        <SubcategoryComponent/>
+        <SubcategoryComponent />
       </Card>
     </div>
   );
diff --git a/src/pages/Profile/Profile.js b/src/pages/Profile/Profile.js
index 846f497..11b10aa 100644
--- a/src/pages/Profile/Profile.js
+++ b/src/pages/Profile/Profile.js
@@ -306,27 +306,6 @@ export const Profile = observer(() => {
                   </Col>
                 </Row>
               )}
-              {/* {store.authentication.userData.role === "Supervisor" && (
-                <Row>
-                  <Col span={12}>
-                    <Text strong>Foto Identitas</Text>
-                  </Col>
-                  <Col span={12}></Col>
-                  <Col span={12}>
-                    <Text>
-                      <Image
-                        src={
-                          store.authentication.dataProfit.profileData
-                            ?.image_identity
-                            ? `${appConfig.apiUrl}/config/image/${store.authentication.profileData.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>
-                </Row>
-              )} */}
             </Row>
           </Col>
           <Col span={store.ui.mediaQuery.isMobile ? 24 : 5}>
diff --git a/src/store/supplier.js b/src/store/supplier.js
index ecc81e1..c3e0f74 100644
--- a/src/store/supplier.js
+++ b/src/store/supplier.js
@@ -1,90 +1,87 @@
-import {makeAutoObservable} from "mobx";
-import {http} from "../utils/http";
+import { makeAutoObservable } from "mobx";
+import { http } from "../utils/http";
 
 export class Supplier {
-    page = 0;
-    pageSize = 10
-    data = [];
-    total_data = 0;
-    filterCategory = null;
-    visibleModalSupplier = false;
-    visibleModalTransaction = false;
-    code = "";
+  page = 0;
+  pageSize = 10;
+  data = [];
+  total_data = 0;
+  filterCategory = null;
+  visibleModalSupplier = false;
+  visibleModalTransaction = false;
+  code = "";
 
-    pageCategories = 0;
-    pageSizeCategories = 10
-    dataCategories = [];
-    total_dataCategories = 0;
+  pageCategories = 0;
+  pageSizeCategories = 10;
+  dataCategories = [];
+  total_dataCategories = 0;
 
-    pageSubCategories = 0;
-    pageSizeSubCategories = 10
-    dataSubCategories = [];
-    total_dataSubCategories = 0;
+  pageSubCategories = 0;
+  pageSizeSubCategories = 10;
+  dataSubCategories = [];
+  total_dataSubCategories = 0;
 
-    constructor(ctx) {
-        this.ctx = ctx;
-        makeAutoObservable(this);
-    }
+  constructor(ctx) {
+    this.ctx = ctx;
+    makeAutoObservable(this);
+  }
 
-    async getData() {
-        try {
-            const response = await http.get(`/users/supplier?page=${this.page}&pageSize=${this.pageSize}`);
-            //console.log(response)
-            this.data = response.body.data ?? []
-            this.total_data = response.body.count ?? 0
-        } catch (e) {
-            console.error(e);
-        }
-    }
-    
-    async create(data) {
-        // try {
-            const response = await http.post('/users/supplier').send(data);
-           //await this.getData();
-            return response;
-        // } catch (e) {
-        //     console.error(e);
-        // }
-    }
-    async createTransaction(data) {
-        try {
-            const response = await http.post('/transaction/add-saldo-supplier').send(data);
-            await this.getData();
-            return response;
-        } catch (e) {
-            console.error(e);
-        }
+  async getData() {
+    try {
+      const response = await http.get(
+        `/users/supplier?page=${this.page}&pageSize=${this.pageSize}`
+      );
+      //console.log(response)
+      this.data = response.body.data ?? [];
+      this.total_data = response.body.count ?? 0;
+    } catch (e) {
+      console.error(e);
     }
+  }
 
-    async update(id, data) {
-        try {
-            const response = await http.put(`/users/supplier/${id}`).send(data);
-            await this.getData();
-            return response;
-        } catch (e) {
-            console.error(e);
-        }
+  async create(data) {
+    const response = await http.post("/users/supplier").send(data);
+    return response;
+  }
+  async createTransaction(data) {
+    try {
+      const response = await http
+        .post("/transaction/add-saldo-supplier")
+        .send(data);
+      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)
-        }
+  async update(id, data) {
+    try {
+      const response = await http.put(`/users/supplier/${id}`).send(data);
+      await this.getData();
+      return response;
+    } catch (e) {
+      console.error(e);
     }
+  }
 
-    async changeStatus(id, status) {
-        try {
-            const response = await http.get(`/users/supplier/${id}/${status}`);
-            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);
     }
+  }
+
+  async changeStatus(id, status) {
+    try {
+      const response = await http.get(`/users/supplier/${id}/${status}`);
+      await this.getData();
+      return response;
+    } catch (e) {
+      console.error(e);
+    }
+  }
 }
-
-