Release version 0.1.0-beta.8.1

As argued in #1675, this makes us slightly less reliant on MySQL.

.editorconfig

@@ -15,5 +15,5 @@ indent_size = 2
 [*.{diff,md}]
 trim_trailing_whitespace = false
 
-[*.php]
+[*.{php,xml}]
 indent_size = 4

.gitattributes

@@ -1,6 +1,8 @@
 .gitattributes export-ignore
 .gitignore export-ignore
 .gitmodules export-ignore
+.github export-ignore
+.travis export-ignore
 .travis.yml export-ignore
 .editorconfig export-ignore
 .styleci.yml export-ignore
@@ -8,4 +10,4 @@
 phpunit.xml export-ignore
 tests export-ignore
 
-js/*/dist/*.js -diff
+js/dist/* -diff

.github/CONTRIBUTING.md

@@ -1,3 +0,0 @@
-# Contributing to Flarum
-
-Howdy! We're really excited that you are interested in contributing to Flarum. Before submitting your contribution, please take a moment and read through the [Contributing Guidelines](https://github.com/flarum/flarum/blob/master/CONTRIBUTING.md).

.github/ISSUE_TEMPLATE.md

@@ -1,26 +0,0 @@
-> Issues on Github are meant for bug reporting. Please post feature requests on the [discussion forum](https://discuss.flarum.org/t/features).
----
-> Try to complete the below form as far as you are able and are willing to share. Add a screenshot of the issue if you can.
-
-## Bug report
-- Version of Flarum: x.y.z
-- Website URL where the bug is visible: http://example.com
-- The webserver you are running: apache, nginx or something else
-- PHP version: x.y.z
-- Hosted environment: shared or vps
-- Hosting provider: http://some-amazing-provider.com
-
-## Flarum info
-
-```
-Output of "php flarum info", run this in terminal in your Flarum directory.
-```
-
-## Additional comments
-Some additional information you'd like to share, eg what have you tried so far.
-
-## Log files
-
-```
-Put any relevant logs here.
-```

.github/ISSUE_TEMPLATE/bug-report.md

@@ -0,0 +1,42 @@
+---
+name: "🐛 Bug Report"
+about: "If something isn't working as expected"
+
+---
+<!--
+IMPORTANT: If you discover a security vulnerability within Flarum, please send an email to [security@flarum.org](mailto:security@flarum.org) instead. We will address these with the utmost urgency and it will prevent vulnerabilities, which may be abused, from popping up on our issue tracker.
+-->
+## Bug Report
+
+**Current Behavior**
+A clear and concise description of the behavior.
+
+**Steps to Reproduce**
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+**Expected Behavior**
+A clear and concise description of what you expected to happen.
+
+**Screenshots**
+If applicable, add screenshots to help explain your problem.
+
+**Environment**
+- Flarum version: x.y.z
+- Website URL: http://example.com
+- Webserver: [e.g. apache, nginx]
+- Hosting environment: [e.g. shared, vps]
+- PHP version: x.y.z
+- Browser: [e.g. chrome 67, safari 11]
+
+```
+Output of "php flarum info", run this in terminal in your Flarum directory.
+```
+
+**Possible Solution**
+<!--- Only if you have suggestions or a fix for the bug -->
+
+**Additional Context**
+Add any other context about the problem here.

.github/ISSUE_TEMPLATE/feature-request.md

@@ -0,0 +1,26 @@
+---
+name: "🚀 Feature Request"
+about: "I have a suggestion (and may want to implement it!)"
+
+---
+
+<!--
+IMPORTANT: Feature requests on this GitHub issue tracker are only accepted in case they have been approved by a core developer or contain extensive argumentation and directions for implementation. For all other feature requests, ideas and feedback please post in the Flarum Community: https://discuss.flarum.org/t/feedback.
+-->
+
+## Feature Request
+
+**Is your feature request related to a problem? Please describe.**
+A clear and concise description of what the problem is. eg. I have an issue when [...]
+
+**Describe the solution you'd like**
+A detailed description of your proposed solution. Include:
+- How the feature would work/behave
+- Any potential drawbacks
+- Maybe a screenshot, design, or example code
+
+**Justify why this feature belongs in Flarum's core, rather than in a third-party extension**
+Consider who this change will be useful to – most Flarum forums, or just a few?
+
+**Describe alternatives you've considered**
+A clear and concise description of any alternative solutions or features you've considered.

.github/ISSUE_TEMPLATE/support-question.md

@@ -0,0 +1,11 @@
+---
+name: "🙋‍ Support Question"
+about: "If you have a question, please check out our forum or Discord!"
+
+---
+
+We primarily use GitHub as an issue tracker; for usage and support questions, please check out these resources below. Thanks!
+
+* Flarum Community: https://discuss.flarum.org/
+* Discord Chat: https://flarum.org/discord/
+* Twitter: https://twitter.com/Flarum

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,24 @@
+<!--
+IMPORTANT: We applaud pull requests, they excite us every single time. As we have an obligation to maintain a healthy code standard and quality, we take sufficient time for reviews. Please do create a separate pull request per change/issue/feature; we will ask you to split bundled pull requests.
+-->
+
+**Fixes #0000**
+
+**Changes proposed in this pull request:**
+<!-- fill this out, mention the pages and/or components which have been impacted -->
+
+**Reviewers should focus on:**
+<!-- fill this out, ask for feedback on specific changes you are unsure about -->
+
+**Screenshot**
+<!-- include an image of the most relevant user-facing change, if any -->
+
+**Confirmed**
+
+- [ ] Frontend changes: tested on a local Flarum installation.
+- [ ] Backend changes: tests are green (run `php vendor/bin/phpunit`).
+
+**Required changes:**
+
+- [ ] Related documentation PR: (Remove if irrelevant)
+- [ ] Related core extension PRs: (Remove if irrelevant)

.gitignore

@@ -1,7 +1,9 @@
 /vendor
+composer.lock
 composer.phar
+node_modules
 .DS_Store
 Thumbs.db
-tests/_output/*
+/tests/tmp
 .vagrant
 .idea/*

.travis.yml

@@ -1,35 +1,46 @@
 language: php
 
-php:
+cache:
-  - 5.6
+  directories:
-  - 7.0
+    - $HOME/.composer/cache
-  - 7.1
+    - $HOME/.npm
-  - hhvm
 
-matrix:
+install:
-  allow_failures:
-    - php: hhvm
-  fast_finish: true
-
-before_script:
-  - if [[ "$TRAVIS_PHP_VERSION" != "hhvm" ]]; then phpenv config-rm xdebug.ini; fi;
-  - composer self-update
   - composer install
+  - mysql -e 'CREATE DATABASE flarum;'
 
 script:
   - vendor/bin/phpunit --coverage-clover=coverage.xml
 
-notifications:
-  email:
-    on_failure: change
-  webhooks:
-    urls:
-      - https://webhooks.gitter.im/e/7b9e9827a03b44a16588
-    on_success: always
-    on_failure: always
-    on_start: false
-
 after_success:
   - bash <(curl -s https://codecov.io/bash)
 
-sudo: false
+jobs:
+  include:
+    - php: 7.1
+      env: DB=mysql
+
+    - php: 7.2
+      env: DB=mysql
+
+    - php: 7.2
+      env: DB=mysql PREFIX=forum_
+
+    - php: 7.1
+      addons:
+        mariadb: '10.2'
+      env: DB=mariadb
+
+    - php: 7.2
+      addons:
+        mariadb: '10.2'
+      env: DB=mariadb
+
+    - stage: build
+      language: generic
+      if: branch = master AND type = push
+      install: skip
+      script: bash .travis/build.sh
+        -k $encrypted_678139e2bc67_key
+        -i $encrypted_678139e2bc67_iv
+      after_success: skip

.travis/build.sh

@@ -0,0 +1,33 @@
+#!/bin/bash
+
+main() {
+  while getopts ":k:i:" opt; do
+    case $opt in
+      k) encrypted_key="$OPTARG"
+      ;;
+      i) encrypted_iv="$OPTARG"
+      ;;
+      \?) echo "Invalid option -$OPTARG" >&2
+      ;;
+    esac
+  done
+
+  git checkout -f $TRAVIS_BRANCH
+  git config user.name "flarum-bot"
+  git config user.email "bot@flarum.org"
+
+  cd js
+  npm i -g npm@6.1.0
+  npm ci
+  npm run build
+
+  git add dist/* -f
+  git commit -m "Bundled output for commit $TRAVIS_COMMIT [skip ci]"
+
+  eval `ssh-agent -s`
+  openssl aes-256-cbc -K $encrypted_key -iv $encrypted_iv -in ../.deploy.enc -d | ssh-add -
+
+  git push git@github.com:$TRAVIS_REPO_SLUG.git $TRAVIS_BRANCH
+}
+
+main "$@"

CHANGELOG.md

@@ -0,0 +1,13 @@
+# Changelog
+
+## [0.1.0-beta.8.1](https://github.com/flarum/core/compare/v0.1.0-beta.8...v0.1.0-beta.8.1)
+
+### Fixed
+- Fix live output in `migrate:reset` command ([f591585](https://github.com/flarum/core/commit/f591585d02f8c4ff0211c5bf4413dd6baa724c05))
+- Fix search with database prefix ([7705a2b](https://github.com/flarum/core/commit/7705a2b7d751943ef9d0c7379ec34f8530b99310))
+- Fix invalid join time of admin user created by installer ([57f73c9](https://github.com/flarum/core/commit/57f73c9638eeb825f9e336ed3c443afccfd8995e))
+- Ensure InnoDB engine is used for all tables ([fb6b51b](https://github.com/flarum/core/commit/fb6b51b1cfef0af399607fe038603c8240800b2b))
+- Fix dropping foreign keys in `down` migrations ([57d5846](https://github.com/flarum/core/commit/57d5846b647881009d9e60f9ffca20b1bb77776e))
+- Fix discussion list scroll position not being maintained when hero is not visible ([40dc6ac](https://github.com/flarum/core/commit/40dc6ac604c2a0973356b38217aa8d09352daae5))
+- Fix empty meta description tag ([88e43cc](https://github.com/flarum/core/commit/88e43cc6940ee30d6529e9ce659471ec4fb1c474))
+- Remove empty attributes on `<html>` tag ([796b577](https://github.com/flarum/core/commit/796b57753d34d4ea741dbebcbc550b17808f6c94))

CONTRIBUTING.md

@@ -0,0 +1,3 @@
+# Contributing to Flarum
+
+Thank you for considering contributing to Flarum! Please read the **[Contributing guide](https://flarum.org/docs/contributing.html)** to learn how you can help.

LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2014-2017 Toby Zerner
+Copyright (c) Toby Zerner
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,7 +1,35 @@
-# Flarum Core
+<p align="center"><img src="https://flarum.org/img/logo.png"></p>
 
-This repository contains Flarum's core code. If you want to set up a forum, visit the [main Flarum repository](http://github.com/flarum/flarum).
+<p align="center">
+<a href="https://travis-ci.org/flarum/core"><img src="https://travis-ci.org/flarum/core.svg" alt="Build Status"></a>
+<a href="https://packagist.org/packages/flarum/core"><img src="https://poser.pugx.org/flarum/core/d/total.svg" alt="Total Downloads"></a>
+<a href="https://packagist.org/packages/flarum/core"><img src="https://poser.pugx.org/flarum/core/v/stable.svg" alt="Latest Stable Version"></a>
+<a href="https://packagist.org/packages/flarum/core"><img src="https://poser.pugx.org/flarum/core/license.svg" alt="License"></a>
+</p>
+
+## About Flarum
+
+**[Flarum](https://flarum.org/) is a delightfully simple discussion platform for your website.** It's fast and easy to use, with all the features you need to run a successful community. It is designed to be:
+
+* **Fast and simple.** No clutter, no bloat, no complex dependencies. Flarum is built with PHP so it’s quick and easy to deploy. The interface is powered by Mithril, a performant JavaScript framework with a tiny footprint.
+
+* **Beautiful and responsive.** This is forum software for humans. Flarum is carefully designed to be consistent and intuitive across platforms, out-of-the-box.
+
+* **Powerful and extensible.** Customize, extend, and integrate Flarum to suit your community. Flarum’s architecture is amazingly flexible, with a powerful Extension API.
+
+## Installation
+
+This repository contains Flarum's core code. If you want to set up a forum, visit the [Flarum skeleton repository](https://github.com/flarum/flarum).
 
 ## Contributing
 
-Flarum is open-source and we would love your help building it! Please read the [Contributing Guide](https://github.com/flarum/flarum/blob/master/CONTRIBUTING.md) to learn how you can help.
+Thank you for considering contributing to Flarum! Please read the **[Contributing guide](https://flarum.org/docs/contributing.html)** to learn how you can help.
+
+## Security Vulnerabilities
+
+If you discover a security vulnerability within Flarum, please send an e-mail to [security@flarum.org](mailto:security@flarum.org). All security vulnerabilities will be promptly addressed.
+
+## License
+
+Flarum is open-source software licensed under the [MIT License](https://github.com/flarum/flarum/blob/master/LICENSE).
+

composer.json

@@ -2,7 +2,7 @@
     "name": "flarum/core",
     "description": "Delightfully simple forum software.",
     "keywords": ["forum", "discussion"],
-    "homepage": "http://flarum.org",
+    "homepage": "https://flarum.org/",
     "license": "MIT",
     "authors": [
         {
@@ -17,47 +17,55 @@
     "support": {
         "issues": "https://github.com/flarum/core/issues",
         "source": "https://github.com/flarum/core",
-        "docs": "http://flarum.org/docs"
+        "docs": "https://flarum.org/docs/"
     },
     "require": {
-        "php": ">=5.6.0",
+        "php": ">=7.1",
+        "axy/sourcemap": "^0.1.4",
+        "components/font-awesome": "^5.4.2",
         "dflydev/fig-cookies": "^1.0.2",
-        "doctrine/dbal": "^2.5",
+        "doctrine/dbal": "^2.7",
-        "components/font-awesome": "^4.6",
         "franzl/whoops-middleware": "^0.4.0",
-        "illuminate/bus": "5.1.*",
+        "illuminate/bus": "5.5.*",
-        "illuminate/cache": "5.1.*",
+        "illuminate/cache": "5.5.*",
-        "illuminate/config": "5.1.*",
+        "illuminate/config": "5.5.*",
-        "illuminate/container": "5.1.*",
+        "illuminate/container": "5.5.*",
-        "illuminate/contracts": "5.1.*",
+        "illuminate/contracts": "5.5.*",
-        "illuminate/database": "^5.1.31",
+        "illuminate/database": "5.5.*",
-        "illuminate/events": "5.1.*",
+        "illuminate/events": "5.5.*",
-        "illuminate/filesystem": "5.1.*",
+        "illuminate/filesystem": "5.5.*",
-        "illuminate/hashing": "5.1.*",
+        "illuminate/hashing": "5.5.*",
-        "illuminate/mail": "5.1.*",
+        "illuminate/mail": "5.5.*",
-        "illuminate/support": "5.1.*",
+        "illuminate/session": "5.5.*",
-        "illuminate/validation": "5.1.*",
+        "illuminate/support": "5.5.*",
-        "illuminate/view": "5.1.*",
+        "illuminate/validation": "5.5.*",
+        "illuminate/view": "5.5.*",
         "intervention/image": "^2.3.0",
         "league/flysystem": "^1.0.11",
-        "league/oauth2-client": "~1.0",
         "matthiasmullie/minify": "^1.3",
+        "middlewares/base-path": "^1.1",
+        "middlewares/base-path-router": "^0.2.1",
+        "middlewares/request-handler": "^1.2",
         "monolog/monolog": "^1.16.0",
         "nikic/fast-route": "^0.6",
-        "oyejorge/less.php": "~1.5",
+        "oyejorge/less.php": "^1.7",
         "psr/http-message": "^1.0",
-        "symfony/console": "^2.7",
+        "psr/http-server-handler": "^1.0",
-        "symfony/http-foundation": "^2.7",
+        "psr/http-server-middleware": "^1.0",
-        "symfony/translation": "^2.7",
+        "s9e/text-formatter": "^1.2.0",
-        "symfony/yaml": "^2.7",
+        "symfony/config": "^3.3",
-        "s9e/text-formatter": "^0.8.1",
+        "symfony/console": "^3.3",
+        "symfony/http-foundation": "^3.3",
+        "symfony/translation": "^3.3",
+        "symfony/yaml": "^3.3",
         "tobscure/json-api": "^0.3.0",
-        "zendframework/zend-diactoros": "^1.1",
+        "zendframework/zend-diactoros": "^1.8.4",
-        "zendframework/zend-stratigility": "^1.3"
+        "zendframework/zend-httphandlerrunner": "^1.0",
+        "zendframework/zend-stratigility": "^3.0"
     },
     "require-dev": {
         "mockery/mockery": "^0.9.4",
-        "phpunit/phpunit": "^4.8"
+        "phpunit/phpunit": "^6.0"
     },
     "autoload": {
         "psr-4": {
@@ -69,9 +77,12 @@
     },
     "autoload-dev": {
         "psr-4": {
-            "Tests\\": "tests/"
+            "Flarum\\Tests\\": "tests/"
         }
     },
+    "config": {
+        "sort-packages": true
+    },
     "extra": {
         "branch-alias": {
             "dev-master": "0.1.x-dev"

error/403.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head lang="en">
-    <meta charset="UTF-8">
-    <title></title>
-</head>
-<body>
-
-<h1>403 Forbidden</h1>
-<p>You do not have permissions to access this page.</p>
-
-</body>
-</html>

error/404.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head lang="en">
-  <meta charset="UTF-8">
-  <title></title>
-</head>
-<body>
-
-<h1>404 Not Found</h1>
-<p>Looks like this page could not be found.</p>
-
-</body>
-</html>

error/500.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head lang="en">
-  <meta charset="UTF-8">
-  <title></title>
-</head>
-<body>
-
-<h1>500 Internal Server Error</h1>
-<p>Something went wrong on our server.</p>
-
-</body>
-</html>

error/503.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head lang="en">
-  <meta charset="UTF-8">
-  <title></title>
-</head>
-<body>
-
-<h1>503 Service Unavailable</h1>
-<p>This forum is down for maintenance.</p>
-
-</body>
-</html>

js/.gitignore

@@ -1 +0,0 @@
-bower_components

js/admin.js

@@ -0,0 +1,11 @@
+/*
+ * This file is part of Flarum.
+ *
+ * (c) Toby Zerner <toby.zerner@gmail.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+export * from './src/common';
+export * from './src/admin';

js/admin/.gitignore

@@ -1 +0,0 @@
-node_modules

js/admin/Gulpfile.js

@@ -1,31 +0,0 @@
-var gulp = require('flarum-gulp');
-
-var bowerDir = '../bower_components';
-
-gulp({
-  includeHelpers: true,
-  files: [
-    bowerDir + '/es6-micro-loader/dist/system-polyfill.js',
-
-    bowerDir + '/mithril/mithril.js',
-    bowerDir + '/m.attrs.bidi/bidi.js',
-    bowerDir + '/jquery/dist/jquery.js',
-    bowerDir + '/moment/moment.js',
-
-    bowerDir + '/bootstrap/js/affix.js',
-    bowerDir + '/bootstrap/js/dropdown.js',
-    bowerDir + '/bootstrap/js/modal.js',
-    bowerDir + '/bootstrap/js/tooltip.js',
-    bowerDir + '/bootstrap/js/transition.js',
-
-    bowerDir + '/spin.js/spin.js',
-    bowerDir + '/spin.js/jquery.spin.js'
-  ],
-  modules: {
-    'flarum': [
-      'src/**/*.js',
-      '../lib/**/*.js'
-    ]
-  },
-  outputFile: 'dist/app.js'
-});

