fix: fix remote browser socket connection and related updates

apps/Frontend/src/components/claims/claim-form.tsx

@@ -402,6 +402,9 @@ export function ClaimForm({
         setForm((prev) => ({
           ...prev,
           serviceLines: mappedLines,
+          ...(data.appointmentFiles?.length
+            ? { claimFiles: data.appointmentFiles }
+            : {}),
         }));
 
         // Restore NPI provider from saved procedures
@@ -1094,6 +1097,10 @@ export function ClaimForm({
       : null;
 
     try {
+      const attachments = form.uploadedFiles?.length
+        ? await uploadAttachmentsToLocalFolder(form.uploadedFiles)
+        : [];
+
       const res = await apiRequest("POST", "/api/appointment-procedures/save-for-appointment", {
         appointmentId,
         patientId,
@@ -1104,16 +1111,42 @@ export function ClaimForm({
           toothNumber: l.toothNumber || null,
           toothSurface: l.toothSurface || null,
         })),
+        attachments,
       });
       const data = await res.json();
       if (!data.success) throw new Error("Failed to save procedures");
-      toast({ title: "Procedures saved", description: `${data.count} procedure(s) saved.` });
+      const attachMsg = attachments.length ? ` and ${attachments.length} attachment(s)` : "";
+      toast({ title: "Procedures saved", description: `${data.count} procedure(s)${attachMsg} saved.` });
       onClose();
     } catch (err: any) {
       toast({ title: "Save failed", description: err?.message ?? "Failed to save procedures.", variant: "destructive" });
     }
   };
 
+  // Same as handleProceduresSave but also resets any existing submitted claim so
+  // batch-column will treat this appointment as needing a new submission.
+  const handleProceduresUpdate = async () => {
+    if (!appointmentId) return;
+    try {
+      await apiRequest("POST", "/api/claims/reset-for-resubmit", { appointmentId });
+    } catch {
+      // Non-fatal: if reset fails we still save procedures
+    }
+    await handleProceduresSave();
+  };
+
+  // Marks the claim for this appointment as VOID so batch-column will always skip it.
+  const handleProceduresVoid = async () => {
+    if (!appointmentId) return;
+    try {
+      await apiRequest("POST", "/api/claims/void-for-appointment", { appointmentId });
+      toast({ title: "Claim voided", description: "This appointment will be skipped when claiming for the column." });
+      onClose();
+    } catch (err: any) {
+      toast({ title: "Void failed", description: err?.message ?? "Failed to void claim.", variant: "destructive" });
+    }
+  };
+
   // for direct combo button.
   const applyComboAndThenMH = async (
     comboId: keyof typeof PROCEDURE_COMBOS,
@@ -1720,15 +1753,29 @@ export function ClaimForm({
                 {proceduresOnly ? "Save Procedures" : "Insurance Carriers"}
               </h3>
               {proceduresOnly ? (
-                /* ── Select Procedures mode: Save only ── */
-                <div className="flex justify-center">
+                /* ── Select Procedures mode ── */
+                <div className="flex justify-center gap-3">
                   <Button
-                    className="w-48"
+                    className="w-40"
                     variant="default"
                     onClick={handleProceduresSave}
                   >
                     Save Procedures
                   </Button>
+                  <Button
+                    className="w-40"
+                    variant="secondary"
+                    onClick={handleProceduresUpdate}
+                  >
+                    Update &amp; Resubmit
+                  </Button>
+                  <Button
+                    className="w-28"
+                    variant="destructive"
+                    onClick={handleProceduresVoid}
+                  >
+                    Void
+                  </Button>
                 </div>
               ) : (
                 /* ── Insurance Claim mode: submit buttons, no Save ── */

apps/Frontend/src/lib/socket.ts

@@ -8,8 +8,11 @@ import { io, Socket } from "socket.io-client";
 
 // Connect directly to backend to avoid Vite's WS proxy failing on upgrade,
 // which causes an unhandled AggregateError from engine.io's Promise.any() probe.
+// Use the env var when set; otherwise derive the backend URL from the current
+// page's hostname so remote browsers (non-localhost) reach the server correctly.
 const SOCKET_URL =
-  import.meta.env.VITE_API_BASE_URL_BACKEND || "http://localhost:5000";
+  import.meta.env.VITE_API_BASE_URL_BACKEND ||
+  `${window.location.protocol}//${window.location.hostname}:5000`;
 
 export const socket: Socket = io(SOCKET_URL, {
   withCredentials: true,

apps/Frontend/src/pages/insurance-status-page.tsx

@@ -470,9 +470,6 @@ export default function InsuranceStatusPage() {
 
         {/* Insurance Eligibility Check Form */}
         <Card className="mb-6">
-          <CardHeader>
-            <CardTitle>Check Insurance Eligibility</CardTitle>
-          </CardHeader>
           <CardContent>
             <div className="grid grid-cols-4 md:grid-cols-4 gap-4 mb-4">
               <div className="space-y-2">

apps/Frontend/vite.config.ts

@@ -13,6 +13,7 @@ export default defineConfig(({ mode }) => {
       fs: {
         allow: [".."],
       },
+      allowedHosts: ["communitydentistsoflowell.mydentalofficemanagement.com"],
       proxy: {
         "/api": {
           target: env.VITE_API_BASE_URL_BACKEND || "http://localhost:5000",