Merge branch 'refactor-projects-list' into 'master'

Refactor projects list

1. Fix double bottom border if pagination
2. Fix broken search on forks page
4. Remove duplicate js logic
4. Remove unused show all link
5. Remove duplicate “no project” message in different views

After this merge request you can easily render shared projects template
with all necessary html/js included to make searchable list with
pagination. All you need to provide is controller that returns
projects list with seach nad pagination and render html form with
project-filter-form id and text field with filter_projects name.

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>

cc @jschatz1 @DouweM 

See merge request !3075

11 files changed, 60 insertions, 103 deletions

diff --git a/app/assets/javascripts/dashboard.js.coffee b/app/assets/javascripts/dashboard.js.coffee
deleted file mode 100644
index 62143e66cfe..00000000000
--- a/app/assets/javascripts/dashboard.js.coffee
+++ /dev/null
@@ -1,31 +0,0 @@
-@Dashboard =
-  init: ->
-    $(".projects-list-filter").off('keyup')
-    this.initSearch()
-
-  initSearch: ->
-    @timer = null
-    $(".projects-list-filter").on('keyup', ->
-      clearTimeout(@timer)
-      @timer = setTimeout(Dashboard.filterResults, 500)
-    )
-
-  filterResults: =>
-    $('.projects-list-holder').fadeTo(250, 0.5)
-
-    form = null
-    form = $("form#project-filter-form")
-    search = $(".projects-list-filter").val()
-    project_filter_url = form.attr('action') + '?' + form.serialize()
-
-    $.ajax
-      type: "GET"
-      url: form.attr('action')
-      data: form.serialize()
-      complete: ->
-        $('.projects-list-holder').fadeTo(250, 1)
-      success: (data) ->
-        $('.projects-list-holder').replaceWith(data.html)
-        # Change url so if user reload a page - search results are saved
-        history.replaceState {page: project_filter_url}, document.title, project_filter_url
-      dataType: "json"
diff --git a/app/assets/javascripts/dispatcher.js.coffee b/app/assets/javascripts/dispatcher.js.coffee
index fe65ea8b14a..d7feb5d5c87 100644
--- a/app/assets/javascripts/dispatcher.js.coffee
+++ b/app/assets/javascripts/dispatcher.js.coffee
@@ -16,8 +16,6 @@ class Dispatcher
     shortcut_handler = null
 
     switch page
-      when 'explore:projects:index', 'explore:projects:starred', 'explore:projects:trending'
-        Dashboard.init()
       when 'projects:issues:index'
         Issues.init()
         shortcut_handler = new ShortcutsNavigation()
@@ -59,8 +57,6 @@ class Dispatcher
       when 'projects:merge_requests:index'
         shortcut_handler = new ShortcutsNavigation()
         MergeRequests.init()
-      when 'dashboard:show', 'root:show'
-        Dashboard.init()
       when 'dashboard:activity'
         new Activities()
       when 'dashboard:projects:starred'
diff --git a/app/assets/javascripts/projects_list.js.coffee b/app/assets/javascripts/projects_list.js.coffee
index eab34be652a..ed5206368ce 100644
--- a/app/assets/javascripts/projects_list.js.coffee
+++ b/app/assets/javascripts/projects_list.js.coffee
@@ -1,26 +1,31 @@
-class @ProjectsList
-  constructor: ->
-    $(".projects-list .js-expand").on 'click', (e) ->
-      e.preventDefault()
-      list = $(this).closest('.projects-list')
+@ProjectsList =
+  init: ->
+    $(".projects-list-filter").off('keyup')
+    this.initSearch()
 
-    $("#filter_projects").on 'keyup', ->
-      ProjectsList.filter_results($("#filter_projects"))
+  initSearch: ->
+    @timer = null
+    $(".projects-list-filter").on('keyup', ->
+      clearTimeout(@timer)
+      @timer = setTimeout(ProjectsList.filterResults, 500)
+    )
 
-  @filter_results: ($element) ->
-    terms = $element.val()
-    filterSelector = $element.data('filter-selector') || 'span.filter-title'
+  filterResults: =>
+    $('.projects-list-holder').fadeTo(250, 0.5)
 
