create-feedbax 0.2.0 → 0.2.2

package/template/eslint.config.mjs

@@ -1,4 +1,5 @@
 import js from "@eslint/js";
+import { plugin as shadcn } from "@shadcn/lint";
 import globals from "globals";
 import tseslint from "typescript-eslint";
 
@@ -17,9 +18,31 @@ export default tseslint.config(
   js.configs.recommended,
   ...tseslint.configs.recommended,
   {
+    plugins: { shadcn },
     languageOptions: {
       globals: { ...globals.browser, ...globals.node },
       parserOptions: { tsconfigRootDir: import.meta.dirname },
     },
   },
+  {
+    files: ["**/*.{jsx,tsx}"],
+    rules: {
+      "shadcn/no-raw-colors": "error",
+      // Cloudflare's script discovers these challenge containers by class name.
+      "shadcn/no-unknown-classes": ["error", { allow: ["cf-turnstile"] }],
+      "shadcn/require-static-classes": "error",
+    },
+  },
+  {
+    // Shared primitives own their class forwarding; application usage is checked.
+    files: ["packages/ui/src/components/**", "src/components/ui/**"],
+    rules: { "shadcn/require-static-classes": "off" },
+  },
+  {
+    // The upstream Sonner wrapper keeps this marker for toast customization.
+    files: ["**/components/sonner.tsx"],
+    rules: {
+      "shadcn/no-unknown-classes": ["error", { allow: ["toaster"] }],
+    },
+  },
 );

package/template/feedbax-vite.ts

@@ -0,0 +1,79 @@
+import { build } from "esbuild";
+import { existsSync } from "node:fs";
+import { resolve } from "node:path";
+import type { Plugin, ResolvedConfig } from "vite";
+
+// Only the server receives provider identifiers and operational configuration.
+// The client gets a fixed allowlist, even when copied configuration is customized.
+export function publicFeedbaxConfiguration(): Plugin {
+  let configuration: ResolvedConfig;
+  return {
+    name: "feedbax-public-configuration",
+    enforce: "pre",
+    configResolved(value) {
+      configuration = value;
+    },
+    async transform(code, id) {
+      const root = configuration.root;
+      if (
+        this.environment.name !== "client" ||
+        id.split("?")[0] !== resolve(root, "src/feedbax.ts")
+      )
+        return;
+      const localConfig = resolve(root, "src/feedbax/config/index.ts");
+      const result = await build({
+        stdin: {
+          contents: code,
+          loader: "ts",
+          resolveDir: resolve(root, "src"),
+        },
+        bundle: true,
+        write: false,
+        platform: "node",
+        format: "esm",
+        alias: {
+          "@feedbax/config": existsSync(localConfig)
+            ? localConfig
+            : resolve(root, "../../packages/config/src/index.ts"),
+        },
+        define: { "import.meta.env": JSON.stringify(configuration.env) },
+      });
+      const full = (
+        await import(
+          `data:text/javascript;base64,${Buffer.from(result.outputFiles[0]!.text).toString("base64")}`
+        )
+      ).default;
+      const publicConfiguration = {
+        product: full.product,
+        theme: full.theme,
+        features: full.features,
+        submissions: full.submissions,
+        turnstile: full.turnstile,
+        history: full.history,
+        ...(full.connected
+          ? {
+              connected: {
+                issuer: full.connected.issuer,
+                loginUrl: full.connected.loginUrl,
+                images: full.connected.images,
+                ...(full.connected.email
+                  ? { email: { provider: full.connected.email.provider } }
+                  : {}),
+              },
+            }
+          : {}),
+      };
+      const publicCode = `export default ${JSON.stringify(publicConfiguration)};`;
+      return {
+        code: publicCode,
+        map: {
+          version: 3,
+          sources: ["feedbax-public-configuration.ts"],
+          sourcesContent: [publicCode],
+          names: [],
+          mappings: "",
+        },
+      };
+    },
+  };
+}

package/template/migrations/0001_connected.sql

