fix(web): crisp thumbnails via Cloudflare transforms + backfill capped screenshot groups - #726
Conversation
Thumbnail tiles inlined the full-size original and let the browser downscale it, which made text look jagged. thumbUrl() rewrites uploads.sh-zone embed URLs to the same-origin /cdn-cgi/image path form (fit=scale-down, format=auto, onerror=redirect); other hosts, SVGs, and already-transformed URLs pass through untouched. Applied to the file table list thumb (64) and grid card (560), and the screenshots page tiles (560) and hover preview (1120).
The by-path overview thumbs only the 50 most recent (project, path) groups; filtering — especially by project — surfaces catalog paths past that cap, which rendered as bare headings with no tiles. Backfill those strips lazily through the drill-in's files/search?meta.path route, filtered to the group's project with the projectLabelFromItemMeta mirror, batched 12 per pass and cached per (project, path). Late responses are never dropped: the cache is view-independent, so the effect keeps no cancellation guard.
|
Deploying with
|
| Status | Name | Latest Commit | Preview URL | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! View logs |
uploads-web | 985dae0 | Commit Preview URL Branch Preview URL |
Aug 21 2026, 12:43 AM |
|
Important Review skippedAuto reviews are limited based on label configuration. 🏷️ Required labels (at least one) (2)
🚫 Excluded labels (none allowed) (1)
Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
Maintained by uploads.sh · add media: |
1 participant
Summary
Two thumbnail fixes on the signed-in pages:
1. Thumbnails now go through Cloudflare Image Transformations (
1899a97)Thumbnail tiles inlined the full-size original and let the browser downscale it — jagged text on small tiles, and multi-MB full-page captures fetched for 26px thumbs. New
thumbUrl(src, width)helper rewrites uploads.sh-zone embed URLs (embed./storage./store.uploads.sh) to the same-origin/cdn-cgi/image/width=…,quality=82,fit=scale-down,format=auto,onerror=redirect/…path form. Applied at 2× CSS size for retina:Pass-through for BYO-bucket hosts, SVGs, and already-transformed URLs;
onerror=redirectfalls back to the original bytes on transform failure;fit=scale-downnever upscales. Transformations is already enabled on the zone (verified against prod: 63KB original → ~1.7KB tile). Full-size viewers (/f/MediaStage, galleries) untouched. No CSP change — the transform URL is same-origin on the image host.2. Screenshots page: backfill thumb strips past the by-path group cap (
985dae0)The by-path overview thumbs only the 50 most-recent (project, path) groups globally, while the filterable catalog carries up to 500 paths. Filtering by project surfaced catalog paths whose group fell past that cap, rendering bare headings with no tiles. Those strips are now fetched lazily through the same
files/search?meta.path=…route the drill-in uses, filtered to the group's project via theprojectLabelFromItemMetamirror, batched 12 per pass (chained until done) and cached per (project, path). No API change.Verification
thumb-url.test.ts,workspace-screenshots.test.ts); full web suite 748 passing,astro check+ worker typecheck clean.Visual
Same prod screenshot rendered at tile width — left is the old full-size original browser-downscaled, right goes through the transform (63.6 KB → 8.5 KB transferred):