Skip to content

Commit aa0421c

Browse files
committed
feat(onboarding): add tracking for Vercel GitHub steps
Add telemetry events to the Vercel onboarding modal to better track user interactions with the GitHub integration flow. Specifically: - Fire an event when the GitHub step is shown, including whether the GitHub app is already installed (github_app_installed). - Track when the user clicks the "Install GitHub app" button. - Track when the user completes the GitHub onboarding step. - Track when the user skips the GitHub onboarding step (applies to multiple skip paths). Also add gitHubAppInstallations.length to the effect dependency array to ensure the "step viewed" event updates correctly when installation state changes. These events improve analytics for onboarding funnels and help identify drop-off or friction points in the GitHub integration flow.
1 parent 38981f5 commit aa0421c

File tree

1 file changed

+8
-1
lines changed

1 file changed

+8
-1
lines changed

apps/webapp/app/components/integrations/VercelOnboardingModal.tsx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -543,8 +543,11 @@ export function VercelOnboardingModal({
543543

544544
if (!isGitHubConnectedForOnboarding) {
545545
setState("github-connection");
546+
trackOnboarding("vercel onboarding github step viewed", {
547+
github_app_installed: gitHubAppInstallations.length > 0,
548+
});
546549
}
547-
}, [vercelStagingEnvironment, pullEnvVarsBeforeBuild, atomicBuilds, discoverEnvVars, syncEnvVarsMapping, nextUrl, fromMarketplaceContext, isGitHubConnectedForOnboarding, completeOnboardingFetcher, actionUrl, trackOnboarding]);
550+
}, [vercelStagingEnvironment, pullEnvVarsBeforeBuild, atomicBuilds, discoverEnvVars, syncEnvVarsMapping, nextUrl, fromMarketplaceContext, isGitHubConnectedForOnboarding, completeOnboardingFetcher, actionUrl, trackOnboarding, gitHubAppInstallations.length]);
548551

549552
const handleFinishOnboarding = useCallback((e: React.FormEvent<HTMLFormElement>) => {
550553
e.preventDefault();
@@ -1081,6 +1084,7 @@ export function VercelOnboardingModal({
10811084
)}
10821085
variant="secondary/medium"
10831086
LeadingIcon={OctoKitty}
1087+
onClick={() => trackOnboarding("vercel onboarding github app install clicked")}
10841088
>
10851089
Install GitHub app
10861090
</LinkButton>
@@ -1110,6 +1114,7 @@ export function VercelOnboardingModal({
11101114
<Button
11111115
variant="primary/medium"
11121116
onClick={() => {
1117+
trackOnboarding("vercel onboarding github completed");
11131118
setState("completed");
11141119
const validUrl = safeRedirectUrl(nextUrl);
11151120
if (validUrl) {
@@ -1123,6 +1128,7 @@ export function VercelOnboardingModal({
11231128
<Button
11241129
variant="tertiary/medium"
11251130
onClick={() => {
1131+
trackOnboarding("vercel onboarding github skipped");
11261132
setState("completed");
11271133
if (fromMarketplaceContext && nextUrl) {
11281134
const validUrl = safeRedirectUrl(nextUrl);
@@ -1141,6 +1147,7 @@ export function VercelOnboardingModal({
11411147
<Button
11421148
variant="tertiary/medium"
11431149
onClick={() => {
1150+
trackOnboarding("vercel onboarding github skipped");
11441151
setState("completed");
11451152
}}
11461153
>

0 commit comments

Comments
 (0)