Merge pull request #2325 from wadethestealth/avatar

Add avatar and split up TabHeaderView

Author: smashwilson

lib/containers/__generated__/githubTabHeaderContainerQuery.graphql.js

@@ -0,0 +1,109 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import {QueryRenderer, graphql} from 'react-relay';
+
+import {EndpointPropType} from '../prop-types';
+import RelayNetworkLayerManager from '../relay-network-layer-manager';
+import {UNAUTHENTICATED, INSUFFICIENT} from '../shared/keytar-strategy';
+import ObserveModel from '../views/observe-model';
+import Author, {nullAuthor} from '../models/author';
+import GithubTabHeaderController from '../controllers/github-tab-header-controller';
+
+export default class GithubTabHeaderContainer extends React.Component {
+  static propTypes = {
+    // Connection
+    loginModel: PropTypes.object.isRequired,
+    endpoint: EndpointPropType.isRequired,
+
+    // Workspace
+    currentWorkDir: PropTypes.string,
+    getCurrentWorkDirs: PropTypes.func.isRequired,
+
+    // Event Handlers
+    handleWorkDirSelect: PropTypes.func,
+    onDidChangeWorkDirs: PropTypes.func,
+  }
+
+  render() {
+    return (
+      <ObserveModel model={this.props.loginModel} fetchData={this.fetchToken}>
+        {this.renderWithToken}
+      </ObserveModel>
+    );
+  }
+
+  renderWithToken = token => {
+    if (
+      token == null
+      || token instanceof Error
+      || token === UNAUTHENTICATED
+      || token === INSUFFICIENT
+    ) {
+      return this.renderNoResult();
+    }
+
+    const environment = RelayNetworkLayerManager.getEnvironmentForHost(this.props.endpoint, token);
+    const query = graphql`
+      query githubTabHeaderContainerQuery {
+        viewer {
+          name,
+          email,
+          avatarUrl,
+          login
+        }
+      }
+    `;
+
+    return (
+      <QueryRenderer
+        environment={environment}
+        variables={{}}
+        query={query}
+        render={result => this.renderWithResult(result, token)}
+      />
+    );
+  }
+
+  renderWithResult({error, props, retry}, token) {
+    if (error || props === null) {
+      return this.renderNoResult();
+    }
+
+    // eslint-disable-next-line react/prop-types
+    const {email, name, avatarUrl, login} = props.viewer;
+
+    return (
+      <GithubTabHeaderController
+        user={new Author(email, name, login, false, avatarUrl)}
+
+        // Workspace
+        currentWorkDir={this.props.currentWorkDir}
+        getCurrentWorkDirs={this.props.getCurrentWorkDirs}
+
+        // Event Handlers
+        handleWorkDirSelect={this.props.handleWorkDirSelect}
+        onDidChangeWorkDirs={this.props.onDidChangeWorkDirs}
+      />
+    );
+  }
+
+  renderNoResult() {
+    return (
+      <GithubTabHeaderController
+        user={nullAuthor}
+
+        // Workspace
+        currentWorkDir={this.props.currentWorkDir}
+        getCurrentWorkDirs={this.props.getCurrentWorkDirs}
+
+        // Event Handlers
+        handleWorkDirSelect={this.props.handleWorkDirSelect}
+        onDidChangeWorkDirs={this.props.onDidChangeWorkDirs}
+      />
+    );
+  }
+
+  fetchToken = loginModel => {
+    return loginModel.getToken(this.props.endpoint.getLoginAccount());
+  }
+}

lib/containers/github-tab-header-container.js

@@ -3,7 +3,6 @@ import path from 'path';
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import Author from '../models/author';
 import GitTabView from '../views/git-tab-view';
 import UserStore from '../models/user-store';
 import RefHolder from '../models/ref-holder';
@@ -279,11 +278,7 @@ export default class GitTabController extends React.Component {
 
     await repo.undoLastCommit();
     repo.setCommitMessage(lastCommit.getFullMessage());
-
-    const coAuthors = lastCommit.getCoAuthors().map(author =>
-      new Author(author.email, author.name));
-
-    this.updateSelectedCoAuthors(coAuthors);
+    this.updateSelectedCoAuthors(lastCommit.getCoAuthors());
 
     return null;
   }

lib/controllers/git-tab-controller.js

@@ -0,0 +1,88 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import {CompositeDisposable} from 'atom';
+import {nullAuthor} from '../models/author';
+import GitTabHeaderView from '../views/git-tab-header-view';
+
+export default class GitTabHeaderController extends React.Component {
+  static propTypes = {
+    getCommitter: PropTypes.func.isRequired,
+
+    // Workspace
+    currentWorkDir: PropTypes.string,
+    getCurrentWorkDirs: PropTypes.func.isRequired,
+
+    // Event Handlers
+    handleWorkDirSelect: PropTypes.func.isRequired,
+    onDidChangeWorkDirs: PropTypes.func.isRequired,
+    onDidUpdateRepo: PropTypes.func.isRequired,
+  }
+
+  constructor(props) {
+    super(props);
+    this._isMounted = false;
+    this.state = {currentWorkDirs: [], committer: nullAuthor};
+    this.disposable = new CompositeDisposable();
+  }
+
+  static getDerivedStateFromProps(props, state) {
+    return {
+      currentWorkDirs: props.getCurrentWorkDirs(),
+    };
+  }
+
+  componentDidMount() {
+    this._isMounted = true;
+    this.disposable.add(this.props.onDidChangeWorkDirs(this.resetWorkDirs));
+    this.disposable.add(this.props.onDidUpdateRepo(this.updateCommitter));
+    this.updateCommitter();
+  }
+
+  componentDidUpdate(prevProps) {
+    if (
+      prevProps.onDidChangeWorkDirs !== this.props.onDidChangeWorkDirs
+      || prevProps.onDidUpdateRepo !== this.props.onDidUpdateRepo
+    ) {
+      this.disposable.dispose();
+      this.disposable = new CompositeDisposable();
+      this.disposable.add(this.props.onDidChangeWorkDirs(this.resetWorkDirs));
+      this.disposable.add(this.props.onDidUpdateRepo(this.updateCommitter));
+    }
+    if (prevProps.getCommitter !== this.props.getCommitter) {
+      this.updateCommitter();
+    }
+  }
+
+  render() {
+    return (
+      <GitTabHeaderView
+        committer={this.state.committer}
+
+        // Workspace
+        workdir={this.props.currentWorkDir}
+        workdirs={this.state.currentWorkDirs}
+
+        // Event Handlers
+        handleWorkDirSelect={this.props.handleWorkDirSelect}
+      />
+    );
+  }
+
+  resetWorkDirs = () => {
+    this.setState((state, props) => ({
+      currentWorkDirs: [],
+    }));
+  }
+
+  updateCommitter = async () => {
+    const committer = await this.props.getCommitter() || nullAuthor;
+    if (this._isMounted) {
+      this.setState({committer});
+    }
+  }
+
+  componentWillUnmount() {
+    this._isMounted = false;
+    this.disposable.dispose();
+  }
+}

lib/controllers/git-tab-header-controller.js

@@ -46,9 +46,11 @@ export default class GitHubTabController extends React.Component {
 
     return (
       <GitHubTabView
+        // Connection
+        loginModel={this.props.loginModel}
+
         workspace={this.props.workspace}
         refresher={this.props.refresher}
-        loginModel={this.props.loginModel}
         rootHolder={this.props.rootHolder}
 
         workingDirectory={this.props.workingDirectory || this.props.currentWorkDir}