From 8214e646849044a422b4ef54169722d4e5a3baf1 Mon Sep 17 00:00:00 2001 From: Stefan Date: Thu, 4 Aug 2022 17:10:35 +0200 Subject: [PATCH] fix(StatusChatListCategory): Clicking on a category should toggle it The culprit here is at the very bottom, in StatusListItem: the toplevel item was a MouseArea handling the clicks and this causes problems as any extra buttons placed on top of it get their mouseClick events delivered in wrong order (after StatusListItem). Fix this by having a MouseArea handling click events behind the actual toplevel item as a last resort, catch all handler plus the actual "sensor" being just a MouseArea that handles merely the hover events - drop unneeded onPressed/onReleased handlers in StatusChatListCategoryItem - fix some warnings (typos, unreachable code, shadowed variables) Fixes: #6733 --- sandbox/controls/ListItems.qml | 20 ++++++++++--------- sandbox/demoapp/StatusAppChatView.qml | 2 +- src/StatusQ/Components/StatusChatList.qml | 2 +- .../StatusChatListAndCategories.qml | 2 +- .../Components/StatusChatListCategory.qml | 10 +++++----- .../Components/StatusChatListCategoryItem.qml | 10 +--------- src/StatusQ/Components/StatusChatListItem.qml | 13 +++++------- src/StatusQ/Components/StatusListItem.qml | 19 +++++++++--------- 8 files changed, 35 insertions(+), 43 deletions(-) diff --git a/sandbox/controls/ListItems.qml b/sandbox/controls/ListItems.qml index 90f937fb..6e43a726 100644 --- a/sandbox/controls/ListItems.qml +++ b/sandbox/controls/ListItems.qml @@ -56,19 +56,21 @@ ColumnLayout { } StatusChatListCategoryItem { - title: "Chat cat. interactive" - opened: true - propagateTitleClicks: false + id: categoryItemInteractive + title: "Chat category interactive" showActionButtons: true onAddButtonClicked: testEventsList.eventTriggered("Add button clicked") onMenuButtonClicked: testEventsList.eventTriggered("Menu button clicked") - onToggleButtonClicked: opened = !opened + onToggleButtonClicked: { + opened = !opened + testEventsList.eventTriggered("Toggle button clicked") + } onTitleClicked: { testEventsList.eventTriggered("Title clicked") } onClicked: { - testEventsList.eventTriggered("Item clicked") - mouse.accepted = true + opened = !opened + testEventsList.eventTriggered("Item clicked", itemId) } } @@ -76,7 +78,7 @@ ColumnLayout { id: testEventsList Layout.fillWidth: true - Layout.preferredHeight: 20 * count + Layout.preferredHeight: categoryItemInteractive.opened ? 20 * count : 0 clip: true @@ -96,13 +98,13 @@ ColumnLayout { Timer { interval: 5000; running: true - onTriggered: testObjeModel.remove(index) + onTriggered: testObjectModel.remove(index) } } } model: ObjectModel { - id: testObjeModel + id: testObjectModel } } diff --git a/sandbox/demoapp/StatusAppChatView.qml b/sandbox/demoapp/StatusAppChatView.qml index 2826e557..91d3fb8b 100644 --- a/sandbox/demoapp/StatusAppChatView.qml +++ b/sandbox/demoapp/StatusAppChatView.qml @@ -91,7 +91,7 @@ StatusAppThreePanelLayout { anchors.horizontalCenter: parent.horizontalCenter title: "Contact requests" requestsCount: 3 - sensor.onClicked: demoContactRequestsModal.open() + onClicked: demoContactRequestsModal.open() } StatusChatList { diff --git a/src/StatusQ/Components/StatusChatList.qml b/src/StatusQ/Components/StatusChatList.qml index d971c215..b75853c8 100644 --- a/src/StatusQ/Components/StatusChatList.qml +++ b/src/StatusQ/Components/StatusChatList.qml @@ -119,7 +119,7 @@ Column { highlightWhenCreated: !!model.highlight selected: (model.active && root.highlightItem) - icon.emoji: model.emoji + icon.emoji: !!model.emoji ? model.emoji : "" icon.color: !!model.color ? model.color : Theme.palette.userCustomizationColors[model.colorId] image.isIdenticon: false image.source: model.icon diff --git a/src/StatusQ/Components/StatusChatListAndCategories.qml b/src/StatusQ/Components/StatusChatListAndCategories.qml index 14f77964..6bae6402 100644 --- a/src/StatusQ/Components/StatusChatListAndCategories.qml +++ b/src/StatusQ/Components/StatusChatListAndCategories.qml @@ -32,7 +32,7 @@ Item { property bool draggableCategories: false // Keeps track of expanded category state. Should only be modified // internally at runtime. - property var openedCategoryState: new Object({}) + property var openedCategoryState: ({}) property Component categoryPopupMenu property Component chatListPopupMenu diff --git a/src/StatusQ/Components/StatusChatListCategory.qml b/src/StatusQ/Components/StatusChatListCategory.qml index d89904ee..a9ccbc90 100644 --- a/src/StatusQ/Components/StatusChatListCategory.qml +++ b/src/StatusQ/Components/StatusChatListCategory.qml @@ -37,20 +37,20 @@ Column { title: statusChatListCategory.name opened: statusChatListCategory.opened sensor.pressAndHoldInterval: 150 - + propagateTitleClicks: true // title click is handled as a normal click (fallthru) showMenuButton: showActionButtons && !!statusChatListCategory.popupMenu highlighted: statusChatListCategory.dragged - sensor.onClicked: { + onClicked: { if (sensor.enabled) { if (mouse.button === Qt.RightButton && showActionButtons && !!statusChatListCategory.popupMenu) { highlighted = true; popupMenuSlot.item.popup(mouse.x + 4, mouse.y + 6); - return + } else if (mouse.button === Qt.LeftButton) { + statusChatListCategory.opened = !statusChatListCategory.opened } } } - onTitleClicked: statusChatListCategory.opened = !opened - onToggleButtonClicked: statusChatListCategory.opened = !opened + onToggleButtonClicked: statusChatListCategory.opened = !statusChatListCategory.opened onMenuButtonClicked: { highlighted = true menuButton.highlighted = true diff --git a/src/StatusQ/Components/StatusChatListCategoryItem.qml b/src/StatusQ/Components/StatusChatListCategoryItem.qml index 55a75d11..85b2eab7 100644 --- a/src/StatusQ/Components/StatusChatListCategoryItem.qml +++ b/src/StatusQ/Components/StatusChatListCategoryItem.qml @@ -60,15 +60,7 @@ StatusListItem { icon.name: "chevron-down" icon.width: 18 icon.rotation: statusChatListCategoryItem.opened ? 0 : 270 - onPressed: { - sensor.enabled = false; - } - onClicked: { - statusChatListCategoryItem.toggleButtonClicked(mouse); - } - onReleased: { - sensor.enabled = true; - } + onClicked: statusChatListCategoryItem.toggleButtonClicked(mouse) } ] } diff --git a/src/StatusQ/Components/StatusChatListItem.qml b/src/StatusQ/Components/StatusChatListItem.qml index ccf17d5e..72b1fe66 100644 --- a/src/StatusQ/Components/StatusChatListItem.qml +++ b/src/StatusQ/Components/StatusChatListItem.qml @@ -112,17 +112,14 @@ Rectangle { icon: { switch (root.type) { - case StatusChatListItem.Type.PublicCat: - return Theme.palette.name == "light" ? "tiny/public-chat" : "tiny/public-chat-white" - break; + case StatusChatListItem.Type.PublicChat: + return Theme.palette.name === "light" ? "tiny/public-chat" : "tiny/public-chat-white" case StatusChatListItem.Type.GroupChat: - return Theme.palette.name == "light" ? "tiny/group" : "tiny/group-white" - break; + return Theme.palette.name === "light" ? "tiny/group" : "tiny/group-white" case StatusChatListItem.Type.CommunityChat: - return Theme.palette.name == "light" ? "tiny/channel" : "tiny/channel-white" - break; + return Theme.palette.name === "light" ? "tiny/channel" : "tiny/channel-white" default: - return Theme.palette.name == "light" ? "tiny/public-chat" : "tiny/public-chat-white" + return Theme.palette.name === "light" ? "tiny/public-chat" : "tiny/public-chat-white" } } } diff --git a/src/StatusQ/Components/StatusListItem.qml b/src/StatusQ/Components/StatusListItem.qml index 401c8c28..c759aa0f 100644 --- a/src/StatusQ/Components/StatusListItem.qml +++ b/src/StatusQ/Components/StatusListItem.qml @@ -23,7 +23,6 @@ Rectangle { property string titleTextIcon: "" property real leftPadding: 16 property real rightPadding: 16 - property bool enabled: true property bool highlighted: false property bool propagateTitleClicks: true property int type: StatusListItem.Type.Primary @@ -122,18 +121,20 @@ Rectangle { } MouseArea { - id: sensor - - enabled: statusListItem.enabled anchors.fill: parent - cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor acceptedButtons: Qt.LeftButton | Qt.RightButton - hoverEnabled: true - preventStealing: true - onClicked: { statusListItem.clicked(statusListItem.itemId, mouse) } + } + + MouseArea { + id: sensor + + anchors.fill: parent + cursorShape: containsMouse ? Qt.PointingHandCursor : Qt.ArrowCursor + acceptedButtons: Qt.NoButton + hoverEnabled: true StatusSmartIdenticon { id: iconOrImage @@ -359,7 +360,7 @@ Rectangle { id: statusListItemLabel anchors.verticalCenter: bottomModel.length === 0 ? parent.verticalCenter : undefined anchors.top: bottomModel.length === 0 ? undefined: parent.top - anchors.topMargin: bottomModel.length === 0 ? undefined : 16 + anchors.topMargin: bottomModel.length === 0 ? 0 : 16 anchors.right: statusListItemComponentsSlot.left anchors.rightMargin: statusListItemComponentsSlot.width > 0 ? 10 : 0