Merge branch 'top-menu-improvements' into 'master'

Navigation improvements

- [x] make explore area as part of dashboard
- [x] move navigation links from top right corner to sidebar
- [x] group navigation items on dashboard
- [x] cleanup UI after such changes
- [ ] fix tests

cc @sytses @JobV

See merge request !1177

app/assets/stylesheets/generic/common.scss

@@ -373,3 +373,23 @@ table {
     border-color: #EEE !important;
   }
 }
+
+.center-top-menu {
+  border-bottom: 1px solid #EEE;
+  list-style: none;
+  text-align: center;
+  padding-bottom: 15px;
+  margin-bottom: 15px;
+
+  li {
+    display: inline-block;
+
+    a {
+      padding: 10px;
+    }
+
+    &.active a {
+      color: #666;
+    }
+  }
+}

app/assets/stylesheets/pages/explore.scss

@@ -6,3 +6,11 @@
     font-size: 30px;
   }
 }
+
+.explore-trending-block {
+  .lead {
+    line-height: 32px;
+    font-size: 18px;
+    margin-top: 10px;
+  }
+}

app/helpers/explore_helper.rb

@@ -10,7 +10,7 @@ module ExploreHelper
 
     options = exist_opts.merge(options)
 
-    path = request.path
+    path = explore_projects_path
     path << "?#{options.to_param}"
     path
   end

app/helpers/tab_helper.rb

@@ -67,6 +67,14 @@ module TabHelper
       path.any? do |single_path|
         current_path?(single_path)
       end
+    elsif page = options.delete(:page)
+      unless page.respond_to?(:each)
+        page = [page]
+      end
+
+      page.any? do |single_page|
+        current_page?(single_page)
+      end
     else
       c = options.delete(:controller)
       a = options.delete(:action)

app/views/dashboard/_groups_head.html.haml

+%ul.center-top-menu
+  = nav_link(page: [dashboard_groups_path]) do
+    = link_to dashboard_groups_path, title: 'Your groups', data: {placement: 'right'} do
+      Your Groups
+  = nav_link(page: [explore_groups_path]) do
+    = link_to explore_groups_path, title: 'Explore groups', data: {toggle: 'tooltip', placement: 'bottom'} do
+      Explore Groups

app/views/dashboard/_projects_head.html.haml

+%ul.center-top-menu
+  = nav_link(path: ['dashboard#show', 'root#show']) do
+    = link_to dashboard_path, title: 'Home', class: 'shortcuts-activity', data: {placement: 'right'} do
+      Your Projects
+  = nav_link(page: starred_dashboard_projects_path) do
+    = link_to starred_dashboard_projects_path, title: 'Starred Projects', data: {placement: 'right'} do
+      Starred Projects
+  = nav_link(page: [explore_root_path, trending_explore_projects_path, starred_explore_projects_path, explore_projects_path]) do
+    = link_to explore_root_path, title: 'Explore', data: {toggle: 'tooltip', placement: 'bottom'} do
+      Explore Projects

app/views/dashboard/groups/index.html.haml

 - page_title "Groups"
-%h3.page-title
-  Group Membership
+= render 'dashboard/groups_head'
+
+.slead
+  Group members have access to all group projects.
   - if current_user.can_create_group?
     %span.pull-right.hidden-xs
-      = link_to new_group_path, class: "btn btn-new" do
+      = link_to new_group_path, class: "btn btn-new btn-sm" do
         %i.fa.fa-plus
         New Group
-%p.light
-  Group members have access to all group projects.
-%hr
 .panel.panel-default
   .panel-heading
     %strong Groups

app/views/dashboard/projects/starred.html.haml

 - page_title "Starred Projects"
+= render 'dashboard/projects_head'
+
 - if @projects.any?
   = render 'shared/show_aside'
 

app/views/dashboard/show.html.haml

@@ -2,6 +2,8 @@
   - if current_user
     = auto_discovery_link_tag(:atom, dashboard_url(format: :atom, private_token: current_user.private_token), title: "All activity")
 
+= render 'dashboard/projects_head'
+
 - if @projects.any?
   = render 'shared/show_aside'
 

app/views/explore/groups/index.html.haml

 - page_title "Groups"
-.clearfix
+- if current_user
+  = render 'dashboard/groups_head'
+.clearfix.append-bottom-10
   .pull-left
     = form_tag explore_groups_path, method: :get, class: 'form-inline form-tiny' do |f|
       = hidden_field_tag :sort, @sort
@@ -28,15 +30,12 @@
           = link_to explore_groups_path(sort: sort_value_oldest_updated) do
             = sort_title_oldest_updated
 
