From 3260ea96957a1e3e11e3982137e4800f968f93cc Mon Sep 17 00:00:00 2001
From: NicolasCantu <nicolas.cantu@pm.me>
Date: Thu, 23 Oct 2025 21:09:34 +0200
Subject: [PATCH] refactor: Remove manual authentication button, improve
 auto-flow
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

**Motivations :**
- Remove unnecessary 'Authenticate with Browser' button since authentication is automatic
- Simplify UI by removing manual interaction requirement
- Add better logging for relay connection debugging

**Modifications :**
- Removed mainPairingButton from home.html template
- Simplified setupMainPairing() to not handle button events
- Cleaned up handleMainPairing() to remove button state management
- Added relay connection success logging in router.ts

**Pages affectées :**
- src/pages/home/home.html - Removed authentication button
- src/pages/home/home.ts - Simplified authentication flow
- src/router.ts - Added relay connection logging
---
 src/pages/home/home.html |  2 --
 src/pages/home/home.ts   | 34 +++++-----------------------------
 src/router.ts            |  4 +++-
 3 files changed, 8 insertions(+), 32 deletions(-)

diff --git a/src/pages/home/home.html b/src/pages/home/home.html
index e8d9a6c..2a7c2f2 100755
--- a/src/pages/home/home.html
+++ b/src/pages/home/home.html
@@ -15,8 +15,6 @@
       </div>
     </div>
 
-    <button id="mainPairingButton" class="primary-btn">Authenticate with Browser</button>
-
     <div class="account-actions">
       <button id="deleteAccountButton" class="danger-btn">🗑️ Delete Account</button>
     </div>
diff --git a/src/pages/home/home.ts b/src/pages/home/home.ts
index df13f02..be7a485 100755
--- a/src/pages/home/home.ts
+++ b/src/pages/home/home.ts
@@ -524,34 +524,21 @@ export function setupIframePairingButtons() {
   }
 }
 
-// Main Pairing Interface
+// Main Pairing Interface - Auto-triggered, no button needed
 export function setupMainPairing(): void {
-  const container = getCorrectDOM('login-4nk-component') as HTMLElement;
-
-  const mainPairingButton = container.querySelector('#mainPairingButton') as HTMLButtonElement;
-  const mainStatus = container.querySelector('#main-status') as HTMLElement;
-
-  if (mainPairingButton) {
-    mainPairingButton.addEventListener('click', async () => {
-      await handleMainPairing();
-    });
-  }
+  // No button setup needed since authentication is automatic
+  console.log('🔐 Main pairing setup - authentication will be automatic');
 }
 
 async function handleMainPairing(): Promise<void> {
   const container = getCorrectDOM('login-4nk-component') as HTMLElement;
   const mainStatus = container.querySelector('#main-status') as HTMLElement;
-  const mainPairingButton = container.querySelector('#mainPairingButton') as HTMLButtonElement;
-
+  
   try {
     // Update UI
     if (mainStatus) {
       mainStatus.innerHTML = '<div class="spinner"></div><span>Authenticating with browser...</span>';
     }
-    if (mainPairingButton) {
-      mainPairingButton.disabled = true;
-      mainPairingButton.textContent = 'Authenticating...';
-    }
 
     // Always trigger WebAuthn flow for authentication
     console.log('🔐 Triggering WebAuthn authentication...');
@@ -594,23 +581,12 @@ async function handleMainPairing(): Promise<void> {
     // Now proceed with pairing process
     await prepareAndSendPairingTx();
 
-    // Re-enable button
-    if (mainPairingButton) {
-      mainPairingButton.disabled = false;
-      mainPairingButton.textContent = 'Authenticate with Browser';
-    }
-
   } catch (error) {
     console.error('Pairing failed:', error);
-
+    
     if (mainStatus) {
       mainStatus.innerHTML = '<span style="color: var(--error-color)">❌ Authentication failed</span>';
     }
-
-    if (mainPairingButton) {
-      mainPairingButton.disabled = false;
-      mainPairingButton.textContent = 'Authenticate with Browser';
-    }
   }
 }
 
diff --git a/src/router.ts b/src/router.ts
index 2316209..a7bb116 100755
--- a/src/router.ts
+++ b/src/router.ts
@@ -55,7 +55,7 @@ async function handleLocation(path: string) {
         'width: 100vw; height: 100vh; position: relative; grid-row: 2;'
       );
       if (container) container.appendChild(accountComponent);
-      
+
       // Initialize the home page after component is added to DOM
       console.log('🏠 Initializing home page...');
       try {
@@ -164,8 +164,10 @@ export async function init(): Promise<void> {
     try {
       console.log('🌐 Connecting to relays...');
       await services.connectAllRelays();
+      console.log('✅ Relays connected successfully');
     } catch (error) {
       console.warn('⚠️ Failed to connect to some relays:', error);
+      console.log('🔄 Continuing despite relay connection issues...');
     }
 
     // We register all the event listeners if we run in an iframe