More qml cleanups

39 files changed, 198 insertions, 284 deletions

diff --git a/resources/qml/CommunitiesList.qml b/resources/qml/CommunitiesList.qml
index 53578cd0..c9f259e2 100644
--- a/resources/qml/CommunitiesList.qml
+++ b/resources/qml/CommunitiesList.qml
@@ -3,7 +3,6 @@
 // SPDX-License-Identifier: GPL-3.0-or-later
 
 import "./components"
-import "./dialogs"
 import Qt.labs.platform 1.1 as Platform
 import QtQml
 import QtQuick
@@ -71,12 +70,13 @@ Page {
                     when: (communityItem.hovered || model.hidden) && !(Communities.currentTagId === model.id)
 
                     PropertyChanges {
-                        backgroundColor: palette.dark
-                        bubbleBackground: palette.highlight
-                        bubbleText: palette.highlightedText
-                        importantText: palette.brightText
-                        target: communityItem
-                        unimportantText: palette.brightText
+                        communityItem {
+                            backgroundColor: palette.dark
+                            bubbleBackground: palette.highlight
+                            bubbleText: palette.highlightedText
+                            importantText: palette.brightText
+                            unimportantText: palette.brightText
+                        }
                     }
                 },
                 State {
@@ -84,12 +84,13 @@ Page {
                     when: Communities.currentTagId == model.id
 
                     PropertyChanges {
-                        backgroundColor: palette.highlight
-                        bubbleBackground: palette.highlightedText
-                        bubbleText: palette.highlight
-                        importantText: palette.highlightedText
-                        target: communityItem
-                        unimportantText: palette.highlightedText
+                        communityItem {
+                            backgroundColor: palette.highlight
+                            bubbleBackground: palette.highlightedText
+                            bubbleText: palette.highlight
+                            importantText: palette.highlightedText
+                            unimportantText: palette.highlightedText
+                        }
                     }
                 }
             ]
@@ -123,11 +124,9 @@ Page {
                     ToolTip.delay: Nheko.tooltipDelay
                     ToolTip.text: model.collapsed ? qsTr("Expand") : qsTr("Collapse")
                     ToolTip.visible: hovered
-                    height: fontMetrics.lineSpacing
                     hoverEnabled: true
                     image: model.collapsed ? ":/icons/icons/ui/collapsed.svg" : ":/icons/icons/ui/expanded.svg"
                     visible: !communitySidebar.collapsed && model.collapsible
-                    width: fontMetrics.lineSpacing
 
                     onClicked: model.collapsed = !model.collapsed
                 }
