[MM022677] fix focus on new server modal (#1242)

src/browser/components/MainPage.jsx

@@ -56,6 +56,7 @@ export default class MainPage extends React.Component {
       targetURL: '',
       certificateRequests: [],
       maximized: false,
+      showNewTeamModal: false,
     };
   }
 
@@ -183,8 +184,12 @@ export default class MainPage extends React.Component {
     ipcRenderer.on('download-complete', this.showDownloadCompleteNotification);
 
     function focusListener() {
-      self.handleOnTeamFocused(self.state.key);
-      self.refs[`mattermostView${self.state.key}`].focusOnWebView();
+      if (this.state.showNewTeamModal && this.inputRef) {
+        this.inputRef.current().focus();
+      } else {
+        self.handleOnTeamFocused(self.state.key);
+        self.refs[`mattermostView${self.state.key}`].focusOnWebView();
+      }
       self.setState({unfocused: false});
     }
 
@@ -615,6 +620,9 @@ export default class MainPage extends React.Component {
       isDarkMode: this.props.setDarkMode(),
     });
   }
+  setInputRef = (ref) => {
+    this.inputRef = ref;
+  }
 
   showExtraBar = () => {
     const ref = this.refs[`mattermostView${this.state.key}`];
@@ -793,6 +801,7 @@ export default class MainPage extends React.Component {
         currentOrder={this.props.teams.length}
         show={this.state.showNewTeamModal}
         restoreFocus={false}
+        setInputRef={this.setInputRef}
         onClose={() => {
           this.setState({
             showNewTeamModal: false,

src/browser/components/NewTeamModal.jsx

@@ -138,6 +138,7 @@ export default class NewTeamModal extends React.Component {
         className='NewTeamModal'
         show={this.props.show}
         id='newServerModal'
+        enforceFocus={true}
         onEntered={() => this.teamNameInputRef.focus()}
         onHide={this.props.onClose}
         container={this.props.modalContainer}
@@ -175,6 +176,9 @@ export default class NewTeamModal extends React.Component {
                 onChange={this.handleTeamNameChange}
                 inputRef={(ref) => {
                   this.teamNameInputRef = ref;
+                  if (this.props.setInputRef) {
+                    this.props.setInputRef(ref);
+                  }
                 }}
                 onClick={(e) => {
                   e.stopPropagation();
@@ -238,4 +242,5 @@ NewTeamModal.propTypes = {
   modalContainer: PropTypes.object,
   restoreFocus: PropTypes.bool,
   currentOrder: PropTypes.number,
+  setInputRef: PropTypes.ref,
 };