@jant/core 0.6.10 → 0.6.12

package/src/lib/url-fetch.ts

@@ -0,0 +1,263 @@
+/**
+ * Safe remote URL fetching for server-side image sideloading.
+ *
+ * When an author pastes an article from another site, its `<img>` tags point at
+ * remote URLs. To rehost those images into the site's own storage the server
+ * must fetch the bytes itself (a browser `fetch` of a third-party image is
+ * blocked by CORS for most hosts). Because the URL comes from pasted HTML it is
+ * attacker-influenced, so every fetch passes through an SSRF guard and a bounded
+ * reader that caps size and time.
+ *
+ * Note: DNS is not resolvable from a Cloudflare Worker, so the IP-literal checks
+ * here are defense-in-depth for self-hosted (Node) deployments and for URLs that
+ * embed a literal address. They are not a substitute for network-level egress
+ * controls.
+ */
+
+import { ValidationError } from "./errors.js";
+
+/** A browser-like UA — many CDNs serving article images block unknown bots. */
+const FETCH_USER_AGENT =
+  "Mozilla/5.0 (compatible; Jant image sideloader) AppleWebKit/537.36";
+
+export interface FetchedImage {
+  bytes: Uint8Array;
+  /** Lowercased content-type with parameters stripped, or null if absent. */
+  contentType: string | null;
+}
+
+export interface FetchImageBytesOptions {
+  /** Reject (and abort) once the body exceeds this many bytes. */
+  maxBytes: number;
+  /** Abort the whole request after this many milliseconds. */
+  timeoutMs: number;
+  /** Maximum redirect hops to follow (each re-validated). Default 3. */
+  maxRedirects?: number;
+}
+
+/**
+ * Validate that a string is a public http(s) URL safe to fetch server-side.
+ *
+ * Throws {@link ValidationError} for non-http(s) protocols, embedded
+ * credentials, localhost names, and private/loopback/link-local/ULA/CGNAT IP
+ * literals (including the `169.254.169.254` cloud-metadata address).
+ *
+ * @param raw - The candidate URL string
+ * @returns The parsed {@link URL}
+ * @example
+ * ```ts
+ * const url = assertPublicHttpUrl("https://example.com/photo.jpg");
+ * ```
+ */
+export function assertPublicHttpUrl(raw: string): URL {
+  let url: URL;
+  try {
+    url = new URL(raw);
+  } catch {
+    throw new ValidationError("That doesn't look like a valid image URL.");
+  }
+
+  if (url.protocol !== "http:" && url.protocol !== "https:") {
+    throw new ValidationError("Only http and https image URLs can be fetched.");
+  }
+  if (url.username || url.password) {
+    throw new ValidationError("Image URLs can't include credentials.");
+  }
+
+  const host = url.hostname.toLowerCase();
+  if (
+    host === "localhost" ||
+    host.endsWith(".localhost") ||
+    host === "0.0.0.0" ||
+    isPrivateIpv4(host) ||
+    isPrivateIpv6(host)
+  ) {
+    throw new ValidationError("That image URL points to a private address.");
+  }
+
+  return url;
+}
+
+/**
+ * Fetch a remote image with an SSRF-checked redirect chain, a size cap, and a
+ * timeout. Reads the body in chunks and aborts the moment it exceeds `maxBytes`
+ * so an untrusted host can't exhaust memory.
+ *
+ * @param startUrl - A URL already validated by {@link assertPublicHttpUrl}
+ * @param options - Size cap, timeout, and redirect budget
+ * @returns The raw bytes and the response content-type
+ * @example
+ * ```ts
+ * const { bytes, contentType } = await fetchImageBytes(url, {
+ *   maxBytes: 25 * 1024 * 1024,
+ *   timeoutMs: 15000,
+ * });
+ * ```
+ */
+export async function fetchImageBytes(
+  startUrl: URL,
+  options: FetchImageBytesOptions,
+): Promise<FetchedImage> {
+  const maxRedirects = options.maxRedirects ?? 3;
+  const controller = new AbortController();
+  const timer = setTimeout(() => controller.abort(), options.timeoutMs);
+
+  try {
+    let url = startUrl;
+    let response: Response | null = null;
+
+    for (let hop = 0; hop <= maxRedirects; hop++) {
+      response = await fetch(url.toString(), {
+        method: "GET",
+        redirect: "manual",
+        signal: controller.signal,
+        headers: {
+          Accept: "image/*,*/*;q=0.8",
+          "User-Agent": FETCH_USER_AGENT,
+          // Many CDNs (Douban, WeChat, etc.) reject hotlinked image requests
+          // that lack a Referer. Sending the image's own origin satisfies the
+          // common "referer must be same-site" hotlink check.
+          Referer: `${url.origin}/`,
+        },
+      }).catch((error) => {
+        if (controller.signal.aborted) {
+          throw new ValidationError("Timed out fetching the image.");
+        }
+        throw new ValidationError(
+          error instanceof Error
+            ? `Couldn't fetch the image: ${error.message}`
+            : "Couldn't fetch the image.",
+        );
+      });
+
+      if (response.status >= 300 && response.status < 400) {
+        const location = response.headers.get("location");
+        if (!location) break; // No target — fall through to the (failing) checks.
+        if (hop === maxRedirects) {
+          throw new ValidationError("Too many redirects fetching the image.");
+        }
+        // Re-validate every hop so a redirect can't escape the SSRF guard.
+        url = assertPublicHttpUrl(new URL(location, url).toString());
+        continue;
+      }
+      break;
+    }
+
+    if (!response) {
+      throw new ValidationError("Couldn't fetch the image.");
+    }
+    if (!response.ok) {
+      throw new ValidationError(
+        `Couldn't fetch the image (HTTP ${response.status}).`,
+      );
+    }
+
+    const declared = Number(response.headers.get("content-length"));
+    if (Number.isFinite(declared) && declared > options.maxBytes) {
+      throw new ValidationError("That image is too large.");
+    }
+
+    const contentType = normalizeContentType(
+      response.headers.get("content-type"),
+    );
+    const bytes = await readBounded(response, options.maxBytes);
+    return { bytes, contentType };
+  } finally {
+    clearTimeout(timer);
+  }
+}
+
+async function readBounded(
+  response: Response,
+  maxBytes: number,
+): Promise<Uint8Array> {
+  const body = response.body;
+  if (!body) {
+    const buffer = new Uint8Array(await response.arrayBuffer());
+    if (buffer.byteLength > maxBytes) {
+      throw new ValidationError("That image is too large.");
+    }
+    return buffer;
+  }
+
+  const reader = body.getReader();
+  const chunks: Uint8Array[] = [];
+  let total = 0;
+  for (;;) {
+    const { done, value } = await reader.read();
+    if (done) break;
+    if (!value) continue;
+    total += value.byteLength;
+    if (total > maxBytes) {
+      await reader.cancel().catch(() => {});
+      throw new ValidationError("That image is too large.");
+    }
+    chunks.push(value);
+  }
+
+  const out = new Uint8Array(total);
+  let offset = 0;
+  for (const chunk of chunks) {
+    out.set(chunk, offset);
+    offset += chunk.byteLength;
+  }
+  return out;
+}
+
+function normalizeContentType(raw: string | null): string | null {
+  if (!raw) return null;
+  const type = raw.split(";")[0]?.trim().toLowerCase();
+  return type || null;
+}
+
+/**
+ * True when a canonicalized IPv4 dotted-quad host is in a private, loopback,
+ * link-local, CGNAT, or otherwise non-public range. The WHATWG URL parser
+ * already normalizes decimal/octal/hex IPv4 forms to dotted-quad, so checking
+ * `url.hostname` is sufficient.
+ */
+function isPrivateIpv4(host: string): boolean {
+  const match = host.match(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/);
+  if (!match) return false;
+  const octets = match.slice(1, 5).map(Number);
+  if (octets.some((part) => part > 255)) return true; // Malformed → unsafe.
+  const a = octets[0] ?? 0;
+  const b = octets[1] ?? 0;
+  if (a === 0) return true; // 0.0.0.0/8 "this" network
+  if (a === 10) return true; // 10/8 private
+  if (a === 127) return true; // 127/8 loopback
+  if (a === 169 && b === 254) return true; // 169.254/16 link-local (metadata)
+  if (a === 172 && b >= 16 && b <= 31) return true; // 172.16/12 private
+  if (a === 192 && b === 168) return true; // 192.168/16 private
+  if (a === 100 && b >= 64 && b <= 127) return true; // 100.64/10 CGNAT
+  if (a === 255 && b === 255) return true; // broadcast
+  return false;
+}
+
+/** True when an IPv6 host (bracketed or bare) is loopback/link-local/ULA/mapped-private. */
+function isPrivateIpv6(host: string): boolean {
+  let inner = host;
+  if (inner.startsWith("[") && inner.endsWith("]")) {
+    inner = inner.slice(1, -1);
+  }
+  if (!inner.includes(":")) return false;
+  const lower = inner.toLowerCase();
+  if (lower === "::" || lower === "::1") return true; // unspecified / loopback
+
+  // IPv4-mapped, dotted form (::ffff:1.2.3.4).
+  const dotted = lower.match(/^::ffff:(\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})$/);
+  if (dotted?.[1]) return isPrivateIpv4(dotted[1]);
+
+  // IPv4-mapped, hex form (::ffff:a00:1) — what the URL parser normalizes to.
+  const hex = lower.match(/^::ffff:([0-9a-f]{1,4}):([0-9a-f]{1,4})$/);
+  if (hex) {
+    const hi = parseInt(hex[1] ?? "0", 16);
+    const lo = parseInt(hex[2] ?? "0", 16);
+    const v4 = `${(hi >> 8) & 0xff}.${hi & 0xff}.${(lo >> 8) & 0xff}.${lo & 0xff}`;
+    return isPrivateIpv4(v4);
+  }
+
+  if (/^fe[89ab]/.test(lower)) return true; // fe80::/10 link-local
+  if (/^f[cd]/.test(lower)) return true; // fc00::/7 unique local
+  return false;
+}

