Show topics in the project list

Changelog: added

app/controllers/admin/users_controller.rb

@@ -26,9 +26,10 @@ class Admin::UsersController < Admin::ApplicationController
   def show
   end
 
+  # rubocop: disable CodeReuse/ActiveRecord
   def projects
-    @personal_projects = user.personal_projects
-    @joined_projects = user.projects.joined(@user)
+    @personal_projects = user.personal_projects.includes(:topics)
+    @joined_projects = user.projects.joined(@user).includes(:topics)
   end
 
   def keys

app/controllers/dashboard/projects_controller.rb

@@ -81,7 +81,7 @@ class Dashboard::ProjectsController < Dashboard::ApplicationController
 
   # rubocop: disable CodeReuse/ActiveRecord
   def preload_associations(projects)
-    projects.includes(:route, :creator, :group, namespace: [:route, :owner]).preload(:project_feature)
+    projects.includes(:route, :creator, :group, :topics, namespace: [:route, :owner]).preload(:project_feature)
   end
   # rubocop: enable CodeReuse/ActiveRecord
 

app/controllers/explore/projects_controller.rb

@@ -87,7 +87,7 @@ class Explore::ProjectsController < Explore::ApplicationController
 
   # rubocop: disable CodeReuse/ActiveRecord
   def preload_associations(projects)
-    projects.includes(:route, :creator, :group, :project_feature, namespace: [:route, :owner])
+    projects.includes(:route, :creator, :group, :project_feature, :topics, namespace: [:route, :owner])
   end
   # rubocop: enable CodeReuse/ActiveRecord
 

app/controllers/projects/forks_controller.rb

@@ -99,7 +99,7 @@ class Projects::ForksController < Projects::ApplicationController
       current_user: current_user
     ).execute
 
-    forks.includes(:route, :creator, :group, namespace: [:route, :owner])
+    forks.includes(:route, :creator, :group, :topics, namespace: [:route, :owner])
   end
 
   def fork_service

app/presenters/project_presenter.rb

@@ -397,16 +397,16 @@ class ProjectPresenter < Gitlab::View::Presenter::Delegated
   end
 
   def topics_to_show
-    project.topic_list.take(MAX_TOPICS_TO_SHOW) # rubocop: disable CodeReuse/ActiveRecord
+    project_topic_list.take(MAX_TOPICS_TO_SHOW) # rubocop: disable CodeReuse/ActiveRecord
   end
 
   def topics_not_shown
-    project.topic_list - topics_to_show
+    project_topic_list - topics_to_show
   end
 
   def count_of_extra_topics_not_shown
-    if project.topic_list.count > MAX_TOPICS_TO_SHOW
-      project.topic_list.count - MAX_TOPICS_TO_SHOW
+    if project_topic_list.count > MAX_TOPICS_TO_SHOW
+      project_topic_list.count - MAX_TOPICS_TO_SHOW
     else
       0
     end
@@ -486,6 +486,12 @@ class ProjectPresenter < Gitlab::View::Presenter::Delegated
       **additional_params
     )
   end
+
+  def project_topic_list
+    strong_memoize(:project_topic_list) do
+      project.topics.map(&:name)
+    end
+  end
 end
 
 ProjectPresenter.prepend_mod_with('ProjectPresenter')

app/services/search/global_service.rb

@@ -22,8 +22,9 @@ module Search
                                 filters: { state: params[:state], confidential: params[:confidential] })
     end
 
+    # rubocop: disable CodeReuse/ActiveRecord
     def projects
-      @projects ||= ProjectsFinder.new(params: { non_archived: true }, current_user: current_user).execute
+      @projects ||= ProjectsFinder.new(params: { non_archived: true }, current_user: current_user).execute.includes(:topics, :taggings)
     end
 
     def allowed_scopes

app/views/projects/_home_panel.html.haml

 - empty_repo = @project.empty_repo?
 - show_auto_devops_callout = show_auto_devops_callout?(@project)
-- max_project_topic_length = 15
 - emails_disabled = @project.emails_disabled?
 - cache_enabled = Feature.enabled?(:cache_home_panel, @project, type: :development, default_enabled: :yaml)
 
