b47b1d8af8
This commit fe9293b8b5 created a regression.
The problem is that dom changed a little bit.
Before it was
```
<tr class="instructions create-account-email">
<td></td>
<div id="account-email-validation" class="tip bad ember-view"></div>
<td><label>Never shown to the public.</label></td>
</tr>
```
And after we got
```
<tr class="instructions create-account-email">
<td></td>
<div id="account-email-validation" class="tip bad ember-view"> </div>
<td><label>Never shown to the public.</label></td>
</tr>
```
That small space may look like not important change.
However, now helpers are hitting that CSS rule:
```
.login-form {
.tip {
&:not(:empty) + td {
display: none;
}
}
```
To fix it, we should render template only if there is a reason - like it was before
```
if (reason) {
buffer.push(iconHTML(this.good ? "check" : "times") + " " + reason);
}
```
* FIX: remove rerenderTriggers
30 lines
742 B
JavaScript
30 lines
742 B
JavaScript
import { alias, not } from "@ember/object/computed";
|
|
import Component from "@ember/component";
|
|
import { iconHTML } from "discourse-common/lib/icon-library";
|
|
|
|
export default Component.extend({
|
|
classNameBindings: [":tip", "good", "bad"],
|
|
tipIcon: null,
|
|
tipReason: null,
|
|
|
|
bad: alias("validation.failed"),
|
|
good: not("bad"),
|
|
|
|
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);
|
|
}
|
|
}
|
|
});
|