Skip to content

Commit 72e5ea9

Browse files
features slide content
1 parent 666162f commit 72e5ea9

File tree

3 files changed

+317
-17
lines changed

3 files changed

+317
-17
lines changed

src/components/Products/Slides/FeaturesSlide.tsx

Lines changed: 38 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -172,7 +172,7 @@ export default function FeaturesSlide({ features, backgroundImage }: FeaturesSli
172172
<p className="text-lg">
173173
The{' '}
174174
<SmallTeam
175-
slug={item.team as string}
175+
slug={(item as any).team as string}
176176
className="relative top-1"
177177
/>{' '}
178178
is actively cooking and refining AI skills. Here's a
@@ -304,7 +304,7 @@ export default function FeaturesSlide({ features, backgroundImage }: FeaturesSli
304304
)
305305
}
306306

307-
// Default Grid Layout
307+
// Default Grid Layout - Simple centered layout
308308
return (
309309
<Tabs.Content
310310
className="flex-1 bg-primary @2xl:border-l border-primary grow px-5 py-2 outline-none focus-visible:shadow-[0_0_0_2px] focus-visible:shadow-black h-full relative [&_a]:underline [&_a]:font-semibold"
@@ -337,19 +337,44 @@ export default function FeaturesSlide({ features, backgroundImage }: FeaturesSli
337337
)}
338338
</div>
339339

