chat sharing funnel

Author: brendan-kellam

packages/web/src/app/[domain]/chat/[id]/page.tsx

@@ -18,6 +18,7 @@ import { ChatVisibility } from '@sourcebot/db';
 import { Metadata } from 'next';
 import { SBChatMessage } from '@/features/chat/types';
 import { env, hasEntitlement } from '@sourcebot/shared';
+import { captureEvent } from '@/lib/posthog';
 
 interface PageProps {
     params: Promise<{
@@ -123,7 +124,17 @@ export default async function Page(props: PageProps) {
         throw new ServiceErrorException(chatInfo);
     }
 
-    const { messages, name, visibility, isOwner } = chatInfo;
+    const { messages, name, visibility, isOwner, isSharedWithUser } = chatInfo;
+
+    // Track when a non-owner views a shared chat
+    if (!isOwner) {
+        captureEvent('wa_shared_chat_viewed', {
+            chatId: params.id,
+            visibility,
+            viewerType: session ? 'authenticated' : 'anonymous',
+            accessType: isSharedWithUser ? 'direct_invite' : 'public_link',
+        });
+    }
 
     const sharedWithUsers = (session && isOwner) ? await getSharedWithUsersForChat({ chatId: params.id }) : [];
 

packages/web/src/app/[domain]/chat/components/shareChatPopover/index.tsx

@@ -15,6 +15,7 @@ import { isServiceError } from "@/lib/utils";
 import { Link2Icon, LockIcon } from "lucide-react";
 import { SessionUser } from "@/auth";
 import { InvitePanel } from "./ee/invitePanel";
+import { captureEvent } from "@/hooks/useCaptureEvent";
 
 interface ShareChatPopoverProps {
     chatId: string;
@@ -42,22 +43,28 @@ export const ShareChatPopover = ({
     const { toast } = useToast();
     const [view, setView] = useState<View>('main');
 
-    const onChatVisibilityChange = useCallback(async (visibility: ChatVisibility) => {
-        const response = await updateChatVisibility({ chatId, visibility });
+    const onChatVisibilityChange = useCallback(async (newVisibility: ChatVisibility) => {
+        const previousVisibility = visibility;
+        const response = await updateChatVisibility({ chatId, visibility: newVisibility });
         if (isServiceError(response)) {
             toast({
                 description: `Failed to update visibility: ${response.message}`,
                 variant: "destructive",
             });
             return false;
         } else {
-            setVisibility(visibility);
+            setVisibility(newVisibility);
+            captureEvent('wa_chat_visibility_changed', {
+                chatId,
+                fromVisibility: previousVisibility,
+                toVisibility: newVisibility,
+            });
             toast({
                 description: "✅ Chat visibility updated"
             });
             return true;
         }
-    }, [chatId, toast]);
+    }, [chatId, toast, visibility]);
 
     const onUnshareChatWithUser = useCallback(async (userId: string) => {
         const response = await unshareChatWithUser({ chatId, userId });
@@ -69,6 +76,7 @@ export const ShareChatPopover = ({
             return false;
         } else {
             setSharedWithUsers(sharedWithUsers.filter(user => user.id !== userId));
+            captureEvent('wa_chat_user_removed', { chatId });
             toast({
                 description: "✅ Access removed"
             });
@@ -91,6 +99,10 @@ export const ShareChatPopover = ({
             return false;
         } else {
             setSharedWithUsers([...sharedWithUsers, ...users]);
+            captureEvent('wa_chat_users_invited', {
+                chatId,
+                numUsersInvited: users.length,
+            });
             toast({
                 description: `✅ Invited ${users.length} user${users.length > 1 ? 's' : ''}`
             });
@@ -101,13 +113,19 @@ export const ShareChatPopover = ({
 
     const onOpenChange = useCallback((open: boolean) => {
         _setIsOpen(open);
+        if (open) {
+            captureEvent('wa_chat_share_dialog_opened', {
+                chatId,
+                currentVisibility: visibility,
+            });
+        }
         // Small delay to ensure the popover close animation completes
         setTimeout(() => {
             if (!open) {
                 setView('main');
             }
         }, 100);
-    }, []);
+    }, [chatId, visibility]);
 
 
     return (
@@ -129,6 +147,7 @@ export const ShareChatPopover = ({
             <PopoverContent align="end" className="w-[420px] p-0">
                 {view === 'main' ? (
                     <ShareSettings
+                        chatId={chatId}
                         visibility={visibility}
                         onVisibilityChange={onChatVisibilityChange}
                         onRemoveSharedWithUser={onUnshareChatWithUser}

packages/web/src/app/[domain]/chat/components/shareChatPopover/shareSettings.tsx

@@ -20,8 +20,10 @@ import { Info, Link2Icon, Loader2, Lock, X } from "lucide-react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { useCallback, useState } from "react";
+import { captureEvent } from "@/hooks/useCaptureEvent";
 
 interface ShareSettingsProps {
+    chatId: string;
     visibility: ChatVisibility;
     onVisibilityChange: (visibility: ChatVisibility) => Promise<boolean>;
     onRemoveSharedWithUser: (userId: string) => Promise<boolean>;
@@ -33,6 +35,7 @@ interface ShareSettingsProps {
 }
 
 export const ShareSettings = ({
+    chatId,
     visibility,
     onVisibilityChange,
     onRemoveSharedWithUser,
@@ -50,10 +53,14 @@ export const ShareSettings = ({
 
     const handleCopyLink = useCallback(() => {
         navigator.clipboard.writeText(window.location.href);
+        captureEvent('wa_chat_link_copied', {
+            chatId,
+            visibility,
+        });
         toast({
             description: "✅ Link copied to clipboard",
         });
-    }, [toast]);
+    }, [chatId, visibility, toast]);
 
     const getInitials = (name?: string | null, email?: string | null) => {
         if (name) {

packages/web/src/features/chat/actions.ts

@@ -141,6 +141,7 @@ export const getChatInfo = async ({ chatId }: { chatId: string }) => sew(() =>
             visibility: chat.visibility,
             name: chat.name,
             isOwner,
+            isSharedWithUser,
         };
     })
 );

packages/web/src/lib/posthogEvents.ts

@@ -158,6 +158,33 @@ export type PosthogEventMap = {
         toolName: string,
         success: boolean,
     },
+    // Chat Sharing Funnel
+    wa_chat_share_dialog_opened: {
+        chatId: string,
+        currentVisibility: 'PUBLIC' | 'PRIVATE',
+    },
+    wa_chat_visibility_changed: {
+        chatId: string,
+        fromVisibility: 'PUBLIC' | 'PRIVATE',
+        toVisibility: 'PUBLIC' | 'PRIVATE',
+    },
+    wa_chat_link_copied: {
+        chatId: string,
+        visibility: 'PUBLIC' | 'PRIVATE',
+    },
+    wa_chat_users_invited: {
+        chatId: string,
+        numUsersInvited: number,
+    },
+    wa_chat_user_removed: {
+        chatId: string,
+    },
+    wa_shared_chat_viewed: {
+        chatId: string,
+        visibility: 'PUBLIC' | 'PRIVATE',
+        viewerType: 'authenticated' | 'anonymous',
+        accessType: 'public_link' | 'direct_invite',
+    },
     //////////////////////////////////////////////////////////////////
     wa_demo_docs_link_pressed: {},
     wa_demo_search_example_card_pressed: {