fix(StatusTagSelector): Updates and fixes in the component

Moved `remove` function below remove contact signal
also removed online status badge from CreateChatView

Fixed as well name tags to be adapting on parent's
width and scrolling the list to the end when this is
bigger than the available width. Switcehd to use
nameCountLimit property where needed

ui/StatusQ/sandbox/demoapp/CreateChatView.qml

@@ -170,27 +170,6 @@ Page {
                             font.pixelSize: 15
                         }
 
-                        StatusBadge {
-                            id: statusBadge
-                            width: 15
-                            height: 15
-                            anchors.left: contactImage.right
-                            anchors.leftMargin: -8
-                            anchors.bottom: contactImage.bottom
-                            border.width: 3
-                            border.color: Theme.palette.statusAppNavBar.backgroundColor
-                            color: {
-                                if (model.onlineStatus === 1)
-                                    return Theme.palette.successColor1;
-                                else if (model.onlineStatus === 2)
-                                    return Theme.palette.pinColor1;
-                                else if (model.onlineStatus === 3)
-                                    return Theme.palette.dangerColor1;
-
-                                return "transparent"
-                            }
-                        }
-
                         MouseArea {
                             cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
                             acceptedButtons: Qt.LeftButton | Qt.RightButton

ui/StatusQ/src/StatusQ/Components/StatusTagSelector.qml

@@ -26,10 +26,14 @@ Item {
     function insertTag(name, id) {
         if (!find(namesModel, function(item) { return item.publicId === id }) && namesModel.count < root.nameCountLimit) {
             namesModel.insert(namesModel.count, {"name": name, "publicId": id});
+            addMember(id);
             edit.clear();
         }
     }
 
+    signal addMember(string memberId)
+    signal removeMember(string memberId)
+
     Rectangle {
         anchors.fill: parent
         radius: 8
@@ -47,20 +51,24 @@ Item {
                 text: root.toLabelText
             }
 
+            ScrollView {
+                Layout.fillWidth: true
+                implicitHeight: 30
+                Layout.alignment: Qt.AlignVCenter
+                visible: (namesList.count > 0)
+                contentWidth: namesList.contentWidth
+                ScrollBar.vertical.policy: ScrollBar.AlwaysOff
+                ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
+                clip: true
                 ListView {
                     id: namesList
-                Layout.preferredWidth: (count >= 5) ? (parent.width - warningTextLabel.width - 30) : childrenRect.width
+                    anchors.fill: parent
-                implicitHeight: 30
-                visible: (count > 0)
-                Layout.alignment: Qt.AlignVCenter
                     model: namesModel
                     orientation: ListView.Horizontal
                     spacing: 8
-                clip: true
+                    onContentWidthChanged: {
-                onWidthChanged: {
                         positionViewAtEnd();
                     }
-
                     delegate: Rectangle {
                         id: nameDelegate
                         width: (nameText.contentWidth + 34)
@@ -87,11 +95,13 @@ Item {
                             hoverEnabled: true
                             cursorShape: Qt.PointingHandCursor
                             onClicked: {
+                                removeMember(publicId);
                                 namesModel.remove(index, 1);
                             }
                         }
                     }
                 }
+            }
 
             TextEdit {
                 id: edit
@@ -107,6 +117,7 @@ Item {
                 Keys.onPressed: {
                     if ((event.key === Qt.Key_Backspace || event.key === Qt.Key_Escape)
                             && getText(cursorPosition, (cursorPosition-1)) === "") {
+                        removeMember(namesModel.get(namesList.count-1).publicId);
                         namesModel.remove((namesList.count-1), 1);
                     }
                 }
@@ -114,12 +125,12 @@ Item {
 
             StatusBaseText {
                 id: warningTextLabel
-                visible: (namesModel.count === 5)
+                visible: (namesModel.count === root.nameCountLimit)
                 Layout.preferredWidth: 120
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
                 font.pixelSize: 10
                 color: Theme.palette.dangerColor1
-                text: root.warningText
+                text: root.nameCountLimit + " " + root.warningText
             }
         }
     }