js/admin/package.json

@@ -1,7 +0,0 @@
-{
-  "private": true,
-  "devDependencies": {
-    "gulp": "^3.9.1",
-    "flarum-gulp": "^0.2.0"
-  }
-}

js/admin/src/app.js

@@ -1,33 +0,0 @@
-import App from 'flarum/App';
-import store from 'flarum/initializers/store';
-import preload from 'flarum/initializers/preload';
-import routes from 'flarum/initializers/routes';
-import boot from 'flarum/initializers/boot';
-
-const app = new App();
-
-app.initializers.add('store', store);
-app.initializers.add('routes', routes);
-
-app.initializers.add('preload', preload, -100);
-app.initializers.add('boot', boot, -100);
-
-app.extensionSettings = {};
-
-app.getRequiredPermissions = function(permission) {
-  const required = [];
-
-  if (permission === 'startDiscussion' || permission.indexOf('discussion.') === 0) {
-    required.push('viewDiscussions');
-  }
-  if (permission === 'discussion.delete') {
-    required.push('discussion.hide');
-  }
-  if (permission === 'discussion.deletePosts') {
-    required.push('discussion.editPosts');
-  }
-
-  return required;
-};
-
-export default app;

js/admin/src/components/DashboardPage.js

@@ -1,22 +0,0 @@
-import Page from 'flarum/components/Page';
-
-export default class DashboardPage extends Page {
-  view() {
-    return (
-      <div className="DashboardPage">
-        <div className="container">
-          <h2>{app.translator.trans('core.admin.dashboard.welcome_text')}</h2>
-          <p>{app.translator.trans('core.admin.dashboard.version_text', {version: <strong>{app.forum.attribute('version')}</strong>})}</p>
-          <p>{app.translator.trans('core.admin.dashboard.beta_warning_text', {strong: <strong/>})}</p>
-          <ul>
-            <li>{app.translator.trans('core.admin.dashboard.contributing_text', {a: <a href="http://flarum.org/docs/contributing" target="_blank"/>})}</li>
-            <li>{app.translator.trans('core.admin.dashboard.troubleshooting_text', {a: <a href="http://flarum.org/docs/troubleshooting" target="_blank"/>})}</li>
-            <li>{app.translator.trans('core.admin.dashboard.support_text', {a: <a href="http://discuss.flarum.org/t/support" target="_blank"/>})}</li>
-            <li>{app.translator.trans('core.admin.dashboard.features_text', {a: <a href="http://discuss.flarum.org/t/features" target="_blank"/>})}</li>
-            <li>{app.translator.trans('core.admin.dashboard.extension_text', {a: <a href="http://flarum.org/docs/extend" target="_blank"/>})}</li>
-          </ul>
-        </div>
-      </div>
-    );
-  }
-}

js/admin/src/components/EditGroupModal.js

@@ -1,102 +0,0 @@
-import Modal from 'flarum/components/Modal';
-import Button from 'flarum/components/Button';
-import Badge from 'flarum/components/Badge';
-import Group from 'flarum/models/Group';
-
-/**
- * The `EditGroupModal` component shows a modal dialog which allows the user
- * to create or edit a group.
- */
-export default class EditGroupModal extends Modal {
-  init() {
-    this.group = this.props.group || app.store.createRecord('groups');
-
-    this.nameSingular = m.prop(this.group.nameSingular() || '');
-    this.namePlural = m.prop(this.group.namePlural() || '');
-    this.icon = m.prop(this.group.icon() || '');
-    this.color = m.prop(this.group.color() || '');
-  }
-
-  className() {
-    return 'EditGroupModal Modal--small';
-  }
-
-  title() {
-    return [
-      this.color() || this.icon() ? Badge.component({
-        icon: this.icon(),
-        style: {backgroundColor: this.color()}
-      }) : '',
-      ' ',
-      this.namePlural() || app.translator.trans('core.admin.edit_group.title')
-    ];
-  }
-
-  content() {
-    return (
-      <div className="Modal-body">
-        <div className="Form">
-          <div className="Form-group">
-            <label>{app.translator.trans('core.admin.edit_group.name_label')}</label>
-            <div className="EditGroupModal-name-input">
-              <input className="FormControl" placeholder={app.translator.trans('core.admin.edit_group.singular_placeholder')} value={this.nameSingular()} oninput={m.withAttr('value', this.nameSingular)}/>
-              <input className="FormControl" placeholder={app.translator.trans('core.admin.edit_group.plural_placeholder')} value={this.namePlural()} oninput={m.withAttr('value', this.namePlural)}/>
-            </div>
-          </div>
-
-          <div className="Form-group">
-            <label>{app.translator.trans('core.admin.edit_group.color_label')}</label>
-            <input className="FormControl" placeholder="#aaaaaa" value={this.color()} oninput={m.withAttr('value', this.color)}/>
-          </div>
-
-          <div className="Form-group">
-            <label>{app.translator.trans('core.admin.edit_group.icon_label')}</label>
-            <div className="helpText">
-              {app.translator.trans('core.admin.edit_group.icon_text', {a: <a href="http://fortawesome.github.io/Font-Awesome/icons/" tabindex="-1"/>})}
-            </div>
-            <input className="FormControl" placeholder="bolt" value={this.icon()} oninput={m.withAttr('value', this.icon)}/>
-          </div>
-
-          <div className="Form-group">
-            {Button.component({
-              type: 'submit',
-              className: 'Button Button--primary EditGroupModal-save',
-              loading: this.loading,
-              children: app.translator.trans('core.admin.edit_group.submit_button')
-            })}
-            {this.group.exists && this.group.id() !== Group.ADMINISTRATOR_ID ? (
-              <button type="button" className="Button EditGroupModal-delete" onclick={this.deleteGroup.bind(this)}>
-                {app.translator.trans('core.admin.edit_group.delete_button')}
-              </button>
-            ) : ''}
-          </div>
-        </div>
-      </div>
-    );
-  }
-
-  onsubmit(e) {
-    e.preventDefault();
-
-    this.loading = true;
-
-    this.group.save({
-      nameSingular: this.nameSingular(),
-      namePlural: this.namePlural(),
-      color: this.color(),
-      icon: this.icon()
-    }, {errorHandler: this.onerror.bind(this)})
-      .then(this.hide.bind(this))
-      .catch(() => {
-        this.loading = false;
-        m.redraw();
-      });
-  }
-
-  deleteGroup() {
-    if (confirm(app.translator.trans('core.admin.edit_group.delete_confirmation'))) {
-      this.group.delete().then(() => m.redraw());
-      this.hide();
-    }
-  }
-}

js/admin/src/initializers/boot.js

@@ -1,66 +0,0 @@
-/*global FastClick*/
-
-import ScrollListener from 'flarum/utils/ScrollListener';
-import Drawer from 'flarum/utils/Drawer';
-import mapRoutes from 'flarum/utils/mapRoutes';
-
-import Navigation from 'flarum/components/Navigation';
-import HeaderPrimary from 'flarum/components/HeaderPrimary';
-import HeaderSecondary from 'flarum/components/HeaderSecondary';
-import AdminNav from 'flarum/components/AdminNav';
-import ModalManager from 'flarum/components/ModalManager';
-import AlertManager from 'flarum/components/AlertManager';
-
-/**
- * The `boot` initializer boots up the admin app. It initializes some app
- * globals, mounts components to the page, and begins routing.
- *
- * @param {ForumApp} app
- */
-export default function boot(app) {
-  m.startComputation();
-
-  m.mount(document.getElementById('app-navigation'), Navigation.component({className: 'App-backControl', drawer: true}));
-  m.mount(document.getElementById('header-navigation'), Navigation.component());
-  m.mount(document.getElementById('header-primary'), HeaderPrimary.component());
-  m.mount(document.getElementById('header-secondary'), HeaderSecondary.component());
-  m.mount(document.getElementById('admin-navigation'), AdminNav.component());
-
-  app.drawer = new Drawer();
-  app.modal = m.mount(document.getElementById('modal'), ModalManager.component());
-  app.alerts = m.mount(document.getElementById('alerts'), AlertManager.component());
-  app.history = {
-    canGoBack: () => true,
-    getPrevious: () => {},
-    backUrl: () => app.forum.attribute('baseUrl'),
-    back: function() {
-      window.location = this.backUrl();
-    }
-  };
-
-  m.route.mode = 'hash';
-  m.route(document.getElementById('content'), '/', mapRoutes(app.routes));
-
-  m.endComputation();
-
-  // Add a class to the body which indicates that the page has been scrolled
-  // down.
-  new ScrollListener(top => {
-    const $app = $('#app');
-    const offset = $app.offset().top;
-
-    $app
-      .toggleClass('affix', top >= offset)
-      .toggleClass('scrolled', top > offset);
-  }).start();
-
-  app.booted = true;
-
-  // If an extension has just been enabled, then we will run its settings
-  // callback.
-  const enabled = localStorage.getItem('enabledExtension');
-  if (enabled && app.extensionSettings[enabled]) {
-    app.extensionSettings[enabled]();
-    localStorage.removeItem('enabledExtension');
-  }
-}

