feat: United/DentalHub + Tufts SCO pre-auth, cloud storage search & file thumbnails

- Add United/DentalHub pre-authorization Selenium worker, helpers, backend route/processor/client, and frontend OTP modal + wired button - Add Tufts SCO pre-authorization Selenium worker, helpers, backend route/processor/client, and frontend OTP modal + wired button - Fix btnSubmitAuthorization selector for UnitedDH preauth step2 - Fix Tufts SCO preauth step3 to target <span>pre-authorization</span> button - Cloud storage search: default to "both" mode so patient folder names match on first search - Cloud storage folder panel: auto-scroll to panel when opened from search results - Cloud storage files: show inline image thumbnails and PDF badge in file grid Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-06-13 00:03:58 -04:00
parent fd4feb3e76
commit 3978b16d7d
20 changed files with 4044 additions and 19 deletions
@@ -2259,8 +2259,10 @@ export default function AppointmentsPage() {
          onHandleForMHSeleniumClaimPreAuth={() => {}}
          onHandleForCCASeleniumClaim={() => {}}
          onHandleForCCASeleniumPreAuth={() => {}}
+          onHandleForUnitedDHSeleniumPreAuth={() => {}}
          onHandleForDDMASeleniumClaim={() => {}}
          onHandleForUnitedDHSeleniumClaim={() => {}}
+          onHandleForTuftsSCOSeleniumPreAuth={() => {}}
          onHandleForTuftsSCOSeleniumClaim={() => {}}
        />
      )}