-%hr
-
 %ul.bordered-list
   - @groups.each do |group|
     %li
       .clearfix
         %h4
           = link_to group_path(id: group.path) do
-            %i.fa.fa-users
             = group.name
       .clearfix
         %p

app/views/explore/projects/_dropdown.html.haml

+.dropdown.inline
+  %button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}
+    %span.light sort:
+    - if @sort.present?
+      = sort_options_hash[@sort]
+    - elsif current_page?(trending_explore_projects_path) || current_page?(explore_root_path)
+      Trending projects
+    - elsif current_page?(starred_explore_projects_path)
+      Most stars
+    - else
+      = sort_title_recently_created
+    %b.caret
+  %ul.dropdown-menu
+    %li
+      = link_to trending_explore_projects_path do
+        Trending projects
+      = link_to starred_explore_projects_path do
+        Most stars
+      = link_to explore_projects_filter_path(sort: sort_value_recently_created) do
+        = sort_title_recently_created
+      = link_to explore_projects_filter_path(sort: sort_value_oldest_created) do
+        = sort_title_oldest_created
+      = link_to explore_projects_filter_path(sort: sort_value_recently_updated) do
+        = sort_title_recently_updated
+      = link_to explore_projects_filter_path(sort: sort_value_oldest_updated) do
+        = sort_title_oldest_updated
+

app/views/explore/projects/_filter.html.haml

@@ -46,22 +46,4 @@
             = link_to explore_projects_filter_path(tag: tag.name) do
               %i.fa.fa-tag
               = tag.name
-
-  .dropdown.inline
-    %button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}
-      %span.light sort:
-      - if @sort.present?
-        = sort_options_hash[@sort]
-      - else
-        = sort_title_recently_created
-      %b.caret
-    %ul.dropdown-menu
-      %li
-        = link_to explore_projects_filter_path(sort: sort_value_recently_created) do
-          = sort_title_recently_created
-        = link_to explore_projects_filter_path(sort: sort_value_oldest_created) do
-          = sort_title_oldest_created
-        = link_to explore_projects_filter_path(sort: sort_value_recently_updated) do
-          = sort_title_recently_updated
-        = link_to explore_projects_filter_path(sort: sort_value_oldest_updated) do
-          = sort_title_oldest_updated
+  = render 'explore/projects/dropdown'

app/views/explore/projects/index.html.haml

 - page_title "Projects"
+- if current_user
+  = render 'dashboard/projects_head'
 .clearfix
   = render 'filter'
-
-%hr
+%br
 .public-projects
   %ul.bordered-list.top-list
     = render @projects

app/views/explore/projects/starred.html.haml

 - page_title "Starred Projects"
+- if current_user
+  = render 'dashboard/projects_head'
 .explore-trending-block
-  %p.lead
+  .lead
     %i.fa.fa-star
     See most starred projects
-  %hr
+    .pull-right
+      = render 'explore/projects/dropdown'
   .public-projects
     %ul.bordered-list
       = render @starred_projects

app/views/explore/projects/trending.html.haml

 - page_title "Trending Projects"
+- if current_user
+  = render 'dashboard/projects_head'
 .explore-title
   %h3
     Explore GitLab
@@ -6,10 +8,11 @@
     Discover projects and groups. Share your projects with others
 %hr
 .explore-trending-block
-  %p.lead
+  .lead
     %i.fa.fa-comments-o
     See most discussed projects for last month
-  %hr
+    .pull-right
+      = render 'explore/projects/dropdown'
   .public-projects
     %ul.bordered-list
       = render @trending_projects

app/views/layouts/explore.html.haml

 - page_title    "Explore"
-- header_title  "Explore GitLab", explore_root_path
-- sidebar       "explore"
+- if current_user
+  - header_title  "Dashboard", root_path
+- else
+  - header_title  "Explore GitLab", explore_root_path
+- sidebar       "dashboard"
 
 = render template: "layouts/application"

app/views/layouts/header/_default.html.haml

@@ -17,13 +17,13 @@
           %li.visible-sm.visible-xs
             = link_to search_path, title: 'Search', data: {toggle: 'tooltip', placement: 'bottom'} do
               = icon('search')
-          %li.hidden-xs
+          -#%li.hidden-xs
             = link_to help_path, title: 'Help', data: {toggle: 'tooltip', placement: 'bottom'} do
               = icon('question-circle fw')
-          %li
+          -#%li
             = link_to explore_root_path, title: 'Explore', data: {toggle: 'tooltip', placement: 'bottom'} do
               = icon('globe fw')
-          %li
+          -#%li
             = link_to user_snippets_path(current_user), title: 'Your snippets', data: {toggle: 'tooltip', placement: 'bottom'} do
               = icon('clipboard fw')
           - if current_user.is_admin?
