refactor(SidebarTabButton.qml): update layout and improve header display in SidebarTabButton.qml

src/ui/wIndows/SidebarTabButton.qml

@@ -2,11 +2,14 @@ import QtQuick 2.15
 import QtQuick.Controls 2.15
 import QtQuick.Layouts 1.15
 import FluentUI
-
+import ".." as App
 
 FluExpander {
     id: root
     property int currentSection : 1
+    required property string udid
+    required property string title 
+    property int item_height: 30
     signal sectionChanged(int sectionIndex)
 
     ListModel {
@@ -17,14 +20,17 @@ FluExpander {
         ListElement { name: qsTr("Files"); sectionIndex: 3 }
     }
 
-    implicitWidth: 200
-    contentHeight : 40 * 4 + 40
+    implicitWidth: 175
+    contentHeight : root.item_height * 4 + 40
 
     headerDelegate: Component {
         Item {
-            FluToggleButton {
-                anchors.centerIn: parent
-                text: qsTr("TODO")
+            Label {
+                anchors.verticalCenter: parent.verticalCenter
+                anchors.left: parent.left
+                anchors.leftMargin: 10
+                font.bold: true
+                text:  root.title
             }
         }
     }
@@ -48,21 +54,21 @@ FluExpander {
                 z:99
                 clip: true
                 Rectangle{
-                    height: 18
+                    height: 15
                     radius: 1.5
                     color: FluTheme.primaryColor
                     width: 3
                     anchors{
                         verticalCenter: parent.verticalCenter
                         left: parent.left
-                        leftMargin: 6
+                        leftMargin: 1
                     }
                 }
             }
             delegate: FluButton {
                 text: name
                 width: nav_list.width
-                height: 40
+                height: root.item_height
                 // verticalPadding: 5
                 // horizontalPadding:20
                 background : Rectangle {