-    if not terms
-      $(".projects-list li").show()
-      $('.gl-pagination').show()
-    else
-      $(".projects-list li").each (index) ->
-        $this = $(this)
-        name = $this.find(filterSelector).text()
+    form = null
+    form = $("form#project-filter-form")
+    search = $(".projects-list-filter").val()
+    project_filter_url = form.attr('action') + '?' + form.serialize()
 
-        if name.toLowerCase().indexOf(terms.toLowerCase()) == -1
-          $this.hide()
-        else
-          $this.show()
-      $('.gl-pagination').hide()
+    $.ajax
+      type: "GET"
+      url: form.attr('action')
+      data: form.serialize()
+      complete: ->
+        $('.projects-list-holder').fadeTo(250, 1)
+      success: (data) ->
+        $('.projects-list-holder').replaceWith(data.html)
+        # Change url so if user reload a page - search results are saved
+        history.replaceState {page: project_filter_url}, document.title, project_filter_url
+      dataType: "json"
diff --git a/app/assets/javascripts/user.js.coffee b/app/assets/javascripts/user.js.coffee
index 10ac064f9fc..2882a90d118 100644
--- a/app/assets/javascripts/user.js.coffee
+++ b/app/assets/javascripts/user.js.coffee
@@ -1,7 +1,6 @@
 class @User
   constructor: (@opts) ->
     $('.profile-groups-avatars').tooltip("placement": "top")
-    new ProjectsList()
 
     @initTabs()
 
diff --git a/app/controllers/projects/forks_controller.rb b/app/controllers/projects/forks_controller.rb
index c71b83c89b7..7b202f3862f 100644
--- a/app/controllers/projects/forks_controller.rb
+++ b/app/controllers/projects/forks_controller.rb
@@ -12,7 +12,18 @@ class Projects::ForksController < Projects::ApplicationController
     @public_forks_count  = @total_forks_count - @private_forks_count
 
     @sort  = params[:sort] || 'id_desc'
+    @forks = @forks.search(params[:filter_projects]) if params[:filter_projects].present?
     @forks = @forks.order_by(@sort).page(params[:page]).per(PER_PAGE)
+
+    respond_to do |format|
+      format.html
+
+      format.json do
+        render json: {
+          html: view_to_html_string("projects/forks/_projects", projects: @forks)
+        }
+      end
+    end
   end
 
   def new
diff --git a/app/views/dashboard/projects/_projects.html.haml b/app/views/dashboard/projects/_projects.html.haml
index 933a3edd0f0..0ebd7c01bab 100644
--- a/app/views/dashboard/projects/_projects.html.haml
+++ b/app/views/dashboard/projects/_projects.html.haml
@@ -1,6 +1 @@
-.projects-list-holder
-
-  = render 'shared/projects/list', projects: @projects, ci: true
-
-  :javascript
-    Dashboard.init()
+= render 'shared/projects/list', projects: @projects, ci: true
diff --git a/app/views/explore/projects/_projects.html.haml b/app/views/explore/projects/_projects.html.haml
index 999a933390b..708fbc27f55 100644
--- a/app/views/explore/projects/_projects.html.haml
+++ b/app/views/explore/projects/_projects.html.haml
@@ -1,6 +1 @@
-- if projects.any?
-  .projects-list-holder
-    = render 'shared/projects/list', projects: projects
-- else
-  .nothing-here-block
-    No such projects
+= render 'shared/projects/list', projects: projects
diff --git a/app/views/groups/_projects.html.haml b/app/views/groups/_projects.html.haml
index 209729dc7ee..794aa57b55a 100644
--- a/app/views/groups/_projects.html.haml
+++ b/app/views/groups/_projects.html.haml
@@ -8,5 +8,4 @@
           = icon('plus')
           New Project
 
