fix: remove localhost fallback from analysis actions

frontend/src/components/ResultsDashboard.jsx

@@ -6,7 +6,8 @@ import ResearchTab from "./tabs/ResearchTab.jsx";
 import { Download, Eye, X } from "lucide-react";
 import { useState } from "react";
 
-const BASE_URL = import.meta.env.VITE_API_URL || "http://localhost:3001";
+const configuredBaseUrl = import.meta.env.VITE_API_URL?.trim();
+const BASE_URL = configuredBaseUrl || "";
 
 const TABS = [
   { id: "overview", label: "Overview" },
@@ -16,28 +17,69 @@ const TABS = [
   { id: "research", label: "Research" },
 ];
 
-export default function ResultsDashboard({ result, activeTab, onTabChange, jobId, onScoreUpdate }) {
+export default function ResultsDashboard({
+  result,
+  activeTab,
+  onTabChange,
+  jobId,
+  onScoreUpdate,
+}) {
   const [previewUrl, setPreviewUrl] = useState(null);
 
   return (
     <div style={{ padding: "24px" }}>
       <div className="container">
         {/* Page header */}
-        <div style={{ marginBottom: "24px", display: "flex", justifyContent: "space-between", alignItems: "flex-start" }}>
+        <div
+          style={{
+            marginBottom: "24px",
+            display: "flex",
+            justifyContent: "space-between",
+            alignItems: "flex-start",
+          }}
+        >
           <div>
-            <div className="eyebrow" style={{ marginBottom: "8px" }}>Analysis Complete</div>
-            <h2 style={{ fontFamily: "var(--font-body)", fontWeight: 600, marginBottom: "4px" }}>
+            <div className="eyebrow" style={{ marginBottom: "8px" }}>
+              Analysis Complete
+            </div>
+            <h2
+              style={{
+                fontFamily: "var(--font-body)",
+                fontWeight: 600,
+                marginBottom: "4px",
+              }}
+            >
               {result.company_name}
             </h2>
-            <p style={{ fontSize: "12px", color: "var(--text-muted)", fontFamily: "var(--font-mono)" }}>
+            <p
+              style={{
+                fontSize: "12px",
+                color: "var(--text-muted)",
+                fontFamily: "var(--font-mono)",
+              }}
+            >
               Job ID: {result.job_id}
             </p>
           </div>
           <div style={{ display: "flex", gap: "8px", marginTop: "8px" }}>
             <button
-              onClick={() => setPreviewUrl(`${BASE_URL}/api/cam/${result.job_id}/download/pdf?preview=true`)}
+              onClick={() =>
+                setPreviewUrl(
+                  `${BASE_URL}/api/cam/${result.job_id}/download/pdf?preview=true`,
+                )
+              }
               className="btn btn-sm"
-              style={{ display: "flex", alignItems: "center", gap: "6px", fontSize: "12px", padding: "6px 14px", background: "var(--accent-subtle)", color: "var(--accent)", border: "1px solid rgba(59,130,246,0.3)", cursor: "pointer" }}
+              style={{
+                display: "flex",
+                alignItems: "center",
+                gap: "6px",
+                fontSize: "12px",
+                padding: "6px 14px",
+                background: "var(--accent-subtle)",
+                color: "var(--accent)",
+                border: "1px solid rgba(59,130,246,0.3)",
+                cursor: "pointer",
+              }}
             >
               <Eye size={14} /> Preview PDF
             </button>
@@ -46,7 +88,14 @@ export default function ResultsDashboard({ result, activeTab, onTabChange, jobId
               target="_blank"
               rel="noopener noreferrer"
               className="btn btn-primary btn-sm"
-              style={{ textDecoration: "none", display: "flex", alignItems: "center", gap: "6px", fontSize: "12px", padding: "6px 14px" }}
+              style={{
+                textDecoration: "none",
+                display: "flex",
+                alignItems: "center",
+                gap: "6px",
+                fontSize: "12px",
+                padding: "6px 14px",
+              }}
             >
               <Download size={14} /> CAM PDF
             </a>
@@ -55,7 +104,17 @@ export default function ResultsDashboard({ result, activeTab, onTabChange, jobId
               target="_blank"
               rel="noopener noreferrer"
               className="btn btn-sm"
-              style={{ textDecoration: "none", display: "flex", alignItems: "center", gap: "6px", fontSize: "12px", padding: "6px 14px", background: "var(--bg-elevated)", border: "1px solid var(--border)", color: "var(--text-secondary)" }}
+              style={{
+                textDecoration: "none",
+                display: "flex",
+                alignItems: "center",
+                gap: "6px",
+                fontSize: "12px",
+                padding: "6px 14px",
+                background: "var(--bg-elevated)",
+                border: "1px solid var(--border)",
+                color: "var(--text-secondary)",
+              }}
             >
               <Download size={14} /> DOCX
             </a>
@@ -78,7 +137,13 @@ export default function ResultsDashboard({ result, activeTab, onTabChange, jobId
         {/* Active tab content */}
         <div>
           {activeTab === "overview" && <OverviewTab result={result} />}
-          {activeTab === "fraud" && <FraudTab fraudFeatures={result.fraud_features} result={result} onScoreUpdate={onScoreUpdate} />}
+          {activeTab === "fraud" && (
+            <FraudTab
+              fraudFeatures={result.fraud_features}
+              result={result}
+              onScoreUpdate={onScoreUpdate}
+            />
+          )}
           {activeTab === "score" && (
             <ScoreTab
               scoreBreakdown={result.score_breakdown}
@@ -87,29 +152,71 @@ export default function ResultsDashboard({ result, activeTab, onTabChange, jobId
             />
           )}
           {activeTab === "graph" && (
-            <EntityGraphTab nodes={result.entity_nodes} edges={result.entity_edges} jobId={result.job_id} />
+            <EntityGraphTab
+              nodes={result.entity_nodes}
+              edges={result.entity_edges}
+              jobId={result.job_id}
+            />
+          )}
+          {activeTab === "research" && (
+            <ResearchTab findings={result.research_findings} />
           )}
-          {activeTab === "research" && <ResearchTab findings={result.research_findings} />}
         </div>
       </div>
 
       {/* PDF Preview Modal */}
       {previewUrl && (
-        <div style={{ position: "fixed", inset: 0, zIndex: 9999, background: "rgba(10, 10, 15, 0.9)", backdropFilter: "blur(4px)", display: "flex", flexDirection: "column", padding: "24px" }}>
-          <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: "16px", color: "var(--text-primary)" }}>
-            <h3 style={{ fontFamily: "var(--font-body)", fontWeight: 600 }}>CAM Report Preview</h3>
+        <div
+          style={{
+            position: "fixed",
+            inset: 0,
+            zIndex: 9999,
+            background: "rgba(10, 10, 15, 0.9)",
+            backdropFilter: "blur(4px)",
+            display: "flex",
+            flexDirection: "column",
+            padding: "24px",
+          }}
+        >
+          <div
+            style={{
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+              marginBottom: "16px",
+              color: "var(--text-primary)",
+            }}
+          >
+            <h3 style={{ fontFamily: "var(--font-body)", fontWeight: 600 }}>
+              CAM Report Preview
+            </h3>
             <button
               onClick={() => setPreviewUrl(null)}
               className="btn btn-sm"
-              style={{ display: "flex", alignItems: "center", gap: "6px", background: "var(--bg-elevated)", color: "var(--text-primary)", border: "1px solid var(--border)", cursor: "pointer" }}
+              style={{
+                display: "flex",
+                alignItems: "center",
+                gap: "6px",
+                background: "var(--bg-elevated)",
+                color: "var(--text-primary)",
+                border: "1px solid var(--border)",
+                cursor: "pointer",
+              }}
             >
               <X size={16} /> Close Preview
             </button>
           </div>
-          <iframe 
-            src={previewUrl} 
+          <iframe
+            src={previewUrl}
             title="PDF Preview"
-            style={{ flex: 1, border: "1px solid var(--border)", borderRadius: "8px", background: "white", width: "100%", height: "100%" }} 
+            style={{
+              flex: 1,
+              border: "1px solid var(--border)",
+              borderRadius: "8px",
+              background: "white",
+              width: "100%",
+              height: "100%",
+            }}
           />
         </div>
       )}

frontend/src/components/tabs/EntityGraphTab.jsx

@@ -2,7 +2,8 @@ import { useState, useCallback, useEffect, useRef } from "react";
 import ForceGraph2D from "react-force-graph-2d";
 import { X } from "lucide-react";
 
-const BASE_URL = import.meta.env.VITE_API_URL || "http://localhost:3001";
+const configuredBaseUrl = import.meta.env.VITE_API_URL?.trim();
+const BASE_URL = configuredBaseUrl || "";
 
 function getNodeColor(type, riskLevel) {
   if (riskLevel === "HIGH") return "#ef4444";
@@ -23,16 +24,40 @@ function LegendDot({ color, label, dashed }) {
   return (
     <div className="flex items-center gap-sm">
       {dashed ? (
-        <svg width="24" height="8"><line x1="0" y1="4" x2="24" y2="4" stroke={color} strokeWidth="2" strokeDasharray="4 3" /></svg>
+        <svg width="24" height="8">
+          <line
+            x1="0"
+            y1="4"
+            x2="24"
+            y2="4"
+            stroke={color}
+            strokeWidth="2"
+            strokeDasharray="4 3"
+          />
+        </svg>
       ) : (
-        <div style={{ width: "12px", height: "12px", borderRadius: "50%", background: color, flexShrink: 0 }} />
+        <div
+          style={{
+            width: "12px",
+            height: "12px",
+            borderRadius: "50%",
+            background: color,
+            flexShrink: 0,
+          }}
+        />
       )}
-      <span style={{ color: "var(--text-muted)", fontSize: "12px" }}>{label}</span>
+      <span style={{ color: "var(--text-muted)", fontSize: "12px" }}>
+        {label}
+      </span>
     </div>
   );
 }
 
-export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, jobId }) {
+export default function EntityGraphTab({
+  nodes: propNodes,
+  edges: propEdges,
+  jobId,
+}) {
   const [fetchedNodes, setFetchedNodes] = useState(null);
   const [fetchedEdges, setFetchedEdges] = useState(null);
   const [loading, setLoading] = useState(false);
@@ -49,7 +74,7 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
     let cancelled = false;
     setLoading(true);
     fetch(`${BASE_URL}/api/analysis/${encodeURIComponent(jobId)}/entity-graph`)
-      .then((res) => res.ok ? res.json() : null)
+      .then((res) => (res.ok ? res.json() : null))
       .then((data) => {
         if (cancelled || !data) return;
         if (data.nodes && data.nodes.length > 0) {
@@ -58,34 +83,70 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
         }
       })
       .catch(() => {})
-      .finally(() => { if (!cancelled) setLoading(false); });
-    return () => { cancelled = true; };
+      .finally(() => {
+        if (!cancelled) setLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
   }, [hasPropsData, jobId]);
 
   const hasProbableMatch = (edges || []).some((e) => e.is_probable_match);
   const hasHighRisk = (nodes || []).some((n) => n.risk_level === "HIGH");
-  const historicalNodes = (nodes || []).filter((n) => n.historical_match != null && n.historical_match !== undefined && n.historical_match !== false);
+  const historicalNodes = (nodes || []).filter(
+    (n) =>
+      n.historical_match != null &&
+      n.historical_match !== undefined &&
+      n.historical_match !== false,
+  );
 
   if (loading) {
     return (
-      <div className="flex flex-col items-center justify-center" style={{ padding: "80px 24px", gap: "12px" }}>
-        <p style={{ fontSize: "15px", fontWeight: 500 }}>Loading entity graph…</p>
+      <div
+        className="flex flex-col items-center justify-center"
+        style={{ padding: "80px 24px", gap: "12px" }}
+      >
+        <p style={{ fontSize: "15px", fontWeight: 500 }}>
+          Loading entity graph…
+        </p>
       </div>
     );
   }
 
   if (!nodes || nodes.length === 0) {
     return (
-      <div className="flex flex-col items-center justify-center" style={{ padding: "80px 24px", gap: "12px" }}>
-        <p style={{ fontSize: "15px", fontWeight: 500 }}>No entity relationships detected in uploaded documents.</p>
-        <p style={{ color: "var(--text-muted)", fontSize: "13px" }}>Entity graph is built from promoter names, related companies, and loan cross-references extracted via NER.</p>
+      <div
+        className="flex flex-col items-center justify-center"
+        style={{ padding: "80px 24px", gap: "12px" }}
+      >
+        <p style={{ fontSize: "15px", fontWeight: 500 }}>
+          No entity relationships detected in uploaded documents.
+        </p>
+        <p style={{ color: "var(--text-muted)", fontSize: "13px" }}>
+          Entity graph is built from promoter names, related companies, and loan
+          cross-references extracted via NER.
+        </p>
       </div>
     );
   }
 
   const graphData = {
-    nodes: nodes.map((n) => ({ id: n.id, name: n.name, type: n.type, risk_level: n.risk_level, historical_match: n.historical_match, color: getNodeColor(n.type, n.risk_level) })),
-    links: edges.map((e) => ({ source: e.source, target: e.target, relationship: e.relationship, amount_crore: e.amount_crore, is_probable_match: e.is_probable_match, color: e.is_probable_match ? "#eab308" : "rgba(255,255,255,0.08)" })),
+    nodes: nodes.map((n) => ({
+      id: n.id,
+      name: n.name,
+      type: n.type,
+      risk_level: n.risk_level,
+      historical_match: n.historical_match,
+      color: getNodeColor(n.type, n.risk_level),
+    })),
+    links: edges.map((e) => ({
+      source: e.source,
+      target: e.target,
+      relationship: e.relationship,
+      amount_crore: e.amount_crore,
+      is_probable_match: e.is_probable_match,
+      color: e.is_probable_match ? "#eab308" : "rgba(255,255,255,0.08)",
+    })),
   };
 
   const handleNodeClick = useCallback((node) => {
@@ -102,26 +163,81 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
     <div className="flex flex-col gap-md">
       {/* Alert banners */}
       {hasProbableMatch && (
-        <div className="card" style={{ background: "var(--warning-subtle)", borderColor: "rgba(234,179,8,0.3)" }}>
-          <p style={{ color: "var(--warning)", fontSize: "13px" }}>⚠ Fuzzy-matched entities detected. Manual verification recommended.</p>
+        <div
+          className="card"
+          style={{
+            background: "var(--warning-subtle)",
+            borderColor: "rgba(234,179,8,0.3)",
+          }}
+        >
+          <p style={{ color: "var(--warning)", fontSize: "13px" }}>
+            ⚠ Fuzzy-matched entities detected. Manual verification recommended.
+          </p>
         </div>
       )}
       {hasHighRisk && (
-        <div className="card" style={{ background: "var(--danger-subtle)", borderColor: "rgba(239,68,68,0.3)" }}>
-          <p style={{ color: "var(--danger)", fontSize: "13px" }}>🚩 Related-party anomaly detected. Possible shell company or fund siphoning risk.</p>
+        <div
+          className="card"
+          style={{
+            background: "var(--danger-subtle)",
+            borderColor: "rgba(239,68,68,0.3)",
+          }}
+        >
+          <p style={{ color: "var(--danger)", fontSize: "13px" }}>
+            🚩 Related-party anomaly detected. Possible shell company or fund
+            siphoning risk.
+          </p>
         </div>
       )}
       {historicalNodes.map((node) => (
-        <div key={node.id} className="card" style={{ background: "var(--danger-subtle)", borderColor: "var(--danger)" }}>
-          <p style={{ color: "var(--danger)", fontSize: "13px", fontWeight: 700, marginBottom: "4px" }}>⚠ HISTORICAL MATCH DETECTED</p>
-          <p style={{ color: "var(--danger)", fontSize: "12px" }}>Director DIN {node.id} appeared in a previously rejected application. Escalate.</p>
+        <div
+          key={node.id}
+          className="card"
+          style={{
+            background: "var(--danger-subtle)",
+            borderColor: "var(--danger)",
+          }}
+        >
+          <p
+            style={{
+              color: "var(--danger)",
+              fontSize: "13px",
+              fontWeight: 700,
+              marginBottom: "4px",
+            }}
+          >
+            ⚠ HISTORICAL MATCH DETECTED
+          </p>
+          <p style={{ color: "var(--danger)", fontSize: "12px" }}>
+            Director DIN {node.id} appeared in a previously rejected
+            application. Escalate.
+          </p>
         </div>
       ))}
 
       {/* Graph + sidebar */}
       <div className="flex gap-md">
-        <div className="card" style={{ flex: 1, overflow: "hidden", padding: 0, background: "linear-gradient(135deg, #1a1a1f 0%, #1e1e28 50%, #1a1a22 100%)", position: "relative" }}>
-          <div style={{ position: "absolute", inset: 0, opacity: 0.04, background: "radial-gradient(circle at 50% 50%, #3b82f6 0%, transparent 60%)", pointerEvents: "none" }} />
+        <div
+          className="card"
+          style={{
+            flex: 1,
+            overflow: "hidden",
+            padding: 0,
+            background:
+              "linear-gradient(135deg, #1a1a1f 0%, #1e1e28 50%, #1a1a22 100%)",
+            position: "relative",
+          }}
+        >
+          <div
+            style={{
+              position: "absolute",
+              inset: 0,
+              opacity: 0.04,
+              background:
+                "radial-gradient(circle at 50% 50%, #3b82f6 0%, transparent 60%)",
+              pointerEvents: "none",
+            }}
+          />
           <ForceGraph2D
             ref={graphRef}
             graphData={graphData}
@@ -138,8 +254,9 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
             d3AlphaDecay={0.02}
             d3VelocityDecay={0.3}
             nodeCanvasObject={(node, ctx, globalScale) => {
-              if (typeof node.x !== "number" || typeof node.y !== "number") return;
-              
+              if (typeof node.x !== "number" || typeof node.y !== "number")
+                return;
+
               const r = node.risk_level === "HIGH" ? 10 : 7;
               const isHover = hoverNode && hoverNode.id === node.id;
               const isSel = selectedNode && selectedNode.id === node.id;
@@ -148,7 +265,14 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
               // Outer glow
               ctx.beginPath();
               ctx.arc(node.x, node.y, r + (isHover ? 8 : 4), 0, 2 * Math.PI);
-              const grad = ctx.createRadialGradient(node.x, node.y, r, node.x, node.y, r + (isHover ? 14 : 6));
+              const grad = ctx.createRadialGradient(
+                node.x,
+                node.y,
+                r,
+                node.x,
+                node.y,
+                r + (isHover ? 14 : 6),
+              );
               grad.addColorStop(0, color + (isHover ? "55" : "25"));
               grad.addColorStop(1, color + "00");
               ctx.fillStyle = grad;
@@ -166,7 +290,14 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
               // Main circle
               ctx.beginPath();
               ctx.arc(node.x, node.y, r, 0, 2 * Math.PI);
-              const cGrad = ctx.createRadialGradient(node.x - r * 0.3, node.y - r * 0.3, r * 0.1, node.x, node.y, r);
+              const cGrad = ctx.createRadialGradient(
+                node.x - r * 0.3,
+                node.y - r * 0.3,
+                r * 0.1,
+                node.x,
+                node.y,
+                r,
+              );
               cGrad.addColorStop(0, color + "ff");
               cGrad.addColorStop(1, color + "aa");
               ctx.fillStyle = cGrad;
@@ -202,7 +333,15 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
             linkCanvasObject={(link, ctx) => {
               const start = link.source;
               const end = link.target;
-              if (!start || !end || typeof start.x !== "number" || typeof start.y !== "number" || typeof end.x !== "number" || typeof end.y !== "number") return;
+              if (
+                !start ||
+                !end ||
+                typeof start.x !== "number" ||
+                typeof start.y !== "number" ||
+                typeof end.x !== "number" ||
+                typeof end.y !== "number"
+              )
+                return;
 
               ctx.beginPath();
               ctx.moveTo(start.x, start.y);
@@ -214,7 +353,12 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
                 ctx.lineWidth = 1.5;
               } else {
                 ctx.setLineDash([]);
-                const grad = ctx.createLinearGradient(start.x, start.y, end.x, end.y);
+                const grad = ctx.createLinearGradient(
+                  start.x,
+                  start.y,
+                  end.x,
+                  end.y,
+                );
                 grad.addColorStop(0, (start.color || "#3b82f6") + "55");
                 grad.addColorStop(0.5, "rgba(255,255,255,0.12)");
                 grad.addColorStop(1, (end.color || "#3b82f6") + "55");
@@ -239,30 +383,68 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
         </div>
 
         {selectedNode && (
-          <div className="card shrink-0" style={{ width: "220px", display: "flex", flexDirection: "column", gap: "12px" }}>
+          <div
+            className="card shrink-0"
+            style={{
+              width: "220px",
+              display: "flex",
+              flexDirection: "column",
+              gap: "12px",
+            }}
+          >
             <div className="flex justify-between items-center">
               <span className="label">Node Detail</span>
-              <button onClick={() => setSelectedNode(null)} style={{ background: "none", border: "none", cursor: "pointer", color: "var(--text-muted)" }}>
+              <button
+                onClick={() => setSelectedNode(null)}
+                style={{
+                  background: "none",
+                  border: "none",
+                  cursor: "pointer",
+                  color: "var(--text-muted)",
+                }}
+              >
                 <X size={14} />
               </button>
             </div>
             <div className="flex flex-col gap-sm">
               <div>
-                <p className="label" style={{ marginBottom: "2px" }}>Name</p>
-                <p style={{ fontSize: "13px", fontWeight: 600, wordBreak: "break-word" }}>{selectedNode.name}</p>
+                <p className="label" style={{ marginBottom: "2px" }}>
+                  Name
+                </p>
+                <p
+                  style={{
+                    fontSize: "13px",
+                    fontWeight: 600,
+                    wordBreak: "break-word",
+                  }}
+                >
+                  {selectedNode.name}
+                </p>
               </div>
               <div>
-                <p className="label" style={{ marginBottom: "2px" }}>Type</p>
-                <p style={{ fontSize: "13px", textTransform: "capitalize" }}>{selectedNode.type}</p>
+                <p className="label" style={{ marginBottom: "2px" }}>
+                  Type
+                </p>
+                <p style={{ fontSize: "13px", textTransform: "capitalize" }}>
+                  {selectedNode.type}
+                </p>
               </div>
               <div>
-                <p className="label" style={{ marginBottom: "4px" }}>Risk Level</p>
-                <span className={`badge ${riskBadge(selectedNode.risk_level)}`}>{selectedNode.risk_level}</span>
+                <p className="label" style={{ marginBottom: "4px" }}>
+                  Risk Level
+                </p>
+                <span className={`badge ${riskBadge(selectedNode.risk_level)}`}>
+                  {selectedNode.risk_level}
+                </span>
               </div>
               {selectedNode.historical_match && (
                 <div>
-                  <p className="label" style={{ marginBottom: "2px" }}>Historical Match</p>
-                  <p style={{ color: "var(--danger)", fontSize: "12px" }}>Yes</p>
+                  <p className="label" style={{ marginBottom: "2px" }}>
+                    Historical Match
+                  </p>
+                  <p style={{ color: "var(--danger)", fontSize: "12px" }}>
+                    Yes
+                  </p>
                 </div>
               )}
             </div>
@@ -272,7 +454,12 @@ export default function EntityGraphTab({ nodes: propNodes, edges: propEdges, job
 
       {/* Legend */}
       <div className="card">
-        <span className="label" style={{ display: "block", marginBottom: "12px" }}>Legend</span>
+        <span
+          className="label"
+          style={{ display: "block", marginBottom: "12px" }}
+        >
+          Legend
+        </span>
         <div className="flex flex-wrap gap-lg">
           <LegendDot color="#3b82f6" label="Person (Promoter / Director)" />
           <LegendDot color="#8b5cf6" label="Company" />