@@ -25,24 +24,8 @@
             %span.access-request-links.gl-ml-3
               = render 'shared/members/access_request_links', source: @project
 
-          - if @project.topic_list.present?
-            = cache_if(cache_enabled, [@project, :topic_list], expires_in: 1.day) do
-              %span.home-panel-topic-list.mt-2.w-100.d-inline-flex.gl-font-base.gl-font-weight-normal.gl-align-items-center
-                = sprite_icon('tag', css_class: 'icon gl-relative gl-mr-2')
-
-                - @project.topics_to_show.each do |topic|
-                  - project_topics_classes = "badge badge-pill badge-secondary gl-mr-2"
-                  - explore_project_topic_path = explore_projects_path(topic: topic)
-                  - if topic.length > max_project_topic_length
-                    %a{ class: "#{ project_topics_classes } str-truncated-30 has-tooltip", data: { container: "body" }, title: topic, href: explore_project_topic_path, itemprop: 'keywords' }
-                      = topic.titleize
-                  - else
-                    %a{ class: project_topics_classes, href: explore_project_topic_path, itemprop: 'keywords' }
-                      = topic.titleize
-
-                - if @project.has_extra_topics?
-                  .text-nowrap.has-tooltip{ data: { container: 'body' }, title: @project.has_extra_topics? ? @project.topics_not_shown.join(', ') : nil }
-                    = _("+ %{count} more") % { count: @project.count_of_extra_topics_not_shown }
+          .gl-mt-3.gl-pl-3.gl-w-full
+            = render "shared/projects/topics", project: @project, cache_enabled: cache_enabled
 
     = cache_if(cache_enabled, [@project, :buttons, current_user, @notification_setting], expires_in: 1.day) do
       .project-repo-buttons.gl-display-flex.gl-justify-content-md-end.gl-align-items-start.gl-flex-wrap.gl-mt-5

app/views/shared/projects/_project.html.haml

@@ -65,6 +65,10 @@
           .description.d-none.d-sm-block.gl-mr-3
             = markdown_field(project, :description)
 
+        - if project.topics.any?
+          .gl-mt-2
+            = render "shared/projects/topics", project: project.present(current_user: current_user)
+
         = render_if_exists 'shared/projects/removed', project: project
 
       .controls.d-flex.flex-sm-column.align-items-center.align-items-sm-end.flex-wrap.flex-shrink-0.text-secondary{ class: css_controls_class.join(" ") }

app/views/shared/projects/_topics.html.haml

+- cache_enabled = false unless local_assigns[:cache_enabled] == true
+- max_project_topic_length = 15
+- project_topics_classes = "badge badge-pill badge-secondary gl-mr-2"
+
+- if project.topics.present?
+  = cache_if(cache_enabled, [project, :topic_list], expires_in: 1.day) do
+    %span.gl-w-full.gl-display-inline-flex.gl-font-base.gl-font-weight-normal.gl-align-items-center{ 'data-testid': 'project_topic_list' }
+      = sprite_icon('tag', css_class: 'icon gl-relative gl-mr-2')
+
+      - project.topics_to_show.each do |topic|
+        - explore_project_topic_path = explore_projects_path(topic: topic)
+        - if topic.length > max_project_topic_length
+          %a{ class: "#{ project_topics_classes } str-truncated-30 has-tooltip", data: { container: "body" }, title: topic, href: explore_project_topic_path, itemprop: 'keywords' }
+            = truncate(topic, length: max_project_topic_length)
+        - else
+          %a{ class: project_topics_classes, href: explore_project_topic_path, itemprop: 'keywords' }
+            = topic
+
+      - if project.has_extra_topics?
+        - title = _('More topics')
+        - content = capture do
+          %span.gl-display-inline-flex
+            - project.topics_not_shown.each do |topic|
+              - explore_project_topic_path = explore_projects_path(topic: topic)
+              - if topic.length > max_project_topic_length
+                %a{ class: "#{ project_topics_classes } gl-mb-3 str-truncated has-tooltip", data: { container: "body" }, title: topic, href: explore_project_topic_path, itemprop: 'keywords' }
+                  = truncate(topic, length: max_project_topic_length)
+              - else
+                %a{ class: "#{ project_topics_classes } gl-mb-3", href: explore_project_topic_path, itemprop: 'keywords' }
+                  = topic
+        .text-nowrap{ role: 'button', tabindex: 0, data: { toggle: 'popover', html: 'true', placement: 'top', title: title, content: content } }
+          = _("+ %{count} more") % { count: project.count_of_extra_topics_not_shown }