340-
<div className="grid grid-cols-2 gap-4 px-4">
341-
{item.features &&
342-
item.features.map((feature: Feature, featureIndex: number) => (
343-
<div key={featureIndex}>
344-
<h3 className="text-2xl mb-1">{feature.title}</h3>
345-
<p className="text-lg">{feature.description}</p>
340+
{(item as any).layout === 'single-column' &&
341+
item.images &&
342+
item.images.length > 0 &&
343+
item.features &&
344+
item.features.length > 0 ? (
345+
<div className="flex flex-col @2xl:flex-row gap-8 px-4">
346+
<div className="flex-1">
347+
<div className="space-y-4 max-w-2xl mx-auto">
348+
{item.features.map((feature: Feature, featureIndex: number) => (
349+
<div key={featureIndex}>
350+
<h3 className="text-2xl mb-1">{feature.title}</h3>
351+
<p className="text-lg">{feature.description}</p>
352+
</div>
353+
))}
346354
</div>
347-
))}
348-
</div>
349-
{item.images && item.images.length > 0 && (
350-
<div className="max-w-3xl mx-auto">
351-
<ProductImage images={item.images} />
355+
</div>
356+
<div className="flex-1 flex items-center justify-center">
357+
<ProductImage images={item.images} />
358+
</div>
352359
</div>
360+
) : (
361+
<>
362+
{item.features && item.features.length > 0 && (
363+
<div className="space-y-4 px-4 max-w-2xl mx-auto">
364+
{item.features.map((feature: Feature, featureIndex: number) => (
365+
<div key={featureIndex}>
366+
<h3 className="text-2xl mb-1">{feature.title}</h3>
367+
<p className="text-lg">{feature.description}</p>
368+
</div>
369+
))}
370+
</div>
371+
)}
372+
{item.images && item.images.length > 0 && (
373+
<div className="max-w-3xl mx-auto mt-8">
374+
<ProductImage images={item.images} />
375+
</div>
376+
)}
377+
</>
353378
)}
354379
{(item as any).children && <div className="p-4">{(item as any).children}</div>}
355380
</div>

src/hooks/productData/llm_analytics.tsx

Lines changed: 212 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import {
33
IconBell,
44
IconClockRewind,
55
IconDashboard,
6+
IconGear,
67
IconGraph,
78
IconHandMoney,
89
IconLightBulb,
@@ -18,6 +19,10 @@ import {
1819
IconWarning,
1920
IconGlobe,
2021
IconListCheck,
22+
IconMagicWand,
23+
IconLlmPromptManagement,
24+
IconLlmPromptEvaluation,
25+
IconDatabase,
2126
} from '@posthog/icons'
2227
import {
2328
IconAnthropic,
@@ -108,10 +113,41 @@ export const llmAnalytics = {
108113
},
109114
features: [
110115
{
111-
title: 'Trace monitoring',
116+
label: 'Features',
117+
},
118+
{
119+
title: 'Dashboard',
120+
icon: <IconDashboard />,
121+
color: 'purple',
122+
headline: 'Dashboard',
123+
description: 'Get a comprehensive overview of your LLM usage, costs, and performance',
124+
images: [
125+
{
126+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/evaluations_screenshot_959ba893da.png',
127+
alt: 'LLM Analytics dashboard',
128+
className: 'justify-center items-center',
129+
},
130+
],
131+
},
132+
{
133+
title: 'Traces',
134+
icon: <IconListTreeConnected />,
135+
color: 'seagreen',
136+
headline: 'Traces',
137+
description: 'Debug entire conversations, not just individual calls',
138+
images: [
139+
{
140+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/trace_screenshot_1e0bdd0ad3.png',
141+
alt: 'LLM Analytics traces',
142+
className: 'justify-center items-center',
143+
},
144+
],
145+
},
146+
{
147+
title: 'Traces',
112148
handle: 'trace_monitoring',
113149
template: 'splitImage',
114-
headline: 'Trace monitoring',
150+
headline: 'Traces',
115151
description: 'Debug entire conversations, not just individual calls',
116152
images: [
117153
{
@@ -229,6 +265,180 @@ export const llmAnalytics = {
229265
},
230266
],
231267
},
268+
{
269+
title: 'Generations',
270+
icon: <IconSparkles />,
271+
color: 'yellow',
272+
headline: 'Generations',
273+
description: 'Track and analyze individual LLM generations with full context and metadata',
274+
images: [
275+
{
276+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/evaluations_screenshot_959ba893da.png',
277+
alt: 'LLM Analytics generations',
278+
className: 'justify-center items-center',
279+
},
280+
],
281+
},
282+
{
283+
title: 'Users',
284+
icon: <IconUser />,
285+
color: 'red',
286+
headline: 'Users',
287+
description: 'See which users are interacting with your AI features and understand their usage patterns',
288+
images: [
289+
{
290+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/users_screenshot_716215eebb.png',
291+
alt: 'LLM Analytics users',
292+
className: 'justify-center items-center',
293+
},
294+
],
295+
},
296+
{
297+
title: 'Errors',
298+
icon: <IconWarning />,
299+
color: 'yellow',
300+
headline: 'Errors',
301+
description: 'Monitor and debug errors in your LLM calls with detailed error tracking',
302+
images: [
303+
{
304+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/evaluations_screenshot_959ba893da.png',
305+
alt: 'LLM Analytics errors',
306+
className: 'justify-center items-center',
307+
},
308+
],
309+
},
310+
{
311+
title: 'Sessions',
312+
icon: <IconRewindPlay />,
313+
color: 'yellow',
314+
headline: 'Sessions',
315+
description: 'View session recordings alongside LLM traces to understand user interactions',
316+
images: [
317+
{
318+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/sessions_screenshot_d6fc106ce9.png',
319+
alt: 'LLM Analytics sessions',
320+
className: 'justify-center items-center',
321+
},
322+
],
323+
},
324+
{
325+
title: 'Playground',
326+
icon: <IconMagicWand />,
327+
color: 'purple',
328+
headline: 'Playground',
329+
description: 'Test and iterate on prompts in a safe environment before deploying to production',
330+
images: [
331+
{
332+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/evaluations_screenshot_959ba893da.png',
333+
alt: 'LLM Analytics playground',
334+
className: 'justify-center items-center',
335+
},
336+
],
337+
},
338+
{
339+
title: 'Evaluations',
340+
icon: <IconLlmPromptEvaluation />,
341+
color: 'blue',
342+
headline: 'Evaluations',
343+
description: 'Configure evaluation prompts and triggers to automatically assess your LLM generations.',
344+
images: [
345+
{
346+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/evaluations_screenshot_959ba893da.png',
347+
alt: 'LLM Analytics evaluations',
348+
className: 'justify-center items-center',
349+
},
350+
],
351+
},
352+
{
353+
title: 'Datasets',
354+
icon: <IconDatabase />,
355+
color: 'lilac',
356+
headline: 'Datasets',
357+
description: 'Manage and organize datasets for prompt evaluation and model training',
358+
images: [
359+
{
360+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/evaluations_screenshot_959ba893da.png',
361+
alt: 'LLM Analytics datasets',
362+
className: 'justify-center items-center',
363+
},
364+
],
365+
},
366+
{
367+
title: 'Prompts',
368+
icon: <IconLlmPromptManagement />,
369+
color: 'purple',
370+
headline: 'Prompts',
371+
description: 'Create, manage, and version control your prompts from a central location',
372+
images: [
373+
{
374+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/evaluations_screenshot_959ba893da.png',
375+
alt: 'LLM Analytics prompts',
376+
className: 'justify-center items-center',
377+
},
378+
],
379+
},
380+
{
381+
label: 'Advanced analytics',
382+
},
383+
{
384+
title: 'Analysis',
385+
icon: <IconTrends />,
386+
color: 'blue',
387+
headline: 'Go beyond basic metrics',
388+
description: "Use PostHog's full analytics suite to understand AI feature adoption and impact.",
389+
features: [
390+
{
391+
title: 'Correlation analysis',
392+
description: 'See how AI usage correlates with retention, revenue, and engagement',
393+
},
394+
{
395+
title: 'Funnel analysis',
396+
description: 'Track conversion through AI-powered features',
397+
},
398+
{
399+
title: 'Cohort analysis',
400+
description: 'Compare heavy vs light AI users behavior',
401+
},
402+
],
403+
layout: 'single-column',
404+
images: [
405+
{
406+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/evaluations_screenshot_959ba893da.png',
407+
alt: 'LLM Analytics analysis',
408+
className: 'justify-center items-center',
409+
},
410+
],
411+
},
412+
{
413+
title: 'Customizations',
414+
icon: <IconGear />,
415+
color: 'seagreen',
416+
headline: 'Customizations',
417+
description: 'Customize your LLM analytics setup with advanced configuration options',
418+
features: [
419+
{
420+
title: 'Custom dashboards',
421+
description: 'Build dashboards combining AI and product metrics',
422+
},
423+
{
424+
title: 'SQL access',
425+
description: 'Query raw LLM data with HogQL for custom analysis',
426+
},
427+
{
428+
title: 'Privacy mode',
429+
description:
430+
'To avoid storing potentially sensitive prompt and completion data, you can enable privacy mode to exclude certain properties from being captured.',
431+
},
432+
],
433+
layout: 'single-column',
434+
images: [
435+
{
436+
src: 'https://res.cloudinary.com/dmukukwp6/image/upload/evaluations_screenshot_959ba893da.png',
437+
alt: 'LLM Analytics customizations',
438+
className: 'justify-center items-center',
439+
},
440+
],
441+
},
232442
{
233443
title: 'Native integrations',
234444
handle: 'native_integrations',

0 commit comments

Comments
 (0)