diff --git a/website/components/Widget.tsx b/website/components/Widget.tsx index 8eecfd6c9..39adf1cab 100644 --- a/website/components/Widget.tsx +++ b/website/components/Widget.tsx @@ -6,6 +6,7 @@ import Presets from "#components/Presets.js"; import Stackblitz from "#components/Stackblitz"; import { StoreContext } from "#components/Store.js"; import { createMemo, createSignal, Show, useContext, type JSX } from "solid-js"; +import { track } from "../lib/track"; export function CliGroup( props: { @@ -42,7 +43,11 @@ export function Widget(props: { theme?: string; widget: boolean }) { setTooltipText("Copy to Clipboard"); }; - const handleCopy = () => { + const handleCopy = (packageManager: string) => { + track("copy", { + flags: selectedFeaturesFlags(), + package_manager: packageManager, + }); setTooltipText("Copied to Clipboard!"); }; @@ -61,25 +66,45 @@ export function Widget(props: { theme?: string; widget: boolean }) {
- + handleCopy("pnpm")} + tooltipText={tooltipText()} + flags={getFlags()} + > {pnpm().join(" ")} - + handleCopy("yarn")} + tooltipText={tooltipText()} + flags={getFlags()} + > {yarn().join(" ")} - + handleCopy("bun")} + tooltipText={tooltipText()} + flags={getFlags()} + > {bun().join(" ")} - + handleCopy("npm")} + tooltipText={tooltipText()} + flags={getFlags()} + > {npm().join(" ")}
diff --git a/website/lib/track.ts b/website/lib/track.ts new file mode 100644 index 000000000..db6afd245 --- /dev/null +++ b/website/lib/track.ts @@ -0,0 +1,26 @@ +type Events = CopyEvent; + +interface CopyEvent { + name: "copy"; + data: { + flags: string[]; + package_manager: string; + }; +} + +interface Zaraz { + track: (event: T["name"], data: T["data"]) => Promise; +} + +declare global { + // eslint-disable-next-line no-var + var zaraz: Zaraz | undefined; +} + +export function track(event: T["name"], data: T["data"]) { + console.log({ + event, + data, + }); + globalThis.zaraz?.track(event, data); +}