いいね機能

app/assets/stylesheets/application.bootstrap.scss

@@ -37,7 +37,10 @@ $btn-border-radius: 1rem;
 }
 
 .card {
-  border-color: EFF3F4;
   border-width: 0 0 1px 0;
   border-radius: 0;
+}
+
+.already-liking {
+  color: rgb(249,25,127);
 }

app/controllers/likes_controller.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+class LikesController < ApplicationController
+  def create
+    @like = current_user.likes.create(post_id: params[:post_id])
+    redirect_to request.referer
+  end
+
+  def destroy
+    @like = current_user.likes.find_by(post_id: params[:post_id])
+    @like.destroy
+    redirect_to request.referer
+  end
+end

app/controllers/posts_controller.rb

@@ -30,10 +30,10 @@ def set_user
 
   def set_posts
     @post = Post.new
-    @posts = Post.includes(:user).latest.page(params[:posts_page]).per(10)
+    @posts = Post.includes(:user, :likes).latest.page(params[:posts_page]).per(10)
     # 自分がフォローしている投稿
     followee_ids = @user.followees.map(&:id)
-    @followee_posts = Post.includes(:user).followee_posts(followee_ids:).page(params[:followee_page]).per(10)
+    @followee_posts = Post.includes(:user, :likes).followee_posts(followee_ids:).page(params[:followee_page]).per(10)
   end
 
   def post_params

app/models/like.rb

@@ -3,4 +3,6 @@
 class Like < ApplicationRecord
   belongs_to :user
   belongs_to :post
+
+  validates :user_id, presence: true, uniqueness: { scope: :post_id }
 end

app/models/post.rb

@@ -2,7 +2,6 @@
 
 class Post < ApplicationRecord
   belongs_to :user
-
   has_many_attached :images
 
   has_many :likes, dependent: :destroy

app/models/user.rb

@@ -50,6 +50,10 @@ def self.from_omniauth(auth)
     end
   end
 
+  def like(post)
+    likes.find_by(post_id: post.id)
+  end
+
   private
 
   def attach_dummy_photo

app/views/posts/_post.html.slim

@@ -1,23 +1,23 @@
 .card
-  = link_to post_path(post), data: { turbo: false}, class: "post"
-    .card-body.container-grid.text-dark
-      .row
-        .col-1
-          - if post.user.photo.attached?
-            = image_tag post.user.photo, class: "rounded-circle img-fluid", style: " max-width: 100%; height: auto;"
-        .col
+  .card-body.container-grid
+    = link_to post_path(post), data: { turbo: false}, class: "row post text-dark"
+      .col-1
+        - if post.user.photo.attached?
+          = image_tag post.user.photo, class: "rounded-circle img-fluid", style: " max-width: 100%; height: auto;"
+      .col
+        .d-flex.flex-row
+          p.card-title.fw-bold
+            = post.user_name
+          p.card-subtitle.text-muted.d-flex.align-items-center.mx-2
+            | @
+            = post.user_user_name
+            | ・
+            = l post.created_at
+        - if post.content?
+          span.card-text
+            = safe_join(post.content.split("\n"),tag(:br))
+        - if post.images.attached?
           .d-flex.flex-row
-            p.card-title.fw-bold
-              = post.user_name
-            p.card-subtitle.text-muted.d-flex.align-items-center.mx-2
-              | @
-              = post.user_user_name
-              | ・
-              = l post.created_at
-          - if post.content?
-            span.card-text
-              = safe_join(post.content.split("\n"),tag(:br))
-          - if post.images.attached?
-            .d-flex.flex-row
-            - post.images.each do |image|
-              = image_tag image, class: "img-fluid", style: " max-width: 50%; height: auto;"
+          - post.images.each do |image|
+            = image_tag image, class: "img-fluid", style: " max-width: 50%; height: auto;"
+    = render "posts/post_footer", post:, user:

app/views/posts/_post_footer.html.slim

