Add /starrers view for projects

12 files changed, 174 insertions, 42 deletions

diff --git a/app/assets/stylesheets/pages/members.scss b/app/assets/stylesheets/pages/members.scss
index 68af01f9ccc..d54d264bc5d 100644
--- a/app/assets/stylesheets/pages/members.scss
+++ b/app/assets/stylesheets/pages/members.scss
@@ -9,10 +9,6 @@
   }
 }
 
-.member-sort-dropdown {
-  margin-left: $gl-padding-8;
-}
-
 .member {
   &.is-overridden {
     .btn-ldap-override {
@@ -62,36 +58,9 @@
   }
 }
 
-.member-search-form {
-  position: relative;
-
-  @include media-breakpoint-up(sm) {
-    float: right;
-  }
-
-  .dropdown {
-    width: 100%;
-    margin-top: 5px;
-
-    .dropdown-menu-toggle {
-      vertical-align: middle;
-      width: 100%;
-    }
-
-    @include media-breakpoint-up(sm) {
-      margin-top: 0;
-      width: 155px;
-    }
-  }
-
-  .form-control {
-    width: 100%;
-    padding-right: 35px;
-
-    @include media-breakpoint-up(sm) {
-      width: 250px;
-    }
-  }
+.member-access-text {
+  margin-left: auto;
+  line-height: 43px;
 }
 
 .member-search-btn {
@@ -177,7 +146,7 @@
     padding-bottom: 1px;
   }
 
-  .flex-project-members-form {
+  .flex-users-form {
     flex-wrap: nowrap;
     white-space: nowrap;
     margin-left: auto;
diff --git a/app/assets/stylesheets/pages/users.scss b/app/assets/stylesheets/pages/users.scss
new file mode 100644
index 00000000000..8bb8729f037
--- /dev/null
+++ b/app/assets/stylesheets/pages/users.scss
@@ -0,0 +1,96 @@
+.user-sort-dropdown {
+  margin-left: $gl-padding-8;
+}
+
+.user-search-form {
+  position: relative;
+
+  @include media-breakpoint-up(sm) {
+    float: right;
+  }
+
+  .dropdown {
+    width: 100%;
+    margin-top: 5px;
+
+    .dropdown-menu-toggle {
+      vertical-align: middle;
+      width: 100%;
+    }
+
+    @include media-breakpoint-up(sm) {
+      margin-top: 0;
+      width: 155px;
+    }
+  }
+
+  .form-control {
+    width: 100%;
+    padding-right: 35px;
+
+    @include media-breakpoint-up(sm) {
+      width: 250px;
+    }
+  }
+}
+
+.user-search-btn {
+  position: absolute;
+  right: 4px;
+  top: 0;
+  height: 35px;
+  padding-left: 10px;
+  padding-right: 10px;
+  color: $gray-darkest;
+  background: transparent;
+  border: 0;
+  outline: 0;
+}
+
+.flex-users-panel {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+
+  @include media-breakpoint-down(sm) {
+    display: block;
+
+    .flex-project-title {
+      vertical-align: top;
+      display: inline-block;
+      max-width: 90%;
+    }
+  }
+
+  .flex-project-title {
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+
+  .badge.badge-pill {
+    height: 17px;
+    line-height: 16px;
+    margin-right: 5px;
+    padding-top: 1px;
+    padding-bottom: 1px;
+  }
+
+  .flex-users-form {
+    flex-wrap: nowrap;
+    white-space: nowrap;
+    margin-left: auto;
+  }
+}
+
+.content-list.members-list li {
+  display: flex;
+  justify-content: space-between;
+
+  .list-item-name {
+    float: none;
+    display: flex;
+    flex: 1;
+  }
+}
diff --git a/app/controllers/projects/starrers_controller.rb b/app/controllers/projects/starrers_controller.rb
new file mode 100644
index 00000000000..8d5ddd51e4c
--- /dev/null
+++ b/app/controllers/projects/starrers_controller.rb
@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+class Projects::StarrersController < Projects::ApplicationController
+  include SortingHelper
+  #
+  # Authorize
+  before_action :require_non_empty_project
+
+  def index
+    @sort = params[:sort].presence || sort_value_name
+
+    params[:has_starred] = @project
+
+    @starrers = UsersFinder.new(current_user, params).execute
+    @starrers = @starrers.sort_by_attribute(@sort)
+  end
+end
diff --git a/app/finders/users_finder.rb b/app/finders/users_finder.rb
index 81ae50c0bd1..2f3fc24b243 100644
--- a/app/finders/users_finder.rb
+++ b/app/finders/users_finder.rb
@@ -37,6 +37,7 @@ class UsersFinder
     users = by_2fa(users)
     users = by_created_at(users)
     users = by_custom_attributes(users)
+    users = by_has_starred(users)
 
     users
   end
@@ -94,4 +95,8 @@ class UsersFinder
       users
     end
   end
+
+  def by_has_starred(items)
+    params[:has_starred].present? ? items.has_starred(params[:has_starred]) : items
+  end
 end
diff --git a/app/helpers/users_helper.rb b/app/helpers/users_helper.rb
index 73ca17c6605..23eafc12c38 100644
--- a/app/helpers/users_helper.rb
+++ b/app/helpers/users_helper.rb
@@ -108,4 +108,9 @@ module UsersHelper
 
     items
   end
+
+  def filter_user_path(options = {})
+    options = params.slice(:sort).merge(options).permit!
+    "#{request.path}?#{options.to_param}"
+  end
 end
diff --git a/app/models/user.rb b/app/models/user.rb
index 4630552e02e..f772e3f6907 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -282,6 +282,7 @@ class User < ApplicationRecord
   scope :for_todos, -> (todos) { where(id: todos.select(:user_id)) }
   scope :with_emails, -> { preload(:emails) }
   scope :with_dashboard, -> (dashboard) { where(dashboard: dashboard) }
+  scope :has_starred, ->(project) { joins(:users_star_projects).where('users_star_projects.project_id': project.id) }
 
   # Limits the users to those that have TODOs, optionally in the given state.
   #
diff --git a/app/views/groups/group_members/index.html.haml b/app/views/groups/group_members/index.html.haml
index 021c0b6c429..2b8c9f65d43 100644
--- a/app/views/groups/group_members/index.html.haml
+++ b/app/views/groups/group_members/index.html.haml
@@ -25,11 +25,11 @@
         Members with access to
         %strong= @group.name
       %span.badge.badge-pill= @members.total_count
-      = form_tag group_group_members_path(@group), method: :get, class: 'form-inline member-search-form flex-project-members-form' do
+      = form_tag group_group_members_path(@group), method: :get, class: 'form-inline user-search-form flex-users-form' do
         .form-group
           .position-relative.append-right-8
             = search_field_tag :search, params[:search], { placeholder: 'Find existing members by name', class: 'form-control', spellcheck: false }
-            %button.member-search-btn{ type: "submit", "aria-label" => "Submit search" }
+            %button.user-search-btn{ type: "submit", "aria-label" => "Submit search" }
               = icon("search")
           - if can_manage_members
             = render 'shared/members/filter_2fa_dropdown'
diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml
index 090d1549aa7..02e5297528b 100644
--- a/app/views/projects/buttons/_star.html.haml
+++ b/app/views/projects/buttons/_star.html.haml
@@ -8,7 +8,8 @@
         = sprite_icon('star-o', { css_class: 'icon' })
         %span= s_('ProjectOverview|Star')
     %span.star-count.count-badge-count.d-flex.align-items-center
-      = @project.star_count
+      = link_to project_starrers_path(@project), title: n_(s_('ProjectOverview|Starrer'), s_('ProjectOverview|Starrers'), @project.star_count), class: 'count' do
+        = @project.star_count
 
 - else
   .count-badge.d-inline-flex.align-item-stretch.append-right-8
@@ -16,4 +17,5 @@
       = sprite_icon('star-o', { css_class: 'icon' })
       %span= s_('ProjectOverview|Star')
     %span.star-count.count-badge-count.d-flex.align-items-center
-      = @project.star_count
+      = link_to project_starrers_path(@project), title: n_(s_('ProjectOverview|Starrer'), s_('ProjectOverview|Starrers'), @project.star_count), class: 'count' do
+        = @project.star_count
diff --git a/app/views/projects/project_members/_team.html.haml b/app/views/projects/project_members/_team.html.haml
index f220299ec30..5310c1fad01 100644
--- a/app/views/projects/project_members/_team.html.haml
+++ b/app/views/projects/project_members/_team.html.haml
@@ -6,11 +6,11 @@
     %span.flex-project-title
       = _("Members of <strong>%{project_name}</strong>").html_safe % { project_name: sanitize(project.name, tags: []) }
     %span.badge.badge-pill= members.total_count
-    = form_tag project_project_members_path(project), method: :get, class: 'form-inline member-search-form flex-project-members-form' do
+    = form_tag project_project_members_path(project), method: :get, class: 'form-inline user-search-form flex-users-form' do
       .form-group
         .position-relative
           = search_field_tag :search, params[:search], { placeholder: _('Find existing members by name'), class: 'form-control', spellcheck: false }
-          %button.member-search-btn{ type: "submit", "aria-label" => _("Submit search") }
+          %button.user-search-btn{ type: "submit", "aria-label" => _("Submit search") }
             = icon("search")
         = render 'shared/members/sort_dropdown'
   %ul.content-list.members-list.qa-members-list
diff --git a/app/views/projects/starrers/index.html.haml b/app/views/projects/starrers/index.html.haml
new file mode 100644
index 00000000000..1b7dfcf7a29
--- /dev/null
+++ b/app/views/projects/starrers/index.html.haml
@@ -0,0 +1,25 @@
+- page_title _("Starrers")
+
+.top-area.adjust
+  .nav-text
+    %span.flex-project-title
+      = _("Starrers of <strong>%{project_name}</strong>").html_safe % { project_name: sanitize_project_name(@project.name) }
+    %span.badge.badge-pill= @starrers.size
+  .nav-controls
+    = form_tag request.original_url, method: :get, class: 'form-inline user-search-form flex-users-form' do
+      .form-group
+        .position-relative
+          = search_field_tag :search, params[:search], { placeholder: _('Find starrers by name'), class: 'form-control', spellcheck: false }
+          %button.user-search-btn{ type: "submit", "aria-label" => _("Submit search") }
+            = icon("search")
+          .dropdown.inline.user-sort-dropdown
+            = dropdown_toggle(users_sort_options_hash[@sort], { toggle: 'dropdown' })
+            %ul.dropdown-menu.dropdown-menu-right.dropdown-menu-selectable
+              %li.dropdown-header
+                = _("Sort by")
+              - users_sort_options_hash.each do |value, title|
+                %li
+                  = link_to filter_user_path(sort: value), class: ("is-active" if @sort == value) do
+                    = title
+%ul.content-list.users-list.qa-users-list
+  = render partial: 'shared/users/user', collection: @starrers, as: :user
diff --git a/app/views/shared/members/_sort_dropdown.html.haml b/app/views/shared/members/_sort_dropdown.html.haml
index 59bdfb73e6e..f5ebab035db 100644
--- a/app/views/shared/members/_sort_dropdown.html.haml
+++ b/app/views/shared/members/_sort_dropdown.html.haml
@@ -1,4 +1,4 @@
-.dropdown.inline.member-sort-dropdown
+.dropdown.inline.user-sort-dropdown
   = dropdown_toggle(member_sort_options_hash[@sort], { toggle: 'dropdown' })
   %ul.dropdown-menu.dropdown-menu-right.dropdown-menu-selectable
     %li.dropdown-header
diff --git a/app/views/shared/users/_user.html.haml b/app/views/shared/users/_user.html.haml
new file mode 100644
index 00000000000..ae014176e54
--- /dev/null
+++ b/app/views/shared/users/_user.html.haml
@@ -0,0 +1,12 @@
+- user = local_assigns.fetch(:user)
+
+%li.member{ class: dom_class(user), id: dom_id(user) }
+  %span.list-item-name
+    = image_tag avatar_icon_for_user(user, 40), class: "avatar s40", alt: ''
+    .user-info
+      = link_to user.name, user_path(user), class: 'member js-user-link', data: { user_id: user.id }
+      %br
+      %span.cgray= user.to_reference
+
+      - if user == current_user
+        %span.badge.badge-success.prepend-left-5= _("It's you")