chore(@desktop/general): disable enter and return keys for search pop up

CHANGELOG.md

@@ -1,104 +1,3 @@
-<a name=""></a>
-##  Version 0.22.0 (2022-01-31)
-
-
-#### Features
-
-* **StatusMemberListItem:**  Implement `StatusMemberListItem` (#539) ([c5a605bf](c5a605bf), closes [#515](515))
-
-
-
-<a name=""></a>
-##  Version 0.21.0 (2022-01-24)
-
-
-#### Bug Fixes
-
-* **build:**  broken MacOS build (#533) ([55901cf0](55901cf0))
-
-#### Features
-
-* **StatusMessage:**  Introducing a new StatusQ Component for Chat Messages ([ea955694](ea955694))
-* **StatusQ.Controls:**  Introduce `StatusPasswordStrengthIndicator` ([626695da](626695da), closes [#528](528))
-
-
-
-<a name=""></a>
-##  Version 0.20.0 (2022-01-17)
-
-
-#### Features
-
-* **StatusBanner:**  introduce type variants for different banner styles ([35d12f44](35d12f44))
-
-#### Bug Fixes
-
-* **StatusBaseInput:**  Corrects allignment of the placeholder text in the StatusBaseInput. ([5a416aa1](5a416aa1))
-* **build:**  Windows build ([14ab4ce5](14ab4ce5))
-
-
-
-<a name=""></a>
-##  Version 0.19.0 (2021-12-03)
-
-
-#### Bug Fixes
-
-* **StatusChatListItem:**  This change fixes the issue of the chat list items getting a highlight even when they are not really hovered ([ab6bdf54](ab6bdf54))
-
-#### Features
-
-* **StatusModal:**  introduce `hasCloseButton` property ([2336b6aa](2336b6aa))
-
-
-
-<a name=""></a>
-##  Version 0.18.0 (2021-11-30)
-
-
-#### Bug Fixes
-
-* **StatusAppNavBar:**  Fixed position of profile button on the NavBar ([419b7384](419b7384))
-* **StatusImageWithTitle:**  Fix position of the edit title button ([8d2121ad](8d2121ad))
-* **StatusListItem:**  ensure title is elided ([b7883e82](b7883e82))
-
-#### Features
-
-* **StatusListItem:**  Expose the Aside text so that it can be modified from the outside ([f82ce8b7](f82ce8b7))
-
-
-
-<a name=""></a>
-##  Version 0.17.1 (2021-11-19)
-
-
-#### Bug Fixes
-
-* **StatusAccountSelector:**  Adapt ui to data model changed ([db024436](db024436))
-* **StatusAssetSelector:**  Fixed error of crypto balance not updated correctly ([2040d0f8](2040d0f8))
-
-
-
-<a name=""></a>
-##  Version 0.17.0 (2021-11-10)
-
-
-#### Features
-
-* **StatusBaseButton:**  introduce `Tiny` size ([dee9f437](dee9f437))
-* **StatusQ.Controls.Validators:**  introduce `StatusUrlValidator` ([a9155865](a9155865))
-
-#### Bug Fixes
-
-* **StatusAccountSelector:**  adapt AccountSelector to new model (#482) ([ce8d3231](ce8d3231))
-* **StatusExpandibleItem:**  add missing hover indicator in `Secondary` type ([e23dc533](e23dc533), closes [#478](478))
-* **StatusInput:**  ensure validator messages are rendered when validators return boolean values ([f82cd7f5](f82cd7f5))
-* **StatusListItem:**  This solves the issue of channel list overlpaing when a category is collapsed. ([0c715b17](0c715b17))
-* **StatusSearchPopup:**  disable enter and return keys to avoid UI breakage ([fecfb2a7](fecfb2a7))
-* **StatusSlider:**  slider background and handle should not depend on root's height ([31cfc883](31cfc883))
-
-
-
 <a name=""></a>
 ##  Version 0.16.0 (2021-11-01)
 

sandbox/Controls.qml

@@ -188,19 +188,4 @@ GridLayout {
         to: 100
         value: 40
     }
-
-    StatusBanner {
-        id: banner
-        width: 360
-        topPadding: 20
-        type: StatusBanner.Type.Danger
-        statusText: "Banner"
-    }
-
-    StatusProgressBar {
-        id: progressBar        
-        text: "Weak"
-        value: 0.5
-        fillColor : Theme.palette.pinColor1
-    }
 }

sandbox/DemoApp.qml

@@ -1,13 +1,14 @@
 import QtQuick 2.14
+import QtQuick.Controls 2.14
 
+import StatusQ.Core 0.1
 import StatusQ.Core.Theme 0.1
 import StatusQ.Controls 0.1
+import StatusQ.Components 0.1
 import StatusQ.Layout 0.1
 import StatusQ.Popups 0.1
 import StatusQ.Platform 0.1
 
-import "demoapp"
-
 Rectangle {
     id: demoApp
     height: 602
@@ -136,7 +137,6 @@ Rectangle {
                     }
                 }
             ]
-
         }
 
         appView: Loader {
@@ -148,31 +148,735 @@ Rectangle {
 
     Component {
         id: statusAppChatView
-        StatusAppChatView { }
+
+        StatusAppTwoPanelLayout {
+
+            leftPanel: Item {
+                anchors.fill: parent
+
+                StatusNavigationPanelHeadline {
+                    id: headline
+                    anchors.top: parent.top
+                    anchors.topMargin: 16
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    text: "Chat"
+                }
+
+                Item {
+                    id: searchInputWrapper
+                    anchors.top: headline.bottom
+                    anchors.topMargin: 16
+                    width: parent.width
+                    height: searchInput.height
+
+                    StatusBaseInput {
+                        id: searchInput
+
+                        anchors.verticalCenter: parent.verticalCenter
+                        anchors.left: parent.left
+                        anchors.right: actionButton.left
+                        anchors.leftMargin: 16
+                        anchors.rightMargin: 16
+
+                        height: 36
+                        topPadding: 8
+                        bottomPadding: 0
+                        placeholderText: "Search"
+                        icon.name: "search"
+                    }
+
+                    StatusRoundButton {
+                        id: actionButton
+                        anchors.verticalCenter: parent.verticalCenter
+                        anchors.right: parent.right
+                        anchors.rightMargin: 8
+                        width: 32
+                        height: 32
+
+                        type: StatusRoundButton.Type.Secondary
+                        icon.name: "add"
+                        state: "default"
+
+                        onClicked: chatContextMenu.popup(actionButton.width-chatContextMenu.width, actionButton.height + 4)
+                        states: [
+                            State {
+                                name: "default"
+                                PropertyChanges {
+                                    target: actionButton
+                                    icon.rotation: 0
+                                    highlighted: false
+                                }
+                            },
+                            State {
+                                name: "pressed"
+                                PropertyChanges {
+                                    target: actionButton
+                                    icon.rotation: 45
+                                    highlighted: true
+                                }
+                            }
+                        ]
+
+                        transitions: [
+                            Transition {
+                                from: "default"
+                                to: "pressed"
+
+                                RotationAnimation {
+                                    duration: 150
+                                    direction: RotationAnimation.Clockwise
+                                    easing.type: Easing.InCubic
+                                }
+                            },
+                            Transition {
+                                from: "pressed"
+                                to: "default"
+                                RotationAnimation {
+                                    duration: 150
+                                    direction: RotationAnimation.Counterclockwise
+                                    easing.type: Easing.OutCubic
+                                }
+                            }
+                        ]
+
+                        StatusPopupMenu {
+                            id: chatContextMenu
+
+                            onOpened: {
+                                actionButton.state = "pressed"
+                            }
+
+                            onClosed: {
+                                actionButton.state = "default"
+                            }
+
+                            StatusMenuItem {
+                                text: "Start new chat"
+                                icon.name: "private-chat"
+                            }
+
+                            StatusMenuItem {
+                                text: "Start group chat"
+                                icon.name: "group-chat"
+                            }
+
+                            StatusMenuItem {
+                                text: "Join public chat"
+                                icon.name: "public-chat"
+                            }
+
+                            StatusMenuItem {
+                                text: "Communities"
+                                icon.name: "communities"
+                            }
+                        }
+                    }
+                }
+
+                Column {
+                    anchors.top: searchInputWrapper.bottom
+                    anchors.topMargin: 16
+                    width: parent.width
+                    spacing: 8
+
+                    StatusContactRequestsIndicatorListItem {
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        title: "Contact requests"
+                        requestsCount: 3
+                        sensor.onClicked: demoContactRequestsModal.open()
+                    }
+
+                    StatusChatList {
+                        anchors.horizontalCenter: parent.horizontalCenter
+
+                        chatListItems.model: models.demoChatListItems
+                        selectedChatId: "0"
+                        onChatItemSelected: selectedChatId = id
+                        onChatItemUnmuted: {
+                            for (var i = 0; i < models.demoChatListItems.count; i++) {
+                                let item = models.demoChatListItems.get(i);
+                                if (item.chatId === id) {
+                                    models.demoChatListItems.setProperty(i, "muted", false)
+                                }
+                            }
+                        }
+
+                        popupMenu: StatusPopupMenu {
+
+                            property string chatId
+
+                            openHandler: function (id) {
+                                chatId = id
+                            }
+
+                            StatusMenuItem {
+                                text: "View Profile"
+                                icon.name: "group-chat"
+                            }
+
+                            StatusMenuSeparator {}
+
+                            StatusMenuItem {
+                                text: "Mute chat"
+                                icon.name: "notification"
+                            }
+
+                            StatusMenuItem {
+                                text: "Mark as Read"
+                                icon.name: "checkmark-circle"
+                            }
+
+                            StatusMenuItem {
+                                text: "Clear history"
+                                icon.name: "close-circle"
+                            }
+
+                            StatusMenuSeparator {}
+
+                            StatusMenuItem {
+                                text: "Delete chat"
+                                icon.name: "delete"
+                                type: StatusMenuItem.Type.Danger
+                            }
+                        }
+                    }
+                }
+            }
+
+            rightPanel: Item {
+                anchors.fill: parent
+
+                StatusChatToolBar {
+                    anchors.top: parent.top
+                    width: parent.width
+
+                    chatInfoButton.title: "Amazing Funny Squirrel"
+                    chatInfoButton.subTitle: "Contact"
+                    chatInfoButton.icon.color: Theme.palette.miscColor7
+                    chatInfoButton.type: StatusChatInfoButton.Type.OneToOneChat
+                    chatInfoButton.pinnedMessagesCount: 1
+
+                    searchButton.visible: false
+                    membersButton.visible: false
+                    notificationCount: 1
+
+                    onNotificationButtonClicked: notificationCount = 0
+
+                    popupMenu: StatusPopupMenu {
+                        id: contextMenu
+
+                        StatusMenuItem {
+                            text: "Mute Chat"
+                            icon.name: "notification"
+                        }
+                        StatusMenuItem {
+                            text: "Mark as Read"
+                            icon.name: "checkmark-circle"
+                        }
+                        StatusMenuItem {
+                            text: "Clear History"
+                            icon.name: "close-circle"
+                        }
+
+                        StatusMenuSeparator {}
+
+                        StatusMenuItem {
+                            text: "Leave Chat"
+                            icon.name: "arrow-right"
+                            icon.width: 14
+                            iconRotation: 180
+                            type: StatusMenuItem.Type.Danger
+                        }
+                    }
+                }
+            }
+        }
     }
 
     Component {
         id: statusAppCommunityView
-        StatusAppCommunityView {
-            communityDetailModalTitle: demoCommunityDetailModal.header.title
-            communityDetailModalImage: demoCommunityDetailModal.header.image.source
-            onChatInfoButtonClicked: {
-                demoCommunityDetailModal.open();
+
+        StatusAppThreePanelLayout {
+            id: root
+
+            handle: Rectangle {
+                implicitWidth: 5
+                color: SplitHandle.pressed ? Theme.palette.baseColor2
+                                           : (SplitHandle.hovered ? Qt.darker(Theme.palette.baseColor5, 1.1) : "transparent")
+            }
+            leftPanel: Item {
+                id: leftPanel
+
+                StatusChatInfoToolBar {
+                    id: statusChatInfoToolBar
+
+                    anchors.top: parent.top
+                    anchors.horizontalCenter: parent.horizontalCenter
+
+                    chatInfoButton.title: "CryptoKitties"
+                    chatInfoButton.subTitle: "128 Members"
+                    chatInfoButton.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
+                    chatInfoButton.icon.color: Theme.palette.miscColor6
+                    chatInfoButton.onClicked: demoCommunityDetailModal.open()
+
+                    popupMenu: StatusPopupMenu {
+
+                        StatusMenuItem {
+                            text: "Create channel"
+                            icon.name: "channel"
+                        }
+
+                        StatusMenuItem {
+                            text: "Create category"
+                            icon.name: "channel-category"
+                        }
+
+                        StatusMenuSeparator {}
+
+                        StatusMenuItem {
+                            text: "Invite people"
+                            icon.name: "share-ios"
+                        }
+
+                    }
+                }
+
+                ScrollView {
+                    id: scrollView
+
+                    anchors.top: statusChatInfoToolBar.bottom
+                    anchors.topMargin: 8
+                    anchors.bottom: parent.bottom
+                    width: leftPanel.width
+
+                    contentHeight: communityCategories.height
+                    clip: true
+
+                    StatusChatListAndCategories {
+                        id: communityCategories
+                        width: leftPanel.width
+                        height: implicitHeight > (leftPanel.height - 64) ? implicitHeight + 8 : leftPanel.height - 64
+
+                        draggableItems: true
+                        draggableCategories: false
+                        chatList.model: models.demoCommunityChatListItems
+                        categoryList.model: models.demoCommunityCategoryItems
+
+                        showCategoryActionButtons: true
+                        onChatItemSelected: selectedChatId = id
+
+                        categoryPopupMenu: StatusPopupMenu {
+
+                            property string categoryId
+
+                            openHandler: function (id) {
+                                categoryId = id
+                            }
+
+                            StatusMenuItem {
+                                text: "Mute Category"
+                                icon.name: "notification"
+                            }
+
+                            StatusMenuItem {
+                                text: "Mark as Read"
+                                icon.name: "checkmark-circle"
+                            }
+
+                            StatusMenuItem {
+                                text: "Edit Category"
+                                icon.name: "edit"
+                            }
+
+                            StatusMenuSeparator {}
+
+                            StatusMenuItem {
+                                text: "Delete Category"
+                                icon.name: "delete"
+                                type: StatusMenuItem.Type.Danger
+                            }
+                        }
+
+                        chatListPopupMenu: StatusPopupMenu {
+
+                            property string chatId
+
+                            StatusMenuItem {
+                                text: "Mute chat"
+                                icon.name: "notification"
+                            }
+
+                            StatusMenuItem {
+                                text: "Mark as Read"
+                                icon.name: "checkmark-circle"
+                            }
+
+                            StatusMenuItem {
+                                text: "Clear history"
+                                icon.name: "close-circle"
+                            }
+
+                            StatusMenuSeparator {}
+
+                            StatusMenuItem {
+                                text: "Delete chat"
+                                icon.name: "delete"
+                                type: StatusMenuItem.Type.Danger
+                            }
+                        }
+
+                        popupMenu: StatusPopupMenu {
+                            StatusMenuItem {
+                                text: "Create channel"
+                                icon.name: "channel"
+                            }
+
+                            StatusMenuItem {
+                                text: "Create category"
+                                icon.name: "channel-category"
+                            }
+
+                            StatusMenuSeparator {}
+
+                            StatusMenuItem {
+                                text: "Invite people"
+                                icon.name: "share-ios"
+                            }
+                        }
+                    }
+                }
+            }
+
+            centerPanel: Item {
+                StatusChatToolBar {
+                    id: statusChatToolBar
+                    anchors.top: parent.top
+                    width: parent.width
+
+                    chatInfoButton.title: "general"
+                    chatInfoButton.subTitle: "Community Chat"
+                    chatInfoButton.icon.color: Theme.palette.miscColor6
+                    chatInfoButton.type: StatusChatInfoButton.Type.CommunityChat
+                    onSearchButtonClicked: {
+                        searchButton.highlighted = !searchButton.highlighted;
+                        searchPopup.setSearchSelection(demoCommunityDetailModal.header.title,
+                                                       "",
+                                                       demoCommunityDetailModal.header.image.source);
+                        searchPopup.open();
+                    }
+                    membersButton.onClicked: membersButton.highlighted = !membersButton.highlighted
+                    onMembersButtonClicked: {
+                        root.showRightPanel = !root.showRightPanel;
+                    }
+                }
+
+                StatusSearchPopup {
+                    id: searchPopup
+                    searchOptionsPopupMenu: searchPopupMenu
+                    onAboutToHide: {
+                        if (searchPopupMenu.visible) {
+                            searchPopupMenu.close();
+                        }
+                        //clear menu
+                        for (var i = 2; i < searchPopupMenu.count; i++) {
+                            searchPopupMenu.removeItem(searchPopupMenu.takeItem(i));
+                        }
+                    }
+                    onClosed: {
+                        statusChatToolBar.searchButton.highlighted = false
+                        searchPopupMenu.dismiss();
+                    }
+                    onSearchTextChanged: {
+                        if (searchPopup.searchText !== "") {
+                            searchPopup.loading = true;
+                            searchModelSimTimer.start();
+                        } else {
+                            searchPopup.searchResults = [];
+                            searchModelSimTimer.stop();
+                        }
+                    }
+                    Timer {
+                        id: searchModelSimTimer
+                        interval: 500
+                        onTriggered: {
+                            if (searchPopup.searchText.startsWith("c")) {
+                                searchPopup.searchResults = models.searchResultsA;
+                            } else {
+                                searchPopup.searchResults = models.searchResultsB;
+                            }
+                            searchPopup.loading = false;
+                        }
+                    }
+                }
+                StatusSearchLocationMenu {
+                    id: searchPopupMenu
+                    searchPopup: searchPopup
+                    locationModel: models.optionsModel
+                }
+            }
+
+            rightPanel: Item {
+                id: rightPanel
+                StatusBaseText {
+                    id: titleText
+                    anchors.top: parent.top
+                    anchors.topMargin:16
+                    anchors.left: parent.left
+                    anchors.leftMargin: 16
+                    opacity: (rightPanel.width > 50) ? 1.0 : 0.0
+                    visible: (opacity > 0.1)
+                    font.pixelSize: 15
+                    text: qsTr("Members")
+                }
+
+                ListView {
+                    anchors.top: titleText.bottom
+                    anchors.topMargin: 16
+                    anchors.left: parent.left
+                    anchors.leftMargin: 8
+                    anchors.right: parent.right
+                    anchors.rightMargin: 8
+                    anchors.bottom: parent.bottom
+                    anchors.bottomMargin: 16
+                    boundsBehavior: Flickable.StopAtBounds
+                    model: ["John", "Nick", "Maria", "Mike"]
+                    delegate: Row {
+                        width: parent.width
+                        height: 30
+                        spacing: 8
+                        Rectangle {
+                            width: 24
+                            height: 24
+                            radius: width/2
+                            color: Qt.rgba(Math.random(), Math.random(), Math.random(), 255)
+                        }
+                        StatusBaseText {
+                            height: parent.height
+                            horizontalAlignment: Text.AlignHCenter
+                            opacity: (rightPanel.width > 50) ? 1.0 : 0.0
+                            visible: (opacity > 0.1)
+                            font.pixelSize: 15
+                            color: Theme.palette.directColor1
+                            text: modelData
+                        }
+                    }
+                }
             }
         }
     }
 
     Component {
         id: statusAppProfileSettingsView
-        StatusAppProfileSettingsView { }
+
+        StatusAppTwoPanelLayout {
+
+            leftPanel: Item {
+                anchors.fill: parent
+
+                StatusNavigationPanelHeadline {
+                    id: profileHeadline
+                    anchors.top: parent.top
+                    anchors.topMargin: 16
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    text: "Profile"
+                }
+
+                ScrollView {
+                    anchors.top: profileHeadline.bottom
+                    anchors.topMargin: 16
+                    anchors.bottom: parent.bottom
+                    width: parent.width
+
+                    contentHeight: profileMenuItems.height + 8
+                    contentWidth: parent.width
+                    clip: true
+
+                    Column {
+                        id: profileMenuItems
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        spacing: 4
+
+                        Repeater {
+                            model: models.demoProfileGeneralMenuItems
+                            delegate: StatusNavigationListItem {
+                                title: model.title
+                                icon.name: model.icon
+                            }
+                        }
+
+                        StatusListSectionHeadline { text: "Settings" }
+
+                        Repeater {
+                            model: models.demoProfileSettingsMenuItems
+                            delegate: StatusNavigationListItem {
+                                title: model.title
+                                icon.name: model.icon
+                            }
+                        }
+
+                        Item {
+                            id: invisibleSeparator
+                            height: 16
+                            width: parent.width
+                        }
+
+                        Repeater {
+                            model: models.demoProfileOtherMenuItems
+                            delegate: StatusNavigationListItem {
+                                title: model.title
+                                icon.name: model.icon
+                            }
+                        }
+                    }
+                }
+            }
+
+            rightPanel: Item {
+                anchors.fill: parent
+            }
+        }
     }
 
-    DemoContactRequestsModal {
+    StatusModal {
         id: demoContactRequestsModal
         anchors.centerIn: parent
+
+        header.title: "Contact Requests"
+        headerActionButton: StatusFlatRoundButton {
+            type: StatusFlatRoundButton.Type.Secondary
+            width: 32
+            height: 32
+
+            icon.width: 20
+            icon.height: 20
+            icon.name: "notification"
+        }
+
+        contentItem: StatusBaseText {
+            anchors.centerIn: parent
+            text: "Contact request will be shown here"
+            font.pixelSize: 15
+            color: Theme.palette.directColor1
+        }
+
+        rightButtons: [
+            StatusButton {
+                text: "Decline all"
+                type: StatusBaseButton.Type.Danger
+                onClicked: demoContactRequestsModal.close()
+            },
+            StatusButton {
+                text: "Accept all"
+                onClicked: demoContactRequestsModal.close()
+            }
+        ]
     }
 
-    DemoCommunityDetailModal {
+    StatusModal {
         id: demoCommunityDetailModal
+
+        anchors.centerIn: parent
+
+        header.title: "Cryptokitties"
+        header.subTitle: "Public Community"
+        header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
+
+        contentItem: Column {
+            width: demoCommunityDetailModal.width
+
+            StatusModalDivider {
+                bottomPadding: 8
+            }
+
+            StatusBaseText {
+                text: "A community of cat lovers, meow!"
+                verticalAlignment: Text.AlignVCenter
+                font.pixelSize: 15
+                height: 46
+                color: Theme.palette.directColor1
+                anchors.left: parent.left
+                anchors.right: parent.right
+                anchors.leftMargin: 16
+                anchors.rightMargin: 16
+            }
+
+            StatusModalDivider {
+                topPadding: 8
+                bottomPadding: 8
+            }
+
+            StatusDescriptionListItem {
+                title: "Share community"
+                subTitle: "https://join.status.im/u/0x04...45f19"
+                tooltip.text: "Copy to clipboard"
+                icon.name: "copy"
+                iconButton.onClicked: tooltip.visible = !tooltip.visible
+                width: parent.width
+            }
+
+            StatusModalDivider {
+                topPadding: 8
+                bottomPadding: 8
+            }
+
+            StatusListItem {
+                anchors.horizontalCenter: parent.horizontalCenter
+                statusListItemTitle.font.pixelSize: 17
+                title: "Members"
+                icon.name: "group-chat"
+                label: "184"
+                components: [
+                    StatusIcon {
+                        icon: "chevron-down"
+                        rotation: 270
+                        color: Theme.palette.baseColor1
+                    }
+                ]
+            }
+
+            StatusListItem {
+                anchors.horizontalCenter: parent.horizontalCenter
+                statusListItemTitle.font.pixelSize: 17
+                title: "Notifications"
+                icon.name: "notification"
+                components: [
+                    StatusSwitch {}
+                ]
+            }
+
+            StatusModalDivider {
+                topPadding: 8
+                bottomPadding: 8
+            }
+
+            StatusListItem {
+                anchors.horizontalCenter: parent.horizontalCenter
+                statusListItemTitle.font.pixelSize: 17
+                title: "Edit community"
+                icon.name: "edit"
+                type: StatusListItem.Type.Secondary
+            }
+
+            StatusListItem {
+                anchors.horizontalCenter: parent.horizontalCenter
+                statusListItemTitle.font.pixelSize: 17
+                title: "Transfer ownership"
+                icon.name: "exchange"
+                type: StatusListItem.Type.Secondary
+            }
+
+            StatusListItem {
+                anchors.horizontalCenter: parent.horizontalCenter
+                statusListItemTitle.font.pixelSize: 17
+                title: "Leave community"
+                icon.name: "arrow-right"
+                icon.rotation: 180
+                type: StatusListItem.Type.Secondary
+            }
+        }
+    }
+
+    Models {
+        id: models
     }
 }

sandbox/ListItems.qml

@@ -345,38 +345,4 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
         title: "Contact requests"
         requestsCount: 3
     }
-
-    StatusMemberListItem {
-        nickName: "This is an example"
-        userName: "annabelle"
-        chatKey: "0x043a7ed0e8752236a4688563652fd0296453cef00a5dcddbe252dc74f72cc1caa97a2b65e4a1a52d9c30a84c9966beaaaf6b333d659cbdd2e486b443ed1012cf04"
-        trustIndicator: StatusMemberListItem.TrustedType.Verified
-        isMutualContact: true
-        image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/
-                      nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
-        image.isIdenticon: true
-        isOnline: true
-    }
-
-    StatusMemberListItem {
-        nickName: "carmen.eth"
-        isOnline: false
-        trustIndicator: StatusMemberListItem.TrustedType.Untrustworthy
-    }
-
-    StatusMemberListItem {
-        nickName: "This girl I know from work"
-        userName: "annabelle"
-        isOnline: true        
-    }
-
-    StatusMemberListItem {
-        nickName: "Mark Cuban"
-        userName: "annabelle"
-        chatKey: "0x043a7ed0e8752236a4688563652fd0296453cef00a5dcddbe252dc74f72cc1caa97a2b65e4a1a52d9c30a84c9966beaaaf6b333d659cbdd2e486b443ed1012cf04"
-        isMutualContact: true
-        image.source: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/
-                       nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
-        image.isIdenticon: true
-    }
 }

sandbox/Models.qml

@@ -0,0 +1,336 @@
+import QtQuick 2.14
+import StatusQ.Components 0.1
+
+QtObject {
+
+    property var demoChatListItems: ListModel {
+        id: demoChatListItems
+        ListElement {
+            chatId: "0"
+            name: "#status"
+            chatType: StatusChatListItem.Type.PublicChat
+            muted: false
+            unreadMessagesCount: 0
+            mentionsCount: 0
+            color: "blue"
+            position: 0
+        }
+        ListElement {
+            chatId: "1"
+            name: "status-desktop"
+            chatType: StatusChatListItem.Type.PublicChat
+            muted: false
+            color: "red"
+            unreadMessagesCount: 1
+            mentionsCount: 1
+            position: 1
+        }
+        ListElement {
+            chatId: "2"
+            name: "Amazing Funny Squirrel"
+            chatType: StatusChatListItem.Type.OneToOneChat
+            muted: false
+            color: "green"
+            identicon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0Bh
+CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
+            unreadMessagesCount: 0
+            position: 2
+        }
+        ListElement {
+            chatId: "3"
+            name: "Black Ops"
+            chatType: StatusChatListItem.Type.GroupChat
+            muted: false
+            color: "purple"
+            unreadMessagesCount: 0
+            position: 3
+        }
+        ListElement {
+            chatId: "4"
+            name: "Spectacular Growing Otter"
+            chatType: StatusChatListItem.Type.OneToOneChat
+            muted: true
+            color: "Orange"
+            unreadMessagesCount: 0
+            position: 4
+        }
+        ListElement {
+            chatId: "5"
+            name: "channel-with-a-super-duper-long-name"
+            chatType: StatusChatListItem.Type.PublicChat
+            muted: false
+            color: "green"
+            unreadMessagesCount: 0
+            position: 5
+        }
+    }
+
+    property var demoCommunityChatListItems: ListModel {
+        id: demoCommunityChatListItems
+        ListElement {
+            chatId: "0"
+            name: "general"
+            chatType: StatusChatListItem.Type.CommunityChat
+            muted: false
+            unreadMessagesCount: 0
+            color: "orange"
+            position: 0
+        }
+        ListElement {
+            chatId: "1"
+            name: "random"
+            chatType: StatusChatListItem.Type.CommunityChat
+            muted: false
+            unreadMessagesCount: 0
+            color: "orange"
+            categoryId: "public"
+            position: 0
+        }
+        ListElement {
+            chatId: "2"
+            name: "watercooler"
+            chatType: StatusChatListItem.Type.CommunityChat
+            muted: false
+            unreadMessagesCount: 0
+            color: "orange"
+            categoryId: "public"
+            position: 1
+        }
+        ListElement {
+            chatId: "3"
+            name: "language-design"
+            chatType: StatusChatListItem.Type.CommunityChat
+            muted: false
+            unreadMessagesCount: 0
+            color: "orange"
+            categoryId: "dev"
+            position: 0
+        }
+    }
+
+    property var demoCommunityCategoryItems: ListModel {
+        id: demoCommunityCategoryItems
+        ListElement {
+            categoryId: "public"
+            name: "Public"
+            position: 0
+        }
+        ListElement {
+            categoryId: "dev"
+            name: "Development"
+            position: 1
+        }
+    }
+
+    property var demoProfileGeneralMenuItems: ListModel {
+        id: demoProfileGeneralMenuItems
+
+        ListElement {
+            title: "My Profile"
+            icon: "profile"
+        }
+
+        ListElement {
+            title: "Contacts"
+            icon: "contact"
+        }
+
+        ListElement {
+            title: "ENS Usernames"
+            icon: "username"
+        }
+
+    }
+
+    property var demoProfileSettingsMenuItems: ListModel {
+        id: demoProfileSettingsMenuItems
+
+        ListElement {
+            title: "Privacy & Security"
+            icon: "security"
+        }
+
+        ListElement {
+            title: "Appearance"
+            icon: "appearance"
+        }
+
+        ListElement {
+            title: "Browser"
+            icon: "browser"
+        }
+
+        ListElement {
+            title: "Sounds"
+            icon: "sound"
+        }
+
+        ListElement {
+            title: "Language"
+            icon: "language"
+        }
+
+        ListElement {
+            title: "Notifications"
+            icon: "notification"
+        }
+
+        ListElement {
+            title: "Sync settings"
+            icon: "mobile"
+        }
+
+        ListElement {
+            title: "Advanced"
+            icon: "settings"
+        }
+
+    }
+
+    property var demoProfileOtherMenuItems: ListModel {
+        id: demoProfileOtherMenuItems
+
+        ListElement {
+            title: "Need help?"
+            icon: "help"
+        }
+
+        ListElement {
+            title: "About"
+            icon: "info"
+        }
+
+        ListElement {
+            title: "Sign out & Quit"
+            icon: "logout"
+        }
+    }
+
+    //dummy search popup models
+    property var searchResultsA: ListModel {
+        ListElement { itemId: "i1"; titleId: "t1"; title: "@Flea"; sectionName: "Messages"; time: "18:55 AM"; content: "lorem ipsum <font color='#4360DF'>@Nick</font> dolor sit amet";
+            image: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg";
+            color: "orange";
+            badgeImage: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg";
+            badgePrimaryText: "CryptoKities";
+            badgeSecondaryText: "";
+            badgeIconColor: "";
+            badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i2"; titleId: "t2"; image: ""; color: "blue"; title: "core"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i3"; titleId: "t3"; image: ""; color: "yellow"; title: "communities-phase3"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i4"; titleId: "t4"; image: ""; color: "black"; title: "core-ui"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i5"; titleId: "t5"; image: ""; color: "green"; title: "desktop"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i6"; titleId: "t6"; image: ""; color: "red"; title: "Crocodile Vanilla Bird"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i7"; titleId: "t7"; image: ""; color: "purple"; title: "carmen eth"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i8"; titleId: "t8"; image: ""; color: "red"; title: "CryptoKitties"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i9"; titleId: "t9"; image: ""; color: "blue"; title: "MyCommunity"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i10"; titleId: "t10"; image: ""; color: "green"; title: "Foo"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+    }
+    property var searchResultsB: ListModel {
+        ListElement { itemId: "i1"; titleId: "t1"; title: "@Ant"; sectionName: "Messages"; time: "11:43 AM"; content: "<font color='#4360DF'>@John</font>, lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum ";
+            image: "";
+            color: "orange";
+            badgeImage: "";
+            badgePrimaryText: "CryptoKities";
+            badgeSecondaryText: "#design";
+            badgeIconColor: "pink"; badgeIsLetterIdenticon: true }
+        ListElement { itemId: "i2"; titleId: "t2"; image: ""; color: "blue"; title: "support"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i3"; titleId: "t3"; image: ""; color: "red"; title: "desktop-ui"; sectionName: "Channels"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i4"; titleId: "t4"; image: ""; color: "orange"; title: "climate-change"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i5"; titleId: "t5"; image: ""; color: "black"; title: "food"; sectionName: "Chat"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: "pink"; badgeIsLetterIdenticon: true }
+        ListElement { itemId: "i6"; titleId: "t6"; image: ""; color: "green"; title: "CryptoKitties"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i7"; titleId: "t7"; image: ""; color: "purple"; title: "CryptoRangers"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: ""; badgeIsLetterIdenticon: false }
+        ListElement { itemId: "i8"; titleId: "t8"; image: ""; color: "yellow"; title: "Foo"; sectionName: "Communities"; time: ""; content: ""; badgeImage: ""; badgePrimaryText: ""; badgeSecondaryText: ""; badgeIconColor: "orange"; badgeIsLetterIdenticon: true }
+    }
+
+    property ListModel optionsModel: ListModel {
+        ListElement {
+            value: "item_1"
+            title: "Item with icon"
+            imageSource: ""
+            iconName: "chat"
+            iconColor: ""
+            isIdenticon: false
+            subItems: [
+                ListElement {
+                    value: "sub_item_1_1"
+                    text: "Profile image item"
+                    imageSource: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
+                    iconName: ""
+                    iconColor: ""
+                    isIdenticon: false
+                },
+                ListElement {
+                    value: "sub_item_1_2"
+                    text: "identicon item"
+                    imageSource: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
+                    iconName: ""
+                    iconColor: ""
+                    isIdenticon: true
+                }]}
+        ListElement {
+            value: "item_2"
+            title: "Community item";
+            imageSource: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
+            iconName: ""
+            iconColor: ""
+            isIdenticon: false
+            subItems: [
+                ListElement {
+                    value: "sub_item_2_1"
+                    text: "welcome"
+                    imageSource: ""
+                    iconName: "channel"
+                    iconColor: ""
+                    isIdenticon: false
+                },
+                ListElement {
+                    value: "sub_item_2_2"
+                    text: "support"
+                    imageSource: ""
+                    iconName: "channel"
+                    iconColor: ""
+                    isIdenticon: false
+                },
+                ListElement {
+                    value: "sub_item_2_3"
+                    text: "news"
+                    imageSource: ""
+                    iconName: "channel"
+                    iconColor: ""
+                    isIdenticon: false
+                }]}
+        ListElement {
+            value: "item_3"
+            title: "Other";
+            imageSource: "";
+            iconName: "info"
+            iconColor: ""
+            isIdenticon: false
+            subItems: [
+                ListElement {
+                    value: "sub_item_3_1"
+                    text: "news"
+                    imageSource: ""
+                    iconName: "channel"
+                    iconColor: ""
+                    isIdenticon: false
+                }]}
+        ListElement {
+            value: "item_4"
+            title: "Letter identicon";
+            imageSource: "";
+            iconName: ""
+            iconColor: "red"
+            isIdenticon: false
+            subItems: [
+                ListElement {
+                    value: "sub_item_4_1"
+                    text: "news"
+                    imageSource: ""
+                    iconName: "channel"
+                    iconColor: ""
+                    isIdenticon: false
+                }]}
+    }
+}

sandbox/Popups.qml

@@ -73,11 +73,6 @@ Column {
         onClicked: spellMenu.open()
     }
 
-    StatusButton {
-        text: "Modal with Editable Title"
-        onClicked: editTitleModal.open()
-    }
-
     StatusModal {
         id: simpleModal
         anchors.centerIn: parent
@@ -346,13 +341,6 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
         }
     }
 
-    StatusModal {
-        id: editTitleModal
-        anchors.centerIn: parent
-        header.title: "This title can be edited"
-        header.editable: true
-    }
-
     ListModel {
         id: dummyAccountsModel
         ListElement{name: "Account 1"; iconName: "filled-account"}

sandbox/StatusAccountSelectorPage.qml

@@ -2,62 +2,53 @@ import QtQuick 2.14
 import QtQuick.Controls 2.14
 import QtQuick.Layouts 1.14
 
-import Sandbox 0.1
 import StatusQ.Core 0.1
 import StatusQ.Core.Theme 0.1
 import StatusQ.Controls 0.1
 import StatusQ.Popups 0.1
 
+import Sandbox 0.1
 
 Column {
     spacing: 8
 
     StatusAccountSelector {
-        id: accountSelector
         accounts: ListModel {
             ListElement {
                 name: "Pascal"
                 address: "0x1234567891011"
-                path: ""
-                color: "red"
-                publicKey: ""
+                iconColor: "red"
+                balance: "0"
                 walletType: "generated"
-                isChat: ""
-                currencyBalance:  "1199.02"
                 assets: []
+                fiatBalance: "1199.02"
             }
             ListElement {
                 name: "Boris"
                 address: "0x123"
-                path: ""
-                color: "red"
-                publicKey: ""
+                iconColor: "red"
+                balance: "0"
                 walletType: "generated"
-                isChat: ""
-                currencyBalance:  "0"
                 assets: []
+                fiatBalance: "0"
             }
             ListElement {
                 name: "Alexandra"
                 address: "0x123"
-                path: ""
-                color: "yellow"
-                publicKey: ""
+                iconColor: "yellow"
+                balance: "0"
                 walletType: "generated"
-                isChat: ""
-                currencyBalance:  "0"
                 assets: []
+                fiatBalance: "0"
             }
             ListElement {
                 name: "Khushboo"
                 address: "0x123"
-                path: ""
-                color: "blue"
-                publicKey: ""
+                iconColor: "blue"
+                balance: "0"
                 walletType: "generated"
-                isChat: ""
-                currencyBalance:  "0"
                 assets: []
+                fiatBalance: "0"
             }
         }
     }

sandbox/StatusAssetSelectorPage.qml

@@ -13,26 +13,22 @@ Column {
     spacing: 8
 
     StatusAssetSelector {
-        getCurrencyBalanceString: function (currencyBalance) {
-            return currencyBalance.toFixed(2) + " USD"
-        }
-        tokenAssetSourceFn: function (symbol) {
-            return "../../assets/img/icons/snt.svg"
-        }
         assets: ListModel {
             ListElement {
                 address: "0x1234"
                 name: "Status Network Token"
-                balance: "20"
+                value: "20"
                 symbol: "SNT"
-                currencyBalance: 9992.01
+                fiatBalance: "9992.01"
+                fiatBalanceDisplay: "9992.01"
             }
             ListElement {
                 address: "0x1234"
                 name: "DAI Token"
-                balance: "15"
+                value: "20"
                 symbol: "DAI"
-                currencyBalance: 20.00001
+                fiatBalance: "20"
+                fiatBalanceDisplay: "20"
             }
         }
     }

sandbox/demoapp/DemoCommunityDetailModal.qml

@@ -1,111 +0,0 @@
-import QtQuick 2.12
-
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-import StatusQ.Controls 0.1
-import StatusQ.Components 0.1
-import StatusQ.Popups 0.1
-
-StatusModal {
-    id: root
-
-    anchors.centerIn: parent
-
-    header.title: "Cryptokitties"
-    header.subTitle: "Public Community"
-    header.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
-
-    contentItem: Column {
-        width: root.width
-
-        StatusModalDivider {
-            bottomPadding: 8
-        }
-
-        StatusBaseText {
-            text: "A community of cat lovers, meow!"
-            verticalAlignment: Text.AlignVCenter
-            font.pixelSize: 15
-            height: 46
-            color: Theme.palette.directColor1
-            anchors.left: parent.left
-            anchors.right: parent.right
-            anchors.leftMargin: 16
-            anchors.rightMargin: 16
-        }
-
-        StatusModalDivider {
-            topPadding: 8
-            bottomPadding: 8
-        }
-
-        StatusDescriptionListItem {
-            title: "Share community"
-            subTitle: "https://join.status.im/u/0x04...45f19"
-            tooltip.text: "Copy to clipboard"
-            icon.name: "copy"
-            iconButton.onClicked: tooltip.visible = !tooltip.visible
-            width: parent.width
-        }
-
-        StatusModalDivider {
-            topPadding: 8
-            bottomPadding: 8
-        }
-
-        StatusListItem {
-            anchors.horizontalCenter: parent.horizontalCenter
-            statusListItemTitle.font.pixelSize: 17
-            title: "Members"
-            icon.name: "group-chat"
-            label: "184"
-            components: [
-                StatusIcon {
-                    icon: "chevron-down"
-                    rotation: 270
-                    color: Theme.palette.baseColor1
-                }
-            ]
-        }
-
-        StatusListItem {
-            anchors.horizontalCenter: parent.horizontalCenter
-            statusListItemTitle.font.pixelSize: 17
-            title: "Notifications"
-            icon.name: "notification"
-            components: [
-                StatusSwitch {}
-            ]
-        }
-
-        StatusModalDivider {
-            topPadding: 8
-            bottomPadding: 8
-        }
-
-        StatusListItem {
-            anchors.horizontalCenter: parent.horizontalCenter
-            statusListItemTitle.font.pixelSize: 17
-            title: "Edit community"
-            icon.name: "edit"
-            type: StatusListItem.Type.Secondary
-        }
-
-        StatusListItem {
-            anchors.horizontalCenter: parent.horizontalCenter
-            statusListItemTitle.font.pixelSize: 17
-            title: "Transfer ownership"
-            icon.name: "exchange"
-            type: StatusListItem.Type.Secondary
-        }
-
-        StatusListItem {
-            anchors.horizontalCenter: parent.horizontalCenter
-            statusListItemTitle.font.pixelSize: 17
-            title: "Leave community"
-            icon.name: "arrow-right"
-            icon.rotation: 180
-            type: StatusListItem.Type.Secondary
-        }
-    }
-}

sandbox/demoapp/DemoContactRequestsModal.qml

@@ -1,40 +0,0 @@
-import QtQuick 2.12
-
-import StatusQ.Controls 0.1
-import StatusQ.Core 0.1
-import StatusQ.Popups 0.1
-import StatusQ.Core.Theme 0.1
-
-StatusModal {
-    id: root
-
-    header.title: "Contact Requests"
-    headerActionButton: StatusFlatRoundButton {
-        type: StatusFlatRoundButton.Type.Secondary
-        width: 32
-        height: 32
-
-        icon.width: 20
-        icon.height: 20
-        icon.name: "notification"
-    }
-
-    contentItem: StatusBaseText {
-        anchors.centerIn: parent
-        text: "Contact request will be shown here"
-        font.pixelSize: 15
-        color: Theme.palette.directColor1
-    }
-
-    rightButtons: [
-        StatusButton {
-            text: "Decline all"
-            type: StatusBaseButton.Type.Danger
-            onClicked: root.close()
-        },
-        StatusButton {
-            text: "Accept all"
-            onClicked: root.close()
-        }
-    ]
-}

sandbox/demoapp/StatusAppChatView.qml

@@ -1,348 +0,0 @@
-import QtQuick 2.12
-
-import StatusQ.Controls 0.1
-import StatusQ.Popups 0.1
-import StatusQ.Components 0.1
-import StatusQ.Layout 0.1
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-
-import "data" 1.0
-
-StatusAppThreePanelLayout {
-    id: root
-
-    leftPanel: Item {
-        anchors.fill: parent
-
-        StatusNavigationPanelHeadline {
-            id: headline
-            anchors.top: parent.top
-            anchors.topMargin: 16
-            anchors.horizontalCenter: parent.horizontalCenter
-            text: "Chat"
-        }
-
-        Item {
-            id: searchInputWrapper
-            anchors.top: headline.bottom
-            anchors.topMargin: 16
-            width: parent.width
-            height: searchInput.height
-
-            StatusBaseInput {
-                id: searchInput
-
-                anchors.verticalCenter: parent.verticalCenter
-                anchors.left: parent.left
-                anchors.right: actionButton.left
-                anchors.leftMargin: 16
-                anchors.rightMargin: 16
-
-                height: 36
-                topPadding: 8
-                bottomPadding: 0
-                placeholderText: "Search"
-                icon.name: "search"
-            }
-
-            StatusRoundButton {
-                id: actionButton
-                anchors.verticalCenter: parent.verticalCenter
-                anchors.right: parent.right
-                anchors.rightMargin: 8
-                width: 32
-                height: 32
-
-                type: StatusRoundButton.Type.Secondary
-                icon.name: "add"
-                state: "default"
-
-                onClicked: chatContextMenu.popup(actionButton.width-chatContextMenu.width, actionButton.height + 4)
-                states: [
-                    State {
-                        name: "default"
-                        PropertyChanges {
-                            target: actionButton
-                            icon.rotation: 0
-                            highlighted: false
-                        }
-                    },
-                    State {
-                        name: "pressed"
-                        PropertyChanges {
-                            target: actionButton
-                            icon.rotation: 45
-                            highlighted: true
-                        }
-                    }
-                ]
-
-                transitions: [
-                    Transition {
-                        from: "default"
-                        to: "pressed"
-
-                        RotationAnimation {
-                            duration: 150
-                            direction: RotationAnimation.Clockwise
-                            easing.type: Easing.InCubic
-                        }
-                    },
-                    Transition {
-                        from: "pressed"
-                        to: "default"
-                        RotationAnimation {
-                            duration: 150
-                            direction: RotationAnimation.Counterclockwise
-                            easing.type: Easing.OutCubic
-                        }
-                    }
-                ]
-
-                StatusPopupMenu {
-                    id: chatContextMenu
-
-                    onOpened: {
-                        actionButton.state = "pressed"
-                    }
-
-                    onClosed: {
-                        actionButton.state = "default"
-                    }
-
-                    StatusMenuItem {
-                        text: "Start new chat"
-                        icon.name: "private-chat"
-                    }
-
-                    StatusMenuItem {
-                        text: "Start group chat"
-                        icon.name: "group-chat"
-                    }
-
-                    StatusMenuItem {
-                        text: "Join public chat"
-                        icon.name: "public-chat"
-                    }
-
-                    StatusMenuItem {
-                        text: "Communities"
-                        icon.name: "communities"
-                    }
-                }
-            }
-        }
-
-        Column {
-            anchors.top: searchInputWrapper.bottom
-            anchors.topMargin: 16
-            width: parent.width
-            spacing: 8
-
-            StatusContactRequestsIndicatorListItem {
-                anchors.horizontalCenter: parent.horizontalCenter
-                title: "Contact requests"
-                requestsCount: 3
-                sensor.onClicked: demoContactRequestsModal.open()
-            }
-
-            StatusChatList {
-                anchors.horizontalCenter: parent.horizontalCenter
-
-                chatListItems.model: Models.demoChatListItems
-                selectedChatId: "0"
-                onChatItemSelected: selectedChatId = id
-                onChatItemUnmuted: {
-                    for (var i = 0; i < Models.demoChatListItems.count; i++) {
-                        let item = Models.demoChatListItems.get(i);
-                        if (item.chatId === id) {
-                            Models.demoChatListItems.setProperty(i, "muted", false)
-                        }
-                    }
-                }
-
-                popupMenu: StatusPopupMenu {
-
-                    property string chatId
-
-                    openHandler: function (id) {
-                        chatId = id
-                    }
-
-                    StatusMenuItem {
-                        text: "View Profile"
-                        icon.name: "group-chat"
-                    }
-
-                    StatusMenuSeparator {}
-
-                    StatusMenuItem {
-                        text: "Mute chat"
-                        icon.name: "notification"
-                    }
-
-                    StatusMenuItem {
-                        text: "Mark as Read"
-                        icon.name: "checkmark-circle"
-                    }
-
-                    StatusMenuItem {
-                        text: "Clear history"
-                        icon.name: "close-circle"
-                    }
-
-                    StatusMenuSeparator {}
-
-                    StatusMenuItem {
-                        text: "Delete chat"
-                        icon.name: "delete"
-                        type: StatusMenuItem.Type.Danger
-                    }
-                }
-            }
-        }
-    }
-
-    rightPanel: Item {
-        anchors.fill: parent
-
-        StatusChatToolBar {
-            anchors.top: parent.top
-            width: parent.width
-
-            chatInfoButton.title: "Amazing Funny Squirrel"
-            chatInfoButton.subTitle: "Contact"
-            chatInfoButton.icon.color: Theme.palette.miscColor7
-            chatInfoButton.type: StatusChatInfoButton.Type.OneToOneChat
-            chatInfoButton.pinnedMessagesCount: 1
-
-            searchButton.visible: false
-            membersButton.visible: false
-            notificationCount: 1
-
-            onNotificationButtonClicked: notificationCount = 0
-
-            popupMenu: StatusPopupMenu {
-                id: contextMenu
-
-                StatusMenuItem {
-                    text: "Mute Chat"
-                    icon.name: "notification"
-                }
-                StatusMenuItem {
-                    text: "Mark as Read"
-                    icon.name: "checkmark-circle"
-                }
-                StatusMenuItem {
-                    text: "Clear History"
-                    icon.name: "close-circle"
-                }
-
-                StatusMenuSeparator {}
-
-                StatusMenuItem {
-                    text: "Leave Chat"
-                    icon.name: "arrow-right"
-                    icon.width: 14
-                    iconRotation: 180
-                    type: StatusMenuItem.Type.Danger
-                }
-            }
-        }
-    }
-
-    centerPanel: ListView {
-        id: messageList
-        anchors.fill: parent
-        anchors.margins: 15
-        clip: true
-        model: Models.chatMessagesModel
-        delegate: StatusMessage {
-            id: delegate
-            width: parent.width
-
-            audioMessageInfoText: "Audio Message"
-            cancelButtonText: "Cancel"
-            saveButtonText: "Save"
-            loadingImageText: "Loading image..."
-            errorLoadingImageText: "Error loading the image"
-            resendText: "Resend"
-            pinnedMsgInfoText: "Pinned by"
-
-            messageDetails: StatusMessageDetails {
-                contentType: model.contentType
-                messageContent: model.messageContent
-                amISender: model.amIsender
-                displayName: model.userName
-                secondaryName: model.localName !== "" && model.ensName.startsWith("@") ? model.ensName: ""
-                chatID: model.chatKey
-                profileImage: StatusImageSettings {
-                    width: 40
-                    height: 40
-                    source: model.profileImage
-                    isIdenticon: model.isIdenticon
-                }
-                messageText: model.message
-                hasMention: model.hasMention
-                contactType: model.contactType
-                isPinned: model.isPinned
-                pinnedBy: model.pinnedBy
-                hasExpired: model.hasExpired
-            }
-            timestamp.text: "10:00 am"
-            timestamp.tooltip.text: "10:01 am"
-            // reply related data
-            isAReply: model.isReply
-            replyDetails: StatusMessageDetails {
-                amISender:  model.isReply ? model.replyAmISender : ""
-                displayName:  model.isReply ? model.replySenderName: ""
-                profileImage: StatusImageSettings {
-                    width: 20
-                    height: 20
-                    source:  model.isReply ? model.replyProfileImage: ""
-                    isIdenticon:  model.isReply ? model.replyIsIdenticon: ""
-                }
-                messageText:  model.isReply ? model.replyMessageText: ""
-                contentType: model.replyContentType
-                messageContent: model.replyMessageContent
-            }
-            quickActions: [
-                StatusFlatRoundButton {
-                    id: emojiBtn
-                    width: 32
-                    height: 32
-                    icon.name: "reaction-b"
-                    type: StatusFlatRoundButton.Type.Tertiary
-                    tooltip.text: "Add reaction"
-                },
-                StatusFlatRoundButton {
-                    id: replyBtn
-                    width: 32
-                    height: 32
-                    icon.name: "reply"
-                    type: StatusFlatRoundButton.Type.Tertiary
-                    tooltip.text: "Reply"
-                },
-                StatusFlatRoundButton {
-                    width: 32
-                    height: 32
-                    icon.name: "tiny/edit"
-                    type: StatusFlatRoundButton.Type.Tertiary
-                    tooltip.text: "Edit"
-                    onClicked: {
-                        delegate.editMode = !delegate.editMode
-                    }
-                },
-                StatusFlatRoundButton {
-                    id: otherBtn
-                    width: 32
-                    height: 32
-                    icon.name: "more"
-                    type: StatusFlatRoundButton.Type.Tertiary
-                    tooltip.text: "More"
-                }
-            ]
-        }
-    }
-}

sandbox/demoapp/StatusAppCommunityView.qml

@@ -1,274 +0,0 @@
-import QtQuick 2.12
-import QtQuick.Controls 2.14
-
-import StatusQ.Core 0.1
-import StatusQ.Popups 0.1
-import StatusQ.Controls 0.1
-import StatusQ.Components 0.1
-import StatusQ.Layout 0.1
-import StatusQ.Core.Theme 0.1
-
-import "data" 1.0
-
-StatusAppThreePanelLayout {
-    id: root
-
-    property string communityDetailModalTitle: ""
-    property string communityDetailModalImage: ""
-    signal chatInfoButtonClicked()
-
-    handle: Rectangle {
-        implicitWidth: 5
-        color: SplitHandle.pressed ? Theme.palette.baseColor2
-                                   : (SplitHandle.hovered ? Qt.darker(Theme.palette.baseColor5, 1.1) : "transparent")
-    }
-    leftPanel: Item {
-        id: leftPanel
-
-        StatusChatInfoToolBar {
-            id: statusChatInfoToolBar
-
-            anchors.top: parent.top
-            anchors.horizontalCenter: parent.horizontalCenter
-
-            chatInfoButton.title: "CryptoKitties"
-            chatInfoButton.subTitle: "128 Members"
-            chatInfoButton.image.source: "https://pbs.twimg.com/profile_images/1369221718338895873/T_5fny6o_400x400.jpg"
-            chatInfoButton.icon.color: Theme.palette.miscColor6
-            chatInfoButton.onClicked:  { chatInfoButtonClicked(); }
-
-            popupMenu: StatusPopupMenu {
-
-                StatusMenuItem {
-                    text: "Create channel"
-                    icon.name: "channel"
-                }
-
-                StatusMenuItem {
-                    text: "Create category"
-                    icon.name: "channel-category"
-                }
-
-                StatusMenuSeparator {}
-
-                StatusMenuItem {
-                    text: "Invite people"
-                    icon.name: "share-ios"
-                }
-
-            }
-        }
-
-        ScrollView {
-            id: scrollView
-
-            anchors.top: statusChatInfoToolBar.bottom
-            anchors.topMargin: 8
-            anchors.bottom: parent.bottom
-            width: leftPanel.width
-
-            contentHeight: communityCategories.height
-            clip: true
-
-            StatusChatListAndCategories {
-                id: communityCategories
-                width: leftPanel.width
-                height: implicitHeight > (leftPanel.height - 64) ? implicitHeight + 8 : leftPanel.height - 64
-
-                draggableItems: true
-                draggableCategories: false
-                chatList.model: Models.demoCommunityChatListItems
-                categoryList.model: Models.demoCommunityCategoryItems
-
-                showCategoryActionButtons: true
-                onChatItemSelected: selectedChatId = id
-
-                categoryPopupMenu: StatusPopupMenu {
-
-                    property string categoryId
-
-                    openHandler: function (id) {
-                        categoryId = id
-                    }
-
-                    StatusMenuItem {
-                        text: "Mute Category"
-                        icon.name: "notification"
-                    }
-
-                    StatusMenuItem {
-                        text: "Mark as Read"
-                        icon.name: "checkmark-circle"
-                    }
-
-                    StatusMenuItem {
-                        text: "Edit Category"
-                        icon.name: "edit"
-                    }
-
-                    StatusMenuSeparator {}
-
-                    StatusMenuItem {
-                        text: "Delete Category"
-                        icon.name: "delete"
-                        type: StatusMenuItem.Type.Danger
-                    }
-                }
-
-                chatListPopupMenu: StatusPopupMenu {
-
-                    property string chatId
-
-                    StatusMenuItem {
-                        text: "Mute chat"
-                        icon.name: "notification"
-                    }
-
-                    StatusMenuItem {
-                        text: "Mark as Read"
-                        icon.name: "checkmark-circle"
-                    }
-
-                    StatusMenuItem {
-                        text: "Clear history"
-                        icon.name: "close-circle"
-                    }
-
-                    StatusMenuSeparator {}
-
-                    StatusMenuItem {
-                        text: "Delete chat"
-                        icon.name: "delete"
-                        type: StatusMenuItem.Type.Danger
-                    }
-                }
-
-                popupMenu: StatusPopupMenu {
-                    StatusMenuItem {
-                        text: "Create channel"
-                        icon.name: "channel"
-                    }
-
-                    StatusMenuItem {
-                        text: "Create category"
-                        icon.name: "channel-category"
-                    }
-
-                    StatusMenuSeparator {}
-
-                    StatusMenuItem {
-                        text: "Invite people"
-                        icon.name: "share-ios"
-                    }
-                }
-            }
-        }
-    }
-
-    centerPanel: Item {
-        StatusChatToolBar {
-            id: statusChatToolBar
-            anchors.top: parent.top
-            width: parent.width
-
-            chatInfoButton.title: "general"
-            chatInfoButton.subTitle: "Community Chat"
-            chatInfoButton.icon.color: Theme.palette.miscColor6
-            chatInfoButton.type: StatusChatInfoButton.Type.CommunityChat
-            onSearchButtonClicked: {
-                searchButton.highlighted = !searchButton.highlighted;
-                searchPopup.setSearchSelection(communityDetailModalTitle,
-                                               "",
-                                               communityDetailModalImage);
-                searchPopup.open();
-            }
-            membersButton.onClicked: membersButton.highlighted = !membersButton.highlighted
-            onMembersButtonClicked: {
-                root.showRightPanel = !root.showRightPanel;
-            }
-        }
-
-        StatusSearchPopup {
-            id: searchPopup
-            searchOptionsPopupMenu: searchPopupMenu
-            onAboutToHide: {
-                if (searchPopupMenu.visible) {
-                    searchPopupMenu.close();
-                }
-                //clear menu
-                for (var i = 2; i < searchPopupMenu.count; i++) {
-                    searchPopupMenu.removeItem(searchPopupMenu.takeItem(i));
-                }
-            }
-            onClosed: {
-                statusChatToolBar.searchButton.highlighted = false
-                searchPopupMenu.dismiss();
-            }
-            onSearchTextChanged: {
-                if (searchPopup.searchText !== "") {
-                    searchPopup.loading = true;
-                    searchModelSimTimer.start();
-                } else {
-                    searchPopup.searchResults = [];
-                    searchModelSimTimer.stop();
-                }
-            }
-            Timer {
-                id: searchModelSimTimer
-                interval: 500
-                onTriggered: {
-                    if (searchPopup.searchText.startsWith("c")) {
-                        searchPopup.searchResults = Models.searchResultsA;
-                    } else {
-                        searchPopup.searchResults = Models.searchResultsB;
-                    }
-                    searchPopup.loading = false;
-                }
-            }
-        }
-        StatusSearchLocationMenu {
-            id: searchPopupMenu
-            searchPopup: searchPopup
-            locationModel: Models.optionsModel
-        }
-    }
-
-    rightPanel: Item {
-        id: rightPanel
-        StatusBaseText {
-            id: titleText
-            anchors.top: parent.top
-            anchors.topMargin:16
-            anchors.left: parent.left
-            anchors.leftMargin: 16
-            opacity: (rightPanel.width > 50) ? 1.0 : 0.0
-            visible: (opacity > 0.1)
-            font.pixelSize: 15
-            text: qsTr("Members")
-        }
-
-        ListView {
-            anchors.top: titleText.bottom
-            anchors.topMargin: 16
-            anchors.left: parent.left
-            anchors.leftMargin: 8
-            anchors.right: parent.right
-            anchors.rightMargin: 8
-            anchors.bottom: parent.bottom
-            anchors.bottomMargin: 16
-            boundsBehavior: Flickable.StopAtBounds
-            model: Models.membersListModel
-            delegate: StatusMemberListItem {
-                implicitWidth: parent.width
-                nickName: model.nickName
-                userName: model.userName
-                chatKey: model.chatKey
-                trustIndicator: model.trustIndicator
-                isMutualContact: model.isMutualContact
-                image.source: model.source
-                image.isIdenticon: model.isIdenticon
-                isOnline: model.isOnline
-            }
-        }
-    }
-}

sandbox/demoapp/StatusAppProfileSettingsView.qml

@@ -1,77 +0,0 @@
-import QtQuick 2.12
-import QtQuick.Controls 2.14
-
-import StatusQ.Components 0.1
-import StatusQ.Layout 0.1
-import StatusQ.Core.Theme 0.1
-
-import "data" 1.0
-
-StatusAppTwoPanelLayout {
-    id: root
-
-    leftPanel: Item {
-        anchors.fill: parent
-
-        StatusNavigationPanelHeadline {
-            id: profileHeadline
-            anchors.top: parent.top
-            anchors.topMargin: 16
-            anchors.horizontalCenter: parent.horizontalCenter
-            text: "Profile"
-        }
-
-        ScrollView {
-            anchors.top: profileHeadline.bottom
-            anchors.topMargin: 16
-            anchors.bottom: parent.bottom
-            width: parent.width
-
-            contentHeight: profileMenuItems.height + 8
-            contentWidth: parent.width
-            clip: true
-
-            Column {
-                id: profileMenuItems
-                anchors.horizontalCenter: parent.horizontalCenter
-                spacing: 4
-
-                Repeater {
-                    model: Models.demoProfileGeneralMenuItems
-                    delegate: StatusNavigationListItem {
-                        title: model.title
-                        icon.name: model.icon
-                    }
-                }
-
-                StatusListSectionHeadline { text: "Settings" }
-
-                Repeater {
-                    model: Models.demoProfileSettingsMenuItems
-                    delegate: StatusNavigationListItem {
-                        title: model.title
-                        icon.name: model.icon
-                    }
-                }
-
-                Item {
-                    id: invisibleSeparator
-                    height: 16
-                    width: parent.width
-                }
-
-                Repeater {
-                    model: Models.demoProfileOtherMenuItems
-                    delegate: StatusNavigationListItem {
-                        title: model.title
-                        icon.name: model.icon
-                    }
-                }
-            }
-        }
-    }
-
-    rightPanel: Item {
-        anchors.fill: parent
-    }
-}

sandbox/demoapp/data/qmldir

@@ -1 +0,0 @@
-singleton Models 1.0 Models.qml

sandbox/main.qml

@@ -101,14 +101,6 @@ StatusWindow {
         id: libraryDocumentationCmp
 
         StatusAppTwoPanelLayout {
-            id: mainPageView
-
-            function page(name) {
-                viewLoader.source = Qt.resolvedUrl("./pages/" + name + "Page.qml");
-            }
-            function control(name) {
-                viewLoader.source = Qt.resolvedUrl("./controls/" + name + ".qml");
-            }
 
             leftPanel: Item {
                 anchors.fill: parent
@@ -128,127 +120,122 @@ StatusWindow {
 
                         StatusListSectionHeadline { text: "StatusQ.Core" }
                         StatusNavigationListItem { 
-                            title: "Icons"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.control(title);
+                            title: "Icons" 
+                            selected: page.sourceComponent == iconsComponent
+                            onClicked: page.sourceComponent = iconsComponent
                         }
 
                         StatusListSectionHeadline { text: "StatusQ.Layout" }
                         StatusNavigationListItem { 
-                            title: "Layouts"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.control(title.substring(0, title.length - 1));
+                            title: "Layouts" 
+                            selected: page.sourceComponent == layoutComponent
+                            onClicked: page.sourceComponent = layoutComponent
                         }
 
                         StatusListSectionHeadline { text: "StatusQ.Controls" }
                         StatusNavigationListItem { 
-                            title: "Buttons"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.control(title);
+                            title: "Buttons" 
+                            selected: page.sourceComponent == buttonsComponent
+                            onClicked: page.sourceComponent = buttonsComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusSwitchTab"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page("StatusTabSwitch");
+                            title: "StatusSwitchTab" 
+                            selected: page.sourceComponent == statusTabSwitchesComponent
+                            onClicked: page.sourceComponent = statusTabSwitchesComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusChatCommandButton"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            title: "StatusChatCommandButton" 
+                            selected: page.sourceComponent == statusChatCommandButtonPageComponent
+                            onClicked: page.sourceComponent = statusChatCommandButtonPageComponent
                         }
                         StatusNavigationListItem { 
-                            title: "Controls"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.control(title);
+                            title: "Controls" 
+                            selected: page.sourceComponent == controlsComponent
+                            onClicked: page.sourceComponent = controlsComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusTabBarIconButton"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            title: "StatusTabBarIconButton" 
+                            selected: page.sourceComponent == statusTabBarIconButtonPageComponent
+                            onClicked: page.sourceComponent = statusTabBarIconButtonPageComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusInput"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            title: "StatusInput" 
+                            selected: page.sourceComponent == statusInputPageComponent
+                            onClicked: page.sourceComponent = statusInputPageComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusSelect"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            title: "StatusSelect" 
+                            selected: page.sourceComponent == statusSelectPageComponent
+                            onClicked: page.sourceComponent = statusSelectPageComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusAccountSelector"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            title: "StatusAccountSelector" 
+                            selected: page.sourceComponent == statusAccountSelectorPageComponent
+                            onClicked: page.sourceComponent = statusAccountSelectorPageComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusAssetSelector"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            title: "StatusAssetSelector" 
+                            selected: page.sourceComponent == statusAssetSelectorPageComponent
+                            onClicked: page.sourceComponent = statusAssetSelectorPageComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusColorSelector"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            title: "StatusColorSelector" 
+                            selected: page.sourceComponent == statusColorSelectorPageComponent
+                            onClicked: page.sourceComponent = statusColorSelectorPageComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusWalletColorButton"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            title: "StatusWalletColorButton" 
+                            selected: page.sourceComponent == statusWalletColorButtonPageComponent
+                            onClicked: page.sourceComponent = statusWalletColorButtonPageComponent
                         }
                         StatusNavigationListItem { 
-                            title: "StatusWalletColorSelect"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
-                        }
-                        StatusNavigationListItem {
-                            title: "StatusPasswordStrengthIndicator"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            title: "StatusWalletColorSelect" 
+                            selected: page.sourceComponent == statusWalletColorSelectPageComponent
+                            onClicked: page.sourceComponent = statusWalletColorSelectPageComponent
                         }
                         StatusListSectionHeadline { text: "StatusQ.Components" }
                         StatusNavigationListItem { 
                             title: "StatusAddress"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            selected: page.sourceComponent == statusAddressPageComponent
+                            onClicked: page.sourceComponent = statusAddressPageComponent
                         }
                         StatusNavigationListItem { 
                             title: "List Items"
-                            selected: viewLoader.source.toString().includes(title.replace(/\s+/g, ''))
-                            onClicked: mainPageView.control(title.replace(/\s+/g, ''));
+                            selected: page.sourceComponent == listItemsComponent
+                            onClicked: page.sourceComponent = listItemsComponent
                         }
                         StatusNavigationListItem { 
                             title: "StatusChatInfoToolBar"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            selected: page.sourceComponent == chatInfoToolBarComponent
+                            onClicked: page.sourceComponent = chatInfoToolBarComponent
                         }
                         StatusNavigationListItem { 
                             title: "Others"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.control(title);
+                            selected: page.sourceComponent == othersComponent
+                            onClicked: page.sourceComponent = othersComponent
                         }
                         StatusNavigationListItem {
                             title: "StatusExpandableItem"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page("StatusExpandableSettingsItem");
+                            selected: page.sourceComponent == settingsComponent
+                            onClicked: page.sourceComponent = settingsComponent
                         }
                         StatusListSectionHeadline { text: "StatusQ.Popup" }
                         StatusNavigationListItem { 
                             title: "StatusPopupMenu"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            selected: page.sourceComponent == popupMenuComponent
+                            onClicked: page.sourceComponent = popupMenuComponent
                         }
 
                         StatusNavigationListItem {
                             title: "StatusModal"
-                            selected: viewLoader.source.toString().includes("Popups")
-                            onClicked: mainPageView.control("Popups");
+                            selected: page.sourceComponent == statusModalComponent
+                            onClicked: page.sourceComponent = statusModalComponent
                         }
                         StatusListSectionHeadline { text: "StatusQ.Platform" }
                         StatusNavigationListItem {
                             title: "StatusMacNotification"
-                            selected: viewLoader.source.toString().includes(title)
-                            onClicked: mainPageView.page(title);
+                            selected: page.sourceComponent == notificationComponent
+                            onClicked: page.sourceComponent = notificationComponent
                         }
                     }
                 }
@@ -268,17 +255,13 @@ StatusWindow {
                         width: rightPanel.width
                         anchors.top: parent.top
                         anchors.topMargin: 64
-                        height: Math.max(rootWindow.height, viewLoader.height + 128)
+                        height: Math.max(rootWindow.height, page.height + 128)
                         scale: rootWindow.factor
                         Loader {
-                            id: viewLoader
+                            id: page
+                            active: true
                             anchors.centerIn: parent
-                            source: mainPageView.control("Icons")
-                            onSourceChanged: {
-                                if (source.toString().includes("Icons")) {
-                                    item.iconColor = Theme.palette.primaryColor1;
-                                }
-                            }
+                            sourceComponent: iconsComponent
                         }
                     }
                 }
@@ -309,6 +292,116 @@ StatusWindow {
         }
     }
 
+    Component {
+        id: iconsComponent
+        Icons { iconColor: Theme.palette.primaryColor1 }
+    }
+
+    Component {
+        id: controlsComponent
+        Controls {}
+    }
+
+    Component {
+        id: statusInputPageComponent
+        StatusInputPage {}
+    }
+
+    Component {
+        id: statusSelectPageComponent
+        StatusSelectPage {}
+    }
+
+    Component {
+        id: statusAccountSelectorPageComponent
+        StatusAccountSelectorPage {}
+    }
+
+    Component {
+        id: statusAssetSelectorPageComponent
+        StatusAssetSelectorPage {}
+    }
+
+    Component {
+        id: statusColorSelectorPageComponent
+        StatusColorSelectorPage {}
+    }
+
+    Component {
+        id: statusTabBarIconButtonPageComponent
+        StatusTabBarIconButtonPage {}
+    }
+
+    Component {
+        id: statusWalletColorButtonPageComponent
+        StatusWalletColorButtonPage {}
+    }
+
+    Component {
+        id: statusWalletColorSelectPageComponent
+        StatusWalletColorSelectPage {}
+    }
+
+    Component {
+        id: listItemsComponent
+        ListItems {}
+    }
+
+    Component {
+        id: statusAddressPageComponent
+        StatusAddressPage {}
+    }
+
+    Component {
+        id: layoutComponent
+        Layout {}
+    }
+
+    Component {
+        id: othersComponent
+        Others {}
+    }
+
+    Component {
+        id: buttonsComponent
+        Buttons {}
+    }
+
+    Component {
+        id: statusChatCommandButtonPageComponent
+        StatusChatCommandButtonPage {}
+    }
+
+    Component {
+        id: popupMenuComponent
+        StatusPopupMenuPage {}
+    }
+
+    Component {
+        id: chatInfoToolBarComponent
+        StatusChatInfoToolBarPage {}
+    }
+
+    Component {
+        id: statusModalComponent
+        Popups {}
+    }
+
+    Component {
+        id: statusTabSwitchesComponent
+        StatusTabSwitchPage {}
+    }
+
+    Component {
+        id: settingsComponent
+        StatusExpandableSettingsItemPage{}
+    }
+
+    Component {
+        id: notificationComponent
+        StatusMacNotificationPage  {}
+    }
+
     Component {
         id: demoAppCmp
 

sandbox/pages/StatusPasswordStrengthIndicatorPage.qml

@@ -1,38 +0,0 @@
-import QtQuick.Layouts 1.14
-import StatusQ.Controls 0.1
-
-GridLayout {
-    columns: 1
-    columnSpacing: 5
-    rowSpacing: 5
-
-    StatusPasswordStrengthIndicator {
-        id: veryweakPw
-        strength: StatusPasswordStrengthIndicator.Strength.VeryWeak
-        value: 0.75
-    }
-
-    StatusPasswordStrengthIndicator {
-        id: weakPw
-        strength: StatusPasswordStrengthIndicator.Strength.Weak
-        value: 0.5
-    }
-
-    StatusPasswordStrengthIndicator {
-        id: sosoPw
-        strength: StatusPasswordStrengthIndicator.Strength.SoSo
-        value: 0.25
-    }
-
-    StatusPasswordStrengthIndicator {
-        id: goodPw
-        strength: StatusPasswordStrengthIndicator.Strength.Good
-        value: 1
-    }
-
-    StatusPasswordStrengthIndicator {
-        id: greatPw
-        strength: StatusPasswordStrengthIndicator.Strength.Great
-        value: 0.3
-    }
-}

sandbox/qml.qrc

@@ -1,35 +1,18 @@
 <RCC>
     <qresource prefix="/">
         <file>main.qml</file>
-        <file>pages/StatusAccountSelectorPage.qml</file>
-        <file>pages/StatusAddressPage.qml</file>
-        <file>pages/StatusAssetSelectorPage.qml</file>
-        <file>pages/StatusChatCommandButtonPage.qml</file>
-        <file>pages/StatusChatInfoToolBarPage.qml</file>
-        <file>pages/StatusColorSelectorPage.qml</file>
-        <file>pages/StatusExpandableSettingsItemPage.qml</file>
-        <file>pages/StatusInputPage.qml</file>
-        <file>pages/StatusMacNotificationPage.qml</file>
-        <file>pages/StatusPopupMenuPage.qml</file>
-        <file>pages/StatusSelectPage.qml</file>
-        <file>pages/StatusTabBarIconButtonPage.qml</file>
-        <file>pages/StatusTabSwitchPage.qml</file>
-        <file>pages/StatusWalletColorButtonPage.qml</file>
-        <file>pages/StatusWalletColorSelectPage.qml</file>
-		<file>pages/StatusPasswordStrengthIndicatorPage.qml</file>
-        <file>controls/Buttons.qml</file>
-        <file>controls/Controls.qml</file>
-        <file>controls/Icons.qml</file>
-        <file>controls/Layout.qml</file>
-        <file>controls/ListItems.qml</file>
-        <file>controls/Others.qml</file>
-        <file>controls/Popups.qml</file>
-        <file>demoapp/DemoCommunityDetailModal.qml</file>
-        <file>demoapp/DemoContactRequestsModal.qml</file>
-        <file>demoapp/StatusAppChatView.qml</file>
-        <file>demoapp/StatusAppCommunityView.qml</file>
-        <file>demoapp/StatusAppProfileSettingsView.qml</file>
-        <file>demoapp/data/Models.qml</file>
-        <file>demoapp/data/qmldir</file>
+        <file>Controls.qml</file>
+        <file>Icons.qml</file>
+        <file>Others.qml</file>
+        <file>Buttons.qml</file>
+        <file>DemoApp.qml</file>
+        <file>ListItems.qml</file>
+        <file>StatusChatInfoToolBarPage.qml</file>
+        <file>StatusPopupMenuPage.qml</file>
+        <file>StatusInputPage.qml</file>
+        <file>ThemeSwitch.qml</file>
+        <file>Layout.qml</file>
+        <file>Popups.qml</file>
+        <file>StatusExpandableSettingsItemPage.qml</file>
     </qresource>
-</RCC>
+</RCC>

sandbox/sandbox.pro

@@ -22,9 +22,6 @@ SOURCES += \
 }
 
 TARGET = sandboxapp
-DESTDIR = $$PWD/bin
-
-DESTDIR = $$PWD/bin
 
 macx {
     CONFIG -= app_bundle
@@ -41,12 +38,6 @@ macx {
         DEFINES += USE_HUNSPELL
         message("hunspell exists in /usr/local/lib")
     }
-
-    copydata.commands = $(COPY_DIR) $$PWD/dictionaries $$DESTDIR
-    first.depends = $(first) copydata
-    export(first.depends)
-    export(copydata.commands)
-    QMAKE_EXTRA_TARGETS += first copydata
 }
 
 ios {
@@ -63,6 +54,14 @@ ios {
 RESOURCES += qml.qrc \
             $$PWD/../statusq.qrc
 
+DESTDIR = $$PWD/bin
+
+copydata.commands = $(COPY_DIR) $$PWD/dictionaries $$DESTDIR
+first.depends = $(first) copydata
+export(first.depends)
+export(copydata.commands)
+QMAKE_EXTRA_TARGETS += first copydata
+
 # Default rules for deployment.
 qnx: target.path = /tmp/$${TARGET}/bin
 else: unix:!android: target.path = /opt/$${TARGET}/bin

sandbox/sandboxapp.cpp

@@ -20,7 +20,7 @@ void SandboxApp::startEngine()
     qmlRegisterType<SpellChecker>("Sandbox", 0, 1, "Spellchecker");
 
 #ifdef QT_DEBUG
-    const QUrl url = QUrl::fromLocalFile(applicationDirPath() + "/../main.qml");
+    const QUrl url(applicationDirPath() + "/../main.qml");
 #else
     const QUrl url(QStringLiteral("qrc:/main.qml"));
 #endif

src/StatusQ/Components/StatusChatListItem.qml

@@ -58,7 +58,7 @@ Rectangle {
         if (selected) {
             return Theme.palette.statusChatListItem.selectedBackgroundColor
         }
-        return hoverHander.hovered || highlighted ? Theme.palette.statusChatListItem.hoverBackgroundColor : Theme.palette.baseColor4
+        return sensor.containsMouse || highlighted ? Theme.palette.statusChatListItem.hoverBackgroundColor : Theme.palette.baseColor4
     }
 
     opacity: dragged ? 0.7 : 1
@@ -66,13 +66,10 @@ Rectangle {
     MouseArea {
         id: sensor
 
-        HoverHandler {
-            id: hoverHander
-        }
-
         anchors.fill: parent
         cursorShape: Qt.PointingHandCursor
         acceptedButtons: Qt.LeftButton | Qt.RightButton
+        hoverEnabled: true
 
         onClicked: statusChatListItem.clicked(mouse)
 
@@ -95,7 +92,7 @@ Rectangle {
             width: 14
             visible: statusChatListItem.type !== StatusChatListItem.Type.OneToOneChat
             opacity: {
-                if (statusChatListItem.muted && !hoverHander.hovered && !statusChatListItem.highlighted) {
+                if (statusChatListItem.muted && !sensor.containsMouse && !statusChatListItem.highlighted) {
                     return 0.4
                 }
                 return statusChatListItem.hasMention ||
@@ -103,7 +100,7 @@ Rectangle {
                         statusChatListItem.selected ||
                         statusChatListItem.highlighted ||
                         statusBadge.visible ||
-                        hoverHander.hovered ? 1.0 : 0.7
+                        sensor.containsMouse ? 1.0 : 0.7
             }
 
             icon: {
@@ -138,14 +135,14 @@ Rectangle {
                       statusChatListItem.name)
             elide: Text.ElideRight
             color: {
-                if (statusChatListItem.muted && !hoverHander.hovered && !statusChatListItem.highlighted) {
+                if (statusChatListItem.muted && !sensor.containsMouse && !statusChatListItem.highlighted) {
                     return Theme.palette.directColor5
                 }
                 return statusChatListItem.hasMention ||
                         statusChatListItem.hasUnreadMessages ||
                         statusChatListItem.selected ||
                         statusChatListItem.highlighted ||
-                        hoverHander.hovered ||
+                        sensor.containsMouse ||
                         statusBadge.visible ? Theme.palette.directColor1 : Theme.palette.directColor4
             }
             font.weight: !statusChatListItem.muted &&

src/StatusQ/Components/StatusExpandableItem.qml

@@ -58,128 +58,105 @@ Rectangle {
     }
 
 
-    Rectangle {
-        id: header
+    StatusSmartIdenticon {
+        id: identicon
         anchors.top: parent.top
-        width: parent.width
-        height: 64
-        radius: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? 8 : 0
-        color: statusExpandableItem.type === StatusExpandableItem.Type.Secondary && sensor.containsMouse ? Theme.palette.baseColor2 : "transparent"
+        anchors.topMargin: 25
+        anchors.left: parent.left
+        anchors.leftMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? 0 : 11
+        image: statusExpandableItem.image
+        icon: statusExpandableItem.icon
+        name: primaryText.text
+        active: (statusExpandableItem.type !== StatusExpandableItem.Type.Tertiary)
+    }
 
-        StatusSmartIdenticon {
-            id: identicon
-            anchors.top: parent.top
-            anchors.topMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? 12.5 : 25
-            anchors.left: parent.left
-            anchors.leftMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? 16 : 11
-            image: statusExpandableItem.image
-            icon: statusExpandableItem.icon
-            name: primaryText.text
-            active: (statusExpandableItem.type !== StatusExpandableItem.Type.Tertiary)
-        }
+    StatusBaseText {
+        id: primaryText
+        anchors.top: (statusExpandableItem.type === StatusExpandableItem.Type.Primary)  ||
+                     (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? parent.top : undefined
+        anchors.topMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? 29 : 17
+        anchors.left: identicon.active ? identicon.right : parent.left
+        anchors.leftMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ?  10 : 16
 
-        StatusBaseText {
-            id: primaryText
-            anchors.top: (statusExpandableItem.type === StatusExpandableItem.Type.Primary)  ||
-                        (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? parent.top : undefined
-            anchors.topMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? 29 : 17
-            anchors.left: identicon.active ? identicon.right : parent.left
-            anchors.leftMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ?  10 : 16
+        anchors.verticalCenter: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? identicon.verticalCenter : undefined
 
-            anchors.verticalCenter: (statusExpandableItem.type === StatusExpandableItem.Type.Secondary) ? identicon.verticalCenter : undefined
+        width: !!additionalText.text ? (button.visible ? parent.width - icon.background.width - button.width - additionalText.contentWidth - 110 :
+                                                       parent.width - icon.background.width - additionalText.contentWidth - 110) :
+                                     (button.visible ? parent.width - icon.background.width - button.width - 70 :
+                                                       parent.width - icon.background.width - 70)
 
-            width: !!additionalText.text ? (button.visible ? parent.width - icon.background.width - button.width - additionalText.contentWidth - 110 :
-                                                          parent.width - icon.background.width - additionalText.contentWidth - 110) :
-                                        (button.visible ? parent.width - icon.background.width - button.width - 70 :
-                                                          parent.width - icon.background.width - 70)
+        font.weight: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? Font.Medium : Font.Normal
+        font.pixelSize: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 15 : 17
+        lineHeight: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 22 : 24
+        lineHeightMode: Text.FixedHeight
+        elide: Text.ElideRight
+        color: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? Theme.palette.baseColor1 : Theme.palette.directColor1
+    }
 
-            font.weight: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? Font.Medium : Font.Normal
-            font.pixelSize: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 15 : 17
-            lineHeight: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 22 : 24
-            lineHeightMode: Text.FixedHeight
-            elide: Text.ElideRight
-            color: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ? Theme.palette.baseColor1 : Theme.palette.directColor1
-        }
+    StatusBaseText {
+        id: secondaryText
+        anchors.top: primaryText.bottom
+        anchors.topMargin: 4
+        anchors.left: primaryText.left
+        anchors.right: primaryText.right
 
-        StatusBaseText {
-            id: secondaryText
-            anchors.top: primaryText.bottom
-            anchors.topMargin: 4
-            anchors.left: primaryText.left
-            anchors.right: primaryText.right
+        font.pixelSize: 15
+        lineHeight: 22
+        lineHeightMode: Text.FixedHeight
+        elide: Text.ElideRight
+        color: Theme.palette.directColor3
+    }
 
-            font.pixelSize: 15
-            lineHeight: 22
-            lineHeightMode: Text.FixedHeight
-            elide: Text.ElideRight
-            color: Theme.palette.directColor3
-        }
+    StatusBaseText {
+        id: additionalText
+        anchors.verticalCenter: primaryText.verticalCenter
+        anchors.verticalCenterOffset: 2
+        anchors.right: expandImage.left
+        anchors.rightMargin: 16
 
-        StatusBaseText {
-            id: additionalText
-            anchors.verticalCenter: primaryText.verticalCenter
-            anchors.verticalCenterOffset: 2
-            anchors.right: expandImage.left
-            anchors.rightMargin: 16
+        font.pixelSize: 15
+        lineHeight: 24
+        lineHeightMode: Text.FixedHeight
+        elide: Text.ElideRight
+        color: Theme.palette.baseColor1
+    }
 
-            font.pixelSize: 15
-            lineHeight: 24
-            lineHeightMode: Text.FixedHeight
-            elide: Text.ElideRight
-            color: Theme.palette.baseColor1
-        }
+    StatusButton {
+        id: button
+        anchors.top: parent.top
+        anchors.topMargin: 19
+        anchors.right: parent.right
+        anchors.rightMargin: 16
+        visible: !!text
+    }
 
-        StatusButton {
-            id: button
-            anchors.top: parent.top
-            anchors.topMargin: 19
-            anchors.right: parent.right
-            anchors.rightMargin: 16
-            visible: !!text
-        }
+    StatusIcon {
+        id: expandImage
+        anchors.verticalCenter: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ?
+                                 primaryText.verticalCenter : identicon.verticalCenter
+        anchors.verticalCenterOffset:(statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ?  -3 : -1
+        anchors.right: parent.right
+        anchors.rightMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 23 : 6
+        visible: expandable && !button.visible
+        color: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ?
+                   Theme.palette.baseColor1 :
+                   Theme.palette.directColor1
+    }
 
-        StatusIcon {
-            id: expandImage
-            anchors.verticalCenter: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ?
-                                    primaryText.verticalCenter : identicon.verticalCenter
-            anchors.verticalCenterOffset:(statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ?  -3 : -1
-            anchors.right: parent.right
-            anchors.rightMargin: {
-                switch (statusExpandableItem.type) {
-                    case StatusExpandableItem.Type.Primary:
-                      return 23
-                      break;
-                    case StatusExpandableItem.Type.Secondary:
-                      return 16
-                      break;
-                    default:
-                      return 6
-
-                }
+    MouseArea {
+        anchors.fill: parent
+        onClicked: {
+            if(expandable) {
+                expanded = !expanded
             }
-            visible: expandable && !button.visible
-            color: (statusExpandableItem.type === StatusExpandableItem.Type.Tertiary) ?
-                      Theme.palette.baseColor1 :
-                      Theme.palette.directColor1
-        }
-
-        MouseArea {
-            id: sensor
-            anchors.fill: parent
-            onClicked: {
-                if(expandable) {
-                    expanded = !expanded
-                }
-            }
-            cursorShape: Qt.PointingHandCursor
-            visible: !button.visible && expandable
-            hoverEnabled: true
         }
+        cursorShape: Qt.PointingHandCursor
+        visible: !button.visible && expandable
     }
 
     Loader {
         id: expandableRegion
-        anchors.top: header.bottom
+        anchors.top: !!secondaryText.text ? secondaryText.bottom: primaryText.bottom
         anchors.topMargin: 16
         anchors.left: parent.left
         anchors.leftMargin: (statusExpandableItem.type === StatusExpandableItem.Type.Primary) ? 48 : 0

src/StatusQ/Components/StatusListItem.qml

@@ -9,21 +9,43 @@ import StatusQ.Controls 0.1
 Rectangle {
     id: statusListItem
 
+    implicitWidth: 448
+    implicitHeight: Math.max(64, statusListItemTitleArea.height + 16)
+
+    enum Type {
+        Primary,
+        Secondary,
+        Danger
+    }
+
+    color: {
+        if (sensor.containsMouse) {
+            switch(type) {
+                case StatusListItem.Type.Primary:
+                    return Theme.palette.baseColor2
+                case StatusListItem.Type.Secondary:
+                    return Theme.palette.statusListItem.secondaryHoverBackgroundColor
+                case StatusListItem.Type.Danger:
+                    return Theme.palette.dangerColor3
+            }
+        }
+        return Theme.palette.statusListItem.backgroundColor
+    }
+
+    radius: 8
+
     property string itemId: ""
     property string titleId: ""
+
     property string title: ""
     property string titleAsideText: ""
-    property bool titleIcon1Visible
-    property bool titleIcon2Visible
     property string subTitle: ""
-    property string tertiaryTitle: ""    
-    property string label: ""
+    property string tertiaryTitle: ""
+    property alias badge: statusListItemBadge
+
     property real leftPadding: 16
     property real rightPadding: 16
     property bool enabled: true
-    property int type: StatusListItem.Type.Primary
-    property list<Item> components
-
     property StatusIconSettings icon: StatusIconSettings {
         height: isLetterIdenticon ? 40 : 20
         width: isLetterIdenticon ? 40 : 20
@@ -51,69 +73,23 @@ Rectangle {
         height: 40
         isIdenticon: false
     }
-    property StatusIconSettings titleIcon1: StatusIconSettings {
-        width: dummyImage.width
-        height: dummyImage.height
-        background: StatusIconBackgroundSettings {
-            width: 10
-            height: 10
-        }
-        // Only used to get implicit width and height from the actual image
-        property Image dummyImage: Image {
-            source: titleIcon1.name ? "../../assets/img/icons/" + titleIcon1.name + ".svg": ""
-            visible: false
-        }        
-    }
-    property StatusIconSettings titleIcon2: StatusIconSettings {
-        width: dummyImage.width
-        height: dummyImage.height
-        background: StatusIconBackgroundSettings {
-            width: 10
-            height: 10
-        }
-        // Only used to get implicit width and height from the actual image
-        property Image dummyImage: Image {
-            source: titleIcon2.name ? "../../assets/img/icons/" + titleIcon2.name + ".svg": ""
-            visible: false
-        }
-    }
+    property string label: ""
+
+    property int type: StatusListItem.Type.Primary
 
     property alias sensor: sensor
-    property alias badge: statusListItemBadge
+
     property alias statusListItemIcon: iconOrImage
     property alias statusListItemTitle: statusListItemTitle
-    property alias statusListItemTitleAside: statusListItemTitleAsideText
-    property alias statusListItemTitleArea: statusListItemTitleArea
     property alias statusListItemSubTitle: statusListItemSubTitle
     property alias statusListItemTertiaryTitle: statusListItemTertiaryTitle
     property alias statusListItemComponentsSlot: statusListItemComponentsSlot
 
+    property list<Item> components
+
     signal clicked(string itemId)
     signal titleClicked(string titleId)
 
-    enum Type {
-        Primary,
-        Secondary,
-        Danger
-    }
-
-    implicitWidth: 448
-    implicitHeight: Math.max(64, statusListItemTitleArea.height + 16)
-    color: {
-        if (sensor.containsMouse) {
-            switch(type) {
-                case StatusListItem.Type.Primary:
-                    return Theme.palette.baseColor2
-                case StatusListItem.Type.Secondary:
-                    return Theme.palette.statusListItem.secondaryHoverBackgroundColor
-                case StatusListItem.Type.Danger:
-                    return Theme.palette.dangerColor3
-            }
-        }
-        return Theme.palette.statusListItem.backgroundColor
-    }
-    radius: 8
-
     onComponentsChanged: {
         if (components.length) {
             for (let idx in components) {
@@ -130,7 +106,6 @@ Rectangle {
         cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
         acceptedButtons: Qt.LeftButton | Qt.RightButton
         hoverEnabled: true
-        preventStealing: true
 
         onClicked: {
             statusListItem.clicked(statusListItem.itemId)
@@ -148,7 +123,6 @@ Rectangle {
             active: statusListItem.icon.isLetterIdenticon ||
                     !!statusListItem.icon.name ||
                     !!statusListItem.image.source.toString()
-            badge.border.color: statusListItem.color
         }
 
         Item {
@@ -167,9 +141,6 @@ Rectangle {
                 font.pixelSize: 15
                 height: visible ? contentHeight : 0
                 wrapMode: Text.WrapAtWordBoundaryOrAnywhere
-                anchors.left: parent.left
-                anchors.right: !statusListItem.titleAsideText && !statusListItem.titleIcon1Visible && !statusListItem.titleIcon2Visible
-                               ? parent.right : undefined
                 color: {
                   if (!statusListItem.enabled) {
                     return Theme.palette.baseColor1
@@ -207,38 +178,6 @@ Rectangle {
                 visible: !!statusListItem.titleAsideText
             }
 
-            Row {
-                id: titleIconsRow
-                spacing: 4
-                anchors.left: !statusListItem.titleAsideText ? statusListItemTitle.right : statusListItemTitleAsideText.right
-                anchors.verticalCenter: statusListItemTitle.verticalCenter
-                anchors.leftMargin: titleIconsRow.spacing
-
-                StatusRoundIcon {
-                    visible: statusListItem.titleIcon1Visible
-                    icon.name: statusListItem.titleIcon1.name
-                    icon.width: statusListItem.titleIcon1.width
-                    icon.height: statusListItem.titleIcon1.height
-                    icon.rotation: statusListItem.titleIcon1.rotation
-                    icon.color: statusListItem.titleIcon1.color
-                    icon.background.color: statusListItem.titleIcon1.background.color
-                    icon.background.width: statusListItem.titleIcon1.background.width
-                    icon.background.height: statusListItem.titleIcon1.background.height
-                }
-
-                StatusRoundIcon {
-                    visible: statusListItem.titleIcon2Visible
-                    icon.name: statusListItem.titleIcon2.name
-                    icon.width: statusListItem.titleIcon2.width
-                    icon.height: statusListItem.titleIcon2.height
-                    icon.rotation: statusListItem.titleIcon2.rotation
-                    icon.color: statusListItem.titleIcon2.color
-                    icon.background.color: statusListItem.titleIcon2.background.color
-                    icon.background.width: statusListItem.titleIcon2.background.width
-                    icon.background.height: statusListItem.titleIcon2.background.height
-                }
-             }
-
             StatusBaseText {
                 id: statusListItemSubTitle
                 anchors.top: statusListItemTitle.bottom

src/StatusQ/Components/StatusMemberListItem.qml

@@ -1,76 +0,0 @@
-import QtQuick 2.0
-import StatusQ.Core.Theme 0.1
-import StatusQ.Core 0.1
-
-
-StatusListItem {
-    id: root
-
-    property string nickName: ""
-    property string userName: ""
-    property string chatKey: ""
-    property bool isMutualContact: false
-    property var trustIndicator: StatusMemberListItem.TrustedType.None
-    property bool isOnline: false
-
-    enum TrustedType {
-        None, //0
-        Verified, //1
-        Untrustworthy //2
-    }
-
-    // Subtitle composition:
-    function composeSubtitile() {
-        var compose = ""
-        if(root.userName !== "")
-            compose = "(" + root.userName + ")"
-
-        if(compose !== "" && root.chatKey !== "")
-            // Composition
-            compose += " • " + composeShortKeyChat(root.chatKey)
-
-        else if(root.chatKey !== "")
-            compose = composeShortKeyChat(root.chatKey)
-
-        return compose
-    }
-
-    // Short keychat composition:
-    function composeShortKeyChat(chatKey) {
-        return chatKey.substring(0, 5) + "..." + chatKey.substring(chatKey.length - 3)
-    }
-
-    // root object settings:
-    title: root.nickName
-    titleIcon1Visible: root.isMutualContact
-    titleIcon2Visible: root.trustIndicator !== StatusMemberListItem.TrustedType.None
-    subTitle: composeSubtitile()
-    statusListItemSubTitle.font.pixelSize: 10
-    icon.isLetterIdenticon: !root.image.source.toString()
-    statusListItemIcon.badge.visible: true
-    statusListItemIcon.badge.color: root.isOnline ? Theme.palette.successColor1 : Theme.palette.baseColor1
-    color: sensor.containsMouse ? Theme.palette.baseColor2 : Theme.palette.baseColor4
-
-    // Default sizes/positions by design
-    implicitWidth: 256
-    implicitHeight: Math.max(56, statusListItemTitleArea.height + leftPadding)
-    leftPadding: 8
-    image.width: 32
-    image.height: 32
-    icon.width: 32
-    icon.height: 32
-    statusListItemIcon.anchors.verticalCenter: sensor.verticalCenter
-    statusListItemIcon.anchors.top: undefined
-    statusListItemIcon.badge.border.width: 2
-    statusListItemIcon.badge.implicitHeight: 12 // 8 px + 2 px * 2 borders
-    statusListItemIcon.badge.implicitWidth: 12 // 8 px + 2 px * 2 borders
-
-    // Trusted type icons definition:
-    titleIcon1.name: "tiny/tiny-contact"
-    titleIcon1.color: Theme.palette.indirectColor1
-    titleIcon1.background.color: Theme.palette.primaryColor1
-    // None and Untrustworthy types, same aspect (Icon will not be visible in case of None type):
-    titleIcon2.name: trustIndicator === StatusMemberListItem.TrustedType.Verified ? "tiny/tiny-checkmark" : "tiny/subtract"
-    titleIcon2.color: Theme.palette.indirectColor1
-    titleIcon2.background.color: trustIndicator === StatusMemberListItem.TrustedType.Verified ? Theme.palette.primaryColor1 : Theme.palette.dangerColor1
-}

src/StatusQ/Components/StatusMessage.qml

@@ -1,211 +0,0 @@
-import QtQuick 2.14
-import QtQuick.Layouts 1.14
-
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-import StatusQ.Controls 0.1
-
-import "./private/statusMessage"
-
-Rectangle {
-    id: statusMessage
-
-    enum ContentType {
-        Unknown = 0,
-        Text = 1,
-        Emoji = 2,
-        Image = 3,
-        Sticker = 4,
-        Audio = 5,
-        Transaction = 6,
-        Invitation = 7
-    }
-
-    enum ContactType {
-        STANDARD = 0,
-        RENAME = 1,
-        CONTACT = 2,
-        VERIFIED = 3,
-        UNTRUSTWORTHY = 4
-    }
-
-    property alias messageHeader: messageHeader
-    property alias quickActions:quickActionsPanel.quickActions
-    property alias statusChatInput: editComponent.inputComponent
-    property alias linksComponent: linksLoader.sourceComponent
-    property alias footerComponent: footer.sourceComponent
-    property alias timestamp: messageHeader.timestamp
-
-    property string resendText: ""
-    property string cancelButtonText: ""
-    property string saveButtonText: ""
-    property string loadingImageText: ""
-    property string errorLoadingImageText: ""
-    property string audioMessageInfoText: ""
-    property string pinnedMsgInfoText: ""
-
-    property bool isAppWindowActive: false
-    property bool editMode: false
-    property bool isAReply: false
-    property StatusMessageDetails messageDetails: StatusMessageDetails {}
-    property StatusMessageDetails replyDetails: StatusMessageDetails {}
-
-    signal profilePictureClicked()
-    signal senderNameClicked()
-    signal editCompleted(var newMsgText)
-    signal replyProfileClicked()
-    signal stickerLoaded()
-    signal imageClicked(var imageSource)
-    signal resendClicked()
-
-    height: childrenRect.height
-    color: hoverHandler.hovered ? (messageDetails.hasMention ? Theme.palette.mentionColor3 : messageDetails.isPinned ? Theme.palette.pinColor2 :  Theme.palette.baseColor2) : messageDetails.hasMention  ? Theme.palette.mentionColor4 : messageDetails.isPinned ? Theme.palette.pinColor3 : "transparent"
-
-    HoverHandler {
-        id: hoverHandler
-    }
-
-    ColumnLayout {
-        id: messageLayout
-        width: parent.width
-        StatusMessageReply {
-            Layout.fillWidth: true
-            visible: isAReply
-            replyDetails: statusMessage.replyDetails
-            onReplyProfileClicked: statusMessage.replyProfileClicked()
-            audioMessageInfoText: statusMessage.audioMessageInfoText
-        }
-        RowLayout {
-            spacing: 8
-            Layout.fillWidth: true
-            StatusSmartIdenticon {
-                id: profileImage
-                Layout.alignment: Qt.AlignTop
-                Layout.topMargin: 10
-                Layout.leftMargin: 16
-                image: messageDetails.profileImage
-                name: messageHeader.displayName
-                MouseArea {
-                    cursorShape: Qt.PointingHandCursor
-                    acceptedButtons: Qt.LeftButton | Qt.RightButton
-                    anchors.fill: parent
-                    onClicked: statusMessage.profilePictureClicked()
-                }
-            }
-            Column {
-                spacing: 4
-                Layout.alignment: Qt.AlignTop
-                Layout.topMargin: 10
-                Layout.fillWidth: true
-                StatusPinMessageDetails {
-                    visible: messageDetails.isPinned && !editMode
-                    pinnedMsgInfoText: statusMessage.pinnedMsgInfoText
-                    pinnedBy: messageDetails.pinnedBy
-                }
-                StatusMessageHeader {
-                    id: messageHeader
-                    width: parent.width
-                    displayName: messageDetails.displayName
-                    secondaryName: messageDetails.secondaryName
-                    tertiaryDetail: messageDetails.chatID
-                    icon1.name: messageDetails.contactType === StatusMessage.ContactType.CONTACT ? "tiny/tiny-contact" : ""
-                    icon2.name: messageDetails.contactType === StatusMessage.ContactType.VERIFIED ? "tiny/tiny-checkmark" :
-                                messageDetails.contactType === StatusMessage.ContactType.UNTRUSTWORTHY ? "tiny/subtract": ""
-                    icon2.background.color:  messageDetails.contactType === StatusMessage.ContactType.UNTRUSTWORTHY ? Theme.palette.dangerColor1 : Theme.palette.primaryColor1
-                    icon2.color: Theme.palette.indirectColor1
-                    resendText: statusMessage.resendText
-                    showResendButton: messageDetails.hasExpired && messageDetails.amISender
-                    onClicked: statusMessage.senderNameClicked()
-                    onResendClicked: statusMessage.resendClicked()
-                    visible: !editMode
-                }
-                Loader {
-                    active: !editMode && !!messageDetails.messageText
-                    width: parent.width
-                    visible: active
-                    sourceComponent: StatusTextMessage {
-                        width: parent.width
-                        textField.text: messageDetails.messageText
-                    }
-                }
-                Loader {
-                    active: messageDetails.contentType === StatusMessage.ContentType.Image && !editMode
-                    visible: active
-                    sourceComponent: StatusImageMessage {
-                        source: messageDetails.contentType === StatusMessage.ContentType.Image ? messageDetails.messageContent : ""
-                        onClicked: statusMessage.imageClicked()
-                        shapeType: messageDetails.amISender ? StatusImageMessage.ShapeType.RIGHT_ROUNDED : StatusImageMessage.ShapeType.LEFT_ROUNDED
-                    }
-                }
-                StatusSticker {
-                    visible: messageDetails.contentType === StatusMessage.ContentType.Sticker && !editMode
-                    image.source: messageDetails.messageContent
-                    onLoaded: statusMessage.stickerLoaded()
-                }
-                Loader {
-                    active: messageDetails.contentType === StatusMessage.ContentType.Audio && !editMode
-                    visible: active
-                    sourceComponent: StatusAudioMessage {
-                        audioSource: messageDetails.messageContent
-                        hovered: hoverHandler.hovered
-                        audioMessageInfoText: statusMessage.audioMessageInfoText
-                    }
-                }
-                Loader {
-                    id: linksLoader
-                    active: !!linksLoader.sourceComponent
-                    visible: active
-                }
-                Loader {
-                    id: transactionBubbleLoader
-                    active: messageDetails.contentType === StatusMessage.ContentType.Transaction && !editMode
-                    visible: active
-                }
-                Loader {
-                    id: invitationBubbleLoader
-                    active: messageDetails.contentType === StatusMessage.ContentType.Invitation && !editMode
-                    visible: active
-                }
-                StatusEditMessage {
-                    id: editComponent
-                    width: parent.width
-                    msgText: messageDetails.messageText
-                    visible: editMode
-                    saveButtonText: statusMessage.saveButtonText
-                    cancelButtonText: statusMessage.cancelButtonText
-                    onCancelEditClicked: editMode = false
-                    onEditCompleted: {
-                        editMode = false
-                        statusMessage.editCompleted(newMsgText)
-                    }
-                }
-                StatusBaseText {
-                    id: retryLbl
-                    color: Theme.palette.dangerColor1
-                    text: statusMessage.resendText
-                    font.pixelSize: 12
-                    visible: messageDetails.hasExpired && messageDetails.amISender && !messageDetails.timestamp && !editMode
-                    MouseArea {
-                        cursorShape: Qt.PointingHandCursor
-                        anchors.fill: parent
-                        onClicked: statusMessage.resendClicked()
-                    }
-                }
-                Loader {
-                    id: footer
-                    active: sourceComponent && !editMode
-                    visible: active
-                }
-            }
-        }
-    }
-
-    StatusMessageQuickActions {
-        id: quickActionsPanel
-        anchors.right: parent.right
-        anchors.rightMargin: 20
-        anchors.top: parent.top
-        anchors.topMargin: -8
-        visible: hoverHandler.hovered && !editMode
-    }
-}

src/StatusQ/Components/StatusMessageDetails.qml

@@ -1,28 +0,0 @@
-import QtQuick 2.13
-
-import StatusQ.Core 0.1
-
-QtObject {
-    id: msgDetails
-
-    property bool amISender: false
-    property string displayName: ""
-    property string secondaryName: ""
-    property string chatID: ""
-    property StatusImageSettings profileImage: StatusImageSettings {
-        width: 40
-        height: 40
-    }
-    property bool isEdited: false
-    property string messageText: ""
-    property int contentType: 0
-    property string messageContent: ""
-    property int contactType: 0
-    property bool hasMention: false
-    property bool isPinned: false
-    property string pinnedBy: ""
-    property bool hasExpired: false
-    property string timestamp: ""
-}
-
-

src/StatusQ/Components/StatusSmartIdenticon.qml

@@ -7,9 +7,6 @@ Loader {
 
     property string name: ""
 
-    // Badge color properties must be set if badgeItem.visible = true
-    property alias badge: statusBadge
-
     property StatusIconSettings icon: StatusIconSettings {
         width: 40
         height: 40
@@ -78,16 +75,4 @@ Loader {
             letterSize: statusSmartIdenticon.icon.letterSize
         }
     }
-
-    // State component
-    StatusBadge {
-        id: statusBadge
-        visible: false
-        anchors.bottom: statusSmartIdenticon.bottom
-        anchors.right: statusSmartIdenticon.right
-        border.width: 3
-        implicitHeight: 15
-        implicitWidth: 15
-        z: 100
-    }
 }

src/StatusQ/Components/private/statusMessage/StatusAudioMessage.qml

@@ -1,143 +0,0 @@
-import QtQuick 2.3
-import QtMultimedia 5.14
-import QtQuick.Layouts 1.14
-
-import StatusQ.Controls 0.1
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-
-// To-do update as per latest design -> Audio graphs. Also the player should ideally be in the BE?
-Rectangle {
-    id: audioChatMessage
-
-    property string audioMessageInfoText: ""
-    property bool isPreview: false
-    property bool hovered: false
-    property string audioSource: ""
-
-    width: 320
-    height: 32
-    radius: 20
-
-    color: hovered ? Theme.palette.directColor8 : Theme.palette.baseColor2
-
-    Audio {
-        id: audioMessage
-        source: audioSource
-        notifyInterval: 150
-    }
-
-    RowLayout {
-        id: preview
-        visible: isPreview
-        spacing: 5
-        anchors.centerIn: parent
-        StatusIcon {
-            id: icon
-            Layout.alignment: Qt.AlignVCenter
-            Layout.preferredWidth: 14
-            Layout.preferredHeight: 14
-            icon: "audio"
-            color: Theme.palette.baseColor1
-        }
-        StatusBaseText {
-            Layout.alignment: Qt.AlignVCenter
-            color: Theme.palette.baseColor1
-            text: audioMessageInfoText
-            font.pixelSize: 13
-        }
-    }
-
-    StatusFlatRoundButton {
-        id: playButton
-        width: 15
-        height: 15
-        anchors.left: parent.left
-        anchors.leftMargin: 16
-        anchors.verticalCenter: parent.verticalCenter
-        visible: !isPreview
-
-        type: StatusFlatRoundButton.Type.Tertiary
-        color: "transparent"
-        icon.name: audioMessage.playbackState == Audio.PlayingState ? "pause-filled" : "play-filled"
-        icon.color: Theme.palette.directColor1
-
-        onClicked: {
-            if(audioMessage.playbackState === Audio.PlayingState){
-                audioMessage.pause();
-            } else {
-                audioMessage.play();
-            }
-
-        }
-    }
-    
-    Rectangle {
-        height: 2
-        width: 240
-        color: Theme.palette.directColor5
-        anchors.verticalCenter: parent.verticalCenter
-        anchors.left: playButton.right
-        anchors.leftMargin: 10
-        visible: !isPreview
-        Rectangle {
-            id: progress
-            height: 2
-            width: {
-                if(audioMessage.duration === 0) return 0;
-                if(audioMessage.playbackState === Audio.StoppedState) return 0;
-                return parent.width * audioMessage.position / audioMessage.duration;
-            }
-            color: Theme.palette.directColor5
-            anchors.verticalCenter: parent.verticalCenter
-        }
-
-        Rectangle {
-            id: handle
-            width: 10
-            height: 10
-            color: Theme.palette.directColor1
-            radius: 10
-            anchors.verticalCenter: parent.verticalCenter
-            x: progress.width
-            state: "default"
-
-            states: State {
-                name: "pressed"
-                when: handleMouseArea.pressed
-                PropertyChanges {
-                    target: handle;
-                    scale: 1.2
-                }
-            }
-            transitions: Transition {
-                NumberAnimation {
-                    properties: "scale";
-                    duration: 100;
-                    easing.type: Easing.InOutQuad
-                }
-            }
-
-            MouseArea {
-                id: handleMouseArea
-                cursorShape: Qt.PointingHandCursor
-                anchors.fill: parent
-                drag.target: parent
-                drag.axis: Drag.XAxis
-                drag.minimumX: 0
-                drag.maximumX: parent.parent.width
-                onPressed: {
-                    handle.state = "pressed"
-                    if(audioMessage.playbackState === Audio.PlayingState) {
-                        audioMessage.pause();
-                    }
-                }
-                onReleased: {
-                    handle.state = "default"
-                    audioMessage.seek(audioMessage.duration * handle.x / parent.parent.width)
-                    audioMessage.play()
-                }
-            }
-        }
-    }
-}

src/StatusQ/Components/private/statusMessage/StatusEditMessage.qml

@@ -1,51 +0,0 @@
-import QtQuick 2.3
-import QtQuick.Layouts 1.14
-
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-import StatusQ.Controls 0.1
-
-Item {
-    id: editText
-
-    property alias inputComponent: chatInputLoader.sourceComponent
-
-    property string cancelButtonText: ""
-    property string saveButtonText: ""
-    property string msgText: ""
-
-    signal cancelEditClicked()
-    signal editCompleted(var newMsgText)
-
-    height: childrenRect.height
-
-    ColumnLayout {
-        spacing: 4
-        Loader {
-            id: chatInputLoader
-            // To-Do: Move to StatusChatInput once its moved to StatusQ
-            sourceComponent: StatusInput {
-                width: editText.width
-                input.placeholderText: ""
-                input.text: msgText
-                input.implicitHeight: 40
-            }
-        }
-        RowLayout {
-            spacing: 4
-            StatusFlatButton {
-                id: cancelBtn
-                text: cancelButtonText
-                size: StatusBaseButton.Size.Small
-                onClicked: cancelEditClicked()
-            }
-            StatusButton {
-                id: saveBtn
-                text: saveButtonText
-                size: StatusBaseButton.Size.Small
-                enabled: chatInputLoader.item.input.text.trim().length > 0
-                onClicked: editCompleted(chatInputLoader.item.input.text)
-            }
-        }
-    }
-}

src/StatusQ/Components/private/statusMessage/StatusImageMessage.qml

@@ -1,114 +0,0 @@
-import QtQuick 2.3
-import QtGraphicalEffects 1.13
-
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-
-Item {
-    id: imageContainer
-
-    enum ShapeType {
-        ROUNDED = 0,
-        LEFT_ROUNDED = 1,
-        RIGHT_ROUNDED = 2
-    }
-
-    property alias imageAlias: imageMessage
-
-    property bool isAppWindowActive: false
-    property url source: ""
-    property bool allCornersRounded: false
-    property bool isLeftCorner: true
-    property int imageWidth: 350
-    property int shapeType: -1
-
-    property string loadingImageText: ""
-    property string errorLoadingImageText: ""
-
-    signal clicked(var image, var mouse)
-
-    width: loadingImage.visible ? loadingImage.width : imageMessage.width
-    height: loadingImage.visible ? loadingImage.height : imageMessage.paintedHeight
-
-    QtObject {
-        id: _internal
-        property bool isAnimated: !!source && source.toString().endsWith('.gif')
-        property bool pausePlaying: false
-    }
-
-    AnimatedImage {
-        id: imageMessage
-
-        width: sourceSize.width > imageWidth ? imageWidth : sourceSize.width
-        fillMode: Image.PreserveAspectFit
-        source: imageContainer.source
-        playing: _internal.isAnimated && isAppWindowActive && !_internal.pausePlaying
-
-        layer.enabled: true
-        layer.effect: OpacityMask {
-            maskSource: Item {
-                width: imageMessage.width
-                height: imageMessage.height
-
-                Rectangle {
-                    anchors.top: parent.top
-                    anchors.left: parent.left
-                    width: imageMessage.width
-                    height: imageMessage.height
-                    radius: 16
-                }
-                Rectangle {
-                    anchors.bottom: parent.bottom
-                    anchors.left: parent.left
-                    width: 32
-                    height: 32
-                    radius: 4
-                    visible: shapeType === StatusImageMessage.ShapeType.LEFT_ROUNDED //!isLeftCorner && !allCornersRounded
-                }
-                Rectangle {
-                    anchors.bottom: parent.bottom
-                    anchors.right: parent.right
-                    width: 32
-                    height: 32
-                    radius: 4
-                    visible: shapeType === StatusImageMessage.ShapeType.RIGHT_ROUNDED  //isLeftCorner && !allCornersRounded
-                }
-            }
-        }
-
-        MouseArea {
-            cursorShape: Qt.PointingHandCursor
-            acceptedButtons: Qt.LeftButton | Qt.RightButton
-            anchors.fill: parent
-            onClicked: {
-                if (imageContainer.isAnimated) {
-                    // FIXME the ListView completely removes Items that scroll out of view
-                    // so when we scroll backto the image, it gets reloaded and playing is reset
-                    _internal.pausePlaying = ! _internal.pausePlaying
-                    return
-                }
-                imageContainer.clicked(imageMessage, mouse)
-            }
-        }
-    }
-
-    Rectangle {
-        id: loadingImage
-        visible: imageMessage.status === Image.Loading
-                 || imageMessage.status === Image.Error
-        width: parent.width
-        height: width
-        border.width: 1
-        border.color: Theme.palette.baseColor2
-        radius: 8
-
-        StatusBaseText {
-            anchors.centerIn: parent
-            text: imageMessage.status === Image.Error ? errorLoadingImageText: loadingImageText
-            color: imageMessage.status === Image.Error?
-                       Theme.palette.dangerColor1 :
-                       Theme.palette.directColor1
-            font.pixelSize: 15
-        }
-    }
-}

src/StatusQ/Components/private/statusMessage/StatusMessageHeader.qml

@@ -1,158 +0,0 @@
-import QtQuick 2.14
-import QtQuick.Layouts 1.14
-
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-import StatusQ.Components 0.1
-import StatusQ.Controls 0.1
-
-Item {
-    id: statusMessageHeader
-
-    property alias displayNameLabel: primaryDisplayName
-    property alias secondaryNameLabel: secondaryDisplayName
-    property alias tertiaryDetailsLabel: tertiaryDetailText
-    property alias timestamp: timestampText
-
-    property string displayName: ""
-    property string secondaryName: ""
-    property string tertiaryDetail: ""
-    property string resendText: ""
-    property bool showResendButton: false
-    property StatusIconSettings icon1: StatusIconSettings {
-        width: dummyImage.width
-        height: dummyImage.height
-        rotation: 0
-        color: Theme.palette.indirectColor1
-        background: StatusIconBackgroundSettings {
-            width: 10
-            height: 10
-            color: Theme.palette.primaryColor1
-        }
-        // only used to get implicit width and height from the actual image
-        property Image dummyImage: Image {
-            source: icon1.name ? "../../../../assets/img/icons/" + icon1.name + ".svg": ""
-            visible: false
-        }
-    }
-    property StatusIconSettings icon2: StatusIconSettings {
-        width: dummyImage.width
-        height: dummyImage.height
-        rotation: 0
-        color: Theme.palette.primaryColor1
-        background: StatusIconBackgroundSettings {
-            width: 10
-            height: 10
-            color: Theme.palette.indirectColor1
-        }
-        // only used to get implicit width and height from the actual image
-        property Image dummyImage: Image {
-            source: icon2.name ? "../../../../assets/img/icons/" + icon2.name + ".svg": ""
-            visible: false
-        }
-    }
-
-    signal clicked()
-    signal resendClicked()
-
-    height: childrenRect.height
-    width: primaryDisplayName.width + (secondaryDisplayName.visible ? secondaryDisplayName.width + header.spacing : 0)
-
-    RowLayout {
-        id: header
-        spacing: 4
-        TextEdit {
-            id: primaryDisplayName
-            font.family: Theme.palette.baseFont.name
-            font.weight: Font.Medium
-            font.pixelSize: 15
-            font.underline: mouseArea.containsMouse
-            readOnly: true
-            wrapMode: Text.WordWrap
-            selectByMouse: true
-            color: Theme.palette.primaryColor1
-            text: displayName
-            MouseArea {
-                id: mouseArea
-                anchors.fill: parent
-                cursorShape: Qt.PointingHandCursor
-                acceptedButtons: Qt.LeftButton | Qt.RightButton
-                hoverEnabled: true
-                onClicked: {
-                    statusMessageHeader.clicked()
-                }
-            }
-            Layout.alignment: Qt.AlignBottom
-        }
-        StatusRoundIcon {
-            icon.background.width: icon1.background.width
-            icon.background.height: icon1.background.height
-            icon.background.color: icon1.background.color
-            icon.width: icon1.width
-            icon.height: icon1.height
-            icon.name: icon1.name
-            icon.rotation: icon1.rotation
-            icon.color: icon1.color
-            visible: !!icon.name
-        }
-        StatusRoundIcon {
-            icon.background.width: icon2.background.width
-            icon.background.height: icon2.background.height
-            icon.background.color: icon2.background.color
-            icon.width: icon2.width
-            icon.height: icon2.height
-            icon.name: icon2.name
-            icon.rotation: icon2.rotation
-            icon.color: icon2.color
-            visible: !!icon.name
-        }
-        StatusBaseText {
-            id: secondaryDisplayName
-            Layout.alignment: Qt.AlignVCenter
-            color: Theme.palette.baseColor1
-            font.pixelSize: 10
-            text: secondaryName
-            visible: !!text
-        }
-        StatusBaseText {
-            id: dotSeparator1
-            Layout.fillHeight: true
-            font.pixelSize: 10
-            color: Theme.palette.baseColor1
-            text: "."
-            visible: secondaryDisplayName.visible
-        }
-        StatusBaseText {
-            id: tertiaryDetailText
-            Layout.alignment: Qt.AlignVCenter
-            Layout.maximumWidth: 58
-            font.pixelSize: 10
-            elide: Text.ElideMiddle
-            color: Theme.palette.baseColor1
-            text: tertiaryDetail
-        }
-        StatusBaseText {
-            id: dotSeparator2
-            Layout.fillHeight: true
-            font.pixelSize: 10
-            color: Theme.palette.baseColor1
-            text: "."
-            visible: tertiaryDetailText.visible
-        }
-        StatusTimeStampLabel {
-            id: timestampText
-        }
-        StatusBaseText {
-            Layout.alignment: Qt.AlignVCenter
-            color: Theme.palette.dangerColor1
-            font.pixelSize: 12
-            text: statusMessageHeader.resendText
-            visible: showResendButton && !!timestampText.text
-            MouseArea {
-                cursorShape: Qt.PointingHandCursor
-                anchors.fill: parent
-                onClicked: statusMessageHeader.resendClicked()
-            }
-        }
-    }
-}

src/StatusQ/Components/private/statusMessage/StatusMessageQuickActions.qml

@@ -1,51 +0,0 @@
-import QtQuick 2.13
-import QtGraphicalEffects 1.13
-import QtQuick.Layouts 1.14
-
-import StatusQ.Controls 0.1
-import StatusQ.Core.Theme 0.1
-
-Rectangle {
-    id: buttonsContainer
-
-    property list<Item> quickActions
-
-    QtObject {
-        id: _internal
-        readonly property int containerMargin: 2
-    }
-
-    width: buttonRow.width + _internal.containerMargin * 2
-    height: 36
-    radius: 8
-    color: Theme.palette.statusSelect.menuItemBackgroundColor
-
-    layer.enabled: true
-    layer.effect: DropShadow {
-        width: buttonsContainer.width
-        height: buttonsContainer.height
-        x: buttonsContainer.x
-        y: buttonsContainer.y + 10
-        horizontalOffset: 0
-        verticalOffset: 2
-        source: buttonsContainer
-        radius: 10
-        samples: 15
-        color: Theme.palette.dropShadow
-    }
-
-    Row {
-        id: buttonRow
-        spacing: _internal.containerMargin
-        anchors.left: parent.left
-        anchors.leftMargin: _internal.containerMargin
-        anchors.verticalCenter: buttonsContainer.verticalCenter
-        height: parent.height - 2 * _internal.containerMargin
-    }
-
-    onQuickActionsChanged: {
-        for (let idx in quickActions) {
-            quickActions[idx].parent = buttonRow
-        }
-    }
-}

src/StatusQ/Components/private/statusMessage/StatusMessageReply.qml

@@ -1,125 +0,0 @@
-import QtQuick 2.14
-import QtQuick.Shapes 1.13
-import QtGraphicalEffects 1.13
-import QtQuick.Layouts 1.14
-
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-import StatusQ.Components 0.1
-
-Loader {
-    id: chatReply
-
-    property StatusMessageDetails replyDetails
-    property string audioMessageInfoText: ""
-
-    signal replyProfileClicked()
-
-    active: visible
-
-    sourceComponent: RowLayout {
-        id: replyLayout
-        spacing: 8
-        Shape {
-            id: replyCorner
-            Layout.alignment: Qt.AlignTop
-            Layout.leftMargin: 35
-            Layout.topMargin: profileImage.height/2
-            Layout.preferredWidth: 20
-            Layout.preferredHeight: messageLayout.height - replyCorner.Layout.topMargin
-            asynchronous: true
-            antialiasing: true
-            ShapePath {
-                strokeColor: Qt.hsla(Theme.palette.baseColor1.hslHue, Theme.palette.baseColor1.hslSaturation, Theme.palette.baseColor1.hslLightness, 0.4)
-                strokeWidth: 3
-                fillColor: "transparent"
-                capStyle: ShapePath.RoundCap
-                joinStyle: ShapePath.RoundJoin
-                startX: 20
-                startY: 0
-                PathLine { x: 10; y: 0 }
-                PathArc {
-                    x: 0; y: 10
-                    radiusX: 13
-                    radiusY: 13
-                    direction: PathArc.Counterclockwise
-                }
-                PathLine { x: 0; y: messageLayout.height}
-            }
-        }
-        ColumnLayout {
-            id: messageLayout
-            Layout.fillWidth: true
-            Layout.alignment: Qt.AlignTop
-            Layout.topMargin: 4
-            RowLayout {
-                StatusSmartIdenticon {
-                    id: profileImage
-                    Layout.alignment: Qt.AlignTop
-                    image: replyDetails.profileImage
-                    name: replyDetails.displayName
-                    MouseArea {
-                        cursorShape: Qt.PointingHandCursor
-                        acceptedButtons: Qt.LeftButton | Qt.RightButton
-                        anchors.fill: parent
-                        onClicked: replyProfileClicked()
-                    }
-                }
-                TextEdit {
-                    Layout.alignment: Qt.AlignVCenter
-                    color: Theme.palette.baseColor1
-                    selectionColor: Theme.palette.primaryColor3
-                    selectedTextColor: Theme.palette.directColor1
-                    font.pixelSize: 13
-                    font.weight: Font.Medium
-                    selectByMouse: true
-                    readOnly: true
-                    text: replyDetails.displayName
-                }
-            }
-            StatusTextMessage {
-                Layout.fillWidth: true
-                textField.text: replyDetails.messageText
-                textField.font.pixelSize: 13
-                textField.color: Theme.palette.baseColor1
-                textField.height: 18
-                clip: true
-                visible: !!replyDetails.messageText
-            }
-            StatusImageMessage {
-                Layout.fillWidth: true
-                Layout.preferredHeight: imageAlias.paintedHeight
-                imageWidth: 56
-                source: replyDetails.contentType === StatusMessage.ContentType.Image ? replyDetails.messageContent : ""
-                visible: replyDetails.contentType === StatusMessage.ContentType.Image
-                shapeType: StatusImageMessage.ShapeType.ROUNDED
-            }
-            Item {
-                Layout.fillWidth: true
-                Layout.preferredHeight: 48
-                Layout.alignment: Qt.AlignLeft
-                visible: replyDetails.contentType === StatusMessage.ContentType.Sticker
-                StatusSticker {
-                    image.width: 48
-                    image.height: 48
-                    image.source: replyDetails.messageContent
-                }
-            }
-            Item {
-                Layout.fillWidth: true
-                Layout.preferredHeight: 22
-                visible: replyDetails.contentType === StatusMessage.ContentType.Audio
-                StatusAudioMessage {
-                    id: audioMessage
-                    anchors.left: parent.left
-                    width: 125
-                    height: 22
-                    isPreview: true
-                    audioSource: replyDetails.messageContent
-                    audioMessageInfoText: chatReply.audioMessageInfoText
-                }
-            }
-        }
-    }
-}
-

src/StatusQ/Components/private/statusMessage/StatusPinMessageDetails.qml

@@ -1,46 +0,0 @@
-import QtQuick 2.13
-import QtQuick.Layouts 1.14
-import QtGraphicalEffects 1.13
-
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-
-Loader {
-    property string pinnedMsgInfoText: ""
-    property string pinnedBy: ""
-
-    active: visible
-
-    sourceComponent: Rectangle {
-        height: 24
-        width: layout.width + 16
-        color: Theme.palette.pinColor2
-        radius: 12
-        RowLayout {
-            id: layout
-            anchors.centerIn: parent
-            StatusIcon {
-                Layout.alignment: Qt.AlignVCenter
-                Layout.preferredWidth: 16
-                Layout.preferredHeight: 16
-                color: Theme.palette.pinColor1
-                icon: "tiny/pin"
-            }
-            StatusBaseText {
-                Layout.alignment: Qt.AlignVCenter
-                Layout.leftMargin: -4
-                color: Theme.palette.directColor1
-                font.pixelSize: 13
-                text: pinnedMsgInfoText
-            }
-            StatusBaseText {
-                Layout.alignment: Qt.AlignVCenter
-                Layout.leftMargin: -4
-                color: Theme.palette.directColor1
-                font.pixelSize: 13
-                font.weight: Font.Medium
-                text: pinnedBy
-            }
-        }
-    }
-}

src/StatusQ/Components/private/statusMessage/StatusSticker.qml

@@ -1,125 +0,0 @@
-import QtQuick 2.3
-import QtGraphicalEffects 1.13
-
-import StatusQ.Components 0.1
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-
-Loader {
-    id: statusSticker
-
-    property bool noHover: false
-    property bool noMouseArea: false
-    property StatusImageSettings image: StatusImageSettings {
-        width: 140
-        height: 140
-    }
-
-    signal loaded()
-    signal clicked()
-
-    active: visible
-
-    sourceComponent: Rectangle {
-        id: root
-
-        color: Theme.palette.baseColor2
-        radius: 16
-
-        width: image.width
-        height: image.height
-
-        function reload() {
-            // From the documentation (https://doc.qt.io/qt-5/qml-qtquick-image.html#sourceSize-prop)
-            // Note: Changing this property dynamically causes the image source to
-            // be reloaded, potentially even from the network, if it is not in the
-            // disk cache.
-            const oldSource = sticker.source
-            sticker.cache = false
-            sticker.sourceSize.width += 1
-            sticker.sourceSize.width -= 1
-            sticker.cache = true
-        }
-
-        Loader {
-            id: loader
-            anchors.verticalCenter: parent.verticalCenter
-            anchors.horizontalCenter: parent.horizontalCenter
-        }
-
-        Image {
-            id: sticker
-            anchors.fill: parent
-            horizontalAlignment: Image.AlignHCenter
-            verticalAlignment: Image.AlignVCenter
-            cache: true
-            source: image.source
-
-            onStatusChanged: {
-                if (status === Image.Ready) {
-                    statusSticker.loaded()
-                }
-            }
-            MouseArea {
-                enabled: !noMouseArea && (sticker.status === Image.Ready)
-                cursorShape: noHover ? Qt.ArrowCursor : Qt.PointingHandCursor
-                anchors.fill: parent
-                onClicked: statusSticker.clicked()
-            }
-        }
-
-        Component {
-            id: loadingIndicator
-            StatusLoadingIndicator {
-                width: 24
-                height: 24
-                color: Theme.palette.baseColor1
-            }
-        }
-
-        Component {
-            id: reload
-            StatusIcon {
-                icon: "refresh"
-                color: Theme.palette.directColor1
-                mipmap: false
-                MouseArea {
-                    anchors.fill: parent
-                    cursorShape: Qt.PointingHandCursor
-                    onClicked: root.reload()
-                }
-            }
-        }
-
-        states: [
-            State {
-                name: "loading"
-                when: sticker.status === Image.Loading
-                PropertyChanges {
-                    target: loader
-                    sourceComponent: loadingIndicator
-                }
-            },
-            State {
-                name: "error"
-                when: sticker.status === Image.Error
-                PropertyChanges {
-                    target: loader
-                    sourceComponent: reload
-                }
-            },
-            State {
-                name: "ready"
-                when: sticker.status === Image.Ready
-                PropertyChanges {
-                    target: root
-                    color: "transparent"
-                }
-                PropertyChanges {
-                    target: loader
-                    sourceComponent: undefined
-                }
-            }
-        ]
-    }
-}

src/StatusQ/Components/private/statusMessage/StatusTextMessage.qml

@@ -1,87 +0,0 @@
-import QtQuick 2.13
-import QtGraphicalEffects 1.0
-
-import StatusQ.Components 0.1
-import StatusQ.Controls 0.1
-import StatusQ.Core.Theme 0.1
-
-Item {
-    id: textMessage
-
-    property int contentType: 0
-    property alias textField: chatText
-
-    signal linkActivated(url link)
-
-    implicitHeight: showMoreLoader.active ? childrenRect.height : chatText.height
-
-    QtObject {
-        id: _internal
-        property bool readMore: false
-        property bool veryLongChatText: chatText.length > 1000
-    }
-
-    TextEdit {
-        id: chatText
-        visible: !showMoreLoader.active || _internal.readMore
-        selectedTextColor: Theme.palette.directColor1
-        selectionColor: Theme.palette.primaryColor3
-        color: Theme.palette.directColor1
-        font.family: Theme.palette.baseFont.name
-        font.pixelSize: 15
-        textFormat: Text.RichText
-        wrapMode: Text.Wrap
-        readOnly: true
-        selectByMouse: true
-        height: _internal.veryLongChatText && !_internal.readMore ? Math.min(implicitHeight, 200) : implicitHeight
-        width: parent.width
-        clip: height < implicitHeight
-        onLinkActivated: textMessage.linkActivated(link)
-        onLinkHovered: {
-            cursorShape: Qt.PointingHandCursor
-        }
-    }
-
-    Loader {
-        id: mask
-        anchors.fill: chatText
-        active: showMoreLoader.active
-        visible: false
-        sourceComponent: LinearGradient {
-            start: Qt.point(0, 0)
-            end: Qt.point(0, chatText.height)
-            gradient: Gradient {
-                GradientStop { position: 0.0; color: "white" }
-                GradientStop { position: 0.85; color: "white" }
-                GradientStop { position: 1; color: "transparent" }
-            }
-        }
-    }
-
-    Loader {
-        id: opMask
-        active: showMoreLoader.active && !_internal.readMore
-        anchors.fill: chatText
-        sourceComponent: OpacityMask {
-            source: chatText
-            maskSource: mask
-        }
-    }
-
-    Loader {
-        id: showMoreLoader
-        active: _internal.veryLongChatText
-        anchors.top: chatText.bottom
-        anchors.topMargin: -10
-        anchors.horizontalCenter: parent.horizontalCenter
-        sourceComponent: StatusRoundButton {
-            implicitWidth: 24
-            implicitHeight: 24
-            type: StatusRoundButton.Type.Secondary
-            icon.name: _internal.readMore ? "chevron-up":  "chevron-down"
-            onClicked: {
-                _internal.readMore = !_internal.readMore
-            }
-        }
-    }
-}

src/StatusQ/Components/private/statusMessage/StatusTimeStampLabel.qml

@@ -1,24 +0,0 @@
-import QtQuick 2.13
-import QtQuick.Layouts 1.14
-
-import StatusQ.Controls 0.1
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-
-StatusBaseText {
-    id: timestampLabe;
-    property alias tooltip: tooltip
-
-    Layout.alignment: Qt.AlignVCenter
-    color: Theme.palette.baseColor1
-    font.pixelSize: 10
-    visible: !!text
-    StatusToolTip {
-        id: tooltip
-        visible: hhandler.hovered && !!text
-        maxWidth: 350
-    }
-    HoverHandler {
-        id: hhandler
-    }
-}

src/StatusQ/Components/qmldir

@@ -15,7 +15,6 @@ StatusLetterIdenticon 0.1 StatusLetterIdenticon.qml
 StatusListItem 0.1 StatusListItem.qml
 StatusListSectionHeadline 0.1 StatusListSectionHeadline.qml
 StatusLoadingIndicator 0.1 StatusLoadingIndicator.qml
-StatusMemberListItem 0.1 StatusMemberListItem.qml
 StatusNavigationListItem 0.1 StatusNavigationListItem.qml
 StatusNavigationPanelHeadline 0.1 StatusNavigationPanelHeadline.qml
 StatusRoundIcon 0.1 StatusRoundIcon.qml
@@ -24,5 +23,3 @@ StatusMacWindowButtons 0.1 StatusMacWindowButtons.qml
 StatusListItemBadge 0.1 StatusListItemBadge.qml
 StatusExpandableItem 0.1 StatusExpandableItem.qml
 StatusSmartIdenticon 0.1 StatusSmartIdenticon.qml
-StatusMessage 0.1 StatusMessage.qml
-StatusMessageDetails 0.1 StatusMessageDetails.qml

src/StatusQ/Controls/StatusAccountSelector.qml

@@ -46,7 +46,7 @@ Item {
         if (showBalanceForAssetSymbol == "" || minRequiredAssetBalance == 0 || !assetFound) {
             return root.isValid
         }
-        root.isValid = assetFound.balance >= minRequiredAssetBalance
+        root.isValid = assetFound.value >= minRequiredAssetBalance
         return root.isValid
     }
 
@@ -54,8 +54,8 @@ Item {
         if (!selectedAccount) {
             return
         }
-        if (selectedAccount.color) {
-            selectedIconImg.color = Utils.getThemeAccountColor(selectedAccount.color, Theme.palette.accountColors) || Theme.palette.accountColors[0]
+        if (selectedAccount.iconColor) {
+            selectedIconImg.color = Utils.getThemeAccountColor(selectedAccount.iconColor, Theme.palette.accountColors) || Theme.palette.accountColors[0]
         }
         if (selectedAccount.name) {
             selectedTextField.text = selectedAccount.name
@@ -63,8 +63,8 @@ Item {
         if (selectedAccount.address) {
             textSelectedAddress.text = selectedAccount.address  + " •"
         }
-        if (selectedAccount.currencyBalance) {
-            textSelectedAddressFiatBalance.text = selectedAccount.currencyBalance + " " + currency.toUpperCase()
+        if (selectedAccount.fiatBalance) {
+            textSelectedAddressFiatBalance.text = selectedAccount.fiatBalance + " " + currency.toUpperCase()
         }
         if (selectedAccount.assets && showBalanceForAssetSymbol) {
             assetFound = Utils.findAssetBySymbol(selectedAccount.assets, showBalanceForAssetSymbol)
@@ -82,7 +82,7 @@ Item {
         if (!assetFound) {
             return
         }
-        txtAssetBalance.text = root.assetBalanceTextFn(assetFound.balance)
+        txtAssetBalance.text = root.assetBalanceTextFn(assetFound.value)
         txtAssetSymbol.text = " " + assetFound.symbol
     }
 
@@ -90,11 +90,11 @@ Item {
         id: txtAssetBalance
         visible: root.assetFound !== undefined
         anchors.bottom: select.top
-        anchors.bottomMargin: -18
+        anchors.bottomMargin: -18 
         anchors.right: txtAssetSymbol.left
         anchors.left: select.left
         anchors.leftMargin: select.width / 2.5
-
+        
         color: !root.isValid ? Theme.palette.dangerColor1 : Theme.palette.baseColor1
         elide: Text.ElideRight
         font.pixelSize: 13
@@ -194,7 +194,7 @@ Item {
 
             Component.onCompleted: {
                 if (!root.selectedAccount && isFirstItem) {
-                    root.selectedAccount = { address, name, color: model.color, assets, currencyBalance }
+                    root.selectedAccount = { address, name, iconColor, assets, fiatBalance }
                 }
             }
 
@@ -208,7 +208,7 @@ Item {
                 width: 20
                 height: 20
                 icon: "filled-account"
-                color: Utils.getThemeAccountColor(model.color, Theme.palette.accountColors) || Theme.palette.accountColors[0]
+                color: Utils.getThemeAccountColor(iconColor, Theme.palette.accountColors) || Theme.palette.accountColors[0]
             }
 
             Column {
@@ -221,7 +221,7 @@ Item {
 
                 StatusBaseText {
                     id: accountName
-                    text: model.name
+                    text: name
                     elide: Text.ElideRight
                     font.pixelSize: 15
                     anchors.left: parent.left
@@ -247,7 +247,7 @@ Item {
                 anchors.verticalCenter: parent.verticalCenter
                 font.pixelSize: 15
                 height: 22
-                text: currencyBalance
+                text: fiatBalance
                 color: Theme.palette.directColor1
             }
             StatusBaseText {
@@ -267,7 +267,7 @@ Item {
                 cursorShape: Qt.PointingHandCursor
                 anchors.fill: itemContainer
                 onClicked: {
-                    root.selectedAccount = { address, name, color: model.color, assets, currencyBalance }
+                    root.selectedAccount = { address, name, iconColor, assets, fiatBalance }
                     select.selectMenu.close()
                 }
             }

src/StatusQ/Controls/StatusAssetSelector.qml

@@ -12,12 +12,17 @@ Item {
     id: root
     property var assets
     property var selectedAsset
-    property string defaultToken: ""
     property var tokenAssetSourceFn: function (symbol) {
         return ""
     }
-    // Define this in the usage to get balance in currency selected by user
-    property var getCurrencyBalanceString: function (currencyBalance) { return "" }
+    property var assetGetterFn: function (index, field) {
+        // This is merely to make the component work with nim model data
+        // as well as static QML ListModel data
+        if (typeof assets.get === "function") {
+            return assets.get(index)[field]
+        }
+        return assets.rowData(index, field)
+    }
     implicitWidth: 86
     implicitHeight: 32
 
@@ -33,6 +38,20 @@ Item {
         }
     }
 
+    onAssetsChanged: {
+        if (!assets) {
+            return
+        }
+        selectedAsset = {
+            name: assetGetterFn(0, "name"),
+            symbol: assetGetterFn(0, "symbol"),
+            value: assetGetterFn(0, "value"),
+            fiatBalanceDisplay: assetGetterFn(0, "fiatBalanceDisplay"),
+            address: assetGetterFn(0, "address"),
+            fiatBalance: assetGetterFn(0, "fiatBalance")
+        }
+    }
+
     StatusSelect {
         id: select
         width: parent.width
@@ -52,11 +71,6 @@ Item {
                 width: 24
                 height: 24
                 anchors.verticalCenter: parent.verticalCenter
-                image.onStatusChanged: {
-                    if (iconImg.image.status === Image.Error) {
-                        iconImg.image.source = defaultToken
-                    }
-                }
             }
             StatusBaseText {
                 id: selectedTextField
@@ -87,11 +101,6 @@ Item {
                 anchors.leftMargin: 16
                 anchors.verticalCenter: parent.verticalCenter
                 image.source: root.tokenAssetSourceFn(symbol.toUpperCase())
-                image.onStatusChanged: {
-                    if (iconImg.image.status === Image.Error) {
-                        iconImg.image.source = defaultToken
-                    }
-                }
             }
             Column {
                 anchors.left: iconImg.right
@@ -116,28 +125,23 @@ Item {
                 anchors.verticalCenter: parent.verticalCenter
                 StatusBaseText {
                     font.pixelSize: 15
-                    text: parseFloat(balance).toFixed(4) + " " + symbol
+                    text: parseFloat(value).toFixed(4) + " " + symbol
                 }
                 StatusBaseText {
                     font.pixelSize: 15
                     anchors.right: parent.right
-                    text: getCurrencyBalanceString(currencyBalance)
+                    text: fiatBalanceDisplay.toUpperCase()
                     color: Theme.palette.baseColor1
                 }
             }
             background: Rectangle {
                 color: itemContainer.highlighted ? Theme.palette.statusSelect.menuItemHoverBackgroundColor : Theme.palette.statusSelect.menuItemBackgroundColor
             }
-            Component.onCompleted: {
-                if(index === 0 ) {
-                    selectedAsset = { name: name, symbol: symbol, address: address, balance: balance, currencyBalance: currencyBalance}
-                }
-            }
             MouseArea {
                 cursorShape: Qt.PointingHandCursor
                 anchors.fill: itemContainer
                 onClicked: {
-                    selectedAsset = {name: name, symbol: symbol, address: address, balance: balance, currencyBalance: currencyBalance}
+                    root.selectedAsset = { address, name, value, symbol, fiatBalance, fiatBalanceDisplay }
                     select.selectMenu.close()
                 }
             }

src/StatusQ/Controls/StatusBanner.qml

@@ -1,89 +0,0 @@
-import QtQuick 2.14
-
-import StatusQ.Core 0.1
-import StatusQ.Core.Theme 0.1
-
-Column {
-    id: statusBanner
-    width: parent.width
-
-    property string statusText
-    property int type: StatusBanner.Type.Info
-    property int textPixels: 15
-    property int statusBannerHeight: 38
-
-    // "private" properties
-    QtObject {
-           id: d
-           property color backgroundColor
-           property color bordersColor
-           property color fontColor
-    }
-
-    enum Type {
-        Info, // 0
-        Danger, // 1
-        Success, // 2
-        Warning // 3
-    }    
-
-    // Component definition
-    Rectangle {
-        id: topDiv
-        color: d.bordersColor
-        height: 1
-        width: parent.width
-    }
-
-    Rectangle {
-        id: box
-        width: parent.width
-        height: statusBanner.statusBannerHeight
-        color: d.backgroundColor
-
-        StatusBaseText {
-            id: statusTxt
-            anchors.fill: parent
-            horizontalAlignment: Text.AlignHCenter
-            verticalAlignment: Text.AlignVCenter
-            font.pixelSize: statusBanner.textPixels
-            text: statusBanner.statusText
-            color: d.fontColor
-        }
-    }
-
-    Rectangle {
-        id: bottomDiv
-        color: d.bordersColor
-        height: 1
-        width: parent.width
-    }
-
-    // Behavior
-    states: [
-        State {
-            when: statusBanner.type === StatusBanner.Type.Info
-            PropertyChanges { target: d; backgroundColor: Theme.palette.primaryColor3}
-            PropertyChanges { target: d; bordersColor: Theme.palette.primaryColor2}
-            PropertyChanges { target: d; fontColor: Theme.palette.primaryColor1}
-        },
-        State {
-            when: statusBanner.type === StatusBanner.Type.Danger
-            PropertyChanges { target: d; backgroundColor: Theme.palette.dangerColor3}
-            PropertyChanges { target: d; bordersColor: Theme.palette.dangerColor2}
-            PropertyChanges { target: d; fontColor: Theme.palette.dangerColor1}
-        },
-        State {
-            when: statusBanner.type === StatusBanner.Type.Success
-            PropertyChanges { target: d; backgroundColor: Theme.palette.successColor2}
-            PropertyChanges { target: d; bordersColor: Theme.palette.successColor2}
-            PropertyChanges { target: d; fontColor: Theme.palette.successColor1}
-        },
-        State {
-            when: statusBanner.type === StatusBanner.Type.Warning
-            PropertyChanges { target: d; backgroundColor: Theme.palette.pinColor3}
-            PropertyChanges { target: d; bordersColor: Theme.palette.pinColor2}
-            PropertyChanges { target: d; fontColor: Theme.palette.pinColor1}
-        }
-    ]
-}

src/StatusQ/Controls/StatusBaseInput.qml

@@ -142,11 +142,12 @@ Item {
                     return clearable ? clearButtonLoader.width + 12 : 
                         (statusIcon.visible && !leftIcon) || !!statusBaseInput.component ? 8 : 0
                 }
+                anchors.topMargin: statusBaseInput.topPadding
+                anchors.bottomMargin: statusBaseInput.bottomPadding
                 contentWidth: edit.paintedWidth
                 contentHeight: edit.paintedHeight
                 boundsBehavior: Flickable.StopAtBounds
                 QC.ScrollBar.vertical: QC.ScrollBar { interactive: multiline; enabled: multiline }
-                clip: true
                 function ensureVisible(r) {
                     if (contentX >= r.x)
                         contentX = r.x;

src/StatusQ/Controls/StatusPasswordStrengthIndicator.qml

@@ -1,54 +0,0 @@
-import QtQuick 2.14
-import QtQuick.Controls 2.14
-
-import StatusQ.Core.Theme 0.1
-import StatusQ.Core 0.1
-
-StatusProgressBar {
-    id: control
-
-    property var strength
-    property string labelVeryWeak: "Very weak"
-    property string labelWeak: "Weak"
-    property string labelSoso: "So-so"
-    property string labelGood: "Good"
-    property string labelGreat: "Great"
-
-    enum Strength {
-        VeryWeak, // 0
-        Weak, // 1
-        SoSo, // 2
-        Good, // 3
-        Great // 4
-    }
-
-    // Behavior:
-    states: [
-        // Strength states definition:
-        State {
-            when: control.strength === StatusPasswordStrengthIndicator.Strength.VeryWeak
-            PropertyChanges { target: control; fillColor : Theme.palette.dangerColor1}
-            PropertyChanges { target: control; text: labelVeryWeak}
-        },
-        State {
-            when: control.strength === StatusPasswordStrengthIndicator.Strength.Weak
-            PropertyChanges { target: control; fillColor : Theme.palette.pinColor1}
-            PropertyChanges { target: control; text: labelWeak}
-        },
-        State {
-            when: control.strength === StatusPasswordStrengthIndicator.Strength.SoSo
-            PropertyChanges { target: control; fillColor : Theme.palette.miscColor7}
-            PropertyChanges { target: control; text: labelSoso}
-        },
-        State {
-            when: control.strength === StatusPasswordStrengthIndicator.Strength.Good
-            PropertyChanges { target: control; fillColor : Theme.palette.miscColor12}
-            PropertyChanges { target: control; text: labelGood}
-        },
-        State {
-            when: control.strength === StatusPasswordStrengthIndicator.Strength.Great
-            PropertyChanges { target: control; fillColor : Theme.palette.successColor1}
-            PropertyChanges { target: control; text: labelGreat}
-        }
-    ]
-}

src/StatusQ/Controls/StatusProgressBar.qml

@@ -1,42 +0,0 @@
-import QtQuick 2.14
-import QtQuick.Controls 2.14
-
-import StatusQ.Core.Theme 0.1
-import StatusQ.Core 0.1
-
-ProgressBar {
-    id: control
-
-    property string text
-    property color fillColor
-    property color backgroundColor: Theme.palette.directColor8
-
-    width: 416
-    height: 16
-    clip: true
-
-    background: Rectangle {
-        implicitWidth: parent.width
-        implicitHeight: parent.height
-        color: control.backgroundColor
-        radius: 5
-    }
-    contentItem: Item {
-        implicitHeight: parent.height
-
-        Rectangle {
-            id: bar
-            width: control.visualPosition * parent.width
-            height: parent.height
-            color: control.fillColor
-            radius: 5
-
-            StatusBaseText {
-                anchors.centerIn: parent
-                text: control.text
-                font.pixelSize: 12
-                color: Theme.palette.indirectColor1
-            }
-        }
-    }
-}

src/StatusQ/Controls/qmldir

@@ -2,7 +2,6 @@ module StatusQ.Controls
 
 StatusAccountSelector 0.1 StatusAccountSelector.qml
 StatusAssetSelector 0.1 StatusAssetSelector.qml
-StatusBanner 0.1 StatusBanner.qml
 StatusChatCommandButton 0.1 StatusChatCommandButton.qml
 StatusChatInfoButton 0.1 StatusChatInfoButton.qml
 StatusChatListCategoryItemButton 0.1 StatusChatListCategoryItemButton.qml
@@ -24,8 +23,6 @@ StatusSelect 0.1 StatusSelect.qml
 StatusBaseInput 0.1 StatusBaseInput.qml
 StatusInput 0.1 StatusInput.qml
 StatusPickerButton 0.1 StatusPickerButton.qml
-StatusProgressBar 0.1 StatusProgressBar.qml
-StatusPasswordStrengthIndicator 0.1 StatusPasswordStrengthIndicator.qml
 StatusSwitchTabButton 0.1 StatusSwitchTabButton.qml
 StatusSwitchTabBar 0.1 StatusSwitchTabBar.qml
 StatusSelectableText 0.1 StatusSelectableText.qml

src/StatusQ/Core/Theme/StatusColors.qml

@@ -31,8 +31,6 @@ QtObject {
         'green2': '#7CDA00',
         'green3': '#60C370',
         'green4': '#93DB33',
-        'green5': '#9EA85D',
-        'green6': '#AFB551',
 
         'grey': '#F0F2F5',
         'grey2': '#F6F8FA',

src/StatusQ/Core/Theme/StatusDarkTheme.qml

@@ -145,7 +145,6 @@ ThemePalette {
     miscColor9: getColor('moss2')
     miscColor10: getColor('brown3')
     miscColor11: getColor('yellow2')
-    miscColor12: getColor('green6')
 
     accountColors: [
         getColor('blue5'),

src/StatusQ/Core/Theme/StatusLightTheme.qml

@@ -143,7 +143,6 @@ ThemePalette {
     miscColor9: getColor('moss')
     miscColor10: getColor('brown')
     miscColor11: getColor('brown2')
-    miscColor12: getColor('green5')
 
     accountColors: [
         getColor('blue'),

src/StatusQ/Core/Theme/ThemePalette.qml

@@ -88,7 +88,6 @@ QtObject {
     property color miscColor9
     property color miscColor10
     property color miscColor11
-    property color miscColor12
 
     property var accountColors: []
 

src/StatusQ/Core/Utils/Utils.qml

@@ -52,9 +52,10 @@ QtObject {
                 return {
                     name: assets.rowData(i, "name"),
                     symbol,
-                    balance: assets.rowData(i, "balance"),
+                    value: assets.rowData(i, "value"),
+                    fiatBalanceDisplay: assets.rowData(i, "fiatBalanceDisplay"),
                     address: assets.rowData(i, "address"),
-                    currencyBalance: assets.rowData(i, "currencyBalance")
+                    fiatBalance: assets.rowData(i, "fiatBalance")
                 }
             }
         }

src/StatusQ/Layout/StatusAppNavBar.qml

@@ -150,7 +150,7 @@ Rectangle {
         width: visible ? statusAppNavBar.navBarProfileButton.width : 0
         visible: !!statusAppNavBar.navBarProfileButton
         anchors.bottom: parent.bottom
-        anchors.bottomMargin: visible ? 23 : 0
+        anchors.bottomMargin: visible ? 32 : 0
     }
 }
 

src/StatusQ/Popups/StatusModal.qml

@@ -18,7 +18,6 @@ QC.Popup {
     property alias leftButtons: footerImpl.leftButtons
     property bool showHeader: true
     property bool showFooter: true
-    property alias hasCloseButton: headerImpl.hasCloseButton
 
     signal editButtonClicked()
     signal headerImageClicked()

src/StatusQ/Popups/StatusSearchPopup.qml

@@ -94,14 +94,15 @@ StatusModal {
                     font.family: Theme.palette.baseFont.name
                     color: Theme.palette.directColor1
                     Keys.onPressed: {
-                        if (event.key === Qt.Key_Enter || event.key === Qt.Key_Return)
-                            event.accepted = true
+                    if (event.key === Qt.Key_Enter || event.key === Qt.Key_Return)
+                      event.accepted = true
                     }
+
                 }
             }
-            StatusMenuSeparator {
+            StatusMenuSeparator { 
                 topPadding: 0
-                Layout.fillWidth: true
+                Layout.fillWidth: true 
             }
             Item {
                 Layout.preferredWidth: parent.width
@@ -151,7 +152,7 @@ StatusModal {
                             id: sensor
                             anchors.fill: parent
                             hoverEnabled: true
-                            cursorShape: Qt.PointingHandCursor
+                            cursorShape: Qt.PointingHandCursor 
                             onClicked: root.searchOptionsPopupMenu.popup();
 
                             RowLayout {
@@ -172,9 +173,9 @@ StatusModal {
                                     icon: searchOptionsMenuButton.iconSettings
                                     name: searchOptionsMenuButton.primaryText
                                     active: searchOptionsMenuButton.primaryText !== defaultSearchLocationText &&
-                                            (searchOptionsMenuButton.iconSettings.name ||
-                                             searchOptionsMenuButton.iconSettings.isLetterIdenticon ||
-                                             !!searchOptionsMenuButton.image.source.toString())
+                                        (searchOptionsMenuButton.iconSettings.name ||
+                                        searchOptionsMenuButton.iconSettings.isLetterIdenticon ||
+                                        !!searchOptionsMenuButton.image.source.toString())
                                 }
 
                                 StatusBaseText {

src/StatusQ/Popups/statusModal/StatusImageWithTitle.qml

@@ -135,15 +135,17 @@ Row {
                 font.bold: true
                 elide: statusImageWithTitle.titleElide
                 color: Theme.palette.directColor1
-                width: implicitWidth > parent.width - editButton.width ? parent.width - editButton.width: implicitWidth
+                width: !editButton.visible ? parent.width :
+                                             parent.width - editButton.width - parent.spacing
             }
             StatusFlatRoundButton {
                 id: editButton
                 objectName: "editAvatarbButton"
                 visible: statusImageWithTitle.editable
-                anchors.verticalCenter: headerTitle.verticalCenter
+                anchors.bottom: headerTitle.bottom
+                anchors.bottomMargin: -1
                 height: 24
-                width: visible ? 24 : 0
+                width: 24
                 type: StatusFlatRoundButton.Type.Secondary
                 icon.name: "pencil"
                 icon.color: Theme.palette.directColor1

src/StatusQ/Popups/statusModal/StatusModalHeader.qml

@@ -19,7 +19,6 @@ Rectangle {
     property alias icon: imageWithTitle.icon
     property bool editable: false
     property alias headerImageEditable: imageWithTitle.headerImageEditable
-    property bool hasCloseButton: true
     property Component popupMenu
 
     signal editButtonClicked
@@ -77,7 +76,7 @@ Rectangle {
     Loader {
         id: actionButtonLoader
         objectName: "actionButtonloader"
-        anchors.right: closeButton.visible ? closeButton.left : parent.right
+        anchors.right: closeButton.left
         anchors.rightMargin: 8
         anchors.top: parent.top
         anchors.topMargin: 16
@@ -97,7 +96,6 @@ Rectangle {
         icon.color: Theme.palette.directColor1
         icon.width: 20
         icon.height: 20
-        visible: statusModalHeader.hasCloseButton
 
         onClicked: statusModalHeader.close()
     }

src/assets/img/icons/audio.svg

@@ -1,9 +0,0 @@
-<svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M6.99971 0.668945C6.71994 0.668945 6.49314 0.895744 6.49314 1.17551V10.8238C6.49314 11.1036 6.71994 11.3304 6.99971 11.3304C7.27948 11.3304 7.50628 11.1036 7.50628 10.8238V1.17552C7.50628 0.895744 7.27948 0.668945 6.99971 0.668945Z" fill="#939BA1"/>
-<path d="M2.38654 2.97442C2.38654 2.69465 2.61333 2.46785 2.89311 2.46785C3.17288 2.46785 3.39968 2.69465 3.39968 2.97442V9.02493C3.39968 9.3047 3.17288 9.5315 2.89311 9.5315C2.61333 9.5315 2.38654 9.3047 2.38654 9.02493V2.97442Z" fill="#939BA1"/>
-<path d="M4.43992 4.43813C4.43992 4.15836 4.66672 3.93156 4.94649 3.93156C5.22626 3.93156 5.45306 4.15836 5.45306 4.43813V7.56126C5.45306 7.84103 5.22626 8.06783 4.94649 8.06783C4.66672 8.06783 4.43992 7.84103 4.43992 7.56126V4.43813Z" fill="#939BA1"/>
-<path d="M0.333313 5.35146C0.333313 5.07169 0.560112 4.84489 0.839883 4.84489C1.11965 4.84489 1.34645 5.07169 1.34645 5.35146V6.6479C1.34645 6.92767 1.11965 7.15447 0.839883 7.15447C0.560112 7.15447 0.333313 6.92767 0.333313 6.6479V5.35146Z" fill="#939BA1"/>
-<path d="M9.0531 3.93156C8.77333 3.93156 8.54653 4.15836 8.54653 4.43813V7.56123C8.54653 7.841 8.77333 8.0678 9.0531 8.0678C9.33287 8.0678 9.55967 7.841 9.55967 7.56123V4.43813C9.55967 4.15836 9.33287 3.93156 9.0531 3.93156Z" fill="#939BA1"/>
-<path d="M11.1063 2.46785C10.8266 2.46785 10.5998 2.69465 10.5998 2.97442V9.02493C10.5998 9.3047 10.8266 9.5315 11.1063 9.5315C11.3861 9.5315 11.6129 9.3047 11.6129 9.02493V2.97442C11.6129 2.69465 11.3861 2.46785 11.1063 2.46785Z" fill="#939BA1"/>
-<path d="M12.6531 5.35146C12.6531 5.07169 12.8799 4.84489 13.1597 4.84489C13.4395 4.84489 13.6663 5.07169 13.6663 5.35146V6.64791C13.6663 6.92769 13.4395 7.15448 13.1597 7.15448C12.8799 7.15448 12.6531 6.92769 12.6531 6.64791V5.35146Z" fill="#939BA1"/>
-</svg>

src/assets/img/icons/tiny/subtract.svg

@@ -1,3 +0,0 @@
-<svg width="2" height="8" viewBox="0 0 2 8" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M1.78125 6.65625C1.78125 7.08772 1.43147 7.4375 1 7.4375C0.568528 7.4375 0.21875 7.08772 0.21875 6.65625C0.21875 6.22478 0.568528 5.875 1 5.875C1.43147 5.875 1.78125 6.22478 1.78125 6.65625ZM1 0.875C0.654822 0.875 0.375 1.15482 0.375 1.5V4.3125C0.375 4.65768 0.654822 4.9375 1 4.9375C1.34518 4.9375 1.625 4.65768 1.625 4.3125V1.5C1.625 1.15482 1.34518 0.875 1 0.875Z" fill="white"/>
-</svg>

src/assets/img/icons/tiny/tiny-checkmark.svg

@@ -1,3 +0,0 @@
-<svg width="6" height="4" viewBox="0 0 6 4" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.21097 2.79222L4.73854 0.255725C4.91216 0.0814879 5.19307 0.0808952 5.36869 0.257127C5.54308 0.432138 5.54399 0.714976 5.37008 0.889498L2.52534 3.74428C2.43901 3.83091 2.32615 3.87462 2.2129 3.875C2.09629 3.87412 1.98311 3.8311 1.89811 3.7458L0.629196 2.47241C0.456409 2.29901 0.456496 2.01779 0.632108 1.84156C0.806504 1.66655 1.09029 1.66758 1.26074 1.83864L2.21097 2.79222Z" fill="white"/>
-</svg>

src/assets/img/icons/tiny/tiny-contact.svg

@@ -1,4 +0,0 @@
-<svg width="6" height="8" viewBox="0 0 6 8" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M2.99996 3.6875C3.77661 3.6875 4.40621 3.0579 4.40621 2.28125C4.40621 1.5046 3.77661 0.875 2.99996 0.875C2.22331 0.875 1.59371 1.5046 1.59371 2.28125C1.59371 3.0579 2.22331 3.6875 2.99996 3.6875Z" fill="white"/>
-<path d="M0.577101 6.50632C0.852422 5.42485 1.83278 4.625 2.99996 4.625C4.16714 4.625 5.1475 5.42485 5.42282 6.50632C5.50798 6.84083 5.22014 7.125 4.87496 7.125H1.12496C0.779781 7.125 0.491942 6.84083 0.577101 6.50632Z" fill="white"/>
-</svg>

statusq.qrc

@@ -315,9 +315,5 @@
         <file>src/assets/img/icons/tiny/time.svg</file>
         <file>src/assets/img/icons/tiny/tribute-to-talk.svg</file>
         <file>src/assets/img/icons/tiny/warning.svg</file>
-        <file>src/StatusQ/Controls/StatusBanner.qml</file>
-        <file>src/StatusQ/Controls/StatusProgressBar.qml</file>
-        <file>src/StatusQ/Controls/StatusPasswordStrengthIndicator.qml</file>
-        <file>src/StatusQ/Components/StatusMemberListItem.qml</file>
     </qresource>
 </RCC>