DEV: add status to the user info component (#17809)

We use the user-info component in several places, and we want to show status on some of them. If you want status to appear, do this:

{{user-info showStatus=true}}

app/assets/javascripts/discourse/app/templates/components/user-info.hbs

@@ -27,6 +27,9 @@
         {{if this.nameFirst (format-username @user.username) @user.name}}
       {{/if}}
     </span>
+    {{#if (and @showStatus @user.status)}}
+      <UserStatusMessage @status={{@user.status}} @showDescription={{true}} @showTooltip={{false}} />
+    {{/if}}
     <PluginOutlet @name="after-user-name" @tagName="span" @connectorTagName="span" @args={{hash user=this.user}} />
   </div>
   <div class="title">{{@user.title}}</div>

app/assets/javascripts/discourse/tests/integration/components/user-info-test.js

@@ -50,4 +50,45 @@ module("Integration | Component | user-info", function (hooks) {
     this.set("includeAvatar", false);
     assert.notOk(exists(".user-image"));
   });
+
+  test("shows status if enabled and user has status", async function (assert) {
+    this.currentUser.name = "Evil Trout";
+    this.currentUser.status = { emoji: "tooth", description: "off to dentist" };
+
+    await render(
+      hbs`<UserInfo @user={{this.currentUser}} @showStatus={{true}} />`
+    );
+
+    assert.ok(exists(".user-status-message"));
+  });
+
+  test("doesn't show status if enabled but user doesn't have status", async function (assert) {
+    this.currentUser.name = "Evil Trout";
+
+    await render(
+      hbs`<UserInfo @user={{this.currentUser}} @showStatus={{true}} />`
+    );
+
+    assert.notOk(exists(".user-status-message"));
+  });
+
+  test("doesn't show status if disabled", async function (assert) {
+    this.currentUser.name = "Evil Trout";
+    this.currentUser.status = { emoji: "tooth", description: "off to dentist" };
+
+    await render(
+      hbs`<UserInfo @user={{this.currentUser}} @showStatus={{false}} />`
+    );
+
+    assert.notOk(exists(".user-status-message"));
+  });
+
+  test("doesn't show status by default", async function (assert) {
+    this.currentUser.name = "Evil Trout";
+    this.currentUser.status = { emoji: "tooth", description: "off to dentist" };
+
+    await render(hbs`<UserInfo @user={{this.currentUser}} />`);
+
+    assert.notOk(exists(".user-status-message"));
+  });
 });