Gitead
1edf73fdc8
- Add all new Frontend source files (pages, components, hooks, utils) - Add selenium_MHBatchPaymentCheckWorker.py and MHSinglePaymentCheckWorker.py - Add install-steps-5-13.sh setup script - Update .gitignore to exclude runtime/sensitive data (backups, uploads, chat-history, keys, downloads, generated .d.ts files) while keeping folders - Add .gitkeep to preserve empty runtime folders in git Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
328 lines
15 KiB
JavaScript
328 lines
15 KiB
JavaScript
import { useEffect, useRef, useState } from "react";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Label } from "@/components/ui/label";
|
|
import { CheckCircle, LoaderCircleIcon, X } from "lucide-react";
|
|
import { useToast } from "@/hooks/use-toast";
|
|
import { apiRequest, queryClient } from "@/lib/queryClient";
|
|
import { useAppDispatch } from "@/redux/hooks";
|
|
import { setTaskStatus } from "@/redux/slices/seleniumTaskSlice";
|
|
import { formatLocalDate } from "@/utils/dateUtils";
|
|
import { socket } from "@/lib/socket";
|
|
import { QK_PATIENTS_BASE } from "@/components/patients/patient-table";
|
|
function DdmaOtpModal({ open, onClose, onSubmit, isSubmitting }) {
|
|
const [otp, setOtp] = useState("");
|
|
useEffect(() => {
|
|
if (!open)
|
|
setOtp("");
|
|
}, [open]);
|
|
if (!open)
|
|
return null;
|
|
const handleSubmit = async (e) => {
|
|
e.preventDefault();
|
|
if (!otp.trim())
|
|
return;
|
|
await onSubmit(otp.trim());
|
|
};
|
|
return (<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</h2>
|
|
<button type="button" onClick={onClose} className="text-slate-500 hover:text-slate-800">
|
|
<X className="w-4 h-4"/>
|
|
</button>
|
|
</div>
|
|
<p className="text-sm text-slate-500 mb-4">
|
|
We need the one-time password (OTP) sent by the Delta Dental MA portal to complete this
|
|
eligibility check.
|
|
</p>
|
|
<form onSubmit={handleSubmit} className="space-y-4">
|
|
<div className="space-y-2">
|
|
<Label htmlFor="ddma-otp">OTP</Label>
|
|
<Input id="ddma-otp" placeholder="Enter OTP code" value={otp} onChange={(e) => setOtp(e.target.value)} autoFocus/>
|
|
</div>
|
|
<div className="flex justify-end gap-3">
|
|
<Button type="button" variant="outline" onClick={onClose} disabled={isSubmitting}>
|
|
Cancel
|
|
</Button>
|
|
<Button type="submit" disabled={isSubmitting || !otp.trim()}>
|
|
{isSubmitting ? (<>
|
|
<LoaderCircleIcon className="w-4 h-4 mr-2 animate-spin"/>
|
|
Submitting...
|
|
</>) : ("Submit OTP")}
|
|
</Button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>);
|
|
}
|
|
export function DdmaEligibilityButton({ memberId, dateOfBirth, firstName, lastName, isFormIncomplete, autoTrigger, onAutoTriggered, onPdfReady, }) {
|
|
const { toast } = useToast();
|
|
const dispatch = useAppDispatch();
|
|
const sessionIdRef = useRef(null);
|
|
const autoTriggeredRef = useRef(false);
|
|
const [otpModalOpen, setOtpModalOpen] = useState(false);
|
|
const [isStarting, setIsStarting] = useState(false);
|
|
const [isSubmittingOtp, setIsSubmittingOtp] = useState(false);
|
|
// ── Socket event handlers ─────────────────────────────────────────────────
|
|
const handleDdmaStart = async () => {
|
|
if (!memberId || !dateOfBirth) {
|
|
toast({
|
|
title: "Missing fields",
|
|
description: "Member ID and Date of Birth are required.",
|
|
variant: "destructive",
|
|
});
|
|
return;
|
|
}
|
|
const formattedDob = formatLocalDate(dateOfBirth);
|
|
const payload = {
|
|
memberId,
|
|
dateOfBirth: formattedDob,
|
|
firstName,
|
|
lastName,
|
|
insuranceSiteKey: "DDMA",
|
|
};
|
|
setIsStarting(true);
|
|
try {
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "pending",
|
|
message: "Starting DDMA eligibility check…",
|
|
}));
|
|
// 1) POST to backend — returns { status: "queued", jobId }
|
|
const response = await apiRequest("POST", "/api/insurance-status-ddma/ddma-eligibility", { data: JSON.stringify(payload), socketId: socket.id });
|
|
const result = await response.json();
|
|
if (!response.ok || result.error) {
|
|
throw new Error(result.error || `Server error (${response.status})`);
|
|
}
|
|
const jobId = result.jobId;
|
|
if (!jobId)
|
|
throw new Error("No jobId returned from server");
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "pending",
|
|
message: "DDMA job queued. Waiting for browser session to start…",
|
|
}));
|
|
// 2) Listen for job-lifecycle and DDMA-specific socket events.
|
|
// All events come through the shared app socket.
|
|
// Handler: Python agent started a browser session → we now have session_id
|
|
const onSessionStarted = (data) => {
|
|
if (String(data?.jobId) !== String(jobId))
|
|
return;
|
|
sessionIdRef.current = data.session_id ?? null;
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "pending",
|
|
message: "Browser session started. Waiting for OTP or result…",
|
|
}));
|
|
};
|
|
// Handler: OTP is required by the DDMA portal
|
|
const onOtpRequired = (data) => {
|
|
if (String(data?.jobId) !== String(jobId))
|
|
return;
|
|
// Update sessionId in case it arrives here first
|
|
if (data.session_id)
|
|
sessionIdRef.current = data.session_id;
|
|
setOtpModalOpen(true);
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "pending",
|
|
message: "OTP required for Delta Dental MA. Please enter the code.",
|
|
}));
|
|
};
|
|
// Handler: OTP accepted by Python agent (optional UX feedback)
|
|
const onOtpSubmitted = (data) => {
|
|
if (data?.session_id && data.session_id !== sessionIdRef.current)
|
|
return;
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "pending",
|
|
message: "OTP submitted. Finishing DDMA eligibility check…",
|
|
}));
|
|
};
|
|
// Handler: job completed or failed (from InProcessQueue)
|
|
const onJobUpdate = (data) => {
|
|
if (String(data?.jobId) !== String(jobId))
|
|
return;
|
|
if (data.status === "active") {
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "pending",
|
|
message: data.message ?? "Selenium browser starting…",
|
|
}));
|
|
return;
|
|
}
|
|
// Terminal states
|
|
cleanup();
|
|
if (data.status === "completed") {
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "success",
|
|
message: "DDMA eligibility updated and PDF attached to patient documents.",
|
|
}));
|
|
toast({
|
|
title: "DDMA eligibility complete",
|
|
description: "Patient status was updated and the eligibility PDF was saved.",
|
|
});
|
|
queryClient.invalidateQueries({ queryKey: QK_PATIENTS_BASE });
|
|
const pdfId = data.result?.pdfFileId;
|
|
if (pdfId) {
|
|
const filename = data.result?.pdfFilename ?? `eligibility_ddma_${memberId}.pdf`;
|
|
onPdfReady(Number(pdfId), filename);
|
|
}
|
|
}
|
|
else if (data.status === "failed") {
|
|
const msg = data.error ?? "DDMA eligibility job failed.";
|
|
dispatch(setTaskStatus({ key: "eligibilityCheck", status: "error", message: msg }));
|
|
toast({ title: "DDMA selenium error", description: msg, variant: "destructive" });
|
|
}
|
|
setIsStarting(false);
|
|
setOtpModalOpen(false);
|
|
};
|
|
// Attach listeners
|
|
socket.on("selenium:ddma_session_started", onSessionStarted);
|
|
socket.on("selenium:otp_required", onOtpRequired);
|
|
socket.on("selenium:otp_submitted", onOtpSubmitted);
|
|
socket.on("job:update", onJobUpdate);
|
|
// Cleanup helper removes all listeners for this job
|
|
function cleanup() {
|
|
socket.off("selenium:ddma_session_started", onSessionStarted);
|
|
socket.off("selenium:otp_required", onOtpRequired);
|
|
socket.off("selenium:otp_submitted", onOtpSubmitted);
|
|
socket.off("job:update", onJobUpdate);
|
|
}
|
|
// Safety timeout — clean up listeners if no terminal event in 6 min
|
|
const safetyTimer = setTimeout(() => {
|
|
cleanup();
|
|
setIsStarting(false);
|
|
setOtpModalOpen(false);
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "error",
|
|
message: "DDMA job timed out waiting for completion.",
|
|
}));
|
|
}, 6 * 60 * 1000);
|
|
// Patch cleanup to also clear the timer
|
|
const originalCleanup = cleanup;
|
|
function cleanupWithTimer() {
|
|
clearTimeout(safetyTimer);
|
|
originalCleanup();
|
|
}
|
|
// Override the onJobUpdate cleanup reference
|
|
socket.off("job:update", onJobUpdate);
|
|
socket.on("job:update", (data) => {
|
|
if (String(data?.jobId) !== String(jobId))
|
|
return;
|
|
if (data.status === "active") {
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "pending",
|
|
message: data.message ?? "Selenium browser starting…",
|
|
}));
|
|
return;
|
|
}
|
|
cleanupWithTimer();
|
|
if (data.status === "completed") {
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "success",
|
|
message: "DDMA eligibility updated and PDF attached to patient documents.",
|
|
}));
|
|
toast({
|
|
title: "DDMA eligibility complete",
|
|
description: "Patient status was updated and the eligibility PDF was saved.",
|
|
});
|
|
queryClient.invalidateQueries({ queryKey: QK_PATIENTS_BASE });
|
|
const pdfId = data.result?.pdfFileId;
|
|
if (pdfId) {
|
|
onPdfReady(Number(pdfId), data.result?.pdfFilename ?? `eligibility_ddma_${memberId}.pdf`);
|
|
}
|
|
}
|
|
else if (data.status === "failed") {
|
|
const msg = data.error ?? "DDMA eligibility job failed.";
|
|
dispatch(setTaskStatus({ key: "eligibilityCheck", status: "error", message: msg }));
|
|
toast({ title: "DDMA selenium error", description: msg, variant: "destructive" });
|
|
}
|
|
setIsStarting(false);
|
|
setOtpModalOpen(false);
|
|
});
|
|
}
|
|
catch (err) {
|
|
console.error("DdmaEligibilityButton error:", err);
|
|
dispatch(setTaskStatus({
|
|
key: "eligibilityCheck",
|
|
status: "error",
|
|
message: err?.message || "Failed to start DDMA eligibility",
|
|
}));
|
|
toast({
|
|
title: "DDMA selenium error",
|
|
description: err?.message || "Failed to start DDMA eligibility",
|
|
variant: "destructive",
|
|
});
|
|
setIsStarting(false);
|
|
}
|
|
};
|
|
// ── OTP submission ────────────────────────────────────────────────────────
|
|
const handleSubmitOtp = async (otp) => {
|
|
const sessionId = sessionIdRef.current;
|
|
if (!sessionId) {
|
|
toast({
|
|
title: "Session not ready",
|
|
description: "Cannot submit OTP — DDMA session ID is not available yet.",
|
|
variant: "destructive",
|
|
});
|
|
return;
|
|
}
|
|
try {
|
|
setIsSubmittingOtp(true);
|
|
const resp = await apiRequest("POST", "/api/insurance-status-ddma/selenium/submit-otp", {
|
|
session_id: sessionId,
|
|
otp,
|
|
socketId: socket.id,
|
|
});
|
|
const data = await resp.json();
|
|
if (!resp.ok || data.error) {
|
|
throw new Error(data.error || "Failed to submit OTP");
|
|
}
|
|
setOtpModalOpen(false);
|
|
}
|
|
catch (err) {
|
|
console.error("handleSubmitOtp error:", err);
|
|
toast({
|
|
title: "Failed to submit OTP",
|
|
description: err?.message || "Error forwarding OTP to selenium agent",
|
|
variant: "destructive",
|
|
});
|
|
}
|
|
finally {
|
|
setIsSubmittingOtp(false);
|
|
}
|
|
};
|
|
useEffect(() => {
|
|
if (!autoTrigger) {
|
|
autoTriggeredRef.current = false;
|
|
return;
|
|
}
|
|
if (autoTriggeredRef.current || isFormIncomplete)
|
|
return;
|
|
autoTriggeredRef.current = true;
|
|
onAutoTriggered?.();
|
|
handleDdmaStart();
|
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
}, [autoTrigger, isFormIncomplete]);
|
|
// ── Render ────────────────────────────────────────────────────────────────
|
|
return (<>
|
|
<Button className="w-full" variant="default" disabled={isFormIncomplete || isStarting} onClick={handleDdmaStart}>
|
|
{isStarting ? (<>
|
|
<LoaderCircleIcon className="h-4 w-4 mr-2 animate-spin"/>
|
|
Processing...
|
|
</>) : (<>
|
|
<CheckCircle className="h-4 w-4 mr-2"/>
|
|
Delta MA
|
|
</>)}
|
|
</Button>
|
|
|
|
<DdmaOtpModal open={otpModalOpen} onClose={() => setOtpModalOpen(false)} onSubmit={handleSubmitOtp} isSubmitting={isSubmittingOtp}/>
|
|
</>);
|
|
}
|