diff --git a/src/component/CategoryComponent.js b/src/component/CategoryComponent.js
new file mode 100644
index 0000000..87f01c7
--- /dev/null
+++ b/src/component/CategoryComponent.js
@@ -0,0 +1,217 @@
+import React, {useEffect, useState} from "react";
+import {Button, Form, Input, message, Modal, Select, Space, Table, Tag} from "antd";
+import {observer} from "mobx-react-lite";
+import {ExclamationCircleOutlined} from "@ant-design/icons";
+import {useHistory} from "react-router-dom";
+import {capitalize} from "lodash";
+import {useStore} from "../utils/useStore";
+import {LINKS} from "../routes/app";
+
+export const CategoryComponent = observer((props) => {
+ const store = useStore();
+ const [form] = Form.useForm();
+ const {Option} = Select;
+ const history = useHistory();
+ const [idData, setIdData] = useState('');
+ const [confirmLoading, setConfirmLoading] = useState(false);
+ const [isLoading, setIsLoading] = useState(false);
+
+ useEffect(() => {
+ const init = async () => {
+ try {
+ setIsLoading(true);
+ //store.product.pageCategories=StrToLower(props.category)
+ await store.product.getDataSubCategories();
+ setIsLoading(false);
+ } catch (e) {
+ setIsLoading(false);
+ }
+ };
+
+ init();
+ }, []);
+
+ const handleEditButton = (data) => {
+ console.log(data, "isi data")
+ form.setFieldsValue({
+ name: data.name,
+ });
+ store.category.visibleModalCategory = true;
+ setIdData(data.id);
+ }
+
+ const columns = [
+ {
+ title: "Product Name",
+ dataIndex: "name",
+ key: "name",
+ },
+ // {
+ // title: "Gangguan",
+ // dataIndex: "status",
+ // key: "status",
+ // render: (text, record) => (
+ //
+ // {capitalize(record?.status)}
+ //
+ // ),
+ // },
+ // {
+ // title: "Tersedia",
+ // dataIndex: "tersedia",
+ // key: "tersedia",
+ // render: (text, record) => (
+ //
+ // {record?.status === "ACTIVE" ? " Ya" : "Tidak"}
+ //
+ // ),
+ // },
+ {
+ title: "Action",
+ key: "action",
+ render: (text, record) => (
+
+
+
+
+ ),
+ },
+ ];
+
+ const deleteData = async (id) => {
+ try {
+ console.log(id);
+ await store.category.delete(id);
+ message.success("Data Berhasil Dihapus");
+ history.push(LINKS.PRODUCT);
+ } catch (err) {
+ console.log("error", err);
+ message.error("Gagal menghapus");
+ }
+ };
+
+ const handleDelete = (id) => {
+ Modal.confirm({
+ title: "Are you sure delete this record?",
+ icon: ,
+ okText: "Yes",
+ okType: "primary",
+ cancelText: "Cancel",
+ onOk() {
+ return deleteData(id);
+ },
+ onCancel() {
+ console.log("Cancel");
+ },
+ });
+ };
+
+ const handleCancel = () => {
+ setIdData('')
+ store.category.visibleModalCategory = false;
+ }
+
+ const handleSubmit = async (data) => {
+ console.log(data, "isi data2")
+ if (idData !== '') {
+ setConfirmLoading(true);
+ try {
+ await store.category.update(idData, data)
+ message.success("Success Update Data Category")
+ } catch (e) {
+ message.error("Failed Update Data Category")
+ }
+ setConfirmLoading(false);
+ store.category.visibleModalCategory = false;
+ setIdData('');
+ form.resetFields();
+ } else {
+ setConfirmLoading(true);
+ try {
+ await store.category.create(data)
+ message.success("Success Add New Category")
+ } catch (e) {
+ console.log(e, "apa errornya")
+ message.error("Failed Add Category")
+ }
+ setConfirmLoading(false);
+ store.category.visibleModalCategory = false;
+ setIdData('');
+ form.resetFields();
+ }
+ }
+
+ return (
+
+
{
+ let pageNumber = page.current;
+ store.product.pageSize = page.pageSize;
+ store.product.page = pageNumber - 1;
+ // store.membership.isLoading = true;
+ await store.product.getData();
+ // store.membership.isLoading = false;
+ }}
+ />
+
+ {
+ form.resetFields();
+ handleCancel();
+ }}
+ onOk={() => {
+ form
+ .validateFields()
+ .then((values) => {
+ console.log(values, "isi form")
+ handleSubmit(values);
+ form.resetFields();
+ })
+ .catch((info) => {
+ console.error("Validate Failed:", info);
+ });
+ }}
+ >
+
+
+
+ );
+});
diff --git a/src/component/PartnerComponent.js b/src/component/PartnerComponent.js
index 64f27ee..87636a0 100644
--- a/src/component/PartnerComponent.js
+++ b/src/component/PartnerComponent.js
@@ -72,7 +72,7 @@ export const PartnerComponent = observer((props) => {
dataIndex: "status",
key: "status",
render: (text, record) => (
-