1 files changed, 24 insertions, 11 deletions

diff --git a/appearance/AppearancePanel.qml b/appearance/AppearancePanel.qml
index 708682c..a4c12b6 100644
--- a/appearance/AppearancePanel.qml
+++ b/appearance/AppearancePanel.qml
@@ -21,6 +21,12 @@ Scope {
     property string tab: "wallpaper"
     property string notice: ""
 
+    readonly property var tabs: ["wallpaper", "theme", "sunset", "idle", "icons"]
+    readonly property var tabLabels: ({
+        wallpaper: "Wallpaper", theme: "Theme", sunset: "Sunset",
+        idle: "Idle", icons: "Icons",
+    })
+
     // What the mock screens show. Hovering a thumbnail previews it on the
     // targeted screen; the other keeps whatever is currently set.
     property string hovering: ""
@@ -35,6 +41,7 @@ Scope {
         // started, which for an autostarted one is the whole session.
         Udt.refresh();
         Wallpapers.refresh();
+        Hyprsunset.refresh();
         root.open = true;
     }
     function close() { root.open = false; }
@@ -99,7 +106,8 @@ Scope {
                 Keys.onEscapePressed: root.close()
                 Keys.onPressed: event => {
                     if (event.key === Qt.Key_Tab) {
-                        root.tab = root.tab === "theme" ? "wallpaper" : "theme";
+                        const i = root.tabs.indexOf(root.tab);
+                        root.tab = root.tabs[(i + 1) % root.tabs.length];
                         event.accepted = true;
                     }
                 }
@@ -123,15 +131,14 @@ Scope {
 
                     Row {
                         spacing: 8
-                        Tab {
-                            text: "Wallpaper"
-                            selected: root.tab === "wallpaper"
-                            onClicked: root.tab = "wallpaper"
-                        }
-                        Tab {
-                            text: "Theme"
-                            selected: root.tab === "theme"
-                            onClicked: root.tab = "theme"
+                        Repeater {
+                            model: root.tabs
+                            Tab {
+                                required property var modelData
+                                text: root.tabLabels[modelData]
+                                selected: root.tab === modelData
+                                onClicked: root.tab = modelData
+                            }
                         }
                         Item { width: 12; height: 1 }
                         Text {
@@ -154,7 +161,13 @@ Scope {
                     Loader {
                         width: parent.width
                         height: parent.height - y
-                        sourceComponent: root.tab === "theme" ? themeTab : wallpaperTab
+                        // Existing tabs are inline Components; the new ones are
+                        // files. sourceComponent wins when it is non-null.
+                        sourceComponent: root.tab === "theme" ? themeTab
+                                       : root.tab === "wallpaper" ? wallpaperTab : null
+                        source: root.tab === "sunset" ? Qt.resolvedUrl("SunsetTab.qml")
+                              : root.tab === "idle" ? Qt.resolvedUrl("IdleTab.qml")
+                              : root.tab === "icons" ? Qt.resolvedUrl("IconsTab.qml") : ""
                     }
                 }
             }