chore: improve SOCIAL_LOGIN event flows (#5120)

Author: svenvoskamp

packages/controllers/src/utils/SocialsUtil.ts

@@ -94,7 +94,14 @@ export async function connectSocial(
     }
   } catch (error) {
     popupWindow?.close()
-    SnackController.showError((error as Error)?.message)
+    const errorMessage = CoreHelperUtil.parseError(error)
+    SnackController.showError(errorMessage)
+
+    EventsController.sendEvent({
+      type: 'track',
+      event: 'SOCIAL_LOGIN_ERROR',
+      properties: { provider: socialProvider, message: errorMessage }
+    })
   }
 }
 

packages/scaffold-ui/src/views/w3m-connecting-farcaster-view/index.ts

@@ -72,6 +72,16 @@ export class W3mConnectingFarcasterView extends LitElement {
     super.disconnectedCallback()
     clearTimeout(this.timeout)
     window.removeEventListener('resize', this.forceUpdate)
+
+    // Track cancellation if user navigates away or closes modal without completing connection
+    const isConnected = ChainController.state.activeCaipAddress
+    if (!isConnected && this.socialProvider && (this.uri || this.loading)) {
+      EventsController.sendEvent({
+        type: 'track',
+        event: 'SOCIAL_LOGIN_CANCELED',
+        properties: { provider: this.socialProvider }
+      })
+    }
   }
 
   // -- Render -------------------------------------------- //

packages/scaffold-ui/src/views/w3m-connecting-social-view/index.ts

@@ -104,6 +104,17 @@ export class W3mConnectingSocialView extends LitElement {
   public override disconnectedCallback() {
     this.unsubscribe.forEach(unsubscribe => unsubscribe())
     window.removeEventListener('message', this.handleSocialConnection, false)
+
+    // Track cancellation if user navigates away or closes modal without completing connection
+    const isConnected = ChainController.state.activeCaipAddress
+    if (!isConnected && this.socialProvider && !this.connecting) {
+      EventsController.sendEvent({
+        type: 'track',
+        event: 'SOCIAL_LOGIN_CANCELED',
+        properties: { provider: this.socialProvider }
+      })
+    }
+
     this.socialWindow?.close()
     ChainController.setAccountProp('socialWindow', undefined, ChainController.state.activeChain)
   }
@@ -223,13 +234,6 @@ export class W3mConnectingSocialView extends LitElement {
     const interval = setInterval(() => {
       if (this.socialWindow?.closed) {
         if (!this.connecting && RouterController.state.view === 'ConnectingSocial') {
-          if (this.socialProvider) {
-            EventsController.sendEvent({
-              type: 'track',
-              event: 'SOCIAL_LOGIN_CANCELED',
-              properties: { provider: this.socialProvider }
-            })
-          }
           RouterController.goBack()
         }
         clearInterval(interval)