@@ -34,7 +34,7 @@
             %li.hidden-xs
               = link_to new_project_path, title: 'New project', data: {toggle: 'tooltip', placement: 'bottom'} do
                 = icon('plus fw')
-          %li
+          -#%li
             = link_to profile_path, title: 'Profile settings', data: {toggle: 'tooltip', placement: 'bottom'} do
               = icon('cog fw')
           %li

app/views/layouts/nav/_dashboard.html.haml

 %ul.nav.nav-sidebar
-  = nav_link(path: ['dashboard#show', 'root#show'], html_options: {class: 'home'}) do
-    = link_to dashboard_path, title: 'Home', class: 'shortcuts-activity', data: {placement: 'right'} do
+  = nav_link(path: ['dashboard#show', 'root#show', 'projects#trending', 'projects#starred', 'projects#index'], html_options: {class: 'home'}) do
+    = link_to (current_user ? root_path : explore_root_path), title: 'Home', class: 'shortcuts-activity', data: {placement: 'right'} do
       = icon('dashboard fw')
       %span
-        Your Projects
-  = nav_link(path: 'projects#starred') do
-    = link_to starred_dashboard_projects_path, title: 'Starred Projects', data: {placement: 'right'} do
-      = icon('star fw')
-      %span
-        Starred Projects
+        Projects
   = nav_link(controller: :groups) do
-    = link_to dashboard_groups_path, title: 'Groups', data: {placement: 'right'} do
+    = link_to (current_user ? dashboard_groups_path : explore_groups_path), title: 'Groups', data: {placement: 'right'} do
       = icon('group fw')
       %span
         Groups
-  = nav_link(controller: :milestones) do
-    = link_to dashboard_milestones_path, title: 'Milestones', data: {placement: 'right'} do
-      = icon('clock-o fw')
-      %span
-        Milestones
-  = nav_link(path: 'dashboard#issues') do
-    = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'shortcuts-issues', data: {placement: 'right'} do
-      = icon('exclamation-circle fw')
-      %span
-        Issues
-        %span.count= current_user.assigned_issues.opened.count
-  = nav_link(path: 'dashboard#merge_requests') do
-    = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'shortcuts-merge_requests', data: {placement: 'right'} do
-      = icon('tasks fw')
+  - if current_user
+    = nav_link(controller: :milestones) do
+      = link_to dashboard_milestones_path, title: 'Milestones', data: {placement: 'right'} do
+        = icon('clock-o fw')
+        %span
+          Milestones
+    = nav_link(path: 'dashboard#issues') do
+      = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'shortcuts-issues', data: {placement: 'right'} do
+        = icon('exclamation-circle fw')
+        %span
+          Issues
+          %span.count= current_user.assigned_issues.opened.count
+    = nav_link(path: 'dashboard#merge_requests') do
+      = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'shortcuts-merge_requests', data: {placement: 'right'} do
+        = icon('tasks fw')
+        %span
+          Merge Requests
+          %span.count= current_user.assigned_merge_requests.opened.count
+  = nav_link(controller: :snippets) do
+    = link_to (current_user ? user_snippets_path(current_user) : snippets_path), title: 'Your snippets', data: {placement: 'right'} do
+      = icon('dashboard fw')
       %span
-        Merge Requests
-        %span.count= current_user.assigned_merge_requests.opened.count
+        Snippets
+  - if current_user
+    = nav_link(controller: :profile) do
+      = link_to profile_path, title: 'Profile settings', data: {toggle: 'tooltip', placement: 'bottom'} do
+        = icon('user fw')
+        %span
+          Profile
   = nav_link(controller: :help) do
     = link_to help_path, title: 'Help', data: {placement: 'right'} do
       = icon('question-circle fw')

app/views/layouts/nav/_explore.html.haml

-%ul.nav.nav-sidebar
-  = nav_link(path: 'projects#trending') do
-    = link_to explore_root_path, title: 'Trending Projects', data: {placement: 'right'} do
-      = icon('comments fw')
-      %span Trending Projects
-  = nav_link(path: 'projects#starred') do
-    = link_to starred_explore_projects_path, title: 'Most-starred Projects', data: {placement: 'right'} do
-      = icon('star fw')
-      %span Most-starred Projects
-  = nav_link(path: 'projects#index') do
-    = link_to explore_projects_path, title: 'All Projects', data: {placement: 'right'} do
-      = icon('bookmark fw')
-      %span All Projects
-  = nav_link(controller: :groups) do
-    = link_to explore_groups_path, title: 'All Groups', data: {placement: 'right'} do
-      = icon('group fw')
-      %span All Groups
-

