Skip to content

Commit 63515ca

Browse files
author
Pascal
committed
add pagination to list views
1 parent 2433d13 commit 63515ca

File tree

12 files changed

+105
-25
lines changed

12 files changed

+105
-25
lines changed

Gemfile

+1
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ ruby '2.6.3'
66
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
77
gem 'rails', '~> 6.0.2', '>= 6.0.2.1'
88
gem 'bcrypt', '~> 3.1.7'
9+
gem 'will_paginate', '3.1.7'
910
# Use sqlite3 as the database for Active Record
1011
# Use Puma as the app server
1112
gem 'puma', '~> 4.1'

Gemfile.lock

+5
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,8 @@ GEM
6767
bootstrap-sass (3.4.1)
6868
autoprefixer-rails (>= 5.2.1)
6969
sassc (>= 2.0.0)
70+
bootstrap-will_paginate (0.0.10)
71+
will_paginate
7072
builder (3.2.4)
7173
byebug (11.1.1)
7274
capybara (3.31.0)
@@ -200,6 +202,7 @@ GEM
200202
websocket-driver (0.7.1)
201203
websocket-extensions (>= 0.1.0)
202204
websocket-extensions (0.1.4)
205+
will_paginate (3.1.7)
203206
xpath (3.2.0)
204207
nokogiri (~> 1.8)
205208
zeitwerk (2.2.2)
@@ -211,6 +214,7 @@ DEPENDENCIES
211214
bcrypt (~> 3.1.7)
212215
bootsnap (>= 1.4.2)
213216
bootstrap-sass (~> 3.4.1)
217+
bootstrap-will_paginate (= 0.0.10)
214218
byebug
215219
capybara (>= 2.15)
216220
jbuilder (~> 2.7)
@@ -228,6 +232,7 @@ DEPENDENCIES
228232
web-console (>= 3.3.0)
229233
webdrivers
230234
webpacker (~> 4.0)
235+
will_paginate (= 3.1.7)
231236

232237
RUBY VERSION
233238
ruby 2.6.3p62

app/controllers/articles_controller.rb

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
class ArticlesController < ApplicationController
22
def index
3-
@article = Article.all
3+
@article = Article.paginate(page: params[:page], per_page: 5)
44
end
55
def new
66
@article = Article.new

app/controllers/users_controller.rb

+10-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
11
class UsersController < ApplicationController
2+
def index
3+
@users = User.paginate(page: params[:page], per_page: 5)
4+
end
25
def new
36
@user = User.new
47
end
@@ -25,7 +28,13 @@ def update
2528
end
2629
def show
2730
@user = User.find(params[:id])
28-
31+
@user_articles = @user.articles.paginate(page: params[:page], per_page: 5)
32+
end
33+
def destroy
34+
@user = User.find(params[:id])
35+
@user.destroy
36+
redirect_to root_path
37+
flash[:notice] = "User #{@user.username} was succesfully deleted"
2938
end
3039
private
3140
def user_params

app/helpers/application_helper.rb

+29
Original file line numberDiff line numberDiff line change
@@ -6,3 +6,32 @@ def gravatar_for(user, options = { size: 80})
66
image_tag(gravatar_url, alt: user.username, class: "img-circle")
77
end
88
end
9+
10+
module ApplicationHelper
11+
def will_paginate(collection_or_options = nil, options = {})
12+
if collection_or_options.is_a? Hash
13+
options, collection_or_options = collection_or_options, nil
14+
end
15+
unless options[:renderer]
16+
options = options.merge :renderer => BootstrapRenderer
17+
end
18+
super *[collection_or_options, options].compact
19+
end
20+
21+
class BootstrapRenderer < WillPaginate::ActionView::LinkRenderer
22+
protected
23+
def html_container(html)
24+
tag :nav, tag(:ul, html, class: "pagination pagination-sm"), container_attributes
25+
end
26+
27+
def page_number(page)
28+
tag :li, link(page, page, rel: rel_value(page), class: 'page-link'),
29+
class: (page == current_page ? 'page-item active': 'page-item')
30+
end
31+
32+
def previous_or_next_page(page, text, classname)
33+
tag :li, link(text, page || '#', class: 'page-link'),
34+
class: ['page-item', classname, ('disabled' unless page)].join(' ')
35+
end
36+
end
37+
end

app/javascript/stylesheets/application.scss

+5
Original file line numberDiff line numberDiff line change
@@ -38,3 +38,8 @@ $light: #DC3C1A;
3838
float: right;
3939
list-style: none;
4040
}
41+
42+
.listing{
43+
list-style: none;
44+
45+
}

app/views/articles/_article.html.erb

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<%= link_to "Edit", edit_article_path(article), class: "btn btn-primary" %>
77
<%= link_to "Show", article_path(article), class: "btn btn-primary" %>
88
<%= link_to "Delete", article_path(article), method: :delete, data: {confirm: "Are you sure?"}, class: "btn btn-danger mr-4" %>
9-
<span class="badge badge-pill badge-warning mt-4 mr-4 p-2">created <%= time_ago_in_words(article.created_at) %> ago - <%= article.created_at %></span>
9+
<span class="badge badge-pill badge-warning mt-4 mr-4 p-2">created <%= time_ago_in_words(article.created_at) %> ago - <%= article.created_at %><% if article.user %> - by <span><%= link_to article.user.username, user_path(article.user) %></span><% end %></span>
1010
<span class="badge badge-pill badge-secondary mt-4 p-2">last updated <%= time_ago_in_words(article.updated_at) %> ago - <%= article.updated_at %></span>
1111
</div>
1212
</div>

app/views/articles/index.html.erb

