Put m.stream in flarum/utils/stream (#2316)

js/src/admin/components/AppearancePage.js

@@ -1,21 +1,21 @@
 import Page from '../../common/components/Page';
 import Button from '../../common/components/Button';
 import Switch from '../../common/components/Switch';
+import Stream from '../../common/utils/Stream';
 import EditCustomCssModal from './EditCustomCssModal';
 import EditCustomHeaderModal from './EditCustomHeaderModal';
 import EditCustomFooterModal from './EditCustomFooterModal';
 import UploadImageButton from './UploadImageButton';
 import saveSettings from '../utils/saveSettings';
-import withAttr from '../../common/utils/withAttr';
 
 export default class AppearancePage extends Page {
   oninit(vnode) {
     super.oninit(vnode);
 
-    this.primaryColor = m.stream(app.data.settings.theme_primary_color);
-    this.secondaryColor = m.stream(app.data.settings.theme_secondary_color);
-    this.darkMode = m.stream(app.data.settings.theme_dark_mode);
-    this.coloredHeader = m.stream(app.data.settings.theme_colored_header);
+    this.primaryColor = Stream(app.data.settings.theme_primary_color);
+    this.secondaryColor = Stream(app.data.settings.theme_secondary_color);
+    this.darkMode = Stream(app.data.settings.theme_dark_mode);
+    this.coloredHeader = Stream(app.data.settings.theme_colored_header);
   }
 
   view() {

js/src/admin/components/BasicsPage.js

@@ -5,6 +5,7 @@ import Button from '../../common/components/Button';
 import saveSettings from '../utils/saveSettings';
 import ItemList from '../../common/utils/ItemList';
 import Switch from '../../common/components/Switch';
+import Stream from '../../common/utils/Stream';
 import withAttr from '../../common/utils/withAttr';
 
 export default class BasicsPage extends Page {
@@ -26,7 +27,7 @@ export default class BasicsPage extends Page {
     this.values = {};
 
     const settings = app.data.settings;
-    this.fields.forEach((key) => (this.values[key] = m.stream(settings[key])));
+    this.fields.forEach((key) => (this.values[key] = Stream(settings[key])));
 
     this.localeOptions = {};
     const locales = app.data.locales;

js/src/admin/components/EditGroupModal.js

@@ -4,7 +4,7 @@ import Badge from '../../common/components/Badge';
 import Group from '../../common/models/Group';
 import ItemList from '../../common/utils/ItemList';
 import Switch from '../../common/components/Switch';
-import withAttr from '../../common/utils/withAttr';
+import Stream from '../../common/utils/Stream';
 
 /**
  * The `EditGroupModal` component shows a modal dialog which allows the user
@@ -16,11 +16,11 @@ export default class EditGroupModal extends Modal {
 
     this.group = this.attrs.group || app.store.createRecord('groups');
 
-    this.nameSingular = m.stream(this.group.nameSingular() || '');
-    this.namePlural = m.stream(this.group.namePlural() || '');
-    this.icon = m.stream(this.group.icon() || '');
-    this.color = m.stream(this.group.color() || '');
-    this.isHidden = m.stream(this.group.isHidden() || false);
+    this.nameSingular = Stream(this.group.nameSingular() || '');
+    this.namePlural = Stream(this.group.namePlural() || '');
+    this.icon = Stream(this.group.icon() || '');
+    this.color = Stream(this.group.color() || '');
+    this.isHidden = Stream(this.group.isHidden() || false);
   }
 
   className() {

js/src/admin/components/MailPage.js

@@ -5,7 +5,7 @@ import Alert from '../../common/components/Alert';
 import Select from '../../common/components/Select';
 import LoadingIndicator from '../../common/components/LoadingIndicator';
 import saveSettings from '../utils/saveSettings';
-import withAttr from '../../common/utils/withAttr';
+import Stream from '../../common/utils/Stream';
 
 export default class MailPage extends Page {
   oninit(vnode) {
@@ -25,7 +25,7 @@ export default class MailPage extends Page {
     this.status = { sending: false, errors: {} };
 
     const settings = app.data.settings;
-    this.fields.forEach((key) => (this.values[key] = m.stream(settings[key])));
+    this.fields.forEach((key) => (this.values[key] = Stream(settings[key])));
 
     app
       .request({
@@ -40,7 +40,7 @@ export default class MailPage extends Page {
         for (const driver in this.driverFields) {
           for (const field in this.driverFields[driver]) {
             this.fields.push(field);
-            this.values[field] = m.stream(settings[field]);
+            this.values[field] = Stream(settings[field]);
           }
         }
 

js/src/admin/components/SettingsModal.js

@@ -1,5 +1,6 @@
 import Modal from '../../common/components/Modal';
 import Button from '../../common/components/Button';
+import Stream from '../../common/utils/Stream';
 import saveSettings from '../utils/saveSettings';
 
 export default class SettingsModal extends Modal {
@@ -35,7 +36,7 @@ export default class SettingsModal extends Modal {
   }
 
   setting(key, fallback = '') {
-    this.settings[key] = this.settings[key] || m.stream(app.data.settings[key] || fallback);
+    this.settings[key] = this.settings[key] || Stream(app.data.settings[key] || fallback);
 
     return this.settings[key];
   }

js/src/common/compat.js

@@ -12,6 +12,7 @@ import anchorScroll from './utils/anchorScroll';
 import RequestError from './utils/RequestError';
 import abbreviateNumber from './utils/abbreviateNumber';
 import * as string from './utils/string';
+import Stream from './utils/Stream';
 import SubtreeRetainer from './utils/SubtreeRetainer';
 import setRouteWithForcedRefresh from './utils/setRouteWithForcedRefresh';
 import extract from './utils/extract';
@@ -85,6 +86,7 @@ export default {
   'utils/extract': extract,
   'utils/ScrollListener': ScrollListener,
   'utils/stringToColor': stringToColor,
+  'utils/Stream': Stream,
   'utils/subclassOf': subclassOf,
   'utils/setRouteWithForcedRefresh': setRouteWithForcedRefresh,
   'utils/patchMithril': patchMithril,

js/src/common/utils/Stream.js

@@ -0,0 +1,3 @@
+import Stream from 'mithril/stream';
+
+export default Stream;

js/src/common/utils/patchMithril.js

@@ -1,6 +1,6 @@
-import Stream from 'mithril/stream';
 import extract from './extract';
 import withAttr from './withAttr';
+import Stream from './Stream';
 
 let deprecatedMPropWarned = false;
 let deprecatedMWithAttrWarned = false;
@@ -68,15 +68,13 @@ export default function patchMithril(global) {
 
   Object.keys(defaultMithril).forEach((key) => (modifiedMithril[key] = defaultMithril[key]));
 
-  modifiedMithril.stream = Stream;
-
   modifiedMithril.route.Link = modifiedLink;
 
   // BEGIN DEPRECATED MITHRIL 2 BC LAYER
-  modifiedMithril.prop = function (...args) {
+  modifiedMithril.prop = modifiedMithril.stream = function (...args) {
     if (!deprecatedMPropWarned) {
       deprecatedMPropWarned = true;
-      console.warn('m.prop() is deprecated, please use m.stream() instead.');
+      console.warn('m.prop() is deprecated, please use the Stream util (flarum/utils/Streams) instead.');
     }
     return Stream.bind(this)(...args);
   };

js/src/forum/components/ChangeEmailModal.js

@@ -1,5 +1,6 @@
 import Modal from '../../common/components/Modal';
 import Button from '../../common/components/Button';
+import Stream from '../../common/utils/Stream';
 
 /**
  * The `ChangeEmailModal` component shows a modal dialog which allows the user
@@ -21,14 +22,14 @@ export default class ChangeEmailModal extends Modal {
      *
      * @type {function}
      */
-    this.email = m.stream(app.session.user.email());
+    this.email = Stream(app.session.user.email());
 
     /**
      * The value of the password input.
      *
      * @type {function}
      */
-    this.password = m.stream('');
+    this.password = Stream('');
   }
 
   className() {

js/src/forum/components/DiscussionComposer.js

@@ -1,5 +1,6 @@
 import ComposerBody from './ComposerBody';
 import extractText from '../../common/utils/extractText';
+import Stream from '../../common/utils/Stream';
 
 /**
  * The `DiscussionComposer` component displays the composer content for starting
@@ -26,7 +27,7 @@ export default class DiscussionComposer extends ComposerBody {
   oninit(vnode) {
     super.oninit(vnode);
 
-    this.composer.fields.title = this.composer.fields.title || m.stream('');
+    this.composer.fields.title = this.composer.fields.title || Stream('');
 
     /**
      * The value of the title input.

js/src/forum/components/EditUserModal.js

@@ -4,6 +4,7 @@ import GroupBadge from '../../common/components/GroupBadge';
 import Group from '../../common/models/Group';
 import extractText from '../../common/utils/extractText';
 import ItemList from '../../common/utils/ItemList';
+import Stream from '../../common/utils/Stream';
 
 /**
  * The `EditUserModal` component displays a modal dialog with a login form.
@@ -14,17 +15,17 @@ export default class EditUserModal extends Modal {
 
     const user = this.attrs.user;
 
-    this.username = m.stream(user.username() || '');
-    this.email = m.stream(user.email() || '');
-    this.isEmailConfirmed = m.stream(user.isEmailConfirmed() || false);
-    this.setPassword = m.stream(false);
-    this.password = m.stream(user.password() || '');
+    this.username = Stream(user.username() || '');
+    this.email = Stream(user.email() || '');
+    this.isEmailConfirmed = Stream(user.isEmailConfirmed() || false);
+    this.setPassword = Stream(false);
+    this.password = Stream(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.stream(user.groups().indexOf(group) !== -1)));
+      .forEach((group) => (this.groups[group.id()] = Stream(user.groups().indexOf(group) !== -1)));
   }
 
   className() {

js/src/forum/components/ForgotPasswordModal.js

@@ -1,6 +1,7 @@
 import Modal from '../../common/components/Modal';
 import Button from '../../common/components/Button';
 import extractText from '../../common/utils/extractText';
+import Stream from '../../common/utils/Stream';
 
 /**
  * The `ForgotPasswordModal` component displays a modal which allows the user to
@@ -19,7 +20,7 @@ export default class ForgotPasswordModal extends Modal {
      *
      * @type {Function}
      */
-    this.email = m.stream(this.attrs.email || '');
+    this.email = Stream(this.attrs.email || '');
 
     /**
      * Whether or not the password reset email was sent successfully.

js/src/forum/components/LogInModal.js

@@ -5,6 +5,7 @@ import Button from '../../common/components/Button';
 import LogInButtons from './LogInButtons';
 import extractText from '../../common/utils/extractText';
 import ItemList from '../../common/utils/ItemList';
+import Stream from '../../common/utils/Stream';
 
 /**
  * The `LogInModal` component displays a modal dialog with a login form.
@@ -23,21 +24,21 @@ export default class LogInModal extends Modal {
      *
      * @type {Function}
      */
-    this.identification = m.stream(this.attrs.identification || '');
+    this.identification = Stream(this.attrs.identification || '');
 
     /**
      * The value of the password input.
      *
      * @type {Function}
      */
-    this.password = m.stream(this.attrs.password || '');
+    this.password = Stream(this.attrs.password || '');
 
     /**
      * The value of the remember me input.
      *
      * @type {Function}
      */
-    this.remember = m.stream(!!this.attrs.remember);
+    this.remember = Stream(!!this.attrs.remember);
   }
 
   className() {

js/src/forum/components/RenameDiscussionModal.js

@@ -1,5 +1,6 @@
 import Modal from '../../common/components/Modal';
 import Button from '../../common/components/Button';
+import Stream from '../../common/utils/Stream';
 
 /**
  * The 'RenameDiscussionModal' displays a modal dialog with an input to rename a discussion
@@ -10,7 +11,7 @@ export default class RenameDiscussionModal extends Modal {
 
     this.discussion = this.attrs.discussion;
     this.currentTitle = this.attrs.currentTitle;
-    this.newTitle = m.stream(this.currentTitle);
+    this.newTitle = Stream(this.currentTitle);
   }
 
   className() {

js/src/forum/components/SignUpModal.js

@@ -4,6 +4,7 @@ import Button from '../../common/components/Button';
 import LogInButtons from './LogInButtons';
 import extractText from '../../common/utils/extractText';
 import ItemList from '../../common/utils/ItemList';
+import Stream from '../../common/utils/Stream';
 
 /**
  * The `SignUpModal` component displays a modal dialog with a singup form.
@@ -24,21 +25,21 @@ export default class SignUpModal extends Modal {
      *
      * @type {Function}
      */
-    this.username = m.stream(this.attrs.username || '');
+    this.username = Stream(this.attrs.username || '');
 
     /**
      * The value of the email input.
      *
      * @type {Function}
      */
-    this.email = m.stream(this.attrs.email || '');
+    this.email = Stream(this.attrs.email || '');
 
     /**
      * The value of the password input.
      *
      * @type {Function}
      */
-    this.password = m.stream(this.attrs.password || '');
+    this.password = Stream(this.attrs.password || '');
   }
 
   className() {

js/src/forum/states/ComposerState.js

@@ -1,4 +1,5 @@
 import subclassOf from '../../common/utils/subclassOf';
+import Stream from '../../common/utils/Stream';
 import ReplyComposer from '../components/ReplyComposer';
 
 class ComposerState {
@@ -74,7 +75,7 @@ class ComposerState {
     this.onExit = null;
 
     this.fields = {
-      content: m.stream(''),
+      content: Stream(''),
     };
 
     /**