fix(workspace): only request a page thumbnail for documents that render a page

CSV, Excel, email and text documents have no rendered page image, so the work
queue thumbnail 404'd on /pages/1.png and noised up the browser console. Gate
the image request by file extension (pdf/png/jpg/tiff); other types show the
document-type glyph directly with no request.

Author: xt0n1-t3ch

web/components/workspace/queue-thumbnail.tsx

@@ -27,15 +27,27 @@ const glyphFor = (documentType?: ReinsuranceDocumentType) => {
 
 // Lazily probes the document's first page image. Digital documents (e-mail, CSV,
 // plain text) have no rendered page, so the request 404s and the type glyph stays.
+// Only these formats render a page image; requesting one for any other type
+// (CSV, Excel, e-mail, plain text) just 404s and noises up the console.
+const PAGE_IMAGE_EXTENSIONS = [".pdf", ".png", ".jpg", ".jpeg", ".tif", ".tiff"];
+
+const rendersPage = (fileName?: string): boolean => {
+  const lower = (fileName ?? "").toLowerCase();
+  return PAGE_IMAGE_EXTENSIONS.some((extension) => lower.endsWith(extension));
+};
+
 export function QueueThumbnail({
   documentId,
   documentType,
+  fileName,
 }: {
   documentId: string;
   documentType?: ReinsuranceDocumentType;
+  fileName?: string;
 }) {
   const [hasImage, setHasImage] = useState(false);
   const Glyph = glyphFor(documentType);
+  const canRenderPage = rendersPage(fileName);
 
   return (
     <span className="relative flex h-12 w-[2.375rem] shrink-0 items-center justify-center overflow-hidden rounded-md border border-border bg-surface-2 text-subtle-foreground shadow-soft ring-1 ring-inset ring-border/40 transition-[border-color,box-shadow] group-hover:border-border-strong group-hover:shadow-pop">
@@ -44,19 +56,23 @@ export function QueueThumbnail({
           <Glyph width={15} height={15} />
         </span>
       )}
-      {/* eslint-disable-next-line @next/next/no-img-element */}
-      <img
-        src={api.pageImageUrl(documentId, 1)}
-        alt=""
-        aria-hidden="true"
-        loading="lazy"
-        onLoad={() => setHasImage(true)}
-        onError={() => setHasImage(false)}
-        className={cn(
-          "absolute inset-0 h-full w-full object-cover object-top transition-opacity duration-300",
-          hasImage ? "opacity-100" : "opacity-0",
-        )}
-      />
+      {canRenderPage && (
+        <>
+          {/* eslint-disable-next-line @next/next/no-img-element */}
+          <img
+            src={api.pageImageUrl(documentId, 1)}
+            alt=""
+            aria-hidden="true"
+            loading="lazy"
+            onLoad={() => setHasImage(true)}
+            onError={() => setHasImage(false)}
+            className={cn(
+              "absolute inset-0 h-full w-full object-cover object-top transition-opacity duration-300",
+              hasImage ? "opacity-100" : "opacity-0",
+            )}
+          />
+        </>
+      )}
       {/* A faint top sheen sells the thumbnail as a real page edge, not a flat box. */}
       {hasImage && (
         <span

web/components/workspace/work-queue.tsx

@@ -27,7 +27,7 @@ function QueueRow({ document }: { document: DocumentSummary }) {
         className="absolute inset-y-0 left-0 w-0.5 origin-center scale-y-0 bg-primary transition-transform duration-200 ease-out group-hover:scale-y-100 group-focus-visible:scale-y-100"
       />
       <div className="flex min-w-0 items-center gap-3.5">
-        <QueueThumbnail documentId={document.id} documentType={document.documentType} />
+        <QueueThumbnail documentId={document.id} documentType={document.documentType} fileName={document.fileName} />
         <span className="flex min-w-0 flex-col gap-1">
           <span className="truncate text-sm font-medium tracking-tight text-foreground/90 transition-colors group-hover:text-foreground">
             {document.fileName}