Merge branch '393189-project-shortcuts' into 'master'

Restore project-specific shortcuts within the super sidebar

See merge request !117725



Merged-by: Frédéric Caplette <fcaplette@gitlab.com>
Approved-by: Tarun Vellishetty <tvellishetty@gitlab.com>
Approved-by: Lukas 'Eipi' Eipert <leipert@gitlab.com>
Approved-by: Rahul Chanila <rchanila@gitlab.com>
Approved-by: Frédéric Caplette <fcaplette@gitlab.com>
Reviewed-by: Kamil Trzciński <ayufan@ayufan.eu>
Reviewed-by: Niklas <mc.taucher2003@gmail.com>
Co-authored-by: Paul Gascou-Vaillancourt <paul.gascvail@gmail.com>
Co-authored-by: Niklas <mc.taucher2003@gmail.com>
Co-authored-by: Rahul Chanila <rchanila@gitlab.com>

app/assets/javascripts/behaviors/shortcuts/shortcuts_navigation.js

@@ -33,7 +33,7 @@ export default class ShortcutsNavigation extends Shortcuts {
       findAndFollowLink('.shortcuts-project-activity'),
     );
     Mousetrap.bind(keysFor(GO_TO_PROJECT_RELEASES), () =>
-      findAndFollowLink('.shortcuts-project-releases'),
+      findAndFollowLink('.shortcuts-deployments-releases'),
     );
     Mousetrap.bind(keysFor(GO_TO_PROJECT_FILES), () => findAndFollowLink('.shortcuts-tree'));
     Mousetrap.bind(keysFor(GO_TO_PROJECT_COMMITS), () => findAndFollowLink('.shortcuts-commits'));

app/assets/javascripts/super_sidebar/components/nav_item.vue

@@ -126,6 +126,7 @@ export default {
         'gl-bg-t-gray-a-08': this.isActive,
         'gl-py-2': this.isPinnable,
         'gl-py-3': !this.isPinnable,
+        [this.item.link_classes]: this.item.link_classes,
         ...this.linkClasses,
       };
     },

app/helpers/sidebars_helper.rb

@@ -90,7 +90,7 @@ def super_sidebar_context(user, group:, project:, panel:, panel_type:) # rubocop
       update_pins_url: pins_url,
       is_impersonating: impersonating?,
       stop_impersonation_path: admin_impersonation_path,
-      shortcut_links: shortcut_links
+      shortcut_links: shortcut_links(user, project: project)
     }
   end
 
@@ -340,8 +340,8 @@ def impersonating?
     !!session[:impersonator_id]
   end
 
-  def shortcut_links
-    [
+  def shortcut_links(user, project: nil)
+    shortcut_links = [
       {
         title: _('Milestones'),
         href: dashboard_milestones_path,
@@ -358,6 +358,16 @@ def shortcut_links
         css_class: 'dashboard-shortcuts-activity'
       }
     ]
+
+    if project && can?(user, :create_issue, project)
+      shortcut_links << {
+        title: _('Create a new issue'),
+        href: new_project_issue_path(project),
+        css_class: 'shortcuts-new-issue'
+      }
+    end
+
+    shortcut_links
   end
 end
 

lib/sidebars/menu_item.rb

@@ -38,7 +38,8 @@ def serialize_for_super_sidebar
         icon: sprite_icon,
         link: link,
         active_routes: active_routes,
-        pill_count: has_pill ? pill_count : nil
+        pill_count: has_pill ? pill_count : nil,
+        link_classes: container_html_options[:class]
         # Check whether support is needed for the following properties,
         # in order to get feature parity with the HAML renderer
         # https://gitlab.com/gitlab-org/gitlab/-/issues/391864

lib/sidebars/projects/menus/issues_menu.rb

@@ -113,6 +113,7 @@ def boards_menu_item
             link: project_boards_path(context.project),
             super_sidebar_parent: ::Sidebars::Projects::SuperSidebarMenus::PlanMenu,
             active_routes: { controller: :boards },
+            container_html_options: { class: 'shortcuts-issue-boards' },
             item_id: :boards
           )
         end

lib/sidebars/projects/menus/repository_menu.rb

@@ -57,6 +57,7 @@ def files_menu_item
             link: project_tree_path(context.project, context.current_ref),
             super_sidebar_parent: ::Sidebars::Projects::SuperSidebarMenus::CodeMenu,
             active_routes: { controller: %w[tree blob blame edit_tree new_tree find_file] },
+            container_html_options: { class: 'shortcuts-tree' },
             item_id: :files
           )
         end