js/bower.json

@@ -1,17 +0,0 @@
-{
-  "name": "flarum",
-  "dependencies": {
-    "jquery": "~2.1.3",
-    "jquery.hotkeys": "jeresig/jquery.hotkeys#0.2.0",
-    "bootstrap": "~3.3.2",
-    "spin.js": "~2.0.1",
-    "moment": "~2.8.4",
-    "color-thief": "v2.0",
-    "mithril": "lhorie/mithril.js#v0.2.5",
-    "es6-micro-loader": "caridy/es6-micro-loader#v0.2.1",
-    "fastclick": "~1.0.6",
-    "autolink": "~1.0.0",
-    "m.attrs.bidi": "tobscure/m.attrs.bidi",
-    "punycode": "http://cdnjs.cloudflare.com/ajax/libs/punycode/1.4.1/punycode.js"
-  }
-}

js/forum.js

@@ -0,0 +1,11 @@
+/*
+ * This file is part of Flarum.
+ *
+ * (c) Toby Zerner <toby.zerner@gmail.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+export * from './src/common';
+export * from './src/forum';

js/forum/.gitignore

@@ -1 +0,0 @@
-node_modules

js/forum/Gulpfile.js

@@ -1,36 +0,0 @@
-var gulp = require('flarum-gulp');
-
-var bowerDir = '../bower_components';
-
-gulp({
-  includeHelpers: true,
-  files: [
-    bowerDir + '/es6-micro-loader/dist/system-polyfill.js',
-
-    bowerDir + '/mithril/mithril.js',
-    bowerDir + '/m.attrs.bidi/bidi.js',
-    bowerDir + '/jquery/dist/jquery.js',
-    bowerDir + '/jquery.hotkeys/jquery.hotkeys.js',
-    bowerDir + '/color-thief/src/color-thief.js',
-    bowerDir + '/moment/moment.js',
-    bowerDir + '/autolink/autolink-min.js',
-
-    bowerDir + '/bootstrap/js/affix.js',
-    bowerDir + '/bootstrap/js/dropdown.js',
-    bowerDir + '/bootstrap/js/modal.js',
-    bowerDir + '/bootstrap/js/tooltip.js',
-    bowerDir + '/bootstrap/js/transition.js',
-
-    bowerDir + '/spin.js/spin.js',
-    bowerDir + '/spin.js/jquery.spin.js',
-    bowerDir + '/fastclick/lib/fastclick.js',
-    bowerDir + '/punycode/index.js'
-  ],
-  modules: {
-    'flarum': [
-      'src/**/*.js',
-      '../lib/**/*.js'
-    ]
-  },
-  outputFile: 'dist/app.js'
-});

js/forum/package.json

@@ -1,7 +0,0 @@
-{
-  "private": true,
-  "devDependencies": {
-    "gulp": "^3.9.1",
-    "flarum-gulp": "^0.2.0"
-  }
-}

js/forum/src/ForumApp.js

@@ -1,103 +0,0 @@
-import History from 'flarum/utils/History';
-import App from 'flarum/App';
-import Search from 'flarum/components/Search';
-import Composer from 'flarum/components/Composer';
-import ReplyComposer from 'flarum/components/ReplyComposer';
-import DiscussionPage from 'flarum/components/DiscussionPage';
-import SignUpModal from 'flarum/components/SignUpModal';
-
-export default class ForumApp extends App {
-  constructor(...args) {
-    super(...args);
-
-    /**
-     * The app's history stack, which keeps track of which routes the user visits
-     * so that they can easily navigate back to the previous route.
-     *
-     * @type {History}
-     */
-    this.history = new History();
-
-    /**
-     * An object which controls the state of the page's side pane.
-     *
-     * @type {Pane}
-     */
-    this.pane = null;
-
-    /**
-     * The page's search component instance.
-     *
-     * @type {SearchBox}
-     */
-    this.search = new Search();
-
-    /**
-     * An object which controls the state of the page's drawer.
-     *
-     * @type {Drawer}
-     */
-    this.drawer = null;
-
-    /**
-     * A map of post types to their components.
-     *
-     * @type {Object}
-     */
-    this.postComponents = {};
-
-    /**
-     * A map of notification types to their components.
-     *
-     * @type {Object}
-     */
-    this.notificationComponents = {};
-  }
-
-  /**
-   * Check whether or not the user is currently composing a reply to a
-   * discussion.
-   *
-   * @param {Discussion} discussion
-   * @return {Boolean}
-   */
-  composingReplyTo(discussion) {
-    return this.composer.component instanceof ReplyComposer &&
-      this.composer.component.props.discussion === discussion &&
-      this.composer.position !== Composer.PositionEnum.HIDDEN;
-  }
-
-  /**
-   * Check whether or not the user is currently viewing a discussion.
-   *
-   * @param {Discussion} discussion
-   * @return {Boolean}
-   */
-  viewingDiscussion(discussion) {
-    return this.current instanceof DiscussionPage &&
-      this.current.discussion === discussion;
-  }
-
-  /**
-   * Callback for when an external authenticator (social login) action has
-   * completed.
-   *
-   * If the payload indicates that the user has been logged in, then the page
-   * will be reloaded. Otherwise, a SignUpModal will be opened, prefilled
-   * with the provided details.
-   *
-   * @param {Object} payload A dictionary of props to pass into the sign up
-   *     modal. A truthy `authenticated` prop indicates that the user has logged
-   *     in, and thus the page is reloaded.
-   * @public
-   */
-  authenticationComplete(payload) {
-    if (payload.authenticated) {
-      window.location.reload();
-    } else {
-      const modal = new SignUpModal(payload);
-      this.modal.show(modal);
-      modal.$('[name=password]').focus();
-    }
-  }
-}

js/forum/src/app.js

@@ -1,21 +0,0 @@
-import ForumApp from 'flarum/ForumApp';
-import store from 'flarum/initializers/store';
-import preload from 'flarum/initializers/preload';
-import routes from 'flarum/initializers/routes';
-import components from 'flarum/initializers/components';
-import humanTime from 'flarum/initializers/humanTime';
-import boot from 'flarum/initializers/boot';
-import alertEmailConfirmation from 'flarum/initializers/alertEmailConfirmation';
-
-const app = new ForumApp();
-
-app.initializers.add('store', store);
-app.initializers.add('routes', routes);
-app.initializers.add('components', components);
-app.initializers.add('humanTime', humanTime);
-
-app.initializers.add('preload', preload, -100);
-app.initializers.add('boot', boot, -100);
-app.initializers.add('alertEmailConfirmation', alertEmailConfirmation, -100);
-
-export default app;

js/forum/src/components/EditUserModal.js

@@ -1,165 +0,0 @@
-import Modal from 'flarum/components/Modal';
-import Button from 'flarum/components/Button';
-import GroupBadge from 'flarum/components/GroupBadge';
-import Group from 'flarum/models/Group';
-import extractText from 'flarum/utils/extractText';
-
-/**
- * The `EditUserModal` component displays a modal dialog with a login form.
- */
-export default class EditUserModal extends Modal {
-  init() {
-    super.init();
-
-    const user = this.props.user;
-
-    this.username = m.prop(user.username() || '');
-    this.email = m.prop(user.email() || '');
-    this.isActivated = m.prop(user.isActivated() || false);
-    this.setPassword = m.prop(false);
-    this.password = m.prop(user.password() || '');
-    this.groups = {};
-
-    app.store.all('groups')
-      .filter(group => [Group.GUEST_ID, Group.MEMBER_ID].indexOf(group.id()) === -1)
-      .forEach(group => this.groups[group.id()] = m.prop(user.groups().indexOf(group) !== -1));
-  }
-
-  className() {
-    return 'EditUserModal Modal--small';
-  }
-
-  title() {
-    return app.translator.trans('core.forum.edit_user.title');
-  }
-
-  content() {
-    return (
-      <div className="Modal-body">
-        <div className="Form">
-          <div className="Form-group">
-            <label>{app.translator.trans('core.forum.edit_user.username_heading')}</label>
-            <input className="FormControl" placeholder={extractText(app.translator.trans('core.forum.edit_user.username_label'))}
-              bidi={this.username} />
-          </div>
-
-          {app.session.user !== this.props.user ? [
-            <div className="Form-group">
-              <label>{app.translator.trans('core.forum.edit_user.email_heading')}</label>
-              <div>
-                <input className="FormControl" placeholder={extractText(app.translator.trans('core.forum.edit_user.email_label'))}
-                  bidi={this.email} />
-              </div>
-              {!this.isActivated() ? (
-                <div>
-                  {Button.component({
-                    className: 'Button Button--block',
-                    children: app.translator.trans('core.forum.edit_user.activate_button'),
-                    loading: this.loading,
-                    onclick: this.activate.bind(this)
-                  })}
-                </div>
-              ) : ''}
-            </div>,
-
-            <div className="Form-group">
-              <label>{app.translator.trans('core.forum.edit_user.password_heading')}</label>
-              <div>
-                <label className="checkbox">
-                  <input type="checkbox" checked={this.setPassword()} onchange={e => {
-                    this.setPassword(e.target.checked);
-                    m.redraw(true);
-                    if (e.target.checked) this.$('[name=password]').select();
-                    m.redraw.strategy('none');
-                  }}/>
-                  {app.translator.trans('core.forum.edit_user.set_password_label')}
-                </label>
-                {this.setPassword() ? (
-                  <input className="FormControl" type="password" name="password" placeholder={extractText(app.translator.trans('core.forum.edit_user.password_label'))}
-                    bidi={this.password} />
-                ) : ''}
-              </div>
-            </div>
-          ] : ''}
-
-          <div className="Form-group EditUserModal-groups">
-            <label>{app.translator.trans('core.forum.edit_user.groups_heading')}</label>
-            <div>
-              {Object.keys(this.groups)
-                .map(id => app.store.getById('groups', id))
-                .map(group => (
-                  <label className="checkbox">
-                    <input type="checkbox"
-                      bidi={this.groups[group.id()]}
-                      disabled={this.props.user.id() === '1' && group.id() === Group.ADMINISTRATOR_ID} />
-                    {GroupBadge.component({group, label: ''})} {group.nameSingular()}
-                  </label>
-                ))}
-            </div>
-          </div>
-
-          <div className="Form-group">
-            {Button.component({
-              className: 'Button Button--primary',
-              type: 'submit',
-              loading: this.loading,
-              children: app.translator.trans('core.forum.edit_user.submit_button')
-            })}
-          </div>
-        </div>
-      </div>
-    );
-  }
-
-  activate() {
-    this.loading = true;
-    const data = {
-      username: this.username(),
-      isActivated: true,
-    };
-    this.props.user.save(data, {errorHandler: this.onerror.bind(this)})
-      .then(() => {
-        this.isActivated(true);
-        this.loading = false;
-        m.redraw();
-      })
-      .catch(() => {
-        this.loading = false;
-        m.redraw();
-      });
-  }
-
-  data() {
-    const groups = Object.keys(this.groups)
-      .filter(id => this.groups[id]())
-      .map(id => app.store.getById('groups', id));
-
-    const data = {
-      username: this.username(),
-      relationships: {groups}
-    };
-
-    if (app.session.user !== this.props.user) {
-      data.email = this.email();
-    }
-
-    if (this.setPassword()) {
-      data.password = this.password();
-    }
-
-    return data;
-  }
-
-  onsubmit(e) {
-    e.preventDefault();
-
-    this.loading = true;
-
-    this.props.user.save(this.data(), {errorHandler: this.onerror.bind(this)})
-      .then(this.hide.bind(this))
-      .catch(() => {
-        this.loading = false;
-        m.redraw();
-      });
-  }
-}

js/forum/src/components/NotificationList.js

