Added file tree to merge request diffs

This file tree displays all the diff files in a tree like format
Each file is taken and converted into a tree with folders
Each folder can be toggled open & closed
Clicking a file will scroll to the diff file & highlight with a glow affect

Searching the tree list will search only files & return a list of the
files without any folders

Each file row contains an icon to show changed, new file or deleted
Each row will also contain the added & removed lines count

Closes https://gitlab.com/gitlab-org/gitlab-ce/issues/14249

1 files changed, 9 insertions, 7 deletions

diff --git a/app/assets/javascripts/merge_request_tabs.js b/app/assets/javascripts/merge_request_tabs.js
index 763429d7242..78f56ab57ff 100644
--- a/app/assets/javascripts/merge_request_tabs.js
+++ b/app/assets/javascripts/merge_request_tabs.js
@@ -194,9 +194,7 @@ export default class MergeRequestTabs {
         if (bp.getBreakpointSize() !== 'lg') {
           this.shrinkView();
         }
-        if (this.diffViewType() === 'parallel') {
-          this.expandViewContainer();
-        }
+        this.expandViewContainer();
         this.destroyPipelinesView();
         this.commitsTab.classList.remove('active');
       } else if (action === 'pipelines') {
@@ -355,7 +353,7 @@ export default class MergeRequestTabs {
         localTimeAgo($('.js-timeago', 'div#diffs'));
         syntaxHighlight($('#diffs .js-syntax-highlight'));
 
-        if (this.diffViewType() === 'parallel' && this.isDiffAction(this.currentAction)) {
+        if (this.isDiffAction(this.currentAction)) {
           this.expandViewContainer();
         }
         this.diffsLoaded = true;
@@ -408,19 +406,23 @@ export default class MergeRequestTabs {
   }
 
   diffViewType() {
-    return $('.inline-parallel-buttons a.active').data('viewType');
+    return $('.inline-parallel-buttons button.active').data('viewType');
   }
 
   isDiffAction(action) {
     return action === 'diffs' || action === 'new/diffs';
   }
 
-  expandViewContainer() {
+  expandViewContainer(removeLimited = true) {
     const $wrapper = $('.content-wrapper .container-fluid').not('.breadcrumbs');
     if (this.fixedLayoutPref === null) {
       this.fixedLayoutPref = $wrapper.hasClass('container-limited');
     }
-    $wrapper.removeClass('container-limited');
+    if (this.diffViewType() === 'parallel' || removeLimited) {
+      $wrapper.removeClass('container-limited');
+    } else {
+      $wrapper.addClass('container-limited');
+    }
   }
 
   resetViewContainer() {