@buildinternet/uploads 0.24.0 → 0.25.0

package/README.md

@@ -91,8 +91,12 @@ attachments when one opens: automatically via the
 [GitHub App](https://uploads.sh/docs/github-app) webhook, or on the first
 `attach` after the PR exists (`--promote` forces it with no new files,
 `--no-promote` opts out). `uploads github link` inspects or claims the
-workspace↔repo binding the webhook path uses. Promoted staging is cleaned up
-server-side after ~7 days (~30 for branches that never got a PR).
+workspace↔repo binding the webhook path uses. Promotion is copy-and-keep —
+the staged original is never deleted, so any URL already embedded keeps
+serving — and staged objects follow only normal per-workspace retention and
+explicit deletes. Promotion (auto or `--promote`) does skip files staged
+more than 30 days before the PR opens, though; they're still there, just no
+longer auto-promoted.
 
 **Bare `put` stages too, by default (issue #403):** on a non-default git
 branch, a `put` with none of

package/dist/github.d.ts

@@ -123,6 +123,10 @@ export declare const ATTACHMENT_IMAGE_WIDTH_WIDE = 640;
  * practical signal (we don't re-fetch dimensions when rebuilding the comment).
  */
 export declare function attachmentImageWidth(filename: string): number;
+/** Max display width for one image inside a before/after pair row — smaller
+ * than a standalone image so two side by side stay under GitHub's comment
+ * column width (and don't overflow on mobile). */
+export declare const ATTACHMENT_IMAGE_WIDTH_PAIR = 320;
 /**
  * Render the one marker-owned GitHub comment. When there are no galleries this
  * intentionally preserves the legacy attachment-only body byte-for-byte.

package/dist/github.js

@@ -255,6 +255,120 @@ function metaCaptionMarkdown(meta) {
         return "";
     return ` · ${parts.map((p) => escapeMarkdownText(escapeHtmlText(p))).join(" · ")}`;
 }
+/** Extract the filename stem's before/after token (issue #419 fallback pairing).
+ * `base` is the stem lowercased with the token removed; `null` when the stem
+ * carries no recognizable before/after token. Requires a separator (`-`, `_`,
+ * or `.`) between the token and the rest of the name — except when the token
+ * IS the whole stem (`before.png`) — so `beforehand.png` doesn't false-match. */
+// Token bounded by `-`, `_`, `.`, or stem start/end, so `hero-before.webp`
+// and `paired-view-before-desktop.webp` match but `beforehand.webp` does
+// not. Mirrors before-after.ts's TOKEN_RE (file page), applied to the stem.
+const STEM_TOKEN_RE = /(^|[-_.])(before|after)($|[-_.])/i;
+function filenameStemToken(name) {
+    const dot = name.lastIndexOf(".");
+    const stem = dot > 0 ? name.slice(0, dot) : name;
+    const m = STEM_TOKEN_RE.exec(stem);
+    if (!m)
+        return null;
+    const state = m[2].toLowerCase();
+    const tokenStart = m.index + m[1].length;
+    const tokenEnd = tokenStart + m[2].length;
+    // Base = stem with the token and one adjoining delimiter removed, so
+    // `paired-view-before-desktop` and `paired-view-after-desktop` both
+    // collapse to `paired-view-desktop` and group together.
+    const base = m[1].length > 0
+        ? stem.slice(0, m.index) + stem.slice(tokenEnd)
+        : stem.slice(tokenEnd + m[3].length);
+    return { base: base.toLowerCase(), state };
+}
+/**
+ * Pair up attachments for the before/after side-by-side row (issue #419).
+ * `isImageAt[i]` mirrors the renderer's own image test — only images pair;
+ * videos and non-image links render exactly as before.
+ *
+ * Priority order, checked independently per candidate item so rule 2 only
+ * ever claims items rule 1 left untouched:
+ *  1. Same `path` metadata (trimmed, not bare `/`), one item `state=before`
+ *     and one `state=after`. Ambiguous groups (more than one of a state)
+ *     don't pair — no way to know which side goes with which.
+ *  2. No usable `path` metadata: filename stems that differ only by a
+ *     before/after token, same extension. Same ambiguity rule.
+ */
+function pairAttachments(items, isImageAt) {
+    const partnerOf = new Map();
+    const roleOf = new Map();
+    const pair = (beforeIdx, afterIdx) => {
+        partnerOf.set(beforeIdx, afterIdx);
+        partnerOf.set(afterIdx, beforeIdx);
+        roleOf.set(beforeIdx, "before");
+        roleOf.set(afterIdx, "after");
+    };
+    // Priority 1: same path metadata, exactly one before + one after.
+    const pathGroups = new Map();
+    items.forEach((item, i) => {
+        if (!isImageAt[i])
+            return;
+        const path = item.meta?.path?.trim();
+        if (!path || path === "/")
+            return;
+        const state = item.meta?.state?.trim().toLowerCase();
+        if (state !== "before" && state !== "after")
+            return;
+        const g = pathGroups.get(path) ?? { before: [], after: [] };
+        g[state].push(i);
+        pathGroups.set(path, g);
+    });
+    for (const g of pathGroups.values()) {
+        if (g.before.length === 1 && g.after.length === 1)
+            pair(g.before[0], g.after[0]);
+    }
+    // Priority 2: no usable path metadata — filename stem token, same extension.
+    const stemGroups = new Map();
+    items.forEach((item, i) => {
+        if (!isImageAt[i] || partnerOf.has(i))
+            return;
+        const path = item.meta?.path?.trim();
+        if (path && path !== "/")
+            return; // usable path metadata — rule 1 owns this item
+        const name = item.key.slice(item.key.lastIndexOf("/") + 1);
+        const tok = filenameStemToken(name);
+        if (!tok)
+            return;
+        const dot = name.lastIndexOf(".");
+        const ext = dot > 0 ? name.slice(dot).toLowerCase() : "";
+        const key = `${tok.base}${ext}`;
+        const g = stemGroups.get(key) ?? { before: [], after: [] };
+        g[tok.state].push(i);
+        stemGroups.set(key, g);
+    });
+    for (const g of stemGroups.values()) {
+        if (g.before.length === 1 && g.after.length === 1)
+            pair(g.before[0], g.after[0]);
+    }
+    return { partnerOf, roleOf };
+}
+/** Max display width for one image inside a before/after pair row — smaller
+ * than a standalone image so two side by side stay under GitHub's comment
+ * column width (and don't overflow on mobile). */
+export const ATTACHMENT_IMAGE_WIDTH_PAIR = 320;
+function renderPairCell(item, label) {
+    const name = item.key.slice(item.key.lastIndexOf("/") + 1);
+    const src = item.embedUrl ?? item.url;
+    const link = item.pageUrl ?? item.url;
+    const w = Math.min(attachmentImageWidth(name), ATTACHMENT_IMAGE_WIDTH_PAIR);
+    const alt = escapeHtmlAttr(name);
+    const href = escapeHtmlAttr((link ?? src));
+    const imgSrc = escapeHtmlAttr(src);
+    const caption = metaCaptionHtml(item.meta);
+    const captionHtml = caption ? `<br><sub>${caption}</sub>` : "";
+    return `<td align="center"><sub><strong>${label}</strong></sub><br><a href="${href}"><img width="${w}" alt="${alt}" src="${imgSrc}"></a>${captionHtml}</td>`;
+}
+/** One side-by-side before/after row (issue #419): a single HTML table so
+ * GitHub renders both images on one line, with `Before`/`After` labels and
+ * each side's usual path/state caption preserved underneath. */
+function renderPairRow(beforeItem, afterItem) {
+    return `<table><tr>${renderPairCell(beforeItem, "Before")}${renderPairCell(afterItem, "After")}</tr></table>`;
+}
 /**
  * Render the one marker-owned GitHub comment. When there are no galleries this
  * intentionally preserves the legacy attachment-only body byte-for-byte.
@@ -279,9 +393,36 @@ export function attachmentsCommentBody(items, galleries = [], marker = ATTACHMEN
     }
     if (sorted.length > 0 || sortedGalleries.length === 0)
         lines.push("### 📎 Attachments", "");
+    const isImageAt = sorted.map((item) => {
+        const name = item.key.slice(item.key.lastIndexOf("/") + 1);
+        const src = item.embedUrl ?? item.url;
+        return Boolean(src) && inferContentType(name).startsWith("image/");
+    });
+    const { partnerOf, roleOf } = pairAttachments(sorted, isImageAt);
+    const consumedByPair = new Set();
     let inlinedImages = 0;
     const overflowImages = [];
-    for (const item of sorted) {
+    for (let idx = 0; idx < sorted.length; idx++) {
+        if (consumedByPair.has(idx))
+            continue;
+        const item = sorted[idx];
+        const partnerIdx = partnerOf.get(idx);
+        if (partnerIdx !== undefined) {
+            const partner = sorted[partnerIdx];
+            if (inlinedImages + 2 <= MAX_INLINE_ATTACHMENT_IMAGES) {
+                inlinedImages += 2;
+                consumedByPair.add(partnerIdx);
+                const beforeItem = roleOf.get(idx) === "before" ? item : partner;
+                const afterItem = roleOf.get(idx) === "before" ? partner : item;
+                lines.push(renderPairRow(beforeItem, afterItem), "");
+                continue;
+            }
+            // Cap already full for a two-image row — degrade this pair to two
+            // ordinary overflow entries rather than only half-rendering the row.
+            overflowImages.push(item, partner);
+            consumedByPair.add(partnerIdx);
+            continue;
+        }
         const name = item.key.slice(item.key.lastIndexOf("/") + 1);
         const stable = item.url;
         const src = item.embedUrl ?? item.url;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@buildinternet/uploads",
-  "version": "0.24.0",
+  "version": "0.25.0",
   "description": "CLI and client for uploads.sh — workspace-scoped image hosting for GitHub embeds",
   "type": "module",
   "sideEffects": false,