Feat/1156-analytics (#1166)

* feat(backend): include email in authentication responses

* feat(web): add unit tests for LoginView component with PostHog integration

* refactor(web): remove donation link from LoginView component

* refactor(web): add NotOnTheWaitlist and OnTheWaitlist components to LoginView

* Apply suggestion from @Copilot

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Author: tyler-dane

packages/backend/src/auth/controllers/auth.controller.ts

@@ -106,7 +106,7 @@ class AuthController {
       const { authMethod, user } = await compassAuthService.determineAuthMethod(
         gUser.sub,
       );
-      const { cUserId } =
+      const { cUserId, email } =
         authMethod === "login"
           ? await this.login(
               user as WithId<Schema_User>,
@@ -121,6 +121,7 @@ class AuthController {
       const result: Result_Auth_Compass = {
         cUserId,
         isNewUser: authMethod === "signup",
+        email,
       };
 
       res.promise(result);
@@ -165,7 +166,7 @@ class AuthController {
 
     await userService.saveTimeFor("lastLoggedInAt", cUserId);
 
-    return { cUserId };
+    return { cUserId, email: user.email };
   };
 
   revokeSessionsByUser = async (
@@ -185,9 +186,9 @@ class AuthController {
   };
 
   signup = async (gUser: TokenPayload, gRefreshToken: string) => {
-    const userId = await userService.initUserData(gUser, gRefreshToken);
+    const user = await userService.initUserData(gUser, gRefreshToken);
 
-    return { cUserId: userId };
+    return { cUserId: user.userId, email: user.email };
   };
 }
 

packages/backend/src/user/services/user.service.test.ts

@@ -96,7 +96,7 @@ describe("UserService", () => {
 
       EmailDriver.mockEmailServiceResponse();
 
-      const userId = await userService.initUserData(
+      const { userId } = await userService.initUserData(
         gUser,
         faker.internet.jwt(),
       );

packages/backend/src/user/services/user.service.ts

@@ -117,7 +117,7 @@ class UserService {
 
   initUserData = async (gUser: TokenPayload, gRefreshToken: string) => {
     const cUser = await this.createUser(gUser, gRefreshToken);
-    const { userId } = cUser;
+    const { userId, email } = cUser;
 
     if (isMissingUserTagId()) {
       logger.warn(
@@ -135,7 +135,7 @@ class UserService {
 
     await eventService.createDefaultSomedays(userId);
 
-    return userId;
+    return { userId, email };
   };
 
   saveTimeFor = async (label: "lastLoggedInAt", userId: string) => {

packages/core/src/types/auth.types.ts

@@ -5,6 +5,7 @@ export interface Result_Auth_Compass {
   cUserId?: string;
   error?: BaseError;
   isNewUser?: boolean;
+  email?: string;
 }
 
 export interface Result_VerifyGToken {

packages/web/src/views/Login/Login.test.tsx

@@ -0,0 +1,206 @@
+import { usePostHog } from "posthog-js/react";
+import { act } from "react";
+import "@testing-library/jest-dom";
+import { screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { render } from "@web/__tests__/__mocks__/mock.render";
+import { AuthApi } from "@web/common/apis/auth.api";
+import { LoginView } from "./Login";
+
+// Mock PostHog
+jest.mock("posthog-js/react");
+const mockUsePostHog = usePostHog as jest.MockedFunction<typeof usePostHog>;
+
+// Mock AuthApi
+jest.mock("@web/common/apis/auth.api");
+const mockAuthApi = AuthApi as jest.Mocked<typeof AuthApi>;
+
+// Mock useGoogleLogin hook
+jest.mock("@web/components/oauth/google/useGoogleLogin", () => ({
+  useGoogleLogin: jest.fn(),
+}));
+
+// Mock useAuthCheck hook
+jest.mock("@web/auth/useAuthCheck", () => ({
+  useAuthCheck: () => ({
+    isAuthenticated: false,
+    isCheckingAuth: false,
+    isGoogleTokenActive: false,
+    isSessionActive: false,
+  }),
+}));
+
+// Mock useNavigate
+const mockNavigate = jest.fn();
+jest.mock("react-router-dom", () => ({
+  ...jest.requireActual("react-router-dom"),
+  useNavigate: () => mockNavigate,
+}));
+
+// Mock WaitlistApi
+jest.mock("@web/common/apis/waitlist.api", () => ({
+  WaitlistApi: {
+    getWaitlistStatus: jest.fn(),
+  },
+}));
+
+describe("LoginView", () => {
+  const mockIdentify = jest.fn();
+  const mockLogin = jest.fn();
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+
+    // Default mock implementations
+    mockUsePostHog.mockReturnValue({
+      identify: mockIdentify,
+    } as any);
+
+    mockAuthApi.loginOrSignup.mockResolvedValue({
+      cUserId: "test-user-id",
+      isNewUser: false,
+      email: "test@example.com",
+    });
+
+    // Mock useGoogleLogin hook
+    const {
+      useGoogleLogin,
+    } = require("@web/components/oauth/google/useGoogleLogin");
+    useGoogleLogin.mockReturnValue({
+      login: mockLogin,
+      data: null,
+      loading: false,
+    });
+  });
+
+  describe("PostHog Integration", () => {
+    it("should call posthog.identify with email after successful authentication", async () => {
+      const testEmail = "test@example.com";
+      mockAuthApi.loginOrSignup.mockResolvedValue({
+        cUserId: "user123",
+        isNewUser: false,
+        email: testEmail,
+      });
+
+      render(<LoginView />);
+
+      // Simulate successful Google login
+      const {
+        useGoogleLogin,
+      } = require("@web/components/oauth/google/useGoogleLogin");
+      const mockUseGoogleLogin = useGoogleLogin as jest.Mock;
+
+      // Get the onSuccess callback from the mocked hook
+      const onSuccessCallback = mockUseGoogleLogin.mock.calls[0][0].onSuccess;
+
+      // Call the onSuccess callback with a mock OAuth code
+      await onSuccessCallback("mock-oauth-code");
+
+      // Verify PostHog identify was called with correct parameters
+      expect(mockIdentify).toHaveBeenCalledWith(testEmail, {
+        email: testEmail,
+      });
+      expect(mockAuthApi.loginOrSignup).toHaveBeenCalledWith("mock-oauth-code");
+    });
+
+    it("should call posthog.identify for new user signup", async () => {
+      const testEmail = "newuser@example.com";
+      mockAuthApi.loginOrSignup.mockResolvedValue({
+        cUserId: "new-user-id",
+        isNewUser: true,
+        email: testEmail,
+      });
+
+      render(<LoginView />);
+
+      const {
+        useGoogleLogin,
+      } = require("@web/components/oauth/google/useGoogleLogin");
+      const mockUseGoogleLogin = useGoogleLogin as jest.Mock;
+      const onSuccessCallback = mockUseGoogleLogin.mock.calls[0][0].onSuccess;
+
+      await onSuccessCallback("mock-oauth-code");
+
+      // Verify PostHog identify was called for new user
+      expect(mockIdentify).toHaveBeenCalledWith(testEmail, {
+        email: testEmail,
+      });
+    });
+  });
+
+  describe("Authentication Flow", () => {
+    it("should call AuthApi.loginOrSignup with OAuth code", async () => {
+      render(<LoginView />);
+
+      const {
+        useGoogleLogin,
+      } = require("@web/components/oauth/google/useGoogleLogin");
+      const mockUseGoogleLogin = useGoogleLogin as jest.Mock;
+      const onSuccessCallback = mockUseGoogleLogin.mock.calls[0][0].onSuccess;
+
+      await onSuccessCallback("test-oauth-code");
+
+      expect(mockAuthApi.loginOrSignup).toHaveBeenCalledWith("test-oauth-code");
+    });
+
+    it("should log authentication errors", async () => {
+      const consoleErrorSpy = jest.spyOn(console, "error").mockImplementation();
+      mockAuthApi.loginOrSignup.mockRejectedValue(new Error("Auth failed"));
+
+      render(<LoginView />);
+
+      const {
+        useGoogleLogin,
+      } = require("@web/components/oauth/google/useGoogleLogin");
+      const mockUseGoogleLogin = useGoogleLogin as jest.Mock;
+      const onErrorCallback = mockUseGoogleLogin.mock.calls[0][0].onError;
+
+      // Simulate error
+      onErrorCallback(new Error("Auth failed"));
+
+      expect(consoleErrorSpy).toHaveBeenCalledWith(expect.any(Error));
+
+      consoleErrorSpy.mockRestore();
+    });
+  });
+
+  describe("Waitlist Flow", () => {
+    it("should handle waitlist status check", async () => {
+      // Mock window.location to not be localhost
+      const originalLocation = window.location;
+      delete (window as any).location;
+      window.location = {
+        ...originalLocation,
+        hostname: "example.com",
+      } as any;
+
+      const { WaitlistApi } = require("@web/common/apis/waitlist.api");
+      WaitlistApi.getWaitlistStatus.mockResolvedValue({
+        isOnWaitlist: true,
+        isInvited: true,
+        isActive: true,
+      });
+
+      render(<LoginView />);
+
+      const emailInput = screen.getByPlaceholderText("Enter your email");
+      const submitButton = screen.getByText("Check Waitlist Status");
+
+      await act(async () => {
+        await userEvent.type(emailInput, "test@example.com");
+      });
+      await act(async () => {
+        await userEvent.click(submitButton);
+      });
+
+      await waitFor(() => {
+        expect(WaitlistApi.getWaitlistStatus).toHaveBeenCalledWith(
+          "test@example.com",
+        );
+      });
+
+      // Restore original location
+      window.location = originalLocation;
+    });
+  });
+});