@@ -0,0 +1,6 @@
+CREATE TABLE IF NOT EXISTS participants (subject TEXT PRIMARY KEY NOT NULL, display_name TEXT NOT NULL);
+CREATE TABLE IF NOT EXISTS identity_nonces (nonce TEXT PRIMARY KEY NOT NULL, expires_at INTEGER NOT NULL);
+CREATE TABLE IF NOT EXISTS participant_sessions (token_hash TEXT PRIMARY KEY NOT NULL, subject TEXT NOT NULL REFERENCES participants(subject), expires_at INTEGER NOT NULL);
+CREATE TABLE IF NOT EXISTS participant_votes (post_slug TEXT NOT NULL, subject TEXT NOT NULL REFERENCES participants(subject), PRIMARY KEY(post_slug, subject));
+CREATE TABLE IF NOT EXISTS comment_attribution (comment_id TEXT PRIMARY KEY NOT NULL, subject TEXT NOT NULL REFERENCES participants(subject), display_name TEXT NOT NULL);
+CREATE INDEX IF NOT EXISTS participant_sessions_expiry ON participant_sessions(expires_at);

package/template/migrations/0002_participation.sql

@@ -0,0 +1,8 @@
+CREATE TABLE IF NOT EXISTS post_follows (post_slug TEXT NOT NULL, subject TEXT NOT NULL REFERENCES participants(subject), followed_at INTEGER NOT NULL, PRIMARY KEY(post_slug, subject));
+CREATE INDEX IF NOT EXISTS post_follows_subject ON post_follows(subject);
+CREATE TABLE IF NOT EXISTS participant_contacts (subject TEXT PRIMARY KEY REFERENCES participants(subject), email TEXT, email_enabled INTEGER NOT NULL DEFAULT 0);
+CREATE TABLE IF NOT EXISTS post_observations (post_slug TEXT PRIMARY KEY, status TEXT NOT NULL, checked_at INTEGER NOT NULL, lease_until INTEGER NOT NULL DEFAULT 0, comment_cursor TEXT, lease_token TEXT);
+CREATE TABLE IF NOT EXISTS post_events (id TEXT PRIMARY KEY, post_slug TEXT NOT NULL, kind TEXT NOT NULL, title TEXT NOT NULL, message TEXT NOT NULL, created_at INTEGER NOT NULL, actor_subject TEXT);
+CREATE TABLE IF NOT EXISTS participant_notifications (id TEXT PRIMARY KEY, event_id TEXT NOT NULL REFERENCES post_events(id), subject TEXT NOT NULL REFERENCES participants(subject), created_at INTEGER NOT NULL, read_at INTEGER, email_state TEXT NOT NULL DEFAULT 'pending', attempts INTEGER NOT NULL DEFAULT 0, next_attempt_at INTEGER NOT NULL DEFAULT 0, lease_until INTEGER NOT NULL DEFAULT 0, lease_token TEXT, UNIQUE(event_id, subject));
+CREATE INDEX IF NOT EXISTS notifications_subject ON participant_notifications(subject, created_at, id);
+CREATE INDEX IF NOT EXISTS notifications_delivery ON participant_notifications(email_state, next_attempt_at);

package/template/migrations/0003_images.sql

@@ -0,0 +1,3 @@
+CREATE TABLE IF NOT EXISTS image_attachments (id TEXT PRIMARY KEY, subject TEXT NOT NULL REFERENCES participants(subject), object_key TEXT NOT NULL UNIQUE, content_type TEXT NOT NULL, bytes INTEGER NOT NULL, created_at INTEGER NOT NULL, post_slug TEXT, comment_id TEXT, deleting INTEGER NOT NULL DEFAULT 0);
+CREATE INDEX IF NOT EXISTS image_attachments_post ON image_attachments(post_slug,comment_id);
+CREATE INDEX IF NOT EXISTS image_attachments_cleanup ON image_attachments(created_at) WHERE post_slug IS NULL;

package/template/migrations/0004_followed_status.sql

