From 9c0f832a41b72ee75e16aa60e5cd91676fd6de95 Mon Sep 17 00:00:00 2001
From: Aakansha Doshi <aakansha1216@gmail.com>
Date: Tue, 16 Feb 2021 15:08:27 +0530
Subject: [PATCH] fix: show user state only when passed from host (#3050)

---
 src/packages/excalidraw/CHANGELOG.md |  4 ++++
 src/renderer/renderScene.ts          | 29 ++++++++++++----------------
 2 files changed, 16 insertions(+), 17 deletions(-)

diff --git a/src/packages/excalidraw/CHANGELOG.md b/src/packages/excalidraw/CHANGELOG.md
index 6f000ab39..7a37ae6d7 100644
--- a/src/packages/excalidraw/CHANGELOG.md
+++ b/src/packages/excalidraw/CHANGELOG.md
@@ -20,6 +20,10 @@ Please add the latest change on the top under the correct section.
 
 - Export [`restore`](https://github.com/excalidraw/excalidraw/blob/master/src/data/restore.ts#L182), [`restoreAppState`](https://github.com/excalidraw/excalidraw/blob/master/src/data/restore.ts#L144) and [`restoreElements`](https://github.com/excalidraw/excalidraw/blob/master/src/data/restore.ts#L128) to host
 
+### Fixes
+
+- Show user state only when [userState](https://github.com/excalidraw/excalidraw/blob/master/src/types.ts#L35) is passed on remote pointers during collaboration [#3050](https://github.com/excalidraw/excalidraw/pull/3050)
+
 ## 0.3.1
 
 ## Excalidraw API
diff --git a/src/renderer/renderScene.ts b/src/renderer/renderScene.ts
index f6831bb7f..f3f31bb5f 100644
--- a/src/renderer/renderScene.ts
+++ b/src/renderer/renderScene.ts
@@ -483,25 +483,20 @@ export const renderScene = (
     context.stroke();
 
     const username = sceneState.remotePointerUsernames[clientId];
-    let usernameAndIdleState;
-    if (hasEmojiSupport) {
-      usernameAndIdleState = `${username ? `${username} ` : ""}${
-        userState === UserIdleState.AWAY
-          ? "⚫️"
-          : userState === UserIdleState.IDLE
-          ? "💤"
-          : "🟢"
-      }`;
-    } else {
-      usernameAndIdleState = `${username ? `${username}` : ""}${
-        userState === UserIdleState.AWAY
-          ? ` (${UserIdleState.AWAY})`
-          : userState === UserIdleState.IDLE
-          ? ` (${UserIdleState.IDLE})`
-          : ""
-      }`;
+
+    let idleState = "";
+    if (userState === UserIdleState.AWAY) {
+      idleState = hasEmojiSupport ? "⚫️" : ` (${UserIdleState.AWAY})`;
+    } else if (userState === UserIdleState.IDLE) {
+      idleState = hasEmojiSupport ? "💤" : ` (${UserIdleState.IDLE})`;
+    } else if (userState === UserIdleState.ACTIVE) {
+      idleState = hasEmojiSupport ? "🟢" : "";
     }
 
+    const usernameAndIdleState = `${
+      username ? `${username} ` : ""
+    }${idleState}`;
+
     if (!isOutOfBounds && usernameAndIdleState) {
       const offsetX = x + width;
       const offsetY = y + height;