From 3267e4a7851b57bef7d16da4b7c66764f63d4416 Mon Sep 17 00:00:00 2001
From: Yamagishi Kazutoshi <ykzts@desire.sh>
Date: Wed, 19 Jul 2017 00:14:43 +0900
Subject: [PATCH] Add unfollow modal (optional) (#4246)

* Add unfollow modal

* unfollowing someone

* remove unnecessary prop
---
 .../settings/preferences_controller.rb        |  1 +
 .../mastodon/containers/account_container.js  | 24 ++++++++++++++++---
 .../containers/header_container.js            | 14 ++++++++++-
 .../features/ui/components/modal_root.js      |  2 +-
 app/javascript/mastodon/locales/ar.json       |  2 ++
 app/javascript/mastodon/locales/bg.json       |  2 ++
 app/javascript/mastodon/locales/ca.json       |  2 ++
 app/javascript/mastodon/locales/de.json       |  2 ++
 .../mastodon/locales/defaultMessages.json     | 21 ++++++++++++++++
 app/javascript/mastodon/locales/en.json       |  2 ++
 app/javascript/mastodon/locales/eo.json       |  2 ++
 app/javascript/mastodon/locales/es.json       |  2 ++
 app/javascript/mastodon/locales/fa.json       |  2 ++
 app/javascript/mastodon/locales/fi.json       |  2 ++
 app/javascript/mastodon/locales/fr.json       |  2 ++
 app/javascript/mastodon/locales/he.json       |  2 ++
 app/javascript/mastodon/locales/hr.json       |  2 ++
 app/javascript/mastodon/locales/hu.json       |  2 ++
 app/javascript/mastodon/locales/id.json       |  2 ++
 app/javascript/mastodon/locales/io.json       |  2 ++
 app/javascript/mastodon/locales/it.json       |  2 ++
 app/javascript/mastodon/locales/ja.json       |  2 ++
 app/javascript/mastodon/locales/ko.json       |  2 ++
 app/javascript/mastodon/locales/nl.json       |  2 ++
 app/javascript/mastodon/locales/no.json       |  2 ++
 app/javascript/mastodon/locales/oc.json       |  2 ++
 app/javascript/mastodon/locales/pl.json       |  2 ++
 app/javascript/mastodon/locales/pt-BR.json    |  2 ++
 app/javascript/mastodon/locales/pt.json       |  2 ++
 app/javascript/mastodon/locales/ru.json       |  2 ++
 app/javascript/mastodon/locales/th.json       |  2 ++
 app/javascript/mastodon/locales/tr.json       |  2 ++
 app/javascript/mastodon/locales/uk.json       |  2 ++
 app/javascript/mastodon/locales/zh-CN.json    |  2 ++
 app/javascript/mastodon/locales/zh-HK.json    |  2 ++
 app/javascript/mastodon/locales/zh-TW.json    |  2 ++
 app/lib/user_settings_decorator.rb            |  5 ++++
 app/models/user.rb                            |  4 ++++
 app/serializers/initial_state_serializer.rb   |  1 +
 app/views/settings/preferences/show.html.haml |  1 +
 config/locales/simple_form.en.yml             |  1 +
 spec/lib/user_settings_decorator_spec.rb      |  7 ++++++
 spec/models/user_spec.rb                      |  8 +++++++
 43 files changed, 146 insertions(+), 5 deletions(-)

diff --git a/app/controllers/settings/preferences_controller.rb b/app/controllers/settings/preferences_controller.rb
index a3f5a008b8f..f107f2b165f 100644
--- a/app/controllers/settings/preferences_controller.rb
+++ b/app/controllers/settings/preferences_controller.rb
@@ -35,6 +35,7 @@ class Settings::PreferencesController < ApplicationController
     params.require(:user).permit(
       :setting_default_privacy,
       :setting_default_sensitive,
+      :setting_unfollow_modal,
       :setting_boost_modal,
       :setting_delete_modal,
       :setting_auto_play_gif,
diff --git a/app/javascript/mastodon/containers/account_container.js b/app/javascript/mastodon/containers/account_container.js
index 1426bcaa47e..ca1efd0e5b6 100644
--- a/app/javascript/mastodon/containers/account_container.js
+++ b/app/javascript/mastodon/containers/account_container.js
@@ -1,4 +1,6 @@
+import React from 'react';
 import { connect } from 'react-redux';
+import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 import { makeGetAccount } from '../selectors';
 import Account from '../components/account';
 import {
@@ -9,6 +11,11 @@ import {
   muteAccount,
   unmuteAccount,
 } from '../actions/accounts';
+import { openModal } from '../actions/modal';
+
+const messages = defineMessages({
+  unfollowConfirm: { id: 'confirmations.unfollow.confirm', defaultMessage: 'Unfollow' },
+});
 
 const makeMapStateToProps = () => {
   const getAccount = makeGetAccount();
@@ -16,15 +23,25 @@ const makeMapStateToProps = () => {
   const mapStateToProps = (state, props) => ({
     account: getAccount(state, props.id),
     me: state.getIn(['meta', 'me']),
+    unfollowModal: state.getIn(['meta', 'unfollow_modal']),
   });
 
   return mapStateToProps;
 };
 
-const mapDispatchToProps = (dispatch) => ({
+const mapDispatchToProps = (dispatch, { intl }) => ({
+
   onFollow (account) {
     if (account.getIn(['relationship', 'following'])) {
-      dispatch(unfollowAccount(account.get('id')));
+      if (this.unfollowModal) {
+        dispatch(openModal('CONFIRM', {
+          message: <FormattedMessage id='confirmations.unfollow.message' defaultMessage='Are you sure you want to unfollow {name}?' values={{ name: <strong>@{account.get('acct')}</strong> }} />,
+          confirm: intl.formatMessage(messages.unfollowConfirm),
+          onConfirm: () => dispatch(unfollowAccount(account.get('id'))),
+        }));
+      } else {
+        dispatch(unfollowAccount(account.get('id')));
+      }
     } else {
       dispatch(followAccount(account.get('id')));
     }
@@ -45,6 +62,7 @@ const mapDispatchToProps = (dispatch) => ({
       dispatch(muteAccount(account.get('id')));
     }
   },
+
 });
 
-export default connect(makeMapStateToProps, mapDispatchToProps)(Account);
+export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(Account));
diff --git a/app/javascript/mastodon/features/account_timeline/containers/header_container.js b/app/javascript/mastodon/features/account_timeline/containers/header_container.js
index 19dd6469949..baa81bbc216 100644
--- a/app/javascript/mastodon/features/account_timeline/containers/header_container.js
+++ b/app/javascript/mastodon/features/account_timeline/containers/header_container.js
@@ -17,6 +17,7 @@ import { blockDomain, unblockDomain } from '../../../actions/domain_blocks';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 
 const messages = defineMessages({
+  unfollowConfirm: { id: 'confirmations.unfollow.confirm', defaultMessage: 'Unfollow' },
   blockConfirm: { id: 'confirmations.block.confirm', defaultMessage: 'Block' },
   muteConfirm: { id: 'confirmations.mute.confirm', defaultMessage: 'Mute' },
   blockDomainConfirm: { id: 'confirmations.domain_block.confirm', defaultMessage: 'Hide entire domain' },
@@ -28,15 +29,25 @@ const makeMapStateToProps = () => {
   const mapStateToProps = (state, { accountId }) => ({
     account: getAccount(state, Number(accountId)),
     me: state.getIn(['meta', 'me']),
+    unfollowModal: state.getIn(['meta', 'unfollow_modal']),
   });
 
   return mapStateToProps;
 };
 
 const mapDispatchToProps = (dispatch, { intl }) => ({
+
   onFollow (account) {
     if (account.getIn(['relationship', 'following'])) {
-      dispatch(unfollowAccount(account.get('id')));
+      if (this.unfollowModal) {
+        dispatch(openModal('CONFIRM', {
+          message: <FormattedMessage id='confirmations.unfollow.message' defaultMessage='Are you sure you want to unfollow {name}?' values={{ name: <strong>@{account.get('acct')}</strong> }} />,
+          confirm: intl.formatMessage(messages.unfollowConfirm),
+          onConfirm: () => dispatch(unfollowAccount(account.get('id'))),
+        }));
+      } else {
+        dispatch(unfollowAccount(account.get('id')));
+      }
     } else {
       dispatch(followAccount(account.get('id')));
     }
@@ -85,6 +96,7 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
   onUnblockDomain (domain, accountId) {
     dispatch(unblockDomain(domain, accountId));
   },
+
 });
 
 export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(Header));
diff --git a/app/javascript/mastodon/features/ui/components/modal_root.js b/app/javascript/mastodon/features/ui/components/modal_root.js
index 4240871a7cb..f303088d707 100644
--- a/app/javascript/mastodon/features/ui/components/modal_root.js
+++ b/app/javascript/mastodon/features/ui/components/modal_root.js
@@ -85,7 +85,7 @@ export default class ModalRoot extends React.PureComponent {
       >
         {interpolatedStyles =>
           <div className='modal-root'>
-            {interpolatedStyles.map(({ key, data: { type }, style }) => (
+            {interpolatedStyles.map(({ key, data: { type, props }, style }) => (
               <div key={key} style={{ pointerEvents: visible ? 'auto' : 'none' }}>
                 <div role='presentation' className='modal-root__overlay' style={{ opacity: style.opacity }} onClick={onClose} />
                 <div className='modal-root__container' style={{ opacity: style.opacity, transform: `translateZ(0px) scale(${style.scale})` }}>
diff --git a/app/javascript/mastodon/locales/ar.json b/app/javascript/mastodon/locales/ar.json
index 7b890ce64b5..89ddb2d154e 100644
--- a/app/javascript/mastodon/locales/ar.json
+++ b/app/javascript/mastodon/locales/ar.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "أكتم",
   "confirmations.mute.message": "هل أنت متأكد أنك تريد كتم {name} ؟",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "الأنشطة",
   "emoji_button.flags": "الأعلام",
   "emoji_button.food": "الطعام والشراب",
diff --git a/app/javascript/mastodon/locales/bg.json b/app/javascript/mastodon/locales/bg.json
index 0cf6bf3ac87..3dba91b822b 100644
--- a/app/javascript/mastodon/locales/bg.json
+++ b/app/javascript/mastodon/locales/bg.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/ca.json b/app/javascript/mastodon/locales/ca.json
index 1e44d6fa563..54f2e5e221c 100644
--- a/app/javascript/mastodon/locales/ca.json
+++ b/app/javascript/mastodon/locales/ca.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Estàs realment, realment segur que vols bloquejar totalment {domain}? En la majoria dels casos bloquejar o silenciar és suficient i preferible.",
   "confirmations.mute.confirm": "Silenciar",
   "confirmations.mute.message": "Estàs segur que vols silenciar {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activitat",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Menjar i Beure",
diff --git a/app/javascript/mastodon/locales/de.json b/app/javascript/mastodon/locales/de.json
index f73011e73ae..a041e665509 100644
--- a/app/javascript/mastodon/locales/de.json
+++ b/app/javascript/mastodon/locales/de.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/defaultMessages.json b/app/javascript/mastodon/locales/defaultMessages.json
index aaa558c0ea2..bf462a53728 100644
--- a/app/javascript/mastodon/locales/defaultMessages.json
+++ b/app/javascript/mastodon/locales/defaultMessages.json
@@ -228,6 +228,19 @@
     ],
     "path": "app/javascript/mastodon/components/video_player.json"
   },
+  {
+    "descriptors": [
+      {
+        "defaultMessage": "Unfollow",
+        "id": "confirmations.unfollow.confirm"
+      },
+      {
+        "defaultMessage": "Are you sure you want to unfollow {name}?",
+        "id": "confirmations.unfollow.message"
+      }
+    ],
+    "path": "app/javascript/mastodon/containers/account_container.json"
+  },
   {
     "descriptors": [
       {
@@ -268,6 +281,10 @@
   },
   {
     "descriptors": [
+      {
+        "defaultMessage": "Unfollow",
+        "id": "confirmations.unfollow.confirm"
+      },
       {
         "defaultMessage": "Block",
         "id": "confirmations.block.confirm"
@@ -280,6 +297,10 @@
         "defaultMessage": "Hide entire domain",
         "id": "confirmations.domain_block.confirm"
       },
+      {
+        "defaultMessage": "Are you sure you want to unfollow {name}?",
+        "id": "confirmations.unfollow.message"
+      },
       {
         "defaultMessage": "Are you sure you want to block {name}?",
         "id": "confirmations.block.message"
diff --git a/app/javascript/mastodon/locales/en.json b/app/javascript/mastodon/locales/en.json
index 15afe230976..fe2bd4cb4dc 100644
--- a/app/javascript/mastodon/locales/en.json
+++ b/app/javascript/mastodon/locales/en.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/eo.json b/app/javascript/mastodon/locales/eo.json
index 4f9e26c258c..029cef883df 100644
--- a/app/javascript/mastodon/locales/eo.json
+++ b/app/javascript/mastodon/locales/eo.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/es.json b/app/javascript/mastodon/locales/es.json
index 64ba78716de..36ad66aceba 100644
--- a/app/javascript/mastodon/locales/es.json
+++ b/app/javascript/mastodon/locales/es.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/fa.json b/app/javascript/mastodon/locales/fa.json
index 306937cc23a..113daef77b7 100644
--- a/app/javascript/mastodon/locales/fa.json
+++ b/app/javascript/mastodon/locales/fa.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "آیا جدی جدی می‌خواهید کل دامین {domain} را مسدود کنید؟ بیشتر وقت‌ها مسدودکردن یا بی‌صداکردن چند حساب کاربری خاص کافی است و توصیه می‌شود.",
   "confirmations.mute.confirm": "بی‌صدا کن",
   "confirmations.mute.message": "آیا واقعاً می‌خواهید {name} را بی‌صدا کنید؟",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "فعالیت",
   "emoji_button.flags": "پرچم‌ها",
   "emoji_button.food": "غذا و نوشیدنی",
diff --git a/app/javascript/mastodon/locales/fi.json b/app/javascript/mastodon/locales/fi.json
index 1b17fb15540..da9e5d0f28e 100644
--- a/app/javascript/mastodon/locales/fi.json
+++ b/app/javascript/mastodon/locales/fi.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/fr.json b/app/javascript/mastodon/locales/fr.json
index b6605295b4d..c3e74325912 100644
--- a/app/javascript/mastodon/locales/fr.json
+++ b/app/javascript/mastodon/locales/fr.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Êtes-vous vraiment, vraiment sûr⋅e de vouloir bloquer {domain} en entier ? Dans la plupart des cas, quelques blocages ou masquages ciblés sont suffisants et préférables.",
   "confirmations.mute.confirm": "Masquer",
   "confirmations.mute.message": "Confirmez vous le masquage de {name} ?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activités",
   "emoji_button.flags": "Drapeaux",
   "emoji_button.food": "Boire et manger",
diff --git a/app/javascript/mastodon/locales/he.json b/app/javascript/mastodon/locales/he.json
index 8b63bd26bbe..c8dc4fe8dbd 100644
--- a/app/javascript/mastodon/locales/he.json
+++ b/app/javascript/mastodon/locales/he.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "באמת באמת לחסום את כל קהילת {domain}? ברב המקרים השתקות נבחרות של מספר משתמשים מסויימים צריכה להספיק.",
   "confirmations.mute.confirm": "להשתיק",
   "confirmations.mute.message": "להשתיק את {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "פעילות",
   "emoji_button.flags": "דגלים",
   "emoji_button.food": "אוכל ושתיה",
diff --git a/app/javascript/mastodon/locales/hr.json b/app/javascript/mastodon/locales/hr.json
index 165e3088fcc..fd669b2b27a 100644
--- a/app/javascript/mastodon/locales/hr.json
+++ b/app/javascript/mastodon/locales/hr.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Jesi li zaista, zaista siguran da želiš blokirati sve sa {domain}? U većini slučajeva nekoliko ciljanih blokiranja ili utišavanja je dostatno i poželjnije.",
   "confirmations.mute.confirm": "Utišaj",
   "confirmations.mute.message": "Jesi li siguran da želiš utišati {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Aktivnost",
   "emoji_button.flags": "Zastave",
   "emoji_button.food": "Hrana & Piće",
diff --git a/app/javascript/mastodon/locales/hu.json b/app/javascript/mastodon/locales/hu.json
index 71dcce50538..b3672cb7a40 100644
--- a/app/javascript/mastodon/locales/hu.json
+++ b/app/javascript/mastodon/locales/hu.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/id.json b/app/javascript/mastodon/locales/id.json
index 0c21877d83d..8a17262fe80 100644
--- a/app/javascript/mastodon/locales/id.json
+++ b/app/javascript/mastodon/locales/id.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Bisukan",
   "confirmations.mute.message": "Apa anda yakin ingin membisukan {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Aktivitas",
   "emoji_button.flags": "Bendera",
   "emoji_button.food": "Makanan & Minuman",
diff --git a/app/javascript/mastodon/locales/io.json b/app/javascript/mastodon/locales/io.json
index 788d09f34f2..154ca66ceea 100644
--- a/app/javascript/mastodon/locales/io.json
+++ b/app/javascript/mastodon/locales/io.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/it.json b/app/javascript/mastodon/locales/it.json
index 9176bfaafe6..6cb274bae9c 100644
--- a/app/javascript/mastodon/locales/it.json
+++ b/app/javascript/mastodon/locales/it.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/ja.json b/app/javascript/mastodon/locales/ja.json
index a686cdc030b..c62e3648231 100644
--- a/app/javascript/mastodon/locales/ja.json
+++ b/app/javascript/mastodon/locales/ja.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "本当に{domain}全体を非表示にしますか？　多くの場合は個別にブロックやミュートするだけで充分であり、また好ましいです。",
   "confirmations.mute.confirm": "ミュート",
   "confirmations.mute.message": "本当に{name}をミュートしますか？",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "活動",
   "emoji_button.flags": "国旗",
   "emoji_button.food": "食べ物",
diff --git a/app/javascript/mastodon/locales/ko.json b/app/javascript/mastodon/locales/ko.json
index 0b47cc990c8..fbd0098d756 100644
--- a/app/javascript/mastodon/locales/ko.json
+++ b/app/javascript/mastodon/locales/ko.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "정말로 {domain} 전체를 숨기시겠습니까? 대부분의 경우 개별 차단이나 뮤트로 충분합니다.",
   "confirmations.mute.confirm": "뮤트",
   "confirmations.mute.message": "정말로 {name}를 뮤트하시겠습니까?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "활동",
   "emoji_button.flags": "국기",
   "emoji_button.food": "음식",
diff --git a/app/javascript/mastodon/locales/nl.json b/app/javascript/mastodon/locales/nl.json
index cf6a8bd31c3..f7b0bbf68ae 100644
--- a/app/javascript/mastodon/locales/nl.json
+++ b/app/javascript/mastodon/locales/nl.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Weet je het echt, echt zeker dat je alles van {domain} wil negeren? In de meeste gevallen is het blokkeren of negeren van een paar specifieke personen voldoende en gewenst.",
   "confirmations.mute.confirm": "Negeren",
   "confirmations.mute.message": "Weet je zeker dat je {name} wilt negeren?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activiteiten",
   "emoji_button.flags": "Vlaggen",
   "emoji_button.food": "Eten en drinken",
diff --git a/app/javascript/mastodon/locales/no.json b/app/javascript/mastodon/locales/no.json
index 1f4082d7bc0..98f59f7740a 100644
--- a/app/javascript/mastodon/locales/no.json
+++ b/app/javascript/mastodon/locales/no.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Er du sikker på at du vil skjule hele domenet {domain}? I de fleste tilfeller er det bedre med målrettet blokkering eller demping.",
   "confirmations.mute.confirm": "Demp",
   "confirmations.mute.message": "Er du sikker på at du vil dempe {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Aktivitet",
   "emoji_button.flags": "Flagg",
   "emoji_button.food": "Mat og drikke",
diff --git a/app/javascript/mastodon/locales/oc.json b/app/javascript/mastodon/locales/oc.json
index dc6dd5e32d1..ca094c18ad6 100644
--- a/app/javascript/mastodon/locales/oc.json
+++ b/app/javascript/mastodon/locales/oc.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Sètz segur segur de voler blocar complètament {domain} ? De còps cal pas que blocar o rescondre unas personas solament.",
   "confirmations.mute.confirm": "Metre en silenci",
   "confirmations.mute.message": "Sètz segur de voler metre en silenci {name} ?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activitat",
   "emoji_button.flags": "Drapèus",
   "emoji_button.food": "Beure e manjar",
diff --git a/app/javascript/mastodon/locales/pl.json b/app/javascript/mastodon/locales/pl.json
index 233d619957f..683f589b1ed 100644
--- a/app/javascript/mastodon/locales/pl.json
+++ b/app/javascript/mastodon/locales/pl.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Czy na pewno chcesz zablokować całą domenę {domain}? Zwykle lepszym rozwiązaniem jest blokada lub wyciszenie kilku użytkowników.",
   "confirmations.mute.confirm": "Wycisz",
   "confirmations.mute.message": "Czy na pewno chcesz wyciszyć {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Aktywność",
   "emoji_button.flags": "Flagi",
   "emoji_button.food": "Żywność i napoje",
diff --git a/app/javascript/mastodon/locales/pt-BR.json b/app/javascript/mastodon/locales/pt-BR.json
index cf2b911f2fb..3944e33e9ce 100644
--- a/app/javascript/mastodon/locales/pt-BR.json
+++ b/app/javascript/mastodon/locales/pt-BR.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/pt.json b/app/javascript/mastodon/locales/pt.json
index cf2b911f2fb..3944e33e9ce 100644
--- a/app/javascript/mastodon/locales/pt.json
+++ b/app/javascript/mastodon/locales/pt.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/ru.json b/app/javascript/mastodon/locales/ru.json
index 942a13ede23..cffc285f456 100644
--- a/app/javascript/mastodon/locales/ru.json
+++ b/app/javascript/mastodon/locales/ru.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Вы на самом деле уверены, что хотите блокировать весь {domain}? В большинстве случаев нескольких отдельных блокировок или глушений достаточно.",
   "confirmations.mute.confirm": "Заглушить",
   "confirmations.mute.message": "Вы уверены, что хотите заглушить {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Занятия",
   "emoji_button.flags": "Флаги",
   "emoji_button.food": "Еда и напитки",
diff --git a/app/javascript/mastodon/locales/th.json b/app/javascript/mastodon/locales/th.json
index e9e96c14fe7..63bed6d8c1f 100644
--- a/app/javascript/mastodon/locales/th.json
+++ b/app/javascript/mastodon/locales/th.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Mute",
   "confirmations.mute.message": "Are you sure you want to mute {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Activity",
   "emoji_button.flags": "Flags",
   "emoji_button.food": "Food & Drink",
diff --git a/app/javascript/mastodon/locales/tr.json b/app/javascript/mastodon/locales/tr.json
index adfa79cd90e..5bd308e9524 100644
--- a/app/javascript/mastodon/locales/tr.json
+++ b/app/javascript/mastodon/locales/tr.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "Sessize al",
   "confirmations.mute.message": "{name} kullanıcısını sessize almak istiyor musunuz?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Aktivite",
   "emoji_button.flags": "Bayraklar",
   "emoji_button.food": "Yiyecek ve İçecek",
diff --git a/app/javascript/mastodon/locales/uk.json b/app/javascript/mastodon/locales/uk.json
index 435067281e0..e1611505dec 100644
--- a/app/javascript/mastodon/locales/uk.json
+++ b/app/javascript/mastodon/locales/uk.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Ви точно, точно впевнені, що хочете заблокувати весь домен {domain}? У більшості випадків для нормальної роботи краще заблокувати/заглушити лише деяких користувачів.",
   "confirmations.mute.confirm": "Заглушити",
   "confirmations.mute.message": "Ви впевнені, що хочете заглушити {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "Заняття",
   "emoji_button.flags": "Прапори",
   "emoji_button.food": "Їжа та напої",
diff --git a/app/javascript/mastodon/locales/zh-CN.json b/app/javascript/mastodon/locales/zh-CN.json
index 0f2c1fcec30..18bf872e593 100644
--- a/app/javascript/mastodon/locales/zh-CN.json
+++ b/app/javascript/mastodon/locales/zh-CN.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "静音",
   "confirmations.mute.message": "想好了，真的要静音 {name}?",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "活动",
   "emoji_button.flags": "旗帜",
   "emoji_button.food": "食物和饮料",
diff --git a/app/javascript/mastodon/locales/zh-HK.json b/app/javascript/mastodon/locales/zh-HK.json
index c0b4cfce976..a461085c7f8 100644
--- a/app/javascript/mastodon/locales/zh-HK.json
+++ b/app/javascript/mastodon/locales/zh-HK.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "Are you really, really sure you want to block the entire {domain}? In most cases a few targeted blocks or mutes are sufficient and preferable.",
   "confirmations.mute.confirm": "靜音",
   "confirmations.mute.message": "你確定要將{name}靜音嗎？",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "活動",
   "emoji_button.flags": "旗幟",
   "emoji_button.food": "飲飲食食",
diff --git a/app/javascript/mastodon/locales/zh-TW.json b/app/javascript/mastodon/locales/zh-TW.json
index 772cc691cdb..d766fb3943c 100644
--- a/app/javascript/mastodon/locales/zh-TW.json
+++ b/app/javascript/mastodon/locales/zh-TW.json
@@ -55,6 +55,8 @@
   "confirmations.domain_block.message": "你真的真的確定要封鎖整個 {domain} ？多數情況下，比較推薦封鎖或消音幾個特定目標就好。",
   "confirmations.mute.confirm": "消音",
   "confirmations.mute.message": "你確定要消音 {name} ？",
+  "confirmations.unfollow.confirm": "Unfollow",
+  "confirmations.unfollow.message": "Are you sure you want to unfollow {name}?",
   "emoji_button.activity": "活動",
   "emoji_button.flags": "旗幟",
   "emoji_button.food": "食物與飲料",
diff --git a/app/lib/user_settings_decorator.rb b/app/lib/user_settings_decorator.rb
index c5da180291f..62046ed7262 100644
--- a/app/lib/user_settings_decorator.rb
+++ b/app/lib/user_settings_decorator.rb
@@ -19,6 +19,7 @@ class UserSettingsDecorator
     user.settings['interactions'] = merged_interactions
     user.settings['default_privacy'] = default_privacy_preference
     user.settings['default_sensitive'] = default_sensitive_preference
+    user.settings['unfollow_modal'] = unfollow_modal_preference
     user.settings['boost_modal'] = boost_modal_preference
     user.settings['delete_modal'] = delete_modal_preference
     user.settings['auto_play_gif'] = auto_play_gif_preference
@@ -42,6 +43,10 @@ class UserSettingsDecorator
     boolean_cast_setting 'setting_default_sensitive'
   end
 
+  def unfollow_modal_preference
+    boolean_cast_setting 'setting_unfollow_modal'
+  end
+
   def boost_modal_preference
     boolean_cast_setting 'setting_boost_modal'
   end
diff --git a/app/models/user.rb b/app/models/user.rb
index becf0018fbe..25dc2586434 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -83,6 +83,10 @@ class User < ApplicationRecord
     settings.default_sensitive
   end
 
+  def setting_unfollow_modal
+    settings.unfollow_modal
+  end
+
   def setting_boost_modal
     settings.boost_modal
   end
diff --git a/app/serializers/initial_state_serializer.rb b/app/serializers/initial_state_serializer.rb
index 704d29a5747..0191948b1c1 100644
--- a/app/serializers/initial_state_serializer.rb
+++ b/app/serializers/initial_state_serializer.rb
@@ -15,6 +15,7 @@ class InitialStateSerializer < ActiveModel::Serializer
 
     if object.current_account
       store[:me]             = object.current_account.id
+      store[:unfollow_modal] = object.current_account.user.setting_unfollow_modal
       store[:boost_modal]    = object.current_account.user.setting_boost_modal
       store[:delete_modal]   = object.current_account.user.setting_delete_modal
       store[:auto_play_gif]  = object.current_account.user.setting_auto_play_gif
diff --git a/app/views/settings/preferences/show.html.haml b/app/views/settings/preferences/show.html.haml
index 3b5d90942a8..fae6090c81b 100644
--- a/app/views/settings/preferences/show.html.haml
+++ b/app/views/settings/preferences/show.html.haml
@@ -44,6 +44,7 @@
     = f.input :setting_noindex, as: :boolean, wrapper: :with_label
 
   .fields-group
+    = f.input :setting_unfollow_modal, as: :boolean, wrapper: :with_label
     = f.input :setting_boost_modal, as: :boolean, wrapper: :with_label
     = f.input :setting_delete_modal, as: :boolean, wrapper: :with_label
 
diff --git a/config/locales/simple_form.en.yml b/config/locales/simple_form.en.yml
index 476ccc77312..536bb06e10e 100644
--- a/config/locales/simple_form.en.yml
+++ b/config/locales/simple_form.en.yml
@@ -42,6 +42,7 @@ en:
         setting_default_sensitive: Always mark media as sensitive
         setting_delete_modal: Show confirmation dialog before deleting a toot
         setting_system_font_ui: Use system's default font
+        setting_unfollow_modal: Show confirmation dialog before unfollowing someone
         setting_noindex: Opt-out of search engine indexing
         severity: Severity
         type: Import type
diff --git a/spec/lib/user_settings_decorator_spec.rb b/spec/lib/user_settings_decorator_spec.rb
index a67487779fc..6fbf6536bae 100644
--- a/spec/lib/user_settings_decorator_spec.rb
+++ b/spec/lib/user_settings_decorator_spec.rb
@@ -35,6 +35,13 @@ describe UserSettingsDecorator do
       expect(user.settings['default_sensitive']).to eq true
     end
 
+    it 'updates the user settings value for unfollow modal' do
+      values = { 'setting_unfollow_modal' => '0' }
+
+      settings.update(values)
+      expect(user.settings['unfollow_modal']).to eq false
+    end
+
     it 'updates the user settings value for boost modal' do
       values = { 'setting_boost_modal' => '1' }
 
diff --git a/spec/models/user_spec.rb b/spec/models/user_spec.rb
index 2019ec0f698..ef45818b979 100644
--- a/spec/models/user_spec.rb
+++ b/spec/models/user_spec.rb
@@ -219,6 +219,14 @@ RSpec.describe User, type: :model do
     end
   end
 
+  describe '#setting_unfollow_modal' do
+    it 'returns unfollow modal setting' do
+      user = Fabricate(:user)
+      user.settings[:unfollow_modal] = true
+      expect(user.setting_unfollow_modal).to eq true
+    end
+  end
+
   describe '#setting_delete_modal' do
     it 'returns delete modal setting' do
       user = Fabricate(:user)