Handling Error

src/component/TopupsaldoModal.js

@@ -1,8 +1,8 @@
-import React, {useContext} from "react";
-import {Form, Input, message, Modal} from "antd";
-import {observer} from "mobx-react-lite";
-import {useStore} from "../utils/useStore";
-import {ModalLoaderContext} from "../utils/modal";
+import React, { useContext } from "react";
+import { Form, Input, message, Modal, InputNumber } from "antd";
+import { observer } from "mobx-react-lite";
+import { useStore } from "../utils/useStore";
+import { ModalLoaderContext } from "../utils/modal";
 
 export const TopupsaldoModal = observer((props) => {
   const store = useStore();
@@ -27,7 +27,7 @@ export const TopupsaldoModal = observer((props) => {
     store.supplier.visibleModalTransaction = false;
     form.resetFields();
   };
-  
+
   return (
     <div>
       <Modal
@@ -55,21 +55,27 @@ export const TopupsaldoModal = observer((props) => {
         <Form
           form={form}
           layout="vertical"
-          initialValues={{supplier: store.supplier.code}}
+          initialValues={{ supplier: store.supplier.code }}
         >
           <Form.Item
             name="supplier"
             label="Supplier"
-            rules={[{required: true, message: "Please input supplier!"}]}
+            rules={[{ required: true, message: "Please input supplier!" }]}
           >
-            <Input disabled={true}/>
+            <Input disabled={true} />
           </Form.Item>
           <Form.Item
             name="amount"
             label="Amount"
-            rules={[{required: true, message: "Please input amount!"}]}
+            rules={[{ required: true, message: "Please input amount!" }]}
           >
-            <Input/>
+            <InputNumber
+              style={{ width: "100%" }}
+              formatter={(value) =>
+                `Rp. ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ",")
+              }
+              parser={(value) => value.replace(/\Rp.\s?|(,*)/g, "")}
+            />
           </Form.Item>
         </Form>
       </Modal>