From 5ed667c554dae83117f4dd8cbf84803534cf1771 Mon Sep 17 00:00:00 2001
From: Henning Gruendl <henning.gruendl@qt.io>
Date: Fri, 15 Sep 2023 09:55:47 +0200
Subject: [PATCH] QmlDesigner: Add chevron to items with children

Add chevron to the ItemDelegates of the SuggestionPopup if items have
children. This indicates that the user can click on it and go deeper.

Change-Id: I905769b8190b81a92025861a3fc38817de5b56ed
Reviewed-by: <github-actions-qt-creator@cristianadam.eu>
Reviewed-by: Qt CI Patch Build Bot <ci_patchbuild_bot@qt.io>
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>
---
 .../connectionseditor/MyListViewDelegate.qml  | 49 ++++++++++++++-----
 .../connectionseditor/MyTreeViewDelegate.qml  | 11 +++--
 .../connectionseditor/SuggestionPopup.qml     |  2 +-
 3 files changed, 45 insertions(+), 17 deletions(-)

diff --git a/share/qtcreator/qmldesigner/connectionseditor/MyListViewDelegate.qml b/share/qtcreator/qmldesigner/connectionseditor/MyListViewDelegate.qml
index 936d06daee6..5ca53985d85 100644
--- a/share/qtcreator/qmldesigner/connectionseditor/MyListViewDelegate.qml
+++ b/share/qtcreator/qmldesigner/connectionseditor/MyListViewDelegate.qml
@@ -3,27 +3,52 @@
 
 import QtQuick
 import QtQuick.Controls
+import QtQuick.Layouts
+import StudioTheme as StudioTheme
 
 ItemDelegate {
     id: control
-    hoverEnabled: true
 
-    contentItem: Text {
-        leftPadding: 8
-        rightPadding: 8
-        text: control.text
-        font: control.font
-        opacity: enabled ? 1.0 : 0.3
-        color: control.hovered ? "#111111" : "white"
-        horizontalAlignment: Text.AlignLeft
-        verticalAlignment: Text.AlignVCenter
-        elide: Text.ElideRight
+    property StudioTheme.ControlStyle style: StudioTheme.Values.controlStyle
+
+    hoverEnabled: true
+    verticalPadding: 0
+    rightPadding: 10 // ScrollBar thickness
+
+    contentItem: RowLayout {
+        Text {
+            Layout.fillWidth: true
+            leftPadding: 8
+            rightPadding: 8
+            text: control.text
+            font: control.font
+            opacity: enabled ? 1.0 : 0.3
+            color: control.hovered ? control.style.text.selectedText : control.style.text.idle
+            horizontalAlignment: Text.AlignLeft
+            verticalAlignment: Text.AlignVCenter
+            elide: Text.ElideRight
+        }
+
+        Item {
+            visible: control.childCount
+            width: 30
+            height: 30
+
+            Text {
+                id: chevronLeft
+                font.family: StudioTheme.Constants.iconFont.family
+                font.pixelSize: control.style.baseIconFontSize
+                color: control.hovered ? control.style.text.selectedText : control.style.text.idle
+                text: StudioTheme.Constants.forward_medium
+                anchors.centerIn: parent
+            }
+        }
     }
 
     background: Rectangle {
         implicitWidth: 200
         implicitHeight: 30
         opacity: enabled ? 1 : 0.3
-        color: control.hovered ? "#4DBFFF" : "transparent"
+        color: control.hovered ? control.style.interaction : "transparent"
     }
 }
diff --git a/share/qtcreator/qmldesigner/connectionseditor/MyTreeViewDelegate.qml b/share/qtcreator/qmldesigner/connectionseditor/MyTreeViewDelegate.qml
index 366860b6757..549cb0fd7b5 100644
--- a/share/qtcreator/qmldesigner/connectionseditor/MyTreeViewDelegate.qml
+++ b/share/qtcreator/qmldesigner/connectionseditor/MyTreeViewDelegate.qml
@@ -8,6 +8,9 @@ import StudioTheme as StudioTheme
 
 T.TreeViewDelegate {
     id: control
+
+    property StudioTheme.ControlStyle style: StudioTheme.Values.controlStyle
+
     hoverEnabled: true
     implicitWidth: 200
     implicitHeight: 30
@@ -28,8 +31,8 @@ T.TreeViewDelegate {
         Text {
             id: icon
             font.family: StudioTheme.Constants.iconFont.family
-            font.pixelSize: StudioTheme.Values.smallIconFontSize
-            color: control.hovered ? "#111111" : "white" // TODO colors
+            font.pixelSize: control.style.smallIconFontSize
+            color: control.hovered ? control.style.text.selectedText : control.style.text.idle
             text: StudioTheme.Constants.sectionToggle
             rotation: control.expanded ? 0 : -90
             anchors.centerIn: parent
@@ -39,14 +42,14 @@ T.TreeViewDelegate {
     background: Rectangle {
         implicitWidth: 200
         implicitHeight: 30
-        color: control.hovered ? "#4DBFFF" : "transparent"
+        color: control.hovered ? control.style.interaction : "transparent"
     }
 
     contentItem: Text {
         text: control.text
         font: control.font
         opacity: enabled ? 1.0 : 0.3
-        color: control.hovered ? "#111111" : "white"
+        color: control.hovered ? control.style.text.selectedText : control.style.text.idle
         horizontalAlignment: Text.AlignLeft
         verticalAlignment: Text.AlignVCenter
         elide: Text.ElideRight
diff --git a/share/qtcreator/qmldesigner/connectionseditor/SuggestionPopup.qml b/share/qtcreator/qmldesigner/connectionseditor/SuggestionPopup.qml
index fb9643ca14b..735bc9364cd 100644
--- a/share/qtcreator/qmldesigner/connectionseditor/SuggestionPopup.qml
+++ b/share/qtcreator/qmldesigner/connectionseditor/SuggestionPopup.qml
@@ -80,7 +80,7 @@ Controls.Popup {
 
                         onClicked: {
                             stack.pop(Controls.StackView.Immediate)
-                            root.listModel.goUp() //treeModel.pop()
+                            root.listModel.goUp()
                         }
                     }