@@ -63,9 +63,15 @@ export default function ClaimsPage() {
  const [unitedDHClaimOtpOpen, setUnitedDHClaimOtpOpen] = useState(false);
  const [unitedDHClaimOtpSubmitting, setUnitedDHClaimOtpSubmitting] = useState(false);
  const unitedDHClaimSessionIdRef = useRef<string | null>(null);
+  const [unitedDHPreAuthOtpOpen, setUnitedDHPreAuthOtpOpen] = useState(false);
+  const [unitedDHPreAuthOtpSubmitting, setUnitedDHPreAuthOtpSubmitting] = useState(false);
+  const unitedDHPreAuthSessionIdRef = useRef<string | null>(null);
  const [tuftsSCOClaimOtpOpen, setTuftsSCOClaimOtpOpen] = useState(false);
  const [tuftsSCOClaimOtpSubmitting, setTuftsSCOClaimOtpSubmitting] = useState(false);
  const tuftsSCOClaimSessionIdRef = useRef<string | null>(null);
+  const [tuftsSCOPreAuthOtpOpen, setTuftsSCOPreAuthOtpOpen] = useState(false);
+  const [tuftsSCOPreAuthOtpSubmitting, setTuftsSCOPreAuthOtpSubmitting] = useState(false);
+  const tuftsSCOPreAuthSessionIdRef = useRef<string | null>(null);
  const pendingClaimMeta = useRef<{
    patientId: number | null;
    groupKey: "INSURANCE_CLAIM" | "INSURANCE_CLAIM_PREAUTH";
@@ -582,6 +588,136 @@ export default function ClaimsPage() {
    }
  };

+  const handleUnitedDHPreAuthOtpSubmit = async (otp: string) => {
+    const sessionId = unitedDHPreAuthSessionIdRef.current;
+    if (!sessionId) return;
+    try {
+      setUnitedDHPreAuthOtpSubmitting(true);
+      const resp = await apiRequest("POST", "/api/claims/uniteddh-preauth/selenium/submit-otp", {
+        session_id: sessionId,
+        otp,
+        socketId,
+      });
+      const data = await resp.json();
+      if (!resp.ok || data.error) throw new Error(data.error || "Failed to submit OTP");
+      setUnitedDHPreAuthOtpOpen(false);
+      dispatch(setTaskStatus({ key: "claimSubmit", status: "pending", message: "OTP submitted. Continuing United/DentalHub pre-authorization..." }));
+    } catch (err: any) {
+      toast({ title: "Failed to submit OTP", description: err?.message || "Error submitting OTP", variant: "destructive" });
+    } finally {
+      setUnitedDHPreAuthOtpSubmitting(false);
+    }
+  };
+
+  // United/DentalHub pre-auth selenium handler
+  const handleUnitedDHPreAuthSubmitSelenium = async (data: any) => {
+    try {
+      dispatch(setTaskStatus({ key: "claimSubmit", status: "pending", message: "Submitting United/DentalHub pre-authorization..." }));
+      const response = await apiRequest("POST", "/api/claims/uniteddh-preauth", {
+        data,
+        socketId,
+      });
+      const result = await response.json();
+      if (result.error) throw new Error(result.error);
+      pendingClaimMeta.current = { patientId: selectedPatientId, groupKey: "INSURANCE_CLAIM_PREAUTH" };
+      setPendingClaimJobId(result.jobId);
+
+      const jobId = result.jobId;
+      const onSessionStarted = (ev: any) => {
+        if (String(ev?.jobId) !== String(jobId)) return;
+        unitedDHPreAuthSessionIdRef.current = ev.session_id ?? null;
+      };
+      const onOtpRequired = (ev: any) => {
+        if (String(ev?.jobId) !== String(jobId)) return;
+        if (ev.session_id) unitedDHPreAuthSessionIdRef.current = ev.session_id;
+        setUnitedDHPreAuthOtpOpen(true);
+        dispatch(setTaskStatus({ key: "claimSubmit", status: "pending", message: "OTP required for United/DentalHub. Please enter the code." }));
+      };
+      const onDone = (ev: any) => {
+        if (String(ev?.jobId) !== String(jobId)) return;
+        socket.off("selenium:uniteddh_preauth_started", onSessionStarted);
+        socket.off("selenium:otp_required", onOtpRequired);
+        socket.off("job:update", onDone);
+        setUnitedDHPreAuthOtpOpen(false);
+        unitedDHPreAuthSessionIdRef.current = null;
+      };
+      socket.on("selenium:uniteddh_preauth_started", onSessionStarted);
+      socket.on("selenium:otp_required", onOtpRequired);
+      socket.on("job:update", onDone);
+
+      dispatch(setTaskStatus({ key: "claimSubmit", status: "pending", message: "United/DentalHub pre-auth queued. Awaiting Selenium..." }));
+      toast({ title: "United/DentalHub PreAuth queued", description: "Selenium is opening the pre-authorization form.", variant: "default" });
+    } catch (error: any) {
+      dispatch(setTaskStatus({ key: "claimSubmit", status: "error", message: error.message || "United/DentalHub pre-auth failed" }));
+      toast({ title: "United/DentalHub PreAuth error", description: error.message || "An error occurred.", variant: "destructive" });
+    }
+  };
+
+  const handleTuftsSCOPreAuthOtpSubmit = async (otp: string) => {
+    const sessionId = tuftsSCOPreAuthSessionIdRef.current;
+    if (!sessionId) return;
+    try {
+      setTuftsSCOPreAuthOtpSubmitting(true);
+      const resp = await apiRequest("POST", "/api/claims/tuftssco-preauth/selenium/submit-otp", {
+        session_id: sessionId,
+        otp,
+        socketId,
+      });
+      const data = await resp.json();
+      if (!resp.ok || data.error) throw new Error(data.error || "Failed to submit OTP");
+      setTuftsSCOPreAuthOtpOpen(false);
+      dispatch(setTaskStatus({ key: "claimSubmit", status: "pending", message: "OTP submitted. Continuing Tufts SCO pre-authorization..." }));
+    } catch (err: any) {
+      toast({ title: "Failed to submit OTP", description: err?.message || "Error submitting OTP", variant: "destructive" });
+    } finally {
+      setTuftsSCOPreAuthOtpSubmitting(false);
+    }
+  };
+
+  // Tufts SCO pre-auth selenium handler
+  const handleTuftsSCOPreAuthSubmitSelenium = async (data: any) => {
+    try {
+      dispatch(setTaskStatus({ key: "claimSubmit", status: "pending", message: "Submitting Tufts SCO pre-authorization..." }));
+      const response = await apiRequest("POST", "/api/claims/tuftssco-preauth", {
+        data,
+        socketId,
+      });
+      const result = await response.json();
+      if (result.error) throw new Error(result.error);
+      pendingClaimMeta.current = { patientId: selectedPatientId, groupKey: "INSURANCE_CLAIM_PREAUTH" };
+      setPendingClaimJobId(result.jobId);
+
+      const jobId = result.jobId;
+      const onSessionStarted = (ev: any) => {
+        if (String(ev?.jobId) !== String(jobId)) return;
+        tuftsSCOPreAuthSessionIdRef.current = ev.session_id ?? null;
+      };
+      const onOtpRequired = (ev: any) => {
+        if (String(ev?.jobId) !== String(jobId)) return;
+        if (ev.session_id) tuftsSCOPreAuthSessionIdRef.current = ev.session_id;
+        setTuftsSCOPreAuthOtpOpen(true);
+        dispatch(setTaskStatus({ key: "claimSubmit", status: "pending", message: "OTP required for Tufts SCO. Please enter the code." }));
+      };
+      const onDone = (ev: any) => {
+        if (String(ev?.jobId) !== String(jobId)) return;
+        socket.off("selenium:tuftssco_preauth_started", onSessionStarted);
+        socket.off("selenium:otp_required", onOtpRequired);
+        socket.off("job:update", onDone);
+        setTuftsSCOPreAuthOtpOpen(false);
+        tuftsSCOPreAuthSessionIdRef.current = null;
+      };
+      socket.on("selenium:tuftssco_preauth_started", onSessionStarted);
+      socket.on("selenium:otp_required", onOtpRequired);
+      socket.on("job:update", onDone);
+
+      dispatch(setTaskStatus({ key: "claimSubmit", status: "pending", message: "Tufts SCO pre-auth queued. Awaiting Selenium..." }));
+      toast({ title: "Tufts SCO PreAuth queued", description: "Selenium is opening the pre-authorization form.", variant: "default" });
+    } catch (error: any) {
+      dispatch(setTaskStatus({ key: "claimSubmit", status: "error", message: error.message || "Tufts SCO pre-auth failed" }));
+      toast({ title: "Tufts SCO PreAuth error", description: error.message || "An error occurred.", variant: "destructive" });
+    }
+  };
+
  // United/DentalHub claim selenium handler
  const handleUnitedDHClaimSubmitSelenium = async (data: any) => {
    try {
@@ -951,8 +1087,10 @@ export default function ClaimsPage() {
          onHandleForMHSeleniumClaimPreAuth={handleMHClaimPreAuthSubmitSelenium}
          onHandleForCCASeleniumClaim={handleCCAClaimSubmitSelenium}
          onHandleForCCASeleniumPreAuth={handleCCAPreAuthSubmitSelenium}
+          onHandleForUnitedDHSeleniumPreAuth={handleUnitedDHPreAuthSubmitSelenium}
          onHandleForDDMASeleniumClaim={handleDDMAClaimSubmitSelenium}
          onHandleForUnitedDHSeleniumClaim={handleUnitedDHClaimSubmitSelenium}
+          onHandleForTuftsSCOSeleniumPreAuth={handleTuftsSCOPreAuthSubmitSelenium}
          onHandleForTuftsSCOSeleniumClaim={handleTuftsSCOClaimSubmitSelenium}
          isLicensed={isLicensed}
        />
@@ -1048,6 +1186,84 @@ export default function ClaimsPage() {
        </div>
      )}

+      {/* United/DentalHub PreAuth OTP Modal */}
+      {unitedDHPreAuthOtpOpen && (
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/40">
+          <div className="bg-white dark:bg-slate-900 rounded-xl shadow-lg w-full max-w-md p-6">
+            <div className="flex items-center justify-between mb-4">
+              <h2 className="text-lg font-semibold">Enter OTP — United/DentalHub PreAuth</h2>
+              <button type="button" onClick={() => setUnitedDHPreAuthOtpOpen(false)} className="text-slate-500 hover:text-slate-800">✕</button>
+            </div>
+            <p className="text-sm text-slate-500 mb-4">
+              The United/DentalHub portal requires a one-time password (OTP) to continue pre-authorization submission.
+            </p>
+            <form onSubmit={(e) => {
+              e.preventDefault();
+              const input = (e.currentTarget.elements.namedItem("otp") as HTMLInputElement);
+              if (input?.value.trim()) handleUnitedDHPreAuthOtpSubmit(input.value.trim());
+            }} className="space-y-4">
+              <div className="space-y-2">
+                <label htmlFor="uniteddh-preauth-otp" className="text-sm font-medium">OTP</label>
+                <input
+                  id="uniteddh-preauth-otp"
+                  name="otp"
+                  placeholder="Enter OTP code"
+                  autoFocus
+                  className="w-full border rounded-md px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary"
+                />
+              </div>
+              <div className="flex justify-end gap-3">
+                <button type="button" onClick={() => setUnitedDHPreAuthOtpOpen(false)} disabled={unitedDHPreAuthOtpSubmitting}
+                  className="px-4 py-2 text-sm border rounded-md hover:bg-slate-50 disabled:opacity-50">Cancel</button>
+                <button type="submit" disabled={unitedDHPreAuthOtpSubmitting}
+                  className="px-4 py-2 text-sm bg-primary text-white rounded-md hover:bg-primary/90 disabled:opacity-50">
+                  {unitedDHPreAuthOtpSubmitting ? "Submitting..." : "Submit OTP"}
+                </button>
+              </div>
+            </form>
+          </div>
+        </div>
+      )}
+
+      {/* Tufts SCO PreAuth OTP Modal */}
+      {tuftsSCOPreAuthOtpOpen && (
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/40">
+          <div className="bg-white dark:bg-slate-900 rounded-xl shadow-lg w-full max-w-md p-6">
+            <div className="flex items-center justify-between mb-4">
+              <h2 className="text-lg font-semibold">Enter OTP — Tufts SCO PreAuth</h2>
+              <button type="button" onClick={() => setTuftsSCOPreAuthOtpOpen(false)} className="text-slate-500 hover:text-slate-800">✕</button>
+            </div>
+            <p className="text-sm text-slate-500 mb-4">
+              The Tufts SCO (DentaQuest) portal requires a one-time password (OTP) to continue pre-authorization submission.
+            </p>
+            <form onSubmit={(e) => {
+              e.preventDefault();
+              const input = (e.currentTarget.elements.namedItem("otp") as HTMLInputElement);
+              if (input?.value.trim()) handleTuftsSCOPreAuthOtpSubmit(input.value.trim());
+            }} className="space-y-4">
+              <div className="space-y-2">
+                <label htmlFor="tuftssco-preauth-otp" className="text-sm font-medium">OTP</label>
+                <input
+                  id="tuftssco-preauth-otp"
+                  name="otp"
+                  placeholder="Enter OTP code"
+                  autoFocus
+                  className="w-full border rounded-md px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary"
+                />
+              </div>
+              <div className="flex justify-end gap-3">
+                <button type="button" onClick={() => setTuftsSCOPreAuthOtpOpen(false)} disabled={tuftsSCOPreAuthOtpSubmitting}
+                  className="px-4 py-2 text-sm border rounded-md hover:bg-slate-50 disabled:opacity-50">Cancel</button>
+                <button type="submit" disabled={tuftsSCOPreAuthOtpSubmitting}
+                  className="px-4 py-2 text-sm bg-primary text-white rounded-md hover:bg-primary/90 disabled:opacity-50">
+                  {tuftsSCOPreAuthOtpSubmitting ? "Submitting..." : "Submit OTP"}
+                </button>
+              </div>
+            </form>
+          </div>
+        </div>
+      )}
+
      {/* United/DentalHub Claim OTP Modal */}
      {unitedDHClaimOtpOpen && (
        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/40">
@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { useSearch } from "wouter";
 import { useQueryClient } from "@tanstack/react-query";
 import { Button } from "@/components/ui/button";
@@ -28,6 +28,7 @@ export default function CloudStoragePage() {
  const [panelInitialFolderId, setPanelInitialFolderId] = useState<
    number | null
  >(null);
+  const panelRef = useRef<HTMLDivElement>(null);

  // Deep-link: if navigated here with ?folderId=XXX, open that folder automatically
  useEffect(() => {
@@ -53,6 +54,9 @@ export default function CloudStoragePage() {
  function handleOpenFolder(folderId: number | null) {
    setPanelInitialFolderId(folderId);
    setPanelOpen(true);
+    setTimeout(() => {
+      panelRef.current?.scrollIntoView({ behavior: "smooth", block: "start" });
+    }, 50);
  }

  function handleSelectFile(fileId: number) {
@@ -131,6 +135,7 @@ export default function CloudStoragePage() {
      />

      {/* FolderPanel lives in page so it can be reused with other UI */}
+      <div ref={panelRef} />
      {panelOpen && (
        <FolderPanel
          folderId={panelInitialFolderId}