v3: reworked posting — three panels, drafts, duplicate detection, upload progress

Posting a dump was a single form where the important choices were the easiest
to miss. It is now three panels: link or file, why & where, playlists.

Composition:
- No more URL/File toggle. An empty panel offers both ways in at once and the
  kind follows what you actually did; a file dropped anywhere in the modal is
  accepted, not just on the zone.
- Categories and visibility get their own panel instead of a disclosure that
  read as optional, and the primary button stays "Next" until they've been
  seen. Visibility carries a real label now.
- The draft (link, title, why, categories, visibility) is mirrored to
  localStorage on every change and restored on reopen, so Escape or a stray
  backdrop click costs nothing. Only an attached file can't be restored, so
  that is the one case that asks before closing.
- URL dumps can carry a poster-supplied title instead of being stuck with
  whatever the page scraped, editable right under the preview.
- Multipart uploads go through XHR so there is a real progress bar and a
  percentage on the button, rather than 50 MB of silence.

Duplicates:
- New dumps.url_canonical column (+ index, backfilled by 0013) holding a lossy
  key that ignores scheme, www., trailing slashes, tracking parameters and
  YouTube share shapes. GET /api/dumps/by-url reads it, and the create form
  warns "already dumped by X" while it fetches the preview. Never blocking.

Fixes:
- /api/preview now reports whether the page was actually reached: a failed
  fetch still yields a hostname-only stub, so a dead link and a page without
  metadata used to render identically.
- The Web Share Target never worked. The manifest posts to "/", but the index
  redirect dropped the query string, so every Android share landed on the feed
  with nothing pre-filled.
- File dumps no longer take the extension into their title.
- The link field no longer autofocuses on touch, where it raised a keyboard
  over the modal.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01TiAPtJZeCYYk8rKehtLUQU

api/db/migrate.ts

@@ -11,6 +11,7 @@ import { up as up0009ChatReply } from "./migrations/0009_chat_reply.ts";
 import { up as up0010YoutubeEmbedStart } from "./migrations/0010_youtube_embed_start.ts";
 import { up as up0011SplitFaviconThumbnail } from "./migrations/0011_split_favicon_thumbnail.ts";
 import { up as up0012FixFaviconReclassification } from "./migrations/0012_fix_favicon_reclassification.ts";