package/src/preset.css

@@ -182,9 +182,9 @@ html {
   --tw-prose-quote-borders: var(--color-border);
   --tw-prose-captions: var(--color-muted-foreground);
   --tw-prose-kbd: var(--color-foreground);
-  --tw-prose-code: var(--color-foreground);
-  --tw-prose-pre-code: var(--color-muted-foreground);
-  --tw-prose-pre-bg: var(--color-muted);
+  --tw-prose-code: var(--site-code-text);
+  --tw-prose-pre-code: var(--site-code-text);
+  --tw-prose-pre-bg: var(--site-code-block-bg);
   --tw-prose-th-borders: var(--color-border);
   --tw-prose-td-borders: var(--color-border);
   font-family: var(--font-body);
@@ -213,14 +213,12 @@ html {
 
   :where(h2) {
     font-size: var(--type-content-title);
-    font-style: italic;
     margin-top: 2.1rem;
     margin-bottom: 1.4rem;
   }
 
   :where(h3) {
     font-size: var(--type-content-subtitle);
-    font-style: italic;
     margin-top: 2rem;
     margin-bottom: 1.4rem;
   }
@@ -236,12 +234,12 @@ html {
 
   :where(ul, ol) {
     margin: 1.25em 0;
-    padding-left: 1.625em;
+    padding-left: 1.4em;
   }
 
   :where(li, dt) {
-    margin-top: 1.2em;
-    margin-bottom: 1.2em;
+    margin-top: 0.65em;
+    margin-bottom: 0.65em;
   }
 
   /* Normalize li > p so list spacing is controlled by li alone,
@@ -257,18 +255,35 @@ html {
   :where(code, pre code) {
     font-size: var(--type-code);
     line-height: 1.42;
+    color: var(--site-code-text);
     overflow-wrap: break-word;
   }
 
   :where(:not(pre) > code) {
-    padding: 0.1em 0.35em;
-    background-color: var(--site-feed-card-bg);
-    border: 1px solid var(--site-feed-card-border);
-    border-radius: 0.25rem;
+    padding: 0.08em 0.28em;
+    background-color: var(--site-code-bg);
+    border-radius: 0.22em;
+    box-decoration-break: clone;
+    -webkit-box-decoration-break: clone;
+  }
+
+  :where(:not(pre) > code)::before,
+  :where(:not(pre) > code)::after {
+    content: none;
+  }
+
+  :where(pre) {
+    background-color: var(--site-code-block-bg);
+    border: 1px solid var(--site-code-block-border);
+    border-radius: 6px;
   }
 
   :where(pre code) {
     font-size: var(--type-code-block);
+    color: inherit;
+    background: transparent;
+    border: 0;
+    padding: 0;
   }
 
   :where(h1, h2, h3) :where(code) {
@@ -425,6 +440,37 @@ html {
   margin-bottom: 0;
 }
 
+/*
+ * Feed body headings
+ *
+ * In list contexts, the post title owns the card heading level. Authored
+ * headings inside the body should remain visible, but they should read as
+ * sections within the card rather than as peer post titles.
+ */
+[data-post]:not([data-page="post"]) [data-post-body].prose {
+  :where(h1, h2) {
+    font-size: calc(var(--type-content-body) * 1.12);
+    font-weight: var(--fw-medium);
+    margin-top: 1.45rem;
+    margin-bottom: 0.55rem;
+  }
+
+  :where(h3, h4) {
+    font-size: var(--type-content-body);
+    font-weight: var(--fw-medium);
+    margin-top: 1.2rem;
+    margin-bottom: 0.45rem;
+  }
+
+  :where(h5, h6) {
+    font-size: var(--type-secondary);
+    font-weight: var(--fw-medium);
+    color: var(--site-text-secondary);
+    margin-top: 1rem;
+    margin-bottom: 0.35rem;
+  }
+}
+
 /*
  * Detail-page reading prose
  *
@@ -455,12 +501,8 @@ html {
   );
   --tw-prose-captions: var(--site-reading-caption);
   --tw-prose-kbd: var(--site-reading-heading);
-  --tw-prose-code: var(--site-reading-heading);
-  --tw-prose-pre-code: color-mix(
-    in srgb,
-    var(--site-reading-caption) 86%,
-    var(--site-reading-body)
-  );
+  --tw-prose-code: var(--site-code-text);
+  --tw-prose-pre-code: var(--site-code-text);
   --tw-prose-th-borders: color-mix(
     in srgb,
     var(--site-divider) 88%,

package/src/routes/api/__tests__/uploads.test.ts

@@ -1,4 +1,4 @@
-import { describe, expect, it } from "vitest";
+import { afterEach, describe, expect, it, vi } from "vitest";
 import { createTestApp } from "../../../__tests__/helpers/app.js";
 import type {
   PresignedPutOptions,
@@ -136,6 +136,68 @@ function createMockStorage(options?: {
   };
 }
 
+describe("POST /api/uploads/sideload", () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  function pngBytes(): Uint8Array {
+    return new Uint8Array([
+      0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a, 0x00, 0x00, 0x00, 0x0d,
+      0x49, 0x48, 0x44, 0x52, 0x00, 0x00, 0x00, 0x04, 0x00, 0x00, 0x00, 0x06,
+      0x08, 0x06, 0x00, 0x00, 0x00,
+    ]);
+  }
+
+  it("rehosts a remote image and returns its stored URL", async () => {
+    vi.stubGlobal(
+      "fetch",
+      vi.fn(
+        async () =>
+          new Response(pngBytes(), {
+            headers: { "content-type": "image/png" },
+          }),
+      ),
+    );
+    const storage = createMockStorage();
+    const { app, services } = createTestApp({ authenticated: true, storage });
+    app.route("/api/uploads", uploadsApiRoutes);
+
+    const res = await app.request("/api/uploads/sideload", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ url: "https://example.com/photo.png" }),
+    });
+
+    expect(res.status).toBe(200);
+    const data = (await res.json()) as {
+      id: string;
+      url: string;
+      mimeType: string;
+      width: number;
+      height: number;
+    };
+    expect(data.mimeType).toBe("image/png");
+    expect(data.width).toBe(4);
+    expect(data.height).toBe(6);
+    const media = await services.media.getById(data.id);
+    expect(media?.mimeType).toBe("image/png");
+  });
+
+  it("requires authentication", async () => {
+    const { app } = createTestApp({ authenticated: false });
+    app.route("/api/uploads", uploadsApiRoutes);
+
+    const res = await app.request("/api/uploads/sideload", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ url: "https://example.com/photo.png" }),
+    });
+
+    expect(res.status).toBe(401);
+  });
+});
+
 describe("Upload Session API Routes", () => {
   it("completes a relay image upload and stores inline media metadata", async () => {
     const storage = createMockStorage();

package/src/routes/api/uploads.ts

@@ -35,10 +35,62 @@ const CompleteUploadSchema = z.object({
     .optional(),
 });
 
+const SideloadSchema = z.object({
+  url: z.string().url(),
+  alt: z.string().max(2000).optional(),
+});
+
 export const uploadsApiRoutes = new Hono<Env>();
 
 uploadsApiRoutes.use("*", requireAuthApi());
 
+/**
+ * Rehost a remote image into the site's own storage. Used when an author pastes
+ * an article whose `<img>` tags point at external URLs — the server fetches the
+ * bytes (bypassing browser CORS) and stores them. Returns the new media's
+ * public URL so the editor can swap the node's `src`.
+ */
+uploadsApiRoutes.post("/sideload", async (c) => {
+  const storage = c.var.storage;
+  if (!storage) {
+    return c.json(
+      { error: "File storage isn't set up. Check your server config." },
+      500,
+    );
+  }
+
+  const { url, alt } = parseValidated(SideloadSchema, await c.req.json());
+
+  const media = await c.var.services.media.ingestFromUrl(
+    { url, alt },
+    {
+      storage,
+      storageDriver: c.var.appConfig.storageDriver,
+      maxFileSizeMB: c.var.appConfig.uploadMaxFileSize,
+    },
+  );
+
+  const mediaPublicUrl = getPublicUrlForProvider(
+    c.var.appConfig.storageDriver,
+    c.var.appConfig.r2PublicUrl,
+    c.var.appConfig.s3PublicUrl,
+    c.var.appConfig.localPublicUrl,
+  );
+
+  return c.json({
+    id: media.id,
+    url: getMediaUrl(
+      media.storageKey,
+      mediaPublicUrl,
+      c.var.appConfig.sitePathPrefix,
+    ),
+    width: media.width,
+    height: media.height,
+    mimeType: media.mimeType,
+    size: media.size,
+  });
+});
+
 function scheduleExpiredUploadCleanup(
   c: {
     executionCtx?: { waitUntil: (promise: Promise<unknown>) => void };

package/src/routes/dash/settings.tsx

@@ -75,6 +75,7 @@ import {
   isSyncPending,
   markSyncPending,
   runBackgroundSync,
+  triggerGitHubSyncInline,
 } from "../../lib/github-sync-trigger.js";
 import { buildSyncSiteConfig } from "../../lib/github-sync-site-config.js";
 import {
@@ -117,6 +118,10 @@ function publicPath(c: Context<Env>, path: string): string {
   return toPublicPath(path, c.var.appConfig.sitePathPrefix);
 }
 
+function aboutEditPath(c: Context<Env>): string {
+  return `${publicPath(c, "/about")}?edit=1`;
+}
+
 /**
  * Breadcrumb labels for admin settings pages.
  *
@@ -302,7 +307,10 @@ settingsRoutes.get("/general", async (c) => {
   const dbSiteDescription = allSettings["SITE_DESCRIPTION"] ?? "";
 
   const saved = c.req.query("saved") !== undefined;
-  const navData = await getNavigationData(c);
+  const [navData, aboutPage] = await Promise.all([
+    getNavigationData(c),
+    c.var.services.aboutPage.getStatus(),
+  ]);
   const siteUrlForDisplay =
     appConfig.siteUrl || new URL(publicPath(c, "/"), c.req.url).toString();
 
@@ -356,6 +364,9 @@ settingsRoutes.get("/general", async (c) => {
           noindex={appConfig.noindex}
           demoMode={appConfig.demoMode}
           timezones={TIMEZONES}
+          aboutPage={aboutPage}
+          aboutEditUrl={aboutEditPath(c)}
+          aboutCreateUrl={publicPath(c, "/settings/general/about-page")}
         />
       </>
     ),
@@ -534,6 +545,32 @@ settingsRoutes.post("/general/search", async (c) => {
   );
 });
 
+settingsRoutes.post("/general/about-page", async (c) => {
+  try {
+    await c.var.services.aboutPage.ensurePage();
+    await triggerGitHubSyncInline(c);
+  } catch (error) {
+    if (error instanceof ValidationError) {
+      const wantsJson = c.req.header("accept")?.includes("application/json");
+      if (wantsJson) {
+        return c.json({ error: error.message, code: error.code }, 400);
+      }
+      return c.text(error.message, 400);
+    }
+    throw error;
+  }
+
+  const wantsJson = c.req.header("accept")?.includes("application/json");
+  if (wantsJson) {
+    return c.json({
+      status: "redirect" as const,
+      url: aboutEditPath(c),
+    });
+  }
+
+  return c.redirect(aboutEditPath(c));
+});
+
 // ===========================================================================
 // Avatar
 // ===========================================================================
@@ -743,9 +780,10 @@ settingsRoutes.post("/avatar/display", async (c) => {
 // ===========================================================================
 
 settingsRoutes.get("/navigation", async (c) => {
-  const [navItems, directoryData] = await Promise.all([
+  const [navItems, directoryData, suggestedLinks] = await Promise.all([
     c.var.services.navItems.list(),
     c.var.services.collections.listDirectoryData(),
+    c.var.services.navItems.listSuggestedLinks(),
   ]);
   const navData = await getNavigationData(c);
 
@@ -762,6 +800,7 @@ settingsRoutes.get("/navigation", async (c) => {
         <NavigationContent
           navItems={navItems}
           directoryData={directoryData}
+          suggestedLinks={suggestedLinks}
           mainRssFeed={c.var.appConfig.mainRssFeed}
           siteName={navData.siteName}
           sitePathPrefix={c.var.appConfig.sitePathPrefix}

package/src/routes/pages/__tests__/draft-about-edit.test.ts

@@ -0,0 +1,65 @@
+import { describe, expect, it } from "vitest";
+import { createTestApp } from "../../../__tests__/helpers/app.js";
+import { pageRoutes } from "../page.js";
+
+function createPageTestApp(options: { authenticated?: boolean } = {}) {
+  const testApp = createTestApp(options);
+  const { app } = testApp;
+
+  app.use("*", async (c, next) => {
+    c.set("publicPath", c.req.path);
+    c.set("publicRequestUrl", c.req.url);
+    await next();
+  });
+
+  app.route("/", pageRoutes);
+
+  return testApp;
+}
+
+async function createDraftAbout(
+  services: ReturnType<typeof createTestApp>["services"],
+) {
+  return services.posts.create({
+    format: "note",
+    title: "About",
+    slug: "about",
+    bodyMarkdown: "Draft About body",
+    status: "draft",
+    visibility: "latest_hidden",
+  });
+}
+
+describe("draft About edit route", () => {
+  it("keeps draft About hidden from anonymous edit requests", async () => {
+    const { app, services } = createPageTestApp();
+    await createDraftAbout(services);
+
+    const res = await app.request("/about?edit=1");
+
+    expect(res.status).toBe(404);
+  });
+
+  it("keeps draft About hidden from normal authenticated page requests", async () => {
+    const { app, services } = createPageTestApp({ authenticated: true });
+    await createDraftAbout(services);
+
+    const res = await app.request("/about");
+
+    expect(res.status).toBe(404);
+  });
+
+  it("renders draft About for authenticated edit requests", async () => {
+    const { app, services } = createPageTestApp({ authenticated: true });
+    const post = await createDraftAbout(services);
+
+    const res = await app.request("/about?edit=1");
+
+    expect(res.status).toBe(200);
+    const html = await res.text();
+    expect(html).toContain(`data-post-id="${post.id}"`);
+    expect(html).toContain("data-authenticated");
+    expect(html).not.toContain('rel="canonical"');
+    expect(html).not.toContain("application/ld+json");
+  });
+});