diff --git a/app/layout.tsx b/app/layout.tsx index a0c898f..7102951 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,6 +1,6 @@ -import { Analytics } from '@vercel/analytics/react' import type { Metadata } from 'next' import { Inter } from 'next/font/google' +import { PostHogProvider } from './providers' import './globals.css' const inter = Inter({ subsets: ['latin'] }) @@ -17,10 +17,11 @@ export default function RootLayout({ }>) { return ( - - {children} - - + + + {children} + + ) } diff --git a/app/page.tsx b/app/page.tsx index 4fb2c4e..5833dc3 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,8 +1,9 @@ 'use client' import { useEffect, useState } from 'react' -import { experimental_useObject as useObject } from 'ai/react'; +import { experimental_useObject as useObject } from 'ai/react' import { useLocalStorage } from 'usehooks-ts' +import { usePostHog } from 'posthog-js/react' import { ArtifactSchema, artifactSchema as schema } from '@/lib/schema' import { Chat } from '@/components/chat' @@ -36,6 +37,8 @@ export default function Home() { model: 'claude-3-5-sonnet-20240620' }) + const posthog = usePostHog() + const [result, setResult] = useState() const [messages, setMessages] = useState([]) @@ -112,6 +115,11 @@ export default function Home() { }) setChatInput('') + + posthog.capture('chat_submit', { + template: selectedTemplate, + model: languageModel.model, + }) } function addMessage (message: Message) { @@ -130,6 +138,11 @@ export default function Home() { setLanguageModel({ ...languageModel, ...e }) } + function handleGitHubClick () { + window.open('https://github.com/e2b-dev/ai-artifacts', '_blank') + posthog.capture('github_click') + } + return (
{ @@ -145,6 +158,7 @@ export default function Home() { models={modelsList.models} languageModel={languageModel} onLanguageModelChange={handleLanguageModelChange} + onGitHubClick={handleGitHubClick} apiKeyConfigurable={!process.env.NEXT_PUBLIC_USE_HOSTED_MODELS} baseURLConfigurable={!process.env.NEXT_PUBLIC_USE_HOSTED_MODELS} /> diff --git a/app/providers.tsx b/app/providers.tsx new file mode 100644 index 0000000..6dd8536 --- /dev/null +++ b/app/providers.tsx @@ -0,0 +1,21 @@ +// app/providers.js +'use client' +import posthog from 'posthog-js' +import { PostHogProvider as PostHogProviderJS } from 'posthog-js/react' + +if (typeof window !== 'undefined' && process.env.NEXT_PUBLIC_ENABLE_POSTHOG) { + posthog.init(process.env.NEXT_PUBLIC_POSTHOG_KEY ?? '', { + api_host: process.env.NEXT_PUBLIC_POSTHOG_HOST, + person_profiles: 'identified_only' + }) +} + +export function PostHogProvider({ children }: { children: React.ReactNode }) { + return process.env.NEXT_PUBLIC_ENABLE_POSTHOG ? ( + + {children} + + ) : ( + children + ) +} diff --git a/components/navbar.tsx b/components/navbar.tsx index b1556d6..d1f1cb9 100644 --- a/components/navbar.tsx +++ b/components/navbar.tsx @@ -38,6 +38,7 @@ export default function NavBar({ onLanguageModelChange, apiKeyConfigurable, baseURLConfigurable, + onGitHubClick, }: { session: Session | null, showLogin: () => void, @@ -50,6 +51,7 @@ export default function NavBar({ onLanguageModelChange: (config: LLMModelConfig) => void, apiKeyConfigurable: boolean, baseURLConfigurable: boolean, + onGitHubClick: () => void, }) { return (