-.projects-list-holder
-  = render 'shared/projects/list', projects: @projects, projects_limit: 20, stars: false, skip_namespace: true
+= render 'shared/projects/list', projects: @projects, stars: false, skip_namespace: true
diff --git a/app/views/projects/forks/_projects.html.haml b/app/views/projects/forks/_projects.html.haml
new file mode 100644
index 00000000000..2946e6dcbd0
--- /dev/null
+++ b/app/views/projects/forks/_projects.html.haml
@@ -0,0 +1,2 @@
+= render 'shared/projects/list', projects: projects, use_creator_avatar: true,
+  forks: true, show_last_commit_as_description: true
diff --git a/app/views/projects/forks/index.html.haml b/app/views/projects/forks/index.html.haml
index ace22625d1d..4bcf2d9d533 100644
--- a/app/views/projects/forks/index.html.haml
+++ b/app/views/projects/forks/index.html.haml
@@ -4,8 +4,9 @@
     == #{pluralize(@total_forks_count, 'fork')}: #{full_count_title}
 
   .nav-controls
-    = search_field_tag :filter_projects, nil, placeholder: 'Search forks', class: 'projects-list-filter project-filter-form-field form-control input-short',
-      spellcheck: false, data: { 'filter-selector' => 'span.namespace-name' }
+    = form_tag request.original_url, method: :get, class: 'project-filter-form', id: 'project-filter-form' do |f|
+      = search_field_tag :filter_projects, nil, placeholder: 'Search forks', class: 'projects-list-filter project-filter-form-field form-control input-short',
+        spellcheck: false, data: { 'filter-selector' => 'span.namespace-name' }
 
     .dropdown
       %button.dropdown-toggle.btn.sort-forks{type: 'button', 'data-toggle' => 'dropdown'}
@@ -38,18 +39,10 @@
           Fork
 
 
-.projects-list-holder
-  - if @forks.blank?
-    %ul.content-list
-      %li
-        .nothing-here-block No forks to show
-  - else
-    = render 'shared/projects/list', projects: @forks, use_creator_avatar: true,
-      forks: true, show_last_commit_as_description: true
+= render 'projects', projects: @forks
 
-    - if @private_forks_count > 0
-      %ul.projects-list.private-forks-notice
-        %li.project-row
-          = icon('lock fw', base: 'circle', class: 'fa-lg private-fork-icon')
-          %strong= pluralize(@private_forks_count, 'private fork')
-          %span you have no access to.
+- if @private_forks_count > 0
+  .private-forks-notice
+    = icon('lock fw', base: 'circle', class: 'fa-lg private-fork-icon')
+    %strong= pluralize(@private_forks_count, 'private fork')
+    %span you have no access to.
diff --git a/app/views/shared/projects/_list.html.haml b/app/views/shared/projects/_list.html.haml
index e4bc9998163..2e08bb2ac08 100644
--- a/app/views/shared/projects/_list.html.haml
+++ b/app/views/shared/projects/_list.html.haml
@@ -8,24 +8,17 @@
 - show_last_commit_as_description = false unless local_assigns[:show_last_commit_as_description] == true
 - remote = false unless local_assigns[:remote] == true
 
-%ul.projects-list.content-list
+.projects-list-holder
   - if projects.any?
-    - projects.each_with_index do |project, i|
-      - css_class = (i >= projects_limit) ? 'hide' : nil
-      = render "shared/projects/project", project: project, skip_namespace: skip_namespace,
-        avatar: avatar, stars: stars, css_class: css_class, ci: ci, use_creator_avatar: use_creator_avatar,
-        forks: forks, show_last_commit_as_description: show_last_commit_as_description
-
-    - if projects.size > projects_limit && projects.kind_of?(Array)
-      %li.bottom.center
-        .light
-          #{projects_limit} of #{pluralize(projects.count, 'project')} displayed.
-          = link_to '#', class: 'js-expand' do
-            Show all
+    %ul.projects-list.content-list
+      - projects.each_with_index do |project, i|
+        - css_class = (i >= projects_limit) ? 'hide' : nil
+        = render "shared/projects/project", project: project, skip_namespace: skip_namespace,
+          avatar: avatar, stars: stars, css_class: css_class, ci: ci, use_creator_avatar: use_creator_avatar,
+          forks: forks, show_last_commit_as_description: show_last_commit_as_description
     = paginate(projects, remote: remote, theme: "gitlab") if projects.respond_to? :total_pages
   - else
     .nothing-here-block No projects found
 
 :javascript
-  new ProjectsList();
-  Dashboard.init();
+  ProjectsList.init();