fix typing indicators showing object

spacebarchat · Sep 8, 2023 · 56c7d2b · 56c7d2b
1 parent f815eb5
commit 56c7d2b
Showing 1 changed file with 10 additions and 11 deletions.
diff --git a/src/components/messaging/TypingStatus.tsx b/src/components/messaging/TypingStatus.tsx
@@ -45,26 +45,25 @@ function TypingStatus({ channel }: Props) {
 		const userCount = typingUsers.length;
 
 		if (userCount === 0) {
-			return "";
+			return null;
 		} else if (userCount === 1) {
 			return (
 				<>
 					<Bold>{typingUsers[0].username}</Bold> is typing...
 				</>
 			);
 		} else if (userCount === 2) {
-			return typingUsers.map((user) => <Bold>{user.username}</Bold>).join(" and ") + " are typing...";
+			return (
+				<>
+					<Bold>{typingUsers[0].username}</Bold> and <Bold>{typingUsers[1].username}</Bold> are typing...{" "}
+				</>
+			);
 		} else if (userCount === 3) {
 			return (
-				typingUsers
-					.slice(0, 2)
-					.map((user) => <Bold>${user.username}</Bold>)
-					.join(", ") +
-				(
-					<>
-						and <Bold>${typingUsers[2].username}</Bold> are typing...
-					</>
-				)
+				<>
+					<Bold>{typingUsers[0].username}</Bold>, <Bold>{typingUsers[1].username}</Bold> and{" "}
+					<Bold>{typingUsers[2].username}</Bold> are typing...{" "}
+				</>
 			);
 		} else {
 			return <>Several people are typing...</>;