@@ -0,0 +1,9 @@
+ALTER TABLE post_follows ADD COLUMN observed_status TEXT;
+ALTER TABLE post_follows ADD COLUMN baseline_token TEXT;
+ALTER TABLE post_follows ADD COLUMN ready INTEGER NOT NULL DEFAULT 0;
+ALTER TABLE post_follows ADD COLUMN baseline_cursor TEXT;
+ALTER TABLE post_follows ADD COLUMN baseline_lease_until INTEGER NOT NULL DEFAULT 0;
+ALTER TABLE post_follows ADD COLUMN baseline_checked_at INTEGER NOT NULL DEFAULT 0;
+UPDATE post_follows SET observed_status=(SELECT status FROM post_observations WHERE post_observations.post_slug=post_follows.post_slug);
+ALTER TABLE post_events ADD COLUMN status TEXT;
+CREATE TABLE follow_comment_baselines (post_slug TEXT NOT NULL, subject TEXT NOT NULL, event_id TEXT NOT NULL, PRIMARY KEY(post_slug,subject,event_id), FOREIGN KEY(post_slug,subject) REFERENCES post_follows(post_slug,subject) ON DELETE CASCADE);

package/template/migrations/0005_github.sql

@@ -0,0 +1,4 @@
+CREATE TABLE IF NOT EXISTS github_posts (installation_id TEXT NOT NULL, repository_id INTEGER NOT NULL, post_id TEXT NOT NULL, slug TEXT NOT NULL, external_id TEXT, issue_number INTEGER, issue_id INTEGER, record TEXT NOT NULL, state TEXT NOT NULL CHECK(state IN ('reserved','creating','ready','uncertain','failed','withdrawn')), last_status TEXT NOT NULL DEFAULT 'New', vote_count INTEGER NOT NULL DEFAULT 0, projection_hash TEXT, public_updated_at INTEGER, PRIMARY KEY(installation_id,post_id), UNIQUE(installation_id,slug), UNIQUE(installation_id,external_id), UNIQUE(installation_id,repository_id,issue_id));
+CREATE INDEX IF NOT EXISTS github_posts_repository ON github_posts(installation_id,repository_id,state);
+CREATE TABLE IF NOT EXISTS github_comments (installation_id TEXT NOT NULL, repository_id INTEGER NOT NULL, comment_id TEXT NOT NULL, post_id TEXT NOT NULL, discussion_id TEXT NOT NULL, remote_id INTEGER, record TEXT NOT NULL, state TEXT NOT NULL CHECK(state IN ('creating','ready','uncertain','deleted')), PRIMARY KEY(installation_id,comment_id), UNIQUE(installation_id,repository_id,remote_id), FOREIGN KEY(installation_id,post_id) REFERENCES github_posts(installation_id,post_id));
+CREATE INDEX IF NOT EXISTS github_comments_post ON github_comments(installation_id,repository_id,post_id,state);

package/template/migrations/0006_integration.sql

@@ -0,0 +1,3 @@
+CREATE TABLE IF NOT EXISTS integration_credentials (installation_id TEXT PRIMARY KEY, portal_secret TEXT NOT NULL, delivery_secret TEXT NOT NULL, revoked INTEGER NOT NULL DEFAULT 0, paired_at INTEGER NOT NULL);
+CREATE TABLE IF NOT EXISTS portal_integration_nonces (installation_id TEXT NOT NULL, nonce TEXT NOT NULL, expires_at INTEGER NOT NULL, PRIMARY KEY(installation_id,nonce));
+CREATE TABLE IF NOT EXISTS integration_receipts (installation_id TEXT NOT NULL, event_id TEXT NOT NULL, kind TEXT NOT NULL, state TEXT NOT NULL DEFAULT 'pending', received_at INTEGER NOT NULL, cursor TEXT NOT NULL DEFAULT '', last_checked_at INTEGER, failure_code TEXT, PRIMARY KEY(installation_id,event_id));

package/template/migrations/0007_ownership.sql

