feat: make claim number editable in Edit Claim Status modal

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

apps/Backend/src/routes/claims.ts

@@ -1287,6 +1287,7 @@ router.put("/:id", async (req: Request, res: Response): Promise<any> => {
       serviceDate: toOptionalDate(req.body.serviceDate),
       insuranceProvider: req.body.insuranceProvider,
       status: req.body.status,
+      ...(req.body.claimNumber != null ? { claimNumber: req.body.claimNumber } : {}),
       ...(req.body.npiProviderId ? { npiProviderId: Number(req.body.npiProviderId) } : {}),
     });
     const updatedClaim = await storage.updateClaim(claimId, claimData);

apps/Frontend/src/components/claims/claim-edit-modal.tsx

@@ -6,6 +6,7 @@ import {
   DialogDescription,
 } from "@/components/ui/dialog";
 import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
 import {
   Select,
   SelectContent,
@@ -43,6 +44,9 @@ export default function ClaimEditModal({
   const [status, setStatus] = useState<ClaimStatus>(
     claim?.status ?? ("PENDING" as ClaimStatus)
   );
+  const [claimNumber, setClaimNumber] = useState<string>(
+    (claim as any)?.claimNumber ?? ""
+  );
   const [selectedNpiProviderId, setSelectedNpiProviderId] = useState<number | null>(
     (claim as any)?.npiProviderId ?? null
   );
@@ -72,6 +76,7 @@ export default function ClaimEditModal({
     const updatedClaim: ClaimWithServiceLines = {
       ...claim,
       status,
+      claimNumber: claimNumber.trim() || null,
       npiProviderId: selectedNpiProviderId,
       npiProvider: npiProviders.find((p) => p.id === selectedNpiProviderId) ?? null,
     } as ClaimWithServiceLines;
@@ -100,7 +105,7 @@ export default function ClaimEditModal({
                 Claim ID: {claim.id?.toString().padStart(4, "0")}
               </p>
               <p className="text-gray-500">
-                Claim No: {claim.claimNumber || "—"}
+                Claim No: {claimNumber || "—"}
               </p>
             </div>
           </div>
@@ -160,10 +165,15 @@ export default function ClaimEditModal({
             <div>
               <h4 className="font-medium text-gray-900">Insurance Details</h4>
               <div className="mt-2 space-y-2">
-                <p>
+                <div>
-                  <span className="text-gray-500">Claim Number:</span>{" "}
+                  <span className="text-gray-500">Claim Number:</span>
-                  {claim.claimNumber || "—"}
+                  <Input
-                </p>
+                    className="mt-1"
+                    value={claimNumber}
+                    onChange={(e) => setClaimNumber(e.target.value)}
+                    placeholder="Enter claim number"
+                  />
+                </div>
                 <p>
                   <span className="text-gray-500">Insurance Provider:</span>{" "}
                   {claim.insuranceProvider || "N/A"}

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

@@ -136,6 +136,9 @@ export default function ClaimsRecentTable({
     mutationFn: async (claim: ClaimWithServiceLines) => {
       const response = await apiRequest("PUT", `/api/claims/${claim.id}`, {
         status: claim.status,
+        ...((claim as any).claimNumber != null
+          ? { claimNumber: (claim as any).claimNumber }
+          : {}),
         ...((claim as any).npiProviderId != null
           ? { npiProviderId: (claim as any).npiProviderId }
           : {}),