fix: fallback to redirect in case of oauth popup failing

Author: capJavert

packages/shared/src/components/auth/AuthOptionsInner.tsx

@@ -21,14 +21,9 @@ import {
   betterAuthSendVerificationOTP,
   betterAuthVerifyEmailOTP,
 } from '../../lib/betterAuth';
-import {
-  webappUrl,
-  broadcastChannel,
-  isTesting,
-  isBrave,
-} from '../../lib/constants';
+import { webappUrl, broadcastChannel, isTesting } from '../../lib/constants';
 import { getUserDefaultTimezone } from '../../lib/timezones';
-import { isIOSNative, isMobile } from '../../lib/func';
+import { shouldUseSocialAuthPopup } from '../../lib/func';
 import { generateNameFromEmail } from '../../lib/strings';
 import { generateUsername, claimClaimableItem } from '../../graphql/users';
 import useRegistration from '../../hooks/useRegistration';
@@ -558,9 +553,9 @@ function AuthOptionsInner({
       await handleLoginMessage();
       return;
     }
-    const isIOSApp = isIOSNative();
+    const shouldUsePopup = shouldUseSocialAuthPopup();
     onAuthStateUpdate?.({ isLoading: true });
-    if (!isIOSApp) {
+    if (shouldUsePopup) {
       windowPopup.current = window.open();
     }
     const callbackURL = `${webappUrl}callback?login=true`;
@@ -585,21 +580,8 @@ function AuthOptionsInner({
       onAuthStateUpdate?.({ isLoading: false });
       return;
     }
-    if (isIOSApp || (isBrave() && isMobile())) {
-      window.location.href = socialUrl;
-      return;
-    }
     if (!windowPopup.current) {
-      logEvent({
-        event_name: authErrorEventName,
-        extra: JSON.stringify({
-          error: 'Failed to open social login window',
-          origin: 'betterauth social popup',
-        }),
-      });
-      setIsSocialAuthLoading(false);
-      displayToast(SOCIAL_AUTH_RETRY_MESSAGE);
-      onAuthStateUpdate?.({ isLoading: false });
+      window.location.href = socialUrl;
       return;
     }
     windowPopup.current.location.href = socialUrl;

packages/shared/src/hooks/useLogin.ts

@@ -26,7 +26,7 @@ import { labels } from '../lib';
 import { Origin } from '../lib/log';
 import { useEventListener } from './useEventListener';
 import { broadcastChannel, webappUrl } from '../lib/constants';
-import { isIOSNative } from '../lib/func';
+import { shouldUseSocialAuthPopup } from '../lib/func';
 
 interface UseLogin {
   isPasswordLoginLoading?: boolean;
@@ -178,8 +178,8 @@ const useLogin = ({
         }
         return;
       }
-      const isIOSApp = isIOSNative();
-      const socialPopup = isIOSApp ? null : window.open();
+      const shouldUsePopup = shouldUseSocialAuthPopup();
+      const socialPopup = shouldUsePopup ? window.open() : null;
       const callbackURL = `${webappUrl}callback?login=true`;
       const { url: socialUrl, error } = await getBetterAuthSocialRedirectData(
         provider,
@@ -197,22 +197,11 @@ const useLogin = ({
         displayToast(labels.auth.error.generic);
         return;
       }
-      if (isIOSApp) {
-        window.location.href = socialUrl;
-        return;
-      }
       if (socialPopup) {
         socialPopup.location.href = socialUrl;
         return;
       }
-      logEvent({
-        event_name: AuthEventNames.LoginError,
-        extra: JSON.stringify({
-          error: 'Failed to open social login window',
-          origin: Origin.BetterAuthSocialPopup,
-        }),
-      });
-      displayToast(labels.auth.error.generic);
+      window.location.href = socialUrl;
     },
     [displayToast, logEvent, refetchBoot, onUpdateSignBack],
   );

packages/shared/src/lib/func.ts

@@ -216,6 +216,18 @@ export const isMobile = (): boolean =>
 export const shouldUseNativeShare = (): boolean =>
   'share' in globalThis?.navigator && isMobile();
 
+export const shouldUseSocialAuthPopup = (): boolean => {
+  if (isIOSNative()) {
+    return false;
+  }
+
+  if (isBrave() && isMobile()) {
+    return false;
+  }
+
+  return true;
+};
+
 interface BroadcastMessage {
   eventKey: string;
   [key: string]: unknown;

packages/shared/src/lib/log.ts

@@ -91,7 +91,6 @@ export enum Origin {
   BetterAuthNativeIdToken = 'betterauth native id token',
   BetterAuthNativeIdTokenBoot = 'betterauth native id token boot',
   BetterAuthSocialUrl = 'betterauth social url',
-  BetterAuthSocialPopup = 'betterauth social popup',
   LoginTurnstile = 'login turnstile',
 }