Add context tabs to dashboard/projects

This allows users to quickly switch between all projects they have
access to & there own namespace projects. These tabs also keep
the same filtering/search options selected so the user can quickly
switch between the two different contexts.

Closes #29045

5 files changed, 50 insertions, 0 deletions

diff --git a/app/views/dashboard/projects/_nav.html.haml b/app/views/dashboard/projects/_nav.html.haml
new file mode 100644
index 00000000000..697211d7ce8
--- /dev/null
+++ b/app/views/dashboard/projects/_nav.html.haml
@@ -0,0 +1,8 @@
+.top-area
+  %ul.nav-links
+    = nav_link(html_options: { class: ("active" unless params[:personal].present?) }) do
+      = link_to dashboard_projects_path do
+        #{ s_('DashboardProjects|All') }
+    = nav_link(html_options: { class: ("active" if params[:personal].present?) }) do
+      = link_to filter_projects_path(personal: true) do
+        #{ s_('DashboardProjects|Personal') }
diff --git a/app/views/dashboard/projects/index.html.haml b/app/views/dashboard/projects/index.html.haml
index a4dc49d2120..985871a888c 100644
--- a/app/views/dashboard/projects/index.html.haml
+++ b/app/views/dashboard/projects/index.html.haml
@@ -12,6 +12,7 @@
 %div{ class: container_class }
   - if has_projects_or_name?(@projects, params)
     = render 'dashboard/projects_head'
+    = render 'nav'
     = render 'projects'
   - else
     = render "zero_authorized_projects"
diff --git a/changelogs/unreleased/project-page-clearer.yml b/changelogs/unreleased/project-page-clearer.yml
new file mode 100644
index 00000000000..7db01373360
--- /dev/null
+++ b/changelogs/unreleased/project-page-clearer.yml
@@ -0,0 +1,5 @@
+---
+title: Added tabs to dashboard/projects to easily switch to personal projects
+merge_request:
+author:
+type: added
diff --git a/spec/features/dashboard/projects_spec.rb b/spec/features/dashboard/projects_spec.rb
index 9a7b8e3ba6b..4da95ccc169 100644
--- a/spec/features/dashboard/projects_spec.rb
+++ b/spec/features/dashboard/projects_spec.rb
@@ -50,6 +50,25 @@ feature 'Dashboard Projects' do
     end
   end
 
+  context 'when on Your projects tab' do
+    it 'shows all projects by default' do
+      visit dashboard_projects_path
+
+      expect(page).to have_content(project.name)
+    end
+
+    it 'shows personal projects on personal projects tab', :js do
+      project3 = create(:project, namespace: user.namespace)
+
+      visit dashboard_projects_path
+
+      click_link 'Personal'
+
+      expect(page).not_to have_content(project.name)
+      expect(page).to have_content(project3.name)
+    end
+  end
+
   context 'when on Starred projects tab' do
     it 'shows only starred projects' do
       user.toggle_star(project2)
diff --git a/spec/views/dashboard/projects/_nav.html.haml.rb b/spec/views/dashboard/projects/_nav.html.haml.rb
new file mode 100644
index 00000000000..f6a8ca13040
--- /dev/null
+++ b/spec/views/dashboard/projects/_nav.html.haml.rb
@@ -0,0 +1,17 @@
+require 'spec_helper'
+
+describe 'dashboard/projects/_nav.html.haml' do
+  it 'highlights All tab by default' do
+    render
+
+    expect(rendered).to have_css('li.active a', text: 'All')
+  end
+
+  it 'highlights Personal tab personal param is present' do
+    controller.params[:personal] = true
+
+    render
+
+    expect(rendered).to have_css('li.active a', text: 'Personal')
+  end
+end