perf: lazy-load sentry in auth forms to reduce first-load JS (#951) (#954)

Co-authored-by: Ona <no-reply@ona.com>

Author: sw-factory-automations

src/app/(auth)/forgot-password/forgot-password-form.tsx

@@ -3,7 +3,6 @@
 import { useState } from "react";
 import Link from "next/link";
 import { getClient } from "@/lib/supabase/lazy-client";
-import { captureSupabaseError } from "@/lib/sentry";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
@@ -36,7 +35,9 @@ export function ForgotPasswordForm() {
       });
 
     if (resetError) {
-      captureSupabaseError(resetError, "forgot-password:resetPasswordForEmail");
+      import("@/lib/sentry").then(({ captureSupabaseError }) =>
+        captureSupabaseError(resetError, "forgot-password:resetPasswordForEmail"),
+      );
       setError(resetError.message);
       setLoading(false);
       return;

src/app/(auth)/reset-password/reset-password-form.tsx

@@ -4,7 +4,6 @@ import { useState } from "react";
 import { useRouter } from "next/navigation";
 import Link from "next/link";
 import { getClient } from "@/lib/supabase/lazy-client";
-import { captureSupabaseError } from "@/lib/sentry";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
@@ -46,7 +45,9 @@ export function ResetPasswordForm() {
     });
 
     if (updateError) {
-      captureSupabaseError(updateError, "reset-password:updateUser");
+      import("@/lib/sentry").then(({ captureSupabaseError }) =>
+        captureSupabaseError(updateError, "reset-password:updateUser"),
+      );
       setError(updateError.message);
       setLoading(false);
       return;

src/components/auth/oauth-buttons.test.tsx

@@ -159,11 +159,11 @@ describe("OAuthButtons — OAuth enabled", () => {
       expect(screen.getByRole("alert")).toHaveTextContent(
         "Provider not enabled",
       );
+      expect(mockCaptureSupabaseError).toHaveBeenCalledWith(
+        oauthError,
+        "oauth.signIn.github",
+      );
     });
-    expect(mockCaptureSupabaseError).toHaveBeenCalledWith(
-      oauthError,
-      "oauth.signIn.github",
-    );
   });
 
   it("disables both buttons while a provider is loading", async () => {

src/components/auth/oauth-buttons.tsx

@@ -2,7 +2,6 @@
 
 import { useState } from "react";
 import { getClient } from "@/lib/supabase/lazy-client";
-import { captureSupabaseError } from "@/lib/sentry";
 import { Button } from "@/components/ui/button";
 import {
   Tooltip,
@@ -61,7 +60,9 @@ export function OAuthButtons() {
     });
 
     if (oauthError) {
-      captureSupabaseError(oauthError as unknown as Error, `oauth.signIn.${provider}`);
+      import("@/lib/sentry").then(({ captureSupabaseError }) =>
+        captureSupabaseError(oauthError as unknown as Error, `oauth.signIn.${provider}`),
+      );
       setError(oauthError.message);
       setLoadingProvider(null);
     }