diff --git a/src/component/PartnerComponent.js b/src/component/PartnerComponent.js
index d660997..66f0329 100644
--- a/src/component/PartnerComponent.js
+++ b/src/component/PartnerComponent.js
@@ -257,6 +257,19 @@ export const PartnerComponent = observer((props) => {
               <Input />
             </Form.Item>
           )}
+          {!idData && (
+            <Form.Item
+              name="owner"
+              label="Owner"
+              rules={[
+                idData
+                  ? { required: false }
+                  : { required: true, message: "Please input password owner!" },
+              ]}
+            >
+              <Input />
+            </Form.Item>
+          )}
           {((idData && isChangePassword) || !idData) && (
             <Form.Item
               name="password_account"
@@ -289,7 +302,7 @@ export const PartnerComponent = observer((props) => {
               </Form.Item>
               <Form.Item
                 name="address"
-                label="address"
+                label="Address"
                 rules={[
                   idData
                     ? { required: false }
diff --git a/src/component/SupplierComponent.js b/src/component/SupplierComponent.js
index 70f196d..0e881d7 100644
--- a/src/component/SupplierComponent.js
+++ b/src/component/SupplierComponent.js
@@ -1,11 +1,11 @@
-import React, {useState} from "react";
-import {Button, Form, Input, message, Modal, Space, Table, Tag} from "antd";
-import {observer} from "mobx-react-lite";
-import {ExclamationCircleOutlined} from "@ant-design/icons";
-import {useHistory} from "react-router-dom";
-import {useStore} from "../utils/useStore";
-import {LINKS} from "../routes/app";
-import {TopupsaldoModal} from "./TopupsaldoModal";
+import React, { useState } from "react";
+import { Button, Form, Input, message, Modal, Space, Table, Tag } from "antd";
+import { observer } from "mobx-react-lite";
+import { ExclamationCircleOutlined } from "@ant-design/icons";
+import { useHistory } from "react-router-dom";
+import { useStore } from "../utils/useStore";
+import { LINKS } from "../routes/app";
+import { TopupsaldoModal } from "./TopupsaldoModal";
 
 export const SupplierComponent = observer((props) => {
   const store = useStore();
@@ -65,6 +65,11 @@ export const SupplierComponent = observer((props) => {
       dataIndex: ["coa", "amount"],
       key: ["coa", "amount"],
       width: "20%",
+      render: (text, record) =>
+        new Intl.NumberFormat("id-ID", {
+          style: "currency",
+          currency: "IDR",
+        }).format(text),
     },
     {
       title: "Status",
@@ -72,12 +77,12 @@ export const SupplierComponent = observer((props) => {
       key: "status",
       width: "5%",
       render: (text, record) => (
-          <Tag
-              color={record?.status === true ? "processing" : "#E3E8EE"}
-              style={{color: "#4F566B"}}
-          >
-            {record?.status === true ? " ACTIVE" : "INACTIVE"}
-          </Tag>
+        <Tag
+          color={record?.status === true ? "processing" : "#E3E8EE"}
+          style={{ color: "#4F566B" }}
+        >
+          {record?.status === true ? " ACTIVE" : "INACTIVE"}
+        </Tag>
       ),
     },
     {
@@ -85,15 +90,15 @@ export const SupplierComponent = observer((props) => {
       key: "action",
       width: "20%",
       render: (text, record) => (
-          <Space size="middle">
-            <Button
-                type={record?.status === true ? "danger" : "primary"}
-                onClick={() => changeStatus(record?.id, record?.status)}
-            >
-              {record?.status === true ? "INACTIVE" : "ACTIVE"}
-            </Button>
-            <Button onClick={() => handleTopup(record)}> Top Up Saldo</Button>
-            <Button onClick={() => handleEditButton(record)}>Edit</Button>
+        <Space size="middle">
+          <Button
+            type={record?.status === true ? "danger" : "primary"}
+            onClick={() => changeStatus(record?.id, record?.status)}
+          >
+            {record?.status === true ? "INACTIVE" : "ACTIVE"}
+          </Button>
+          <Button onClick={() => handleTopup(record)}> Top Up Saldo</Button>
+          <Button onClick={() => handleEditButton(record)}>Edit</Button>
         </Space>
       ),
     },
@@ -212,18 +217,18 @@ export const SupplierComponent = observer((props) => {
           >
             <Input />
           </Form.Item>
-          {!idData &&
-              <Form.Item
-                  name="code"
-                  label="Kode"
-                  rules={[{required: true, message: "Please input kode!"}]}
-              >
-                <Input/>
-              </Form.Item>
-          }
+          {!idData && (
+            <Form.Item
+              name="code"
+              label="Kode"
+              rules={[{ required: true, message: "Please input kode!" }]}
+            >
+              <Input />
+            </Form.Item>
+          )}
         </Form>
       </Modal>
-      <TopupsaldoModal code={store.supplier.code}/>
+      <TopupsaldoModal code={store.supplier.code} />
     </div>
   );
 });
diff --git a/src/pages/Membership/Membership.js b/src/pages/Membership/Membership.js
index e1641dc..1e031b9 100644
--- a/src/pages/Membership/Membership.js
+++ b/src/pages/Membership/Membership.js
@@ -209,7 +209,6 @@ export const Membership = observer(() => {
     data.superior = true;
 
     if (initialData.id) {
-      setInitialData({});
       setConfirmLoading(true);
       try {
         await store.membership.update(initialData.id, data);
@@ -229,7 +228,6 @@ export const Membership = observer(() => {
       setConfirmLoading(false);
       setVisibleModal(false);
     } else {
-      setInitialData({});
       setConfirmLoading(true);
       try {
         await store.membership.create(data);
@@ -241,6 +239,7 @@ export const Membership = observer(() => {
       }
       setConfirmLoading(false);
       setVisibleModal(false);
+      setInitialData({});
     }
   };
 
diff --git a/src/pages/Transaction/Product.js b/src/pages/Transaction/Product.js
index 5634d7d..fab2125 100644
--- a/src/pages/Transaction/Product.js
+++ b/src/pages/Transaction/Product.js
@@ -1,111 +1,129 @@
-import React, {useEffect, useState} from "react";
-import {useStore} from "../../utils/useStore";
-import {Button, Card, Col, Input, Row, Select} from "antd";
-import {observer} from "mobx-react-lite";
-import {BuyProductModal} from "../../component/BuyProductModal";
+import React, { useEffect, useState } from "react";
+import { useStore } from "../../utils/useStore";
+import { Button, Card, Col, Input, Row, Select } from "antd";
+import { observer } from "mobx-react-lite";
+import { BuyProductModal } from "../../component/BuyProductModal";
 
-const {Search} = Input;
-const {Option} = Select;
+const { Search } = Input;
+const { Option } = Select;
 
 export const Product = observer(() => {
-    const store = useStore();
+  const store = useStore();
 
-    const [isLoading, setIsLoading] = useState(false);
-    const [productData, setProductData] = useState([]);
-    const [data, setData] = useState({});
+  const [isLoading, setIsLoading] = useState(false);
+  const [productData, setProductData] = useState([]);
+  const [data, setData] = useState({});
 
-    useEffect(() => {
-        const init = async () => {
-            try {
-                setIsLoading(true);
-                await store.transaction.getDataSubCategories();
-                await store.transaction.getDataCategories();
-                setIsLoading(false);
-            } catch (e) {
-                setIsLoading(false);
-            }
-        };
+  useEffect(() => {
+    const init = async () => {
+      try {
+        setIsLoading(true);
+        await store.transaction.getDataSubCategories();
+        await store.transaction.getDataCategories();
+        setIsLoading(false);
+      } catch (e) {
+        setIsLoading(false);
+      }
+    };
 
-        init();
-    }, []);
+    init();
+  }, []);
 
-    // data
-    useEffect(() => {
-        console.log('⚡ transaction data store', store.transaction.data)
-        setProductData(store.transaction.data)
-    }, [store.transaction.data])
+  // data
+  useEffect(() => {
+    console.log("⚡ transaction data store", store.transaction.data);
+    setProductData(store.transaction.data);
+  }, [store.transaction.data]);
 
-    // Subcategory
-    useEffect(() => {
-        console.log('⚡ transaction subcategory store', store.transaction.dataSubCategories)
-    }, [store.transaction.dataSubCategories])
-
-
-    const handleChangeSubcategory = async (item) => {
-        console.log('item', item);
-        store.transaction.filterSubCategory = item;
-        await store.transaction.getData();
-    }
-
-    const handleBuyProduct = (data) => {
-        setData(data);
-        store.transaction.visibleModalTransaction = true;
-    }
-
-    return (
-        <div>
-            <Row>
-                <span style={{fontWeight: "bold", marginBottom: "10px"}}>
-                    Sub Category
-                </span>
-            </Row>
-            <Row>
-                <Col span={24}>
-                    <Select
-                        placeholder={"Select Sub Category"}
-                        allowClear={true}
-                        onChange={(val) => {
-                            if (val) {
-                                handleChangeSubcategory(val)
-                            }
-                        }}
-                        style={{marginBottom: "10px", width: "100%"}}>
-                        {store.transaction.dataSubCategories.map((item, index) => (
-                            <Option key={item.id} value={item.id}>
-                                {item.name}
-                            </Option>
-                        ))}
-                    </Select>
-                </Col>
-            </Row>
-            <Row justify={"center"} align={"center"} style={{marginBottom: "1rem"}}>
-                <Col span={12} style={{fontWeight: "bold", display: "flex", alignItems: "center"}}>
-                    Produk & Nominal
-                </Col>
-                <Col span={12} style={{textAlign: "right"}}>
-                    <Search
-                        placeholder="input search text"
-                        style={{width: 200, marginRight: 10}}
-                    />
-                </Col>
-            </Row>
-            {productData.length != 0 && <Row>
-                {productData.map((item, index) => (
-                    <Col key={index} xs={24} md={16} lg={8}>
-                        <Card onClick={() => handleBuyProduct(item)} style={{cursor: "pointer"}}>
-                            <span style={{color: "black"}}>{item.name}</span>
-                            <br/>
-                            <span style={{color: "grey", fontSize: 10}}>{item?.currentPrice?.mark_up_price}</span>
-                        </Card>
-                    </Col>
-                ))}
-            </Row>}
-            {productData.length != 0 && <Col style={{textAlign: "right"}}>
-                <Button style={{backgroundColor: "#2D9CDB", color: "white"}}>
-                    Beli Sekarang
-                </Button>
-            </Col>}
-            <BuyProductModal initialData={data}/>
-        </div>
+  // Subcategory
+  useEffect(() => {
+    console.log(
+      "⚡ transaction subcategory store",
+      store.transaction.dataSubCategories
     );
+  }, [store.transaction.dataSubCategories]);
+
+  const handleChangeSubcategory = async (item) => {
+    console.log("item", item);
+    store.transaction.filterSubCategory = item;
+    await store.transaction.getData();
+  };
+
+  const handleBuyProduct = (data) => {
+    setData(data);
+    store.transaction.visibleModalTransaction = true;
+  };
+
+  return (
+    <div>
+      <Row>
+        <span style={{ fontWeight: "bold", marginBottom: "10px" }}>
+          Sub Category
+        </span>
+      </Row>
+      <Row>
+        <Col span={24}>
+          <Select
+            placeholder={"Select Sub Category"}
+            allowClear={true}
+            onChange={(val) => {
+              if (val) {
+                handleChangeSubcategory(val);
+              }
+            }}
+            style={{ marginBottom: "10px", width: "100%" }}
+          >
+            {store.transaction.dataSubCategories.map((item, index) => (
+              <Option key={item.id} value={item.id}>
+                {item.name}
+              </Option>
+            ))}
+          </Select>
+        </Col>
+      </Row>
+      <Row justify={"center"} align={"center"} style={{ marginBottom: "1rem" }}>
+        <Col
+          span={12}
+          style={{ fontWeight: "bold", display: "flex", alignItems: "center" }}
+        >
+          Produk & Nominal
+        </Col>
+        <Col span={12} style={{ textAlign: "right" }}>
+          <Search
+            placeholder="input search text"
+            style={{ width: 200, marginRight: 10 }}
+          />
+        </Col>
+      </Row>
+      {productData.length != 0 && (
+        <Row>
+          {productData.map((item, index) => (
+            <Col key={index} xs={24} md={16} lg={8}>
+              <Card
+                onClick={() => handleBuyProduct(item)}
+                style={{ cursor: "pointer" }}
+              >
+                <span style={{ color: "black" }}>{item.name}</span>
+                <br />
+                <span style={{ color: "grey", fontSize: 10 }}>
+                  {new Intl.NumberFormat("id-ID", {
+                    style: "currency",
+                    currency: "IDR",
+                  }).format(item?.currentPrice?.mark_up_price)}
+                </span>
+              </Card>
+            </Col>
+          ))}
+        </Row>
+      )}
+      {productData.length !== 0 && (
+        <Col style={{ textAlign: "right" }}>
+          <Button style={{ backgroundColor: "#2D9CDB", color: "white" }}>
+            Beli Sekarang
+          </Button>
+        </Col>
+      )}
+      <BuyProductModal initialData={data} />
+    </div>
+  );
 });
diff --git a/src/store/ui.js b/src/store/ui.js
index 5bf55b1..f5e9710 100644
--- a/src/store/ui.js
+++ b/src/store/ui.js
@@ -13,7 +13,7 @@ export class UI {
     }
 
     setTestValue() {
-        this.testValue = "yo dayo";
+        this.testValue = "yoshahhh #!";
     }
 
     setMediaQuery(data) {