@@ -70,7 +71,7 @@ def commits_menu_item
             super_sidebar_parent: ::Sidebars::Projects::SuperSidebarMenus::CodeMenu,
             active_routes: { controller: %w(commit commits) },
             item_id: :commits,
-            container_html_options: { id: 'js-onboarding-commits-link' }
+            container_html_options: { id: 'js-onboarding-commits-link', class: 'shortcuts-commits' }
           )
         end
 
@@ -117,6 +118,7 @@ def graphs_menu_item
             link: link,
             super_sidebar_parent: ::Sidebars::Projects::SuperSidebarMenus::CodeMenu,
             active_routes: { controller: :network },
+            container_html_options: { class: 'shortcuts-network' },
             item_id: :graphs
           )
         end

spec/frontend/super_sidebar/components/nav_item_spec.js

@@ -53,6 +53,13 @@ describe('NavItem component', () => {
     expect(findLink().attributes('class')).toContain(customClass);
   });
 
+  it('applies custom classes set in the backend', () => {
+    const customClass = 'customBackendClass';
+    createWrapper({ title: 'Foo', link_classes: customClass });
+
+    expect(findLink().attributes('class')).toContain(customClass);
+  });
+
   describe('Data Tracking Attributes', () => {
     it('adds no labels on sections', () => {
       const id = 'my-id';

spec/helpers/sidebars_helper_spec.rb

@@ -66,9 +66,10 @@
     let_it_be(:group) { build(:group) }
     let_it_be(:panel) { {} }
     let_it_be(:panel_type) { 'project' }
+    let(:project) { nil }
 
     subject do
-      helper.super_sidebar_context(user, group: group, project: nil, panel: panel, panel_type: panel_type)
+      helper.super_sidebar_context(user, group: group, project: project, panel: panel, panel_type: panel_type)
     end
 
     before do
@@ -160,6 +161,47 @@
       })
     end
 
+    describe "shortcut links" do
+      let(:global_shortcut_links) do
+        [
+          {
+            title: _('Milestones'),
+            href: dashboard_milestones_path,
+            css_class: 'dashboard-shortcuts-milestones'
+          },
+          {
+            title: _('Snippets'),
+            href: dashboard_snippets_path,
+            css_class: 'dashboard-shortcuts-snippets'
+          },
+          {
+            title: _('Activity'),
+            href: activity_dashboard_path,
+            css_class: 'dashboard-shortcuts-activity'
+          }
+        ]
+      end
+
+      it 'returns global shortcut links' do
+        expect(subject[:shortcut_links]).to eq(global_shortcut_links)
+      end
+
+      context 'in a project' do
+        let(:project) { build(:project) }
+
+        it 'returns project-specific shortcut links' do
+          expect(subject[:shortcut_links]).to eq([
+            *global_shortcut_links,
+            {
+              title: _('Create a new issue'),
+              href: new_project_issue_path(project),
+              css_class: 'shortcuts-new-issue'
+            }
+          ])
+        end
+      end
+    end
+
     it 'returns "Merge requests" menu', :use_clean_rails_memory_store_caching do
       expect(subject[:merge_request_menu]).to eq([
         {

spec/lib/sidebars/menu_item_spec.rb

@@ -18,4 +18,14 @@
       expect(menu_item.container_html_options).to eq html_options
     end
   end
+
+  describe "#serialize_for_super_sidebar" do
+    let(:html_options) { { class: 'custom-class' } }
+
+    subject { menu_item.serialize_for_super_sidebar }
+
+    it 'includes custom CSS classes' do
+      expect(subject[:link_classes]).to be('custom-class')
+    end
+  end
 end

spec/lib/sidebars/menu_spec.rb

@@ -61,7 +61,8 @@
               icon: nil,
               link: "foo2",
               is_active: true,
-              pill_count: nil
+              pill_count: nil,
+              link_classes: nil
             },
             {
               id: 'id2',
@@ -69,7 +70,8 @@
               icon: nil,
               link: "foo3",
               is_active: false,
-              pill_count: 10
+              pill_count: 10,
+              link_classes: nil
             }
           ]
         })

spec/lib/sidebars/static_menu_spec.rb

@@ -25,7 +25,8 @@
             icon: nil,
             link: "foo2",
             is_active: true,
-            pill_count: nil
+            pill_count: nil,
+            link_classes: nil
           },
           {
             id: 'id2',
@@ -33,7 +34,8 @@
             icon: nil,
             link: "foo3",
             is_active: false,
-            pill_count: nil
+            pill_count: nil,
+            link_classes: nil
           }
         ]
       )