app/views/layouts/nav/_snippets.html.haml

-%ul.nav.nav-sidebar
-  - if current_user
-    = nav_link(path: user_snippets_path(current_user), html_options: {class: 'home'}) do
-      = link_to user_snippets_path(current_user), title: 'Your snippets', data: {placement: 'right'} do
-        = icon('dashboard fw')
-        %span
-          Your Snippets
-  = nav_link(path: snippets_path) do
-    = link_to snippets_path, title: 'Discover snippets', data: {placement: 'right'} do
-      = icon('globe fw')
-      %span
-        Discover Snippets

app/views/layouts/snippets.html.haml

 - page_title    'Snippets'
-- header_title  'Snippets', snippets_path
-- sidebar       "snippets"
+- if current_user
+  - header_title  "Dashboard", root_path
+- else
+  - header_title  'Snippets', snippets_path
+- sidebar       "dashboard"
 
 = render template: "layouts/application"

app/views/snippets/_head.html.haml

+%ul.center-top-menu
+  = nav_link(page: user_snippets_path(current_user), html_options: {class: 'home'}) do
+    = link_to user_snippets_path(current_user), title: 'Your snippets', data: {placement: 'right'} do
+      Your Snippets
+  = nav_link(page: snippets_path) do
+    = link_to snippets_path, title: 'Explore snippets', data: {placement: 'right'} do
+      Explore Snippets

app/views/snippets/current_user_index.html.haml

 - page_title "Your Snippets"
-%h3.page-title
-  Your Snippets
-  .pull-right
-    = link_to new_snippet_path, class: "btn btn-new btn-grouped", title: "New Snippet" do
-      Add new snippet
+= render 'head'
 
-%p.light
+.slead
   Share code pastes with others out of git repository
 
+  .pull-right
+    = link_to new_snippet_path, class: "btn btn-new btn-sm", title: "New Snippet" do
+      Add new snippet
+
 %ul.nav.nav-tabs
   = nav_tab :scope, nil do
     = link_to user_snippets_path(@user) do

app/views/snippets/index.html.haml

 - page_title "Public Snippets"
-%h3.page-title
-  Public snippets
+- if current_user
+  = render 'head'
 
-  .pull-right
-    - if current_user
-      = link_to new_snippet_path, class: "btn btn-new btn-grouped", title: "New Snippet" do
-        Add new snippet
-      = link_to user_snippets_path(current_user), class: "btn btn-grouped"  do
-        Your snippets
-
-%p.light
+.slead
   Public snippets created by you and other users are listed here
 
-%hr
 = render 'snippets'
 

app/views/snippets/show.html.haml

 - page_title @snippet.title, "Snippets"
-%h3.page-title
+%h4.page-title
   = @snippet.title
 
   - if @snippet.private?
@@ -8,17 +8,14 @@
       private
 
   .pull-right
-    = link_to new_snippet_path, class: "btn btn-new", title: "New Snippet" do
+    = link_to new_snippet_path, class: "btn btn-new btn-sm", title: "New Snippet" do
       Add new snippet
-%hr
 
-.append-bottom-20
+.append-bottom-10.prepend-top-10
   .pull-right
-    = "##{@snippet.id}"
     %span.light
-      by
+      created by
       = link_to user_snippets_path(@snippet.author) do
-        = image_tag avatar_icon(@snippet.author_email), class: "avatar avatar-inline s16", alt: ''
         = @snippet.author_name
 
   .back-link
@@ -27,7 +24,7 @@
         ← your snippets
     - else
       = link_to snippets_path do
-        ← discover snippets
+        ← explore snippets
 
 .file-holder
   .file-title

app/views/snippets/user_index.html.haml

 - page_title "Snippets", @user.name
-%h3.page-title
-  = image_tag avatar_icon(@user.email), class: "avatar s24"
-  = @user.name
-  %span
-    \/
-    Snippets
-  - if current_user
-    = link_to new_snippet_path, class: "btn btn-sm add_new pull-right", title: "New Snippet" do
-      Add new snippet
 
-%hr
+%ol.breadcrumb
+  %li
+    = link_to snippets_path do
+      Snippets
+  %li
+    = @user.name
+  .pull-right.hidden-xs
+    = link_to user_path(@user) do
+      #{@user.name} profile page
 
 = render 'snippets'

features/steps/shared/active_tab.rb

@@ -26,7 +26,7 @@ module SharedActiveTab
   end
 
   step 'the active main tab should be Home' do
-    ensure_active_main_tab('Your Projects')
+    ensure_active_main_tab('Projects')
   end
 
   step 'the active main tab should be Projects' do