diff --git a/extensions/subscriptions/js/src/forum/components/SubscriptionMenu.js b/extensions/subscriptions/js/src/forum/components/SubscriptionMenu.js
index 559d272db..f33535e59 100644
--- a/extensions/subscriptions/js/src/forum/components/SubscriptionMenu.js
+++ b/extensions/subscriptions/js/src/forum/components/SubscriptionMenu.js
@@ -1,7 +1,9 @@
 import Dropdown from 'flarum/components/Dropdown';
 import Button from 'flarum/components/Button';
+import Tooltip from 'flarum/common/components/Tooltip';
 import icon from 'flarum/helpers/icon';
 import extractText from 'flarum/utils/extractText';
+import classList from 'flarum/utils/classList';
 
 import SubscriptionMenuItem from './SubscriptionMenuItem';
 
@@ -14,20 +16,20 @@ export default class SubscriptionMenu extends Dropdown {
         subscription: null,
         icon: 'far fa-star',
         label: app.translator.trans('flarum-subscriptions.forum.sub_controls.not_following_button'),
-        description: app.translator.trans('flarum-subscriptions.forum.sub_controls.not_following_text')
+        description: app.translator.trans('flarum-subscriptions.forum.sub_controls.not_following_text'),
       },
       {
         subscription: 'follow',
         icon: 'fas fa-star',
         label: app.translator.trans('flarum-subscriptions.forum.sub_controls.following_button'),
-        description: app.translator.trans('flarum-subscriptions.forum.sub_controls.following_text')
+        description: app.translator.trans('flarum-subscriptions.forum.sub_controls.following_text'),
       },
       {
         subscription: 'ignore',
         icon: 'far fa-eye-slash',
         label: app.translator.trans('flarum-subscriptions.forum.sub_controls.ignoring_button'),
-        description: app.translator.trans('flarum-subscriptions.forum.sub_controls.ignoring_text')
-      }
+        description: app.translator.trans('flarum-subscriptions.forum.sub_controls.ignoring_text'),
+      },
     ];
   }
 
@@ -51,58 +53,61 @@ export default class SubscriptionMenu extends Dropdown {
         break;
 
       default:
-        // no default
+      // no default
     }
 
     const preferences = app.session.user.preferences();
     const notifyEmail = preferences['notify_newPost_email'];
     const notifyAlert = preferences['notify_newPost_alert'];
-    const title = extractText(app.translator.trans(notifyEmail
-      ? 'flarum-subscriptions.forum.sub_controls.notify_email_tooltip'
-      : 'flarum-subscriptions.forum.sub_controls.notify_alert_tooltip'));
+    const tooltipText = extractText(
+      app.translator.trans(
+        notifyEmail ? 'flarum-subscriptions.forum.sub_controls.notify_email_tooltip' : 'flarum-subscriptions.forum.sub_controls.notify_alert_tooltip'
+      )
+    );
 
-    const buttonAttrs = {
-      className: 'Button SubscriptionMenu-button ' + buttonClass,
-      icon: buttonIcon,
-      onclick: this.saveSubscription.bind(this, discussion, ['follow', 'ignore'].indexOf(subscription) !== -1 ? null : 'follow'),
-      title: title
-    };
+    const shouldShowTooltip = (notifyEmail || notifyAlert) && subscription === null;
 
-    if ((notifyEmail || notifyAlert) && subscription === null) {
-      buttonAttrs.oncreate = buttonAttrs.onupdate = vnode => {
-        $(vnode.dom).tooltip({
-          container: '.SubscriptionMenu',
-          placement: 'bottom',
-          delay: 250,
-          title
-        });
-      }
-    } else {
-      buttonAttrs.onupdate = vnode => $(vnode.dom).tooltip('destroy');
-    }
+    const button = (
+      <Button
+        className={classList('Button', 'SubscriptionMenu-button', buttonClass)}
+        icon={buttonIcon}
+        onclick={this.saveSubscription.bind(this, discussion, ['follow', 'ignore'].indexOf(subscription) !== -1 ? null : 'follow')}
+      >
+        {buttonLabel}
+      </Button>
+    );
 
     return (
       <div className="Dropdown ButtonGroup SubscriptionMenu">
-        {Button.component(buttonAttrs, buttonLabel)}
+        {shouldShowTooltip ? (
+          <Tooltip text={tooltipText} position="bottom">
+            {button}
+          </Tooltip>
+        ) : (
+          button
+        )}
 
-        <button className={'Dropdown-toggle Button Button--icon ' + buttonClass} data-toggle="dropdown">
-          {icon('fas fa-caret-down', {className: 'Button-icon'})}
+        <button className={classList('Dropdown-toggle Button Button--icon', buttonClass)} data-toggle="dropdown">
+          {icon('fas fa-caret-down', { className: 'Button-icon' })}
         </button>
 
         <ul className="Dropdown-menu dropdown-menu Dropdown-menu--right">
-          {this.options.map(attrs => <li>{SubscriptionMenuItem.component({
-              ...attrs,
-              onclick: this.saveSubscription.bind(this, discussion, attrs.subscription),
-              active: subscription === attrs.subscription
-            })}</li>
-          )}
+          {this.options.map((attrs) => (
+            <li>
+              {SubscriptionMenuItem.component({
+                ...attrs,
+                onclick: this.saveSubscription.bind(this, discussion, attrs.subscription),
+                active: subscription === attrs.subscription,
+              })}
+            </li>
+          ))}
         </ul>
       </div>
     );
   }
 
   saveSubscription(discussion, subscription) {
-    discussion.save({subscription});
+    discussion.save({ subscription });
 
     this.$('.SubscriptionMenu-button').tooltip('hide');
   }