@@ -0,0 +1,2 @@
+CREATE TABLE IF NOT EXISTS post_ownership (post_id TEXT PRIMARY KEY, post_slug TEXT NOT NULL, subject TEXT NOT NULL, title TEXT NOT NULL, type TEXT NOT NULL, created_at INTEGER NOT NULL, withdrawn INTEGER NOT NULL DEFAULT 0);
+CREATE INDEX IF NOT EXISTS owned_posts_subject ON post_ownership(subject,created_at,post_id);

package/template/migrations/0008_integration_recovery.sql

@@ -0,0 +1,5 @@
+ALTER TABLE integration_receipts ADD COLUMN attempts INTEGER NOT NULL DEFAULT 0;
+ALTER TABLE integration_receipts ADD COLUMN next_attempt INTEGER NOT NULL DEFAULT 0;
+ALTER TABLE integration_receipts ADD COLUMN lease_token TEXT;
+ALTER TABLE integration_receipts ADD COLUMN lease_until INTEGER NOT NULL DEFAULT 0;
+CREATE INDEX integration_receipts_due ON integration_receipts(installation_id,state,next_attempt,lease_until);

package/template/migrations/0009_observed_history.sql

@@ -0,0 +1,3 @@
+CREATE TABLE IF NOT EXISTS public_post_observations (post_slug TEXT PRIMARY KEY, revision INTEGER NOT NULL DEFAULT 0, projection TEXT, checked_at INTEGER NOT NULL DEFAULT 0, lease_until INTEGER NOT NULL DEFAULT 0, lease_token TEXT);
+CREATE TABLE IF NOT EXISTS public_post_history (id TEXT PRIMARY KEY, post_slug TEXT NOT NULL REFERENCES public_post_observations(post_slug), revision INTEGER NOT NULL, kind TEXT NOT NULL CHECK(kind IN ('status','update')), status TEXT, message TEXT, observed_at INTEGER NOT NULL, UNIQUE(post_slug,revision,kind));
+CREATE INDEX IF NOT EXISTS public_post_history_order ON public_post_history(post_slug,observed_at,revision,kind);

package/template/package.json

