frontend: #109 punch-list P2 — effect-guard RulesTab, pending node card modal, org save, node recent-calls filter

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

Claude-Session: https://claude.ai/code/session_01Tbknwttzou4s46PAykmtix

drb-frontend/app/alerts/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { useAuth } from "@/components/AuthProvider";
 import { useAlerts } from "@/lib/useAlerts";
 import { MachineOutputNotice } from "@/components/ui/MachineOutputNotice";
@@ -32,8 +32,8 @@ function RulesTab({ isAdmin }: { isAdmin: boolean }) {
     }
   }
 
-  // Load on first render of this tab
-  if (!loaded) { load(); }
+  // Load once when this tab mounts (load() self-guards on `loaded`).
+  useEffect(() => { load(); }, []);
 
   async function handleCreate(e: React.FormEvent) {
     e.preventDefault();

drb-frontend/app/nodes/[id]/page.tsx

@@ -120,7 +120,10 @@ export default function NodeDetailPage() {
   const [approving, setApproving] = useState(false);
   const [deleting, setDeleting] = useState(false);
   const { systems } = useSystems();
-  const { calls } = useCalls(20);
+  // TODO(server-26#109 item5): server-side node_id filter. A where("node_id","==",id)
+  // alongside the existing org_id equality + started_at orderBy needs a brand-new
+  // composite index, so for now pull a wider window and filter client-side.
+  const { calls } = useCalls(200);
   const { isAdmin } = useAuth();
 
   const systemMap = Object.fromEntries(systems.map((s) => [s.system_id, s]));