1 files changed, 23 insertions, 0 deletions
diff --git a/app/assets/javascripts/diffs/components/app.vue b/app/assets/javascripts/diffs/components/app.vue
index 072bcaaad97..941365d9d1d 100644
--- a/app/assets/javascripts/diffs/components/app.vue
+++ b/app/assets/javascripts/diffs/components/app.vue
@@ -7,6 +7,7 @@ import createFlash from '~/flash';
 import PanelResizer from '~/vue_shared/components/panel_resizer.vue';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import { isSingleViewStyle } from '~/helpers/diffs_helper';
+import { updateHistory } from '~/lib/utils/url_utility';
 import eventHub from '../../notes/event_hub';
 import CompareVersions from './compare_versions.vue';
 import DiffFile from './diff_file.vue';
@@ -140,6 +141,20 @@ export default {
     },
   },
   watch: {
+    commit(newCommit, oldCommit) {
+      const commitChangedAfterRender = newCommit && !this.isLoading;
+      const commitIsDifferent = oldCommit && newCommit.id !== oldCommit.id;
+      const url = window?.location ? String(window.location) : '';
+
+      if (commitChangedAfterRender && commitIsDifferent) {
+        updateHistory({
+          title: document.title,
+          url: url.replace(oldCommit.id, newCommit.id),
+        });
+        this.refetchDiffData();
+        this.adjustView();
+      }
+    },
     diffViewType() {
       if (this.needsReload() || this.needsFirstLoad()) {
         this.refetchDiffData();
@@ -209,6 +224,7 @@ export default {
   methods: {
     ...mapActions(['startTaskList']),
     ...mapActions('diffs', [
+      'moveToNeighboringCommit',
       'setBaseConfig',
       'fetchDiffFiles',
       'fetchDiffFilesMeta',
@@ -329,9 +345,16 @@ export default {
             break;
         }
       });
+
+      if (this.commit && this.glFeatures.mrCommitNeighborNav) {
+        Mousetrap.bind('c', () => this.moveToNeighboringCommit({ direction: 'next' }));
+        Mousetrap.bind('x', () => this.moveToNeighboringCommit({ direction: 'previous' }));
+      }
     },
     removeEventListeners() {
       Mousetrap.unbind(['[', 'k', ']', 'j']);
+      Mousetrap.unbind('c');
+      Mousetrap.unbind('x');
     },
     jumpToFile(step) {
       const targetIndex = this.currentDiffIndex + step;