ui done

apps/Backend/src/routes/payments.ts

@@ -221,7 +221,7 @@ router.delete("/:id", async (req: Request, res: Response): Promise<any> => {
     if (!userId) return res.status(401).json({ message: "Unauthorized" });
 
     const id = parseIntOrError(req.params.id, "Payment ID");
-    await storage.deletePayment(userId, id);
+    await storage.deletePayment(id, userId);
 
     res.status(200).json({ message: "Payment deleted successfully" });
   } catch (err: unknown) {

apps/Frontend/src/components/payments/payment-edit-modal.tsx

@@ -26,9 +26,8 @@ import {
   SelectItem,
   SelectTrigger,
   SelectValue,
-} from "@radix-ui/react-select";
+} from "@/components/ui/select";
 import { Input } from "@/components/ui/input";
-import Decimal from "decimal.js";
 import { toast } from "@/hooks/use-toast";
 
 type PaymentEditModalProps = {
@@ -47,7 +46,7 @@ export default function PaymentEditModal({
   onEditServiceLine,
 }: PaymentEditModalProps) {
   if (!payment) return null;
-
+  
   const [expandedLineId, setExpandedLineId] = useState<number | null>(null);
   const [paymentStatus, setPaymentStatus] = React.useState<PaymentStatus>(
     payment.status
@@ -167,15 +166,15 @@ export default function PaymentEditModal({
               <div className="mt-2 space-y-1">
                 <p>
                   <span className="text-gray-500">Total Billed:</span> $
-                  {payment.totalBilled.toNumber().toFixed(2)}
+                  {Number(payment.totalBilled || 0).toFixed(2)}
                 </p>
                 <p>
                   <span className="text-gray-500">Total Paid:</span> $
-                  {payment.totalPaid.toNumber().toFixed(2)}
+                  {Number(payment.totalPaid || 0).toFixed(2)}
                 </p>
                 <p>
                   <span className="text-gray-500">Total Due:</span> $
-                  {payment.totalDue.toNumber().toFixed(2)}
+                  {Number(payment.totalDue || 0).toFixed(2)}
                 </p>
                 <div className="pt-2">
                   <label className="text-sm text-gray-600">Status</label>
@@ -237,19 +236,19 @@ export default function PaymentEditModal({
                         </p>
                         <p>
                           <span className="text-gray-500">Billed:</span> $
-                          {line.totalBilled.toFixed(2)}
+                          {Number(line.totalBilled || 0).toFixed(2)}
                         </p>
                         <p>
                           <span className="text-gray-500">Paid:</span> $
-                          {line.totalPaid.toFixed(2)}
+                          {Number(line.totalPaid || 0).toFixed(2)}
                         </p>
                         <p>
                           <span className="text-gray-500">Adjusted:</span> $
-                          {line.totalAdjusted.toFixed(2)}
+                          {Number(line.totalAdjusted || 0).toFixed(2)}
                         </p>
                         <p>
                           <span className="text-gray-500">Due:</span> $
-                          {line.totalDue.toFixed(2)}
+                          {Number(line.totalDue || 0).toFixed(2)}
                         </p>
 
                         <div className="pt-2">
@@ -265,7 +264,7 @@ export default function PaymentEditModal({
                         </div>
 
                         {expandedLineId === line.id && (
-                          <div className="mt-3 space-y-2">
+                          <div className="mt-3 space-y-4">
                             <div className="space-y-1">
                               <label
                                 htmlFor={`paid-${line.id}`}
@@ -315,11 +314,14 @@ export default function PaymentEditModal({
                               <Select
                                 value={formState.method}
                                 onValueChange={(value: PaymentMethod) =>
-                                  updateField("method", value)
+                                  setFormState((prev) => ({
+                                    ...prev,
+                                    method: value,
+                                  }))
                                 }
                               >
                                 <SelectTrigger>
-                                  <SelectValue />
+                                  <SelectValue placeholder="Select a payment method" />
                                 </SelectTrigger>
                                 <SelectContent>
                                   {paymentMethodOptions.map((methodOption) => (
@@ -381,7 +383,7 @@ export default function PaymentEditModal({
                               size="sm"
                               onClick={() => handleSavePayment()}
                             >
-                              Save
+                              Update
                             </Button>
                           </div>
                         )}

apps/Frontend/src/components/payments/payments-recent-table.tsx

@@ -355,9 +355,9 @@ export default function PaymentsRecentTable({
               </TableRow>
             ) : (
               paymentsData?.payments.map((payment) => {
-                const totalBilled = payment.totalBilled.toNumber();
-                const totalPaid = payment.totalPaid.toNumber();
-                const totalDue = payment.totalDue.toNumber();
+                const totalBilled = Number(payment.totalBilled || 0);
+                const totalPaid = Number(payment.totalPaid || 0);
+                const totalDue = Number(payment.totalDue || 0);
 
                 return (
                   <TableRow key={payment.id}>
@@ -379,8 +379,8 @@ export default function PaymentsRecentTable({
                     <TableCell>
                       <div className="flex flex-col gap-1">
                         <span>
-                          <strong>Total Billed:</strong> $
-                          {totalBilled.toFixed(2)}
+                          <strong>Total Billed:</strong> $ 
+                          {Number(totalBilled).toFixed(2)}
                         </span>
                         <span>
                           <strong>Total Paid:</strong> ${totalPaid.toFixed(2)}
@@ -454,7 +454,7 @@ export default function PaymentsRecentTable({
         isOpen={isDeletePaymentOpen}
         onConfirm={handleConfirmDeletePayment}
         onCancel={() => setIsDeletePaymentOpen(false)}
-        entityName={String(currentPayment?.claimId)}
+        entityName={`ClaimID : ${currentPayment?.claimId}`}
       />
 
       {/* /will hanlde both modal later */}