Merge branch 'dz-fix-group-settings-projects-page' into 'master'

Improve UI for admin > projects page

Closes #32333 and #32334

See merge request gitlab-org/gitlab!17247

app/assets/stylesheets/pages/projects.scss

@@ -877,11 +877,16 @@ pre.light-well {
   flex-direction: column;
 
   // Disable Flexbox for admin page
-  &.admin-projects {
+  &.admin-projects,
+  &.group-settings-projects {
     display: block;
 
     .project-row {
       display: block;
+
+      .description > p {
+        margin-bottom: 0;
+      }
     }
   }
 

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

-- page_title "Projects"
+- page_title _('Projects')
 - params[:visibility_level] ||= []
 
 .top-area.scrolling-tabs-container.inner-page-scroll-tabs
-  .prepend-top-default
+  %ul.nav-links.nav.nav-tabs
+    - opts = params[:visibility_level].present? ? {} : { page: admin_projects_path }
+    = nav_link(opts) do
+      = link_to _('All'), admin_projects_path
+
+    = nav_link(html_options: { class: active_when(params[:visibility_level] == Gitlab::VisibilityLevel::PRIVATE.to_s) }) do
+      = link_to _('Private'), admin_projects_path(visibility_level: Gitlab::VisibilityLevel::PRIVATE)
+    = nav_link(html_options: { class: active_when(params[:visibility_level] == Gitlab::VisibilityLevel::INTERNAL.to_s) }) do
+      = link_to _('Internal'), admin_projects_path(visibility_level: Gitlab::VisibilityLevel::INTERNAL)
+    = nav_link(html_options: { class: active_when(params[:visibility_level] == Gitlab::VisibilityLevel::PUBLIC.to_s) }) do
+      = link_to _('Public'), admin_projects_path(visibility_level: Gitlab::VisibilityLevel::PUBLIC)
+
+  .nav-controls
     .search-holder
       = render 'shared/projects/search_form', autofocus: true, admin_view: true
       .dropdown
@@ -22,20 +34,4 @@
         New Project
       = button_tag "Search", class: "btn btn-primary btn-search hide"
 
-  %ul.nav-links.nav.nav-tabs
-    - opts = params[:visibility_level].present? ? {} : { page: admin_projects_path }
-    = nav_link(opts) do
-      = link_to admin_projects_path do
-        All
-
-    = nav_link(html_options: { class: active_when(params[:visibility_level] == Gitlab::VisibilityLevel::PRIVATE.to_s) }) do
-      = link_to admin_projects_path(visibility_level: Gitlab::VisibilityLevel::PRIVATE) do
-        Private
-    = nav_link(html_options: { class: active_when(params[:visibility_level] == Gitlab::VisibilityLevel::INTERNAL.to_s) }) do
-      = link_to admin_projects_path(visibility_level: Gitlab::VisibilityLevel::INTERNAL) do
-        Internal
-    = nav_link(html_options: { class: active_when(params[:visibility_level] == Gitlab::VisibilityLevel::PUBLIC.to_s) }) do
-      = link_to admin_projects_path(visibility_level: Gitlab::VisibilityLevel::PUBLIC) do
-        Public
-
 = render 'projects'

app/views/groups/projects.html.haml

@@ -8,21 +8,38 @@
       .controls
         = link_to new_project_path(namespace_id: @group.id), class: "btn btn-sm btn-success" do
           New project
-  %ul.content-list
+  %ul.projects-list.content-list.group-settings-projects
     - @projects.each do |project|
-      %li
-        .list-item-name
-          %span{ class: visibility_level_color(project.visibility_level) }
-            = visibility_level_icon(project.visibility_level)
-          %strong= link_to project.full_name, project
-        .float-right
+      %li.project-row{ class: ('no-description' if project.description.blank?) }
+        .controls
+          = link_to _('Members'), project_project_members_path(project), id: "edit_#{dom_id(project)}", class: "btn"
+          = link_to _('Edit'), edit_project_path(project), id: "edit_#{dom_id(project)}", class: "btn"
+          = link_to _('Remove'), project, data: { confirm: remove_project_message(project)}, method: :delete, class: "btn btn-remove"
+
+        .stats
+          %span.badge.badge-pill
+            = storage_counter(project.statistics&.storage_size)
           - if project.archived
             %span.badge.badge-warning archived
-          %span.badge.badge-pill
-            = storage_counter(project.statistics.storage_size)
-          = link_to 'Members', project_project_members_path(project), id: "edit_#{dom_id(project)}", class: "btn btn-sm"
-          = link_to 'Edit', edit_project_path(project), id: "edit_#{dom_id(project)}", class: "btn btn-sm"
-          = link_to 'Remove', project, data: { confirm: remove_project_message(project)}, method: :delete, class: "btn btn-sm btn-remove"
+
+        .title
+          = link_to(project_path(project)) do
+            .dash-project-avatar
+              .avatar-container.rect-avatar.s40
+                = project_icon(project, alt: '', class: 'avatar project-avatar s40', width: 40, height: 40)
+            %span.project-full-name
+              %span.namespace-name
+                - if project.namespace
+                  = project.namespace.human_name
+                  \/
+              %span.project-name
+                = project.name
+              %span{ class: visibility_level_color(project.visibility_level) }
+                = visibility_level_icon(project.visibility_level)
+
+        - if project.description.present?
+          .description
+            = markdown_field(project, :description)
     - if @projects.blank?
       .nothing-here-block This group has no projects yet
 

changelogs/unreleased/dz-fix-group-settings-projects-page.yml

+---
+title: Improve UI for admin/projects and group/settings/projects pages
+merge_request: 17247
+author:
+type: changed