From 323e8c5ca12e15e01b3e06227611cbb965f5d4a0 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Sat, 25 Apr 2026 18:58:19 +0000
Subject: [PATCH] Changes

Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>
---
 src/components/cases/expenses-tab.tsx | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/components/cases/expenses-tab.tsx b/src/components/cases/expenses-tab.tsx
index a6008a4..355181f 100644
--- a/src/components/cases/expenses-tab.tsx
+++ b/src/components/cases/expenses-tab.tsx
@@ -6,7 +6,7 @@ import { Label } from "@/components/ui/label";
 import { Checkbox } from "@/components/ui/checkbox";
 import { supabase } from "@/integrations/supabase/client";
 import { useAuth } from "@/lib/auth";
-import { Plus, Trash2, Loader2, Receipt as ReceiptIcon, CheckCircle2, Undo2, Download } from "lucide-react";
+import { Plus, Trash2, Loader2, Receipt as ReceiptIcon, CheckCircle2, Undo2, Download, RefreshCw } from "lucide-react";
 import { formatCurrency, formatDate } from "@/lib/format";
 import { ensureMarkedInvoicedPlaceholder } from "@/lib/invoice-generation";
 import { toast } from "sonner";
@@ -69,6 +69,18 @@ export function CaseExpensesTab({ caseId }: { caseId: string }) {
     return () => window.removeEventListener("expenses:changed", handler);
   }, [caseId]);
 
+  // Refresh when tab/window becomes visible again (covers Quick Add from another page)
+  useEffect(() => {
+    const onFocus = () => load();
+    const onVis = () => { if (document.visibilityState === "visible") load(); };
+    window.addEventListener("focus", onFocus);
+    document.addEventListener("visibilitychange", onVis);
+    return () => {
+      window.removeEventListener("focus", onFocus);
+      document.removeEventListener("visibilitychange", onVis);
+    };
+  }, [caseId]);
+
   // Load case client_id for placeholder invoice creation
   useEffect(() => {
     (async () => {
@@ -182,6 +194,9 @@ export function CaseExpensesTab({ caseId }: { caseId: string }) {
           <Stat label="Unbilled" value={formatCurrency(totals.unbilled)} />
         </div>
         <div className="flex flex-wrap gap-2">
+          <Button variant="ghost" size="icon" onClick={load} title="Refresh">
+            <RefreshCw className="h-4 w-4" />
+          </Button>
           <Button variant="outline" onClick={() => setShowImport(true)}>
             <Download className="h-4 w-4 mr-2" /> Import open expenses
           </Button>