diff --git a/apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/(chainPage)/layout.tsx b/apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/(chainPage)/layout.tsx index 8e6f00bb219..7ae74a68926 100644 --- a/apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/(chainPage)/layout.tsx +++ b/apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/(chainPage)/layout.tsx @@ -100,6 +100,7 @@ The following is the user's message: return ( <> import("./FloatingChatContent")); export function NebulaFloatingChatButton(props: { + pageType: "chain" | "contract"; authToken: string | undefined; examplePrompts: ExamplePrompt[]; label: string; @@ -37,6 +39,7 @@ export function NebulaFloatingChatButton(props: { const [hasBeenOpened, setHasBeenOpened] = useState(false); const closeModal = useCallback(() => setIsOpen(false), []); const [isDismissed, setIsDismissed] = useState(false); + const trackEvent = useTrack(); if (isDismissed) { return null; @@ -50,6 +53,12 @@ export function NebulaFloatingChatButton(props: { onClick={() => { setIsOpen(true); setHasBeenOpened(true); + trackEvent({ + category: "floating_nebula", + action: "click", + label: "open", + page: props.pageType, + }); }} variant="default" className="gap-2 rounded-full" @@ -60,7 +69,15 @@ export function NebulaFloatingChatButton(props: { @@ -75,6 +92,7 @@ export function NebulaFloatingChatButton(props: { client={props.client} nebulaParams={props.nebulaParams} examplePrompts={props.examplePrompts} + pageType={props.pageType} /> ); @@ -86,6 +104,7 @@ function NebulaChatUIContainer(props: { hasBeenOpened: boolean; authToken: string | undefined; examplePrompts: ExamplePrompt[]; + pageType: "chain" | "contract"; client: ThirdwebClient; nebulaParams: | { @@ -98,6 +117,7 @@ function NebulaChatUIContainer(props: { const ref = useOutsideClick(props.onClose); const shouldRenderChat = props.isOpen || props.hasBeenOpened; const [nebulaSessionKey, setNebulaSessionKey] = useState(0); + const trackEvent = useTrack(); return (
{ + trackEvent({ + category: "floating_nebula", + action: "click", + label: "nebula-landing", + page: props.pageType, + }); + }} >

Nebula

@@ -158,6 +186,7 @@ function NebulaChatUIContainer(props: { nebulaParams={props.nebulaParams} key={nebulaSessionKey} examplePrompts={props.examplePrompts} + pageType={props.pageType} /> )} diff --git a/apps/dashboard/src/app/nebula-app/(app)/components/FloatingChat/FloatingChatContent.tsx b/apps/dashboard/src/app/nebula-app/(app)/components/FloatingChat/FloatingChatContent.tsx index dfd45f5853c..f3395608582 100644 --- a/apps/dashboard/src/app/nebula-app/(app)/components/FloatingChat/FloatingChatContent.tsx +++ b/apps/dashboard/src/app/nebula-app/(app)/components/FloatingChat/FloatingChatContent.tsx @@ -4,6 +4,7 @@ import { usePathname } from "next/navigation"; import { useCallback, useState } from "react"; import type { ThirdwebClient } from "thirdweb"; import { Button } from "../../../../../@/components/ui/button"; +import { useTrack } from "../../../../../hooks/analytics/useTrack"; import type { NebulaContext } from "../../api/chat"; import { createSession } from "../../api/session"; import type { ExamplePrompt } from "../../data/examplePrompts"; @@ -20,6 +21,7 @@ export default function FloatingChatContent(props: { authToken: string | undefined; client: ThirdwebClient; examplePrompts: ExamplePrompt[]; + pageType: "chain" | "contract"; nebulaParams: | { messagePrefix: string; @@ -38,6 +40,7 @@ export default function FloatingChatContent(props: { client={props.client} nebulaParams={props.nebulaParams} examplePrompts={props.examplePrompts} + pageType={props.pageType} /> ); } @@ -45,6 +48,7 @@ export default function FloatingChatContent(props: { function FloatingChatContentLoggedIn(props: { authToken: string; client: ThirdwebClient; + pageType: "chain" | "contract"; examplePrompts: ExamplePrompt[]; nebulaParams: | { @@ -60,6 +64,7 @@ function FloatingChatContentLoggedIn(props: { const [chatAbortController, setChatAbortController] = useState< AbortController | undefined >(); + const trackEvent = useTrack(); const [isChatStreaming, setIsChatStreaming] = useState(false); const [enableAutoScroll, setEnableAutoScroll] = useState(false); @@ -90,6 +95,15 @@ function FloatingChatContentLoggedIn(props: { setIsChatStreaming(true); setEnableAutoScroll(true); + trackEvent({ + category: "floating_nebula", + action: "send", + label: "message", + message: userMessage, + page: props.pageType, + sessionId: sessionId, + }); + // if this is first message, set the message prefix const messageToSend = props.nebulaParams?.messagePrefix && !userHasSubmittedMessage @@ -145,6 +159,8 @@ function FloatingChatContentLoggedIn(props: { sessionId, props.nebulaParams?.messagePrefix, userHasSubmittedMessage, + trackEvent, + props.pageType, ], );