Merge branch 'experimental-top-nav' into 'master'

Top navigation redesign

Closes #34022, #34035, #34037, #34038, and #34021

See merge request !12214

3 files changed, 102 insertions, 2 deletions

diff --git a/app/views/layouts/header/_default.html.haml b/app/views/layouts/header/_default.html.haml
index 249253f4906..f056c0af968 100644
--- a/app/views/layouts/header/_default.html.haml
+++ b/app/views/layouts/header/_default.html.haml
@@ -74,6 +74,9 @@
                     = link_to "Profile", current_user, class: 'profile-link', data: { user: current_user.username }
                   %li
                     = link_to "Settings", profile_path
+                  - if can_toggle_new_nav?
+                    %li
+                      = link_to "Turn on new nav", profile_preferences_path(anchor: "new-navigation")
                   %li.divider
                   %li
                     = link_to "Sign out", destroy_user_session_path, method: :delete, class: "sign-out-link"
diff --git a/app/views/layouts/header/_new.html.haml b/app/views/layouts/header/_new.html.haml
new file mode 100644
index 00000000000..c0833c64911
--- /dev/null
+++ b/app/views/layouts/header/_new.html.haml
@@ -0,0 +1,93 @@
+%header.navbar.navbar-gitlab.navbar-gitlab-new{ class: nav_header_class }
+  %a.sr-only.gl-accessibility{ href: "#content-body", tabindex: "1" } Skip to content
+  .container-fluid
+    .header-content
+      .title-container
+        %h1.title
+          = link_to root_path, title: 'Dashboard' do
+            = brand_header_logo
+            %span.hidden-xs
+              GitLab
+
+        - if current_user
+          = render "layouts/nav/new_dashboard"
+        - else
+          = render "layouts/nav/new_explore"
+
+      .navbar-collapse.collapse
+        %ul.nav.navbar-nav
+          %li.hidden-sm.hidden-xs
+            = render 'layouts/search' unless current_controller?(:search)
+          %li.visible-sm-inline-block.visible-xs-inline-block
+            = link_to search_path, title: 'Search', aria: { label: "Search" }, data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
+              = icon('search')
+          - if current_user
+            - if session[:impersonator_id]
+              %li.impersonation
+                = link_to admin_impersonation_path, method: :delete, title: "Stop impersonation", aria: { label: 'Stop impersonation' }, data: { toggle: 'tooltip', placement: 'bottom', container: 'body' } do
+                  = icon('user-secret fw')
+            - if current_user.admin?
+              %li
+                = link_to admin_root_path, title: 'Admin area', aria: { label: "Admin area" }, data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
+                  = icon('wrench fw')
+            = render 'layouts/header/new_dropdown'
+            - if Gitlab::Sherlock.enabled?
+              %li
+                = link_to sherlock_transactions_path, title: 'Sherlock Transactions',
+                  data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
+                  = icon('tachometer fw')
+            %li
+              = link_to assigned_issues_dashboard_path, title: 'Issues', aria: { label: "Issues" }, data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
+                = icon('hashtag fw')
+                - issues_count = assigned_issuables_count(:issues)
+                %span.badge.issues-count{ class: ('hidden' if issues_count.zero?) }
+                  = number_with_delimiter(issues_count)
+            %li
+              = link_to assigned_mrs_dashboard_path, title: 'Merge requests', aria: { label: "Merge requests" }, data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
+                = custom_icon('mr_bold')
+                - merge_requests_count = assigned_issuables_count(:merge_requests)
+                %span.badge.merge-requests-count{ class: ('hidden' if merge_requests_count.zero?) }
+                  = number_with_delimiter(merge_requests_count)
+            %li
+              = link_to dashboard_todos_path, title: 'Todos', aria: { label: "Todos" }, class: 'shortcuts-todos', data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
+                = icon('check-circle fw')
+                %span.badge.todos-count{ class: ('hidden' if todos_pending_count.zero?) }
+                  = todos_count_format(todos_pending_count)
+            %li.header-user.dropdown
+              = link_to current_user, class: "header-user-dropdown-toggle", data: { toggle: "dropdown" } do
+                = image_tag avatar_icon(current_user, 26), width: 26, height: 26, class: "header-user-avatar"
+                = icon('chevron-down')
+              .dropdown-menu-nav.dropdown-menu-align-right
+                %ul
+                  %li.current-user
+                    .user-name.bold
+                      = current_user.name
+                    @#{current_user.username}
+                  %li.divider
+                  %li
+                    = link_to "Profile", current_user, class: 'profile-link', data: { user: current_user.username }
+                  %li
+                    = link_to "Settings", profile_path
+                  %li
+                    = link_to "Turn off new nav", profile_preferences_path(anchor: "new-navigation")
+                  %li.divider
+                  %li
+                    = link_to "Sign out", destroy_user_session_path, method: :delete, class: "sign-out-link"
+          - else
+            %li
+              %div
+                = link_to "Sign in", new_session_path(:user, redirect_to_referer: 'yes'), class: 'btn btn-sign-in btn-success'
+
+      %button.navbar-toggle.hidden-sm.hidden-md.hidden-lg{ type: 'button' }
+        %span.sr-only Toggle navigation
+        = icon('ellipsis-v', class: 'js-navbar-toggle-right')
+        = icon('times', class: 'js-navbar-toggle-left', style: 'display: none;')
+
+      = yield :header_content
+
+= render 'shared/outdated_browser'
+
+- if @project && !@project.empty_repo?
+  - if ref = @ref || @project.repository.root_ref
+    :javascript
+      var findFileURL = "#{namespace_project_find_file_path(@project.namespace, @project, ref)}";
diff --git a/app/views/layouts/header/_new_dropdown.haml b/app/views/layouts/header/_new_dropdown.haml
index 969c423b032..9ff1164f2ee 100644
--- a/app/views/layouts/header/_new_dropdown.haml
+++ b/app/views/layouts/header/_new_dropdown.haml
@@ -1,7 +1,11 @@
 %li.header-new.dropdown
   = link_to new_project_path, class: "header-new-dropdown-toggle has-tooltip", title: "New...", ref: 'tooltip', aria: { label: "New..." }, data: { toggle: 'dropdown', placement: 'bottom', container: 'body' } do
-    = icon('plus fw')
-    = icon('caret-down')
+    - if show_new_nav?
+      = icon('plus')
+      = icon('chevron-down')
+    - else
+      = icon('plus fw')
+      = icon('caret-down')
   .dropdown-menu-nav.dropdown-menu-align-right
     %ul
       - if @group&.persisted?