1 files changed, 49 insertions, 20 deletions
diff --git a/app/views/projects/merge_requests/show/_versions.html.haml b/app/views/projects/merge_requests/show/_versions.html.haml
index 2da70ce7137..00287f2d245 100644
--- a/app/views/projects/merge_requests/show/_versions.html.haml
+++ b/app/views/projects/merge_requests/show/_versions.html.haml
@@ -1,31 +1,60 @@
-- merge_request_diffs = @merge_request.merge_request_diffs.select_without_diff
-
-- if merge_request_diffs.size > 1
-  .mr-version-switch
-    Version:
-    %span.dropdown.inline
+- if @merge_request_diffs.size > 1
+  .mr-version-controls
+    Changes between
+    %span.dropdown.inline.mr-version-dropdown
       %a.btn-link.dropdown-toggle{ data: {toggle: :dropdown} }
-        %strong.monospace<
+        %strong
           - if @merge_request_diff.latest?
-            #{"latest"}
+            latest version
           - else
-            #{@merge_request_diff.head_commit.short_id}
+            version #{version_index(@merge_request_diff)}
         %span.caret
       %ul.dropdown-menu.dropdown-menu-selectable
-        - merge_request_diffs.each do |merge_request_diff|
+        - @merge_request_diffs.each do |merge_request_diff|
           %li
-            = link_to diffs_namespace_project_merge_request_path(@project.namespace, @project, @merge_request, diff_id: merge_request_diff.id), class: ('is-active' if merge_request_diff == @merge_request_diff) do
-              %strong.monospace
-                #{merge_request_diff.head_commit.short_id}
-              %br
+            = link_to merge_request_version_path(@project, @merge_request, merge_request_diff), class: ('is-active' if merge_request_diff == @merge_request_diff) do
+              %strong
+                - if merge_request_diff.latest?
+                  latest version
+                - else
+                  version #{version_index(merge_request_diff)}
+              .monospace #{short_sha(merge_request_diff.head_commit_sha)}
               %small
                 #{number_with_delimiter(merge_request_diff.commits.count)} #{'commit'.pluralize(merge_request_diff.commits.count)},
                 = time_ago_with_tooltip(merge_request_diff.created_at)
 
-    - unless @merge_request_diff.latest?
-      %span.prepend-left-default
+    - if @merge_request_diff.base_commit_sha
+      and
+      %span.dropdown.inline.mr-version-compare-dropdown
+        %a.btn-link.dropdown-toggle{ data: {toggle: :dropdown} }
+          %strong
+            - if @start_sha
+              version #{version_index(@start_version)}
+            - else
+              #{@merge_request.target_branch}
+          %span.caret
+        %ul.dropdown-menu.dropdown-menu-selectable
+          - @comparable_diffs.each do |merge_request_diff|
+            %li
+              = link_to merge_request_version_path(@project, @merge_request, @merge_request_diff, merge_request_diff.head_commit_sha), class: ('is-active' if merge_request_diff == @start_version) do
+                %strong
+                  - if merge_request_diff.latest?
+                    latest version
+                  - else
+                    version #{version_index(merge_request_diff)}
+                .monospace #{short_sha(merge_request_diff.head_commit_sha)}
+                %small
+                  = time_ago_with_tooltip(merge_request_diff.created_at)
+          %li
+            = link_to merge_request_version_path(@project, @merge_request, @merge_request_diff), class: ('is-active' unless @start_sha) do
+              %strong
+                #{@merge_request.target_branch} (base)
+              .monospace #{short_sha(@merge_request_diff.base_commit_sha)}
+
+    - unless @merge_request_diff.latest? && !@start_sha
+      .prepend-top-10
         = icon('info-circle')
-        This version is not the latest one. Comments are disabled
-    .pull-right
-      %span.monospace
-        #{@merge_request_diff.base_commit.short_id}..#{@merge_request_diff.head_commit.short_id}
+        - if @start_sha
+          Comments are disabled because you're comparing two versions of this merge request.
+        - else
+          Comments are disabled because you're viewing an old version of this merge request.