Merge branch 'top-navigation-concept' into 'master'

Implement top navigation for profile area

Main idea is to keep left sidebar static so user is not confused by
changing context. Instead we put changing navigation with changing
content in one main block. I used profile area as a simplest way to 
implement and test this concept. Your feedback is welcome in comments

For https://gitlab.com/gitlab-org/gitlab-ce/issues/14354#note_4878536


Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>

See merge request !3824

16 files changed, 30 insertions, 24 deletions

diff --git a/app/helpers/page_layout_helper.rb b/app/helpers/page_layout_helper.rb
index 82f805fa444..e4e8b934bc8 100644
--- a/app/helpers/page_layout_helper.rb
+++ b/app/helpers/page_layout_helper.rb
@@ -84,6 +84,14 @@ module PageLayoutHelper
     end
   end
 
+  def nav(name = nil)
+    if name
+      @nav = name
+    else
+      @nav
+    end
+  end
+
   def fluid_layout(enabled = false)
     if @fluid_layout.nil?
       @fluid_layout = (current_user && current_user.layout == "fluid") || enabled
diff --git a/app/helpers/tab_helper.rb b/app/helpers/tab_helper.rb
index 04e53fe7c61..96a83671009 100644
--- a/app/helpers/tab_helper.rb
+++ b/app/helpers/tab_helper.rb
@@ -110,4 +110,12 @@ module TabHelper
       'active'
     end
   end
+
+  def profile_tab_class
+    if controller.controller_path =~ /\Aprofiles/
+      return 'active'
+    end
+
+    'active' if current_controller?('oauth/applications')
+  end
 end
diff --git a/app/views/doorkeeper/applications/index.html.haml b/app/views/doorkeeper/applications/index.html.haml
index 0aff79749ef..79df17ba612 100644
--- a/app/views/doorkeeper/applications/index.html.haml
+++ b/app/views/doorkeeper/applications/index.html.haml
@@ -1,5 +1,4 @@
 - page_title "Applications"
-- header_title page_title, applications_profile_path
 
 .row.prepend-top-default
   .col-lg-3.profile-settings-sidebar
diff --git a/app/views/layouts/_page.html.haml b/app/views/layouts/_page.html.haml
index c799e9c588d..ca9c2a0bf2e 100644
--- a/app/views/layouts/_page.html.haml
+++ b/app/views/layouts/_page.html.haml
@@ -25,6 +25,10 @@
   .content-wrapper
     = render "layouts/flash"
     = yield :flash_message
+    - if defined?(nav) && nav
+      .layout-nav
+        %div{ class: container_class }
+          = render "layouts/nav/#{nav}"
     %div{ class: (container_class unless @no_container) }
       .content
         .clearfix
diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml
index babfb032236..e4d1c773d03 100644
--- a/app/views/layouts/application.html.haml
+++ b/app/views/layouts/application.html.haml
@@ -6,6 +6,6 @@
     = yield :scripts_body_top
 
     = render "layouts/header/default", title: header_title
-    = render 'layouts/page', sidebar: sidebar
+    = render 'layouts/page', sidebar: sidebar, nav: nav
 
     = yield :scripts_body
diff --git a/app/views/layouts/nav/_dashboard.html.haml b/app/views/layouts/nav/_dashboard.html.haml
index 5cef652da14..ca49c313ff7 100644
--- a/app/views/layouts/nav/_dashboard.html.haml
+++ b/app/views/layouts/nav/_dashboard.html.haml
@@ -48,8 +48,7 @@
       %span
         Help
 
-  %li.separate-item
-  = nav_link(controller: :profile) do
+  = nav_link(html_options: {class: profile_tab_class}) do
     = link_to profile_path, title: 'Profile Settings', data: {placement: 'bottom'} do
       = icon('user fw')
       %span
diff --git a/app/views/layouts/nav/_profile.html.haml b/app/views/layouts/nav/_profile.html.haml
index 3b9d31a6fc5..d730840d63a 100644
--- a/app/views/layouts/nav/_profile.html.haml
+++ b/app/views/layouts/nav/_profile.html.haml
@@ -1,17 +1,9 @@
-%ul.nav.nav-sidebar
-  = nav_link do
-    = link_to root_path, title: 'Go to dashboard', class: 'back-link' do
-      = icon('caret-square-o-left fw')
-      %span
-        Go to dashboard
-
-  %li.separate-item
-
+%ul.nav-links
   = nav_link(path: 'profiles#show', html_options: {class: 'home'}) do
     = link_to profile_path, title: 'Profile Settings' do
       = icon('user fw')
       %span
-        Profile Settings
+        Profile
   = nav_link(controller: [:accounts, :two_factor_auths]) do
     = link_to profile_account_path, title: 'Account' do
       = icon('gear fw')
@@ -27,7 +19,6 @@
       = icon('envelope-o fw')
       %span
         Emails