@@ -1,145 +0,0 @@
-import Component from 'flarum/Component';
-import listItems from 'flarum/helpers/listItems';
-import Button from 'flarum/components/Button';
-import LoadingIndicator from 'flarum/components/LoadingIndicator';
-import Discussion from 'flarum/models/Discussion';
-
-/**
- * The `NotificationList` component displays a list of the logged-in user's
- * notifications, grouped by discussion.
- */
-export default class NotificationList extends Component {
-  init() {
-    /**
-     * Whether or not the notifications are loading.
-     *
-     * @type {Boolean}
-     */
-    this.loading = false;
-  }
-
-  view() {
-    const groups = [];
-
-    if (app.cache.notifications) {
-      const discussions = {};
-
-      // Build an array of discussions which the notifications are related to,
-      // and add the notifications as children.
-      app.cache.notifications.forEach(notification => {
-        const subject = notification.subject();
-
-        if (typeof subject === 'undefined') return;
-
-        // Get the discussion that this notification is related to. If it's not
-        // directly related to a discussion, it may be related to a post or
-        // other entity which is related to a discussion.
-        let discussion = false;
-        if (subject instanceof Discussion) discussion = subject;
-        else if (subject && subject.discussion) discussion = subject.discussion();
-
-        // If the notification is not related to a discussion directly or
-        // indirectly, then we will assign it to a neutral group.
-        const key = discussion ? discussion.id() : 0;
-        discussions[key] = discussions[key] || {discussion: discussion, notifications: []};
-        discussions[key].notifications.push(notification);
-
-        if (groups.indexOf(discussions[key]) === -1) {
-          groups.push(discussions[key]);
-        }
-      });
-    }
-
-    return (
-      <div className="NotificationList">
-        <div className="NotificationList-header">
-          <div className="App-primaryControl">
-            {Button.component({
-              className: 'Button Button--icon Button--link',
-              icon: 'check',
-              title: app.translator.trans('core.forum.notifications.mark_all_as_read_tooltip'),
-              onclick: this.markAllAsRead.bind(this)
-            })}
-          </div>
-
-          <h4 className="App-titleControl App-titleControl--text">{app.translator.trans('core.forum.notifications.title')}</h4>
-        </div>
-
-        <div className="NotificationList-content">
-          {groups.length
-            ? groups.map(group => {
-              const badges = group.discussion && group.discussion.badges().toArray();
-
-              return (
-                <div className="NotificationGroup">
-                  {group.discussion
-                    ? (
-                      <a className="NotificationGroup-header"
-                        href={app.route.discussion(group.discussion)}
-                        config={m.route}>
-                        {badges && badges.length ? <ul className="NotificationGroup-badges badges">{listItems(badges)}</ul> : ''}
-                        {group.discussion.title()}
-                      </a>
-                    ) : (
-                      <div className="NotificationGroup-header">
-                        {app.forum.attribute('title')}
-                      </div>
-                    )}
-
-                  <ul className="NotificationGroup-content">
-                    {group.notifications.map(notification => {
-                      const NotificationComponent = app.notificationComponents[notification.contentType()];
-                      return NotificationComponent ? <li>{NotificationComponent.component({notification})}</li> : '';
-                    })}
-                  </ul>
-                </div>
-              );
-            })
-            : !this.loading
-              ? <div className="NotificationList-empty">{app.translator.trans('core.forum.notifications.empty_text')}</div>
-              : LoadingIndicator.component({className: 'LoadingIndicator--block'})}
-        </div>
-      </div>
-    );
-  }
-
-  /**
-   * Load notifications into the application's cache if they haven't already
-   * been loaded.
-   */
-  load() {
-    if (app.cache.notifications && !app.session.user.newNotificationsCount()) {
-      return;
-    }
-
-    this.loading = true;
-    m.redraw();
-
-    app.store.find('notifications')
-      .then(notifications => {
-        app.session.user.pushAttributes({newNotificationsCount: 0});
-        app.cache.notifications = notifications.sort((a, b) => b.time() - a.time());
-      })
-      .catch(() => {})
-      .then(() => {
-        this.loading = false;
-        m.redraw();
-      });
-  }
-
-  /**
-   * Mark all of the notifications as read.
-   */
-  markAllAsRead() {
-    if (!app.cache.notifications) return;
-
-    app.session.user.pushAttributes({unreadNotificationsCount: 0});
-
-    app.cache.notifications.forEach(notification => notification.pushAttributes({isRead: true}));
-
-    app.request({
-      url: app.forum.attribute('apiUrl') + '/notifications/read',
-      method: 'POST'
-    });
-  }
-}

js/forum/src/components/UserBio.js

@@ -1,104 +0,0 @@
-import Component from 'flarum/Component';
-import LoadingIndicator from 'flarum/components/LoadingIndicator';
-import classList from 'flarum/utils/classList';
-import extractText from 'flarum/utils/extractText';
-
-/**
- * The `UserBio` component displays a user's bio, optionally letting the user
- * edit it.
- */
-export default class UserBio extends Component {
-  init() {
-    /**
-     * Whether or not the bio is currently being edited.
-     *
-     * @type {Boolean}
-     */
-    this.editing = false;
-
-    /**
-     * Whether or not the bio is currently being saved.
-     *
-     * @type {Boolean}
-     */
-    this.loading = false;
-  }
-
-  view() {
-    const user = this.props.user;
-    let content;
-
-    if (this.editing) {
-      content = <textarea className="FormControl" placeholder={extractText(app.translator.trans('core.forum.user.bio_placeholder'))} rows="3" value={user.bio()}/>;
-    } else {
-      let subContent;
-
-      if (this.loading) {
-        subContent = <p className="UserBio-placeholder">{LoadingIndicator.component({size: 'tiny'})}</p>;
-      } else {
-        const bioHtml = user.bioHtml();
-
-        if (bioHtml) {
-          subContent = m.trust(bioHtml);
-        } else if (this.props.editable) {
-          subContent = <p className="UserBio-placeholder">{app.translator.trans('core.forum.user.bio_placeholder')}</p>;
-        }
-      }
-
-      content = <div className="UserBio-content" onclick={this.edit.bind(this)}>{subContent}</div>;
-    }
-
-    return (
-      <div className={'UserBio ' + classList({
-          editable: this.props.editable,
-          editing: this.editing
-        })}>
-        {content}
-      </div>
-    );
-  }
-
-  /**
-   * Edit the bio.
-   */
-  edit() {
-    if (!this.props.editable) return;
-
-    this.editing = true;
-    m.redraw();
-
-    const bio = this;
-    const save = function(e) {
-      if (e.shiftKey) return;
-      e.preventDefault();
-      bio.save($(this).val());
-    };
-
-    this.$('textarea').focus()
-      .bind('blur', save)
-      .bind('keydown', 'return', save);
-  }
-
-  /**
-   * Save the bio.
-   *
-   * @param {String} value
-   */
-  save(value) {
-    const user = this.props.user;
-
-    if (user.bio() !== value) {
-      this.loading = true;
-
-      user.save({bio: value})
-        .catch(() => {})
-        .then(() => {
-          this.loading = false;
-          m.redraw();
-        });
-    }
-
-    this.editing = false;
-    m.redraw();
-  }
-}

js/forum/src/initializers/boot.js

@@ -1,90 +0,0 @@
-/*global FastClick*/
-
-import ScrollListener from 'flarum/utils/ScrollListener';
-import Pane from 'flarum/utils/Pane';
-import Drawer from 'flarum/utils/Drawer';
-import mapRoutes from 'flarum/utils/mapRoutes';
-import Navigation from 'flarum/components/Navigation';
-import HeaderPrimary from 'flarum/components/HeaderPrimary';
-import HeaderSecondary from 'flarum/components/HeaderSecondary';
-import Composer from 'flarum/components/Composer';
-import ModalManager from 'flarum/components/ModalManager';
-import AlertManager from 'flarum/components/AlertManager';
-
-/**
- * The `boot` initializer boots up the forum app. It initializes some app
- * globals, mounts components to the page, and begins routing.
- *
- * @param {ForumApp} app
- */
-export default function boot(app) {
-  // Get the configured default route and update that route's path to be '/'.
-  // Push the homepage as the first route, so that the user will always be
-  // able to click on the 'back' button to go home, regardless of which page
-  // they started on.
-  const defaultRoute = app.forum.attribute('defaultRoute');
-  let defaultAction = 'index';
-
-  for (const i in app.routes) {
-    if (app.routes[i].path === defaultRoute) defaultAction = i;
-  }
-
-  app.routes[defaultAction].path = '/';
-  app.history.push(defaultAction, app.translator.trans('core.forum.header.back_to_index_tooltip'), '/');
-
-  m.startComputation();
-
-  m.mount(document.getElementById('app-navigation'), Navigation.component({className: 'App-backControl', drawer: true}));
-  m.mount(document.getElementById('header-navigation'), Navigation.component());
-  m.mount(document.getElementById('header-primary'), HeaderPrimary.component());
-  m.mount(document.getElementById('header-secondary'), HeaderSecondary.component());
-
-  app.pane = new Pane(document.getElementById('app'));
-  app.drawer = new Drawer();
-  app.composer = m.mount(document.getElementById('composer'), Composer.component());
-  app.modal = m.mount(document.getElementById('modal'), ModalManager.component());
-  app.alerts = m.mount(document.getElementById('alerts'), AlertManager.component());
-
-  const basePath = app.forum.attribute('basePath');
-  m.route.mode = 'pathname';
-  m.route(
-    document.getElementById('content'),
-    basePath + '/',
-    mapRoutes(app.routes, basePath)
-  );
-
-  m.endComputation();
-
-  // Route the home link back home when clicked. We do not want it to register
-  // if the user is opening it in a new tab, however.
-  $('#home-link').click(e => {
-    if (e.ctrlKey || e.metaKey || e.which === 2) return;
-    e.preventDefault();
-    app.history.home();
-    if (app.session.user) {
-      app.store.find('users', app.session.user.id());
-      m.redraw();
-    }
-  });
-
-  // Add a class to the body which indicates that the page has been scrolled
-  // down.
-  new ScrollListener(top => {
-    const $app = $('#app');
-    const offset = $app.offset().top;
-
-    $app
-      .toggleClass('affix', top >= offset)
-      .toggleClass('scrolled', top > offset);
-  }).start();
-
-  // Initialize FastClick, which makes links and buttons much more responsive on
-  // touch devices.
-  $(() => {
-    FastClick.attach(document.body);
-
-    $('body').addClass('ontouchstart' in window ? 'touch' : 'no-touch');
-  });
-
-  app.booted = true;
-}

js/forum/src/initializers/components.js

@@ -1,16 +0,0 @@
-import CommentPost from 'flarum/components/CommentPost';
-import DiscussionRenamedPost from 'flarum/components/DiscussionRenamedPost';
-import DiscussionRenamedNotification from 'flarum/components/DiscussionRenamedNotification';
-
-/**
- * The `components` initializer registers components to display the default post
- * types, activity types, and notifications type with the application.
- *
- * @param {ForumApp} app
- */
-export default function components(app) {
-  app.postComponents.comment = CommentPost;
-  app.postComponents.discussionRenamed = DiscussionRenamedPost;
-
-  app.notificationComponents.discussionRenamed = DiscussionRenamedNotification;
-}

js/lib/components/LoadingIndicator.js

@@ -1,27 +0,0 @@
-import Component from 'flarum/Component';
-
-/**
- * The `LoadingIndicator` component displays a loading spinner with spin.js. It
- * may have the following special props:
- *
- * - `size` The spin.js size preset to use. Defaults to 'small'.
- *
- * All other props will be assigned as attributes on the element.
- */
-export default class LoadingIndicator extends Component {
-  view() {
-    const attrs = Object.assign({}, this.props);
-
-    attrs.className = 'LoadingIndicator ' + (attrs.className || '');
-    delete attrs.size;
-
-    return <div {...attrs}>{m.trust('&nbsp;')}</div>;
-  }
-
-  config() {
-    const size = this.props.size || 'small';
-
-    $.fn.spin.presets[size].zIndex = 'auto';
-    this.$().spin(size);
-  }
-}

js/lib/components/RequestErrorModal.js

@@ -1,30 +0,0 @@
-import Modal from 'flarum/components/Modal';
-
-export default class RequestErrorModal extends Modal {
-  className() {
-    return 'RequestErrorModal Modal--large';
-  }
-
-  title() {
-    return this.props.error.xhr
-      ? this.props.error.xhr.status+' '+this.props.error.xhr.statusText
-      : '';
-  }
-
-  content() {
-    let responseText;
-
-    try {
-      responseText = JSON.stringify(JSON.parse(this.props.error.responseText), null, 2);
-    } catch (e) {
-      responseText = this.props.error.responseText;
-    }
-
-    return <div className="Modal-body">
-      <pre>
-        {this.props.error.options.method} {this.props.error.options.url}<br/><br/>
-        {responseText}
-      </pre>
-    </div>;
-  }
-}

js/lib/helpers/icon.js

@@ -1,12 +0,0 @@
-/**
- * The `icon` helper displays a FontAwesome icon. The fa-fw class is applied.
- *
- * @param {String} name The name of the icon class, without the `fa-` prefix.
- * @param {Object} attrs Any other attributes to apply.
- * @return {Object}
- */
-export default function icon(name, attrs = {}) {
-  attrs.className = 'icon fa fa-' + name + ' ' + (attrs.className || '');
-
-  return <i {...attrs}/>;
-}

js/lib/initializers/preload.js

@@ -1,24 +0,0 @@
-import Session from 'flarum/Session';
-
-/**
- * The `preload` initializer creates the application session and preloads it
- * with data that has been set on the application's `preload` property. It also
- * preloads any data on the application's `preload` property into the store.
- * Finally, it sets the application's `forum` instance to the one that was
- * preloaded.
- *
- * `app.preload.session` should be the same as the response from the /api/token
- * endpoint: it should contain `token` and `userId` keys.
- *
- * @param {App} app
- */
-export default function preload(app) {
-  app.store.pushPayload({data: app.data.resources});
-
-  app.forum = app.store.getById('forums', 1);
-
-  app.session = new Session(
-    app.store.getById('users', app.data.session.userId),
-    app.data.session.csrfToken
-  );
-}

js/lib/initializers/store.js

@@ -1,26 +0,0 @@
-import Store from 'flarum/Store';
-import Forum from 'flarum/models/Forum';
-import User from 'flarum/models/User';
-import Discussion from 'flarum/models/Discussion';
-import Post from 'flarum/models/Post';
-import Group from 'flarum/models/Group';
-import Activity from 'flarum/models/Activity';
-import Notification from 'flarum/models/Notification';
-
-/**
- * The `store` initializer creates the application's data store and registers
- * the default resource types to their models.
- *
- * @param {App} app
- */
-export default function store(app) {
-  app.store = new Store({
-    forums: Forum,
-    users: User,
-    discussions: Discussion,
-    posts: Post,
-    groups: Group,
-    activity: Activity,
-    notifications: Notification
-  });
-}

js/lib/models/Notification.js

@@ -1,19 +0,0 @@
-import Model from 'flarum/Model';
-import computed from 'flarum/utils/computed';
-
-export default class Notification extends Model {}
-
-Object.assign(Notification.prototype, {
-  contentType: Model.attribute('contentType'),
-  subjectId: Model.attribute('subjectId'),
-  content: Model.attribute('content'),
-  time: Model.attribute('time', Model.date),
-
-  isRead: Model.attribute('isRead'),
-  unreadCount: Model.attribute('unreadCount'),
-  additionalUnreadCount: computed('unreadCount', unreadCount => Math.max(0, unreadCount - 1)),
-
-  user: Model.hasOne('user'),
-  sender: Model.hasOne('sender'),
-  subject: Model.hasOne('subject')
-});

js/lib/models/Post.js

@@ -1,28 +0,0 @@
-import Model from 'flarum/Model';
-import computed from 'flarum/utils/computed';
-import { getPlainContent } from 'flarum/utils/string';
-
-export default class Post extends Model {}
-
-Object.assign(Post.prototype, {
-  number: Model.attribute('number'),
-  discussion: Model.hasOne('discussion'),
-
-  time: Model.attribute('time', Model.transformDate),
-  user: Model.hasOne('user'),
-  contentType: Model.attribute('contentType'),
-  content: Model.attribute('content'),
-  contentHtml: Model.attribute('contentHtml'),
-  contentPlain: computed('contentHtml', getPlainContent),
-
-  editTime: Model.attribute('editTime', Model.transformDate),
-  editUser: Model.hasOne('editUser'),
-  isEdited: computed('editTime', editTime => !!editTime),
-
-  hideTime: Model.attribute('hideTime', Model.transformDate),
-  hideUser: Model.hasOne('hideUser'),
-  isHidden: computed('hideTime', hideTime => !!hideTime),
-
-  canEdit: Model.attribute('canEdit'),
-  canDelete: Model.attribute('canDelete')
-});

