From 4283cef2ed9c058d714aa33b4709e20069d562d9 Mon Sep 17 00:00:00 2001
From: Andrei Prigorshnev <a.prigorshnev@gmail.com>
Date: Fri, 5 Aug 2022 16:54:54 +0400
Subject: [PATCH] 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/templates/components/user-info.hbs    |  3 ++
 .../integration/components/user-info-test.js  | 41 +++++++++++++++++++
 2 files changed, 44 insertions(+)

diff --git a/app/assets/javascripts/discourse/app/templates/components/user-info.hbs b/app/assets/javascripts/discourse/app/templates/components/user-info.hbs
index 86f9aab1eff..98f868a492f 100644
--- a/app/assets/javascripts/discourse/app/templates/components/user-info.hbs
+++ b/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>
diff --git a/app/assets/javascripts/discourse/tests/integration/components/user-info-test.js b/app/assets/javascripts/discourse/tests/integration/components/user-info-test.js
index a204979770d..604481403b9 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/user-info-test.js
+++ b/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"));
+  });
 });