View commit details in pane

docs/react-component-atlas.md

@@ -91,6 +91,13 @@ This is a high-level overview of the structure of the React component tree that
 > > [`<IssueDetailView>`](/lib/views/issue-detail-view.js)
 > > [`<PullRequestDetailView>`](/lib/views/pr-detail-view.js)
 > >
+> > The workspace-center pane item that appears when looking at all the changes
+> > associated with a single commit that already exists in the current repository.
+> > [`<CommitDetailItem>`](/lib/items/issueish-detail-item.js)
+> > [`<CommitDetailContainer>`](/lib/containers/commit-detail-container.js)
+> > [`<CommitDetailController>`](/lib/controllers/commit-detail-controller.js)
+> > [`<CommitDetailView>`](/lib/views/commit-detail-controller.js)
+> >
 > > The workspace-center pane that displays information about a pull request or issue ("issueish", collectively) from github.com.
 > >
 > > > [`<IssueTimelineController>`](/lib/controllers/issue-timeline-controller.js)

keymaps/git.cson

@@ -39,13 +39,25 @@
 '.github-CommitView-editor atom-text-editor:not([mini])':
   'cmd-enter': 'github:commit'
   'ctrl-enter': 'github:commit'
+  'tab': 'core:focus-next'
   'shift-tab': 'core:focus-previous'
 
 '.github-CommitView-commitPreview':
   'cmd-left': 'github:dive'
   'ctrl-left': 'github:dive'
   'enter': 'native!'
 
+'.github-RecentCommits':
+  'enter': 'github:dive'
+  'cmd-left': 'github:dive'
+  'ctrl-left': 'github:dive'
+  'tab': 'core:focus-next'
+  'shift-tab': 'core:focus-previous'
+
+'.github-CommitDetailView':
+  'cmd-right': 'github:surface'
+  'ctrl-right': 'github:surface'
+
 '.github-FilePatchView atom-text-editor:not([mini])':
   'cmd-/': 'github:toggle-patch-selection-mode'
   'ctrl-/': 'github:toggle-patch-selection-mode'

lib/containers/commit-detail-container.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import yubikiri from 'yubikiri';
+
+import ObserveModel from '../views/observe-model';
+import LoadingView from '../views/loading-view';
+import CommitDetailController from '../controllers/commit-detail-controller';
+
+export default class CommitDetailContainer extends React.Component {
+  static propTypes = {
+    repository: PropTypes.object.isRequired,
+    sha: PropTypes.string.isRequired,
+    itemType: PropTypes.func.isRequired,
+  }
+
+  fetchData = repository => {
+    return yubikiri({
+      commit: repository.getCommit(this.props.sha),
+      currentBranch: repository.getCurrentBranch(),
+      currentRemote: async query => repository.getRemoteForBranch((await query.currentBranch).getName()),
+      isCommitPushed: repository.isCommitPushed(this.props.sha),
+    });
+  }
+
+  render() {
+    return (
+      <ObserveModel model={this.props.repository} fetchData={this.fetchData}>
+        {this.renderResult}
+      </ObserveModel>
+    );
+  }
+
+  renderResult = data => {
+    if (this.props.repository.isLoading() || data === null || !data.commit.isPresent()) {
+      return <LoadingView />;
+    }
+
+    return (
+      <CommitDetailController
+        {...data}
+        {...this.props}
+      />
+    );
+  }
+}

lib/containers/issueish-detail-container.js

@@ -26,6 +26,8 @@ export default class IssueishDetailContainer extends React.Component {
 
     switchToIssueish: PropTypes.func.isRequired,
     onTitleChange: PropTypes.func.isRequired,
+
+    workspace: PropTypes.object.isRequired,
   }
 
   constructor(props) {
@@ -169,6 +171,8 @@ export default class IssueishDetailContainer extends React.Component {
         addRemote={repository.addRemote.bind(repository)}
         onTitleChange={this.props.onTitleChange}
         switchToIssueish={this.props.switchToIssueish}
+        workdirPath={repository.getWorkingDirectoryPath()}
+        workspace={this.props.workspace}
       />
     );
   }