js/package.json

@@ -0,0 +1,26 @@
+{
+  "private": true,
+  "name": "@flarum/core",
+  "dependencies": {
+    "bootstrap": "^3.3.7",
+    "classnames": "^2.2.5",
+    "color-thief-browser": "^2.0.2",
+    "expose-loader": "^0.7.5",
+    "flarum-webpack-config": "0.1.0-beta.10",
+    "jquery": "^3.3.1",
+    "jquery.hotkeys": "^0.1.0",
+    "lodash-es": "^4.17.11",
+    "m.attrs.bidi": "github:tobscure/m.attrs.bidi",
+    "mithril": "^0.2.8",
+    "moment": "^2.22.2",
+    "punycode": "^2.1.1",
+    "spin.js": "^3.1.0",
+    "webpack": "^4.26.0",
+    "webpack-cli": "^3.1.2",
+    "webpack-merge": "^4.1.4"
+  },
+  "scripts": {
+    "dev": "webpack --mode development --watch",
+    "build": "webpack --mode production"
+  }
+}

js/src/admin/AdminApplication.js

@@ -0,0 +1,63 @@
+import HeaderPrimary from './components/HeaderPrimary';
+import HeaderSecondary from './components/HeaderSecondary';
+import routes from './routes';
+import Application from '../common/Application';
+import Navigation from '../common/components/Navigation';
+import AdminNav from './components/AdminNav';
+
+export default class AdminApplication extends Application {
+  extensionSettings = {};
+
+  history = {
+    canGoBack: () => true,
+    getPrevious: () => {},
+    backUrl: () => this.forum.attribute('baseUrl'),
+    back: function() {
+      window.location = this.backUrl();
+    }
+  };
+
+  constructor() {
+    super();
+
+    routes(this);
+  }
+
+  /**
+   * @inheritdoc
+   */
+  mount() {
+    m.mount(document.getElementById('app-navigation'), Navigation.component({className: 'App-backControl', drawer: true}));
+    m.mount(document.getElementById('header-navigation'), Navigation.component());
+    m.mount(document.getElementById('header-primary'), HeaderPrimary.component());
+    m.mount(document.getElementById('header-secondary'), HeaderSecondary.component());
+    m.mount(document.getElementById('admin-navigation'), AdminNav.component());
+
+    m.route.mode = 'hash';
+    super.mount();
+
+    // If an extension has just been enabled, then we will run its settings
+    // callback.
+    const enabled = localStorage.getItem('enabledExtension');
+    if (enabled && this.extensionSettings[enabled]) {
+      this.extensionSettings[enabled]();
+      localStorage.removeItem('enabledExtension');
+    }
+  }
+
+  getRequiredPermissions(permission) {
+    const required = [];
+
+    if (permission === 'startDiscussion' || permission.indexOf('discussion.') === 0) {
+      required.push('viewDiscussions');
+    }
+    if (permission === 'discussion.delete') {
+      required.push('discussion.hide');
+    }
+    if (permission === 'discussion.deletePosts') {
+      required.push('discussion.hidePosts');
+    }
+
+    return required;
+  };
+}

js/src/admin/compat.js

@@ -0,0 +1,63 @@
+import compat from '../common/compat';
+
+import saveSettings from './utils/saveSettings';
+import SettingDropdown from './components/SettingDropdown';
+import EditCustomFooterModal from './components/EditCustomFooterModal';
+import SessionDropdown from './components/SessionDropdown';
+import HeaderPrimary from './components/HeaderPrimary';
+import AppearancePage from './components/AppearancePage';
+import Page from './components/Page';
+import StatusWidget from './components/StatusWidget';
+import HeaderSecondary from './components/HeaderSecondary';
+import SettingsModal from './components/SettingsModal';
+import DashboardWidget from './components/DashboardWidget';
+import AddExtensionModal from './components/AddExtensionModal';
+import ExtensionsPage from './components/ExtensionsPage';
+import AdminLinkButton from './components/AdminLinkButton';
+import PermissionGrid from './components/PermissionGrid';
+import Widget from './components/Widget';
+import MailPage from './components/MailPage';
+import UploadImageButton from './components/UploadImageButton';
+import LoadingModal from './components/LoadingModal';
+import DashboardPage from './components/DashboardPage';
+import BasicsPage from './components/BasicsPage';
+import EditCustomHeaderModal from './components/EditCustomHeaderModal';
+import PermissionsPage from './components/PermissionsPage';
+import PermissionDropdown from './components/PermissionDropdown';
+import AdminNav from './components/AdminNav';
+import EditCustomCssModal from './components/EditCustomCssModal';
+import EditGroupModal from './components/EditGroupModal';
+import routes from './routes';
+import AdminApplication from './AdminApplication';
+
+export default Object.assign(compat, {
+  'utils/saveSettings': saveSettings,
+  'components/SettingDropdown': SettingDropdown,
+  'components/EditCustomFooterModal': EditCustomFooterModal,
+  'components/SessionDropdown': SessionDropdown,
+  'components/HeaderPrimary': HeaderPrimary,
+  'components/AppearancePage': AppearancePage,
+  'components/Page': Page,
+  'components/StatusWidget': StatusWidget,
+  'components/HeaderSecondary': HeaderSecondary,
+  'components/SettingsModal': SettingsModal,
+  'components/DashboardWidget': DashboardWidget,
+  'components/AddExtensionModal': AddExtensionModal,
+  'components/ExtensionsPage': ExtensionsPage,
+  'components/AdminLinkButton': AdminLinkButton,
+  'components/PermissionGrid': PermissionGrid,
+  'components/Widget': Widget,
+  'components/MailPage': MailPage,
+  'components/UploadImageButton': UploadImageButton,
+  'components/LoadingModal': LoadingModal,
+  'components/DashboardPage': DashboardPage,
+  'components/BasicsPage': BasicsPage,
+  'components/EditCustomHeaderModal': EditCustomHeaderModal,
+  'components/PermissionsPage': PermissionsPage,
+  'components/PermissionDropdown': PermissionDropdown,
+  'components/AdminNav': AdminNav,
+  'components/EditCustomCssModal': EditCustomCssModal,
+  'components/EditGroupModal': EditGroupModal,
+  'routes': routes,
+  'AdminApplication': AdminApplication
+});

js/src/admin/components/AddExtensionModal.js

@@ -7,7 +7,7 @@
  * file that was distributed with this source code.
  */
 
