Subscriptions: add subscription option to account dropdown

app/soapbox/features/account/components/header.js

@@ -54,6 +54,8 @@ const messages = defineMessages({
   deleteUser: { id: 'admin.users.actions.delete_user', defaultMessage: 'Delete @{name}' },
   verifyUser: { id: 'admin.users.actions.verify_user', defaultMessage: 'Verify @{name}' },
   unverifyUser: { id: 'admin.users.actions.unverify_user', defaultMessage: 'Unverify @{name}' },
+  subscribe: { id: 'account.subscribe', defaultMessage: 'Subscribe to notifications from @{name}' },
+  unsubscribe: { id: 'account.unsubscribe', defaultMessage: 'Unsubscribe to notifications from @{name}' },
 });
 
 const mapStateToProps = state => {
@@ -158,6 +160,12 @@ class Header extends ImmutablePureComponent {
           menu.push({ text: intl.formatMessage(messages.showReblogs, { name: account.get('username') }), action: this.props.onReblogToggle });
         }
 
+        if (account.getIn(['relationship', 'subscribing'])) {
+          menu.push({ text: intl.formatMessage(messages.unsubscribe, { name: account.get('username') }), action: this.props.onSubscriptionToggle });
+        } else {
+          menu.push({ text: intl.formatMessage(messages.subscribe, { name: account.get('username') }), action: this.props.onSubscriptionToggle });
+        }
+
         menu.push({ text: intl.formatMessage(messages.add_or_remove_from_list), action: this.props.onAddToList });
         // menu.push({ text: intl.formatMessage(account.getIn(['relationship', 'endorsed']) ? messages.unendorse : messages.endorse), action: this.props.onEndorseToggle });
         menu.push(null);

app/soapbox/features/account_timeline/components/header.js

@@ -52,6 +52,10 @@ export default class Header extends ImmutablePureComponent {
     this.props.onReblogToggle(this.props.account);
   }
 
+  handleSubscriptionToggle = () => {
+    this.props.onSubscriptionToggle(this.props.account);
+  }
+
   handleMute = () => {
     this.props.onMute(this.props.account);
   }
@@ -117,6 +121,7 @@ export default class Header extends ImmutablePureComponent {
           onDirect={this.handleDirect}
           onChat={this.handleChat}
           onReblogToggle={this.handleReblogToggle}
+          onSubscriptionToggle={this.handleSubscriptionToggle}
           onReport={this.handleReport}
           onMute={this.handleMute}
           onBlockDomain={this.handleBlockDomain}

app/soapbox/features/account_timeline/containers/header_container.js

@@ -10,6 +10,9 @@ import {
   unmuteAccount,
   // pinAccount,
   // unpinAccount,
+  subscribeAccount,
+  unsubscribeAccount,
+
 } from '../../../actions/accounts';
 import {
   mentionCompose,
@@ -103,6 +106,14 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
     }
   },
 
+  onSubscriptionToggle(account) {
+    if (account.getIn(['relationship', 'subscribing'])) {
+      dispatch(unsubscribeAccount(account.get('id')));
+    } else {
+      dispatch(subscribeAccount(account.get('id')));
+    }
+  },
+
   // onEndorseToggle(account) {
   //   if (account.getIn(['relationship', 'endorsed'])) {
   //     dispatch(unpinAccount(account.get('id')));

app/soapbox/features/ui/components/subscription_button.js

@@ -12,8 +12,8 @@ import {
 } from 'soapbox/actions/accounts';
 
 const messages = defineMessages({
-  subscribe: { id: 'account.subscribe', defaultMessage: 'Subscribe to @{name} posts' },
-  unsubscribe: { id: 'account.unsubscribe', defaultMessage: 'Unsubscribe @{name} posts' },
+  subscribe: { id: 'account.subscribe', defaultMessage: 'Subscribe to notifications from @{name}' },
+  unsubscribe: { id: 'account.unsubscribe', defaultMessage: 'Unsubscribe to notifications from @{name}' },
 });
 
 const mapStateToProps = state => {