-        %span.count= number_with_delimiter(current_user.emails.count + 1)
   - unless current_user.ldap_user?
     = nav_link(controller: :passwords) do
       = link_to edit_profile_password_path, title: 'Password' do
@@ -45,7 +36,6 @@
       = icon('key fw')
       %span
         SSH Keys
-        %span.count= number_with_delimiter(current_user.keys.count)
   = nav_link(controller: :preferences) do
     = link_to profile_preferences_path, title: 'Preferences' do
       -# TODO (rspeicher): Better icon?
diff --git a/app/views/layouts/profile.html.haml b/app/views/layouts/profile.html.haml
index dfa6cc5702e..b77d3402a2e 100644
--- a/app/views/layouts/profile.html.haml
+++ b/app/views/layouts/profile.html.haml
@@ -1,5 +1,6 @@
 - page_title    "Profile Settings"
 - header_title  "Profile Settings", profile_path unless header_title
-- sidebar       "profile"
+- sidebar       "dashboard"
+- nav           "profile"
 
 = render template: "layouts/application"
diff --git a/app/views/profiles/accounts/show.html.haml b/app/views/profiles/accounts/show.html.haml
index 6efd119f260..afd3d79321f 100644
--- a/app/views/profiles/accounts/show.html.haml
+++ b/app/views/profiles/accounts/show.html.haml
@@ -1,5 +1,4 @@
 - page_title "Account"
-- header_title page_title, profile_account_path
 
 - if current_user.ldap_user?
   .alert.alert-info
diff --git a/app/views/profiles/audit_log.html.haml b/app/views/profiles/audit_log.html.haml
index f630c03e5f6..9c404b6935f 100644
--- a/app/views/profiles/audit_log.html.haml
+++ b/app/views/profiles/audit_log.html.haml
@@ -1,5 +1,4 @@
 - page_title "Audit Log"
-- header_title page_title, audit_log_profile_path
 
 .row.prepend-top-default
   .col-lg-3.profile-settings-sidebar
diff --git a/app/views/profiles/emails/index.html.haml b/app/views/profiles/emails/index.html.haml
index 3f328f96cea..57527361eb6 100644
--- a/app/views/profiles/emails/index.html.haml
+++ b/app/views/profiles/emails/index.html.haml
@@ -1,5 +1,4 @@
 - page_title "Emails"
-- header_title page_title, profile_emails_path
 
 .row.prepend-top-default
   .col-lg-3.profile-settings-sidebar
diff --git a/app/views/profiles/keys/index.html.haml b/app/views/profiles/keys/index.html.haml
index e0f8c9a5733..6a067a03535 100644
--- a/app/views/profiles/keys/index.html.haml
+++ b/app/views/profiles/keys/index.html.haml
@@ -1,5 +1,4 @@
 - page_title "SSH Keys"
-- header_title page_title, profile_keys_path
 
 .row.prepend-top-default
   .col-lg-3.profile-settings-sidebar
diff --git a/app/views/profiles/notifications/show.html.haml b/app/views/profiles/notifications/show.html.haml
index a2a505c082b..7696f112bb3 100644
--- a/app/views/profiles/notifications/show.html.haml
+++ b/app/views/profiles/notifications/show.html.haml
@@ -1,5 +1,4 @@
 - page_title "Notifications"
-- header_title page_title, profile_notifications_path
 
 %div
   - if @user.errors.any?
diff --git a/app/views/profiles/passwords/edit.html.haml b/app/views/profiles/passwords/edit.html.haml
index 5ac8a8b9d09..243428b690e 100644
--- a/app/views/profiles/passwords/edit.html.haml
+++ b/app/views/profiles/passwords/edit.html.haml
@@ -1,5 +1,4 @@
 - page_title "Password"
-- header_title page_title, edit_profile_password_path
 
 .row.prepend-top-default
   .col-lg-3.profile-settings-sidebar
diff --git a/app/views/profiles/preferences/show.html.haml b/app/views/profiles/preferences/show.html.haml
index f80211669fb..bfe53be6854 100644
--- a/app/views/profiles/preferences/show.html.haml
+++ b/app/views/profiles/preferences/show.html.haml
@@ -1,5 +1,4 @@
 - page_title 'Preferences'
-- header_title page_title, profile_preferences_path
 
 = form_for @user, url: profile_preferences_path, remote: true, method: :put, html: {class: 'row prepend-top-default js-preferences-form'} do |f|
   .col-lg-3.profile-settings-sidebar
diff --git a/features/steps/profile/active_tab.rb b/features/steps/profile/active_tab.rb
index 4724a326277..3b59089a093 100644
--- a/features/steps/profile/active_tab.rb
+++ b/features/steps/profile/active_tab.rb
@@ -22,4 +22,8 @@ class Spinach::Features::ProfileActiveTab < Spinach::FeatureSteps
   step 'the active main tab should be Audit Log' do
     ensure_active_main_tab('Audit Log')
   end
+
+  def ensure_active_main_tab(content)
+    expect(find('.layout-nav li.active')).to have_content(content)
+  end
 end