From 497d5a6252e38d92bb0459f1487ca3695ff8e5b0 Mon Sep 17 00:00:00 2001
From: Cezar Augusto <cezaraugusto@outlook.it>
Date: Mon, 22 Jan 2018 21:27:19 -0200
Subject: [PATCH] prevent sync modal to force focus when switching inputs fix
 #11653

---
 app/renderer/components/preferences/syncTab.js | 17 +++++------------
 1 file changed, 5 insertions(+), 12 deletions(-)

diff --git a/app/renderer/components/preferences/syncTab.js b/app/renderer/components/preferences/syncTab.js
index 5cc6c275511..7358e8b0e20 100644
--- a/app/renderer/components/preferences/syncTab.js
+++ b/app/renderer/components/preferences/syncTab.js
@@ -289,7 +289,7 @@ class SyncTab extends ImmutableComponent {
       : getSetting(settings.SYNC_DEVICE_NAME, this.props.settings)
   }
 
-  get deviceNameInputContent () {
+  deviceNameInputContent (hasAutoFocus = false) {
     return <SettingItem>
       <div className={css(styles.syncOverlayBody__label)} data-l10n-id='syncDeviceNameInput' />
       <input className={css(
@@ -298,6 +298,7 @@ class SyncTab extends ImmutableComponent {
         commonStyles.textbox__outlineable,
         commonStyles.textbox__isSettings
       )}
+        autoFocus={hasAutoFocus}
         spellCheck='false'
         ref={(node) => { this.deviceNameInput = node }}
         placeholder={this.defaultDeviceName} />
@@ -306,7 +307,7 @@ class SyncTab extends ImmutableComponent {
 
   get startOverlayContent () {
     return <section className={css(styles.syncOverlayBody__formBottomMargin)}>
-      {this.deviceNameInputContent}
+      {this.deviceNameInputContent(true)}
     </section>
   }
 
@@ -329,12 +330,13 @@ class SyncTab extends ImmutableComponent {
           styles.textArea__passphrase
         )}
           spellCheck='false'
+          autoFocus
           ref={(node) => { this.passphraseInput = node }}
           onChange={this.enableRestore}
         />
       </div>
       <div className={css(styles.syncOverlayBody__formBottomMargin)}>
-        {this.deviceNameInputContent}
+        {this.deviceNameInputContent()}
       </div>
     </section>
   }
@@ -432,15 +434,6 @@ class SyncTab extends ImmutableComponent {
     window.alert('Invalid input code; please try again or create a new profile.')
   }
 
-  componentDidUpdate () {
-    if (!this.isSetup && this.props.syncStartOverlayVisible) {
-      this.deviceNameInput.focus()
-    }
-    if (!this.isSetup && this.props.syncAddOverlayVisible) {
-      this.passphraseInput.focus()
-    }
-  }
-
   render () {
     return <section data-test-id='syncContainer'>
       {