Mithril 2 update (#9)

askvortsov1 · Sep 24, 2020 · d3c7f0a · d3c7f0a
1 parent 48a0a6c
commit d3c7f0a
Show file tree

Hide file tree

Showing 8 changed files with 182 additions and 193 deletions.
diff --git a/composer.json b/composer.json
@@ -7,7 +7,7 @@
   "type": "flarum-extension",
   "license": "MIT",
   "require": {
-    "flarum/core": "^0.1.0-beta.8"
+    "flarum/core": "^0.1.0-beta.14"
   },
   "conflict": {
     "minishlink/web-push": "<5.2.5 || >=6"

diff --git a/js/package-lock.json b/js/package-lock.json
diff --git a/js/src/admin/components/PWALogoUploadButton.js b/js/src/admin/components/PWALogoUploadButton.js
@@ -2,15 +2,12 @@ import Button from "flarum/components/Button";
 import UploadImageButton from "flarum/components/UploadImageButton";
 
 export default class PWALogoUploadButton extends UploadImageButton {
-  view() {
-    this.props.loading = this.loading;
-    this.props.className = (this.props.className || "") + " Button";
+  view(vnode) {
+    vnode.attrs.loading = this.loading;
+    vnode.attrs.className = (this.attrs.className || "") + " Button";
 
-    if (app.data.settings["askvortsov-pwa.icon_" + this.props.name + "_path"]) {
-      this.props.onclick = this.remove.bind(this);
-      this.props.children = app.translator.trans(
-        "core.admin.upload_image.remove_button"
-      );
+    if (app.data.settings["askvortsov-pwa.icon_" + this.attrs.name + "_path"]) {
+      vnode.attrs.onclick = this.remove.bind(this);
 
       return (
         <div>
@@ -20,28 +17,32 @@ export default class PWALogoUploadButton extends UploadImageButton {
                 app.forum.attribute("basePath").trimRight("/") +
                 "/assets/" +
                 app.data.settings[
-                  "askvortsov-pwa.icon_" + this.props.name + "_path"
+                  "askvortsov-pwa.icon_" + this.attrs.name + "_path"
                 ] +
                 "?" +
                 performance.now()
               }
               alt=""
             />
           </p>
-          <p>{Button.prototype.view.call(this)}</p>
+          <p>
+            {Button.prototype.view.call(this, {
+              ...vnode,
+              children: app.translator.trans(
+                "core.admin.upload_image.remove_button"
+              ),
+            })}
+          </p>
         </div>
       );
-    } else {
-      this.props.onclick = this.upload.bind(this);
-      this.props.children = app.translator.trans(
-        "core.admin.upload_image.upload_button"
-      );
     }
 
-    return super.view();
+    vnode.attrs.onclick = this.upload.bind(this);
+
+    return super.view(vnode);
   }
 
   resourceUrl() {
-    return app.forum.attribute("apiUrl") + "/pwa/logo/" + this.props.name;
+    return app.forum.attribute("apiUrl") + "/pwa/logo/" + this.attrs.name;
   }
 }
diff --git a/js/src/admin/components/PWAPage.js b/js/src/admin/components/PWAPage.js
@@ -8,8 +8,8 @@ import saveSettings from "flarum/utils/saveSettings";
 import PWALogoUploadButton from "./PWALogoUploadButton";
 
 export default class PWAPage extends Page {
-  init() {
-    super.init();
+  oninit(vnode) {
+    super.oninit(vnode);
 
     this.saving = false;
     this.refresh();
@@ -27,13 +27,13 @@ export default class PWAPage extends Page {
     this.fields = ["askvortsov-pwa.longName", "askvortsov-pwa.backgroundColor"];
     this.fields.forEach(
       (key) =>
-        (this.values[key] = m.prop(
+        (this.values[key] = m.stream(
           settings[key] !== undefined ? settings[key] : ""
         ))
     );
 
     // if (Array.isArray(settings['askvortsov-pwa.categories'])) {
-    //     this.values['askvortsov-pwa.categories'] = m.prop(settings['askvortsov-pwa.categories'].join(','));
+    //     this.values['askvortsov-pwa.categories'] = m.stream(settings['askvortsov-pwa.categories'].join(','));
     // }
 
     app
@@ -120,11 +120,7 @@ export default class PWAPage extends Page {
                 </div>
                 <input
                   className="FormControl"
-                  value={this.values["askvortsov-pwa.longName"]()}
-                  oninput={m.withAttr(
-                    "value",
-                    this.values["askvortsov-pwa.longName"]
-                  )}
+                  bidi={this.values["askvortsov-pwa.longName"]}
                   required={true}
                 />
               </fieldset>
@@ -142,14 +138,6 @@ export default class PWAPage extends Page {
                   {this.manifest.description}
                 </textarea>
               </fieldset>
-              {/* <fieldset>
-                                <div className="helpText">
-                                    {app.translator.trans('askvortsov-pwa.admin.pwa.about.categories_text')}
-                                </div>
-                                <textarea className="FormControl" value={this.values['askvortsov-pwa.categories']()} oninput={m.withAttr('value', this.values['askvortsov-pwa.categories'])}>
-                                    {this.manifest.description}
-                                </textarea>
-                            </fieldset> */}
             </fieldset>
 
             <fieldset class="parent">
@@ -182,11 +170,7 @@ export default class PWAPage extends Page {
                   className="FormControl"
                   type="text"
                   placeholder="#aaaaaa"
-                  value={this.values["askvortsov-pwa.backgroundColor"]()}
-                  oninput={m.withAttr(
-                    "value",
-                    this.values["askvortsov-pwa.backgroundColor"]
-                  )}
+                  bidi={this.values["askvortsov-pwa.backgroundColor"]}
                   required={true}
                 />
               </fieldset>
@@ -249,11 +233,9 @@ export default class PWAPage extends Page {
 
     saveSettings(settings)
       .then(() => {
-        app.alerts.show(
-          (this.successAlert = new Alert({
-            type: "success",
-            children: app.translator.trans("core.admin.basics.saved_message"),
-          }))
+        this.successAlert = app.alerts.show(
+          { type: "success" },
+          app.translator.trans("core.admin.basics.saved_message")
         );
       })
       .catch(() => {})

diff --git a/js/src/admin/index.js b/js/src/admin/index.js
@@ -5,9 +5,9 @@ import AdminLinkButton from "flarum/components/AdminLinkButton";
 import PWAPage from "./components/PWAPage";
 
 app.initializers.add("askvortsov/flarum-pwa", () => {
-  app.routes.pwa = { path: "/pwa", component: PWAPage.component() };
+  app.routes.pwa = { path: "/pwa", component: PWAPage };
 
-  app.extensionSettings["askvortsov-pwa"] = () => m.route(app.route("pwa"));
+  app.extensionSettings["askvortsov-pwa"] = () => m.route.set(app.route("pwa"));
 
   extend(AdminNav.prototype, "items", (items) => {
     items.add(