+import { up as up0013DumpUrlCanonical } from "./migrations/0013_dump_url_canonical.ts";
 
 interface Migration {
   name: string;
@@ -36,6 +37,7 @@ const MIGRATIONS: Migration[] = [
     name: "0012_fix_favicon_reclassification",
     up: up0012FixFaviconReclassification,
   },
+  { name: "0013_dump_url_canonical", up: up0013DumpUrlCanonical },
 ];
 
 export function runMigrations(db: DatabaseSync): void {

api/db/migrations/0013_dump_url_canonical.ts

@@ -0,0 +1,119 @@
+import type { DatabaseSync } from "node:sqlite";
+
+// Adds `dumps.url_canonical` — the lookup key behind the "already dumped?"
+// check on the create form — and backfills it for every existing URL dump.
+//
+// Purely local: it re-derives the key from the URL already stored on each row
+// and makes no network calls.
+//
+// The helpers below are a deliberate frozen copy of `api/lib/canonical-url.ts`
+// as it stood when this migration shipped, not an import of it. A migration
+// runs exactly once per database, so importing the live version would mean two
+// databases migrating at different times end up with keys computed under
+// different rules. Improving the shared canonicalizer therefore calls for a new
+// backfill migration rather than an edit here.
+//
+// Idempotent: the column is only added when missing and only rows whose key is
+// still NULL are touched, so a fresh database built from schema.sql is a no-op.
+
+const TRACKING_PARAMS = new Set([
+  "fbclid",
+  "gclid",
+  "dclid",
+  "msclkid",
+  "twclid",
+  "yclid",
+  "mc_cid",
+  "mc_eid",
+  "igshid",
+  "igsh",
+  "si",
+  "spm",
+  "ref_src",
+  "ref_url",
+  "_ga",
+  "_gl",
+  "__twitter_impression",
+]);
+
+function isTrackingParam(key: string): boolean {
+  const k = key.toLowerCase();
+  return k.startsWith("utm_") || TRACKING_PARAMS.has(k);
+}
+
+const YOUTUBE_HOSTS = new Set([
+  "youtube.com",
+  "m.youtube.com",
+  "music.youtube.com",
+  "youtube-nocookie.com",
+]);
+
+function youtubeVideoId(
+  host: string,
+  pathname: string,
+  params: URLSearchParams,
+): string | null {
+  if (host === "youtu.be") return pathname.split("/")[1] || null;
+  if (!YOUTUBE_HOSTS.has(host)) return null;
+  if (pathname === "/watch") return params.get("v");
+  if (/^\/(embed|shorts|live)\//.test(pathname)) {
+    return pathname.split("/")[2] || null;
+  }
+  return null;
+}
+
+function canonicalizeUrl(raw: string): string | null {
+  let u: URL;
+  try {
+    u = new URL(raw);
+  } catch {
+    return null;
+  }
+  if (u.protocol !== "http:" && u.protocol !== "https:") return null;
+
+  const host = u.hostname.toLowerCase().replace(/^www\./, "");
+  if (!host) return null;
+
+  const videoId = youtubeVideoId(host, u.pathname, u.searchParams);
+  if (videoId) return `https://youtube.com/watch?v=${videoId}`;
+
+  const listId = YOUTUBE_HOSTS.has(host) && u.pathname === "/playlist"
+    ? u.searchParams.get("list")
+    : null;
+  if (listId) return `https://youtube.com/playlist?list=${listId}`;
+
+  const path = u.pathname.replace(/\/+$/, "");
+
+  const params = [...u.searchParams.entries()]
+    .filter(([key]) => !isTrackingParam(key))
+    .sort(([a, av], [b, bv]) => a.localeCompare(b) || av.localeCompare(bv));
+  const query = new URLSearchParams(params).toString();
+
+  const hash = /^#!?\//.test(u.hash) ? u.hash : "";
+
+  return `https://${host}${path}${query ? `?${query}` : ""}${hash}`;
+}
+
+export function up(db: DatabaseSync): void {
+  const columns = db.prepare(`PRAGMA table_info(dumps);`).all() as {
+    name: string;
+  }[];
+  if (!columns.some((c) => c.name === "url_canonical")) {
+    db.exec(`ALTER TABLE dumps ADD COLUMN url_canonical TEXT;`);
+  }
+  db.exec(
+    `CREATE INDEX IF NOT EXISTS idx_dumps_url_canonical ON dumps(url_canonical);`,
+  );
+
+  const rows = db.prepare(
+    `SELECT id, url FROM dumps WHERE url IS NOT NULL AND url_canonical IS NULL;`,
+  ).all() as { id: string; url: string }[];
+
+  const update = db.prepare(
+    `UPDATE dumps SET url_canonical = ? WHERE id = ?;`,
+  );
+  for (const row of rows) {
+    const canonical = canonicalizeUrl(row.url);
+    if (canonical) update.run(canonical, row.id);
+  }
+}

api/db/schema.sql

@@ -7,6 +7,8 @@ CREATE TABLE dumps (
   created_at  TEXT    NOT NULL,
   updated_at  TEXT,
   url         TEXT,
+  -- Lossy lookup key for "has this been dumped already?" — see api/lib/canonical-url.ts
+  url_canonical TEXT,
   slug        TEXT,
   rich_content TEXT,
   file_name   TEXT,
@@ -117,6 +119,7 @@ CREATE TABLE dump_backlinks (
 
 CREATE INDEX idx_dumps_user           ON dumps(user_id);
 CREATE INDEX idx_dumps_url            ON dumps(url);
+CREATE INDEX idx_dumps_url_canonical  ON dumps(url_canonical);
 CREATE INDEX idx_votes_user           ON votes(user_id);
 CREATE INDEX idx_playlists_user       ON playlists(user_id);
 CREATE INDEX idx_playlist_dumps_order ON playlist_dumps(playlist_id, position);