Port global settings to Kirigami.CategorizedSettings

imports/NeoChat/Menu/GlobalMenu.qml

@@ -28,7 +28,7 @@ Labs.MenuBar {
             text: i18nc("menu", "Preferences…")
 
             shortcut: StandardKey.Preferences
-            onTriggered: pushReplaceLayer("qrc:/imports/NeoChat/Page/SettingsPage.qml")
+            onTriggered: pageStack.pushDialogLayer("qrc:/imports/NeoChat/Settings/SettingsPage.qml")
         }
         Labs.MenuItem {
             text: i18nc("menu", "Quit NeoChat")

imports/NeoChat/Page/SettingsPage.qml

@@ -1,88 +0,0 @@
-// SPDX-FileCopyrightText: 2020 Tobias Fella <fella@posteo.de>
-// SPDX-FileCopyrightText: 2021 Carl Schwan <carl@carlschwan.eu>
-// SPDX-License-Identifier: LGPL-2.0-or-later
-
-import QtQuick 2.15
-import QtQuick.Controls 2.15 as QQC2
-import QtQuick.Layouts 1.15
-
-import org.kde.kirigami 2.15 as Kirigami
-
-import org.kde.neochat 1.0
-import NeoChat.Settings 1.0
-
-Kirigami.ScrollablePage {
-    title: i18n("Settings")
-    bottomPadding: 0
-    leftPadding: 0
-    rightPadding: 0
-    topPadding: 0
-
-    onBackRequested: {
-        if (pageSettingStack.depth > 1 && !pageSettingStack.wideMode && pageSettingStack.currentIndex !== 0) {
-            event.accepted = true;
-            pageSettingStack.pop();
-        }
-    }
-
-    Kirigami.PageRow {
-        id: pageSettingStack
-        anchors.fill: parent
-        columnView.columnWidth: Kirigami.Units.gridUnit * 12
-        initialPage: Kirigami.ScrollablePage {
-            bottomPadding: 0
-            leftPadding: 0
-            rightPadding: 0
-            topPadding: 0
-            Kirigami.Theme.colorSet: Kirigami.Theme.View
-            ListView {
-                Component.onCompleted: if (pageSettingStack.wideMode) {
-                    actions[0].trigger();
-                }
-                property list<Kirigami.Action> actions: [
-                    Kirigami.Action {
-                        text: i18n("General")
-                        icon.name: "org.kde.neochat"
-                        onTriggered: pageSettingStack.push("qrc:/imports/NeoChat/Settings/GeneralSettingsPage.qml")
-                    },
-                    Kirigami.Action {
-                        text: i18n("Appearance")
-                        icon.name: "preferences-desktop-theme-global"
-                        onTriggered: pageSettingStack.push("qrc:/imports/NeoChat/Settings/AppearanceSettingsPage.qml")
-                    },
-                    Kirigami.Action {
-                        text: i18n("Accounts")
-                        icon.name: "preferences-system-users"
-                        onTriggered: pageSettingStack.push("qrc:/imports/NeoChat/Page/AccountsPage.qml")
-                    },
-                    Kirigami.Action {
-                        text: i18n("Custom Emoji")
-                        icon.name: "preferences-desktop-emoticons"
-                        onTriggered: pageSettingStack.push("qrc:/imports/NeoChat/Settings/Emoticons.qml")
-                    },
-                    Kirigami.Action {
-                        text: i18n("Devices")
-                        iconName: "network-connect"
-                        onTriggered: pageSettingStack.push("qrc:/imports/NeoChat/Page/DevicesPage.qml")
-                    },
-                    Kirigami.Action {
-                        text: i18n("About NeoChat")
-                        icon.name: "help-about"
-                        onTriggered: pageSettingStack.push(aboutPage)
-                    }
-                ]
-                model: actions
-                delegate: Kirigami.BasicListItem {
-                    action: modelData
-                }
-            }
-        }
-    }
-
-    Component {
-        id: aboutPage
-        Kirigami.AboutPage {
-            aboutData: Controller.aboutData
-        }
-    }
-}

imports/NeoChat/Page/qmldir

@@ -5,6 +5,5 @@ RoomPage 1.0 RoomPage.qml
 RoomWindow 1.0 RoomWindow.qml
 JoinRoomPage 1.0 JoinRoomPage.qml
 InviteUserPage 1.0 InviteUserPage.qml
-SettingsPage 1.0 SettingsPage.qml
 ImageEditorPage 1.0 ImageEditorPage.qml
 

imports/NeoChat/Settings/About.qml

@@ -0,0 +1,12 @@
+// SPDX-FileCopyrightText: 2020 Tobias Fella <fella@posteo.de>
+// SPDX-FileCopyrightText: 2021 Carl Schwan <carl@carlschwan.eu>
+// SPDX-License-Identifier: LGPL-2.0-or-later
+
+import org.kde.kirigami 2.15 as Kirigami
+
+import org.kde.neochat 1.0
+
+Kirigami.AboutPage {
+    title: i18nc('@title:window', 'About NeoChat')
+    aboutData: Controller.aboutData
+}

imports/NeoChat/Settings/AppearanceSettingsPage.qml

@@ -12,6 +12,7 @@ import org.kde.neochat 1.0
 import NeoChat.Settings 1.0
 
 Kirigami.ScrollablePage {
+    title: i18nc('@title:window', 'Appearance')
     ColumnLayout {
         RowLayout {
             Layout.alignment: Qt.AlignCenter

imports/NeoChat/Settings/Emoticons.qml

@@ -14,6 +14,7 @@ import NeoChat.Component 1.0 as Components
 import NeoChat.Dialog 1.0
 
 Kirigami.Page {
+    title: i18nc('@title:window', 'Custom Emojis')
 
     leftPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
     topPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0

imports/NeoChat/Settings/GeneralSettingsPage.qml

@@ -11,6 +11,7 @@ import org.kde.kirigami 2.15 as Kirigami
 import org.kde.neochat 1.0
 
 Kirigami.ScrollablePage {
+    title: i18nc('@title:window', 'General')
     ColumnLayout {
         Kirigami.FormLayout {
             QQC2.CheckBox {

imports/NeoChat/Settings/SettingsPage.qml

@@ -0,0 +1,43 @@
+// SPDX-FileCopyrightText: 2021 Carl Schwan <carlschwan@kde.org>
+// SPDX-License-Identifier: LGPL-2.0-or-later
+
+import QtQuick 2.15
+import org.kde.kirigami 2.18 as Kirigami
+import QtQuick.Controls 2.15 as Controls
+import QtQuick.Layouts 1.15
+
+Kirigami.CategorizedSettings {
+    objectName: "settingsPage"
+    actions: [
+        Kirigami.SettingAction {
+            text: i18n("General")
+            icon.name: "org.kde.neochat"
+            page: Qt.resolvedUrl("GeneralSettingsPage.qml")
+        },
+        Kirigami.SettingAction {
+            text: i18n("Appearance")
+            icon.name: "preferences-desktop-theme-global"
+            page: Qt.resolvedUrl("AppearanceSettingsPage.qml")
+        },
+        Kirigami.SettingAction {
+            text: i18n("Accounts")
+            icon.name: "preferences-system-users"
+            page: Qt.resolvedUrl("AccountsPage.qml")
+        },
+        Kirigami.SettingAction {
+            text: i18n("Custom Emoji")
+            icon.name: "preferences-desktop-emoticons"
+            page: Qt.resolvedUrl("Emoticons.qml")
+        },
+        Kirigami.SettingAction {
+            text: i18n("Devices")
+            iconName: "network-connect"
+            page: Qt.resolvedUrl("DevicesPage.qml")
+        },
+        Kirigami.SettingAction {
+            text: i18n("About NeoChat")
+            icon.name: "help-about"
+            page: Qt.resolvedUrl("About.qml")
+        }
+    ]
+}

imports/NeoChat/Settings/qmldir

@@ -1,2 +1,3 @@
 module NeoChat.Settings
 ThemeRadioButton 1.0 ThemeRadioButton.qml
+SettingsPage 1.0 SettingsPage.qml

qml/main.qml

@@ -255,7 +255,7 @@ Kirigami.ApplicationWindow {
             Kirigami.Action {
                 text: i18n("Settings")
                 icon.name: "settings-configure"
-                onTriggered: pushReplaceLayer("qrc:/imports/NeoChat/Page/SettingsPage.qml")
+                onTriggered: pageStack.pushDialogLayer("qrc:/imports/NeoChat/Settings/SettingsPage.qml")
                 enabled: pageStack.layers.currentItem.title !== i18n("Settings")
                 shortcut: StandardKey.Preferences
             },

res.qrc

@@ -6,13 +6,10 @@
         <file>imports/NeoChat/Page/RoomListPage.qml</file>
         <file>imports/NeoChat/Page/RoomPage.qml</file>
         <file>imports/NeoChat/Page/RoomWindow.qml</file>
-        <file>imports/NeoChat/Page/AccountsPage.qml</file>
         <file>imports/NeoChat/Page/JoinRoomPage.qml</file>
         <file>imports/NeoChat/Page/InviteUserPage.qml</file>
-        <file>imports/NeoChat/Page/SettingsPage.qml</file>
         <file>imports/NeoChat/Page/StartChatPage.qml</file>
         <file>imports/NeoChat/Page/ImageEditorPage.qml</file>
-        <file>imports/NeoChat/Page/DevicesPage.qml</file>
         <file>imports/NeoChat/Page/WelcomePage.qml</file>
         <file>imports/NeoChat/Component/qmldir</file>
         <file>imports/NeoChat/Component/FullScreenImage.qml</file>
@@ -73,11 +70,15 @@
         <file>qtquickcontrols2.conf</file>
         <file>imports/NeoChat/Component/glowdot.png</file>
         <file>imports/NeoChat/Component/confetti.png</file>
+        <file>imports/NeoChat/Settings/SettingsPage.qml</file>
         <file>imports/NeoChat/Settings/ThemeRadioButton.qml</file>
         <file>imports/NeoChat/Settings/ColorScheme.qml</file>
         <file>imports/NeoChat/Settings/GeneralSettingsPage.qml</file>
         <file>imports/NeoChat/Settings/Emoticons.qml</file>
         <file>imports/NeoChat/Settings/AppearanceSettingsPage.qml</file>
+        <file>imports/NeoChat/Settings/AccountsPage.qml</file>
+        <file>imports/NeoChat/Settings/DevicesPage.qml</file>
+        <file>imports/NeoChat/Settings/About.qml</file>
         <file>imports/NeoChat/Settings/qmldir</file>
     </qresource>
 </RCC>