@@ -0,0 +1,26 @@
+- if user_signed_in?
+  hr
+  .row.my-2
+    .col.d-flex.justify-content-around
+      = link_to post_path(post), data: { turbo: false }, class: "text-decoration-none text-muted d-flex align-items-center fs-6 text-center"
+        i.fs-6.bi-chat.mx-2
+        = post.comments.size
+    .col.d-flex.justify-content-around
+      = link_to post_likes_path(post), data: { "turbo-method": :post }, class: "text-decoration-none text-muted d-flex align-items-center fs-6 text-center"
+        i.fs-6.bi-repeat.mx-2
+        - if !post.reposts.size.zero?
+          = post.reposts.size
+    .col.d-flex.justify-content-around
+      - if current_user.like(post).present?
+        = link_to post_like_path(post, current_user.like(post) ), data: { "turbo-method": :delete }, class: "text-decoration-none d-flex align-items-center fs-6 text-center already-liking"
+          i.fs-6.bi-heart-fill.mx-2
+          = post.likes.size
+      - else
+        = link_to post_likes_path(post), data: { "turbo-method": :post }, class: "text-decoration-none text-muted d-flex align-items-center fs-6 text-center"
+          i.fs-6.bi-heart.mx-2
+          - if !post.likes.size.zero?
+            = post.likes.size
+    .col.d-flex.justify-content-around
+      = link_to post_likes_path(post), data: { "turbo-method": :post }, class: "text-decoration-none text-muted d-flex align-items-center fs-6 text-center"
+        i.fs-6.bi-bookmark.mx-2
+        | 3

app/views/posts/index.html.slim

@@ -19,8 +19,8 @@
         #pills-home.tab-pane.fade.show.active
           = paginate @posts, :param_name => 'posts_page'
           - @posts.each do |post|
-            = render post
+            = render post, :user => @user
         #pills-profile.tab-pane.fade
           = paginate @followee_posts, :param_name => 'followee_page'
           - @followee_posts.each do |post|
-            = render post
+            = render post, :user => @user

app/views/users/show.html.slim

@@ -69,17 +69,17 @@
         #pills-post.tab-pane.fade.show.active
           = paginate @posts, :param_name => 'posts_page'
           - @posts.each do |post|
-            = render post
+            = render post, :user => current_user
         #pills-like.tab-pane.fade
           = paginate @liking_posts, :param_name => 'like_page'
           - @liking_posts.each do |post|
-            = render post
+            = render post, :user => current_user
         #pills-repost.tab-pane.fade
           = paginate @reposting_posts, :param_name => 'repost_page'
           - @reposting_posts.each do |post|
-            = render post
+            = render post, :user => current_user
         #pills-comment.tab-pane.fade
           = paginate @commenting_posts, :param_name => 'comment_page'
           - @commenting_posts.each do |post|
-            = render post
+            = render post, :user => current_user
 

config/routes.rb

@@ -7,7 +7,9 @@
     omniauth_callbacks: 'users/omniauth_callbacks'
   }
 
-  resources :posts, only: %i[index show create]
+  resources :posts, only: %i[index show create] do
+    resources :likes, only: %i[create destroy]
+  end
   resources :users, only: %i[show edit update]
   resources :comments, only: %i[create]
 

db/migrate/20230919125800_create_likes.rb

@@ -8,5 +8,7 @@ def change
 
       t.timestamps
     end
+
+    add_index :likes, %i[user_id post_id], unique: true
   end
 end

db/seeds.rb

@@ -39,7 +39,7 @@
     user_id: user_ids.reject { |id| id == post.user_id }.sample,
     post_id: post.id
   )
-  5.times do |m|
+  rand(1..10).times do |m|
     Comment.create!(
       user_id: user_ids.reject { |id| id == post.user_id }.sample,
       post_id: post.id,

spec/requests/likes_spec.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+require 'rails_helper'
+
+RSpec.describe 'Likes', type: :request do
+  describe 'GET /index' do
+    pending "add some examples (or delete) #{__FILE__}"
+  end
+end