Add PermissionRequestDialog for when the app doesn't show the TabBar

src/browser/components/MainPage.jsx

@@ -11,6 +11,7 @@ const LoginModal = require('./LoginModal.jsx');
 const MattermostView = require('./MattermostView.jsx');
 const TabBar = require('./TabBar.jsx');
 const HoveringURL = require('./HoveringURL.jsx');
+const PermissionRequestDialog = require('./PermissionRequestDialog.jsx');
 
 const NewTeamModal = require('./NewTeamModal.jsx');
 
@@ -347,6 +348,16 @@ const MainPage = createReactClass({
           onLogin={this.handleLogin}
           onCancel={this.handleLoginCancel}
         />
+        {this.props.teams.length === 1 && this.props.requestingPermission[0] ? // eslint-disable-line multiline-ternary
+          <PermissionRequestDialog
+            id='MainPage-permissionDialog'
+            placement='bottom'
+            {...this.props.requestingPermission[0]}
+            onClickAllow={this.props.onClickPermissionDialog.bind(null, 0, 'allow')}
+            onClickBlock={this.props.onClickPermissionDialog.bind(null, 0, 'block')}
+            onClickClose={this.props.onClickPermissionDialog.bind(null, 0, 'close')}
+          /> : null
+        }
         <Grid fluid={true}>
           { tabsRow }
           { viewsRow }

src/browser/css/components/MainPage.css

@@ -7,3 +7,7 @@
   position: absolute;
   bottom: 0px;
 }
+
+div[id*="-permissionDialog"] {
+  max-width: 350px;
+}

src/browser/css/components/TabBar.css

@@ -37,7 +37,3 @@
   margin-top: 5px;
   border-radius: 50%;
 }
-
-div[id*="-permissionDialog"] {
-  max-width: 350px;
-}