@@ -142,7 +141,7 @@ Page {
                     color: communityItem.backgroundColor
                     displayName: model.displayName
                     enabled: false
-                    height: avatarSize
+                    Layout.preferredHeight: avatarSize
                     roomid: model.id
                     textColor: model.avatarUrl?.startsWith(":/") == true ? communityItem.unimportantText : communityItem.importantText
                     url: {
@@ -153,7 +152,7 @@ Page {
                         else
                             return "";
                     }
-                    width: avatarSize
+                    Layout.preferredWidth: avatarSize
 
                     NotificationBubble {
                         anchors.bottom: avatar.bottom
diff --git a/resources/qml/Completer.qml b/resources/qml/Completer.qml
index 9ebe0a40..d8205988 100644
--- a/resources/qml/Completer.qml
+++ b/resources/qml/Completer.qml
@@ -151,10 +151,10 @@ Control {
                         Avatar {
                             displayName: model.displayName
                             enabled: false
-                            height: popup.avatarHeight
+                            Layout.preferredHeight: popup.avatarHeight
+                            Layout.preferredWidth: popup.avatarWidth
                             url: model.avatarUrl.replace("mxc://", "image://MxcImage/")
                             userid: model.userid
-                            width: popup.avatarWidth
                         }
                         Label {
                             color: model.index == popup.currentIndex ? palette.highlightedText : palette.text
@@ -183,11 +183,11 @@ Control {
                             crop: false
                             displayName: model.shortcode
                             enabled: false
-                            height: popup.avatarHeight
+                            Layout.preferredHeight: popup.avatarHeight
                             //userid: model.shortcode
                             url: (model.url ? model.url : "").replace("mxc://", "image://MxcImage/")
                             visible: !model.unicode
-                            width: popup.avatarWidth
+                            Layout.preferredWidth: popup.avatarWidth
                         }
                         Label {
                             Layout.leftMargin: Nheko.paddingSmall
@@ -229,10 +229,10 @@ Control {
                         Avatar {
                             displayName: model.roomName
                             enabled: false
-                            height: popup.avatarHeight
+                            Layout.preferredHeight: popup.avatarHeight
                             roomid: model.roomid
                             url: model.avatarUrl.replace("mxc://", "image://MxcImage/")
-                            width: popup.avatarWidth
+                            Layout.preferredWidth: popup.avatarWidth
                         }
                         Label {
                             color: model.index == popup.currentIndex ? palette.highlightedText : palette.text
@@ -253,10 +253,10 @@ Control {
                         Avatar {
                             displayName: model.roomName
                             enabled: false
-                            height: popup.avatarHeight
+                            Layout.preferredHeight: popup.avatarHeight
                             roomid: model.roomid
                             url: model.avatarUrl.replace("mxc://", "image://MxcImage/")
-                            width: popup.avatarWidth
+                            Layout.preferredWidth: popup.avatarWidth
                         }
                         Label {
                             color: model.index == popup.currentIndex ? palette.highlightedText : palette.text
diff --git a/resources/qml/MatrixTextField.qml b/resources/qml/MatrixTextField.qml
index 7209a5aa..4ceadf6c 100644
--- a/resources/qml/MatrixTextField.qml
+++ b/resources/qml/MatrixTextField.qml
@@ -69,12 +69,10 @@ ColumnLayout {
                 name: "focused"
 
                 PropertyChanges {
-                    target: labelC
-                    y: 0
+                    labelC.y: 0
                 }
                 PropertyChanges {
-                    opacity: 1
-                    target: input
+                    input.opacity: 1
                 }
             }
             transitions: Transition {
@@ -143,7 +141,7 @@ ColumnLayout {
 
         Layout.fillWidth: true
         color: palette.highlight
-        height: 1
+        Layout.preferredHeight: 1
 
         Rectangle {
             id: blackBar
@@ -159,8 +157,7 @@ ColumnLayout {
                 when: input.activeFocus == true
 
                 PropertyChanges {
-                    target: blackBar
-                    width: blueBar.width
+                    blackBar.width: blueBar.width
                 }
             }
             transitions: Transition {
diff --git a/resources/qml/MessageInput.qml b/resources/qml/MessageInput.qml
index a1d3ac7b..37793751 100644
--- a/resources/qml/MessageInput.qml
+++ b/resources/qml/MessageInput.qml
@@ -46,12 +46,12 @@ Rectangle {
             Layout.margins: 8
             ToolTip.text: CallManager.isOnCall ? qsTr("Hang up") : (CallManager.isOnCallOnOtherDevice ? qsTr("Already on a call") : qsTr("Place a call"))
             ToolTip.visible: hovered
-            height: 22
+            Layout.preferredHeight: 22
             hoverEnabled: true
             image: CallManager.isOnCall ? ":/icons/icons/ui/end-call.svg" : ":/icons/icons/ui/place-call.svg"
             opacity: (CallManager.haveCallInvite || CallManager.isOnCallOnOtherDevice) ? 0.3 : 1
             visible: CallManager.callsSupported && showAllButtons
-            width: 22
+            Layout.preferredWidth: 22
 
             onClicked: {
                 if (room) {
@@ -74,11 +74,11 @@ Rectangle {
             Layout.margins: 8
             ToolTip.text: qsTr("Send a file")
             ToolTip.visible: hovered
-            height: 22
+            Layout.preferredHeight: 22
             hoverEnabled: true
             image: ":/icons/icons/ui/attach.svg"
             visible: showAllButtons
-            width: 22
+            Layout.preferredWidth: 22
 
             onClicked: room.input.openFileSelection()
 
@@ -395,11 +395,11 @@ Rectangle {
             Layout.margins: 8
             ToolTip.text: qsTr("Stickers")
             ToolTip.visible: hovered
-            height: 22
+            Layout.preferredHeight: 22
             hoverEnabled: true
             image: ":/icons/icons/ui/sticky-note-solid.svg"
             visible: showAllButtons
-            width: 22
+            Layout.preferredWidth: 22
 
             onClicked: stickerPopup.visible ? stickerPopup.close() : stickerPopup.show(stickerButton, room.roomId, function (row) {
                     room.input.sticker(row);
@@ -419,10 +419,10 @@ Rectangle {
             Layout.margins: 8
             ToolTip.text: qsTr("Emoji")
             ToolTip.visible: hovered
-            height: 22
+            Layout.preferredHeight: 22
             hoverEnabled: true
             image: ":/icons/icons/ui/smile.svg"
-            width: 22
+            Layout.preferredWidth: 22
 
             onClicked: emojiPopup.visible ? emojiPopup.close() : emojiPopup.show(emojiButton, room.roomId, function (plaintext, markdown) {
                     messageInput.insert(messageInput.cursorPosition, markdown);
@@ -441,10 +441,10 @@ Rectangle {
             Layout.rightMargin: 8
             ToolTip.text: qsTr("Send")
             ToolTip.visible: hovered
-            height: 22
+            Layout.preferredHeight: 22
             hoverEnabled: true
             image: ":/icons/icons/ui/send.svg"
-            width: 22
+            Layout.preferredWidth: 22
 
             onClicked: {
                 room.input.send();
diff --git a/resources/qml/MessageView.qml b/resources/qml/MessageView.qml
index 80ec87c2..97a121eb 100644
--- a/resources/qml/MessageView.qml
+++ b/resources/qml/MessageView.qml
@@ -2,9 +2,6 @@
 //
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-import "./components"
-import "./delegates"
-import "./emoji"
 import "./ui"
 import "./dialogs"
 import Qt.labs.platform 1.1 as Platform
@@ -186,8 +183,6 @@ Item {
                             visible: !button.showImage
                         }
                         Image {
-                            id: buttonImg
-
                             // Workaround, can't get icon.source working for now...
                             anchors.fill: parent
                             fillMode: Image.PreserveAspectFit
@@ -212,7 +207,7 @@ Item {
                     hoverEnabled: true
                     image: ":/icons/icons/ui/edit.svg"
                     visible: !!row.model && row.model.isEditable
-                    width: 16
+                    Layout.preferredWidth: 16
 
                     onClicked: {
                         if (row.model.isEditable)
@@ -228,7 +223,7 @@ Item {
                     hoverEnabled: true
                     image: ":/icons/icons/ui/smile-add.svg"
                     visible: room ? room.permissions.canSend(MtxEvent.Reaction) : false
-                    width: 16
+                    Layout.preferredWidth: 16
 
                     onClicked: emojiPopup.visible ? emojiPopup.close() : emojiPopup.show(reactButton, room.roomId, function (plaintext, markdown) {
                             var event_id = row.model ? row.model.eventId : "";
@@ -243,7 +238,7 @@ Item {
                     hoverEnabled: true
                     image: (row.model && row.model.threadId) ? ":/icons/icons/ui/thread.svg" : ":/icons/icons/ui/new-thread.svg"
                     visible: room ? room.permissions.canSend(MtxEvent.TextMessage) : false
-                    width: 16
+                    Layout.preferredWidth: 16
 
                     onClicked: room.thread = (row.model.threadId || row.model.eventId)
                 }
@@ -254,7 +249,7 @@ Item {
                     hoverEnabled: true
                     image: ":/icons/icons/ui/reply.svg"
                     visible: room ? room.permissions.canSend(MtxEvent.TextMessage) : false
-                    width: 16
+                    Layout.preferredWidth: 16
 
                     onClicked: room.reply = row.model.eventId
                 }
@@ -266,7 +261,7 @@ Item {
                     hoverEnabled: true
                     image: ":/icons/icons/ui/go-to.svg"
                     visible: !!row.model && filteredTimeline.filterByContent
-                    width: 16
+                    Layout.preferredWidth: 16
 
                     onClicked: {
                         topBar.searchString = "";
@@ -281,7 +276,7 @@ Item {
                     ToolTip.visible: hovered
                     hoverEnabled: true
                     image: ":/icons/icons/ui/options.svg"
-                    width: 16
+                    Layout.preferredWidth: 16
 
                     onClicked: messageContextMenuC.show(row.model.eventId, row.model.threadId, row.model.type, row.model.isSender, row.model.isEncrypted, row.model.isEditable, "", row.model.body, optionsButton)
                 }
@@ -624,8 +619,7 @@ Item {
                 name: ""
 
                 PropertyChanges {
-                    target: toEndButton
-                    width: 0
+                    toEndButton.width: 0
                 }
             },
             State {
@@ -633,8 +627,7 @@ Item {
                 when: !chat.atYEnd
 
                 PropertyChanges {
-                    target: toEndButton
-                    width: toEndButton.fullWidth
+                    toEndButton.width: toEndButton.fullWidth
                 }
             }
         ]
@@ -668,8 +661,6 @@ Item {
             rightMargin: Nheko.paddingMedium + (fullWidth - width) / 2
         }
         Image {
-            id: buttonImg
-
             anchors.fill: parent
             anchors.margins: Nheko.paddingMedium
             fillMode: Image.PreserveAspectFit
diff --git a/resources/qml/PrivacyScreen.qml b/resources/qml/PrivacyScreen.qml
index a3539df7..764bdf62 100644
--- a/resources/qml/PrivacyScreen.qml
+++ b/resources/qml/PrivacyScreen.qml
@@ -50,24 +50,16 @@ Item {
                 name: "Visible"
 
                 PropertyChanges {
-                    target: screenSaver
-                    visible: true
-                }
-                PropertyChanges {
-                    opacity: 1
-                    target: screenSaver
+                    screenSaver.visible: true
+                    screenSaver.opacity: 1
                 }
             },
             State {
                 name: "Invisible"
 
                 PropertyChanges {
-                    opacity: 0
-                    target: screenSaver
-                }
-                PropertyChanges {
-                    target: screenSaver
-                    visible: false
+                    screenSaver.opacity: 0
+                    screenSaver.visible: false
                 }
             }
         ]
diff --git a/resources/qml/QuickSwitcher.qml b/resources/qml/QuickSwitcher.qml
index 67718ecb..10b9bf25 100644
--- a/resources/qml/QuickSwitcher.qml
+++ b/resources/qml/QuickSwitcher.qml
@@ -2,10 +2,9 @@
 //
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-import QtQuick 2.15
-import QtQuick.Controls 2.15
-import QtQuick.Layouts 1.15
-import im.nheko 1.0
+import QtQuick
+import QtQuick.Controls
+import im.nheko
 
 Popup {
     id: quickSwitcher
diff --git a/resources/qml/RoomList.qml b/resources/qml/RoomList.qml
index 0f8dc24a..350b3846 100644
--- a/resources/qml/RoomList.qml
+++ b/resources/qml/RoomList.qml
@@ -27,7 +27,7 @@ Page {
         Rectangle {
             Layout.fillWidth: true
             color: Nheko.theme.separator
-            height: 1
+            Layout.preferredHeight: 1
         }
         Pane {
             Layout.alignment: Qt.AlignBottom
@@ -48,10 +48,10 @@ Page {
                     ToolTip.delay: Nheko.tooltipDelay
                     ToolTip.text: qsTr("Start a new chat")
                     ToolTip.visible: hovered
-                    height: 22
+                    Layout.preferredHeight: 22
+                    Layout.preferredWidth: 22
                     hoverEnabled: true
                     image: ":/icons/icons/ui/add-square-button.svg"
-                    width: 22
 
                     onClicked: roomJoinCreateMenu.open(parent)
 
@@ -100,11 +100,11 @@ Page {
                     ToolTip.delay: Nheko.tooltipDelay
                     ToolTip.text: qsTr("Room directory")
                     ToolTip.visible: hovered
-                    height: 22
+                    Layout.preferredHeight: 22
+                    Layout.preferredWidth: 22
                     hoverEnabled: true
                     image: ":/icons/icons/ui/room-directory.svg"
                     visible: !collapsed
-                    width: 22
 
                     onClicked: {
                         var win = roomDirectoryComponent.createObject(timelineRoot);
@@ -118,12 +118,12 @@ Page {
                     ToolTip.delay: Nheko.tooltipDelay
                     ToolTip.text: qsTr("Search rooms (Ctrl+K)")
                     ToolTip.visible: hovered
-                    height: 22
+                    Layout.preferredHeight: 22
+                    Layout.preferredWidth: 22
                     hoverEnabled: true
                     image: ":/icons/icons/ui/search.svg"
                     ripple: false
                     visible: !collapsed
-                    width: 22
 
                     onClicked: {
                         var component = Qt.createComponent("qrc:/resources/qml/QuickSwitcher.qml");
@@ -142,12 +142,12 @@ Page {
                     ToolTip.delay: Nheko.tooltipDelay
                     ToolTip.text: qsTr("User settings")
                     ToolTip.visible: hovered
-                    height: 22
+                    Layout.preferredHeight: 22
+                    Layout.preferredWidth: 22
                     hoverEnabled: true
                     image: ":/icons/icons/ui/settings.svg"
                     ripple: false
                     visible: !collapsed
-                    width: 22
 
                     onClicked: mainWindow.push(userSettingsPage)
                 }
@@ -191,7 +191,7 @@ Page {
                 spacing: Nheko.paddingMedium
 
                 Avatar {
-                    id: avatar
+                    id: headerAvatar
 
                     Layout.alignment: Qt.AlignVCenter
                     Layout.preferredHeight: fontMetrics.lineSpacing * 2
@@ -206,10 +206,9 @@ Page {
 
                     Layout.alignment: Qt.AlignLeft
                     Layout.fillWidth: true
-                    Layout.preferredWidth: parent.width - avatar.width - logoutButton.width - Nheko.paddingMedium * 2
+                    Layout.preferredWidth: parent.width - headerAvatar.width - logoutButton.width - Nheko.paddingMedium * 2
                     spacing: 0
                     visible: !collapsed
-                    width: parent.width - avatar.width - logoutButton.width - Nheko.paddingMedium * 2
 
                     ElidedLabel {
                         Layout.alignment: Qt.AlignBottom
@@ -321,7 +320,7 @@ Page {
         Rectangle {
             Layout.fillWidth: true
             color: Nheko.theme.separator
-            height: 2
+            Layout.preferredHeight: 2
         }
         Rectangle {
             id: unverifiedStuffBubble
@@ -371,10 +370,10 @@ Page {
                     ToolTip.delay: Nheko.tooltipDelay
                     ToolTip.text: qsTr("Close")
                     ToolTip.visible: closeUnverifiedBubble.hovered
-                    height: fontMetrics.font.pixelSize
+                    Layout.preferredHeight: fontMetrics.font.pixelSize
                     hoverEnabled: true
                     image: ":/icons/icons/ui/dismiss.svg"
-                    width: fontMetrics.font.pixelSize
+                    Layout.preferredWidth: fontMetrics.font.pixelSize
 
                     onClicked: unverifiedStuffBubble.visible = false
                 }
@@ -400,7 +399,7 @@ Page {
         Rectangle {
             Layout.fillWidth: true
             color: Nheko.theme.separator
-            height: 1
+            Layout.preferredHeight: 1
             visible: unverifiedStuffBubble.visible
         }
     }
@@ -485,12 +484,13 @@ Page {
                     when: roomItem.hovered && !((Rooms.currentRoom && roomId == Rooms.currentRoom.roomId) || Rooms.currentRoomPreview.roomid == roomId)
 
                     PropertyChanges {
-                        backgroundColor: palette.dark
-                        bubbleBackground: palette.highlight
-                        bubbleText: palette.highlightedText
-                        importantText: palette.brightText
-                        target: roomItem
-                        unimportantText: palette.brightText
+                        roomItem {
+                            backgroundColor: palette.dark
+                            bubbleBackground: palette.highlight
+                            bubbleText: palette.highlightedText
+                            importantText: palette.brightText
+                            unimportantText: palette.brightText
+                        }
                     }
                 },
                 State {
@@ -498,12 +498,13 @@ Page {
                     when: (Rooms.currentRoom && roomId == Rooms.currentRoom.roomId) || Rooms.currentRoomPreview.roomid == roomId
 
                     PropertyChanges {
-                        backgroundColor: palette.highlight
-                        bubbleBackground: palette.highlightedText
-                        bubbleText: palette.highlight
-                        importantText: palette.highlightedText
-                        target: roomItem
-                        unimportantText: palette.highlightedText
+                        roomItem {
+                            backgroundColor: palette.highlight
+                            bubbleBackground: palette.highlightedText
+                            bubbleText: palette.highlight
+                            importantText: palette.highlightedText
+                            unimportantText: palette.highlightedText
+                        }
                     }
                 }
             ]
@@ -551,11 +552,11 @@ Page {
                     Layout.alignment: Qt.AlignVCenter
                     displayName: roomName
                     enabled: false
-                    height: avatarSize
                     roomid: roomId
                     url: avatarUrl.replace("mxc://", "image://MxcImage/")
                     userid: isDirect ? directChatOtherUserId : ""
-                    width: avatarSize
+                    Layout.preferredWidth: avatarSize
+                    Layout.preferredHeight: avatarSize
 
                     NotificationBubble {
                         id: collapsedNotificationBubble
@@ -575,11 +576,10 @@ Page {
 
                     Layout.alignment: Qt.AlignLeft
                     Layout.minimumWidth: 100
-                    Layout.preferredWidth: parent.width - avatar.width
-                    height: avatar.height
+                    Layout.preferredWidth: roomItem.width - avatar.width
+                    Layout.preferredHeight: avatar.height
                     spacing: Nheko.paddingSmall