Perform general repo maintenance (#37)

* Perform general repo maintenance

- Bump deps
- Add Prettier
- Add `flarum-tsconfig` for typings support

* Move webpack config to devDeps

* Use organisation Prettier

* Add setup for https://github.com/flarum/flarum-tsconfig/pull/2

extensions/suspend/js/package.json

@@ -1,13 +1,20 @@
 {
   "private": true,
   "name": "@flarum/suspend",
+  "prettier": "@flarum/prettier-config",
   "dependencies": {
-    "flarum-webpack-config": "0.1.0-beta.10",
-    "webpack": "^4.43.0",
-    "webpack-cli": "^3.3.11"
+    "webpack": "^4.46.0",
+    "webpack-cli": "^4.7.2"
   },
   "scripts": {
     "dev": "webpack --mode development --watch",
-    "build": "webpack --mode production"
+    "build": "webpack --mode production",
+    "format": "prettier --write src"
+  },
+  "devDependencies": {
+    "@flarum/prettier-config": "^1.0.0",
+    "flarum-tsconfig": "^1.0.0",
+    "flarum-webpack-config": "1.0.0",
+    "prettier": "^2.3.2"
   }
 }

extensions/suspend/js/src/admin/index.js

@@ -1,11 +1,12 @@
 import app from 'flarum/app';
 
 app.initializers.add('flarum-suspend', () => {
-  app.extensionData
-    .for('flarum-suspend')
-    .registerPermission({
+  app.extensionData.for('flarum-suspend').registerPermission(
+    {
       icon: 'fas fa-ban',
       label: app.translator.trans('flarum-suspend.admin.permissions.suspend_users_label'),
-      permission: 'user.suspend'
-    }, 'moderate');
+      permission: 'user.suspend',
+    },
+    'moderate'
+  );
 });

extensions/suspend/js/src/forum/components/SuspendUserModal.js

@@ -27,7 +27,7 @@ export default class SuspendUserModal extends Modal {
   }
 
   title() {
-    return app.translator.trans('flarum-suspend.forum.suspend_user.title', {user: this.attrs.user});
+    return app.translator.trans('flarum-suspend.forum.suspend_user.title', { user: this.attrs.user });
   }
 
   content() {
@@ -38,33 +38,49 @@ export default class SuspendUserModal extends Modal {
             <label>{app.translator.trans('flarum-suspend.forum.suspend_user.status_heading')}</label>
             <div>
               <label className="checkbox">
-                <input type="radio" name="status" checked={!this.status()} value="" onclick={withAttr('value', this.status)}/>
+                <input type="radio" name="status" checked={!this.status()} value="" onclick={withAttr('value', this.status)} />
                 {app.translator.trans('flarum-suspend.forum.suspend_user.not_suspended_label')}
               </label>
 
               <label className="checkbox">
-                <input type="radio" name="status" checked={this.status() === 'indefinitely'} value='indefinitely' onclick={withAttr('value', this.status)}/>
+                <input
+                  type="radio"
+                  name="status"
+                  checked={this.status() === 'indefinitely'}
+                  value="indefinitely"
+                  onclick={withAttr('value', this.status)}
+                />
                 {app.translator.trans('flarum-suspend.forum.suspend_user.indefinitely_label')}
               </label>
 
               <label className="checkbox SuspendUserModal-days">
-                <input type="radio" name="status" checked={this.status() === 'limited'} value='limited' onclick={e => {
-                  this.status(e.target.value);
-                  m.redraw.sync();
-                  this.$('.SuspendUserModal-days-input input').select();
-                  e.redraw = false;
-                }}/>
+                <input
+                  type="radio"
+                  name="status"
+                  checked={this.status() === 'limited'}
+                  value="limited"
+                  onclick={(e) => {
+                    this.status(e.target.value);
+                    m.redraw.sync();
+                    this.$('.SuspendUserModal-days-input input').select();
+                    e.redraw = false;
+                  }}
+                />
                 {app.translator.trans('flarum-suspend.forum.suspend_user.limited_time_label')}
                 {this.status() === 'limited' ? (
                   <div className="SuspendUserModal-days-input">
-                    <input type="number"
+                    <input
+                      type="number"
                       min="0"
                       value={this.daysRemaining()}
                       oninput={withAttr('value', this.daysRemaining)}
-                      className="FormControl"/>
+                      className="FormControl"
+                    />
                     {app.translator.trans('flarum-suspend.forum.suspend_user.limited_time_days_text')}
                   </div>
-                ) : ''}
+                ) : (
+                  ''
+                )}
               </label>
             </div>
           </div>
@@ -95,12 +111,9 @@ export default class SuspendUserModal extends Modal {
         break;
 
       default:
-        // no default
+      // no default
     }
 
-    this.attrs.user.save({suspendedUntil}).then(
-      () => this.hide(),
-      this.loaded.bind(this)
-    );
+    this.attrs.user.save({ suspendedUntil }).then(() => this.hide(), this.loaded.bind(this));
   }
 }

extensions/suspend/js/src/forum/index.js

@@ -19,22 +19,31 @@ app.initializers.add('flarum-suspend', () => {
 
   extend(UserControls, 'moderationControls', (items, user) => {
     if (user.canSuspend()) {
-      items.add('suspend', Button.component({
-        icon: 'fas fa-ban',
-        onclick: () => app.modal.show(SuspendUserModal, {user})
-      }, app.translator.trans('flarum-suspend.forum.user_controls.suspend_button')));
+      items.add(
+        'suspend',
+        Button.component(
+          {
+            icon: 'fas fa-ban',
+            onclick: () => app.modal.show(SuspendUserModal, { user }),
+          },
+          app.translator.trans('flarum-suspend.forum.user_controls.suspend_button')
+        )
+      );
     }
   });
 
-  extend(User.prototype, 'badges', function(items) {
+  extend(User.prototype, 'badges', function (items) {
     const until = this.suspendedUntil();
 
     if (new Date() < until) {
-      items.add('suspended', Badge.component({
-        icon: 'fas fa-ban',
-        type: 'suspended',
-        label: app.translator.trans('flarum-suspend.forum.user_badge.suspended_tooltip')
-      }));
+      items.add(
+        'suspended',
+        Badge.component({
+          icon: 'fas fa-ban',
+          type: 'suspended',
+          label: app.translator.trans('flarum-suspend.forum.user_badge.suspended_tooltip'),
+        })
+      );
     }
   });
 });

extensions/suspend/js/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  // Use Flarum's tsconfig as a starting point
+  "extends": "flarum-tsconfig",
+  // This will match all .ts, .tsx, .d.ts, .js, .jsx files in your `src` folder
+  // and also tells your Typescript server to read core's global typings for
+  // access to `dayjs` and `$` in the global namespace.
+  "include": ["src/**/*", "../vendor/flarum/core/js/dist-typings/@types/**/*"],
+  "compilerOptions": {
+    // This will output typings to `dist-typings`
+    "declarationDir": "./dist-typings",
+    "baseUrl": ".",
+    "paths": {
+      "flarum/*": ["../vendor/flarum/core/js/dist-typings/*"]
+    }
+  }
+}