Accounting: editable journal entries + Reports refresh button

- Journal Entries: add Edit (row + detail drawer) that loads an entry into the
  form and saves changes (updates the entry and replaces its lines). Warns when
  editing an auto-generated entry (may be overwritten by its source sync).
- Reports: add a Refresh button that re-fetches the underlying data so the
  report reflects the latest GL.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/pages/accounting/AccountingJournalEntriesPage.tsx

@@ -10,7 +10,7 @@ import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from "@/components/ui/table";
 import { Sheet, SheetContent, SheetHeader, SheetTitle } from "@/components/ui/sheet";
-import { Plus, Trash2, ChevronRight, AlertCircle, Loader2 } from "lucide-react";
+import { Plus, Trash2, ChevronRight, AlertCircle, Loader2, Pencil } from "lucide-react";
 import { toast } from "sonner";
 import { money, fmtDate } from "./lib/format";
 
@@ -37,6 +37,7 @@ export default function AccountingJournalEntriesPage() {
   const [reference, setReference] = useState("");
   const [lines, setLines] = useState<JELine[]>([newLine(), newLine()]);
   const [saving, setSaving] = useState(false);
+  const [editingId, setEditingId] = useState<string | null>(null);
 
   const { data: entries = [] } = useQuery({
     queryKey: ["journal-entries", cid],
@@ -87,12 +88,35 @@ export default function AccountingJournalEntriesPage() {
   };
 
   const resetForm = () => {
+    setEditingId(null);
     setDate(new Date().toLocaleDateString("en-CA", { timeZone: "America/New_York" }));
     setDescription("");
     setReference("");
     setLines([newLine(), newLine()]);
   };
 
+  const openEdit = (e: any) => {
+    setEditingId(e.id);
+    setDate(e.date);
+    setDescription(e.description ?? "");
+    setReference(e.reference ?? "");
+    const ls: JELine[] = (e.journal_entry_lines ?? []).map((l: any) => ({
+      id: crypto.randomUUID(),
+      account_id: l.account_id,
+      amount: Number(l.debit) > 0 ? String(Number(l.debit)) : String(-Number(l.credit)),
+      description: l.description ?? "",
+    }));
+    while (ls.length < 2) ls.push(newLine());
+    setLines(ls);
+    setDetailId(null);
+    setOpen(true);
+  };
+
+  const editingEntry = useMemo(
+    () => (editingId ? (entries as any[]).find((e) => e.id === editingId) : null),
+    [entries, editingId]
+  );
+
   const saveEntry = async () => {
     if (!description.trim()) return toast.error("Description required");
     const activeLines = lines.filter((l) => l.amount.trim() !== "" && (Number(l.amount) || 0) !== 0);
@@ -102,17 +126,29 @@ export default function AccountingJournalEntriesPage() {
     if (totalDebits === 0) return toast.error("Entry amount can't be zero");
 
     setSaving(true);
-    const { data: je, error: jeErr } = await accounting
-      .from("journal_entries")
-      .insert({ company_id: cid, date, description, reference: reference || null })
-      .select("id")
-      .single();
-    if (jeErr || !je) { setSaving(false); return toast.error(jeErr?.message ?? "Failed to create entry"); }
+    let jeId = editingId;
+    if (editingId) {
+      const { error: upErr } = await accounting
+        .from("journal_entries")
+        .update({ date, description, reference: reference || null })
+        .eq("id", editingId);
+      if (upErr) { setSaving(false); return toast.error(upErr.message); }
+      // Replace the lines wholesale
+      await accounting.from("journal_entry_lines").delete().eq("journal_entry_id", editingId);
+    } else {
+      const { data: je, error: jeErr } = await accounting
+        .from("journal_entries")
+        .insert({ company_id: cid, date, description, reference: reference || null })
+        .select("id")
+        .single();
+      if (jeErr || !je) { setSaving(false); return toast.error(jeErr?.message ?? "Failed to create entry"); }
+      jeId = je.id;
+    }
 
     const lineRows = activeLines.map((l) => {
       const a = Number(l.amount) || 0;
       return {
-        journal_entry_id: je.id,
+        journal_entry_id: jeId,
         account_id: l.account_id,
         debit: a > 0 ? a : 0,
         credit: a < 0 ? -a : 0,
@@ -124,7 +160,7 @@ export default function AccountingJournalEntriesPage() {
     setSaving(false);
     if (linesErr) return toast.error(linesErr.message);
 
-    toast.success("Journal entry posted");
+    toast.success(editingId ? "Journal entry updated" : "Journal entry posted");
     setOpen(false);
     resetForm();
     qc.invalidateQueries({ queryKey: ["journal-entries", cid] });
@@ -190,6 +226,9 @@ export default function AccountingJournalEntriesPage() {
                     <TableCell className="text-right text-sm">{money(credits, cur)}</TableCell>
                     <TableCell>
                       <div className="flex justify-end gap-1">
+                        <Button size="icon" variant="ghost" className="h-7 w-7" onClick={(ev) => { ev.stopPropagation(); openEdit(e); }} title="Edit">
+                          <Pencil className="h-3.5 w-3.5" />
+                        </Button>
                         <Button size="icon" variant="ghost" className="h-7 w-7" onClick={(ev) => { ev.stopPropagation(); setDetailId(e.id); }}>
                           <ChevronRight className="h-4 w-4" />
                         </Button>
@@ -216,7 +255,14 @@ export default function AccountingJournalEntriesPage() {
       {/* New journal entry dialog */}
       <Dialog open={open} onOpenChange={(o) => { setOpen(o); if (!o) resetForm(); }}>
         <DialogContent className="max-w-3xl max-h-[90vh] overflow-y-auto">
-          <DialogHeader><DialogTitle>New journal entry</DialogTitle></DialogHeader>
+          <DialogHeader><DialogTitle>{editingId ? "Edit journal entry" : "New journal entry"}</DialogTitle></DialogHeader>
+
+          {editingEntry?.external_source && (
+            <div className="flex items-center gap-2 rounded-md bg-amber-50 px-3 py-2 text-sm text-amber-800">
+              <AlertCircle className="h-4 w-4 shrink-0" />
+              This entry was auto‑generated from {editingEntry.external_source.replace(/^acmacc_/, "")}. Edits here may be overwritten the next time its source syncs — edit the source record instead where possible.
+            </div>
+          )}
 
           <div className="grid grid-cols-3 gap-3">
             <div className="col-span-2">
@@ -308,7 +354,7 @@ export default function AccountingJournalEntriesPage() {
           <DialogFooter>
             <Button variant="outline" onClick={() => { setOpen(false); resetForm(); }}>Cancel</Button>
             <Button onClick={saveEntry} disabled={saving || !isBalanced || totalDebits === 0}>
-              {saving ? "Posting…" : "Post entry"}
+              {saving ? "Saving…" : editingId ? "Save changes" : "Post entry"}
             </Button>
           </DialogFooter>
         </DialogContent>
@@ -360,7 +406,10 @@ export default function AccountingJournalEntriesPage() {
                 </TableBody>
               </Table>
 
-              <div className="pt-2">
+              <div className="pt-2 flex gap-2">
+                <Button variant="outline" size="sm" onClick={() => openEdit(detailEntry)}>
+                  <Pencil className="h-3.5 w-3.5 mr-1" /> Edit entry
+                </Button>
                 <Button variant="destructive" size="sm" onClick={() => deleteEntry(detailEntry.id)}>
                   <Trash2 className="h-3.5 w-3.5 mr-1" /> Delete entry
                 </Button>

src/pages/accounting/AccountingReportsPage.tsx

@@ -1,5 +1,5 @@
 import { Link } from "react-router-dom";
-import { useQuery } from "@tanstack/react-query";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { Fragment, useEffect, useMemo, useState } from "react";
 import { accounting } from "@/lib/accountingClient";
 import { supabase } from "@/integrations/supabase/client";
@@ -13,7 +13,7 @@ import { Switch } from "@/components/ui/switch";
 import { Label } from "@/components/ui/label";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip as RTooltip, Legend, ResponsiveContainer } from "recharts";
-import { FileText, Download, FileDown, Eye } from "lucide-react";
+import { FileText, Download, FileDown, Eye, RefreshCw } from "lucide-react";
 import { toast } from "sonner";
 import { money, fmtDate } from "./lib/format";
 import jsPDF from "jspdf";
@@ -199,6 +199,13 @@ function compareDates(mode: CompareMode, from: string, to: string, customFrom: s
 
 export default function AccountingReportsPage({ association }: { association?: { id: string; name?: string } | null } = {}) {
   const { companyId, associationName, associationId } = useCompanyId(association);
+  const qc = useQueryClient();
+  const [refreshing, setRefreshing] = useState(false);
+  const refreshReport = async () => {
+    setRefreshing(true);
+    await qc.invalidateQueries();
+    setTimeout(() => setRefreshing(false), 600);
+  };
   const cid = companyId ?? "";
   const cur = "USD";
   const [active, setActive] = useState<ReportId>("pnl");
@@ -474,6 +481,9 @@ export default function AccountingReportsPage({ association }: { association?: {
               <p className="text-sm text-muted-foreground">{rangeLabel}</p>
             </div>
             <div className="flex gap-2">
+              <Button variant="outline" onClick={refreshReport} disabled={refreshing}>
+                <RefreshCw className={`mr-1 h-4 w-4 ${refreshing ? "animate-spin" : ""}`} /> Refresh
+              </Button>
               {hasOwnExport ? (
                 <span className="text-xs text-muted-foreground self-center">Export available inside the report ↓</span>
               ) : (