Render login or error views from GithubTabView

Author: smashwilson

lib/views/github-tab-view.js

@@ -2,26 +2,29 @@ import React from 'react';
 import PropTypes from 'prop-types';
 
 import {
-  GithubLoginModelPropType, RefHolderPropType, RemoteSetPropType, RemotePropType, BranchSetPropType, BranchPropType,
+  TokenPropType, EndpointPropType, RefHolderPropType,
+  RemoteSetPropType, RemotePropType, BranchSetPropType, BranchPropType,
   RefresherPropType,
 } from '../prop-types';
 import LoadingView from './loading-view';
+import QueryErrorView from '../views/query-error-view';
+import GithubLoginView from '../views/github-login-view';
 import RemoteSelectorView from './remote-selector-view';
 import GithubTabHeaderContainer from '../containers/github-tab-header-container';
-import GithubTabHeaderController from '../controllers/github-tab-header-controller';
 import GitHubBlankNoLocal from './github-blank-nolocal';
 import GitHubBlankUninitialized from './github-blank-uninitialized';
 import GitHubBlankNoRemote from './github-blank-noremote';
 import RemoteContainer from '../containers/remote-container';
-import {nullAuthor} from '../models/author';
+import {UNAUTHENTICATED, INSUFFICIENT} from '../shared/keytar-strategy';
 
 export default class GitHubTabView extends React.Component {
   static propTypes = {
     refresher: RefresherPropType.isRequired,
     rootHolder: RefHolderPropType.isRequired,
 
     // Connection
-    loginModel: GithubLoginModelPropType.isRequired,
+    endpoint: EndpointPropType.isRequired,
+    token: TokenPropType,
 
     // Workspace
     workspace: PropTypes.object.isRequired,
@@ -43,6 +46,9 @@ export default class GitHubTabView extends React.Component {
     pushInProgress: PropTypes.bool.isRequired,
 
     // Event Handlers
+    handleLogin: PropTypes.func.isRequired,
+    handleLogout: PropTypes.func.isRequired,
+    handleTokenRetry: PropTypes.func.isRequired,
     handleWorkDirSelect: PropTypes.func,
     handlePushBranch: PropTypes.func.isRequired,
     handleRemoteSelect: PropTypes.func.isRequired,
@@ -65,6 +71,35 @@ export default class GitHubTabView extends React.Component {
   }
 
   renderRemote() {
+    if (this.props.token === null) {
+      return <LoadingView />;
+    }
+
+    if (this.props.token === UNAUTHENTICATED) {
+      return <GithubLoginView onLogin={this.props.handleLogin} />;
+    }
+
+    if (this.props.token === INSUFFICIENT) {
+      return (
+        <GithubLoginView onLogin={this.props.handleLogin}>
+          <p>
+            Your token no longer has sufficient authorizations. Please re-authenticate and generate a new one.
+          </p>
+        </GithubLoginView>
+      );
+    }
+
+    if (this.props.token instanceof Error) {
+      return (
+        <QueryErrorView
+          error={this.props.token}
+          retry={this.props.handleTokenRetry}
+          login={this.props.handleLogin}
+          logout={this.props.handleLogout}
+        />
+      );
+    }
+
     if (this.props.isLoading) {
       return <LoadingView />;
     }
@@ -92,22 +127,22 @@ export default class GitHubTabView extends React.Component {
       return (
         <RemoteContainer
           // Connection
-          loginModel={this.props.loginModel}
           endpoint={this.props.currentRemote.getEndpoint()}
+          token={this.props.token}
 
-          // Workspace
-          workspace={this.props.workspace}
+          // Repository attributes
+          refresher={this.props.refresher}
+          pushInProgress={this.props.pushInProgress}
           workingDirectory={this.props.workingDirectory}
-
-          // Remote
+          workspace={this.props.workspace}
           remote={this.props.currentRemote}
           remotes={this.props.remotes}
           branches={this.props.branches}
           aheadCount={this.props.aheadCount}
-          pushInProgress={this.props.pushInProgress}
-          refresher={this.props.refresher}
 
-          // Event Handlers
+          // Action methods
+          handleLogin={this.props.handleLogin}
+          handleLogout={this.props.handleLogout}
           onPushBranch={() => this.props.handlePushBranch(this.props.currentBranch, this.props.currentRemote)}
         />
       );
@@ -130,29 +165,11 @@ export default class GitHubTabView extends React.Component {
   }
 
   renderHeader() {
-    if (this.props.currentRemote.isPresent()) {
-      return (
-        <GithubTabHeaderContainer
-          // Connection
-          loginModel={this.props.loginModel}
-          endpoint={this.props.currentRemote.getEndpoint()}
-
-          // Workspace
-          currentWorkDir={this.props.workingDirectory}
-          contextLocked={this.props.contextLocked}
-          changeWorkingDirectory={this.props.changeWorkingDirectory}
-          setContextLock={this.props.setContextLock}
-          getCurrentWorkDirs={this.props.getCurrentWorkDirs}
-
-          // Event Handlers
-          // handleWorkDirSelect={e => this.props.changeWorkingDirectory(e.target.value)}
-          onDidChangeWorkDirs={this.props.onDidChangeWorkDirs}
-        />
-      );
-    }
     return (
-      <GithubTabHeaderController
-        user={nullAuthor}
+      <GithubTabHeaderContainer
+        // Connection
+        endpoint={this.props.endpoint}
+        token={this.props.token}
 
         // Workspace
         currentWorkDir={this.props.workingDirectory}

test/views/github-tab-view.test.js

@@ -8,10 +8,10 @@ import RemoteSet from '../../lib/models/remote-set';
 import Branch, {nullBranch} from '../../lib/models/branch';
 import BranchSet from '../../lib/models/branch-set';
 import GitHubTabView from '../../lib/views/github-tab-view';
-import {InMemoryStrategy} from '../../lib/shared/keytar-strategy';
-import GithubLoginModel from '../../lib/models/github-login-model';
+import {DOTCOM} from '../../lib/models/endpoint';
 import RefHolder from '../../lib/models/ref-holder';
 import Refresher from '../../lib/models/refresher';
+import {UNAUTHENTICATED, INSUFFICIENT} from '../../lib/shared/keytar-strategy';
 
 import {buildRepository, cloneRepository} from '../helpers';
 
@@ -34,7 +34,8 @@ describe('GitHubTabView', function() {
         refresher={new Refresher()}
         rootHolder={new RefHolder()}
 
-        loginModel={new GithubLoginModel(InMemoryStrategy)}
+        endpoint={DOTCOM}
+        token="1234"
 
         workspace={atomEnv.workspace}
         workingDirectory={repo.getWorkingDirectoryPath()}
@@ -52,6 +53,9 @@ describe('GitHubTabView', function() {
         currentBranch={nullBranch}
         pushInProgress={false}
 
+        handleLogin={() => {}}
+        handleLogout={() => {}}
+        handleTokenRetry={() => {}}
         handleWorkDirSelect={() => {}}
         handlePushBranch={() => {}}
         handleRemoteSelect={() => {}}
@@ -66,6 +70,30 @@ describe('GitHubTabView', function() {
     );
   }
 
+  it('renders a LoadingView if the token is still loading', function() {
+    const wrapper = shallow(buildApp({token: null}));
+    assert.isTrue(wrapper.exists('LoadingView'));
+  });
+
+  it('renders a login view if the token is missing or incorrect', function() {
+    const wrapper = shallow(buildApp({token: UNAUTHENTICATED}));
+    assert.isTrue(wrapper.exists('GithubLoginView'));
+  });
+
+  it('renders a login view with a custom message if the token has insufficient scopes', function() {
+    const wrapper = shallow(buildApp({token: INSUFFICIENT}));
+    assert.isTrue(wrapper.exists('GithubLoginView'));
+    assert.isTrue(wrapper.find('GithubLoginView').exists('p'));
+  });
+
+  it('renders an error view if there was an error acquiring the token', function() {
+    const e = new Error('oh no');
+    e.rawStack = e.stack;
+    const wrapper = shallow(buildApp({token: e}));
+    assert.isTrue(wrapper.exists('QueryErrorView'));
+    assert.strictEqual(wrapper.find('QueryErrorView').prop('error'), e);
+  });
+
   it('renders a LoadingView if data is still loading', function() {
     const wrapper = shallow(buildApp({isLoading: true}));
     assert.isTrue(wrapper.find('LoadingView').exists());