Implement basic settings page

framework/core/js/lib/Model.js

@@ -155,7 +155,7 @@ export default class Model {
 
     return app.request({
       method: this.exists ? 'PATCH' : 'POST',
-      url: app.forum.attribute('apiUrl') + '/' + this.data.type + (this.exists ? '/' + this.data.id : ''),
+      url: app.forum.attribute('apiUrl') + this.apiEndpoint(),
       data: {data}
     }).then(
       // If everything went well, we'll make sure the store knows that this
@@ -187,13 +187,23 @@ export default class Model {
 
     return app.request({
       method: 'DELETE',
-      url: app.forum.attribute('apiUrl') + '/' + this.data.type + '/' + this.data.id,
+      url: app.forum.attribute('apiUrl') + this.apiEndpoint(),
       data
     }).then(
       () => this.exists = false
     );
   }
 
+  /**
+   * Construct a path to the API endpoint for this resource.
+   *
+   * @return {String}
+   * @protected
+   */
+  apiEndpoint() {
+    return '/' + this.data.type + (this.exists ? '/' + this.data.id : '');
+  }
+
   /**
    * Generate a function which returns the value of the given attribute.
    *

framework/core/js/lib/components/Button.js

@@ -1,6 +1,7 @@
 import Component from 'flarum/Component';
 import icon from 'flarum/helpers/icon';
 import extract from 'flarum/utils/extract';
+import LoadingIndicator from 'flarum/components/LoadingIndicator';
 
 /**
  * The `Button` component defines an element which, when clicked, performs an
@@ -11,6 +12,7 @@ import extract from 'flarum/utils/extract';
  * - `disabled` Whether or not the button is disabled. If truthy, the button
  *   will be given a 'disabled' class name, and any `onclick` handler will be
  *   removed.
+ * - `loading` Whether or not the button should be in a disabled loading state.
  *
  * All other props will be assigned as attributes on the button element.
  *
@@ -28,8 +30,9 @@ export default class Button extends Component {
     const iconName = extract(attrs, 'icon');
     if (iconName) attrs.className += ' hasIcon';
 
-    if (attrs.disabled) {
-      attrs.className += ' disabled';
+    const loading = extract(attrs, 'loading');
+    if (attrs.disabled || loading) {
+      attrs.className += ' disabled' + (loading ? ' loading' : '');
       delete attrs.onclick;
     }
 
@@ -47,7 +50,8 @@ export default class Button extends Component {
 
     return [
       iconName ? icon(iconName, {className: 'Button-icon'}) : '', ' ',
-      this.props.children ? <span className="Button-label">{this.props.children}</span> : ''
+      this.props.children ? <span className="Button-label">{this.props.children}</span> : '',
+      this.props.loading ? LoadingIndicator.component({size: 'tiny', className: 'LoadingIndicator--inline'}) : ''
     ];
   }
 }

framework/core/js/lib/models/Forum.js

@@ -1,3 +1,7 @@
 import Model from 'flarum/Model';
 
-export default class Forum extends Model {}
+export default class Forum extends Model {
+  apiEndpoint() {
+    return '/forum';
+  }
+}