From e9f9309ddc640960ffe4e80c960a536d77b133e7 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Sun, 5 Sep 2021 15:13:13 +0900
Subject: [PATCH 01/25] =?UTF-8?q?Following=E3=83=86=E3=83=BC=E3=83=96?=
 =?UTF-8?q?=E3=83=AB=E3=81=ABwatch=E3=82=92=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

現行のフォローは自動でWatchされるため、defaultをtrueに設定
---
 db/migrate/20210905061726_add_watch_to_followings.rb | 5 +++++
 db/schema.rb                                         | 1 +
 2 files changed, 6 insertions(+)
 create mode 100644 db/migrate/20210905061726_add_watch_to_followings.rb

diff --git a/db/migrate/20210905061726_add_watch_to_followings.rb b/db/migrate/20210905061726_add_watch_to_followings.rb
new file mode 100644
index 00000000000..89582da1cf6
--- /dev/null
+++ b/db/migrate/20210905061726_add_watch_to_followings.rb
@@ -0,0 +1,5 @@
+class AddWatchToFollowings < ActiveRecord::Migration[6.1]
+  def change
+    add_column :followings, :watch, :boolean, default: true, null: false
+  end
+end
diff --git a/db/schema.rb b/db/schema.rb
index 04d8c172c90..7df974ba33e 100644
--- a/db/schema.rb
+++ b/db/schema.rb
@@ -173,6 +173,7 @@
     t.integer "followed_id"
     t.datetime "created_at", precision: 6, null: false
     t.datetime "updated_at", precision: 6, null: false
+    t.boolean "watch", default: true, null: false
     t.index ["followed_id"], name: "index_followings_on_followed_id"
     t.index ["follower_id", "followed_id"], name: "index_followings_on_follower_id_and_followed_id", unique: true
     t.index ["follower_id"], name: "index_followings_on_follower_id"

From 4b348e8aac63f160b5c79a7b0e4154cb4f7a07f8 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Sun, 5 Sep 2021 18:13:23 +0900
Subject: [PATCH 02/25] =?UTF-8?q?watch=3Dfalse=E3=81=AE=E5=A0=B4=E5=90=88?=
 =?UTF-8?q?=E3=80=81=E8=87=AA=E5=8B=95=E7=9A=84=E3=81=ABWatch=E3=81=97?=
 =?UTF-8?q?=E3=81=AA=E3=81=84=E3=82=88=E3=81=86=E3=81=AB=E3=81=97=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/controllers/api/followings_controller.rb | 3 ++-
 app/models/report_callbacks.rb               | 2 +-
 app/models/user.rb                           | 8 +++++++-
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/app/controllers/api/followings_controller.rb b/app/controllers/api/followings_controller.rb
index c88af55e8ac..f1018da03b9 100644
--- a/app/controllers/api/followings_controller.rb
+++ b/app/controllers/api/followings_controller.rb
@@ -5,7 +5,8 @@ class API::FollowingsController < API::BaseController
 
   def create
     user = User.find(params[:id])
-    if current_user.follow(user)
+    watch = params[:watch] == 'true'
+    if current_user.follow(user, watch)
       render json: { id: user.id }
     else
       head :bad_request
diff --git a/app/models/report_callbacks.rb b/app/models/report_callbacks.rb
index d7f23b41dcc..aa4d556f53d 100644
--- a/app/models/report_callbacks.rb
+++ b/app/models/report_callbacks.rb
@@ -52,7 +52,7 @@ def notify_advisers(report)
   def notify_followers(report)
     report.user.followers.each do |follower|
       NotificationFacade.following_report(report, follower)
-      create_following_watch(report, follower)
+      create_following_watch(report, follower) if follower.auto_watching?(report.user)
     end
   end
 
diff --git a/app/models/user.rb b/app/models/user.rb
index fdfc9c0030b..c13955abdb1 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -514,8 +514,10 @@ def active_practice
     active_practices.first.id
   end
 
-  def follow(other_user)
+  def follow(other_user, watch)
     following << other_user
+    following_row = Following.find_by(follower_id: self, followed_id: other_user)
+    following_row.update(watch: watch)
   end
 
   def unfollow(other_user)
@@ -526,6 +528,10 @@ def following?(other_user)
     following.include?(other_user)
   end
 
+  def auto_watching?(other_user)
+    Following.find_by(follower_id: self, followed_id: other_user).watch
+  end
+
   def completed_all_practices?(category)
     category.practices.size == completed_practices_size(category)
   end

From 24867f0e8bb0783e5b355499c3397d34c4bd01a9 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Sun, 5 Sep 2021 18:31:55 +0900
Subject: [PATCH 03/25] =?UTF-8?q?Following.watch=E3=82=92=E5=88=87?=
 =?UTF-8?q?=E3=82=8A=E6=9B=BF=E3=81=88=E3=82=89=E3=82=8C=E3=82=8B=E3=82=88?=
 =?UTF-8?q?=E3=81=86=E3=81=AB=E3=81=97=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/controllers/api/followings_controller.rb | 10 ++++++++++
 app/models/user.rb                           |  6 +++++-
 config/routes.rb                             |  2 +-
 3 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/app/controllers/api/followings_controller.rb b/app/controllers/api/followings_controller.rb
index f1018da03b9..0ba4fa2a104 100644
--- a/app/controllers/api/followings_controller.rb
+++ b/app/controllers/api/followings_controller.rb
@@ -13,6 +13,16 @@ def create
     end
   end
 
+  def update
+    user = User.find(params[:id])
+    watch = params[:watch] == 'true'
+    if current_user.change_watching(user, watch)
+      head :no_content
+    else
+      head :bad_request
+    end
+  end
+
   def destroy
     user = User.find(params[:id])
     if current_user.unfollow(user)
diff --git a/app/models/user.rb b/app/models/user.rb
index c13955abdb1..d083c7e1f01 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -516,8 +516,12 @@ def active_practice
 
   def follow(other_user, watch)
     following << other_user
+    change_watching(other_user, watch)
+  end
+
+  def change_watching(other_user, watch)
     following_row = Following.find_by(follower_id: self, followed_id: other_user)
-    following_row.update(watch: watch)
+    following_row.update!(watch: watch)
   end
 
   def unfollow(other_user)
diff --git a/config/routes.rb b/config/routes.rb
index 8f05290289f..bc0f9d525ec 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -58,7 +58,7 @@
     resources :tags, only: %i(index)
     resources :pages, only: %i(update)
     resources :questions, only: %i(show update)
-    resources :followings, only: %i(create destroy)
+    resources :followings, only: %i(create update destroy)
     namespace :products do
       resources :unchecked, only: %i(index)
       resources :not_responded, only: %i(index)

From 50a49ed61938921438ea8f1be3069ebddc932566 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Tue, 7 Sep 2021 12:07:04 +0900
Subject: [PATCH 04/25] =?UTF-8?q?=E3=83=93=E3=83=A5=E3=83=BC=E5=81=B4?=
 =?UTF-8?q?=E3=81=A7=E3=83=95=E3=82=A9=E3=83=AD=E3=83=BC=E3=81=A7=E3=81=8D?=
 =?UTF-8?q?=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB=E3=81=97=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/javascript/following.js                  | 4 +++-
 app/javascript/following.vue                 | 8 +++++---
 app/javascript/user.vue                      | 6 +++++-
 app/models/user.rb                           | 2 +-
 app/views/api/users/_list_user.json.jbuilder | 1 +
 app/views/users/show.html.slim               | 2 +-
 6 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/app/javascript/following.js b/app/javascript/following.js
