Add product event logs for referrals (#35933)

GitOrigin-RevId: 94f242153671a4a8cd3f09a1ef1ccb1d7efeff14

Author: Nicolapps

npm-packages/dashboard/src/components/referral/RedeemReferralLanding.test.tsx

@@ -2,6 +2,10 @@ import { act, render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { RedeemReferralLanding } from "./RedeemReferralLanding";
 
+jest.mock("convex-analytics", () => ({
+  logEvent: jest.fn(),
+}));
+
 describe("RedeemReferralLanding", () => {
   // We’re applying a onClick event to the link. This test verifies it is still a <a> and not a
   // button to ensure there is no regression on the click behavior.
@@ -20,6 +24,9 @@ describe("RedeemReferralLanding", () => {
       await userEvent.click(link);
     });
 
+    expect(jest.requireMock("convex-analytics").logEvent).toHaveBeenCalledWith(
+      "clicked “Sign up with GitHub” through referral landing",
+    );
     expect(link).toHaveAttribute("aria-disabled", "true");
   });
 });

npm-packages/dashboard/src/components/referral/RedeemReferralLanding.tsx

@@ -1,4 +1,5 @@
 import { GitHubLogoIcon } from "@radix-ui/react-icons";
+import { logEvent } from "convex-analytics";
 import { Sheet } from "dashboard-common/elements/Sheet";
 import { Spinner } from "dashboard-common/elements/Spinner";
 import { cn } from "dashboard-common/lib/cn";
@@ -65,7 +66,10 @@ function LogInButton({ code }: { code: string }) {
         clicked && "opacity-80 cursor-progress",
       )}
       href={`/api/auth/login?returnTo=${encodeURIComponent(`/referral/${code}/apply`)}`}
-      onClick={() => setClicked(true)}
+      onClick={() => {
+        logEvent("clicked “Sign up with GitHub” through referral landing");
+        setClicked(true);
+      }}
       aria-disabled={clicked}
     >
       <span

npm-packages/dashboard/src/components/referral/Referrals.tsx

@@ -9,6 +9,7 @@ import { Callout } from "dashboard-common/elements/Callout";
 import { useReferralState } from "api/referrals";
 import { Loading } from "dashboard-common/elements/Loading";
 import { useCopy } from "dashboard-common/lib/useCopy";
+import { logEvent } from "convex-analytics";
 import { ReferralsBenefits } from "./ReferralsBenefits";
 
 // Keep in sync with MAX_REFERRALS_BONUS in big_brain_lib/src/model/referrals.rs
@@ -155,6 +156,7 @@ function ReferralLink({ referralCode }: { referralCode: string }) {
         iconTooltip={copied ? "Copied" : "Copy to clipboard"}
         action={async () => {
           copy(`https://www.convex.dev/referral/${referralCode}`);
+          logEvent("copied referral link");
 
           setCopied(true);
           setTimeout(() => {

npm-packages/dashboard/src/pages/referral/[code]/apply.tsx

@@ -10,6 +10,7 @@ import { useState } from "react";
 import { Team } from "generatedApi";
 import { useApplyReferralCode, useReferralCode } from "api/referrals";
 import { useProfile } from "api/profile";
+import { logEvent } from "convex-analytics";
 
 export { getServerSideProps } from "lib/ssr";
 
@@ -49,6 +50,8 @@ function RedeemReferralCodePage() {
               referralCode: code,
             });
 
+            logEvent("redeemed referral code");
+
             void router.push(`/t/${selectedTeam.slug}`);
           }}
           teamEligibility={teamEligibility}