ee/lib/gitlab/elastic/search_results.rb

@@ -28,7 +28,7 @@ module Gitlab
 
         case scope
         when 'projects'
-          eager_load(projects, page, per_page, preload_method, [:route, :namespace])
+          eager_load(projects, page, per_page, preload_method, [:route, :namespace, :topics])
         when 'issues'
           eager_load(issues, page, per_page, preload_method, project: [:route, :namespace], labels: [], timelogs: [], assignees: [])
         when 'merge_requests'

locale/gitlab.pot

@@ -21610,6 +21610,9 @@ msgstr ""
 msgid "More than %{number_commits_distance} commits different with %{default_branch}"
 msgstr ""
 
+msgid "More topics"
+msgstr ""
+
 msgid "Most relevant"
 msgstr ""
 

spec/features/dashboard/projects_spec.rb

@@ -194,6 +194,29 @@ RSpec.describe 'Dashboard Projects' do
     end
   end
 
+  describe 'with topics' do
+    context 'when project has topics' do
+      before do
+        project.update_attribute(:topic_list, 'topic1')
+      end
+
+      it 'shows project topics if exist' do
+        visit dashboard_projects_path
+
+        expect(page).to have_selector('[data-testid="project_topic_list"]')
+        expect(page).to have_link('topic1', href: explore_projects_path(topic: 'topic1'))
+      end
+    end
+
+    context 'when project does not have topics' do
+      it 'does not show project topics' do
+        visit dashboard_projects_path
+
+        expect(page).not_to have_selector('[data-testid="project_topic_list"]')
+      end
+    end
+  end
+
   context 'last push widget', :use_clean_rails_memory_store_caching do
     before do
       event = create(:push_event, project: project, author: user)

spec/features/projects/show/schema_markup_spec.rb

@@ -16,7 +16,7 @@ RSpec.describe 'Projects > Show > Schema Markup' do
       expect(page).to have_selector('[itemprop="identifier"]', text: "Project ID: #{project.id}")
       expect(page).to have_selector('[itemprop="description"]', text: project.description)
       expect(page).to have_selector('[itemprop="license"]', text: project.repository.license.name)
-      expect(find_all('[itemprop="keywords"]').map(&:text)).to match_array(project.topic_list.map(&:capitalize))
+      expect(find_all('[itemprop="keywords"]').map(&:text)).to match_array(project.topic_list)
       expect(page).to have_selector('[itemprop="about"]')
     end
   end

spec/features/projects_spec.rb

@@ -132,8 +132,8 @@ RSpec.describe 'Project' do
 
       visit path
 
-      expect(page).to have_css('.home-panel-topic-list')
-      expect(page).to have_link('Topic1', href: explore_projects_path(topic: 'topic1'))
+      expect(page).to have_selector('[data-testid="project_topic_list"]')
+      expect(page).to have_link('topic1', href: explore_projects_path(topic: 'topic1'))
     end
 
     it 'shows up to 3 project topics' do
@@ -141,10 +141,10 @@ RSpec.describe 'Project' do
 
       visit path
 
-      expect(page).to have_css('.home-panel-topic-list')
-      expect(page).to have_link('Topic1', href: explore_projects_path(topic: 'topic1'))
-      expect(page).to have_link('Topic2', href: explore_projects_path(topic: 'topic2'))
-      expect(page).to have_link('Topic3', href: explore_projects_path(topic: 'topic3'))
+      expect(page).to have_selector('[data-testid="project_topic_list"]')
+      expect(page).to have_link('topic1', href: explore_projects_path(topic: 'topic1'))
+      expect(page).to have_link('topic2', href: explore_projects_path(topic: 'topic2'))
+      expect(page).to have_link('topic3', href: explore_projects_path(topic: 'topic3'))
       expect(page).to have_content('+ 1 more')
     end
   end