+2-8
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,6 @@
1-
<div class="mt-4">
1+
<div class="mt-4">
22
<%= render 'article', obj: @article %>
33
<nav>
4-
<ul class="pagination text-center">
5-
<li class="page-item"><a class="page-link" href="#">Previous</a></li>
6-
<li class="page-item"><a class="page-link" href="#">1</a></li>
7-
<li class="page-item"><a class="page-link" href="#">2</a></li>
8-
<li class="page-item"><a class="page-link" href="#">3</a></li>
9-
<li class="page-item"><a class="page-link" href="#">Next</a></li>
10-
</ul>
4+
<%= will_paginate @article, params: @will_paginate_params, class: 'text-center' %>
115
</nav>
126
</div>

app/views/articles/show.html.erb

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,6 @@
77
<%= link_to "Delete", article_path(@article), method: :delete, data: {confirm: "Are you sure?"}, class: "btn btn-danger mr-3" %>
88
</div>
99
</div>
10-
<span class="badge badge-pill badge-warning mt-2 mr-4 p-2">created <%= time_ago_in_words(@article.created_at) %> ago - <%= @article.created_at %> - by <span class="text-danger"><%= @article.user.username if @article.user %></span></span>
10+
<span class="badge badge-pill badge-warning mt-2 mr-4 p-2">created <%= time_ago_in_words(@article.created_at) %> ago - <%= @article.created_at %><% if @article.user %> - by <span><%= link_to @article.user.username, user_path(@article.user) %></span><% end %></span>
1111
<span class="badge badge-pill badge-secondary mt-3 p-2">last updated <%= time_ago_in_words(@article.updated_at) %> ago - <%= @article.updated_at %></span><br />
1212
<%= link_to raw("&#8592"), root_url, class: "btn btn-primary p-2 px-3 mt-3" %>

app/views/users/index.html.erb

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<h1 class="text-center my-4">All Users in Alpha Blog</h1>
2+
<table class="table">
3+
<thead>
4+
<tr>
5+
<th scope="col">#</th>
6+
<th scope="col">Image</th>
7+
<th scope="col">Username</th>
8+
<th scope="col">Email</th>
9+
<th scope="col">Articles</th>
10+
<th scope="col">Actions</th>
11+
</tr>
12+
</thead>
13+
<tbody>
14+
<% @users.each do |user| %>
15+
<tr>
16+
<th scope="row"><%= user.id %></th>
17+
<td scope="row"><%= gravatar_for user, size: 60 %></td>
18+
<td scope="row"><%= user.username %></%=>
19+
<td scope="row"><%= mail_to user.email %></td>
20+
<td scope="row"><%= pluralize(user.articles.count, "article") %></td>
21+
<td scope="row">
22+
<%= link_to "View profile", user_path(user), class: "btn btn-primary my-2 mx-1" %>
23+
<%= link_to "Edit profile", edit_user_path(user), class: "btn btn-primary my-2 mx-1" %>
24+
<%= link_to "Delete user", user_path(user), method: :delete, data: {confirm: "Are you sure?"}, class: "btn btn-danger my-2 mx-1" %></td>
25+
</tr>
26+
<% end %>
27+
</tbody>
28+
</table>
29+
30+
<nav>
31+
<%= will_paginate @article, params: @will_paginate_params, class: 'text-center' %>
32+
</nav>

app/views/users/show.html.erb

+15-13
Original file line numberDiff line numberDiff line change
@@ -6,24 +6,26 @@
66
<center>
77
<%= gravatar_for @user, size: 140 %>
88
<h3 class="media-heading mt-4"><%= @user.username %></h3>
9+
<h3 class="media-heading mt-4"><%= mail_to @user.email %></h3>
910
</center>
1011
<hr>
11-
<center>
12-
<p class="text-center">
13-
I like to solve specific problems to improve productivity</p>
14-
<p>
15-
Check out my <a href="https://stackoverflow.com/story/pascalmayr">stackoverflow story</a>
16-
</p>
17-
<br>
18-
</center>
19-
</div>
20-
<div class="text-center mb-4">
21-
<%= link_to "I've seen enough about #{@user.username}", root_url , class: "btn btn-primary" %>
12+
<div class="text-center">
13+
<%= link_to "Edit profile", edit_user_path(@user), class: "btn btn-primary my-2 mx-1" %>
14+
<%= link_to "Delete user", user_path(@user), method: :delete, data: {confirm: "Are you sure?"}, class: "btn btn-danger my-2 mx-1" %></td>
15+
</div>
2216
</div>
2317
</div>
2418
</div>
19+
<div class="text-center mb-4">
20+
<%= link_to "I've seen enough about #{@user.username}", root_url , class: "btn btn-primary" %>
21+
</div>
2522
</center>
2623
</div>
2724
</div>
28-
<h3 class="my-3">Articles by <%= @user.username %>:</h3>
29-
<%= render 'articles/article', obj: @user.articles %>
25+
<% if @user_articles.any? %>
26+
<h3 class="my-3">Articles by <%= @user.username %>:</h3>
27+
<%= render 'articles/article', obj: @user_articles %>
28+
<% end %>
29+
<nav>
30+
<%= will_paginate @user_articles, params: @will_paginate_params, class: 'text-center' %>
31+
</nav>

config/locales/en.yml

+3
Original file line numberDiff line numberDiff line change
@@ -31,3 +31,6 @@
3131

3232
en:
3333
hello: "Hello world"
34+
will_paginate:
35+
previous_label: <span class="page-item">Previous</span>
36+
next_label: <span class="page-item">Next</span>

0 commit comments

Comments
 (0)