index 893f7113574..284d7ae546e 100644
--- a/app/javascript/following.js
+++ b/app/javascript/following.js
@@ -8,13 +8,15 @@ document.addEventListener('DOMContentLoaded', () => {
       const following = followings[i]
       const isFollowing = following.getAttribute('data-is-following')
       const userId = following.getAttribute('data-user-id')
+      const isWatching = following.getAttribute('data-is-watching')
 
       new Vue({
         render: (h) =>
           h(Following, {
             props: {
               isFollowing: isFollowing === 'true',
-              userId: Number(userId)
+              userId: Number(userId),
+              isWatching: isWatching === 'true',
             }
           })
       }).$mount('.js-following')
diff --git a/app/javascript/following.vue b/app/javascript/following.vue
index 42cfd66bd0b..d31021c9a0c 100644
--- a/app/javascript/following.vue
+++ b/app/javascript/following.vue
@@ -3,7 +3,8 @@ button.card-main-actions__action.a-button.is-sm.is-block(
   :class='following ? "is-danger" : "is-secondary"',
   @click='followOrUnfollow'
 )
-  | {{ buttonLabel }}
+  | {{ isWatching ? "✔︎" : "" }}
+  | コメントあり
 </template>
 <script>
 import 'whatwg-fetch'
@@ -11,7 +12,8 @@ import 'whatwg-fetch'
 export default {
   props: {
     isFollowing: { type: Boolean, required: true },
-    userId: { type: Number, required: true }
+    userId: { type: Number, required: true },
+    isWatching : { type: Boolean, required: true },
   },
   data() {
     return {
@@ -25,7 +27,7 @@ export default {
     url() {
       return this.following
         ? `/api/followings/${this.userId}`
-        : '/api/followings'
+        : '/api/followings?watch=true'
     },
     verb() {
       return this.following ? 'DELETE' : 'POST'
diff --git a/app/javascript/user.vue b/app/javascript/user.vue
index 1c563329359..11cd3daf650 100644
--- a/app/javascript/user.vue
+++ b/app/javascript/user.vue
@@ -52,7 +52,11 @@
         .card-main-actions
           ul.card-main-actions__items
             li.card-main-actions__item(v-if='currentUser.id != user.id')
-              following(:isFollowing='user.isFollowing', :userId='user.id')
+              following(
+                :isFollowing='user.isFollowing',
+                :userId='user.id',
+                :isWatching='user.isWatching'
+              )
             li.card-main-actions__item(v-if='currentUser.admin')
               a.card-main-actions__action.a-button.is-sm.is-secondary.is-block(
                 :href='user.edit_admin_user_path'
diff --git a/app/models/user.rb b/app/models/user.rb
index d083c7e1f01..fdf226e6170 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -533,7 +533,7 @@ def following?(other_user)
   end
 
   def auto_watching?(other_user)
-    Following.find_by(follower_id: self, followed_id: other_user).watch
+    following?(other_user) ? Following.find_by(follower_id: self, followed_id: other_user).watch : false
   end
 
   def completed_all_practices?(category)
diff --git a/app/views/api/users/_list_user.json.jbuilder b/app/views/api/users/_list_user.json.jbuilder
index bfb1ee5798f..93d3f1491f3 100644
--- a/app/views/api/users/_list_user.json.jbuilder
+++ b/app/views/api/users/_list_user.json.jbuilder
@@ -13,6 +13,7 @@ json.experience_name t("activerecord.enums.user.experience.#{user.experience}")
 json.student_or_trainee user.student_or_trainee?
 json.edit_admin_user_path edit_admin_user_path(user)
 json.isFollowing current_user.following?(user)
+json.isWatching current_user.auto_watching?(user)
 
 json.company do
   if user.company.present?
diff --git a/app/views/users/show.html.slim b/app/views/users/show.html.slim
index 74b7f3909ab..fd101f87f96 100644
--- a/app/views/users/show.html.slim
+++ b/app/views/users/show.html.slim
@@ -60,7 +60,7 @@ header.page-header
                 ul.card-main-actions__items
                   - unless current_user == @user
                     li.card-main-actions__item
-                      .js-following(data-is-following="#{current_user.following?(@user)}" data-user-id="#{@user.id}")
+                      .js-following(data-is-following="#{current_user.following?(@user)}" data-user-id="#{@user.id}" data-is-watching="#{current_user.auto_watching?(@user)}")
                   - if current_user == @user
                     li.card-main-actions__item
                       = link_to '登録情報変更', edit_current_user_path, class: 'card-main-actions__action a-button is-md is-secondary is-block'

From 74ce8105a1158a94a8d2be71d7dd76d4a85878af Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Tue, 7 Sep 2021 12:15:05 +0900
Subject: [PATCH 05/25] =?UTF-8?q?=E3=82=B3=E3=83=A1=E3=83=B3=E3=83=88?=
 =?UTF-8?q?=E3=81=AA=E3=81=97=E3=83=9C=E3=82=BF=E3=83=B3=E3=82=92=E8=BF=BD?=
 =?UTF-8?q?=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/javascript/following.js  |  2 +-
 app/javascript/following.vue | 39 ++++++++++++++++++++++++------------
 2 files changed, 27 insertions(+), 14 deletions(-)

diff --git a/app/javascript/following.js b/app/javascript/following.js
index 284d7ae546e..ef86f606acd 100644
--- a/app/javascript/following.js
+++ b/app/javascript/following.js
@@ -16,7 +16,7 @@ document.addEventListener('DOMContentLoaded', () => {
             props: {
               isFollowing: isFollowing === 'true',
               userId: Number(userId),
-              isWatching: isWatching === 'true',
+              isWatching: isWatching === 'true'
             }
           })
       }).$mount('.js-following')
diff --git a/app/javascript/following.vue b/app/javascript/following.vue
index d31021c9a0c..11e2c86a75b 100644
--- a/app/javascript/following.vue
+++ b/app/javascript/following.vue
@@ -1,10 +1,19 @@
 <template lang="pug">
-button.card-main-actions__action.a-button.is-sm.is-block(
-  :class='following ? "is-danger" : "is-secondary"',
-  @click='followOrUnfollow'
-)
-  | {{ isWatching ? "✔︎" : "" }}
-  | コメントあり
+ul
+  li
+    button.card-main-actions__action.a-button.is-sm.is-block(
+      :class='following&&watching ? "is-danger" : "is-secondary"',
+      @click='followOrUnfollow(true)'
+    )
+      | {{ watching ? "✔︎" : "" }}
+      | コメントあり
+  li
+    button.card-main-actions__action.a-button.is-sm.is-block(
+      :class='following&&!watching ? "is-danger" : "is-secondary"',
+      @click='followOrUnfollow(false)'
+    )
+      | {{ following&&!watching ? "✔︎" : "" }}
+      | コメントなし
 </template>
 <script>
 import 'whatwg-fetch'
@@ -17,17 +26,20 @@ export default {
   },
   data() {
     return {
-      following: this.isFollowing
+      following: this.isFollowing,
+      watching: this.isWatching,
     }
   },
   computed: {
     buttonLabel() {
       return this.following ? 'フォローを解除' : '日報をフォロー'
     },
-    url() {
-      return this.following
-        ? `/api/followings/${this.userId}`
-        : '/api/followings?watch=true'
+    url: () => {
+      return function (isWatch) {
+        return this.following
+            ? `/api/followings/${this.userId}`
+            : `/api/followings?watch=${isWatch}`
+      }
     },
     verb() {
       return this.following ? 'DELETE' : 'POST'
@@ -43,11 +55,11 @@ export default {
       const meta = document.querySelector('meta[name="csrf-token"]')
       return meta ? meta.getAttribute('content') : ''
     },
-    followOrUnfollow() {
+    followOrUnfollow(isWatch) {
       const params = {
         id: this.userId
       }
-      fetch(this.url, {
+      fetch(this.url(isWatch), {
         method: this.verb,
         headers: {
           'Content-Type': 'application/json; charset=utf-8',
@@ -61,6 +73,7 @@ export default {
         .then((response) => {
           if (response.ok) {
             this.following = !this.following
+            this.watching = isWatch
           } else {
             alert(this.errorMessage)
           }

From 2eceba38f799316ed5ca72f7c6e4918a8c3d4bf2 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Tue, 7 Sep 2021 12:51:46 +0900
Subject: [PATCH 06/25] =?UTF-8?q?=E3=83=95=E3=82=A9=E3=83=AD=E3=83=BC?=
 =?UTF-8?q?=E3=81=97=E3=81=AA=E3=81=84=E3=83=9C=E3=82=BF=E3=83=B3=E3=82=92?=
 =?UTF-8?q?=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/javascript/following.vue | 64 ++++++++++++++++++++++++++----------
 1 file changed, 47 insertions(+), 17 deletions(-)

diff --git a/app/javascript/following.vue b/app/javascript/following.vue
index 11e2c86a75b..0b48dfb1e6f 100644
--- a/app/javascript/following.vue
+++ b/app/javascript/following.vue
@@ -1,19 +1,20 @@
 <template lang="pug">
 ul
   li
-    button.card-main-actions__action.a-button.is-sm.is-block(
-      :class='following&&watching ? "is-danger" : "is-secondary"',
-      @click='followOrUnfollow(true)'
-    )
-      | {{ watching ? "✔︎" : "" }}
+    button(v-if='following && watching')
+      | ✔︎ コメントあり
+    button(v-else, @click='followOrChangeFollow(true)')
       | コメントあり
   li
-    button.card-main-actions__action.a-button.is-sm.is-block(
-      :class='following&&!watching ? "is-danger" : "is-secondary"',
-      @click='followOrUnfollow(false)'
-    )
-      | {{ following&&!watching ? "✔︎" : "" }}
+    button(v-if='following && !watching')
+      | ✔︎ コメントなし
+    button(v-else, @click='followOrChangeFollow(false)')
       | コメントなし
+  li
+    button(v-if='!following')
+      | ✔︎ フォローしない
+    button(v-else, @click='unfollow')
+      | フォローしない
 </template>
 <script>
 import 'whatwg-fetch'
@@ -22,12 +23,12 @@ export default {
   props: {
     isFollowing: { type: Boolean, required: true },
     userId: { type: Number, required: true },
-    isWatching : { type: Boolean, required: true },
+    isWatching: { type: Boolean, required: true }
   },
   data() {
     return {
       following: this.isFollowing,
-      watching: this.isWatching,
+      watching: this.isWatching
     }
   },
   computed: {
@@ -37,12 +38,12 @@ export default {
     url: () => {
       return function (isWatch) {
         return this.following
-            ? `/api/followings/${this.userId}`
-            : `/api/followings?watch=${isWatch}`
+          ? `/api/followings/${this.userId}?watch=${isWatch}`
+          : `/api/followings?watch=${isWatch}`
       }
     },
     verb() {
-      return this.following ? 'DELETE' : 'POST'
+      return this.following ? 'PATCH' : 'POST'
     },
     errorMessage() {
       return this.following
@@ -55,7 +56,7 @@ export default {
       const meta = document.querySelector('meta[name="csrf-token"]')
       return meta ? meta.getAttribute('content') : ''
     },
-    followOrUnfollow(isWatch) {
+    followOrChangeFollow(isWatch) {
       const params = {
         id: this.userId
       }
@@ -72,7 +73,9 @@ export default {
       })
         .then((response) => {
           if (response.ok) {
-            this.following = !this.following
+            if (!this.following) {
+              this.following = true
+            }
             this.watching = isWatch
           } else {
             alert(this.errorMessage)
@@ -81,6 +84,33 @@ export default {
         .catch((error) => {
           console.warn('Failed to parsing', error)
         })
+    },
+    unfollow() {
+      const params = {
+        id: this.userId
+      }
+      fetch(this.url(''), {
+        method: 'DELETE',
+        headers: {
+          'Content-Type': 'application/json; charset=utf-8',
+          'X-Requested-With': 'XMLHttpRequest',
+          'X-CSRF-Token': this.token()
+        },
+        credentials: 'same-origin',
+        redirect: 'manual',
+        body: JSON.stringify(params)
+      })
+        .then((response) => {
+          if (response.ok) {
+            this.following = false
+            this.watching = false
+          } else {
+            alert(this.errorMessage)
+          }
+        })
+        .catch((error) => {
+          console.warn('Failed to parsing', error)
+        })
     }
   }
 }

From 767538aebb8d9edc09d3d980a1a4b9044793849f Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Mon, 13 Sep 2021 14:55:18 +0900
Subject: [PATCH 07/25] =?UTF-8?q?users=E3=81=AB=E3=82=AF=E3=82=A8=E3=83=AA?=
 =?UTF-8?q?=E3=83=91=E3=83=A9=E3=83=A1=E3=83=BC=E3=82=BF=E3=81=ABwatch?=
 =?UTF-8?q?=E3=82=92=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/controllers/api/users_controller.rb   | 3 ++-
 app/controllers/users_controller.rb       | 3 ++-
 app/javascript/users.vue                  | 3 ++-
 app/models/user.rb                        | 8 ++++++++
 app/views/users/_followings_nav.html.slim | 8 ++++++++
 app/views/users/index.html.slim           | 9 ++++++++-
 config/locales/ja.yml                     | 4 ++++
 7 files changed, 34 insertions(+), 4 deletions(-)
 create mode 100644 app/views/users/_followings_nav.html.slim

diff --git a/app/controllers/api/users_controller.rb b/app/controllers/api/users_controller.rb
index 7bbb461791e..bf0684e45a6 100644
--- a/app/controllers/api/users_controller.rb
+++ b/app/controllers/api/users_controller.rb
@@ -9,10 +9,11 @@ def index
     @tag = params[:tag]
     @target = params[:target]
     @target = 'student_and_trainee' unless target_allowlist.include?(@target)
+    @watch = params[:watch]
 
     target_users =
       if @target == 'followings'
-        followings = Following.where(follower_id: current_user.id).select('followed_id')
+        followings = current_user.following_list(@watch)
         User.where(id: followings)
       elsif params[:tag]
         User.tagged_with(params[:tag])
diff --git a/app/controllers/users_controller.rb b/app/controllers/users_controller.rb
index 42de99ff5a8..97f67238274 100644
--- a/app/controllers/users_controller.rb
+++ b/app/controllers/users_controller.rb
@@ -9,10 +9,11 @@ class UsersController < ApplicationController
   def index
     @target = params[:target]
     @target = 'student_and_trainee' unless target_allowlist.include?(@target)
+    @watch = params[:watch]
 
     target_users =
       if @target == 'followings'
-        followings = Following.where(follower_id: current_user.id).select('followed_id')
+        followings = current_user.following_list(@watch)
         User.where(id: followings)
       elsif params[:tag]
         User.tagged_with(params[:tag])
diff --git a/app/javascript/users.vue b/app/javascript/users.vue
index acdc62dd725..b385bba5d63 100644
--- a/app/javascript/users.vue
+++ b/app/javascript/users.vue
@@ -54,7 +54,8 @@ export default {
         '/api/users/' +
         (this.params.tag ? `tags/${this.params.tag}` : '') +
         `?page=${this.currentPage}` +
-        (this.params.target ? `&target=${this.params.target}` : '')
+        (this.params.target ? `&target=${this.params.target}` : '') +
+        (this.params.watch ? `&watch=${this.params.watch}` : '')
       )
     },
     pagerProps() {
diff --git a/app/models/user.rb b/app/models/user.rb
index fdf226e6170..9de2308b2ee 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -536,6 +536,14 @@ def auto_watching?(other_user)
     following?(other_user) ? Following.find_by(follower_id: self, followed_id: other_user).watch : false
   end
 
+  def following_list(watch = '')
+    if %w[true false].include?(watch)
+      Following.where(follower_id: self, watch: watch).select('followed_id')
+    else
+      Following.where(follower_id: self).select('followed_id')
+    end
+  end
+
   def completed_all_practices?(category)
     category.practices.size == completed_practices_size(category)
   end
diff --git a/app/views/users/_followings_nav.html.slim b/app/views/users/_followings_nav.html.slim
new file mode 100644
index 00000000000..aeab7492124
--- /dev/null
+++ b/app/views/users/_followings_nav.html.slim
@@ -0,0 +1,8 @@
+nav.tab-nav
+  .container.is-padding-horizontal-0-sm-down
+    ul.tab-nav__items
+      li.tab-nav__item
+        = link_to t('watch.all'), users_path(target: @target), class: "tab-nav__item-link #{'is-active' if @watch.nil?}".strip
+      - %w[true false].each do |watch|
+        li.tab-nav__item
+          = link_to t("watch.#{watch}"), users_path(target: @target, watch: watch), class: (@watch == watch ? ['is-active'] : []) << 'tab-nav__item-link'
diff --git a/app/views/users/index.html.slim b/app/views/users/index.html.slim
index 8252ee53e6e..9c8c242bcb6 100644
--- a/app/views/users/index.html.slim
+++ b/app/views/users/index.html.slim
@@ -14,6 +14,10 @@ header.page-header.is-border-bottom-none
   .page-tools
     = render 'nav'
 
+- if params[:target] == 'followings'
+  .page-tools
+    = render 'followings_nav'
+
 - unless params[:tag]
   .a-page-notice.page-notice
     .container
@@ -40,5 +44,8 @@ main.page-main
                     = link_to 'このタグを自分に追加', "/users/tags/#{params[:tag]}", method: 'post', class: 'a-button is-md is-secondary is-block'
         - else
           h1.page-main-header__title
-            | #{t("target.#{@target}")}（#{@users.total_count}）
+            - if @watch
+              | #{t("target.#{@target}")}：#{t("watch.#{@watch}")}（#{@users.total_count}）
+            - else
+              | #{t("target.#{@target}")}（#{@users.total_count}）
   #js-users
diff --git a/config/locales/ja.yml b/config/locales/ja.yml
index aa1b1965b51..68426e5d10d 100644
--- a/config/locales/ja.yml
+++ b/config/locales/ja.yml
@@ -226,6 +226,10 @@ ja:
     followings: フォロー中
     self_assigned_all: 全て
     self_assigned_no_replied: 未返信
+  watch:
+    all: すべて
+    true: コメントあり
+    false: コメントなし
   helpers:
     submit:
       create: 登録する

From d23dae66aeb1439c5fcd2b67c6dd325e13591aaa Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Mon, 13 Sep 2021 18:28:45 +0900
Subject: [PATCH 08/25] =?UTF-8?q?=E6=96=87=E8=A8=80=E3=83=BB=E3=83=87?=
 =?UTF-8?q?=E3=82=B6=E3=82=A4=E3=83=B3=E4=BB=AE=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/javascript/following.vue | 67 +++++++++++++++++++++++++++---------
 1 file changed, 50 insertions(+), 17 deletions(-)

diff --git a/app/javascript/following.vue b/app/javascript/following.vue
index 0b48dfb1e6f..60c64c83240 100644
--- a/app/javascript/following.vue
+++ b/app/javascript/following.vue
@@ -1,20 +1,26 @@
 <template lang="pug">
-ul
-  li
-    button(v-if='following && watching')
-      | ✔︎ コメントあり
-    button(v-else, @click='followOrChangeFollow(true)')
-      | コメントあり
-  li
-    button(v-if='following && !watching')
-      | ✔︎ コメントなし
-    button(v-else, @click='followOrChangeFollow(false)')
-      | コメントなし
-  li
-    button(v-if='!following')
-      | ✔︎ フォローしない
-    button(v-else, @click='unfollow')
-      | フォローしない
+details
+  summary
+    | {{ following ? "フォロー中" : "フォローする" }}
+  div
+    ul
+      li
+        button.select-menu-item(v-if='following && watching')
+          | ✔︎ コメントあり
+        button.select-menu-item(v-else, @click='followOrChangeFollow(true)')
+          | コメントあり
+        | フォローしたユーザーの日報を自動でWatch状態にします。日報投稿時の通知と日報にコメントが来た際に通知を受け取ります。
+      li
+        button.select-menu-item(v-if='following && !watching')
+          | ✔︎ コメントなし
+        button.select-menu-item(v-else, @click='followOrChangeFollow(false)')
+          | コメントなし
+        | フォローしたユーザーの日報はWatch状態にしません。日報投稿時の通知だけ通知を受けとります。
+      li
+        button.select-menu-item(v-if='!following')
+          | ✔︎ フォローしない
+        button.select-menu-item(v-else, @click='unfollow')
+          | フォローしない
 </template>
 <script>
 import 'whatwg-fetch'
@@ -115,4 +121,31 @@ export default {
   }
 }
 </script>
-<style scoped></style>
+<style scoped>
+details > div {
+  position: absolute;
+  display: block;
+  width: 300px;
+  border: 1px solid rgba(27, 31, 35, 0.15);
+  border-radius: 3px;
+  box-shadow: 0 3px 12px rgba(27, 31, 35, 0.15);
+  z-index: 100;
+  background-color: #ffffff;
+}
+
+details[open] > summary:before {
+  content: ' ';
+  display: block;
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 50;
+  background: transparent;
+}
+
+.select-menu-item {
+  display: flex;
+}
+</style>

From 665f94e9e2ca5674b14c6cd873131daf0ee2881d Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Tue, 14 Sep 2021 16:46:37 +0900
Subject: [PATCH 09/25] =?UTF-8?q?=E3=83=95=E3=82=A9=E3=83=AD=E3=83=BC?=
 =?UTF-8?q?=E3=83=9C=E3=82=BF=E3=83=B3=E3=81=AE=E8=A1=A8=E7=A4=BA=E3=82=92?=
 =?UTF-8?q?=E5=A4=89=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/javascript/following.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/app/javascript/following.vue b/app/javascript/following.vue
index 60c64c83240..a946c89f341 100644
--- a/app/javascript/following.vue
+++ b/app/javascript/following.vue
@@ -1,7 +1,7 @@
 <template lang="pug">
 details
   summary
-    | {{ following ? "フォロー中" : "フォローする" }}
+    | {{ buttonLabel }}
   div
     ul
       li
@@ -39,7 +39,11 @@ export default {
   },
   computed: {
     buttonLabel() {
-      return this.following ? 'フォローを解除' : '日報をフォロー'
+      if (this.following) {
+        return this.watching ? 'コメントあり' : 'コメントなし'
+      } else {
+        return 'フォローする'
+      }
     },
     url: () => {
       return function (isWatch) {

From ef101c88a729520177ef73eba182323de3d6bc5a Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Tue, 14 Sep 2021 17:02:42 +0900
Subject: [PATCH 10/25] =?UTF-8?q?users=E3=81=AE=E3=80=8C=E3=83=95=E3=82=A9?=
 =?UTF-8?q?=E3=83=AD=E3=83=BC=E4=B8=AD=E3=80=8D=E3=81=AE=E9=9A=8E=E5=B1=A4?=
 =?UTF-8?q?=E3=82=921=E6=AE=B5=E9=9A=8E=E3=81=82=E3=81=92=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/views/users/_lg_page_tabs.html.slim |  3 +++
 app/views/users/_nav.html.slim          | 23 +++++++++++++++--------
 app/views/users/index.html.slim         |  4 ----
 3 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/app/views/users/_lg_page_tabs.html.slim b/app/views/users/_lg_page_tabs.html.slim
index 737b9043907..a8407c9ff0d 100644
--- a/app/views/users/_lg_page_tabs.html.slim
+++ b/app/views/users/_lg_page_tabs.html.slim
@@ -10,3 +10,6 @@
       li.page-tabs__item
         = link_to users_tags_path, class: "page-tabs__item-link #{users_current_page_tab_or_not('tags')} #{current_page_tab_or_not('tags')}" do
           | タグ別
+      li.page-tabs__item
+        = link_to users_path(target: 'followings'), class: "page-tabs__item-link #{users_current_page_tab_or_not('followings')}" do
+          | フォロー中
diff --git a/app/views/users/_nav.html.slim b/app/views/users/_nav.html.slim
index 6f6552afe8c..d177654c451 100644
--- a/app/views/users/_nav.html.slim
+++ b/app/views/users/_nav.html.slim
@@ -1,11 +1,18 @@
 nav.tab-nav
   .container.is-padding-horizontal-0-sm-down
     ul.tab-nav__items
-      - targets = %w[student_and_trainee followings mentor graduate adviser trainee]
-      - if current_user.mentor?
-        - targets += %w[job_seeking all]
-      - elsif current_user.adviser?
-        - targets += %w[job_seeking]
-      - targets.each do |target|
-        li.tab-nav__item(class="#{%w[job_seeking all].include?(target) ? 'is-only-mentor is-only-adviser' : ''}")
-          = link_to t("target.#{target}"), users_path(target: target), class: (@target == target ? ['is-active'] : []) << 'tab-nav__item-link'
+      - if params[:target] == 'followings'
+        li.tab-nav__item
+          = link_to t('watch.all'), users_path(target: @target), class: "tab-nav__item-link #{'is-active' if @watch.nil?}".strip
+        - %w[true false].each do |watch|
+          li.tab-nav__item
+            = link_to t("watch.#{watch}"), users_path(target: @target, watch: watch), class: (@watch == watch ? ['is-active'] : []) << 'tab-nav__item-link'
+      - else
+        - targets = %w[student_and_trainee mentor graduate adviser trainee]
+        - if current_user.mentor?
+          - targets += %w[job_seeking all]
+        - elsif current_user.adviser?
+          - targets += %w[job_seeking]
+        - targets.each do |target|
+          li.tab-nav__item(class="#{%w[job_seeking all].include?(target) ? 'is-only-mentor is-only-adviser' : ''}")
+            = link_to t("target.#{target}"), users_path(target: target), class: (@target == target ? ['is-active'] : []) << 'tab-nav__item-link'
diff --git a/app/views/users/index.html.slim b/app/views/users/index.html.slim
index 9c8c242bcb6..5e0eaa8e578 100644
--- a/app/views/users/index.html.slim
+++ b/app/views/users/index.html.slim
@@ -14,10 +14,6 @@ header.page-header.is-border-bottom-none
   .page-tools
     = render 'nav'
 
-- if params[:target] == 'followings'
-  .page-tools
-    = render 'followings_nav'
-
 - unless params[:tag]
   .a-page-notice.page-notice
     .container

From 7fb7975f774664c54693b9394221562fe6e1b8c6 Mon Sep 17 00:00:00 2001
From: teppei machida <machida@fjord.jp>
Date: Fri, 17 Sep 2021 12:26:12 +0900
Subject: [PATCH 11/25] =?UTF-8?q?=E3=83=95=E3=82=A9=E3=83=AD=E3=83=BC?=
 =?UTF-8?q?=E3=83=9C=E3=82=BF=E3=83=B3=E3=81=AE=E3=83=87=E3=82=B6=E3=82=A4?=
 =?UTF-8?q?=E3=83=B3=E3=80=81=E3=82=BF=E3=83=96=E5=91=A8=E3=82=8A=E3=81=AE?=
 =?UTF-8?q?=E8=89=B2=E8=AA=BF=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/assets/stylesheets/atoms/_a-dropdown.sass |  10 ++
 .../blocks/header/_header-drop-down.sass      | 119 ------------------
 .../blocks/header/_header-dropdown.sass       |   4 +-
 .../stylesheets/blocks/page/_page-tabs.sass   |   2 +-
 .../stylesheets/blocks/shared/_tab-nav.sass   |   6 +-
 .../stylesheets/blocks/user/_following.sass   |  32 +++++
 .../stylesheets/initializers/_reset.sass      |   3 +-
 app/assets/stylesheets/mixins/_button.sass    |   2 +-
 app/assets/stylesheets/variables/_colors.sass |   2 +
 app/javascript/following.vue                  |  92 +++++++-------
 app/javascript/user-secret-attributes.vue     |   5 +
 app/javascript/user.vue                       |   5 -
 app/views/users/_user.html.slim               |   2 +-
 13 files changed, 102 insertions(+), 182 deletions(-)
 create mode 100644 app/assets/stylesheets/atoms/_a-dropdown.sass
 delete mode 100644 app/assets/stylesheets/blocks/header/_header-drop-down.sass
 create mode 100644 app/assets/stylesheets/blocks/user/_following.sass

diff --git a/app/assets/stylesheets/atoms/_a-dropdown.sass b/app/assets/stylesheets/atoms/_a-dropdown.sass
new file mode 100644
index 00000000000..c38fbe94133
--- /dev/null
+++ b/app/assets/stylesheets/atoms/_a-dropdown.sass
@@ -0,0 +1,10 @@
+.a-dropdown
+  overflow: hidden
+  background-color: $base
+  border: solid 1px $border-shade
+  box-shadow: rgba(black, .2) 0 0 .375rem
+  border-radius: .25rem
+
+.a-dropdown__item
+  &:not(:last-child)
+    border-bottom: solid 1px $border
diff --git a/app/assets/stylesheets/blocks/header/_header-drop-down.sass b/app/assets/stylesheets/blocks/header/_header-drop-down.sass
deleted file mode 100644
index 97c1d60b5d9..00000000000
--- a/app/assets/stylesheets/blocks/header/_header-drop-down.sass
+++ /dev/null
@@ -1,119 +0,0 @@
-.header-drop-down
-  +position(absolute, left 50%, top 3.5rem)
-  width: 16rem
-  margin-left: -7rem
-  display: none
-  +media-breakpoint-down(sm)
-    margin-left: -10rem
-    top: 2.5rem
-  .header-links__item.is-active &,
-  .header-show-mobile-nav.is-active &
-    display: block
-
-.header-drop-down__items
-  border: solid 1px #ccc
-  box-shadow: rgba(black, .1) 0 .0625rem .0625rem
-  background-color: $base
-  border-radius: .45rem
-  +position(relative, 2)
-  +media-breakpoint-down(sm)
-    width: 14rem
-    top: .5rem
-  &::before
-    content: ""
-    +size(0)
-    display: block
-    border-style: solid
-    border-width: 10px 10px
-    border-color: transparent
-    border-bottom-color: #ccc
-    +position(absolute, left 50%, top -20px)
-    margin-left: -10px
-    +media-breakpoint-down(sm)
-      left: 71%
-  &::after
-    content: ""
-    +size(0)
-    display: block
-    border-style: solid
-    border-width: 10px 10px
-    border-color: transparent
-    border-bottom-color: $base
-    +position(absolute, left 50%, top -18px)
-    margin-left: -10px
-    +media-breakpoint-down(sm)
-      left: 71%
-
-.header-drop-down__item
-  cursor: pointer
-
-.header-drop-down__item:not(:last-child)
-  border-bottom: solid 1px $background
-
-.header-drop-down__item-link
-  +text-block(.875rem 1.6, block $main)
-  padding: .5rem .75rem
-  transition: all .2s ease-in
-  .header-drop-down__item:first-child &
-    +border-radius(top, .25rem)
-  .header-drop-down__item:last-child &
-    +border-radius(bottom, .25rem)
-  &:hover
-    background-color: $background-more-tint
-
-
-
-
-.header-notification-icon
-  +text-block(1.25rem 1, center)
-  +media-breakpoint-down(sm)
-    +text-block(1.125rem 1)
-    .has-count &
-      color: $default-text
-
-.header-notification-count
-  background-color: $badge-color
-  +text-block(.625rem 1, center $reversal-text flex)
-  align-items: center
-  justify-content: center
-  border-radius: 1rem
-  position: absolute
-  +media-breakpoint-up(md)
-    +size(1.25rem .875rem)
-    +position(right .25rem, top .25rem)
-  +media-breakpoint-down(sm)
-    +size(1.125rem .75rem)
-    +position(right .125rem, top .125rem)
-
-.header-notifications-item__body
-  width: 100%
-  +media-breakpoint-up(md)
-    color: $default-text
-  +media-breakpoint-down(sm)
-    color: $reversal-text
-
-.header-notifications-item__user-icon
-  float: left
-  +size(2rem)
-  margin-right: .5rem
-  margin-bottom: .25rem
-
-.header-notifications-item__message
-  p
-    line-height: 1.45
-    margin-bottom: .375em
-    +media-breakpoint-up(md)
-      font-size: .8125rem
-    +media-breakpoint-down(sm)
-      font-size: .75rem
-
-.header-notifications-item_created-at
-  text-align: right
-  display: block
-  +media-breakpoint-up(md)
-    font-size: .75rem
-  +media-breakpoint-down(sm)
-    font-size: .625rem
-
-.header-drop-down__overlay
-  +position(fixed, left 0, top 0, right 0, bottom 0, 1)
diff --git a/app/assets/stylesheets/blocks/header/_header-dropdown.sass b/app/assets/stylesheets/blocks/header/_header-dropdown.sass
index 9fed3dc5956..3cef8269344 100644
--- a/app/assets/stylesheets/blocks/header/_header-dropdown.sass
+++ b/app/assets/stylesheets/blocks/header/_header-dropdown.sass
@@ -16,8 +16,8 @@
 
 .header-dropdown__inner
   +media-breakpoint-up(md)
-    background-color: $base
     +position(absolute, right 0, top 100%, 2)
+    background-color: $base
     border: solid 1px $border-shade
     width: 14rem
     box-shadow: rgba(black, .2) 0 0 .375rem
@@ -63,7 +63,7 @@
     .header-dropdown__item:not(:last-child) &
       border-bottom: solid 1px $background
     &:hover
-      background-color: $background-more-tint
+      background-color: $hover-background
   +media-breakpoint-down(sm)
     color: $reversal-text
     border-bottom: solid 1px $side-border
diff --git a/app/assets/stylesheets/blocks/page/_page-tabs.sass b/app/assets/stylesheets/blocks/page/_page-tabs.sass
index 974811ea124..a73a9428abc 100644
--- a/app/assets/stylesheets/blocks/page/_page-tabs.sass
+++ b/app/assets/stylesheets/blocks/page/_page-tabs.sass
@@ -31,7 +31,7 @@
 
 .page-tabs__item-link
   +flex-link
-  +text-block(.825rem 1, $default-text 600)
+  +text-block(.825rem 1, $semi-muted-text 600)
   align-items: center
   justify-content: center
   height: 2.75rem
diff --git a/app/assets/stylesheets/blocks/shared/_tab-nav.sass b/app/assets/stylesheets/blocks/shared/_tab-nav.sass
index 77ddfa29a86..0101424e07a 100644
--- a/app/assets/stylesheets/blocks/shared/_tab-nav.sass
+++ b/app/assets/stylesheets/blocks/shared/_tab-nav.sass
@@ -25,14 +25,14 @@
 
 .tab-nav__item-link
   +block-link
-  +text-block(.75rem 2.3, $muted-text center nowrap)
+  +text-block(.75rem 2.3, $semi-muted-text center nowrap)
   background-color: $background-shade
   border-radius: 20rem
   width: 7rem
   transition: all.2s ease-out
   &:hover
     background-color: shade($background-shade, 10%)
-    color: $main-text
+    color: $default-text
   &.is-active
     background-color: $accent
-    color: $main-text
+    color: $default-text
diff --git a/app/assets/stylesheets/blocks/user/_following.sass b/app/assets/stylesheets/blocks/user/_following.sass
new file mode 100644
index 00000000000..23bed703446
--- /dev/null
+++ b/app/assets/stylesheets/blocks/user/_following.sass
@@ -0,0 +1,32 @@
+.following
+  position: relative
+
+.following__dropdown
+  +position(absolute, 2)
+  width: 18.75rem
+
+.following-option
+  cursor: pointer
+  width: 100%
+  padding: .75rem
+  display: block
+  text-align: left
+  transition: all .2s ease-out
+  &:hover
+    background-color: $hover-background
+
+.following-option__inner
+  position: relative
+  padding-left: 1.5rem
+  .following-option.is-active &::before
+    +fa(fas '\f00c')
+    +position(absolute, left 0, top 0)
+
+.following-option__label
+  +text-block(.875rem 1.4, 600 $semi-muted-text)
+  .following-option.is-active &
+    color: $default-text
+
+.following-option__desciption
+  +text-block(.75rem 1.5, $muted-text)
+  margin-top: .125rem
diff --git a/app/assets/stylesheets/initializers/_reset.sass b/app/assets/stylesheets/initializers/_reset.sass
index d474b5d355f..37e171d17a7 100644
--- a/app/assets/stylesheets/initializers/_reset.sass
+++ b/app/assets/stylesheets/initializers/_reset.sass
@@ -50,5 +50,6 @@ hr
   border: none
 
 details,
-details *
+details *,
+summary
   box-sizing: border-box
diff --git a/app/assets/stylesheets/mixins/_button.sass b/app/assets/stylesheets/mixins/_button.sass
index e74570c05ae..ded79fb04c9 100644
--- a/app/assets/stylesheets/mixins/_button.sass
+++ b/app/assets/stylesheets/mixins/_button.sass
@@ -15,6 +15,7 @@
   &.is-block
     display: flex
     width: 100%
+    max-width: 100%
     &.is-select
       +margin(horizontal, 0)
   &:focus
@@ -30,7 +31,6 @@
     margin-right: .35em
     margin-top: .02em
     font-size: 1.07em
-    font-weight: normal
   &.is-icon
     i
       +text-block(1.3em 1)
diff --git a/app/assets/stylesheets/variables/_colors.sass b/app/assets/stylesheets/variables/_colors.sass
index 263d2b38485..9e408ecdf60 100644
--- a/app/assets/stylesheets/variables/_colors.sass
+++ b/app/assets/stylesheets/variables/_colors.sass
@@ -5,6 +5,8 @@ $background: #ececec
 $background-shade: #d6d6d6
 $background-tint: #eceeef
 $background-more-tint: #f7f7f9
+$hover-background: $background-more-tint
+
 
 $default-text: #403f47
 $reversal-text: white
diff --git a/app/javascript/following.vue b/app/javascript/following.vue
index a946c89f341..45651e31d9a 100644
--- a/app/javascript/following.vue
+++ b/app/javascript/following.vue
@@ -1,26 +1,48 @@
 <template lang="pug">
-details
-  summary
+details.following
+  summary.a-button.is-warning.is-md.is-block(v-if='following && watching')
+    i.fas.fa-check
+    span
+      | コメントあり
+  summary.a-button.is-warning.is-md.is-block(v-else-if='following && !watching')
+    i.fas.fa-check
+    span
+      | コメントなし
+  summary.a-button.is-secondary.is-md.is-block(v-else)
     | {{ buttonLabel }}
-  div
-    ul
-      li
-        button.select-menu-item(v-if='following && watching')
-          | ✔︎ コメントあり
-        button.select-menu-item(v-else, @click='followOrChangeFollow(true)')
-          | コメントあり
-        | フォローしたユーザーの日報を自動でWatch状態にします。日報投稿時の通知と日報にコメントが来た際に通知を受け取ります。
-      li
-        button.select-menu-item(v-if='following && !watching')
-          | ✔︎ コメントなし
-        button.select-menu-item(v-else, @click='followOrChangeFollow(false)')
-          | コメントなし
-        | フォローしたユーザーの日報はWatch状態にしません。日報投稿時の通知だけ通知を受けとります。
-      li
-        button.select-menu-item(v-if='!following')
-          | ✔︎ フォローしない
-        button.select-menu-item(v-else, @click='unfollow')
-          | フォローしない
+  .following__dropdown.a-dropdown
+    ul.a-dropdown__items
+      li.following__dropdown-item.a-dropdown__item
+        button.following-option.a-dropdown__item-inner.is-active(v-if='following && watching')
+          .following-option__inner
+            .following-option__label
+              | コメントあり
+        button.following-option.a-dropdown__item-inner(v-else, @click='followOrChangeFollow(true)')
+          .following-option__inner
+            .following-option__label
+              | コメントあり
+            .following-option__desciption
+              | フォローしたユーザーの日報を自動でWatch状態にします。日報投稿時の通知と日報にコメントが来た際に通知を受け取ります。
+      li.following__dropdown-item.a-dropdown__item
+        button.following-option.a-dropdown__item-inner.is-active(v-if='following && !watching')
+          .following-option__inner
+            .following-option__label
+              | コメントなし
+        button.following-option.a-dropdown__item-inner(v-else, @click='followOrChangeFollow(false)')
+          .following-option__inner
+            .following-option__label
+              | コメントなし
+            .following-option__desciption
+              | フォローしたユーザーの日報はWatch状態にしません。日報投稿時の通知だけ通知を受けとります。
+      li.following__dropdown-item.a-dropdown__item
+        button.following-option.a-dropdown__item-inner.is-active(v-if='!following')
+          .following-option__inner
+            .following-option__label
+              | フォローしない
+        button.following-option.a-dropdown__item-inner(v-else, @click='unfollow')
+          .following-option__inner
+            .following-option__label
+              | フォローしない
 </template>
 <script>
 import 'whatwg-fetch'
@@ -125,31 +147,3 @@ export default {
   }
 }
 </script>
-<style scoped>
-details > div {
-  position: absolute;
-  display: block;
-  width: 300px;
-  border: 1px solid rgba(27, 31, 35, 0.15);
-  border-radius: 3px;
-  box-shadow: 0 3px 12px rgba(27, 31, 35, 0.15);
-  z-index: 100;
-  background-color: #ffffff;
-}
-
-details[open] > summary:before {
-  content: ' ';
-  display: block;
-  position: fixed;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 50;
-  background: transparent;
-}
-
-.select-menu-item {
-  display: flex;
-}
-</style>
diff --git a/app/javascript/user-secret-attributes.vue b/app/javascript/user-secret-attributes.vue
index 3061323721f..a507b22032c 100644
--- a/app/javascript/user-secret-attributes.vue
+++ b/app/javascript/user-secret-attributes.vue
@@ -27,6 +27,11 @@
         :class='{ "is-important": isInactive }'
       )
         | {{ user.updated_at }}
+  .user-secret-attributes__action(v-if='currentUser.admin')
+    a.card-main-actions__action.a-button.is-sm.is-secondary.is-block(
+      :href='user.edit_admin_user_path'
+    )
+      | 管理者として変更
 </template>
 <script>
 export default {
diff --git a/app/javascript/user.vue b/app/javascript/user.vue
index 11cd3daf650..772c4cfe2c4 100644
--- a/app/javascript/user.vue
+++ b/app/javascript/user.vue
@@ -57,11 +57,6 @@
                 :userId='user.id',
                 :isWatching='user.isWatching'
               )
-            li.card-main-actions__item(v-if='currentUser.admin')
-              a.card-main-actions__action.a-button.is-sm.is-secondary.is-block(
-                :href='user.edit_admin_user_path'
-              )
-                | 管理者として変更
 </template>
 <script>
 import UserSecretAttributes from './user-secret-attributes.vue'
diff --git a/app/views/users/_user.html.slim b/app/views/users/_user.html.slim
index 4cf233da966..8a3bbfbb8c1 100644
--- a/app/views/users/_user.html.slim
+++ b/app/views/users/_user.html.slim
@@ -45,6 +45,6 @@
               li.card-main-actions__item
                 .js-following(data-is-following="#{current_user.following?(user)}" data-user-id="#{user.id}")
             - if current_user.admin?
-              li.card-main-actions__item
+              li.card-main-actions__item.is-only-mentor
                 = link_to edit_admin_user_path(user), class: 'card-main-actions__action a-button is-sm is-secondary is-block' do
                   | 管理者として変更

From df2fb34ce2fe2c9c1929ebb317e6695fbe309461 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Sun, 19 Sep 2021 16:19:04 +0900
Subject: [PATCH 12/25] =?UTF-8?q?=E3=83=A2=E3=83=87=E3=83=AB=E3=83=86?=
 =?UTF-8?q?=E3=82=B9=E3=83=88=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test/models/user_test.rb | 43 ++++++++++++++++++++++++++++++++++++----
 1 file changed, 39 insertions(+), 4 deletions(-)

diff --git a/test/models/user_test.rb b/test/models/user_test.rb
index a774bd349f8..ba69a9af12a 100644
--- a/test/models/user_test.rb
+++ b/test/models/user_test.rb
@@ -280,14 +280,23 @@ class UserTest < ActiveSupport::TestCase
   test '#follow' do
     kimura = users(:kimura)
     hatsuno = users(:hatsuno)
-    kimura.follow(hatsuno)
-    assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id)
+    kimura.follow(hatsuno, true)
+    assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id, watch: true)
+  end
+
+  test '#change_watching' do
+    kimura = users(:kimura)
+    hatsuno = users(:hatsuno)
+    kimura.follow(hatsuno, true)
+    assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id, watch: true)
+    kimura.change_watching(hatsuno, false)
+    assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id, watch: false)
   end
 
   test '#unfollow' do
     kimura = users(:kimura)
     hatsuno = users(:hatsuno)
-    kimura.follow(hatsuno)
+    kimura.follow(hatsuno, true)
     assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id)
     kimura.unfollow(hatsuno)
     assert_nil Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id)
@@ -298,11 +307,37 @@ class UserTest < ActiveSupport::TestCase
     hatsuno = users(:hatsuno)
     kimura.following?(hatsuno)
     assert_not kimura.following?(hatsuno)
-    kimura.follow(hatsuno)
+    kimura.follow(hatsuno, true)
     kimura.following?(hatsuno)
     assert kimura.following?(hatsuno)
   end
 
+  test '#auto_watching' do
+    kimura = users(:kimura)
+    hatsuno = users(:hatsuno)
+    kimura.following?(hatsuno)
+    assert_not kimura.auto_watching?(hatsuno)
+    kimura.follow(hatsuno, false)
+    kimura.following?(hatsuno)
+    assert_not kimura.auto_watching?(hatsuno)
+    kimura.change_watching(hatsuno, true)
+    kimura.following?(hatsuno)
+    assert kimura.auto_watching?(hatsuno)
+  end
+
+  test '#following_list ' do
+    kimura = users(:kimura)
+    hatsuno = users(:hatsuno)
+    hajime = users(:hajime)
+    yamada = users(:yamada)
+    kimura.follow(hatsuno, true)
+    kimura.follow(hajime, true)
+    kimura.follow(yamada, false)
+    assert_equal 3, kimura.following_list.count
+    assert_equal 2, kimura.following_list('true').count
+    assert_equal 1, kimura.following_list('false').count
+  end
+
   test '#completed_practices_size' do
     kimura = users(:kimura)
     category2 = categories(:category2)

From 455966a28ad00409b6780578c25b7f10fb6072c7 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Sun, 19 Sep 2021 16:19:13 +0900
Subject: [PATCH 13/25] =?UTF-8?q?=E3=82=B7=E3=82=B9=E3=83=86=E3=83=A0?=
 =?UTF-8?q?=E3=83=86=E3=82=B9=E3=83=88=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test/models/user_test.rb       |  4 +-
 test/system/followings_test.rb | 87 +++++++++++++++++++++++++++++-----
 2 files changed, 78 insertions(+), 13 deletions(-)

diff --git a/test/models/user_test.rb b/test/models/user_test.rb
index ba69a9af12a..46e40d0f440 100644
--- a/test/models/user_test.rb
+++ b/test/models/user_test.rb
@@ -353,9 +353,9 @@ class UserTest < ActiveSupport::TestCase
   test "don't unfollow user when other user unfollow user" do
     kimura = users(:kimura)
     hatsuno = users(:hatsuno)
-    kimura.follow(hatsuno)
+    kimura.follow(hatsuno, true)
     daimyo = users(:daimyo)
-    daimyo.follow(hatsuno)
+    daimyo.follow(hatsuno, true)
     assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id)
     daimyo.unfollow(hatsuno)
     assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id)
diff --git a/test/system/followings_test.rb b/test/system/followings_test.rb
index b1f3605b7f4..44a85399d11 100644
--- a/test/system/followings_test.rb
+++ b/test/system/followings_test.rb
@@ -3,30 +3,84 @@
 require 'application_system_test_case'
 
 class FollowingsTest < ApplicationSystemTestCase
-  test 'follow' do
+  test 'follow with comments' do
     visit_with_auth user_path(users(:hatsuno)), 'kimura'
-    click_button '日報をフォロー'
-    assert_button 'フォローを解除'
+    find('.following').click
+    click_button 'コメントあり'
+    assert_selector 'summary', text: 'コメントあり'
+  end
+
+  test 'follow with no comments' do
+    visit_with_auth user_path(users(:hatsuno)), 'kimura'
+    find('.following').click
+    click_button 'コメントなし'
+    assert_selector 'summary', text: 'コメントなし'
   end
 
   test 'unfollow' do
     visit_with_auth user_path(users(:hatsuno)), 'kimura'
-    click_button '日報をフォロー'
-    click_button 'フォローを解除'
-    assert_button '日報をフォロー'
+    find('.following').click
+    click_button 'コメントあり'
+    click_button 'フォローしない'
+    assert_selector 'summary', text: 'フォローする'
   end
 
-  test 'show following lists' do
+  test 'show all following lists' do
     visit_with_auth user_path(users(:hatsuno)), 'kimura'
-    click_button '日報をフォロー'
-    assert_text 'フォローを解除'
+    find('.following').click
+    click_button 'コメントあり'
+    assert_selector 'summary', text: 'コメントあり'
+
+    visit_with_auth user_path(users(:yamada)), 'kimura'
+    find('.following').click
+    click_button 'コメントなし'
+    assert_selector 'summary', text: 'コメントなし'
+
     visit '/users?target=followings'
     assert_text users(:hatsuno).login_name
+    assert_text users(:yamada).login_name
+  end
+
+  test 'show followings with comments' do
+    visit_with_auth user_path(users(:hatsuno)), 'kimura'
+    find('.following').click
+    click_button 'コメントあり'
+    assert_selector 'summary', text: 'コメントあり'
+
+    visit_with_auth user_path(users(:yamada)), 'kimura'
+    find('.following').click
+    click_button 'コメントなし'
+    assert_selector 'summary', text: 'コメントなし'
+
+    visit '/users?target=followings&watch=true'
+    assert_text users(:hatsuno).login_name
+    assert_no_text users(:yamada).login_name
+  end
+
+  test 'show followings with no comments' do
+    visit_with_auth user_path(users(:hatsuno)), 'kimura'
+    find('.following').click
+    click_button 'コメントあり'
+    assert_selector 'summary', text: 'コメントあり'
+
+    visit_with_auth user_path(users(:yamada)), 'kimura'
+    find('.following').click
+    click_button 'コメントなし'
+    assert_selector 'summary', text: 'コメントなし'
+
+    visit '/users?target=followings&watch=false'
+    assert_no_text users(:hatsuno).login_name
+    assert_text users(:yamada).login_name
   end
 
   test 'receive a notification when following user create a report' do
     visit_with_auth user_path(users(:hatsuno)), 'kimura'
-    click_button '日報をフォロー'
+    find('.following').click
+    click_button 'コメントあり'
+
+    visit_with_auth user_path(users(:hatsuno)), 'yamada'
+    find('.following').click
+    click_button 'コメントなし'
 
     visit_with_auth '/reports/new', 'hatsuno'
     within('#new_report') do
@@ -45,11 +99,19 @@ class FollowingsTest < ApplicationSystemTestCase
 
     visit_with_auth '/notifications', 'kimura'
     assert_text 'hatsunoさんが日報【 test title 】を書きました！'
+
+    visit_with_auth '/notifications', 'yamada'
+    assert_text 'hatsunoさんが日報【 test title 】を書きました！'
   end
 
   test "receive a notification when following user's report has comment" do
     visit_with_auth user_path(users(:hatsuno)), 'kimura'
-    click_button '日報をフォロー'
+    find('.following').click
+    click_button 'コメントあり'
+
+    visit_with_auth user_path(users(:hatsuno)), 'yamada'
+    find('.following').click
+    click_button 'コメントなし'
 
     visit_with_auth '/reports/new', 'hatsuno'
     within('#new_report') do
@@ -75,5 +137,8 @@ class FollowingsTest < ApplicationSystemTestCase
 
     visit_with_auth '/notifications', 'kimura'
     assert_text 'hatsunoさんの【 「test title」の日報 】にhatsunoさんがコメントしました。'
+
+    visit_with_auth '/notifications', 'yamada'
+    assert_no_text 'hatsunoさんの【 「test title」の日報 】にhatsunoさんがコメントしました。'
   end
 end

From 15f0768e1f91b4de39f100206e27f43a24503d80 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Sun, 19 Sep 2021 16:56:21 +0900
Subject: [PATCH 14/25] =?UTF-8?q?=E3=83=86=E3=82=B9=E3=83=88=E3=83=87?=
 =?UTF-8?q?=E3=83=BC=E3=82=BF=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test/fixtures/followings.yml | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/test/fixtures/followings.yml b/test/fixtures/followings.yml
index ed3fc3c1812..d149c67c7d5 100644
--- a/test/fixtures/followings.yml
+++ b/test/fixtures/followings.yml
@@ -1,7 +1,9 @@
 following1:
   follower: muryou
   followed: kensyu
+  watch: true
 
 following2:
   follower: kensyu
   followed: muryou
+  watch: false

From 3b2d9a7fab0dab40dba424029479558e59326160 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Tue, 21 Sep 2021 15:29:21 +0900
Subject: [PATCH 15/25] =?UTF-8?q?=E3=82=A8=E3=83=A9=E3=83=BC=E7=99=BA?=
 =?UTF-8?q?=E7=94=9F=E6=99=82=E3=81=AE=E6=96=87=E8=A8=80=E3=82=92=E4=BF=AE?=
 =?UTF-8?q?=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/javascript/following.vue | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/app/javascript/following.vue b/app/javascript/following.vue
index 45651e31d9a..0816e5139a4 100644
--- a/app/javascript/following.vue
+++ b/app/javascript/following.vue
@@ -78,9 +78,7 @@ export default {
       return this.following ? 'PATCH' : 'POST'
     },
     errorMessage() {
-      return this.following
-        ? 'フォロー解除に失敗しました'
-        : 'フォローに失敗しました'
+      return 'フォロー処理に失敗しました'
     }
   },
   methods: {

From 9cc96eb160be1fa4c32ecf08d444bbf5e5b7c5be Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Tue, 21 Sep 2021 15:43:34 +0900
Subject: [PATCH 16/25] =?UTF-8?q?lint=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/javascript/following.vue | 31 ++++++++++++++++++++++++-------
 1 file changed, 24 insertions(+), 7 deletions(-)

diff --git a/app/javascript/following.vue b/app/javascript/following.vue
index 0816e5139a4..dedaaf4559e 100644
--- a/app/javascript/following.vue
+++ b/app/javascript/following.vue
@@ -4,7 +4,9 @@ details.following
     i.fas.fa-check
     span
       | コメントあり
-  summary.a-button.is-warning.is-md.is-block(v-else-if='following && !watching')
+  summary.a-button.is-warning.is-md.is-block(
+    v-else-if='following && !watching'
+  )
     i.fas.fa-check
     span
       | コメントなし
@@ -13,33 +15,48 @@ details.following
   .following__dropdown.a-dropdown
     ul.a-dropdown__items
       li.following__dropdown-item.a-dropdown__item
-        button.following-option.a-dropdown__item-inner.is-active(v-if='following && watching')
+        button.following-option.a-dropdown__item-inner.is-active(
+          v-if='following && watching'
+        )
           .following-option__inner
             .following-option__label
               | コメントあり
-        button.following-option.a-dropdown__item-inner(v-else, @click='followOrChangeFollow(true)')
+        button.following-option.a-dropdown__item-inner(
+          v-else,
+          @click='followOrChangeFollow(true)'
+        )
           .following-option__inner
             .following-option__label
               | コメントあり
             .following-option__desciption
               | フォローしたユーザーの日報を自動でWatch状態にします。日報投稿時の通知と日報にコメントが来た際に通知を受け取ります。
       li.following__dropdown-item.a-dropdown__item
-        button.following-option.a-dropdown__item-inner.is-active(v-if='following && !watching')
+        button.following-option.a-dropdown__item-inner.is-active(
+          v-if='following && !watching'
+        )
           .following-option__inner
             .following-option__label
               | コメントなし
-        button.following-option.a-dropdown__item-inner(v-else, @click='followOrChangeFollow(false)')
+        button.following-option.a-dropdown__item-inner(
+          v-else,
+          @click='followOrChangeFollow(false)'
+        )
           .following-option__inner
             .following-option__label
               | コメントなし
             .following-option__desciption
               | フォローしたユーザーの日報はWatch状態にしません。日報投稿時の通知だけ通知を受けとります。
       li.following__dropdown-item.a-dropdown__item
-        button.following-option.a-dropdown__item-inner.is-active(v-if='!following')
+        button.following-option.a-dropdown__item-inner.is-active(
+          v-if='!following'
+        )
           .following-option__inner
             .following-option__label
               | フォローしない
-        button.following-option.a-dropdown__item-inner(v-else, @click='unfollow')
+        button.following-option.a-dropdown__item-inner(
+          v-else,
+          @click='unfollow'
+        )
           .following-option__inner
             .following-option__label
               | フォローしない

From bb32343151a333ac890ef7db6a59129eaf22de7b Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Wed, 22 Sep 2021 14:06:09 +0900
Subject: [PATCH 17/25] =?UTF-8?q?User#follow=E3=81=AB=E3=82=AD=E3=83=BC?=
 =?UTF-8?q?=E3=83=AF=E3=83=BC=E3=83=89=E5=BC=95=E6=95=B0=E3=82=92=E8=A8=AD?=
 =?UTF-8?q?=E5=AE=9A=E3=81=97=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/controllers/api/followings_controller.rb |  2 +-
 app/models/user.rb                           |  2 +-
 test/models/user_test.rb                     | 20 ++++++++++----------
 3 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/app/controllers/api/followings_controller.rb b/app/controllers/api/followings_controller.rb
index 0ba4fa2a104..ffdd969255b 100644
--- a/app/controllers/api/followings_controller.rb
+++ b/app/controllers/api/followings_controller.rb
@@ -6,7 +6,7 @@ class API::FollowingsController < API::BaseController
   def create
     user = User.find(params[:id])
     watch = params[:watch] == 'true'
-    if current_user.follow(user, watch)
+    if current_user.follow(user, watch: watch)
       render json: { id: user.id }
     else
       head :bad_request
diff --git a/app/models/user.rb b/app/models/user.rb
index 9de2308b2ee..ad0bc08262d 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -514,7 +514,7 @@ def active_practice
     active_practices.first.id
   end
 
-  def follow(other_user, watch)
+  def follow(other_user, watch:)
     following << other_user
     change_watching(other_user, watch)
   end
diff --git a/test/models/user_test.rb b/test/models/user_test.rb
index 46e40d0f440..ded8729a7eb 100644
--- a/test/models/user_test.rb
+++ b/test/models/user_test.rb
@@ -280,14 +280,14 @@ class UserTest < ActiveSupport::TestCase
   test '#follow' do
     kimura = users(:kimura)
     hatsuno = users(:hatsuno)
-    kimura.follow(hatsuno, true)
+    kimura.follow(hatsuno, watch: true)
     assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id, watch: true)
   end
 
   test '#change_watching' do
     kimura = users(:kimura)
     hatsuno = users(:hatsuno)
-    kimura.follow(hatsuno, true)
+    kimura.follow(hatsuno, watch: true)
     assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id, watch: true)
     kimura.change_watching(hatsuno, false)
     assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id, watch: false)
@@ -296,7 +296,7 @@ class UserTest < ActiveSupport::TestCase
   test '#unfollow' do
     kimura = users(:kimura)
     hatsuno = users(:hatsuno)
-    kimura.follow(hatsuno, true)
+    kimura.follow(hatsuno, watch: true)
     assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id)
     kimura.unfollow(hatsuno)
     assert_nil Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id)
@@ -307,7 +307,7 @@ class UserTest < ActiveSupport::TestCase
     hatsuno = users(:hatsuno)
     kimura.following?(hatsuno)
     assert_not kimura.following?(hatsuno)
-    kimura.follow(hatsuno, true)
+    kimura.follow(hatsuno, watch: true)
     kimura.following?(hatsuno)
     assert kimura.following?(hatsuno)
   end
@@ -317,7 +317,7 @@ class UserTest < ActiveSupport::TestCase
     hatsuno = users(:hatsuno)
     kimura.following?(hatsuno)
     assert_not kimura.auto_watching?(hatsuno)
-    kimura.follow(hatsuno, false)
+    kimura.follow(hatsuno, watch: false)
     kimura.following?(hatsuno)
     assert_not kimura.auto_watching?(hatsuno)
     kimura.change_watching(hatsuno, true)
@@ -330,9 +330,9 @@ class UserTest < ActiveSupport::TestCase
     hatsuno = users(:hatsuno)
     hajime = users(:hajime)
     yamada = users(:yamada)
-    kimura.follow(hatsuno, true)
-    kimura.follow(hajime, true)
-    kimura.follow(yamada, false)
+    kimura.follow(hatsuno, watch: true)
+    kimura.follow(hajime, watch: true)
+    kimura.follow(yamada, watch: false)
     assert_equal 3, kimura.following_list.count
     assert_equal 2, kimura.following_list('true').count
     assert_equal 1, kimura.following_list('false').count
@@ -353,9 +353,9 @@ class UserTest < ActiveSupport::TestCase
   test "don't unfollow user when other user unfollow user" do
     kimura = users(:kimura)
     hatsuno = users(:hatsuno)
-    kimura.follow(hatsuno, true)
+    kimura.follow(hatsuno, watch: true)
     daimyo = users(:daimyo)
-    daimyo.follow(hatsuno, true)
+    daimyo.follow(hatsuno, watch: true)
     assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id)
     daimyo.unfollow(hatsuno)
     assert Following.find_by(follower_id: kimura.id, followed_id: hatsuno.id)

From 3f3f97f62756af7201deffc5a62adb8f69c469d2 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Wed, 22 Sep 2021 14:15:35 +0900
Subject: [PATCH 18/25] =?UTF-8?q?User#change=5Fwatching=20=E3=81=AE?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0=E5=87=A6=E7=90=86=E3=82=92=20update!=20?=
 =?UTF-8?q?=E3=81=8B=E3=82=89=20update=20=E3=81=AB=E5=A4=89=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/models/user.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/models/user.rb b/app/models/user.rb
index ad0bc08262d..5e5d2bd2461 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -521,7 +521,7 @@ def follow(other_user, watch:)
 
   def change_watching(other_user, watch)
     following_row = Following.find_by(follower_id: self, followed_id: other_user)
-    following_row.update!(watch: watch)
+    following_row.update(watch: watch)
   end
 
   def unfollow(other_user)

From 774512e97bfcdee5a82bbf767624fb8998a24778 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Wed, 22 Sep 2021 15:22:58 +0900
Subject: [PATCH 19/25] =?UTF-8?q?User#following=5Flist=20=E3=81=AE?=
 =?UTF-8?q?=E5=87=A6=E7=90=86=E5=A4=89=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

返ってくる値をidではなくuserインスタンスの配列にするため
---
 app/controllers/api/users_controller.rb | 3 +--
 app/controllers/users_controller.rb     | 3 +--
 app/models/user.rb                      | 6 +++---
 test/models/user_test.rb                | 4 ++--
 4 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/app/controllers/api/users_controller.rb b/app/controllers/api/users_controller.rb
index bf0684e45a6..813800fbb43 100644
--- a/app/controllers/api/users_controller.rb
+++ b/app/controllers/api/users_controller.rb
@@ -13,8 +13,7 @@ def index
 
     target_users =
       if @target == 'followings'
-        followings = current_user.following_list(@watch)
-        User.where(id: followings)
+        current_user.following_list(watch: @watch)
       elsif params[:tag]
         User.tagged_with(params[:tag])
       else
diff --git a/app/controllers/users_controller.rb b/app/controllers/users_controller.rb
index 97f67238274..18175b4e3df 100644
--- a/app/controllers/users_controller.rb
+++ b/app/controllers/users_controller.rb
@@ -13,8 +13,7 @@ def index
 
     target_users =
       if @target == 'followings'
-        followings = current_user.following_list(@watch)
-        User.where(id: followings)
+        current_user.following_list(watch: @watch)
       elsif params[:tag]
         User.tagged_with(params[:tag])
       else
diff --git a/app/models/user.rb b/app/models/user.rb
index 5e5d2bd2461..0eec91ddadc 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -536,11 +536,11 @@ def auto_watching?(other_user)
     following?(other_user) ? Following.find_by(follower_id: self, followed_id: other_user).watch : false
   end
 
-  def following_list(watch = '')
+  def following_list(watch: '')
     if %w[true false].include?(watch)
-      Following.where(follower_id: self, watch: watch).select('followed_id')
+      following.includes(:passive_relationships).where(followings: { watch: watch })
     else
-      Following.where(follower_id: self).select('followed_id')
+      following
     end
   end
 
diff --git a/test/models/user_test.rb b/test/models/user_test.rb
index ded8729a7eb..059000966ad 100644
--- a/test/models/user_test.rb
+++ b/test/models/user_test.rb
@@ -334,8 +334,8 @@ class UserTest < ActiveSupport::TestCase
     kimura.follow(hajime, watch: true)
     kimura.follow(yamada, watch: false)
     assert_equal 3, kimura.following_list.count
-    assert_equal 2, kimura.following_list('true').count
-    assert_equal 1, kimura.following_list('false').count
+    assert_equal 2, kimura.following_list(watch: 'true').count
+    assert_equal 1, kimura.following_list(watch: 'false').count
   end
 
   test '#completed_practices_size' do

From 329e1039e97ff83a04ebf9f3406983bae109e450 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Wed, 22 Sep 2021 15:30:09 +0900
Subject: [PATCH 20/25] =?UTF-8?q?User#auto=5Fwatching=3F=20=E3=81=AE?=
 =?UTF-8?q?=E5=90=8D=E5=89=8D=E3=82=92=20watching=3F=20=E3=81=AB=E5=A4=89?=
 =?UTF-8?q?=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/models/report_callbacks.rb               | 2 +-
 app/models/user.rb                           | 2 +-
 app/views/api/users/_list_user.json.jbuilder | 2 +-
 app/views/users/show.html.slim               | 2 +-
 test/models/user_test.rb                     | 6 +++---
 5 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/app/models/report_callbacks.rb b/app/models/report_callbacks.rb
index aa4d556f53d..af3e13629dd 100644
--- a/app/models/report_callbacks.rb
+++ b/app/models/report_callbacks.rb
@@ -52,7 +52,7 @@ def notify_advisers(report)
   def notify_followers(report)
     report.user.followers.each do |follower|
       NotificationFacade.following_report(report, follower)
-      create_following_watch(report, follower) if follower.auto_watching?(report.user)
+      create_following_watch(report, follower) if follower.watching?(report.user)
     end
   end
 
diff --git a/app/models/user.rb b/app/models/user.rb
index 0eec91ddadc..0fa82df9d99 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -532,7 +532,7 @@ def following?(other_user)
     following.include?(other_user)
   end
 
-  def auto_watching?(other_user)
+  def watching?(other_user)
     following?(other_user) ? Following.find_by(follower_id: self, followed_id: other_user).watch : false
   end
 
diff --git a/app/views/api/users/_list_user.json.jbuilder b/app/views/api/users/_list_user.json.jbuilder
index 93d3f1491f3..b25a3a88c5a 100644
--- a/app/views/api/users/_list_user.json.jbuilder
+++ b/app/views/api/users/_list_user.json.jbuilder
@@ -13,7 +13,7 @@ json.experience_name t("activerecord.enums.user.experience.#{user.experience}")
 json.student_or_trainee user.student_or_trainee?
 json.edit_admin_user_path edit_admin_user_path(user)
 json.isFollowing current_user.following?(user)
-json.isWatching current_user.auto_watching?(user)
+json.isWatching current_user.watching?(user)
 
 json.company do
   if user.company.present?
diff --git a/app/views/users/show.html.slim b/app/views/users/show.html.slim
index fd101f87f96..c7c66749807 100644
--- a/app/views/users/show.html.slim
+++ b/app/views/users/show.html.slim
@@ -60,7 +60,7 @@ header.page-header
                 ul.card-main-actions__items
                   - unless current_user == @user
                     li.card-main-actions__item
-                      .js-following(data-is-following="#{current_user.following?(@user)}" data-user-id="#{@user.id}" data-is-watching="#{current_user.auto_watching?(@user)}")
+                      .js-following(data-is-following="#{current_user.following?(@user)}" data-user-id="#{@user.id}" data-is-watching="#{current_user.watching?(@user)}")
                   - if current_user == @user
                     li.card-main-actions__item
                       = link_to '登録情報変更', edit_current_user_path, class: 'card-main-actions__action a-button is-md is-secondary is-block'
diff --git a/test/models/user_test.rb b/test/models/user_test.rb
index 059000966ad..e3334a210a5 100644
--- a/test/models/user_test.rb
+++ b/test/models/user_test.rb
@@ -316,13 +316,13 @@ class UserTest < ActiveSupport::TestCase
     kimura = users(:kimura)
     hatsuno = users(:hatsuno)
     kimura.following?(hatsuno)
-    assert_not kimura.auto_watching?(hatsuno)
+    assert_not kimura.watching?(hatsuno)
     kimura.follow(hatsuno, watch: false)
     kimura.following?(hatsuno)
-    assert_not kimura.auto_watching?(hatsuno)
+    assert_not kimura.watching?(hatsuno)
     kimura.change_watching(hatsuno, true)
     kimura.following?(hatsuno)
-    assert kimura.auto_watching?(hatsuno)
+    assert kimura.watching?(hatsuno)
   end
 
   test '#following_list ' do

From fa8a40a67599f54f9cc09e30994f5d1e3a971a9a Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Wed, 22 Sep 2021 15:33:08 +0900
Subject: [PATCH 21/25] =?UTF-8?q?boolean=E5=B1=9E=E6=80=A7=E3=81=AE?=
 =?UTF-8?q?=E6=8C=87=E5=AE=9A=E3=81=AB=3F=E3=82=92=E4=BB=98=E4=B8=8E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/models/user.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/models/user.rb b/app/models/user.rb
index 0fa82df9d99..ecb62b4556c 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -533,7 +533,7 @@ def following?(other_user)
   end
 
   def watching?(other_user)
-    following?(other_user) ? Following.find_by(follower_id: self, followed_id: other_user).watch : false
+    following?(other_user) ? Following.find_by(follower_id: self, followed_id: other_user).watch? : false
   end
 
   def following_list(watch: '')

From 4546e9e0a8fcb5f642caffa2119336fcdcf9a9a9 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Wed, 22 Sep 2021 15:33:30 +0900
Subject: [PATCH 22/25] =?UTF-8?q?=E4=B8=8D=E8=A6=81=E3=81=AA=E3=83=95?=
 =?UTF-8?q?=E3=82=A1=E3=82=A4=E3=83=AB=E3=82=92=E5=89=8A=E9=99=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/views/users/_followings_nav.html.slim | 8 --------
 1 file changed, 8 deletions(-)
 delete mode 100644 app/views/users/_followings_nav.html.slim

diff --git a/app/views/users/_followings_nav.html.slim b/app/views/users/_followings_nav.html.slim
deleted file mode 100644
index aeab7492124..00000000000
--- a/app/views/users/_followings_nav.html.slim
+++ /dev/null
@@ -1,8 +0,0 @@
-nav.tab-nav
-  .container.is-padding-horizontal-0-sm-down
-    ul.tab-nav__items
-      li.tab-nav__item
-        = link_to t('watch.all'), users_path(target: @target), class: "tab-nav__item-link #{'is-active' if @watch.nil?}".strip
-      - %w[true false].each do |watch|
-        li.tab-nav__item
-          = link_to t("watch.#{watch}"), users_path(target: @target, watch: watch), class: (@watch == watch ? ['is-active'] : []) << 'tab-nav__item-link'

From ca9b4337f9ccfef6ee2020cd3cce3963ea5fca22 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Wed, 22 Sep 2021 15:42:08 +0900
Subject: [PATCH 23/25] =?UTF-8?q?User#follow=20=E3=81=AE=E5=87=A6=E7=90=86?=
 =?UTF-8?q?=E3=82=92=E5=A4=89=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

2クエリ発行していたところを1クエリにした
---
 app/models/user.rb | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/app/models/user.rb b/app/models/user.rb
index ecb62b4556c..32e29eeaedf 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -515,8 +515,7 @@ def active_practice
   end
 
   def follow(other_user, watch:)
-    following << other_user
-    change_watching(other_user, watch)
+    active_relationships.create(followed: other_user, watch: watch)
   end
 
   def change_watching(other_user, watch)

From c18e8c2de648ae12bc44b7187d98bf75706258e5 Mon Sep 17 00:00:00 2001
From: teppei machida <machida@fjord.jp>
Date: Mon, 27 Sep 2021 13:25:51 +0900
Subject: [PATCH 24/25] =?UTF-8?q?=E3=83=95=E3=82=A9=E3=83=AD=E3=83=BC?=
 =?UTF-8?q?=E3=81=AE=E8=AA=AC=E6=98=8E=E3=81=8C=E6=B6=88=E3=81=88=E3=81=A6?=
 =?UTF-8?q?=E3=81=97=E3=81=BE=E3=81=A3=E3=81=A6=E3=81=84=E3=81=9F=E3=81=AE?=
 =?UTF-8?q?=E3=82=92=E4=BF=AE=E6=AD=A3=E3=80=81=E9=80=9A=E7=9F=A5=E3=81=AE?=
 =?UTF-8?q?=E3=83=87=E3=82=B6=E3=82=A4=E3=83=B3=E3=83=95=E3=82=A1=E3=82=A4?=
 =?UTF-8?q?=E3=83=AB=E3=82=92=E6=B6=88=E3=81=97=E3=81=A6=E3=81=97=E3=81=BE?=
 =?UTF-8?q?=E3=81=A3=E3=81=A6=E3=81=84=E3=81=9F=E3=81=AE=E3=82=92=E6=88=BB?=
 =?UTF-8?q?=E3=81=97=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../header/_.header-notification-icon.sass    | 50 +++++++++++++++++++
 app/javascript/following.vue                  |  4 ++
 app/javascript/notifications_bell.vue         |  2 +-
 3 files changed, 55 insertions(+), 1 deletion(-)
 create mode 100644 app/assets/stylesheets/blocks/header/_.header-notification-icon.sass

diff --git a/app/assets/stylesheets/blocks/header/_.header-notification-icon.sass b/app/assets/stylesheets/blocks/header/_.header-notification-icon.sass
new file mode 100644
index 00000000000..baec03ddd12
--- /dev/null
+++ b/app/assets/stylesheets/blocks/header/_.header-notification-icon.sass
@@ -0,0 +1,50 @@
+.header-notification-icon
+  +text-block(1.25rem 1, center)
+  +media-breakpoint-down(sm)
+    +text-block(1.125rem 1)
+    .has-count &
+      color: $default-text
+
+.header-notification-count
+  background-color: $badge-color
+  +text-block(.625rem 1, center $reversal-text flex)
+  align-items: center
+  justify-content: center
+  border-radius: 1rem
+  position: absolute
+  +media-breakpoint-up(md)
+    +size(1.25rem .875rem)
+    +position(right .25rem, top .25rem)
+  +media-breakpoint-down(sm)
+    +size(1.125rem .75rem)
+    +position(right .125rem, top .125rem)
+
+.header-notifications-item__body
+  width: 100%
+  +media-breakpoint-up(md)
+    color: $default-text
+  +media-breakpoint-down(sm)
+    color: $reversal-text
+
+.header-notifications-item__user-icon
+  float: left
+  +size(2rem)
+  margin-right: .5rem
+  margin-bottom: .25rem
+
+.header-notifications-item__message
+  p
+    line-height: 1.45
+    margin-bottom: .375em
+    +media-breakpoint-up(md)
+      font-size: .8125rem
+    +media-breakpoint-down(sm)
+      font-size: .75rem
+
+.header-notifications-item__created-at
+  text-align: right
+  display: block
+  +media-breakpoint-up(md)
+    font-size: .75rem
+  +media-breakpoint-down(sm)
+    font-size: .625rem
diff --git a/app/javascript/following.vue b/app/javascript/following.vue
index dedaaf4559e..5a84aefd77f 100644
--- a/app/javascript/following.vue
+++ b/app/javascript/following.vue
@@ -21,6 +21,8 @@ details.following
           .following-option__inner
             .following-option__label
               | コメントあり
+            .following-option__desciption
+              | フォローしたユーザーの日報を自動でWatch状態にします。日報投稿時の通知と日報にコメントが来た際に通知を受け取ります。
         button.following-option.a-dropdown__item-inner(
           v-else,
           @click='followOrChangeFollow(true)'
@@ -37,6 +39,8 @@ details.following
           .following-option__inner
             .following-option__label
               | コメントなし
+            .following-option__desciption
+              | フォローしたユーザーの日報はWatch状態にしません。日報投稿時の通知だけ通知を受けとります。
         button.following-option.a-dropdown__item-inner(
           v-else,
           @click='followOrChangeFollow(false)'
diff --git a/app/javascript/notifications_bell.vue b/app/javascript/notifications_bell.vue
index 230fd55cc12..569ff812d23 100644
--- a/app/javascript/notifications_bell.vue
+++ b/app/javascript/notifications_bell.vue
@@ -29,7 +29,7 @@ li.header-links__item(v-bind:class='hasCountClass')
               )
               .header-notifications-item__message
                 p.test-notification-message {{ notification.message }}
-              time.header-notifications-item_created-at {{ createdAtFromNow(notification.created_at) }}
+              time.header-notifications-item__created-at {{ createdAtFromNow(notification.created_at) }}
       footer.header-dropdown__footer
         a.header-dropdown__footer-link(href='/notifications?status=unread') 全ての未読通知
         a.header-dropdown__footer-link(href='/notifications') 全ての通知

From 995a47a293312d63b09751573d0a4f6ba99da3d6 Mon Sep 17 00:00:00 2001
From: yana-gi <yanagisawa.hika@gmail.com>
Date: Tue, 28 Sep 2021 15:34:20 +0900
Subject: [PATCH 25/25] =?UTF-8?q?=E3=80=8C=E3=83=95=E3=82=A9=E3=83=AD?=
 =?UTF-8?q?=E3=83=BC=E4=B8=AD=E3=80=8D=E3=81=AE=E3=82=BF=E3=83=96=E3=81=AE?=
 =?UTF-8?q?=E3=82=A2=E3=82=AF=E3=83=86=E3=82=A3=E3=83=96=E7=8A=B6=E6=85=8B?=
 =?UTF-8?q?=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/views/users/_lg_page_tabs.html.slim | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/views/users/_lg_page_tabs.html.slim b/app/views/users/_lg_page_tabs.html.slim
index a8407c9ff0d..e3d61c602d9 100644
--- a/app/views/users/_lg_page_tabs.html.slim
+++ b/app/views/users/_lg_page_tabs.html.slim
@@ -2,7 +2,7 @@
   .container
     ul.page-tabs__items
       li.page-tabs__item
-        = link_to users_path, class: "page-tabs__item-link #{users_current_page_tab_or_not('users')}" do
+        = link_to users_path, class: "page-tabs__item-link #{'is-active' if users_current_page_tab?('users') && @target != 'followings'}" do
           | 全て
       li.page-tabs__item
         = link_to generations_path, class: "page-tabs__item-link #{users_current_page_tab_or_not('generations')}" do
@@ -11,5 +11,5 @@
         = link_to users_tags_path, class: "page-tabs__item-link #{users_current_page_tab_or_not('tags')} #{current_page_tab_or_not('tags')}" do
           | タグ別
       li.page-tabs__item
-        = link_to users_path(target: 'followings'), class: "page-tabs__item-link #{users_current_page_tab_or_not('followings')}" do
+        = link_to users_path(target: 'followings'), class: "page-tabs__item-link #{'is-active' if @target == 'followings'}"
           | フォロー中