asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: track code copy + AI assistant event (#14193)

Browse Source 
* docs: track code copy + AI assistant event

* add pathname to callback
This commit is contained in:
Shahed Nasser
2025-12-02 17:24:31 +02:00
committed by GitHub
parent ef162f8b5f
commit 00052b9e50
12 changed files with 75 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
www/apps/api-reference/components/Feedback/index.tsx
+6 -5
View File
@@ -1,23 +1,24 @@
"use client"
import { Feedback as UiFeedback, FeedbackProps } from "docs-ui"
import { usePathname } from "next/navigation"
import {
Feedback as UiFeedback,
FeedbackProps,
DocsTrackingEvents,
} from "docs-ui"
import { useArea } from "../../providers/area"
export const Feedback = (props: Partial<FeedbackProps>) => {
const pathname = usePathname()
const { area } = useArea()
return (
<UiFeedback
vertical={true}
{...props}
event="survey_api-ref"
event={DocsTrackingEvents.SURVEY_API}
extraData={{
area,
...props.extraData,
}}
pathName={`/api/${pathname}`}
/>
)
}
www/apps/book/components/Feedback/index.tsx
+2 -9
View File
@@ -1,24 +1,17 @@
"use client"
import {
DocsTrackingEvents,
Feedback as UiFeedback,
FeedbackProps as UiFeedbackProps,
} from "docs-ui"
import { usePathname } from "next/navigation"
import { basePathUrl } from "../../utils/base-path-url"
import { useMemo } from "react"
type FeedbackProps = Omit<UiFeedbackProps, "event" | "pathName">
const Feedback = (props: FeedbackProps) => {
const pathname = usePathname()
const feedbackPathname = useMemo(() => basePathUrl(pathname), [pathname])
return (
<UiFeedback
event="survey"
pathName={feedbackPathname}
event={DocsTrackingEvents.SURVEY}
question={props.question || "Was this chapter helpful?"}
{...props}
/>
www/apps/cloud/components/Feedback/index.tsx
+2 -9
View File
@@ -1,24 +1,17 @@
"use client"
import {
DocsTrackingEvents,
Feedback as UiFeedback,
FeedbackProps as UiFeedbackProps,
} from "docs-ui"
import { usePathname } from "next/navigation"
import { basePathUrl } from "../../utils/base-path-url"
import { useMemo } from "react"
type FeedbackProps = Omit<UiFeedbackProps, "event" | "pathName">
const Feedback = (props: FeedbackProps) => {
const pathname = usePathname()
const feedbackPathname = useMemo(() => basePathUrl(pathname), [pathname])
return (
<UiFeedback
event="survey"
pathName={feedbackPathname}
event={DocsTrackingEvents.SURVEY}
question="Was this guide helpful?"
{...props}
/>
www/apps/resources/components/Feedback/index.tsx
+2 -9
View File
@@ -1,24 +1,17 @@
"use client"
import {
DocsTrackingEvents,
Feedback as UiFeedback,
FeedbackProps as UiFeedbackProps,
} from "docs-ui"
import { usePathname } from "next/navigation"
import { useMemo } from "react"
import { basePathUrl } from "../../utils/base-path-url"
type FeedbackProps = Omit<UiFeedbackProps, "event" | "pathName">
export const Feedback = (props: FeedbackProps) => {
const pathname = usePathname()
const feedbackPathname = useMemo(() => basePathUrl(pathname), [pathname])
return (
<UiFeedback
event="survey"
pathName={feedbackPathname}
event={DocsTrackingEvents.SURVEY}
question="Was this page helpful?"
{...props}
/>
www/apps/ui/components/Feedback/index.tsx
+2 -9
View File
@@ -1,24 +1,17 @@
"use client"
import {
DocsTrackingEvents,
Feedback as UiFeedback,
FeedbackProps as UiFeedbackProps,
} from "docs-ui"
import { usePathname } from "next/navigation"
import { basePathUrl } from "../../utils/base-path-url"
import { useMemo } from "react"
type FeedbackProps = Omit<UiFeedbackProps, "event" | "pathName">
const Feedback = (props: FeedbackProps) => {
const pathname = usePathname()
const feedbackPathname = useMemo(() => basePathUrl(pathname), [pathname])
return (
<UiFeedback
event="survey"
pathName={feedbackPathname}
event={DocsTrackingEvents.SURVEY}
question="Was this guide helpful?"
{...props}
/>
www/apps/user-guide/components/Feedback/index.tsx
+2 -9
View File
@@ -1,24 +1,17 @@
"use client"
import {
DocsTrackingEvents,
Feedback as UiFeedback,
FeedbackProps as UiFeedbackProps,
} from "docs-ui"
import { usePathname } from "next/navigation"
import { basePathUrl } from "../../utils/base-path-url"
import { useMemo } from "react"
type FeedbackProps = Omit<UiFeedbackProps, "event" | "pathName">
const Feedback = (props: FeedbackProps) => {
const pathname = usePathname()
const feedbackPathname = useMemo(() => basePathUrl(pathname), [pathname])
return (
<UiFeedback
event="survey"
pathName={feedbackPathname}
event={DocsTrackingEvents.SURVEY}
question="Was this guide helpful?"
{...props}
/>
www/packages/docs-ui/src/components/AiAssistant/ChatWindow/Input/index.tsx
+14 -1
View File
@@ -1,10 +1,15 @@
import React, { useEffect, useMemo, useRef } from "react"
import clsx from "clsx"
import { ArrowUpCircleSolid, LightBulb, LightBulbSolid } from "@medusajs/icons"
import { useAiAssistant, useIsBrowser } from "../../../../providers"
import {
useAiAssistant,
useAnalytics,
useIsBrowser,
} from "../../../../providers"
import { useChat, useDeepThinking } from "@kapaai/react-sdk"
import { useAiAssistantChatNavigation } from "../../../../hooks"
import { Tooltip } from "../../../Tooltip"
import { DocsTrackingEvents } from "../../../../constants"
type AiAssistantChatWindowInputProps = {
chatWindowRef: React.RefObject<HTMLDivElement | null>
@@ -16,6 +21,7 @@ export const AiAssistantChatWindowInput = ({
const { chatOpened, inputRef, loading, setChatOpened, isCaptchaLoaded } =
useAiAssistant()
const { submitQuery, conversation } = useChat()
const { track } = useAnalytics()
const { active, toggle } = useDeepThinking()
const { isBrowser } = useIsBrowser()
const { searchQuery, searchQueryType } = useMemo(() => {
@@ -38,6 +44,13 @@ export const AiAssistantChatWindowInput = ({
) => {
e?.preventDefault()
submitQuery(overrideQuestion || question)
if (!conversation.length) {
track({
event: {
event: DocsTrackingEvents.AI_ASSISTANT_START_CHAT,
},
})
}
setQuestion("")
}
www/packages/docs-ui/src/components/CodeBlock/Actions/Copy/index.tsx
+8 -1
View File
@@ -1,7 +1,7 @@
"use client"
import React, { useEffect, useState } from "react"
import { CopyButton } from "../../../.."
import { CopyButton, DocsTrackingEvents, useAnalytics } from "../../../.."
import clsx from "clsx"
import { CheckMini, SquareTwoStack } from "@medusajs/icons"
@@ -15,6 +15,7 @@ export const CodeBlockCopyAction = ({
inHeader,
}: CodeBlockCopyActionProps) => {
const [copied, setCopied] = useState(false)
const { track } = useAnalytics()
useEffect(() => {
if (copied) {
@@ -22,6 +23,12 @@ export const CodeBlockCopyAction = ({
setCopied(false)
}, 1000)
}
track({
event: {
event: DocsTrackingEvents.CODE_BLOCK_COPY,
},
})
}, [copied])
const iconClassName = [
www/packages/docs-ui/src/components/CodeBlock/index.tsx
+12 -2
View File
@@ -4,13 +4,13 @@ import React, { useEffect, useMemo, useRef, useState } from "react"
import clsx from "clsx"
import { Highlight, HighlightProps, themes, Token } from "prism-react-renderer"
import { ApiRunner } from "@/components"
import { useColorMode } from "@/providers"
import { useAnalytics, useColorMode } from "@/providers"
import { CodeBlockHeader, CodeBlockHeaderMeta } from "./Header"
import { CodeBlockLine } from "./Line"
import { ApiAuthType, ApiDataOptions, ApiMethod } from "types"
// @ts-expect-error can't install the types package because it doesn't support React v19
import { CSSTransition } from "react-transition-group"
import { useCollapsibleCodeLines } from "../.."
import { DocsTrackingEvents, useCollapsibleCodeLines } from "../.."
import { HighlightProps as CollapsibleHighlightProps } from "@/hooks"
import { CodeBlockActions, CodeBlockActionsProps } from "./Actions"
import { CodeBlockCollapsibleButton } from "./Collapsible/Button"
@@ -103,6 +103,7 @@ export const CodeBlock = ({
}
const { colorMode } = useColorMode()
const { track } = useAnalytics()
const [showTesting, setShowTesting] = useState(false)
const codeContainerRef = useRef<HTMLDivElement>(null)
const codeRef = useRef<HTMLElement>(null)
@@ -296,6 +297,14 @@ export const CodeBlock = ({
)
}, [codeContainerRef.current, codeRef.current])
const trackCopy = () => {
track({
event: {
event: DocsTrackingEvents.CODE_BLOCK_COPY,
},
})
}
const actionsProps: Omit<CodeBlockActionsProps, "inHeader"> = useMemo(
() => ({
source,
@@ -435,6 +444,7 @@ export const CodeBlock = ({
"pl-docs_1",
preClassName
)}
onCopy={trackCopy}
>
<code
className={clsx(
www/packages/docs-ui/src/components/Feedback/index.tsx
-6
View File
@@ -20,7 +20,6 @@ import { RadioGroup } from "@medusajs/ui"
export type FeedbackProps = {
event: string
pathName: string
reportLink?: string
question?: string
positiveBtn?: string
@@ -55,7 +54,6 @@ const feedbackOptions = {
export const Feedback = ({
event,
pathName,
reportLink: initReportLink,
question = "Was this page helpful?",
positiveBtn = "It was helpful",
@@ -106,15 +104,12 @@ export const Feedback = ({
event: {
event,
options: {
url: pathName,
label: document.title,
feedback:
(feedback !== null && feedback) ||
(feedback === null && positiveFeedback)
? "yes"
: "no",
message: message?.length ? message : null,
os: window.navigator.userAgent,
feedbackOption,
...extraData,
},
@@ -124,7 +119,6 @@ export const Feedback = ({
resetForm()
}
},
tracker: ["segment", "posthog"],
},
})
}
www/packages/docs-ui/src/constants.tsx
+7
View File
@@ -494,3 +494,10 @@ export const products: Product[] = [
image: "/images/user-icon.png",
},
]
export enum DocsTrackingEvents {
SURVEY = "survey",
SURVEY_API = "survey_api-ref",
CODE_BLOCK_COPY = "code_block_copy",
AI_ASSISTANT_START_CHAT = "ai_assistant_start_chat",
}
www/packages/docs-ui/src/providers/Analytics/index.tsx
+18 -4
View File
@@ -10,6 +10,7 @@ import React, {
import { useSegmentAnalytics } from "./providers/segment"
import { usePostHogAnalytics } from "./providers/posthog"
import { useReoDevAnalytics } from "./providers/reo-dev"
import { usePathname } from "next/navigation"
export type ExtraData = {
section?: string
@@ -43,6 +44,8 @@ export type AnalyticsProviderProps = {
children?: React.ReactNode
}
const DEFAULT_TRACKER: Trackers = "posthog"
export const AnalyticsProvider = ({
segmentWriteKey,
reoDevKey,
@@ -55,12 +58,23 @@ export const AnalyticsProvider = ({
})
const { track: trackWithPostHog } = usePostHogAnalytics()
useReoDevAnalytics({ reoDevKey })
const pathname = usePathname()
const processEvent = useCallback(
async (event: TrackedEvent) => {
const trackers = Array.isArray(event.tracker)
? event.tracker
: [event.tracker]
const trackers = !event.tracker
? [DEFAULT_TRACKER]
: Array.isArray(event.tracker)
? event.tracker
: [event.tracker]
event.options = {
url: pathname,
label: document.title,
os: window.navigator.userAgent,
...event.options,
}
await Promise.all(
trackers.map(async (tracker) => {
switch (tracker) {
@@ -73,7 +87,7 @@ export const AnalyticsProvider = ({
})
)
},
[trackWithSegment, trackWithPostHog]
[trackWithSegment, trackWithPostHog, pathname]
)
const track = ({ event }: { event: TrackedEvent }) => {