Merge branch '335484-fj-add-new-group-panel' into 'master'

Start group sidebar refactor by adding new group panel object

See merge request gitlab-org/gitlab!65719

app/helpers/sidebars_helper.rb

@@ -26,6 +26,12 @@ module SidebarsHelper
     Sidebars::Projects::Context.new(**context_data)
   end
 
+  def group_sidebar_context(group, user)
+    context_data = group_sidebar_context_data(group, user)
+
+    Sidebars::Groups::Context.new(**context_data)
+  end
+
   private
 
   def sidebar_attributes_for_object(object)
@@ -89,6 +95,13 @@ module SidebarsHelper
       show_cluster_hint: show_gke_cluster_integration_callout?(project)
     }
   end
+
+  def group_sidebar_context_data(group, user)
+    {
+      current_user: user,
+      container: group
+    }
+  end
 end
 
 SidebarsHelper.prepend_mod_with('SidebarsHelper')

app/views/layouts/nav/sidebar/_group.html.haml

-- issues_count = cached_issuables_count(@group, type: :issues)
-- merge_requests_count = cached_issuables_count(@group, type: :merge_requests)
-- aside_title = @group.subgroup? ? _('Subgroup navigation') : _('Group navigation')
-
-%aside.nav-sidebar{ class: ("sidebar-collapsed-desktop" if collapsed_sidebar?), **sidebar_tracking_attributes_by_object(@group), 'aria-label': aside_title }
-  .nav-sidebar-inner-scroll
-    %ul.sidebar-top-level-items.qa-group-sidebar
-      = nav_link(path: ['groups#show', 'groups#details'], html_options: { class: 'context-header' }) do
-        = link_to group_path(@group), title: @group.name, data: { qa_selector: 'group_scope_link' } do
-          %span{ class: ['avatar-container', 'rect-avatar', 'group-avatar' , 's32'] }
-            = group_icon(@group, class: ['avatar', 'avatar-tile', 's32'])
-          %span.sidebar-context-title
-            = @group.name
-      = render_if_exists 'layouts/nav/sidebar/group_trial_status_widget', group: @group
-
-      - if group_sidebar_link?(:overview)
-        - paths = group_overview_nav_link_paths
-        = nav_link(path: paths, unless: -> { current_path?('groups/contribution_analytics#show') }, html_options: { class: 'home' }) do
-          = link_to activity_group_path(@group), class: 'has-sub-items', data: { qa_selector: 'group_information_link' } do
-            .nav-icon-container
-              = sprite_icon('group')
-            %span.nav-item-name
-              = group_information_title(@group)
-
-          %ul.sidebar-sub-level-items{ data: { qa_selector: 'group_information_submenu'} }
-            = nav_link(path: paths, html_options: { class: "fly-out-top-item" } ) do
-              = link_to activity_group_path(@group) do
-                %strong.fly-out-top-item-name
-                  = group_information_title(@group)
-            %li.divider.fly-out-top-item
-
-            - if group_sidebar_link?(:activity)
-              = nav_link(path: 'groups#activity') do
-                = link_to activity_group_path(@group), title: _('Activity') do
-                  %span
-                    = _('Activity')
-
-            - if group_sidebar_link?(:labels)
-              = nav_link(path: 'labels#index') do
-                = link_to group_labels_path(@group), title: _('Labels') do
-                  %span
-                    = _('Labels')
-
-            - if group_sidebar_link?(:group_members)
-              = nav_link(path: 'group_members#index') do
-                = link_to group_group_members_path(@group), title: _('Members'), data: { qa_selector: 'group_members_item' } do
-                  %span
-                    = _('Members')
-
-      = render_if_exists "layouts/nav/ee/epic_link", group: @group
-
-      - if group_sidebar_link?(:issues)
-        = nav_link(path: group_issues_sub_menu_items, unless: -> { current_path?('issues_analytics#show') }) do
-          = link_to issues_group_path(@group), data: { qa_selector: 'group_issues_item' }, class: 'has-sub-items' do
-            .nav-icon-container
-              = sprite_icon('issues')
-            %span.nav-item-name
-              = _('Issues')
-            %span.badge.badge-pill.count= issues_count
-
-          %ul.sidebar-sub-level-items{ data: { qa_selector: 'group_issues_sidebar_submenu'} }
-            = nav_link(path: group_issues_sub_menu_items, html_options: { class: "fly-out-top-item" } ) do
-              = link_to issues_group_path(@group) do
-                %strong.fly-out-top-item-name
-                  = _('Issues')
-                %span.badge.badge-pill.count.issue_counter.fly-out-badge= issues_count
-
-            %li.divider.fly-out-top-item
-            = nav_link(path: 'groups#issues', html_options: { class: 'home' }) do
-              = link_to issues_group_path(@group), title: _('List') do
-                %span
-                  = _('List')
-
-            - if group_sidebar_link?(:boards)
-              = nav_link(path: ['boards#index', 'boards#show']) do
-                = link_to group_boards_path(@group), title: boards_link_text, data: { qa_selector: 'group_issue_boards_link' } do
-                  %span
-                    = boards_link_text
-
-            - if group_sidebar_link?(:milestones)
-              = nav_link(path: 'milestones#index') do
-                = link_to group_milestones_path(@group), title: _('Milestones'), data: { qa_selector: 'group_milestones_link' } do
-                  %span
-                    = _('Milestones')
-
-            = render_if_exists 'layouts/nav/sidebar/group_iterations_link'
-
-      - if group_sidebar_link?(:merge_requests)
-        = nav_link(path: 'groups#merge_requests') do
-          = link_to merge_requests_group_path(@group) do
-            .nav-icon-container
-              = sprite_icon('git-merge')
-            %span.nav-item-name
-              = _('Merge requests')
-            %span.badge.badge-pill.count= merge_requests_count
-          %ul.sidebar-sub-level-items.is-fly-out-only
-            = nav_link(path: 'groups#merge_requests', html_options: { class: "fly-out-top-item" } ) do
-              = link_to merge_requests_group_path(@group) do
-                %strong.fly-out-top-item-name
-                  = _('Merge requests')
-                %span.badge.badge-pill.count.merge_counter.js-merge-counter.fly-out-badge= merge_requests_count
-
-      = render_if_exists "layouts/nav/ee/security_link" # EE-specific
-
-      = render_if_exists "layouts/nav/ee/push_rules_link" # EE-specific
-
-      - if group_sidebar_link?(:kubernetes)
-        = nav_link(controller: [:clusters]) do
-          = link_to group_clusters_path(@group) do
-            .nav-icon-container
-              = sprite_icon('cloud-gear')
-            %span.nav-item-name
-              = _('Kubernetes')
-          %ul.sidebar-sub-level-items.is-fly-out-only
-            = nav_link(controller: [:clusters], html_options: { class: "fly-out-top-item" } ) do
-              = link_to group_clusters_path(@group), title: _('Kubernetes'), class: 'shortcuts-kubernetes' do
-                %strong.fly-out-top-item-name
-                  = _('Kubernetes')
-
-      = render 'groups/sidebar/packages'
-
-      = render 'layouts/nav/sidebar/analytics_links', links: group_analytics_navbar_links(@group, current_user)
-
-      - if group_sidebar_link?(:wiki)
-        = render 'layouts/nav/sidebar/wiki_link', wiki_url: @group.wiki.web_url
-
-      - if group_sidebar_link?(:settings)
-        = nav_link(path: group_settings_nav_link_paths) do
-          = link_to edit_group_path(@group), class: 'has-sub-items' do
-            .nav-icon-container
-              = sprite_icon('settings')
-            %span.nav-item-name{ data: { qa_selector: 'group_settings' } }
-              = _('Settings')
-          %ul.sidebar-sub-level-items.qa-group-sidebar-submenu{ data: { testid: 'group-settings-menu' } }
-            = nav_link(path: %w[groups#projects groups#edit badges#index ci_cd#show groups/applications#index], html_options: { class: "fly-out-top-item" } ) do
-              = link_to edit_group_path(@group) do
-                %strong.fly-out-top-item-name
-                  = _('Settings')
-            %li.divider.fly-out-top-item
-            = nav_link(path: 'groups#edit') do
-              = link_to edit_group_path(@group), title: _('General'), data: { qa_selector: 'general_settings_link' } do
-                %span
-                  = _('General')
-
-            = nav_link(controller: :integrations) do
-              = link_to group_settings_integrations_path(@group), title: _('Integrations') do
-                %span
-                  = _('Integrations')
-
-            = nav_link(path: 'groups#projects') do
-              = link_to projects_group_path(@group), title: _('Projects') do
-                %span
-                  = _('Projects')
-
-            = nav_link(controller: :repository) do
-              = link_to group_settings_repository_path(@group), title: _('Repository') do
-                %span
-                  = _('Repository')
-
-            = nav_link(controller: [:ci_cd, 'groups/runners']) do
-              = link_to group_settings_ci_cd_path(@group), title: _('CI/CD') do
-                %span
-                  = _('CI/CD')
-
-            = nav_link(controller: :applications) do
-              = link_to group_settings_applications_path(@group), title: _('Applications') do
-                %span
-                  = _('Applications')
-
-            = render 'groups/sidebar/packages_settings'
-
-            = render_if_exists "groups/ee/settings_nav"
-
-        = render_if_exists "groups/ee/administration_nav"
-
-    = render 'shared/sidebar_toggle_button'
+-# We're migration the group sidebar to a logical model based structure. If you need to update
+-# any of the existing menus, you can find them in app/views/layouts/nav/sidebar/_group_menus.html.haml.
+= render partial: 'shared/nav/sidebar', object: Sidebars::Groups::Panel.new(group_sidebar_context(@group, current_user))

app/views/layouts/nav/sidebar/_group_menus.html.haml

+- issues_count = cached_issuables_count(@group, type: :issues)
+- merge_requests_count = cached_issuables_count(@group, type: :merge_requests)
+
+= render_if_exists 'layouts/nav/sidebar/group_trial_status_widget', group: @group
+
+- if group_sidebar_link?(:overview)
+  - paths = group_overview_nav_link_paths
+  = nav_link(path: paths, unless: -> { current_path?('groups/contribution_analytics#show') }, html_options: { class: 'home' }) do
+    = link_to activity_group_path(@group), class: 'has-sub-items', data: { qa_selector: 'group_information_link' } do
+      .nav-icon-container
+        = sprite_icon('group')
+      %span.nav-item-name
+        = group_information_title(@group)
+
+    %ul.sidebar-sub-level-items{ data: { qa_selector: 'group_information_submenu'} }
+      = nav_link(path: paths, html_options: { class: "fly-out-top-item" } ) do
+        = link_to activity_group_path(@group) do
+          %strong.fly-out-top-item-name
+            = group_information_title(@group)
+      %li.divider.fly-out-top-item
+
+      - if group_sidebar_link?(:activity)
+        = nav_link(path: 'groups#activity') do
+          = link_to activity_group_path(@group), title: _('Activity') do
+            %span
+              = _('Activity')
+
+      - if group_sidebar_link?(:labels)
+        = nav_link(path: 'labels#index') do
+          = link_to group_labels_path(@group), title: _('Labels') do
+            %span
+              = _('Labels')
+
+      - if group_sidebar_link?(:group_members)
+        = nav_link(path: 'group_members#index') do
+          = link_to group_group_members_path(@group), title: _('Members'), data: { qa_selector: 'group_members_item' } do
+            %span
+              = _('Members')
+
+= render_if_exists "layouts/nav/ee/epic_link", group: @group
+
+- if group_sidebar_link?(:issues)
+  = nav_link(path: group_issues_sub_menu_items, unless: -> { current_path?('issues_analytics#show') }) do
+    = link_to issues_group_path(@group), data: { qa_selector: 'group_issues_item' }, class: 'has-sub-items' do
+      .nav-icon-container
+        = sprite_icon('issues')
+      %span.nav-item-name
+        = _('Issues')
+      %span.badge.badge-pill.count= issues_count
+
+    %ul.sidebar-sub-level-items{ data: { qa_selector: 'group_issues_sidebar_submenu'} }
+      = nav_link(path: group_issues_sub_menu_items, html_options: { class: "fly-out-top-item" } ) do
+        = link_to issues_group_path(@group) do
+          %strong.fly-out-top-item-name
+            = _('Issues')
+          %span.badge.badge-pill.count.issue_counter.fly-out-badge= issues_count
+
+      %li.divider.fly-out-top-item
+      = nav_link(path: 'groups#issues', html_options: { class: 'home' }) do
+        = link_to issues_group_path(@group), title: _('List') do
+          %span
+            = _('List')
+
+      - if group_sidebar_link?(:boards)
+        = nav_link(path: ['boards#index', 'boards#show']) do
+          = link_to group_boards_path(@group), title: boards_link_text, data: { qa_selector: 'group_issue_boards_link' } do
+            %span
+              = boards_link_text
+
+      - if group_sidebar_link?(:milestones)
+        = nav_link(path: 'milestones#index') do
+          = link_to group_milestones_path(@group), title: _('Milestones'), data: { qa_selector: 'group_milestones_link' } do
+            %span
+              = _('Milestones')
+
+      = render_if_exists 'layouts/nav/sidebar/group_iterations_link'
+
+- if group_sidebar_link?(:merge_requests)
+  = nav_link(path: 'groups#merge_requests') do
+    = link_to merge_requests_group_path(@group) do
+      .nav-icon-container
+        = sprite_icon('git-merge')
+      %span.nav-item-name
+        = _('Merge requests')
+      %span.badge.badge-pill.count= merge_requests_count
+    %ul.sidebar-sub-level-items.is-fly-out-only
+      = nav_link(path: 'groups#merge_requests', html_options: { class: "fly-out-top-item" } ) do
+        = link_to merge_requests_group_path(@group) do
+          %strong.fly-out-top-item-name
+            = _('Merge requests')
+          %span.badge.badge-pill.count.merge_counter.js-merge-counter.fly-out-badge= merge_requests_count
+
+= render_if_exists "layouts/nav/ee/security_link" # EE-specific
+
+= render_if_exists "layouts/nav/ee/push_rules_link" # EE-specific
+
+- if group_sidebar_link?(:kubernetes)
+  = nav_link(controller: [:clusters]) do
+    = link_to group_clusters_path(@group) do
+      .nav-icon-container
+        = sprite_icon('cloud-gear')
+      %span.nav-item-name
+        = _('Kubernetes')
+    %ul.sidebar-sub-level-items.is-fly-out-only
+      = nav_link(controller: [:clusters], html_options: { class: "fly-out-top-item" } ) do
+        = link_to group_clusters_path(@group), title: _('Kubernetes'), class: 'shortcuts-kubernetes' do
+          %strong.fly-out-top-item-name
+            = _('Kubernetes')
+
+= render 'groups/sidebar/packages'
+
+= render 'layouts/nav/sidebar/analytics_links', links: group_analytics_navbar_links(@group, current_user)
+
+- if group_sidebar_link?(:wiki)
+  = render 'layouts/nav/sidebar/wiki_link', wiki_url: @group.wiki.web_url
+
+- if group_sidebar_link?(:settings)
+  = nav_link(path: group_settings_nav_link_paths) do
+    = link_to edit_group_path(@group), class: 'has-sub-items' do
+      .nav-icon-container
+        = sprite_icon('settings')
+      %span.nav-item-name{ data: { qa_selector: 'group_settings' } }
+        = _('Settings')
+    %ul.sidebar-sub-level-items{ data: { testid: 'group-settings-menu', qa_selector: 'group_sidebar_submenu' } }
+      = nav_link(path: %w[groups#projects groups#edit badges#index ci_cd#show groups/applications#index], html_options: { class: "fly-out-top-item" } ) do
+        = link_to edit_group_path(@group) do
+          %strong.fly-out-top-item-name
+            = _('Settings')
+      %li.divider.fly-out-top-item
+      = nav_link(path: 'groups#edit') do
+        = link_to edit_group_path(@group), title: _('General'), data: { qa_selector: 'general_settings_link' } do
+          %span
+            = _('General')
+
+      = nav_link(controller: :integrations) do
+        = link_to group_settings_integrations_path(@group), title: _('Integrations') do
+          %span
+            = _('Integrations')
+
+      = nav_link(path: 'groups#projects') do
+        = link_to projects_group_path(@group), title: _('Projects') do
+          %span
+            = _('Projects')
+
+      = nav_link(controller: :repository) do
+        = link_to group_settings_repository_path(@group), title: _('Repository') do
+          %span
+            = _('Repository')
+
+      = nav_link(controller: [:ci_cd, 'groups/runners']) do
+        = link_to group_settings_ci_cd_path(@group), title: _('CI/CD') do
+          %span
+            = _('CI/CD')
+
+      = nav_link(controller: :applications) do
+        = link_to group_settings_applications_path(@group), title: _('Applications') do
+          %span
+            = _('Applications')
+
+      = render 'groups/sidebar/packages_settings'
+
+      = render_if_exists "groups/ee/settings_nav"
+
+= render_if_exists "groups/ee/administration_nav"
+
+= render 'shared/sidebar_toggle_button'

app/views/layouts/nav/sidebar/_group_scope_menu.html.haml

+= nav_link(path: ['groups#show', 'groups#details'], html_options: { class: 'context-header' }) do
+  = link_to group_path(@group), title: @group.name, data: { qa_selector: 'group_scope_link' } do
+    %span{ class: ['avatar-container', 'rect-avatar', 'group-avatar' , 's32'] }
+      = group_icon(@group, class: ['avatar', 'avatar-tile', 's32'])
+    %span.sidebar-context-title
+      = @group.name

app/views/shared/nav/_sidebar.html.haml

 %aside.nav-sidebar{ class: ('sidebar-collapsed-desktop' if collapsed_sidebar?), **sidebar_tracking_attributes_by_object(sidebar.container), 'aria-label': sidebar.aria_label }
   .nav-sidebar-inner-scroll
-    - if sidebar.render_raw_scope_menu_partial
-      = render sidebar.render_raw_scope_menu_partial
-
     %ul.sidebar-top-level-items{ data: { qa_selector: sidebar_qa_selector(sidebar.container) } }
-      - if sidebar.scope_menu
+      - if sidebar.render_raw_scope_menu_partial
+        = render sidebar.render_raw_scope_menu_partial
+      - elsif sidebar.scope_menu
         = render partial: 'shared/nav/scope_menu', object: sidebar.scope_menu
+
       - if sidebar.renderable_menus.any?
         = render partial: 'shared/nav/sidebar_menu', collection: sidebar.renderable_menus
+
       - if sidebar.render_raw_menus_partial
         = render sidebar.render_raw_menus_partial
 

lib/sidebars/groups/context.rb

+# frozen_string_literal: true
+
+module Sidebars
+  module Groups
+    class Context < ::Sidebars::Context
+      def initialize(current_user:, container:, **args)
+        super(current_user: current_user, container: container, group: container, **args)
+      end
+    end
+  end
+end

lib/sidebars/groups/panel.rb

+# frozen_string_literal: true
+
+module Sidebars
+  module Groups
+    class Panel < ::Sidebars::Panel
+      override :render_raw_scope_menu_partial
+      def render_raw_scope_menu_partial
+        'layouts/nav/sidebar/group_scope_menu'
+      end
+
+      override :render_raw_menus_partial
+      def render_raw_menus_partial
+        'layouts/nav/sidebar/group_menus'
+      end
+
+      override :aria_label
+      def aria_label
+        context.group.subgroup? ? _('Subgroup navigation') : _('Group navigation')
+      end
+    end
+  end
+end

qa/qa/ee/page/group/menu.rb

@@ -13,10 +13,9 @@ module QA
             base.class_eval do
               prepend QA::Page::Group::SubMenus::Common
 
-              view 'app/views/layouts/nav/sidebar/_group.html.haml' do
+              view 'app/views/layouts/nav/sidebar/_group_menus.html.haml' do
                 element :group_issue_boards_link
                 element :group_issues_item
-                element :group_sidebar
                 element :group_sidebar_submenu
                 element :group_settings
               end

qa/qa/page/group/menu.rb

@@ -6,7 +6,7 @@ module QA
       class Menu < Page::Base
         include SubMenus::Common
 
-        view 'app/views/layouts/nav/sidebar/_group.html.haml' do
+        view 'app/views/layouts/nav/sidebar/_group_menus.html.haml' do
           element :general_settings_link
           element :group_issues_item
           element :group_members_item

qa/qa/page/group/sub_menus/common.rb

@@ -12,8 +12,8 @@ module QA
             super
 
             base.class_eval do
-              view 'app/views/layouts/nav/sidebar/_group.html.haml' do
-                element :group_sidebar
+              view 'app/views/shared/nav/_sidebar.html.haml' do
+                element :group_sidebar, 'qa_selector: sidebar_qa_selector(sidebar.container)' # rubocop:disable QA/ElementWithPattern
               end
             end
           end