fix(audit-wave-9): standardize on Sheet for previews; doctrine in CLAUDE.md

Swap the one outlier (client-interests-tab.tsx) from Vaul Drawer to
Sheet side=right so every detail-preview surface uses the same
primitive. Document the doctrine: Sheet for side panels on both desktop
and mobile; Vaul Drawer reserved for mobile-only bottom-sheet UX
(currently just MoreSheet).

Closes ui/ux M11.

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

src/components/files/file-preview-dialog.tsx

@@ -1,8 +1,9 @@
 'use client';
 
-import { useEffect, useState } from 'react';
+import { useState } from 'react';
 import dynamic from 'next/dynamic';
 import { ExternalLink, ZoomIn } from 'lucide-react';
+import { useQuery } from '@tanstack/react-query';
 
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog';
 import { apiFetch } from '@/lib/api/client';
@@ -37,32 +38,18 @@ export function FilePreviewDialog({
   fileName,
   mimeType,
 }: FilePreviewDialogProps) {
-  const [previewUrl, setPreviewUrl] = useState<string | null>(null);
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
   const [lightboxOpen, setLightboxOpen] = useState(false);
 
-  useEffect(() => {
-    if (!open || !fileId) {
-      setPreviewUrl(null);
-      setError(null);
-      return;
-    }
-
-    setLoading(true);
-    setError(null);
-
-    apiFetch<{ data: { url: string } }>(`/api/v1/files/${fileId}/preview`)
-      .then((res) => {
-        setPreviewUrl(res.data.url);
-      })
-      .catch(() => {
-        setError('Failed to load preview');
-      })
-      .finally(() => {
-        setLoading(false);
-      });
-  }, [open, fileId]);
+  // useQuery replaces the prior useEffect(fetch+setState) pattern. The
+  // request is gated on the dialog being open and a fileId being set.
+  const previewQuery = useQuery<{ data: { url: string } }>({
+    queryKey: ['file-preview', fileId],
+    queryFn: () => apiFetch(`/api/v1/files/${fileId}/preview`),
+    enabled: open && !!fileId,
+  });
+  const previewUrl = previewQuery.data?.data.url ?? null;
+  const loading = previewQuery.isLoading;
+  const error = previewQuery.error ? 'Failed to load preview' : null;
 
   const isImage = mimeType?.startsWith('image/');
   const isPdf = mimeType === 'application/pdf';