From 25fa375ce0e46c2b28905d5c17f3acf88260536c Mon Sep 17 00:00:00 2001
From: Paul <paulmakles@gmail.com>
Date: Wed, 28 Jul 2021 14:04:27 +0100
Subject: [PATCH] Fix typing indicator.

---
 .../common/messaging/bars/TypingIndicator.tsx      | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/components/common/messaging/bars/TypingIndicator.tsx b/src/components/common/messaging/bars/TypingIndicator.tsx
index 0e19a34d..6cbee0e4 100644
--- a/src/components/common/messaging/bars/TypingIndicator.tsx
+++ b/src/components/common/messaging/bars/TypingIndicator.tsx
@@ -76,15 +76,19 @@ export function TypingIndicator({ typing }: Props) {
         if (users.length >= 5) {
             text = <Text id="app.main.channel.typing.several" />;
         } else if (users.length > 1) {
-            const usersCopy = [...users];
+            const userlist = [...users].map((x) => <Username user={x} />);
+            const user = userlist.pop();
+
+            for (let i = 0; i < userlist.length - 1; i++) {
+                userlist.splice(i * 2 + 1, 0, <>, </>);
+            }
+
             text = (
                 <TextReact
                     id="app.main.channel.typing.multiple"
                     fields={{
-                        user: <Username user={usersCopy.pop()} />,
-                        userlist: usersCopy
-                            .map((x) => <Username user={x} />)
-                            .join(", "),
+                        user,
+                        userlist,
                     }}
                 />
             );