From e8fc13630c2fb67d75325e72ba66a811d3c1f4c9 Mon Sep 17 00:00:00 2001
From: ATMDA <atdma2600@gmail.com>
Date: Wed, 19 Nov 2025 17:20:00 -0500
Subject: refactor: SettingsHeader on all panels

---
 modules/controlcenter/launcher/LauncherPane.qml | 81 +++++++++++++------------
 modules/controlcenter/launcher/Settings.qml     | 16 ++---
 2 files changed, 45 insertions(+), 52 deletions(-)

(limited to 'modules/controlcenter/launcher')

diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml
index a8c5c76..cf965e8 100644
--- a/modules/controlcenter/launcher/LauncherPane.qml
+++ b/modules/controlcenter/launcher/LauncherPane.qml
@@ -509,53 +509,54 @@ Item {
 
             spacing: Appearance.spacing.normal
 
-            Item {
-            Layout.alignment: Qt.AlignHCenter
-            Layout.leftMargin: Appearance.padding.large * 2
-            Layout.rightMargin: Appearance.padding.large * 2
-            Layout.topMargin: Appearance.padding.large * 2
-            implicitWidth: iconLoader.implicitWidth
-            implicitHeight: iconLoader.implicitHeight
-
-            Loader {
-                id: iconLoader
-                sourceComponent: parent.parent.displayedApp ? appIconComponent : defaultIconComponent
+            // Show SettingsHeader when no app is selected, or show app icon + title when app is selected
+            SettingsHeader {
+                Layout.leftMargin: Appearance.padding.large * 2
+                Layout.rightMargin: Appearance.padding.large * 2
+                Layout.topMargin: Appearance.padding.large * 2
+                visible: displayedApp === null
+                icon: "apps"
+                title: qsTr("Launcher Applications")
             }
 
-            Component {
-                id: appIconComponent
-                IconImage {
-                    implicitSize: Appearance.font.size.extraLarge * 3 * 2
-                    source: {
-                        const app = iconLoader.parent.parent.displayedApp;
-                        if (!app) return "image-missing";
-                        const entry = app.entry;
-                        if (entry && entry.icon) {
-                            return Quickshell.iconPath(entry.icon, "image-missing");
+            // App icon and title display (shown when app is selected)
+            Item {
+                Layout.alignment: Qt.AlignHCenter
+                Layout.leftMargin: Appearance.padding.large * 2
+                Layout.rightMargin: Appearance.padding.large * 2
+                Layout.topMargin: Appearance.padding.large * 2
+                visible: displayedApp !== null
+                implicitWidth: Math.max(appIconImage.implicitWidth, appTitleText.implicitWidth)
+                implicitHeight: appIconImage.implicitHeight + Appearance.spacing.normal + appTitleText.implicitHeight
+
+                ColumnLayout {
+                    anchors.centerIn: parent
+                    spacing: Appearance.spacing.normal
+
+                    IconImage {
+                        id: appIconImage
+                        Layout.alignment: Qt.AlignHCenter
+                        implicitSize: Appearance.font.size.extraLarge * 3 * 2
+                        source: {
+                            const app = appDetailsLayout.displayedApp;
+                            if (!app) return "image-missing";
+                            const entry = app.entry;
+                            if (entry && entry.icon) {
+                                return Quickshell.iconPath(entry.icon, "image-missing");
+                            }
+                            return "image-missing";
                         }
-                        return "image-missing";
                     }
-                }
-            }
 
-            Component {
-                id: defaultIconComponent
-                MaterialIcon {
-                    text: "apps"
-                    font.pointSize: Appearance.font.size.extraLarge * 3
-                    font.bold: true
+                    StyledText {
+                        id: appTitleText
+                        Layout.alignment: Qt.AlignHCenter
+                        text: displayedApp ? (displayedApp.name || displayedApp.entry?.name || qsTr("Application Details")) : ""
+                        font.pointSize: Appearance.font.size.large
+                        font.bold: true
+                    }
                 }
             }
-        }
-
-        StyledText {
-            Layout.alignment: Qt.AlignHCenter
-            Layout.leftMargin: Appearance.padding.large * 2
-            Layout.rightMargin: Appearance.padding.large * 2
-            text: displayedApp ? (displayedApp.name || displayedApp.entry?.name || qsTr("Application Details")) : qsTr("Launcher Applications")
-            font.pointSize: Appearance.font.size.large
-            font.bold: true
-        }
 
             Item {
                 Layout.fillWidth: true
diff --git a/modules/controlcenter/launcher/Settings.qml b/modules/controlcenter/launcher/Settings.qml
index 1fef7f5..161221e 100644
--- a/modules/controlcenter/launcher/Settings.qml
+++ b/modules/controlcenter/launcher/Settings.qml
@@ -1,6 +1,7 @@
 pragma ComponentBehavior: Bound
 
 import ".."
+import "../components"
 import qs.components
 import qs.components.controls
 import qs.components.effects
@@ -16,18 +17,9 @@ ColumnLayout {
 
     spacing: Appearance.spacing.normal
 
-    MaterialIcon {
-        Layout.alignment: Qt.AlignHCenter
-        text: "apps"
-        font.pointSize: Appearance.font.size.extraLarge * 3
-        font.bold: true
-    }
-
-    StyledText {
-        Layout.alignment: Qt.AlignHCenter
-        text: qsTr("Launcher Settings")
-        font.pointSize: Appearance.font.size.large
-        font.bold: true
+    SettingsHeader {
+        icon: "apps"
+        title: qsTr("Launcher Settings")
     }
 
     SectionHeader {
-- 
cgit v1.2.3-freya