@m13v/seo-components 0.39.0 → 0.41.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m13v/seo-components",
-  "version": "0.39.0",
+  "version": "0.41.0",
   "scripts": {
     "build:css": "tailwind -i src/_build.css -o dist/styles.css --minify",
     "lint:mobile-spans": "node scripts/lint-mobile-spans.mjs",

package/src/components/FounderChatPanel.tsx

@@ -24,6 +24,11 @@
  *   greeting    initial system bubble copy
  *   replyEta    "usually within 2 hours" line under greeting
  *   accent      tailwind color name for the bubble (default: "teal")
+ *   userEmail   pre-fill from consumer auth (Firebase/Clerk/NextAuth) so
+ *               authed users don't get re-asked for their email. Falls back
+ *               to the built-in prompt for anonymous users (undefined / "").
+ *   userName    pre-fill display name; used as sender_name on outgoing
+ *               messages and forwarded to backend for personalized replies.
  */
 
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
@@ -56,6 +61,23 @@ export interface FounderChatPanelProps {
   replyEta?: string;
   /** Whether to require email before allowing the first message (default: true). */
   requireEmail?: boolean;
+  /**
+   * Optional: pre-fill the visitor's email from the consumer app's auth system,
+   * so already-authenticated users (Firebase, Clerk, NextAuth, etc.) don't get
+   * asked again. When set to a non-empty value, the email gate is skipped on
+   * mount and the value is also persisted to localStorage so subsequent
+   * anonymous sessions on the same device reuse it.
+   *
+   * Pass undefined / empty string for anonymous users, the panel will fall back
+   * to its built-in email prompt.
+   */
+  userEmail?: string;
+  /**
+   * Optional: pre-fill the visitor's display name. Used as the optimistic
+   * "sender_name" on outgoing messages and forwarded to the backend so founder
+   * replies can address the user by name.
+   */
+  userName?: string;
 }
 
 function capture(event: string, props?: Record<string, unknown>) {
@@ -116,6 +138,8 @@ export function FounderChatPanel({
   greeting,
   replyEta = "usually replies within a couple hours",
   requireEmail = true,
+  userEmail,
+  userName,
 }: FounderChatPanelProps) {
   const [open, setOpen] = useState(false);
   const [messages, setMessages] = useState<ApiMessage[]>([]);
@@ -141,6 +165,19 @@ export function FounderChatPanel({
     }
   }, [project]);
 
+  // Prefer the consumer-supplied authed email over the localStorage one, and
+  // re-sync whenever the prop changes (e.g. the user signs in via Google
+  // popup after the panel was already mounted on the page).
+  useEffect(() => {
+    if (!userEmail) return;
+    const trimmed = userEmail.trim();
+    if (!trimmed) return;
+    if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(trimmed)) return;
+    setEmail(trimmed);
+    setEmailSubmitted(true);
+    setStoredEmail(trimmed);
+  }, [userEmail]);
+
   // Auto-scroll to bottom on new messages.
   useEffect(() => {
     if (!scrollRef.current) return;
@@ -188,7 +225,7 @@ export function FounderChatPanel({
     const optimistic: ApiMessage = {
       id: -Date.now(),
       sender: "visitor",
-      sender_name: email || "you",
+      sender_name: userName || email || "you",
       text,
       createdAt: new Date().toISOString(),
     };
@@ -202,6 +239,10 @@ export function FounderChatPanel({
         threadId: threadId || undefined,
         text,
         email: email || undefined,
+        // Forwarded to the backend so the visitor row gets a real display
+        // name (web_chat_threads.visitor_name); the route handler reads this
+        // as `name` per /api/web-chat/send/route.ts.
+        name: userName || undefined,
         pageUrl: typeof window !== "undefined" ? window.location.href : undefined,
         referrer: typeof document !== "undefined" ? document.referrer || undefined : undefined,
       };
@@ -229,7 +270,7 @@ export function FounderChatPanel({
     } finally {
       setSending(false);
     }
-  }, [apiOrigin, draft, email, emailSubmitted, fetchThread, project, requireEmail, sending, threadId]);
+  }, [apiOrigin, draft, email, emailSubmitted, fetchThread, project, requireEmail, sending, threadId, userName]);
 
   const onSubmitEmail = useCallback(() => {
     const trimmed = email.trim();

package/src/lib/download-route.ts

@@ -145,7 +145,7 @@ export function createDownloadHandler(config: DownloadHandlerConfig) {
       } catch {
         host = undefined;
       }
-      void capturePostHogServer({
+      await capturePostHogServer({
         event: posthogEvent,
         distinctId: email,
         host,

package/src/lib/newsletter-route.ts

@@ -255,17 +255,17 @@ export function createNewsletterHandler(config: NewsletterConfig) {
     }
 
     // 4. Server-side PostHog capture (ground truth, not ad-blocked).
-    //    Fires once per successful signup. The dashboard's funnel_per_day.py
-    //    counts `newsletter_subscribed_server` for the "Email Signups" column.
-    //    Distinct from the client-side `newsletter_subscribed` event so we
-    //    don't double-count when both fire.
+    //    Awaited (not `void`) so the fetch completes before the response is
+    //    returned. On Cloud Run / serverless runtimes the container can be
+    //    frozen the moment the response is sent, killing fire-and-forget
+    //    fetches. Adds ~50-150ms latency, worth it for reliable funnel data.
     let host: string | undefined;
     try {
       host = req.headers.get("host") || new URL(siteUrl).hostname;
     } catch {
       host = undefined;
     }
-    void capturePostHogServer({
+    await capturePostHogServer({
       event: "newsletter_subscribed_server",
       distinctId: email,
       host,

package/src/lib/resend-inbound-route.ts

@@ -1,4 +1,5 @@
 import { NextRequest } from "next/server";
+import { capturePostHogServer } from "./posthog-capture";
 
 /* ------------------------------------------------------------------ */
 /*  Resend Inbound webhook handler                                     */
@@ -103,6 +104,26 @@ export interface ResendInboundConfig {
     resendId: string;
     timestamp: string;
   }) => Promise<void>;
+  /**
+   * Optional: fire server-side PostHog events for delivery lifecycle
+   * (`email_sent_server`, `email_delivered_server`, `email_opened_server`,
+   * `email_clicked_server`, `email_bounced_server`, `email_complained_server`,
+   * `email_delayed_server`). When set, the webhook receives ALL delivery
+   * events for the connected Resend workspace, so use `fromDomainFilter` to
+   * scope to this site only.
+   */
+  posthog?: {
+    /** Site slug attached to the PostHog event (e.g. "claude-meter"). */
+    site: string;
+    /**
+     * Only fire PostHog events when the email's `from` address ends in this
+     * domain (e.g. "claude-meter.com"). Critical because Resend webhooks are
+     * registered at workspace level: every delivery event for every domain
+     * in the account hits every webhook. Without this filter, claude-meter's
+     * PostHog gets polluted by fazm / mediar / vipassana delivery events.
+     */
+    fromDomainFilter: string;
+  };
   /**
    * Skip forwarding (only persist + return 200). Useful for tests, or for
    * sites where the DB log is the only consumer.
@@ -145,6 +166,7 @@ export function createResendInboundHandler(config: ResendInboundConfig) {
     apiKeyEnv = "RESEND_API_KEY",
     onInbound,
     onDeliveryEvent,
+    posthog,
     skipForward = false,
     ignoredSenders = DEFAULT_IGNORED_SENDERS,
     ignoredSubjects = DEFAULT_IGNORED_SUBJECTS,
@@ -220,18 +242,55 @@ export function createResendInboundHandler(config: ResendInboundConfig) {
     }
   }
 
-  async function handleDelivery(payload: ResendInboundPayload) {
+  async function handleDelivery(payload: ResendInboundPayload, host?: string) {
     const status = DELIVERY_STATUS_MAP[payload.type];
-    if (!status || !onDeliveryEvent) return;
-    try {
-      await onDeliveryEvent({
-        type: payload.type,
-        status,
-        resendId: payload.data.email_id,
-        timestamp: payload.created_at,
+    if (!status) return;
+
+    if (onDeliveryEvent) {
+      try {
+        await onDeliveryEvent({
+          type: payload.type,
+          status,
+          resendId: payload.data.email_id,
+          timestamp: payload.created_at,
+        });
+      } catch (err) {
+        console.error(`${tag} onDeliveryEvent error`, err);
+      }
+    }
+
+    // Optional PostHog fire — only when configured AND the email originated
+    // from our domain (Resend webhooks are workspace-level, so filtering is
+    // mandatory to avoid cross-site pollution).
+    if (posthog) {
+      const fromAddr = parseEmail(payload.data.from || "");
+      const matchesDomain = fromAddr.endsWith(`@${posthog.fromDomainFilter.toLowerCase()}`);
+      if (!matchesDomain) {
+        console.log(
+          `${tag} posthog skip, from domain mismatch:`,
+          fromAddr,
+          "expected:",
+          posthog.fromDomainFilter,
+        );
+        return;
+      }
+      const recipient = payload.data.to?.[0]?.toLowerCase() || payload.data.email_id;
+      await capturePostHogServer({
+        event: `email_${status}_server`,
+        distinctId: recipient,
+        host,
+        properties: {
+          email: recipient,
+          site: posthog.site,
+          resend_email_id: payload.data.email_id,
+          type: payload.type,
+          status,
+          subject: payload.data.subject || null,
+          from: fromAddr,
+          timestamp: payload.created_at,
+          component: "createResendInboundHandler",
+        },
       });
-    } catch (err) {
-      console.error(`${tag} onDeliveryEvent error`, err);
     }
   }
 
@@ -257,11 +316,18 @@ export function createResendInboundHandler(config: ResendInboundConfig) {
 
     console.log(`${tag}`, payload.type, payload.data?.email_id);
 
+    let host: string | undefined;
+    try {
+      host = req.headers.get("host") || undefined;
+    } catch {
+      host = undefined;
+    }
+
     try {
       if (payload.type === "email.received") {
         await handleInbound(payload, apiKey);
       } else if (DELIVERY_STATUS_MAP[payload.type]) {
-        await handleDelivery(payload);
+        await handleDelivery(payload, host);
       }
     } catch (err) {
       console.error(`${tag} handler error`, err);