-import Modal from 'flarum/components/Modal';
+import Modal from '../../common/components/Modal';
 
 export default class AddExtensionModal extends Modal {
   className() {

js/src/admin/components/AdminLinkButton.js

@@ -7,7 +7,7 @@
  * file that was distributed with this source code.
  */
 
-import LinkButton from 'flarum/components/LinkButton';
+import LinkButton from '../../common/components/LinkButton';
 
 export default class AdminLinkButton extends LinkButton {
   getButtonContent() {

js/src/admin/components/AdminNav.js

@@ -7,20 +7,19 @@
  * file that was distributed with this source code.
  */
 
-import Component from 'flarum/Component';
+import Component from '../../common/Component';
-import AdminLinkButton from 'flarum/components/AdminLinkButton';
+import AdminLinkButton from './AdminLinkButton';
-import SelectDropdown from 'flarum/components/SelectDropdown';
+import SelectDropdown from '../../common/components/SelectDropdown';
-
+import ItemList from '../../common/utils/ItemList';
-import ItemList from 'flarum/utils/ItemList';
 
 export default class AdminNav extends Component {
   view() {
     return (
       <SelectDropdown
         className="AdminNav App-titleControl"
-        buttonClassName="Button"
+        buttonClassName="Button">
-        children={this.items().toArray()}
+        {this.items().toArray()}
-        />
+      </SelectDropdown>
     );
   }
 
@@ -34,42 +33,42 @@ export default class AdminNav extends Component {
 
     items.add('dashboard', AdminLinkButton.component({
       href: app.route('dashboard'),
-      icon: 'bar-chart',
+      icon: 'far fa-chart-bar',
       children: app.translator.trans('core.admin.nav.dashboard_button'),
       description: app.translator.trans('core.admin.nav.dashboard_text')
     }));
 
     items.add('basics', AdminLinkButton.component({
       href: app.route('basics'),
-      icon: 'pencil',
+      icon: 'fas fa-pencil-alt',
       children: app.translator.trans('core.admin.nav.basics_button'),
       description: app.translator.trans('core.admin.nav.basics_text')
     }));
 
     items.add('mail', AdminLinkButton.component({
       href: app.route('mail'),
-      icon: 'envelope',
+      icon: 'fas fa-envelope',
       children: app.translator.trans('core.admin.nav.email_button'),
       description: app.translator.trans('core.admin.nav.email_text')
     }));
 
     items.add('permissions', AdminLinkButton.component({
       href: app.route('permissions'),
-      icon: 'key',
+      icon: 'fas fa-key',
       children: app.translator.trans('core.admin.nav.permissions_button'),
       description: app.translator.trans('core.admin.nav.permissions_text')
     }));
 
     items.add('appearance', AdminLinkButton.component({
       href: app.route('appearance'),
-      icon: 'paint-brush',
+      icon: 'fas fa-paint-brush',
       children: app.translator.trans('core.admin.nav.appearance_button'),
       description: app.translator.trans('core.admin.nav.appearance_text')
     }));
 
     items.add('extensions', AdminLinkButton.component({
       href: app.route('extensions'),
-      icon: 'puzzle-piece',
+      icon: 'fas fa-puzzle-piece',
       children: app.translator.trans('core.admin.nav.extensions_button'),
       description: app.translator.trans('core.admin.nav.extensions_text')
     }));

js/src/admin/components/AppearancePage.js

@@ -1,10 +1,11 @@
-import Page from 'flarum/components/Page';
+import Page from './Page';
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
-import Switch from 'flarum/components/Switch';
+import Switch from '../../common/components/Switch';
-import EditCustomCssModal from 'flarum/components/EditCustomCssModal';
+import EditCustomCssModal from './EditCustomCssModal';
-import EditCustomHeaderModal from 'flarum/components/EditCustomHeaderModal';
+import EditCustomHeaderModal from './EditCustomHeaderModal';
-import UploadImageButton from 'flarum/components/UploadImageButton';
+import EditCustomFooterModal from './EditCustomFooterModal';
-import saveSettings from 'flarum/utils/saveSettings';
+import UploadImageButton from './UploadImageButton';
+import saveSettings from '../utils/saveSettings';
 
 export default class AppearancePage extends Page {
   init() {
@@ -28,8 +29,8 @@ export default class AppearancePage extends Page {
               </div>
 
               <div className="AppearancePage-colors-input">
-                <input className="FormControl" type="color" placeholder="#aaaaaa" value={this.primaryColor()} onchange={m.withAttr('value', this.primaryColor)}/>
+                <input className="FormControl" type="text" placeholder="#aaaaaa" value={this.primaryColor()} onchange={m.withAttr('value', this.primaryColor)}/>
-                <input className="FormControl" type="color" placeholder="#aaaaaa" value={this.secondaryColor()} onchange={m.withAttr('value', this.secondaryColor)}/>
+                <input className="FormControl" type="text" placeholder="#aaaaaa" value={this.secondaryColor()} onchange={m.withAttr('value', this.secondaryColor)}/>
               </div>
 
               {Switch.component({
@@ -81,6 +82,18 @@ export default class AppearancePage extends Page {
             })}
           </fieldset>
 
+          <fieldset>
+            <legend>{app.translator.trans('core.admin.appearance.custom_footer_heading')}</legend>
+            <div className="helpText">
+              {app.translator.trans('core.admin.appearance.custom_footer_text')}
+            </div>
+            {Button.component({
+              className: 'Button',
+              children: app.translator.trans('core.admin.appearance.edit_footer_button'),
+              onclick: () => app.modal.show(new EditCustomFooterModal())
+            })}
+          </fieldset>
+
           <fieldset>
             <legend>{app.translator.trans('core.admin.appearance.custom_styles_heading')}</legend>
             <div className="helpText">

js/src/admin/components/BasicsPage.js

@@ -1,11 +1,11 @@
-import Page from 'flarum/components/Page';
+import Page from './Page';
-import FieldSet from 'flarum/components/FieldSet';
+import FieldSet from '../../common/components/FieldSet';
-import Select from 'flarum/components/Select';
+import Select from '../../common/components/Select';
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
-import Alert from 'flarum/components/Alert';
+import Alert from '../../common/components/Alert';
-import saveSettings from 'flarum/utils/saveSettings';
+import saveSettings from '../utils/saveSettings';
-import ItemList from 'flarum/utils/ItemList';
+import ItemList from '../../common/utils/ItemList';
-import Switch from 'flarum/components/Switch';
+import Switch from '../../common/components/Switch';
 
 export default class BasicsPage extends Page {
   init() {
@@ -25,7 +25,7 @@ export default class BasicsPage extends Page {
     this.values = {};
 
     const settings = app.data.settings;
-    this.fields.forEach(key => this.values[key] = m.prop(settings[key] || false));
+    this.fields.forEach(key => this.values[key] = m.prop(settings[key]));
 
     this.localeOptions = {};
     const locales = app.data.locales;

js/src/admin/components/DashboardPage.js

@@ -0,0 +1,18 @@
+import Page from './Page';
+import StatusWidget from './StatusWidget';
+
+export default class DashboardPage extends Page {
+  view() {
+    return (
+      <div className="DashboardPage">
+        <div className="container">
+          {this.availableWidgets()}
+        </div>
+      </div>
+    );
+  }
+
+  availableWidgets() {
+    return [<StatusWidget/>];
+  }
+}

js/src/admin/components/DashboardWidget.js

@@ -0,0 +1,38 @@
+/*
+ * This file is part of Flarum.
+ *
+ * (c) Toby Zerner <toby.zerner@gmail.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+import Component from '../../common/Component';
+
+export default class Widget extends Component {
+  view() {
+    return (
+      <div className={"Widget "+this.className()}>
+        {this.content()}
+      </div>
+    );
+  }
+
+  /**
+   * Get the class name to apply to the widget.
+   *
+   * @return {String}
+   */
+  className() {
+    return '';
+  }
+
+  /**
+   * Get the content of the widget.
+   *
+   * @return {VirtualElement}
+   */
+  content() {
+    return [];
+  }
+}

js/src/admin/components/EditCustomCssModal.js

@@ -1,4 +1,4 @@
-import SettingsModal from 'flarum/components/SettingsModal';
+import SettingsModal from './SettingsModal';
 
 export default class EditCustomCssModal extends SettingsModal {
   className() {

js/src/admin/components/EditCustomFooterModal.js

@@ -0,0 +1,24 @@
+import SettingsModal from './SettingsModal';
+
+export default class EditCustomFooterModal extends SettingsModal {
+  className() {
+    return 'EditCustomFooterModal Modal--large';
+  }
+
+  title() {
+    return app.translator.trans('core.admin.edit_footer.title');
+  }
+
+  form() {
+    return [
+      <p>{app.translator.trans('core.admin.edit_footer.customize_text')}</p>,
+      <div className="Form-group">
+        <textarea className="FormControl" rows="30" bidi={this.setting('custom_footer')}/>
+      </div>
+    ];
+  }
+
+  onsaved() {
+    window.location.reload();
+  }
+}

js/src/admin/components/EditCustomHeaderModal.js

@@ -1,4 +1,4 @@
-import SettingsModal from 'flarum/components/SettingsModal';
+import SettingsModal from './SettingsModal';
 
 export default class EditCustomHeaderModal extends SettingsModal {
   className() {

js/src/admin/components/EditGroupModal.js

@@ -0,0 +1,111 @@
+import Modal from '../../common/components/Modal';
+import Button from '../../common/components/Button';
+import Badge from '../../common/components/Badge';
+import Group from '../../common/models/Group';
+import ItemList from '../../common/utils/ItemList';
+
+/**
+ * The `EditGroupModal` component shows a modal dialog which allows the user
+ * to create or edit a group.
+ */
+export default class EditGroupModal extends Modal {
+  init() {
+    this.group = this.props.group || app.store.createRecord('groups');
+
+    this.nameSingular = m.prop(this.group.nameSingular() || '');
+    this.namePlural = m.prop(this.group.namePlural() || '');
+    this.icon = m.prop(this.group.icon() || '');
+    this.color = m.prop(this.group.color() || '');
+  }
+
+  className() {
+    return 'EditGroupModal Modal--small';
+  }
+
+  title() {
+    return [
+      this.color() || this.icon() ? Badge.component({
+        icon: this.icon(),
+        style: {backgroundColor: this.color()}
+      }) : '',
+      ' ',
+      this.namePlural() || app.translator.trans('core.admin.edit_group.title')
+    ];
+  }
+
+  content() {
+    return (
+      <div className="Modal-body">
+        <div className="Form">
+          {this.fields().toArray()}
+        </div>
+      </div>
+    );
+  }
+
+  fields() {
+    const items = new ItemList();
+
+    items.add('name', <div className="Form-group">
+      <label>{app.translator.trans('core.admin.edit_group.name_label')}</label>
+      <div className="EditGroupModal-name-input">
+        <input className="FormControl" placeholder={app.translator.trans('core.admin.edit_group.singular_placeholder')} value={this.nameSingular()} oninput={m.withAttr('value', this.nameSingular)}/>
+        <input className="FormControl" placeholder={app.translator.trans('core.admin.edit_group.plural_placeholder')} value={this.namePlural()} oninput={m.withAttr('value', this.namePlural)}/>
+      </div>
+    </div>, 30);
+
+    items.add('color', <div className="Form-group">
+      <label>{app.translator.trans('core.admin.edit_group.color_label')}</label>
+      <input className="FormControl" placeholder="#aaaaaa" value={this.color()} oninput={m.withAttr('value', this.color)}/>
+    </div>, 20);
+
+    items.add('icon', <div className="Form-group">
+      <label>{app.translator.trans('core.admin.edit_group.icon_label')}</label>
+      <div className="helpText">
+        {app.translator.trans('core.admin.edit_group.icon_text', {a: <a href="https://fontawesome.com/icons?m=free" tabindex="-1"/>})}
+      </div>
+      <input className="FormControl" placeholder="fas fa-bolt" value={this.icon()} oninput={m.withAttr('value', this.icon)}/>
+    </div>, 10);
+
+    items.add('submit', <div className="Form-group">
+      {Button.component({
+        type: 'submit',
+        className: 'Button Button--primary EditGroupModal-save',
+        loading: this.loading,
+        children: app.translator.trans('core.admin.edit_group.submit_button')
+      })}
+      {this.group.exists && this.group.id() !== Group.ADMINISTRATOR_ID ? (
+        <button type="button" className="Button EditGroupModal-delete" onclick={this.deleteGroup.bind(this)}>
+          {app.translator.trans('core.admin.edit_group.delete_button')}
+        </button>
+      ) : ''}
+    </div>, -10);
+
+    return items;
+  }
+
+  onsubmit(e) {
+    e.preventDefault();
+
+    this.loading = true;
+
+    this.group.save({
+      nameSingular: this.nameSingular(),
+      namePlural: this.namePlural(),
+      color: this.color(),
+      icon: this.icon()
+    }, {errorHandler: this.onerror.bind(this)})
+      .then(this.hide.bind(this))
+      .catch(() => {
+        this.loading = false;
+        m.redraw();
+      });
+  }
+
+  deleteGroup() {
+    if (confirm(app.translator.trans('core.admin.edit_group.delete_confirmation'))) {
+      this.group.delete().then(() => m.redraw());
+      this.hide();
+    }
+  }
+}

js/src/admin/components/ExtensionsPage.js

@@ -1,13 +1,13 @@
-import Page from 'flarum/components/Page';
+import Page from './Page';
-import LinkButton from 'flarum/components/LinkButton';
+import LinkButton from '../../common/components/LinkButton';
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
-import Dropdown from 'flarum/components/Dropdown';
+import Dropdown from '../../common/components/Dropdown';
-import Separator from 'flarum/components/Separator';
+import Separator from '../../common/components/Separator';
-import AddExtensionModal from 'flarum/components/AddExtensionModal';
+import AddExtensionModal from './AddExtensionModal';
-import LoadingModal from 'flarum/components/LoadingModal';
+import LoadingModal from './LoadingModal';
-import ItemList from 'flarum/utils/ItemList';
+import ItemList from '../../common/utils/ItemList';
-import icon from 'flarum/helpers/icon';
+import icon from '../../common/helpers/icon';
-import listItems from 'flarum/helpers/listItems';
+import listItems from '../../common/helpers/listItems';
 
 export default class ExtensionsPage extends Page {
   view() {
@@ -17,7 +17,7 @@ export default class ExtensionsPage extends Page {
           <div className="container">
             {Button.component({
               children: app.translator.trans('core.admin.extensions.add_button'),
-              icon: 'plus',
+              icon: 'fas fa-plus',
               className: 'Button Button--primary',
               onclick: () => app.modal.show(new AddExtensionModal())
             })}
@@ -42,15 +42,18 @@ export default class ExtensionsPage extends Page {
                           className="ExtensionListItem-controls"
                           buttonClassName="Button Button--icon Button--flat"
                           menuClassName="Dropdown-menu--right"
-                          icon="ellipsis-h">
+                          icon="fas fa-ellipsis-h">
                           {controls}
                         </Dropdown>
                       ) : ''}
+                      <div className="ExtensionListItem-main">
                         <label className="ExtensionListItem-title">
                           <input type="checkbox" checked={this.isEnabled(extension.id)} onclick={this.toggle.bind(this, extension.id)}/> {' '}
                             {extension.extra['flarum-extension'].title}
                         </label>
                         <div className="ExtensionListItem-version">{extension.version}</div>
+                        <div className="ExtensionListItem-description">{extension.description}</div>
+                      </div>
                     </div>
                   </li>;
                 })}
@@ -67,7 +70,7 @@ export default class ExtensionsPage extends Page {
 
     if (app.extensionSettings[name]) {
       items.add('settings', Button.component({
-        icon: 'cog',
+        icon: 'fas fa-cog',
         children: app.translator.trans('core.admin.extensions.settings_button'),
         onclick: app.extensionSettings[name]
       }));
@@ -75,7 +78,7 @@ export default class ExtensionsPage extends Page {
 
     if (!enabled) {
       items.add('uninstall', Button.component({
-        icon: 'trash-o',
+        icon: 'far fa-trash-alt',
         children: app.translator.trans('core.admin.extensions.uninstall_button'),
         onclick: () => {
           app.request({

js/src/admin/components/HeaderPrimary.js

@@ -1,6 +1,6 @@
-import Component from 'flarum/Component';
+import Component from '../../common/Component';
-import ItemList from 'flarum/utils/ItemList';
+import ItemList from '../../common/utils/ItemList';
-import listItems from 'flarum/helpers/listItems';
+import listItems from '../../common/helpers/listItems';
 
 /**
  * The `HeaderPrimary` component displays primary header controls. On the

js/src/admin/components/HeaderSecondary.js

@@ -1,7 +1,7 @@
-import Component from 'flarum/Component';
+import Component from '../../common/Component';
-import SessionDropdown from 'flarum/components/SessionDropdown';
+import SessionDropdown from './SessionDropdown';
-import ItemList from 'flarum/utils/ItemList';
+import ItemList from '../../common/utils/ItemList';
-import listItems from 'flarum/helpers/listItems';
+import listItems from '../../common/helpers/listItems';
 
 /**
  * The `HeaderSecondary` component displays secondary header controls.

js/src/admin/components/LoadingModal.js

@@ -1,4 +1,4 @@
-import Modal from 'flarum/components/Modal';
+import Modal from '../../common/components/Modal';
 
 export default class LoadingModal extends Modal {
   isDismissible() {

js/src/admin/components/MailPage.js

@@ -1,8 +1,8 @@
-import Page from 'flarum/components/Page';
+import Page from './Page';
-import FieldSet from 'flarum/components/FieldSet';
+import FieldSet from '../../common/components/FieldSet';
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
-import Alert from 'flarum/components/Alert';
+import Alert from '../../common/components/Alert';
-import saveSettings from 'flarum/utils/saveSettings';
+import saveSettings from '../utils/saveSettings';
 
 export default class MailPage extends Page {
   init() {

js/src/admin/components/Page.js

@@ -1,4 +1,4 @@
-import Component from 'flarum/Component';
+import Component from '../../common/Component';
 
 /**
  * The `Page` component

js/src/admin/components/PermissionDropdown.js

@@ -1,9 +1,9 @@
-import Dropdown from 'flarum/components/Dropdown';
+import Dropdown from '../../common/components/Dropdown';
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
-import Separator from 'flarum/components/Separator';
+import Separator from '../../common/components/Separator';
-import Group from 'flarum/models/Group';
+import Group from '../../common/models/Group';
-import Badge from 'flarum/components/Badge';
+import Badge from '../../common/components/Badge';
-import GroupBadge from 'flarum/components/GroupBadge';
+import GroupBadge from '../../common/components/GroupBadge';
 
 function badgeForId(id) {
   const group = app.store.getById('groups', id);
@@ -52,9 +52,9 @@ export default class PermissionDropdown extends Dropdown {
     const adminGroup = app.store.getById('groups', Group.ADMINISTRATOR_ID);
 
     if (everyone) {
-      this.props.label = Badge.component({icon: 'globe'});
+      this.props.label = Badge.component({icon: 'fas fa-globe'});
     } else if (members) {
-      this.props.label = Badge.component({icon: 'user'});
+      this.props.label = Badge.component({icon: 'fas fa-user'});
     } else {
       this.props.label = [
         badgeForId(Group.ADMINISTRATOR_ID),
@@ -66,8 +66,8 @@ export default class PermissionDropdown extends Dropdown {
       if (this.props.allowGuest) {
         this.props.children.push(
           Button.component({
-            children: [Badge.component({icon: 'globe'}), ' ', app.translator.trans('core.admin.permissions_controls.everyone_button')],
+            children: [Badge.component({icon: 'fas fa-globe'}), ' ', app.translator.trans('core.admin.permissions_controls.everyone_button')],
-            icon: everyone ? 'check' : true,
+            icon: everyone ? 'fas fa-check' : true,
             onclick: () => this.save([Group.GUEST_ID]),
             disabled: this.isGroupDisabled(Group.GUEST_ID)
           })
@@ -76,8 +76,8 @@ export default class PermissionDropdown extends Dropdown {
 
       this.props.children.push(
         Button.component({
-          children: [Badge.component({icon: 'user'}), ' ', app.translator.trans('core.admin.permissions_controls.members_button')],
+          children: [Badge.component({icon: 'fas fa-user'}), ' ', app.translator.trans('core.admin.permissions_controls.members_button')],
-          icon: members ? 'check' : true,
+          icon: members ? 'fas fa-check' : true,
           onclick: () => this.save([Group.MEMBER_ID]),
           disabled: this.isGroupDisabled(Group.MEMBER_ID)
         }),
@@ -86,7 +86,7 @@ export default class PermissionDropdown extends Dropdown {
 
         Button.component({
           children: [badgeForId(adminGroup.id()), ' ', adminGroup.namePlural()],
-          icon: !everyone && !members ? 'check' : true,
+          icon: !everyone && !members ? 'fas fa-check' : true,
           disabled: !everyone && !members,
           onclick: e => {
             if (e.shiftKey) e.stopPropagation();
@@ -101,7 +101,7 @@ export default class PermissionDropdown extends Dropdown {
           .filter(group => [Group.ADMINISTRATOR_ID, Group.GUEST_ID, Group.MEMBER_ID].indexOf(group.id()) === -1)
           .map(group => Button.component({
             children: [badgeForId(group.id()), ' ', group.namePlural()],
-            icon: groupIds.indexOf(group.id()) !== -1 ? 'check' : true,
+            icon: groupIds.indexOf(group.id()) !== -1 ? 'fas fa-check' : true,
             onclick: (e) => {
               if (e.shiftKey) e.stopPropagation();
               this.toggle(group.id());

js/src/admin/components/PermissionGrid.js

@@ -1,9 +1,9 @@
-import Component from 'flarum/Component';
+import Component from '../../common/Component';
-import PermissionDropdown from 'flarum/components/PermissionDropdown';
+import PermissionDropdown from './PermissionDropdown';
-import SettingDropdown from 'flarum/components/SettingDropdown';
+import SettingDropdown from './SettingDropdown';
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
-import ItemList from 'flarum/utils/ItemList';
+import ItemList from '../../common/utils/ItemList';
-import icon from 'flarum/helpers/icon';
+import icon from '../../common/helpers/icon';
 
 export default class PermissionGrid extends Component {
   init() {
@@ -29,7 +29,7 @@ export default class PermissionGrid extends Component {
             {scopes.map(scope => (
               <th>
                 {scope.label}{' '}
-                {scope.onremove ? Button.component({icon: 'times', className: 'Button Button--text PermissionGrid-removeScope', onclick: scope.onremove}) : ''}
+                {scope.onremove ? Button.component({icon: 'fas fa-times', className: 'Button Button--text PermissionGrid-removeScope', onclick: scope.onremove}) : ''}
               </th>
             ))}
             <th>{this.scopeControlItems().toArray()}</th>
@@ -85,21 +85,21 @@ export default class PermissionGrid extends Component {
     const items = new ItemList();
 
     items.add('viewDiscussions', {
-      icon: 'eye',
+      icon: 'fas fa-eye',
       label: app.translator.trans('core.admin.permissions.view_discussions_label'),
       permission: 'viewDiscussions',
       allowGuest: true
     }, 100);
 
     items.add('viewUserList', {
-      icon: 'users',
+      icon: 'fas fa-users',
       label: app.translator.trans('core.admin.permissions.view_user_list_label'),
       permission: 'viewUserList',
       allowGuest: true
     }, 100);
 
     items.add('signUp', {
-      icon: 'user-plus',
+      icon: 'fas fa-user-plus',
       label: app.translator.trans('core.admin.permissions.sign_up_label'),
       setting: () => SettingDropdown.component({
         key: 'allow_sign_up',
@@ -110,6 +110,12 @@ export default class PermissionGrid extends Component {
       })
     }, 90);
 
+    items.add('viewLastSeenAt', {
+      icon: 'far fa-clock',
+      label: app.translator.trans('core.admin.permissions.view_last_seen_at_label'),
+      permission: 'user.viewLastSeenAt',
+    });
+
     return items;
   }
 
@@ -117,13 +123,13 @@ export default class PermissionGrid extends Component {
     const items = new ItemList();
 
     items.add('start', {
-      icon: 'edit',
+      icon: 'fas fa-edit',
       label: app.translator.trans('core.admin.permissions.start_discussions_label'),
       permission: 'startDiscussion'
     }, 100);
 
     items.add('allowRenaming', {
-      icon: 'i-cursor',
+      icon: 'fas fa-i-cursor',
       label: app.translator.trans('core.admin.permissions.allow_renaming_label'),
       setting: () => {
         const minutes = parseInt(app.data.settings.allow_renaming, 10);
@@ -149,13 +155,13 @@ export default class PermissionGrid extends Component {
     const items = new ItemList();
 
     items.add('reply', {
-      icon: 'reply',
+      icon: 'fas fa-reply',
       label: app.translator.trans('core.admin.permissions.reply_to_discussions_label'),
       permission: 'discussion.reply'
     }, 100);
 
     items.add('allowPostEditing', {
-      icon: 'pencil',
+      icon: 'fas fa-pencil-alt',
       label: app.translator.trans('core.admin.permissions.allow_post_editing_label'),
       setting: () => {
         const minutes = parseInt(app.data.settings.allow_post_editing, 10);
@@ -181,37 +187,43 @@ export default class PermissionGrid extends Component {
     const items = new ItemList();
 
     items.add('viewIpsPosts', {
-      icon: 'bullseye',
+      icon: 'fas fa-bullseye',
       label: app.translator.trans('core.admin.permissions.view_post_ips_label'),
       permission: 'discussion.viewIpsPosts'
     }, 110);
 
     items.add('renameDiscussions', {
-      icon: 'i-cursor',
+      icon: 'fas fa-i-cursor',
       label: app.translator.trans('core.admin.permissions.rename_discussions_label'),
       permission: 'discussion.rename'
     }, 100);
 
     items.add('hideDiscussions', {
-      icon: 'trash-o',
+      icon: 'far fa-trash-alt',
       label: app.translator.trans('core.admin.permissions.delete_discussions_label'),
       permission: 'discussion.hide'
     }, 90);
 
     items.add('deleteDiscussions', {
-      icon: 'times',
+      icon: 'fas fa-times',
       label: app.translator.trans('core.admin.permissions.delete_discussions_forever_label'),
       permission: 'discussion.delete'
     }, 80);
 
     items.add('editPosts', {
-      icon: 'pencil',
+      icon: 'fas fa-pencil-alt',
-      label: app.translator.trans('core.admin.permissions.edit_and_delete_posts_label'),
+      label: app.translator.trans('core.admin.permissions.edit_posts_label'),
       permission: 'discussion.editPosts'
     }, 70);
 
+    items.add('hidePosts', {
+      icon: 'far fa-trash-alt',
+      label: app.translator.trans('core.admin.permissions.delete_posts_label'),
+      permission: 'discussion.hidePosts'
+    }, 60);
+
     items.add('deletePosts', {
-      icon: 'times',
+      icon: 'fas fa-times',
       label: app.translator.trans('core.admin.permissions.delete_posts_forever_label'),
       permission: 'discussion.deletePosts'
     }, 60);

js/src/admin/components/PermissionsPage.js

@@ -1,9 +1,9 @@
-import Page from 'flarum/components/Page';
+import Page from './Page';
-import GroupBadge from 'flarum/components/GroupBadge';
+import GroupBadge from '../../common/components/GroupBadge';
-import EditGroupModal from 'flarum/components/EditGroupModal';
+import EditGroupModal from './EditGroupModal';
-import Group from 'flarum/models/Group';
+import Group from '../../common/models/Group';
-import icon from 'flarum/helpers/icon';
+import icon from '../../common/helpers/icon';
-import PermissionGrid from 'flarum/components/PermissionGrid';
+import PermissionGrid from './PermissionGrid';
 
 export default class PermissionsPage extends Page {
   view() {
@@ -24,7 +24,7 @@ export default class PermissionsPage extends Page {
                 </button>
               ))}
             <button className="Button Group Group--add" onclick={() => app.modal.show(new EditGroupModal())}>
-              {icon('plus', {className: 'Group-icon'})}
+              {icon('fas fa-plus', {className: 'Group-icon'})}
               <span className="Group-name">{app.translator.trans('core.admin.permissions.new_group_button')}</span>
             </button>
           </div>

js/src/admin/components/SessionDropdown.js

@@ -1,8 +1,8 @@
-import avatar from 'flarum/helpers/avatar';
+import avatar from '../../common/helpers/avatar';
-import username from 'flarum/helpers/username';
+import username from '../../common/helpers/username';
-import Dropdown from 'flarum/components/Dropdown';
+import Dropdown from '../../common/components/Dropdown';
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
-import ItemList from 'flarum/utils/ItemList';
+import ItemList from '../../common/utils/ItemList';
 
 /**
  * The `SessionDropdown` component shows a button with the current user's
@@ -42,7 +42,7 @@ export default class SessionDropdown extends Dropdown {
 
     items.add('logOut',
       Button.component({
-        icon: 'sign-out',
+        icon: 'fas fa-sign-out-alt',
         children: app.translator.trans('core.admin.header.log_out_button'),
         onclick: app.session.logout.bind(app.session)
       }),

js/src/admin/components/SettingDropdown.js

@@ -1,6 +1,6 @@
-import SelectDropdown from 'flarum/components/SelectDropdown';
+import SelectDropdown from '../../common/components/SelectDropdown';
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
-import saveSettings from 'flarum/utils/saveSettings';
+import saveSettings from '../utils/saveSettings';
 
 export default class SettingDropdown extends SelectDropdown {
   static initProps(props) {
@@ -8,7 +8,7 @@ export default class SettingDropdown extends SelectDropdown {
 
     props.className = 'SettingDropdown';
     props.buttonClassName = 'Button Button--text';
-    props.caretIcon = 'caret-down';
+    props.caretIcon = 'fas fa-caret-down';
     props.defaultLabel = 'Custom';
 
     props.children = props.options.map(({value, label}) => {
@@ -16,7 +16,7 @@ export default class SettingDropdown extends SelectDropdown {
 
       return Button.component({
         children: label,
-        icon: active ? 'check' : true,
+        icon: active ? 'fas fa-check' : true,
         onclick: saveSettings.bind(this, {[props.key]: value}),
         active
       });

js/src/admin/components/SettingsModal.js

@@ -1,6 +1,6 @@
-import Modal from 'flarum/components/Modal';
+import Modal from '../../common/components/Modal';
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
-import saveSettings from 'flarum/utils/saveSettings';
+import saveSettings from '../utils/saveSettings';
 
 export default class SettingsModal extends Modal {
   init() {

js/src/admin/components/StatusWidget.js

@@ -0,0 +1,58 @@
+/*
+ * This file is part of Flarum.
+ *
+ * (c) Toby Zerner <toby.zerner@gmail.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+import DashboardWidget from './DashboardWidget';
+import listItems from '../../common/helpers/listItems';
+import ItemList from '../../common/utils/ItemList';
+import Dropdown from '../../common/components/Dropdown';
+import Button from '../../common/components/Button';
+import LoadingModal from './LoadingModal';
+
+export default class StatusWidget extends DashboardWidget {
+  className() {
+    return 'StatusWidget';
+  }
+
+  content() {
+    return (
+      <ul>{listItems(this.items().toArray())}</ul>
+    );
+  }
+
+  items() {
+    const items = new ItemList();
+
+    items.add('tools', (
+      <Dropdown
+        label={app.translator.trans('core.admin.dashboard.tools_button')}
+        icon="fas fa-cog"
+        buttonClassName="Button"
+        menuClassName="Dropdown-menu--right">
+        <Button onclick={this.handleClearCache.bind(this)}>
+          {app.translator.trans('core.admin.dashboard.clear_cache_button')}
+        </Button>
+      </Dropdown>
+    ));
+
+    items.add('version-flarum', [<strong>Flarum</strong>, <br/>, app.forum.attribute('version')]);
+    items.add('version-php', [<strong>PHP</strong>, <br/>, app.data.phpVersion]);
+    items.add('version-mysql', [<strong>MySQL</strong>, <br/>, app.data.mysqlVersion]);
+
+    return items;
+  }
+
+  handleClearCache(e) {
+    app.modal.show(new LoadingModal());
+
+    app.request({
+      method: 'DELETE',
+      url: app.forum.attribute('apiUrl') + '/cache'
+    }).then(() => window.location.reload());
+  }
+}

js/src/admin/components/UploadImageButton.js

@@ -1,4 +1,4 @@
-import Button from 'flarum/components/Button';
+import Button from '../../common/components/Button';
 
 export default class UploadImageButton extends Button {
   init() {

js/src/admin/components/Widget.js

@@ -0,0 +1,38 @@
+/*
+ * This file is part of Flarum.
+ *
+ * (c) Toby Zerner <toby.zerner@gmail.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+import Component from '../../common/Component';
+
+export default class DashboardWidget extends Component {
+  view() {
+    return (
+      <div className={"DashboardWidget "+this.className()}>
+        {this.content()}
+      </div>
+    );
+  }
+
+  /**
+   * Get the class name to apply to the widget.
+   *
+   * @return {String}
+   */
+  className() {
+    return '';
+  }
+
+  /**
+   * Get the content of the widget.
+   *
+   * @return {VirtualElement}
+   */
+  content() {
+    return [];
+  }
+}

js/src/admin/index.js

@@ -0,0 +1,18 @@
+import AdminApplication from './AdminApplication';
+
+const app = new AdminApplication();
+
+// Backwards compatibility
+window.app = app;
+
+export { app };
+
+// Export public API
+
+
+// Export compat API
+import compat from './compat';
+
+compat.app = app;
+
+export { compat };

js/src/admin/routes.js

@@ -1,12 +1,12 @@
-import DashboardPage from 'flarum/components/DashboardPage';
+import DashboardPage from './components/DashboardPage';
-import BasicsPage from 'flarum/components/BasicsPage';
+import BasicsPage from './components/BasicsPage';
-import PermissionsPage from 'flarum/components/PermissionsPage';
+import PermissionsPage from './components/PermissionsPage';
-import AppearancePage from 'flarum/components/AppearancePage';
+import AppearancePage from './components/AppearancePage';
-import ExtensionsPage from 'flarum/components/ExtensionsPage';
+import ExtensionsPage from './components/ExtensionsPage';
-import MailPage from 'flarum/components/MailPage';
+import MailPage from './components/MailPage';
 
 /**
- * The `routes` initializer defines the admin app's routes.
+ * The `routes` initializer defines the forum app's routes.
  *
  * @param {App} app
  */

js/src/common/Application.js

@@ -1,29 +1,37 @@
-import ItemList from 'flarum/utils/ItemList';
+import ItemList from './utils/ItemList';
-import Alert from 'flarum/components/Alert';
+import Alert from './components/Alert';
-import Button from 'flarum/components/Button';
+import ModalManager from './components/ModalManager';
-import RequestErrorModal from 'flarum/components/RequestErrorModal';
+import AlertManager from './components/AlertManager';
-import ConfirmPasswordModal from 'flarum/components/ConfirmPasswordModal';
+import Translator from './Translator';
-import Translator from 'flarum/Translator';
+import Store from './Store';
-import extract from 'flarum/utils/extract';
+import Session from './Session';
-import patchMithril from 'flarum/utils/patchMithril';
+import extract from './utils/extract';
-import RequestError from 'flarum/utils/RequestError';
+import Drawer from './utils/Drawer';
-import { extend } from 'flarum/extend';
+import mapRoutes from './utils/mapRoutes';
+import RequestError from './utils/RequestError';
+import ScrollListener from './utils/ScrollListener';
+import { extend } from './extend';
+
+import Forum from './models/Forum';
+import User from './models/User';
+import Discussion from './models/Discussion';
+import Post from './models/Post';
+import Group from './models/Group';
+import Notification from './models/Notification';
+import { flattenDeep } from 'lodash-es';
 
 /**
  * The `App` class provides a container for an application, as well as various
  * utilities for the rest of the app to use.
  */
-export default class App {
+export default class Application {
-  constructor() {
-    patchMithril(window);
-
   /**
    * The forum model for this application.
    *
    * @type {Forum}
    * @public
    */
-    this.forum = null;
+  forum = null;
 
   /**
    * A map of routes, keyed by a unique route name. Each route is an object
@@ -38,7 +46,7 @@ export default class App {
    * @type {Object}
    * @public
    */
-    this.routes = {};
+  routes = {};
 
   /**
    * An ordered list of initializers to bootstrap the application.
@@ -46,7 +54,7 @@ export default class App {
    * @type {ItemList}
    * @public
    */
-    this.initializers = new ItemList();
+  initializers = new ItemList();
 
   /**
    * The app's session.
@@ -54,7 +62,7 @@ export default class App {
    * @type {Session}
    * @public
    */
-    this.session = null;
+  session = null;
 
   /**
    * The app's translator.
@@ -62,7 +70,7 @@ export default class App {
    * @type {Translator}
    * @public
    */
-    this.translator = new Translator();
+  translator = new Translator();
 
   /**
    * The app's data store.
@@ -70,7 +78,14 @@ export default class App {
    * @type {Store}
    * @public
    */
-    this.store = null;
+  store = new Store({
+    forums: Forum,
+    users: User,
+    discussions: Discussion,
+    posts: Post,
+    groups: Group,
+    notifications: Notification
+  });
 
   /**
    * A local cache that can be used to store data at the application level, so
@@ -79,7 +94,7 @@ export default class App {
    * @type {Object}
    * @public
    */
-    this.cache = {};
+  cache = {};
 
   /**
    * Whether or not the app has been booted.
@@ -87,7 +102,7 @@ export default class App {
    * @type {Boolean}
    * @public
    */
-    this.booted = false;
+  booted = false;
 
   /**
    * An Alert that was shown as a result of an AJAX request error. If present,
@@ -96,23 +111,71 @@ export default class App {
    * @type {null|Alert}
    * @private
    */
-    this.requestError = null;
+  requestError = null;
 
-    this.title = '';
+  data;
-    this.titleCount = 0;
+
+  title = '';
+  titleCount = 0;
+
+  load(payload) {
+    this.data = payload;
+    this.translator.locale = payload.locale;
   }
 
-  /**
+  boot() {
-   * Boot the application by running all of the registered initializers.
-   *
-   * @public
-   */
-  boot(data) {
-    this.data = data;
-
-    this.translator.locale = data.locale;
-
     this.initializers.toArray().forEach(initializer => initializer(this));
+
+    this.store.pushPayload({data: this.data.resources});
+
+    this.forum = this.store.getById('forums', 1);
+
+    this.session = new Session(
+        this.store.getById('users', this.data.session.userId),
+        this.data.session.csrfToken
+    );
+
+    this.mount();
+  }
+
+  bootExtensions(extensions) {
+    Object.keys(extensions).forEach(name => {
+      const extension = extensions[name];
+      
+      const extenders = flattenDeep(extension.extend);
+
+      for (const extender of extenders) {
+        extender.extend(this, { name, exports: extension });
+      }
+    });
+  }
+
+  mount(basePath = '') {
+    this.modal = m.mount(document.getElementById('modal'), <ModalManager/>);
+    this.alerts = m.mount(document.getElementById('alerts'), <AlertManager/>);
+
+    this.drawer = new Drawer();
+
+    m.route(
+      document.getElementById('content'),
+      basePath + '/',
+      mapRoutes(this.routes, basePath)
+    );
+
+    // Add a class to the body which indicates that the page has been scrolled
+    // down.
+    new ScrollListener(top => {
+      const $app = $('#app');
+      const offset = $app.offset().top;
+
+      $app
+        .toggleClass('affix', top >= offset)
+        .toggleClass('scrolled', top > offset);
+    }).start();
+
+    $(() => {
+      $('body').addClass('ontouchstart' in window ? 'touch' : 'no-touch');
+    });
   }
 
   /**
@@ -121,10 +184,11 @@ export default class App {
    * @return {Object|null}
    * @public
    */
-  preloadedDocument() {
+  preloadedApiDocument() {
-    if (this.data.document) {
+    if (this.data.apiDocument) {
-      const results = this.store.pushPayload(this.data.document);
+      const results = this.store.pushPayload(this.data.apiDocument);
-      this.data.document = null;
+
+      this.data.apiDocument = null;
 
       return results;
     }
@@ -266,10 +330,7 @@ export default class App {
 
       error.alert = new Alert({
         type: 'error',
-        children,
+        children
-        controls: app.forum.attribute('debug') ? [
-          <Button className="Button Button--link" onclick={this.showDebug.bind(this, error)}>Debug</Button>
-        ] : undefined
       });
 
       try {
@@ -284,16 +345,6 @@ export default class App {
     return deferred.promise;
   }
 
-  /**
-   * @param {RequestError} error
-   * @private
-   */
-  showDebug(error) {
-    this.alerts.dismiss(this.requestErrorAlert);
-
-    this.modal.show(new RequestErrorModal({error}));
-  }
-
   /**
    * Construct a URL to the route with the given name.
    *

js/src/common/Store.js

@@ -75,7 +75,7 @@ export default class Store {
    * Make a request to the API to find record(s) of a specific type.
    *
    * @param {String} type The resource type.
-   * @param {Integer|Integer[]|Object} [id] The ID(s) of the model(s) to retreive.
+   * @param {Integer|Integer[]|Object} [id] The ID(s) of the model(s) to retrieve.
    *     Alternatively, if an object is passed, it will be handled as the
    *     `query` parameter.
    * @param {Object} [query]

js/src/common/Translator.js

@@ -1,7 +1,6 @@
-import User from 'flarum/models/User';
+import User from './models/User';
-import username from 'flarum/helpers/username';
+import username from './helpers/username';
-import extractText from 'flarum/utils/extractText';
+import extract from './utils/extract';
-import extract from 'flarum/utils/extract';
 
 /**
  * Translator with the same API as Symfony's.
@@ -23,6 +22,10 @@ export default class Translator {
     this.locale = null;
   }
 
+  addTranslations(translations) {
+    Object.assign(this.translations, translations);
+  }
+
   trans(id, parameters) {
     const translation = this.translations[id];
 

js/src/common/compat.js

@@ -0,0 +1,125 @@
+import * as extend from './extend';
+import Session from './Session';
+import Store from './Store';
+import evented from './utils/evented';
+import liveHumanTimes from './utils/liveHumanTimes';
+import ItemList from './utils/ItemList';
+import mixin from './utils/mixin';
+import humanTime from './utils/humanTime';
+import computed from './utils/computed';
+import Drawer from './utils/Drawer';
+import anchorScroll from './utils/anchorScroll';
+import RequestError from './utils/RequestError';
+import abbreviateNumber from './utils/abbreviateNumber';
+import * as string from './utils/string';
+import SubtreeRetainer from './utils/SubtreeRetainer';
+import extract from './utils/extract';
+import ScrollListener from './utils/ScrollListener';
+import stringToColor from './utils/stringToColor';
+import patchMithril from './utils/patchMithril';
+import classList from './utils/classList';
+import extractText from './utils/extractText';
+import formatNumber from './utils/formatNumber';
+import mapRoutes from './utils/mapRoutes';
+import Notification from './models/Notification';
+import User from './models/User';
+import Post from './models/Post';
+import Discussion from './models/Discussion';
+import Group from './models/Group';
+import Forum from './models/Forum';
+import Component from './Component';
+import Translator from './Translator';
+import AlertManager from './components/AlertManager';
+import Switch from './components/Switch';
+import Badge from './components/Badge';
+import LoadingIndicator from './components/LoadingIndicator';
+import Placeholder from './components/Placeholder';
+import Separator from './components/Separator';
+import Dropdown from './components/Dropdown';
+import SplitDropdown from './components/SplitDropdown';
+import FieldSet from './components/FieldSet';
+import Select from './components/Select';
+import Navigation from './components/Navigation';
+import Alert from './components/Alert';
+import LinkButton from './components/LinkButton';
+import Checkbox from './components/Checkbox';
+import SelectDropdown from './components/SelectDropdown';
+import ModalManager from './components/ModalManager';
+import Button from './components/Button';
+import Modal from './components/Modal';
+import GroupBadge from './components/GroupBadge';
+import Model from './Model';
+import Application from './Application';
+import fullTime from './helpers/fullTime';
+import avatar from './helpers/avatar';
+import icon from './helpers/icon';
+import humanTimeHelper from './helpers/humanTime';
+import punctuateSeries from './helpers/punctuateSeries';
+import highlight from './helpers/highlight';
+import username from './helpers/username';
+import userOnline from './helpers/userOnline';
+import listItems from './helpers/listItems';
+
+export default {
+  'extend': extend,
+  'Session': Session,
+  'Store': Store,
+  'utils/evented': evented,
+  'utils/liveHumanTimes': liveHumanTimes,
+  'utils/ItemList': ItemList,
+  'utils/mixin': mixin,
+  'utils/humanTime': humanTime,
+  'utils/computed': computed,
+  'utils/Drawer': Drawer,
+  'utils/anchorScroll': anchorScroll,
+  'utils/RequestError': RequestError,
+  'utils/abbreviateNumber': abbreviateNumber,
+  'utils/string': string,
+  'utils/SubtreeRetainer': SubtreeRetainer,
+  'utils/extract': extract,
+  'utils/ScrollListener': ScrollListener,
+  'utils/stringToColor': stringToColor,
+  'utils/patchMithril': patchMithril,
+  'utils/classList': classList,
+  'utils/extractText': extractText,
+  'utils/formatNumber': formatNumber,
+  'utils/mapRoutes': mapRoutes,
+  'models/Notification': Notification,
+  'models/User': User,
+  'models/Post': Post,
+  'models/Discussion': Discussion,
+  'models/Group': Group,
+  'models/Forum': Forum,
+  'Component': Component,
+  'Translator': Translator,
+  'components/AlertManager': AlertManager,
+  'components/Switch': Switch,
+  'components/Badge': Badge,
+  'components/LoadingIndicator': LoadingIndicator,
+  'components/Placeholder': Placeholder,
+  'components/Separator': Separator,
+  'components/Dropdown': Dropdown,
+  'components/SplitDropdown': SplitDropdown,
+  'components/FieldSet': FieldSet,
+  'components/Select': Select,
+  'components/Navigation': Navigation,
+  'components/Alert': Alert,
+  'components/LinkButton': LinkButton,
+  'components/Checkbox': Checkbox,
+  'components/SelectDropdown': SelectDropdown,
+  'components/ModalManager': ModalManager,
+  'components/Button': Button,
+  'components/Modal': Modal,
+  'components/GroupBadge': GroupBadge,
+  'Model': Model,
+  'Application': Application,
+  'helpers/fullTime': fullTime,
+  'helpers/avatar': avatar,
+  'helpers/icon': icon,
+  'helpers/humanTime': humanTimeHelper,
+  'helpers/punctuateSeries': punctuateSeries,
+  'helpers/highlight': highlight,
+  'helpers/username': username,
+  'helpers/userOnline': userOnline,
+  'helpers/listItems': listItems
+};

js/src/common/components/Alert.js

@@ -1,7 +1,7 @@
-import Component from 'flarum/Component';
+import Component from '../Component';
-import Button from 'flarum/components/Button';
+import Button from './Button';
-import listItems from 'flarum/helpers/listItems';
+import listItems from '../helpers/listItems';
-import extract from 'flarum/utils/extract';
+import extract from '../utils/extract';
 
 /**
  * The `Alert` component represents an alert box, which contains a message,
@@ -37,7 +37,7 @@ export default class Alert extends Component {
     if (dismissible || dismissible === undefined) {
       dismissControl.push(
         <Button
-          icon="times"
+          icon="fas fa-times"
           className="Button Button--link Button--icon Alert-dismiss"
           onclick={ondismiss}/>
       );

js/src/common/components/AlertManager.js

@@ -1,5 +1,5 @@
-import Component from 'flarum/Component';
+import Component from '../Component';
-import Alert from 'flarum/components/Alert';
+import Alert from './Alert';
 
 /**
  * The `AlertManager` component provides an area in which `Alert` components can

js/src/common/components/Badge.js

@@ -1,6 +1,6 @@
-import Component from 'flarum/Component';
+import Component from '../Component';
-import icon from 'flarum/helpers/icon';
+import icon from '../helpers/icon';
-import extract from 'flarum/utils/extract';
+import extract from '../utils/extract';
 
 /**
  * The `Badge` component represents a user/discussion badge, indicating some

js/src/common/components/Button.js

@@ -1,8 +1,8 @@
-import Component from 'flarum/Component';
+import Component from '../Component';
-import icon from 'flarum/helpers/icon';
+import icon from '../helpers/icon';
-import extract from 'flarum/utils/extract';
+import extract from '../utils/extract';
-import extractText from 'flarum/utils/extractText';
+import extractText from '../utils/extractText';
-import LoadingIndicator from 'flarum/components/LoadingIndicator';
+import LoadingIndicator from './LoadingIndicator';
 
 /**
  * The `Button` component defines an element which, when clicked, performs an

js/src/common/components/Checkbox.js

@@ -1,6 +1,6 @@
-import Component from 'flarum/Component';
+import Component from '../Component';
-import LoadingIndicator from 'flarum/components/LoadingIndicator';
+import LoadingIndicator from './LoadingIndicator';
-import icon from 'flarum/helpers/icon';
+import icon from '../helpers/icon';
 
 /**
  * The `Checkbox` component defines a checkbox input.
@@ -52,7 +52,7 @@ export default class Checkbox extends Component {
   getDisplay() {
     return this.loading
       ? LoadingIndicator.component({size: 'tiny'})
-      : icon(this.props.state ? 'check' : 'times');
+      : icon(this.props.state ? 'fas fa-check' : 'fas fa-times');
   }
 
   /**