refactor page logging settings for focus navigation

client/ui/qml/Pages2/PageSettingsLogging.qml

@@ -23,30 +23,122 @@ PageType {
         anchors.left: parent.left
         anchors.right: parent.right
         anchors.topMargin: 20
+    }
 
-        onFocusChanged: {
+    QtObject {
-            console.debug("MOVE THIS LOGIC TO CPP!")
+        id: clientLogs
-            if (activeFocus) {
+
-                if (fl) {
+        property string title: qsTr("Client logs")
-                    fl.ensureVisible(this)
+        property string description: qsTr("AmneziaVPN logs")
-                }
+        property bool isVisible: true
+        property var openLogsHandler: function() {
+            SettingsController.openLogsFolder()
+        }
+        property var exportLogsHandler: function() {
+            var fileName = ""
+            if (GC.isMobile()) {
+                fileName = "AmneziaVPN.log"
+            } else {
+                fileName = SystemController.getFileName(qsTr("Save"),
+                                                        qsTr("Logs files (*.log)"),
+                                                        StandardPaths.standardLocations(StandardPaths.DocumentsLocation) + "/AmneziaVPN",
+                                                        true,
+                                                        ".log")
+            }
+            if (fileName !== "") {
+                PageController.showBusyIndicator(true)
+                SettingsController.exportLogsFile(fileName)
+                PageController.showBusyIndicator(false)
+                PageController.showNotificationMessage(qsTr("Logs file saved"))
             }
         }
     }
 
-    FlickableType {
+    QtObject {
-        id: fl
+        id: serviceLogs
+
+        property string title: qsTr("Service logs")
+        property string description: qsTr("AmneziaVPN-service logs")
+        property bool isVisible: !GC.isMobile()
+        property var openLogsHandler: function() {
+            SettingsController.openServiceLogsFolder()
+        }
+        property var exportLogsHandler: function() {
+            var fileName = ""
+            if (GC.isMobile()) {
+                fileName = "AmneziaVPN-service.log"
+            } else {
+                fileName = SystemController.getFileName(qsTr("Save"),
+                                                        qsTr("Logs files (*.log)"),
+                                                        StandardPaths.standardLocations(StandardPaths.DocumentsLocation) + "/AmneziaVPN-service",
+                                                        true,
+                                                        ".log")
+            }
+            if (fileName !== "") {
+                PageController.showBusyIndicator(true)
+                SettingsController.exportServiceLogsFile(fileName)
+                PageController.showBusyIndicator(false)
+                PageController.showNotificationMessage(qsTr("Logs file saved"))
+            }
+        }
+    }
+
+    property list<QtObject> logTypes: [
+        clientLogs,
+        serviceLogs
+    ]
+
+    ListView {
+        id: listView
 
         anchors.top: backButton.bottom
         anchors.bottom: parent.bottom
-        contentHeight: content.height
+        anchors.right: parent.right
+        anchors.left: parent.left
 
-        ColumnLayout {
+        property bool isFocusable: true
-            id: content
+
+        Keys.onTabPressed: {
+            FocusController.nextKeyTabItem()
+        }
+
+        Keys.onBacktabPressed: {
+            FocusController.previousKeyTabItem()
+        }
+
+        Keys.onUpPressed: {
+            FocusController.nextKeyUpItem()
+        }
+
+        Keys.onDownPressed: {
+            FocusController.nextKeyDownItem()
+        }
+
+        Keys.onLeftPressed: {
+            FocusController.nextKeyLeftItem()
+        }
+
+        Keys.onRightPressed: {
+            FocusController.nextKeyRightItem()
+        }
+
+        ScrollBar.vertical: ScrollBar {
+            policy: ScrollBar.AsNeeded
+        }
+
+        model: logTypes
+        spacing: 24
+        snapMode: ListView.SnapOneItem
+
+        reuseItems: true
+
+        clip: true
+
+        header: ColumnLayout {
+            id: headerContent
+
+            width: listView.width
 
-            anchors.top: parent.top
-            anchors.left: parent.left
-            anchors.right: parent.right
             spacing: 0
 
             HeaderType {
@@ -76,14 +168,11 @@ PageType {
                         SettingsController.isLoggingEnabled = checked
                     }
                 }
-
-                parentFlickable: fl
             }
 
             DividerType {}
 
             LabelWithButtonType {
-                // id: labelWithButton2
                 Layout.fillWidth: true
                 Layout.topMargin: -8
 
@@ -101,19 +190,25 @@ PageType {
                         SettingsController.clearLogs()
                         PageController.showBusyIndicator(false)
                         PageController.showNotificationMessage(qsTr("Logs have been cleaned up"))
-                        if (!GC.isMobile()) {
-                            focusItem.forceActiveFocus()
-                        }
                     }
+
                     var noButtonFunction = function() {
-                        // if (!GC.isMobile()) {
+
-                        //     focusItem.forceActiveFocus()
-                        // }
                     }
 
                     showQuestionDrawer(headerText, "", yesButtonText, noButtonText, yesButtonFunction, noButtonFunction)
                 }
             }
+        }
+
+        delegate: ColumnLayout {
+            id: delegateContent
+
+            width: listView.width
+
+            spacing: 0
+
+            visible: isVisible
 
             ListItemTitleType {
                 Layout.fillWidth: true
@@ -121,7 +216,7 @@ PageType {
                 Layout.leftMargin: 16
                 Layout.rightMargin: 16
 
-                text: qsTr("Client logs")
+                text: title
             }
 
             ParagraphTextType {
@@ -131,11 +226,11 @@ PageType {
                 Layout.rightMargin: 16
 
                 color: AmneziaStyle.color.mutedGray
-                text: qsTr("AmneziaVPN logs")
+
+                text: description
             }
 
             LabelWithButtonType {
-                // id: labelWithButton2
                 Layout.fillWidth: true
                 Layout.topMargin: -8
                 Layout.bottomMargin: -8
@@ -144,15 +239,12 @@ PageType {
                 leftImageSource: "qrc:/images/controls/folder-open.svg"
                 isSmallLeftImage: true
 
-                clickedFunction: function() {
+                clickedFunction: openLogsHandler
-                    SettingsController.openLogsFolder()
-                }
             }
 
             DividerType {}
 
             LabelWithButtonType {
-                // id: labelWithButton2
                 Layout.fillWidth: true
                 Layout.topMargin: -8
                 Layout.bottomMargin: -8
@@ -161,136 +253,10 @@ PageType {
                 leftImageSource: "qrc:/images/controls/save.svg"
                 isSmallLeftImage: true
 
-                onFocusChanged: {
+                clickedFunction: exportLogsHandler
-                    console.debug("MOVE THIS LOGIC TO CPP!")
-                    if (activeFocus) {
-                        if (fl) {
-                            fl.ensureVisible(this)
-                        }
-                    }
-                }
-
-                clickedFunction: function() {
-                    var fileName = ""
-                    if (GC.isMobile()) {
-                        fileName = "AmneziaVPN.log"
-                    } else {
-                        fileName = SystemController.getFileName(qsTr("Save"),
-                                                                qsTr("Logs files (*.log)"),
-                                                                StandardPaths.standardLocations(StandardPaths.DocumentsLocation) + "/AmneziaVPN",
-                                                                true,
-                                                                ".log")
-                    }
-                    if (fileName !== "") {
-                        PageController.showBusyIndicator(true)
-                        SettingsController.exportLogsFile(fileName)
-                        PageController.showBusyIndicator(false)
-                        PageController.showNotificationMessage(qsTr("Logs file saved"))
-                    }
-                }
             }
 
             DividerType {}
-
-            ListItemTitleType {
-                visible: !GC.isMobile()
-
-                Layout.fillWidth: true
-                Layout.topMargin: 32
-                Layout.leftMargin: 16
-                Layout.rightMargin: 16
-
-                text: qsTr("Service logs")
-            }
-
-            ParagraphTextType {
-                visible: !GC.isMobile()
-
-                Layout.fillWidth: true
-                Layout.topMargin: 8
-                Layout.leftMargin: 16
-                Layout.rightMargin: 16
-
-                color: AmneziaStyle.color.mutedGray
-                text: qsTr("AmneziaVPN-service logs")
-            }
-
-            LabelWithButtonType {
-                // id: labelWithButton2
-
-                visible: !GC.isMobile()
-
-                Layout.fillWidth: true
-                Layout.topMargin: -8
-                Layout.bottomMargin: -8
-
-                text: qsTr("Open logs folder")
-                leftImageSource: "qrc:/images/controls/folder-open.svg"
-                isSmallLeftImage: true
-
-                onFocusChanged: {
-                    console.debug("MOVE THIS LOGIC TO CPP!")
-                    if (activeFocus) {
-                        if (fl) {
-                            fl.ensureVisible(this)
-                        }
-                    }
-                }
-
-                clickedFunction: function() {
-                    SettingsController.openServiceLogsFolder()
-                }
-            }
-
-            DividerType {
-                visible: !GC.isMobile()
-            }
-
-            LabelWithButtonType {
-                // id: labelWithButton2
-
-                visible: !GC.isMobile()
-
-                Layout.fillWidth: true
-                Layout.topMargin: -8
-                Layout.bottomMargin: -8
-
-                text: qsTr("Export logs")
-                leftImageSource: "qrc:/images/controls/save.svg"
-                isSmallLeftImage: true
-
-                onFocusChanged: {
-                    console.debug("MOVE THIS LOGIC TO CPP!")
-                    if (activeFocus) {
-                        if (fl) {
-                            fl.ensureVisible(this)
-                        }
-                    }
-                }
-
-                clickedFunction: function() {
-                    var fileName = ""
-                    if (GC.isMobile()) {
-                        fileName = "AmneziaVPN-service.log"
-                    } else {
-                        fileName = SystemController.getFileName(qsTr("Save"),
-                                                                qsTr("Logs files (*.log)"),
-                                                                StandardPaths.standardLocations(StandardPaths.DocumentsLocation) + "/AmneziaVPN-service",
-                                                                true,
-                                                                ".log")
-                    }
-                    if (fileName !== "") {
-                        PageController.showBusyIndicator(true)
-                        SettingsController.exportServiceLogsFile(fileName)
-                        PageController.showBusyIndicator(false)
-                        PageController.showNotificationMessage(qsTr("Logs file saved"))
-                    }
-                }
-            }
-
-            DividerType {
-                visible: !GC.isMobile()
-            }
         }
     }
 }