feat: persist viewed files in code review drafts (#332) (#335)

Extend the draft auto-save system to include viewed file state alongside
annotations. Viewed files are saved atomically in the same draft file,
restored together via the same banner, and backward compatible with
existing drafts (optional field, defaults to empty).

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: backnotprop

packages/review-editor/App.tsx

@@ -116,13 +116,15 @@ const ReviewApp: React.FC = () => {
   // Auto-save code annotation drafts
   const { draftBanner, restoreDraft, dismissDraft } = useCodeAnnotationDraft({
     annotations,
+    viewedFiles,
     isApiMode: !!origin,
     submitted: !!submitted,
   });
 
   const handleRestoreDraft = useCallback(() => {
     const restored = restoreDraft();
-    if (restored.length > 0) setAnnotations(restored);
+    if (restored.annotations.length > 0) setAnnotations(restored.annotations);
+    if (restored.viewedFiles.length > 0) setViewedFiles(new Set(restored.viewedFiles));
   }, [restoreDraft]);
 
   // VS Code editor annotations (only polls when inside VS Code webview)
@@ -828,7 +830,12 @@ const ReviewApp: React.FC = () => {
               onClose={dismissDraft}
               onConfirm={handleRestoreDraft}
               title="Draft Recovered"
-              message={draftBanner ? `Found ${draftBanner.count} annotation${draftBanner.count !== 1 ? 's' : ''} from ${draftBanner.timeAgo}. Would you like to restore them?` : ''}
+              message={draftBanner ? (() => {
+                const parts: string[] = [];
+                if (draftBanner.count > 0) parts.push(`${draftBanner.count} annotation${draftBanner.count !== 1 ? 's' : ''}`);
+                if (draftBanner.viewedCount > 0) parts.push(`${draftBanner.viewedCount} viewed file${draftBanner.viewedCount !== 1 ? 's' : ''}`);
+                return `Found ${parts.join(' and ')} from ${draftBanner.timeAgo}. Would you like to restore them?`;
+              })() : ''}
               confirmText="Restore"
               cancelText="Dismiss"
               showCancel

packages/ui/hooks/useCodeAnnotationDraft.ts

@@ -12,6 +12,7 @@ const DEBOUNCE_MS = 500;
 
 interface DraftData {
   codeAnnotations: CodeAnnotation[];
+  viewedFiles?: string[];
   ts: number;
 }
 
@@ -28,22 +29,24 @@ function formatTimeAgo(ts: number): string {
 
 interface UseCodeAnnotationDraftOptions {
   annotations: CodeAnnotation[];
+  viewedFiles: Set<string>;
   isApiMode: boolean;
   submitted: boolean;
 }
 
 interface UseCodeAnnotationDraftResult {
-  draftBanner: { count: number; timeAgo: string } | null;
-  restoreDraft: () => CodeAnnotation[];
+  draftBanner: { count: number; viewedCount: number; timeAgo: string } | null;
+  restoreDraft: () => { annotations: CodeAnnotation[]; viewedFiles: string[] };
   dismissDraft: () => void;
 }
 
 export function useCodeAnnotationDraft({
   annotations,
+  viewedFiles,
   isApiMode,
   submitted,
 }: UseCodeAnnotationDraftOptions): UseCodeAnnotationDraftResult {
-  const [draftBanner, setDraftBanner] = useState<{ count: number; timeAgo: string } | null>(null);
+  const [draftBanner, setDraftBanner] = useState<{ count: number; viewedCount: number; timeAgo: string } | null>(null);
   const draftDataRef = useRef<DraftData | null>(null);
   const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const hasMountedRef = useRef(false);
@@ -58,11 +61,14 @@ export function useCodeAnnotationDraft({
         return res.json();
       })
       .then((data: DraftData | null) => {
-        if (data?.codeAnnotations && Array.isArray(data.codeAnnotations) && data.codeAnnotations.length > 0) {
+        const annotationCount = Array.isArray(data?.codeAnnotations) ? data.codeAnnotations.length : 0;
+        const viewedCount = Array.isArray(data?.viewedFiles) ? data.viewedFiles.length : 0;
+        if (annotationCount > 0 || viewedCount > 0) {
           draftDataRef.current = data;
           setDraftBanner({
-            count: data.codeAnnotations.length,
-            timeAgo: formatTimeAgo(data.ts || 0),
+            count: annotationCount,
+            viewedCount,
+            timeAgo: formatTimeAgo(data?.ts || 0),
           });
         }
         hasMountedRef.current = true;
@@ -72,17 +78,18 @@ export function useCodeAnnotationDraft({
       });
   }, [isApiMode]);
 
-  // Debounced auto-save on annotation changes
+  // Debounced auto-save on annotation/viewed changes
   useEffect(() => {
     if (!isApiMode || submitted) return;
     if (!hasMountedRef.current) return;
-    if (annotations.length === 0) return;
+    if (annotations.length === 0 && viewedFiles.size === 0) return;
 
     if (timerRef.current) clearTimeout(timerRef.current);
 
     timerRef.current = setTimeout(() => {
       const payload: DraftData = {
         codeAnnotations: annotations,
+        viewedFiles: [...viewedFiles],
         ts: Date.now(),
       };
 
@@ -98,13 +105,16 @@ export function useCodeAnnotationDraft({
     return () => {
       if (timerRef.current) clearTimeout(timerRef.current);
     };
-  }, [annotations, isApiMode, submitted]);
+  }, [annotations, viewedFiles, isApiMode, submitted]);
 
   const restoreDraft = useCallback(() => {
     const data = draftDataRef.current;
     setDraftBanner(null);
     draftDataRef.current = null;
-    return data?.codeAnnotations ?? [];
+    return {
+      annotations: data?.codeAnnotations ?? [],
+      viewedFiles: data?.viewedFiles ?? [],
+    };
   }, []);
 
   const dismissDraft = useCallback(() => {