Restore static preview-image fallback for html

__tests__/components/drops/view/item/content/media/MediaDisplay.test.tsx

@@ -100,6 +100,22 @@ describe("MediaDisplay", () => {
     );
   });
 
+  it("renders preview image instead of iframe for html when preview is provided", () => {
+    render(
+      <MediaDisplay
+        media_mime_type="text/html"
+        media_url="ipfs://hash"
+        previewImageUrl="preview.png"
+      />
+    );
+
+    expect(screen.getByTestId("image")).toHaveAttribute(
+      "data-src",
+      "preview.png"
+    );
+    expect(screen.queryByTestId("iframe")).not.toBeInTheDocument();
+  });
+
   it("renders gated html iframe with normalized ipfs url after activation", () => {
     render(
       <MediaDisplay
@@ -121,6 +137,29 @@ describe("MediaDisplay", () => {
     );
   });
 
+  it("keeps gated html behavior when preview is provided", () => {
+    render(
+      <MediaDisplay
+        media_mime_type="text/html"
+        media_url="ipfs://hash"
+        previewImageUrl="preview.png"
+        requireInteractionToLoad
+      />
+    );
+
+    expect(screen.getByTestId("image")).toHaveAttribute(
+      "data-src",
+      "preview.png"
+    );
+
+    fireEvent.click(screen.getByTestId("load-gate"));
+
+    expect(screen.getByTestId("iframe")).toHaveAttribute(
+      "data-src",
+      "https://ipfs.io/ipfs/hash"
+    );
+  });
+
   it("renders empty fragment for unknown", () => {
     const { container } = render(
       <MediaDisplay media_mime_type="text/plain" media_url="file.txt" />

components/drops/view/item/content/media/MediaDisplay.tsx

@@ -167,6 +167,12 @@ export default function MediaDisplay({
   const mediaType = getMediaType();
 
   if (mediaType === MediaType.HTML) {
+    if (previewImageUrl && !requireInteractionToLoad) {
+      return (
+        <MediaDisplayImage src={previewImageUrl} imageScale={imageScale} />
+      );
+    }
+
     return (
       <InteractiveHtmlMediaDisplay
         key={`${media_mime_type}:${media_url}`}