Working typing users bar

src/qml/Chat/Chat.qml

@@ -55,7 +55,7 @@ HColumnLayout {
                 Layout.fillHeight: true
             }
 
-            //TypingMembersBar {}
+            TypingMembersBar {}
 
             InviteBanner {
                 visible: category === "Invites"

src/qml/Chat/TypingMembersBar.qml

@@ -1,22 +1,18 @@
 import QtQuick 2.7
 import QtQuick.Layouts 1.3
 import "../Base"
-import "utils.js" as ChatJS
 
 HRectangle {
-    property var typingMembers: chatPage.roomInfo.typingMembers
-
     color: HStyle.chat.typingMembers.background
 
     Layout.fillWidth: true
-    Layout.minimumHeight: usersLabel.text ? usersLabel.implicitHeight : 0
-    Layout.maximumHeight: Layout.minimumHeight
+    Layout.preferredHeight: usersLabel.text ? usersLabel.implicitHeight : 0
 
     HLabel {
         id: usersLabel
         anchors.fill: parent
 
-        text: ChatJS.getTypingMembersText(typingMembers, chatPage.userId)
+        text: chatPage.roomInfo.typingText
         elide: Text.ElideMiddle
         maximumLineCount: 1
     }

src/qml/Chat/utils.js

@@ -39,21 +39,3 @@ function getLeftBannerAvatarName(leftEvent, accountId) {
 
     return Backend.users.get(leftEvent.sender).displayName.value
 }
-
-
-function getTypingMembersText(users, ourAccountId) {
-    var names = []
-
-    for (var i = 0; i < users.length; i++) {
-        if (users[i] !== ourAccountId) {
-            names.push(Backend.users.get(users[i]).displayName.value)
-        }
-    }
-
-    if (names.length < 1) { return "" }
-
-    return "🖋 " +
-           [names.slice(0, -1).join(", "), names.slice(-1)[0]]
-           .join(names.length < 2 ? "" : " and ") +
-           (names.length > 1 ? " are" : " is") + " typing…"
-}