feat(web/trades): force-dynamic + auto-refresh every 30s

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

web/app/trades/page.tsx

@@ -1,8 +1,9 @@
 import { getAccount, getDeals, type Deal } from "@/lib/mt5";
 import { formatCurrency, formatDate } from "@/lib/format";
 import EquityChart from "@/components/EquityChart";
+import TradesRefresher from "@/components/TradesRefresher";
 
-export const revalidate = 60;
+export const dynamic = "force-dynamic";
 const MAGIC = 19730;
 
 export default async function TradesPage() {
@@ -42,6 +43,10 @@ export default async function TradesPage() {
         <p className="text-[15px] text-ink-sub">
           All closed trades from ARES · magic {MAGIC}
         </p>
+        <div className="mt-3 flex items-center gap-2">
+          <span className="w-1.5 h-1.5 rounded-full bg-bull pulse-dot" />
+          <TradesRefresher />
+        </div>
       </section>
 
       {error ? (

web/components/TradesRefresher.tsx

@@ -0,0 +1,22 @@
+"use client";
+import { useEffect, useState } from "react";
+import { useRouter } from "next/navigation";
+
+export default function TradesRefresher() {
+  const router = useRouter();
+  const [lastUpdated, setLastUpdated] = useState<Date>(new Date());
+
+  useEffect(() => {
+    const id = setInterval(() => {
+      router.refresh();
+      setLastUpdated(new Date());
+    }, 30_000);
+    return () => clearInterval(id);
+  }, [router]);
+
+  return (
+    <span className="text-xs text-ink-ter font-mono">
+      Updated {lastUpdated.toLocaleTimeString()}
+    </span>
+  );
+}