Fix bug caused by the @pierre/diffs update.

Author: cpojer

core/__tests__/ReviewCodeView-scroll.test.tsx

@@ -2,6 +2,7 @@
  * @vitest-environment jsdom
  */
 
+import { CodeView, preloadHighlighter } from '@pierre/diffs';
 import { act, useCallback, useState } from 'react';
 import { createRoot, type Root } from 'react-dom/client';
 import { beforeEach, expect, test, vi } from 'vite-plus/test';
@@ -1282,6 +1283,50 @@ test('hunk navigation skips pull request description source context', async () =
   );
 });
 
+test('markdown preview files survive layout updates in the real virtualized renderer', async () => {
+  await preloadHighlighter({ langs: ['text'], themes: ['github-dark'] });
+  const file = createLoadedMarkdownFile('# Readme\n', 'markdown-layout');
+  await using app = await renderReact(<ReviewCodeViewHarness files={[file]} />);
+  const root = document.createElement('div');
+  root.className = 'code-view';
+  document.body.append(root);
+  const viewer = new CodeView<unknown>({
+    disableErrorHandling: true,
+    theme: 'github-dark',
+    themeType: 'dark',
+  });
+  try {
+    viewer.setup(root);
+    viewer.setItems(codeViewMock.lastItems);
+    viewer.render(true);
+    expect(viewer.getRenderedItems()).toHaveLength(1);
+    await app.rerender(<ReviewCodeViewHarness collapsed={new Set([file.path])} files={[file]} />);
+    expect(codeViewMock.lastItems[0]?.collapsed).toBe(true);
+    viewer.setItems(codeViewMock.lastItems);
+    expect(() => viewer.render(true)).not.toThrow();
+    expect(viewer.getRenderedItems()).toHaveLength(1);
+    await app.rerender(<ReviewCodeViewHarness files={[file]} />);
+    viewer.setItems(codeViewMock.lastItems);
+    expect(() => viewer.render(true)).not.toThrow();
+
+    const updatedFile = createLoadedMarkdownFile('# Updated readme\n', 'markdown-updated');
+    await app.rerender(<ReviewCodeViewHarness files={[updatedFile]} />);
+    expect(codeViewMock.lastItems[0]?.annotations).toEqual(
+      expect.arrayContaining([
+        expect.objectContaining({
+          metadata: expect.objectContaining({ contents: '# Updated readme\n' }),
+        }),
+      ]),
+    );
+    viewer.setItems(codeViewMock.lastItems);
+    expect(() => viewer.render(true)).not.toThrow();
+    expect(viewer.getRenderedItems()).toHaveLength(1);
+  } finally {
+    viewer.cleanUp();
+    root.remove();
+  }
+});
+
 test('read-only markdown previews trigger CodeView layout remeasurement after height change', async () => {
   const markdownFile = createLoadedMarkdownFile(
     '![diagram](https://example.com/diagram.png)\n',

core/__tests__/helpers/review-code-view.tsx

@@ -8,7 +8,7 @@ import type { ChangedFile, ReviewSource } from '../../types.ts';
 export type { ReviewDiffBlock } from '../../app/components/ReviewCodeView.tsx';
 
 const codeViewMockState = vi.hoisted(() => ({
-  lastItems: [] as ReadonlyArray<{ id: string; type: string; version?: unknown }>,
+  lastItems: [] as ReadonlyArray<CodeViewItem<unknown>>,
   lastOptions: null as Record<string, unknown> | null,
   postRenderNodes: [] as Array<HTMLElement>,
   renderCount: 0,

core/app/components/ReviewCodeView.tsx

@@ -120,6 +120,7 @@ import type {
   ReviewAuthor,
   ReviewSource,
 } from '../../types.ts';
+import { useCodeViewPlaceholderFile } from '../hooks/useCodeViewPlaceholderFile.ts';
 import { Avatar } from './Avatar.tsx';
 import { Button } from './Button.tsx';
 import { DefinitionPopover } from './DefinitionPopover.tsx';
@@ -2616,6 +2617,7 @@ export function ReviewCodeView({
   wordWrap: boolean;
 }) {
   const codeViewRef = useRef<CodeViewHandle<ReviewAnnotationMetadata, undefined>>(null);
+  const getPlaceholderFile = useCodeViewPlaceholderFile();
   const markdownEditorRefs = useRef(new Map<string, MarkdownDocumentEditorHandle>());
   const refreshingMarkdownSectionsRef = useRef(new Set<string>());
   const deferredTimersRef = useRef<Set<number>>(new Set());
@@ -2812,12 +2814,7 @@ export function ReviewCodeView({
             } satisfies LineAnnotation<ReviewAnnotationMetadata>,
           ],
           collapsed: false,
-          file: {
-            cacheKey: `walkthrough-header:${block.id}`,
-            contents: ' ',
-            lang: 'text',
-            name: headerId,
-          },
+          file: getPlaceholderFile(headerId),
           id: headerId,
           type: 'file',
           // Selection stays out of the version: a scroll-driven current-stop
@@ -2974,12 +2971,7 @@ export function ReviewCodeView({
               } satisfies LineAnnotation<ReviewAnnotationMetadata>,
             ],
             collapsed: isCollapsed,
-            file: {
-              cacheKey: `image-preview:${file.fingerprint}:${section.id}`,
-              contents: ' ',
-              lang: 'text',
-              name: file.path,
-            },
+            file: getPlaceholderFile(file.path),
             id,
             type: 'file',
             version: getItemVersion(
@@ -3010,14 +3002,7 @@ export function ReviewCodeView({
               } satisfies LineAnnotation<ReviewAnnotationMetadata>,
             ],
             collapsed: isCollapsed,
-            file: {
-              cacheKey: `markdown-preview:${section.newFile?.cacheKey ?? file.fingerprint}:${
-                markdownPreview.contents.length
-              }:${markdownPreviewAddedLinesDigest}`,
-              contents: ' ',
-              lang: 'text',
-              name: file.path,
-            },
+            file: getPlaceholderFile(file.path),
             id,
             type: 'file',
             version: getItemVersion(
@@ -3068,6 +3053,7 @@ export function ReviewCodeView({
     diffStyle,
     expandedReviewKeys,
     forceExpandedPaths,
+    getPlaceholderFile,
     imagePreviewLayoutPassBySection,
     isReadOnly,
     itemVersionByKey,
@@ -3091,17 +3077,15 @@ export function ReviewCodeView({
     return [
       {
         collapsed: true,
-        file: {
-          cacheKey: sourceDescriptionItemId,
-          contents: '',
-          lang: 'text',
-          name: shouldShowCommitMessage ? 'commit-message.md' : 'source-description.md',
-        },
+        file: getPlaceholderFile(
+          shouldShowCommitMessage ? 'commit-message.md' : 'source-description.md',
+          '',
+        ),
         id: sourceDescriptionItemId,
         type: 'file',
       },
     ];
-  }, [items, shouldShowCommitMessage, sourceDescriptionItemId]);
+  }, [getPlaceholderFile, items, shouldShowCommitMessage, sourceDescriptionItemId]);
 
   const clearCommentLineHighlight = useCallback(() => {
     codeViewRef.current?.clearSelectedLines();

core/app/hooks/useCodeViewPlaceholderFile.ts

@@ -0,0 +1,23 @@
+import type { FileContents } from '@pierre/diffs';
+import { useState } from 'react';
+
+export function useCodeViewPlaceholderFile() {
+  const [getPlaceholderFile] = useState(() => {
+    const files = new Map<string, FileContents>();
+
+    return (name: string, contents: '' | ' ' = ' '): FileContents => {
+      const cacheKey = `placeholder:${contents.length}:${name}`;
+      let file = files.get(cacheKey);
+      if (!file) {
+        file = { cacheKey, contents, lang: 'text', name };
+        files.set(cacheKey, file);
+      }
+      return file;
+    };
+  });
+
+  // VirtualizedFile prepares layout using the cached file object, then checks
+  // its identity against the rendered file. Keep these objects for the viewer's
+  // lifetime; preview content and layout changes belong to annotations/version.
+  return getPlaceholderFile;
+}