fix(compiler): React Compiler safety triage — 5 categories cleared

Cleared 4 rule buckets (37 violations, including 5 real bugs) and
silenced 1 informational bucket from the Next 16 / react-hooks v7
upgrade. Cleared rules promoted from `warn` back to `error` so new
regressions block CI.

Real bug fixes:
- `interest-contact-log-tab.tsx`: `useMemo` used for side effects
  (5 setState calls inside a memo body); converted to `useEffect`.
- `PieChart.tsx`: cumulative `let angle` mutation in a render-phase
  `map`; converted to `reduce` so the slice array is built without
  re-assignment.
- `documents-hub.tsx`: `useMemo(() => ({ count: 0 }))` used as a
  mutable drag counter; converted to `useRef`.
- `notes-list.tsx`: `Date.now()` read during render for note-edit
  countdown (impure) → pinned to a `now` state ticked every 30s.
- `onboarding-checklist.tsx` / `user-profile.tsx` /
  `user-settings.tsx`: `useEffect(() => void load(), [])` with the
  `load` function declared AFTER the effect — relied on hoisting,
  trips Compiler's "access before declared" rule. Declared inside
  the effect.

Pattern fixes (intentional cache-via-ref → state or layout-effect):
- 6 `ref.current = x` writes during render moved into layout
  effects (`use-realtime-invalidation`, `settings-form-card`,
  `inbox`).
- 3 `ref.current` reads during render (search totals cache,
  scanner file ref) rewritten to backed-by-state.
- `use-is-mobile.ts` rewritten on `useSyncExternalStore` to avoid
  the SSR-then-rehydrate setState dance.
- `use-notifications.ts` rewritten to write socket pushes directly
  into the React Query cache via `setQueryData`, removing a local
  state mirror.

Rule config (`eslint.config.mjs`):
- `react-hooks/purity` → error (was warn, cleared)
- `react-hooks/set-state-in-render` → error (was warn, cleared)
- `react-hooks/immutability` → error (was warn, cleared)
- `react-hooks/refs` → error (was warn, cleared)
- `react-hooks/incompatible-library` → off (informational only)
- `react-hooks/set-state-in-effect` → warn (51 remaining, all the
  useEffect→fetch→setState data-fetch pattern; migration to
  useQuery tracked in BACKLOG)

Verified: tsc clean, eslint 0 errors / 69 warnings (down from 105),
vitest 1315/1315, next build green.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/components/documents/documents-hub.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import Link from 'next/link';
 import { useQueryClient } from '@tanstack/react-query';
 import { ChevronDown, ChevronRight, FileText, Plus, Upload } from 'lucide-react';
@@ -478,33 +478,29 @@ interface FolderDropZoneProps {
 function FolderDropZone({ folderId, entityType, entityId, children }: FolderDropZoneProps) {
   const [dragActive, setDragActive] = useState(false);
   const [uploading, setUploading] = useState(false);
-  const dragCounter = useMemo(() => ({ count: 0 }), []);
+  // useRef for mutable per-drag counters — useMemo's value is supposed
+  // to be immutable; React Compiler flags writes as a bug class.
+  const dragCounter = useRef(0);
   const queryClient = useQueryClient();
   const portId = useUIStore((s) => s.currentPortId);
 
-  const onDragEnter = useCallback(
-    (e: React.DragEvent<HTMLDivElement>) => {
-      // Only react to drags that carry files. Avoids fighting with
-      // text-selection / element drags inside the listing.
-      if (!Array.from(e.dataTransfer.types).includes('Files')) return;
-      e.preventDefault();
-      dragCounter.count += 1;
-      if (dragCounter.count === 1) setDragActive(true);
-    },
-    [dragCounter],
-  );
+  const onDragEnter = useCallback((e: React.DragEvent<HTMLDivElement>) => {
+    // Only react to drags that carry files. Avoids fighting with
+    // text-selection / element drags inside the listing.
+    if (!Array.from(e.dataTransfer.types).includes('Files')) return;
+    e.preventDefault();
+    dragCounter.current += 1;
+    if (dragCounter.current === 1) setDragActive(true);
+  }, []);
 
-  const onDragLeave = useCallback(
-    (e: React.DragEvent<HTMLDivElement>) => {
-      if (!Array.from(e.dataTransfer.types).includes('Files')) return;
-      dragCounter.count -= 1;
-      if (dragCounter.count <= 0) {
-        dragCounter.count = 0;
-        setDragActive(false);
-      }
-    },
-    [dragCounter],
-  );
+  const onDragLeave = useCallback((e: React.DragEvent<HTMLDivElement>) => {
+    if (!Array.from(e.dataTransfer.types).includes('Files')) return;
+    dragCounter.current -= 1;
+    if (dragCounter.current <= 0) {
+      dragCounter.current = 0;
+      setDragActive(false);
+    }
+  }, []);
 
   const onDragOver = useCallback((e: React.DragEvent<HTMLDivElement>) => {
     if (!Array.from(e.dataTransfer.types).includes('Files')) return;
@@ -516,7 +512,7 @@ function FolderDropZone({ folderId, entityType, entityId, children }: FolderDrop
     async (e: React.DragEvent<HTMLDivElement>) => {
       if (!Array.from(e.dataTransfer.types).includes('Files')) return;
       e.preventDefault();
-      dragCounter.count = 0;
+      dragCounter.current = 0;
       setDragActive(false);
       const files = Array.from(e.dataTransfer.files);
       if (files.length === 0) return;
@@ -549,7 +545,7 @@ function FolderDropZone({ folderId, entityType, entityId, children }: FolderDrop
         setUploading(false);
       }
     },
-    [dragCounter, folderId, entityType, entityId, portId, queryClient],
+    [folderId, entityType, entityId, portId, queryClient],
   );
 
   return (