From fe9293b8b554ab79636faa61a4756d5ff514a233 Mon Sep 17 00:00:00 2001
From: Blake Erickson <o.blakeerickson@gmail.com>
Date: Wed, 4 Dec 2019 18:11:00 -0700
Subject: [PATCH] DEV: Remove buffered rendering from input tips

This is another refactoring in the multi-step process to remove all uses
of our custom Render Buffer.

Previous commit: 2290ec9e87ab005fcb6666c1448bdbe4e7b92bd6 in this
series.

This commit affects the display of input tips. It is just a refactor and
does not change any functionality.
---
 .../discourse/components/input-tip.js.es6     | 37 ++++++++++++-------
 .../templates/components/input-tip.hbs        |  1 +
 2 files changed, 24 insertions(+), 14 deletions(-)
 create mode 100644 app/assets/javascripts/discourse/templates/components/input-tip.hbs

diff --git a/app/assets/javascripts/discourse/components/input-tip.js.es6 b/app/assets/javascripts/discourse/components/input-tip.js.es6
index 28e73eb0a2b..1a12d8ebc0e 100644
--- a/app/assets/javascripts/discourse/components/input-tip.js.es6
+++ b/app/assets/javascripts/discourse/components/input-tip.js.es6
@@ -1,21 +1,30 @@
 import { alias, not } from "@ember/object/computed";
 import Component from "@ember/component";
-import { bufferedRender } from "discourse-common/lib/buffered-render";
 import { iconHTML } from "discourse-common/lib/icon-library";
 
-export default Component.extend(
-  bufferedRender({
-    classNameBindings: [":tip", "good", "bad"],
-    rerenderTriggers: ["validation"],
+export default Component.extend({
+  classNameBindings: [":tip", "good", "bad"],
+  rerenderTriggers: ["validation"],
+  tipIcon: null,
+  tipReason: null,
 
-    bad: alias("validation.failed"),
-    good: not("bad"),
+  bad: alias("validation.failed"),
+  good: not("bad"),
 
-    buildBuffer(buffer) {
-      const reason = this.get("validation.reason");
-      if (reason) {
-        buffer.push(iconHTML(this.good ? "check" : "times") + " " + reason);
-      }
+  tipIconHTML() {
+    let icon = iconHTML(this.good ? "check" : "times");
+    return `${icon}`.htmlSafe();
+  },
+
+  didReceiveAttrs() {
+    this._super(...arguments);
+    let reason = this.get("validation.reason");
+    if (reason) {
+      this.set("tipIcon", this.tipIconHTML());
+      this.set("tipReason", reason);
+    } else {
+      this.set("tipIcon", null);
+      this.set("tipReason", null);
     }
-  })
-);
+  }
+});
diff --git a/app/assets/javascripts/discourse/templates/components/input-tip.hbs b/app/assets/javascripts/discourse/templates/components/input-tip.hbs
new file mode 100644
index 00000000000..ade54357b51
--- /dev/null
+++ b/app/assets/javascripts/discourse/templates/components/input-tip.hbs
@@ -0,0 +1 @@
+{{tipIcon}} {{tipReason}}