@@ -1,6 +1,6 @@
 {
   "name": "feedbax-installation",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "private": true,
   "type": "module",
   "scripts": {
@@ -16,52 +16,57 @@
   "dependencies": {
     "@tailwindcss/vite": "4.3.3",
     "@tanstack/react-form": "^1.33.5",
-    "@tanstack/react-query": "5.101.4",
-    "@tanstack/react-router": "1.170.31",
-    "@tanstack/react-start": "1.168.48",
-    "dotenv": "17.4.2",
-    "lucide-react": "1.33.0",
+    "@tanstack/react-query": "5.104.3",
+    "@tanstack/react-router": "1.170.44",
+    "@tanstack/react-start": "1.169.2",
+    "dotenv": "18.0.8",
+    "lucide-react": "1.57.0",
     "next-themes": "0.4.6",
-    "react": "19.2.8",
-    "react-dom": "19.2.8",
+    "react": "19.3.1",
+    "react-dom": "19.3.1",
     "sonner": "2.0.8",
     "tailwindcss": "4.3.3",
-    "zod": "4.4.3",
-    "@base-ui/react": "1.7.0",
+    "zod": "4.6.7",
+    "@base-ui/react": "1.9.0",
     "@fontsource-variable/geist": "5.3.0",
-    "@shadcn/react": "0.3.0",
+    "@shadcn/react": "0.3.1",
     "class-variance-authority": "0.7.1",
     "clsx": "2.1.1",
     "cmdk": "^1.1.1",
     "shadcn": "latest",
-    "tailwind-merge": "3.6.0",
-    "tw-animate-css": "1.4.0"
+    "tailwind-merge": "3.7.0",
+    "tw-animate-css": "1.4.0",
+    "drizzle-orm": "0.45.4"
   },
   "devDependencies": {
-    "@cloudflare/vite-plugin": "1.53.0",
-    "@tanstack/react-router-devtools": "1.167.1",
-    "@tanstack/router-cli": "1.167.32",
-    "@testing-library/dom": "10.4.1",
-    "@testing-library/react": "16.3.2",
-    "@testing-library/user-event": "14.6.1",
-    "@types/react": "19.2.18",
-    "@types/react-dom": "19.2.4",
-    "@vitejs/plugin-react": "6.1.0",
-    "jsdom": "29.1.1",
+    "@cloudflare/vite-plugin": "1.64.0",
+    "@cloudflare/workers-types": "^5.20261015.1",
+    "@tanstack/react-router-devtools": "1.167.2",
+    "@tanstack/router-cli": "1.167.44",
+    "@testing-library/dom": "10.4.2",
+    "@testing-library/react": "16.3.3",
+    "@testing-library/user-event": "14.6.8",
+    "@types/react": "19.3.0",
+    "@types/react-dom": "19.3.0",
+    "@vitejs/plugin-react": "6.1.2",
+    "jsdom": "30.1.2",
+    "miniflare": "4.20260730.0",
     "typescript": "6.0.3",
-    "vite": "8.2.2",
-    "web-vitals": "5.3.0",
-    "wrangler": "4.124.0",
+    "vite": "8.3.4",
+    "web-vitals": "6.2.3",
+    "wrangler": "4.151.0",
+    "esbuild": "0.28.2",
     "@tailwindcss/postcss": "4.3.3",
     "tailwindcss": "4.3.3",
-    "vitest": "4.1.11",
+    "vitest": "5.0.4",
     "@eslint/js": "10.0.1",
-    "@types/node": "22.20.1",
-    "feedbax": "0.2.0",
-    "eslint": "10.8.1",
-    "globals": "17.11.0",
-    "prettier": "3.9.6",
-    "typescript-eslint": "8.67.0"
+    "@shadcn/lint": "0.2.1",
+    "@types/node": "24.19.2",
+    "feedbax": "0.2.2",
+    "eslint": "10.12.0",
+    "globals": "17.13.0",
+    "prettier": "3.9.10",
+    "typescript-eslint": "8.71.2"
   },
   "pnpm": {
     "onlyBuiltDependencies": [
@@ -69,7 +74,7 @@
     ]
   },
   "engines": {
-    "node": ">=22.14.0"
+    "node": "^24.15.0 || >=26.0.0"
   },
   "packageManager": "pnpm@10.29.3",
   "license": "Apache-2.0"

package/template/src/authorized-draft-post.tsx

@@ -146,6 +146,7 @@ export function AuthorizedDraftPost({ slug }: { slug: string }) {
       ) : (
         <PublicPostDetail
           post={post}
+          published={false}
           display={overlaid ? "overlay" : "page"}
           features={{ voting: false, comments: false, changelog: true }}
           summaryMarker={<Badge variant="outline">Draft</Badge>}

package/template/src/changelog-page.tsx

@@ -3,9 +3,8 @@ import type {
   PublicChangelogEntry,
 } from "@feedbax/changelog";
 import { Badge } from "@feedbax/ui/components/badge";
-import { Button } from "@feedbax/ui/components/button";
+import { Button, buttonVariants } from "@feedbax/ui/components/button";
 import { ButtonGroup } from "@feedbax/ui/components/button-group";
-import { cn } from "@feedbax/ui/lib/utils";
 import { useRouterState } from "@tanstack/react-router";
 import { ChevronDown, Link2 } from "lucide-react";
 import { useEffect, useMemo, useState } from "react";
@@ -80,21 +79,24 @@ export function ChangelogPage({
   ]);
 
   return (
-    <main className="changelog-page">
-      <header className="changelog-heading">
+    <main className="mx-auto w-full max-w-[96rem] px-6 py-10 lg:px-10">
+      <header className="flex flex-wrap items-start justify-between gap-5">
         <div>
-          <h1>Changelog</h1>
-          <p>Product updates, fixes, and improvements.</p>
+          <h1 className="text-2xl font-semibold tracking-tight">Changelog</h1>
+          <p className="mt-2 text-sm text-muted-foreground">
+            Product updates, fixes, and improvements.
+          </p>
         </div>
+        <CommandPaletteTrigger className="h-10" />
       </header>
-      <div className="changelog-toolbar">
-        <ButtonGroup className="changelog-filters" aria-label="Filter updates">
+      {labels.length ? (
+        <ButtonGroup className="mt-6 flex-wrap" aria-label="Filter updates">
           {[undefined, ...labels].map((label) => (
             <Button
-              className="h-11 md:h-8"
               key={label ?? "all"}
               type="button"
-              variant="outline"
+              size="sm"
+              variant={selectedLabel === label ? "secondary" : "outline"}
               aria-pressed={selectedLabel === label}
               disabled={loading}
               onClick={() => void replaceForLabel(label)}
@@ -103,23 +105,30 @@ export function ChangelogPage({
             </Button>
           ))}
         </ButtonGroup>
-        <CommandPaletteTrigger className="h-11 md:h-10" />
-      </div>
-      <ol className="changelog-timeline" aria-label="Product updates">
+      ) : null}
+      <ol
+        className="changelog-timeline"
+        aria-label="Product updates"
+        aria-busy={loading}
+      >
         {page.items.map((entry) => (
           <TimelineEntry entry={entry} key={entry.slug} />
         ))}
       </ol>
+      {!page.items.length && !loading ? (
+        <p className="py-12 text-sm text-muted-foreground">
+          No updates published yet.
+        </p>
+      ) : null}
       {page.nextCursor ? (
-        <div className="changelog-load-more">
+        <div className="mx-auto mt-8 flex max-w-5xl justify-center">
           <Button
-            className="h-11 min-w-64 gap-2 text-sm md:h-10"
             type="button"
             variant="outline"
             disabled={loading}
             onClick={() => void loadMore()}
           >
-            Load more updates
+            {loading ? "Loading updates…" : "Load more updates"}
             <ChevronDown aria-hidden="true" />
           </Button>
         </div>
@@ -135,28 +144,46 @@ function TimelineEntry({ entry }: { entry: PublicChangelogEntry }) {
       <time dateTime={entry.date}>{formatDate(entry.date)}</time>
       <span className="changelog-timeline-marker" aria-hidden="true" />
       <article id={entry.slug} tabIndex={-1}>
-        <div className={cn("changelog-entry-layout", image && "has-image")}>
-          <div className="changelog-entry-copy">
-            <div className="changelog-labels" aria-label="Labels">
-              {entry.labels.map((label) => (
-                <Label key={label} label={label} />
-              ))}
-            </div>
-            <div className="changelog-entry-title">
-              <h2>{entry.title}</h2>
-              <a href={`#${entry.slug}`} aria-label={`Link to ${entry.title}`}>
-                <Link2 aria-hidden="true" />
-              </a>
-            </div>
-            <p className="changelog-entry-summary">{entry.summary}</p>
-            <div className="changelog-entry-body">
-              <p>{entry.body}</p>
-            </div>
+        {entry.labels.length ? (
+          <div className="mb-3 flex flex-wrap gap-2" aria-label="Labels">
+            {entry.labels.map((label) => (
+              <Badge key={label} variant="outline">
+                {label}
+              </Badge>
+            ))}
           </div>
-          {image ? (
-            <img src={image.src} alt={image.alt} width={760} height={420} />
-          ) : null}
+        ) : null}
+        <div className="flex items-start justify-between gap-3">
+          <h2 className="text-lg font-semibold tracking-tight">
+            {entry.title}
+          </h2>
+          <a
+            className={buttonVariants({ variant: "ghost", size: "icon-sm" })}
+            href={`#${entry.slug}`}
+            aria-label={`Link to ${entry.title}`}
+          >
+            <Link2 aria-hidden="true" />
+          </a>
+        </div>
+        <p className="mt-3 text-sm leading-relaxed">{entry.summary}</p>
+        <div className="changelog-entry-body">
+          {entry.body
+            .trim()
+            .split(/\n\s*\n/)
+            .filter(Boolean)
+            .map((paragraph, index) => (
+              <p key={index}>{paragraph}</p>
+            ))}
         </div>
+        {image ? (
+          <img
+            className="mt-6 w-full border"
+            src={image.src}
+            alt={image.alt}
+            width={760}
+            height={420}
+          />
+        ) : null}
       </article>
     </li>
   );
@@ -190,24 +217,6 @@ function useUnexpiredImage(image: PublicChangelogEntry["image"]) {
     : undefined;
 }
 
-function Label({ label }: { label: string }) {
-  const tone = label.toLowerCase();
-  return (
-    <Badge
-      className={cn(
-        "changelog-label",
-        tone === "new feature" && "is-new",
-        tone === "improved" && "is-improved",
-        tone === "fixed" && "is-fixed",
-      )}
-      variant="outline"
-    >
-      <span aria-hidden="true" />
-      {label}
-    </Badge>
-  );
-}
-
 function formatDate(date: string) {
   const [year, month, day] = date.split("-").map(Number);
   return new Intl.DateTimeFormat("en-US", {

package/template/src/changelog-runtime.ts

@@ -8,7 +8,8 @@ import { requiredEnvironmentValue } from "./feedback-runtime";
 
 let configuredChangelog: ReturnType<typeof createChangelogModule> | undefined;
 
-export function createConfiguredChangelogModule() {
+export function createConfiguredChangelogModule(fresh = false) {
+  if (fresh) return buildConfiguredChangelogModule();
   configuredChangelog ??= buildConfiguredChangelogModule();
   return configuredChangelog;
 }

package/template/src/cloudflare-workers.d.ts

@@ -6,6 +6,15 @@ declare module "cloudflare:workers" {
     }>;
   };
   export const env: {
+    GITHUB_SERVICE_SECRET?: string;
+    GITHUB_DELIVERY_SECRET?: string;
+    GITHUB_PAIRING_SECRET?: string;
+    FEEDBAX_UPDATES?: import("@cloudflare/workers-types").Queue<string>;
+    FEEDBAX_EMAIL?: import("@feedbax/feedback").CloudflareEmailBinding;
+    EMAIL_PROVIDER_SECRET?: string;
+    FEEDBAX_IMAGES?: import("@cloudflare/workers-types").R2Bucket;
+    FEEDBAX_DB?: import("@feedbax/feedback").ConnectedDatabase;
+    IDENTITY_HANDOFF_SECRET?: string;
     TRUSTED_SUBMISSIONS_RATE_LIMITER: {
       limit(options: { key: string }): Promise<{ success: boolean }>;
     };

package/template/src/comment-creation.test.tsx

@@ -41,7 +41,7 @@ describe("Comment creation", () => {
     });
     expect(composer.classList.contains("comment-composer")).toBe(true);
     expect(screen.getByLabelText("Add a comment").getAttribute("rows")).toBe(
-      "4",
+      "3",
     );
     expect(
       screen.getByPlaceholderText("Share context, an example, or a question…"),
@@ -111,12 +111,15 @@ describe("Comment creation", () => {
     });
     fireEvent.click(screen.getByRole("button", { name: "Post comment" }));
     expect(screen.getByText("Please add shortcuts.")).toBeTruthy();
-    expect(submitComment).toHaveBeenCalledWith({
-      slug: "roadmap-search",
-      body: "Please add shortcuts.",
-      displayName: "Ari",
-      email: "private@example.com",
-    });
+    await waitFor(() =>
+      expect(submitComment).toHaveBeenCalledWith({
+        slug: "roadmap-search",
+        body: "Please add shortcuts.",
+        displayName: "Ari",
+        email: "private@example.com",
+        submissionKey: expect.stringMatching(/^[A-Za-z0-9_-]{43}$/),
+      }),
+    );
 
     confirm({
       id: "notion-comment",
@@ -147,6 +150,48 @@ describe("Comment creation", () => {
     expect(await screen.findByLabelText("Add a comment")).toBeTruthy();
   });
 
+  it("does not duplicate a native Comment that arrives before its submission confirmation", async () => {
+    saveDeviceProfile(localStorage, {
+      name: "Ari",
+      email: "private@example.com",
+    });
+    const confirmed = {
+      id: "native-comment",
+      discussionId: "native-thread",
+      body: "One comment",
+      author: { kind: "participant" as const, displayName: "Ari" },
+      createdAt: new Date(),
+    };
+    let finish!: (value: typeof confirmed) => void;
+    const submitComment = vi.fn(
+      () =>
+        new Promise<typeof confirmed>((resolve) => {
+          finish = resolve;
+        }),
+    );
+    const view = renderCommentDetail({ submitComment });
+    fireEvent.change(await screen.findByLabelText("Add a comment"), {
+      target: { value: confirmed.body },
+    });
+    fireEvent.click(screen.getByRole("button", { name: "Post comment" }));
+    view.rerender(
+      <DeviceProfileProvider>
+        <PublicPostDetail
+          post={post}
+          submitComment={submitComment}
+          comments={{
+            items: [{ id: confirmed.discussionId, comments: [confirmed] }],
+          }}
+        />
+      </DeviceProfileProvider>,
+    );
+    await waitFor(() => expect(submitComment).toHaveBeenCalledTimes(1));
+    finish(confirmed);
+    await waitFor(() =>
+      expect(screen.getAllByText("One comment")).toHaveLength(1),
+    );
+  });
+
   it("rolls back a rejected Comment and shows an actionable error", async () => {
     saveDeviceProfile(localStorage, {
       name: "Ari",
@@ -164,6 +209,49 @@ describe("Comment creation", () => {
     await screen.findByRole("alert");
     expect(screen.queryByText("Temporary message")).toBeNull();
     expect(screen.getByRole("alert").textContent).toContain("Try again");
+    expect(
+      (screen.getByLabelText("Add a comment") as HTMLTextAreaElement).value,
+    ).toBe("Temporary message");
+  });
+
+  it("retries a lost Comment response with the same intent and preserves the composer", async () => {
+    saveDeviceProfile(localStorage, {
+      name: "Ari",
+      email: "private@example.com",
+    });
+    const requests: Record<string, unknown>[] = [];
+    vi.spyOn(globalThis, "fetch").mockImplementation(async (_url, init) => {
+      requests.push(JSON.parse(String(init?.body)));
+      if (requests.length === 1) throw new Error("Response lost. Try again.");
+      return Response.json({
+        comment: {
+          id: "recovered-comment",
+          discussionId: "recovered-thread",
+          body: "Keep this message",
+          author: { kind: "participant", displayName: "Ari" },
+          createdAt: "2026-08-25T01:00:00.000Z",
+        },
+      });
+    });
+    renderCommentDetail({ submitComment: submitPublicComment });
+    fireEvent.change(await screen.findByLabelText("Add a comment"), {
+      target: { value: "Keep this message" },
+    });
+    fireEvent.click(screen.getByRole("button", { name: "Post comment" }));
+    await screen.findByRole("alert");
+    expect(
+      (screen.getByLabelText("Add a comment") as HTMLTextAreaElement).value,
+    ).toBe("Keep this message");
+    fireEvent.click(screen.getByRole("button", { name: "Post comment" }));
+    await waitFor(() => expect(requests).toHaveLength(2));
+    await waitFor(() =>
+      expect(
+        (screen.getByLabelText("Add a comment") as HTMLTextAreaElement).value,
+      ).toBe(""),
+    );
+    expect(requests[0]?.submissionKey).toMatch(/^[A-Za-z0-9_-]{43}$/);
+    expect(requests[1]?.submissionKey).toBe(requests[0]?.submissionKey);
+    expect(screen.getAllByText("Keep this message")).toHaveLength(1);
   });
 
   it("renders a fresh Turnstile challenge after a stale Participation Pass is rejected", async () => {

package/template/src/comment-thread-page.ts

@@ -10,7 +10,17 @@ export function mergeCommentThreads(
     merged.set(
       thread.id,
       existing
-        ? { ...existing, comments: [...existing.comments, ...thread.comments] }
+        ? {
+            ...existing,
+            comments: [
+              ...new Map(
+                [...existing.comments, ...thread.comments].map((comment) => [
+                  comment.id,
+                  comment,
+                ]),
+              ).values(),
+            ],
+          }
         : thread,
     );
   }