From 64733a03dad27857beaaad5e4981714df625d8da Mon Sep 17 00:00:00 2001
From: bagusajisaputroo <bagusajisaputro21@gmail.com>
Date: Thu, 27 Mar 2025 11:24:19 +0700
Subject: [PATCH] fix add and update on transaction type

---
 .../transfertype/blocks/AddDialog.tsx         | 37 +++++++++++----
 .../transfertype/blocks/EditDialog.tsx        | 47 ++++++++++++-------
 .../hooks/ManageTransferTypeContext.tsx       | 16 +++----
 3 files changed, 64 insertions(+), 36 deletions(-)

diff --git a/src/pages/transfer/transfertype/blocks/AddDialog.tsx b/src/pages/transfer/transfertype/blocks/AddDialog.tsx
index 2796241..a781c1d 100644
--- a/src/pages/transfer/transfertype/blocks/AddDialog.tsx
+++ b/src/pages/transfer/transfertype/blocks/AddDialog.tsx
@@ -165,10 +165,7 @@ const AddDialog = () => {
     async (e: React.FormEvent<HTMLFormElement>) => {
       e.preventDefault();
       for (const key in formField) {
-        if (
-          formField[key as keyof typeof formField] === '' ||
-          formField[key as keyof typeof formField] === 0
-        ) {
+        if (formField[key as keyof typeof formField] === '') {
           setAlert({ show: true, message: 'All fields must be filled out' });
           return;
         }
@@ -229,6 +226,7 @@ const AddDialog = () => {
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Transfer Type Name
+                      <span className="text-red-500">*</span>
                     </label>
                     <Input
                       className="input"
@@ -246,6 +244,7 @@ const AddDialog = () => {
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Description
+                      <span className="text-red-500">*</span>
                     </label>
                     <Input
                       className="input"
@@ -325,7 +324,10 @@ const AddDialog = () => {
                 </div>
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">From Account</label>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      From Account
+                      <span className="text-red-500">*</span>
+                    </label>
                     <div className="grow">
                       <Select
                         value={formField.wallet_origin}
@@ -350,7 +352,10 @@ const AddDialog = () => {
 
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">To Account</label>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      To Account
+                      <span className="text-red-500">*</span>
+                    </label>
                     <div className="grow">
                       <Select
                         value={formField.wallet_destination}
@@ -374,7 +379,10 @@ const AddDialog = () => {
                 </div>
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">Wallet Destination Fee</label>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Wallet Destination Fee
+                      <span className="text-red-500">*</span>
+                    </label>
                     <div className="grow">
                       <Select
                         value={formField.wallet_fee_destination}
@@ -398,7 +406,10 @@ const AddDialog = () => {
                 </div>
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">Customer Fee Destination</label>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Customer Fee Destination
+                      <span className="text-red-500">*</span>
+                    </label>
                     <div className="grow">
                       <Select
                         value={formField.customer_fee_destination}
@@ -423,7 +434,10 @@ const AddDialog = () => {
 
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">Status Approval</label>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Status Approval
+                      <span className="text-red-500">*</span>
+                    </label>
 
                     <div className="grow">
                       <Select
@@ -446,7 +460,10 @@ const AddDialog = () => {
 
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">Status</label>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Status
+                      <span className="text-red-500"> *</span>
+                    </label>
 
                     <div className="grow">
                       <Select
diff --git a/src/pages/transfer/transfertype/blocks/EditDialog.tsx b/src/pages/transfer/transfertype/blocks/EditDialog.tsx
index 0061789..a94a4de 100644
--- a/src/pages/transfer/transfertype/blocks/EditDialog.tsx
+++ b/src/pages/transfer/transfertype/blocks/EditDialog.tsx
@@ -240,7 +240,7 @@ const EditDialog = () => {
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Transfer Type Name
-                    <span className="text-red-500">*</span>
+                      <span className="text-red-500">*</span>
                     </label>
                     <Input
                       className="input"
@@ -258,7 +258,7 @@ const EditDialog = () => {
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Description
-                    <span className="text-red-500">*</span>
+                      <span className="text-red-500">*</span>
                     </label>
                     <Input
                       className="input"
@@ -276,7 +276,6 @@ const EditDialog = () => {
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Minimum Amount
-                    <span className="text-red-500">*</span>
                     </label>
                     <NumericFormat
                       className="input"
@@ -287,7 +286,7 @@ const EditDialog = () => {
                       onValueChange={(values) => {
                         setFormField((prev) => ({
                           ...prev,
-                          maximum_amount: values.floatValue || 0
+                          minimum_amount: values.floatValue || 0
                         }));
                       }}
                       placeholder="Enter Minimum Amount"
@@ -299,7 +298,6 @@ const EditDialog = () => {
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
                       Maximum Amount
-                    <span className="text-red-500">*</span>
                     </label>
                     <NumericFormat
                       className="input"
@@ -320,8 +318,7 @@ const EditDialog = () => {
                 <div className="w-full">
                   <div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                     <label className="form-label flex items-center gap-1 max-w-56">
-                      Maximum Transaction per day
-                    <span className="text-red-500">*</span>
+                      Max Transaction per day
                     </label>
                     <NumericFormat
                       className="input"
@@ -341,7 +338,9 @@ const EditDialog = () => {
                 </div>
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">From Account<span className="text-red-500">*</span>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      From Account
+                      <span className="text-red-500">*</span>
                     </label>
                     <div className="grow">
                       <Select
@@ -354,8 +353,8 @@ const EditDialog = () => {
                           <SelectValue placeholder="Select Wallet" />
                         </SelectTrigger>
                         <SelectContent>
-                          {wallets.map((wallet) => (
-                            <SelectItem value={wallet.Wallet_id} key={wallet.Wallet_id}>
+                          {wallets.map((wallet, idx) => (
+                            <SelectItem value={wallet.Wallet_id} key={wallet.Wallet_name}>
                               {wallet.Wallet_name}
                             </SelectItem>
                           ))}
@@ -367,7 +366,9 @@ const EditDialog = () => {
 
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">To Account<span className="text-red-500">*</span>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      To Account
+                      <span className="text-red-500">*</span>
                     </label>
                     <div className="grow">
                       <Select
@@ -381,7 +382,7 @@ const EditDialog = () => {
                         </SelectTrigger>
                         <SelectContent>
                           {wallets.map((wallet, idx) => (
-                            <SelectItem value={wallet.Wallet_id} key={wallet.Wallet_name}>
+                            <SelectItem value={wallet.Wallet_id} key={wallet.Wallet_id}>
                               {wallet.Wallet_name}
                             </SelectItem>
                           ))}
@@ -392,7 +393,9 @@ const EditDialog = () => {
                 </div>
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">Wallet Fee Destination<span className="text-red-500">*</span>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Wallet Destination Fee
+                      <span className="text-red-500">*</span>
                     </label>
                     <div className="grow">
                       <Select
@@ -406,7 +409,7 @@ const EditDialog = () => {
                         </SelectTrigger>
                         <SelectContent>
                           {wallets.map((wallet, idx) => (
-                            <SelectItem value={wallet.Wallet_id} key={wallet.Wallet_name}>
+                            <SelectItem value={wallet.Wallet_id} key={wallet.Wallet_id}>
                               {wallet.Wallet_name}
                             </SelectItem>
                           ))}
@@ -417,7 +420,9 @@ const EditDialog = () => {
                 </div>
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">Select Customer<span className="text-red-500">*</span>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Customer Fee Destination
+                      <span className="text-red-500">*</span>
                     </label>
                     <div className="grow">
                       <Select
@@ -427,7 +432,7 @@ const EditDialog = () => {
                         }
                       >
                         <SelectTrigger>
-                          <SelectValue placeholder="Select" />
+                          <SelectValue placeholder="Select Customer" />
                         </SelectTrigger>
                         <SelectContent>
                           {customers.map((customer, idx) => (
@@ -440,9 +445,12 @@ const EditDialog = () => {
                     </div>
                   </div>
                 </div>
+
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">Status Approval<span className="text-red-500">*</span>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Status Approval
+                      <span className="text-red-500">*</span>
                     </label>
 
                     <div className="grow">
@@ -466,7 +474,9 @@ const EditDialog = () => {
 
                 <div className="w-full">
                   <div className="flex items-center flex-wrap gap-2.5">
-                    <label className="form-label max-w-56">Status<span className="text-red-500">*</span>
+                    <label className="form-label flex items-center gap-1 max-w-56">
+                      Status
+                      <span className="text-red-500"> *</span>
                     </label>
 
                     <div className="grow">
@@ -487,6 +497,7 @@ const EditDialog = () => {
                     </div>
                   </div>
                 </div>
+
                 <div className="flex justify-end pt-2.5 gap-5">
                   <Button
                     variant={'outline'}
diff --git a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx
index 33595fd..ef182c6 100644
--- a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx
+++ b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx
@@ -85,6 +85,14 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React
         enableHiding: false,
         meta: { headerClassName: 'w-[250px]' }
       },
+      {
+        accessorFn: (row) => row.description,
+        id: 'description',
+        header: ({ column }) => <DataGridColumnHeader title="Description" column={column} />,
+        enableSorting: true,
+        enableHiding: false,
+        meta: { headerClassName: 'w-[250px]' }
+      },
       {
         accessorFn: (row) => row.wallet_origin?.name || 'N/A',
         id: 'wallet_origin',
@@ -127,14 +135,6 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React
         enableHiding: false,
         meta: { headerClassName: 'w-[250px]' }
       },
-      {
-        accessorFn: (row) => row.description,
-        id: 'description',
-        header: ({ column }) => <DataGridColumnHeader title="Description" column={column} />,
-        enableSorting: true,
-        enableHiding: false,
-        meta: { headerClassName: 'w-[250px]' }
-      },
       {
         accessorFn: (row) => row.wallet_fee_destination.name,
         id: 'wallet_fee_destination',