Removed first page in favour of vault user

apps/browser/src/tools/popup/settings/tunnel-demo.component.html

@@ -5,7 +5,8 @@
     </ng-container>
   </popup-header>
 
-  <!-- Connection Form -->
+  <!-- Connection Form - OLD CODE: Manual pairing form -->
+  <!--
   <bit-section *ngIf="!isListening">
     <bit-section-header>
       <h2 bitTypography="h6">Pair with Remote Device</h2>
@@ -35,9 +36,10 @@
       </form>
     </bit-card>
   </bit-section>
+  -->
 
   <!-- Status Display -->
-  <bit-section *ngIf="isListening">
+  <bit-section>
     <bit-section-header>
       <h2 bitTypography="h6">Connection Status</h2>
     </bit-section-header>

apps/browser/src/tools/popup/settings/tunnel-demo.component.ts

@@ -83,11 +83,38 @@ export class TunnelDemoComponent implements OnInit, OnDestroy {
     private tunnelClient: TunnelClientService,
   ) {}
 
-  ngOnInit(): void {
+  async ngOnInit(): Promise<void> {
     // Subscribe to tunnel client events
     this.tunnelClient.events$
       .pipe(takeUntil(this.destroy$))
       .subscribe((event) => this.handleTunnelEvent(event));
+
+    // Auto-start pairing with active account username
+    await this.autoStartPairing();
+  }
+
+  /**
+   * Automatically start pairing using the active account's email as username
+   */
+  private async autoStartPairing(): Promise<void> {
+    try {
+      // Get the active account's email
+      const activeAccount = await firstValueFrom(this.accountService.activeAccount$);
+      if (!activeAccount?.email) {
+        this.addActivityLog("No active account found", "error");
+        return;
+      }
+
+      // Set the username to the account email
+      this.formGroup.patchValue({
+        username: activeAccount.email,
+      });
+
+      // Auto-start pairing
+      await this.startPairing();
+    } catch (error) {
+      this.addActivityLog(`Failed to auto-start pairing: ${error.message || error}`, "error");
+    }
   }
 
   ngOnDestroy(): void {