diff --git a/extensions/pusher/js/admin/src/components/PusherSettingsModal.js b/extensions/pusher/js/admin/src/components/PusherSettingsModal.js
index 1dbf02c88..ce5b2e622 100644
--- a/extensions/pusher/js/admin/src/components/PusherSettingsModal.js
+++ b/extensions/pusher/js/admin/src/components/PusherSettingsModal.js
@@ -1,16 +1,6 @@
-import Modal from 'flarum/components/Modal';
-import Button from 'flarum/components/Button';
-import saveConfig from 'flarum/utils/saveConfig';
-
-export default class PusherSettingsModal extends Modal {
-  constructor(...args) {
-    super(...args);
-
-    this.appId = m.prop(app.config['pusher.app_id'] || '');
-    this.appKey = m.prop(app.config['pusher.app_key'] || '');
-    this.appSecret = m.prop(app.config['pusher.app_secret'] || '');
-  }
+import SettingsModal from 'flarum/components/SettingsModal';
 
+export default class PusherSettingsModal extends SettingsModal {
   className() {
     return 'PusherSettingsModal Modal--small';
   }
@@ -19,53 +9,22 @@ export default class PusherSettingsModal extends Modal {
     return 'Pusher Settings';
   }
 
-  content() {
-    return (
-      <div className="Modal-body">
-        <div className="Form">
-          <div className="Form-group">
-            <label>App ID</label>
-            <input className="FormControl" value={this.appId()} oninput={m.withAttr('value', this.appId)}/>
-          </div>
+  form() {
+    return [
+      <div className="Form-group">
+        <label>App ID</label>
+        <input className="FormControl" bidi={this.setting('pusher.app_id')}/>
+      </div>,
 
-          <div className="Form-group">
-            <label>App Key</label>
-            <input className="FormControl" value={this.appKey()} oninput={m.withAttr('value', this.appKey)}/>
-          </div>
+      <div className="Form-group">
+        <label>App Key</label>
+        <input className="FormControl" bidi={this.setting('pusher.app_key')}/>
+      </div>,
 
-          <div className="Form-group">
-            <label>App Secret</label>
-            <input className="FormControl" value={this.appSecret()} oninput={m.withAttr('value', this.appSecret)}/>
-          </div>
-
-          <div className="Form-group">
-            {Button.component({
-              type: 'submit',
-              className: 'Button Button--primary PusherSettingsModal-save',
-              loading: this.loading,
-              children: 'Save Changes'
-            })}
-          </div>
-        </div>
+      <div className="Form-group">
+        <label>App Secret</label>
+        <input className="FormControl" bidi={this.setting('pusher.app_secret')}/>
       </div>
-    );
-  }
-
-  onsubmit(e) {
-    e.preventDefault();
-
-    this.loading = true;
-
-    saveConfig({
-      'pusher.app_id': this.appId(),
-      'pusher.app_key': this.appKey(),
-      'pusher.app_secret': this.appSecret()
-    }).then(
-      () => this.hide(),
-      () => {
-        this.loading = false;
-        m.redraw();
-      }
-    );
+    ];
   }
 }