Move FindDevicesPage functionality to the drawer

app/CMakeLists.txt

@@ -35,12 +35,12 @@ ecm_target_qml_sources(kdeconnect-app SOURCES
     qml/presentationRemote.qml
     qml/PluginItem.qml
     qml/DevicePage.qml
-    qml/FindDevicesPage.qml
     qml/runcommand.qml
     qml/volume.qml
     qml/MprisSlider.qml
     qml/PluginSettings.qml
     qml/Settings.qml
+    qml/NoDeviceSelected.qml
 )
 
 target_link_libraries(kdeconnect-app PRIVATE Qt::Quick Qt::QuickControls2 Qt::Widgets KF6::CoreAddons KF6::I18n KF6::KCMUtils KF6::Crash)

app/qml/FindDevicesPage.qml

@@ -1,88 +0,0 @@
-/*
- * SPDX-FileCopyrightText: 2016 Aleix Pol Gonzalez <aleixpol@kde.org>
- *
- * SPDX-License-Identifier: GPL-2.0-only OR GPL-3.0-only OR LicenseRef-KDE-Accepted-GPL
- */
-
-import QtQuick
-import QtQuick.Controls
-import QtQuick.Layouts
-import org.kde.kirigami as Kirigami
-import org.kde.kdeconnect
-
-Kirigami.ScrollablePage
-{
-    id: root
-
-    Component {
-        id: deviceComp
-        DevicePage {}
-    }
-
-    objectName: "FindDevices"
-    title: i18ndc("kdeconnect-app", "Title of the page listing the devices", "Devices")
-    supportsRefreshing: true
-
-    onRefreshingChanged: {
-        DaemonDbusInterface.forceOnNetworkChange()
-        refreshResetTimer.start()
-    }
-
-    Timer {
-        id: refreshResetTimer
-        interval: 1000
-        onTriggered: root.refreshing = false
-    }
-
-    ListView {
-        id: devices
-        section {
-            property: "status"
-            delegate: Kirigami.ListSectionHeader {
-
-                width: ListView.view.width
-
-                text: switch (parseInt(section))
-                {
-                    case DevicesModel.Paired:
-                        return i18nd("kdeconnect-app", "Remembered")
-                    case DevicesModel.Reachable:
-                        return i18nd("kdeconnect-app", "Available")
-                    case (DevicesModel.Reachable | DevicesModel.Paired):
-                        return i18nd("kdeconnect-app", "Connected")
-                }
-            }
-        }
-        Kirigami.PlaceholderMessage {
-            text: i18nd("kdeconnect-app", "No devices found")
-            icon.name: 'edit-none-symbolic'
-            anchors.centerIn: parent
-            width: parent.width - (Kirigami.Units.largeSpacing * 4)
-            visible: devices.count === 0
-        }
-
-        model: DevicesSortProxyModel {
-            sourceModel: DevicesModel {}
-        }
-        delegate: ItemDelegate {
-            id: delegate
-            icon.name: iconName
-            text: model.name
-            width: ListView.view.width
-            highlighted: false
-
-            contentItem: Kirigami.IconTitleSubtitle {
-                title: delegate.text
-                subtitle: toolTip
-                icon: icon.fromControlsIcon(delegate.icon)
-            }
-
-            onClicked: {
-                pageStack.push(
-                    deviceComp,
-                    {currentDevice: device}
-                );
-            }
-        }
-    }
-}

app/qml/Main.qml

@@ -24,6 +24,11 @@ Kirigami.ApplicationWindow {
         configGroupName: "MainWindow"
     }
 
+    Component {
+        id: deviceComp
+        DevicePage {}
+    }
+
     globalDrawer: Kirigami.OverlayDrawer {
         id: drawer
         edge: Qt.application.layoutDirection === Qt.RightToLeft ? Qt.RightEdge : Qt.LeftEdge
@@ -50,7 +55,6 @@ Kirigami.ApplicationWindow {
 
         contentItem: ColumnLayout {
             spacing: 0
-
             QQC2.ToolBar {
                 Layout.fillWidth: true
                 Layout.preferredHeight: pageStack.globalToolBar.preferredHeight
@@ -72,57 +76,78 @@ Kirigami.ApplicationWindow {
                     }
                 }
             }
-
-            QQC2.ItemDelegate {
-                id: findDevicesAction
-                text: i18nd("kdeconnect-app", "Find devices...")
-                icon.name: "list-add"
-                checked: pageStack.currentItem && pageStack.currentItem.objectName == "FindDevices"
+            QQC2.ScrollView {
+                Layout.fillWidth: true
+                ListView {
+                    id: devices
                     Layout.fillWidth: true
 
-                onClicked: {
-                    root.pageStack.clear()
-                    root.pageStack.push(Qt.resolvedUrl("FindDevicesPage.qml"));
+                    section {
+                        property: "status"
+                        delegate: Kirigami.ListSectionHeader {
+                            width: ListView.view.width
+                            text: switch (parseInt(section)) {
+                                case DevicesModel.Paired:
+                                    return i18nd("kdeconnect-app", "Remembered")
+                                case DevicesModel.Reachable:
+                                    return i18nd("kdeconnect-app", "Available")
+                                case (DevicesModel.Reachable | DevicesModel.Paired):
+                                    return i18nd("kdeconnect-app", "Connected")
                             }
                         }
-
-            Kirigami.Separator {
-                Layout.fillWidth: true
                     }
-
-            Repeater {
+                    Kirigami.PlaceholderMessage {
+                        text: i18nd("kdeconnect-app", "No devices found")
+                        icon.name: 'edit-none-symbolic'
+                        anchors.centerIn: parent
+                        width: parent.width - (Kirigami.Units.largeSpacing * 4)
+                        visible: devices.count === 0
+                    }
                     model: DevicesSortProxyModel {
-                    sourceModel: DevicesModel {
-                        displayFilter: DevicesModel.Paired | DevicesModel.Reachable
-                    }
+                        sourceModel: DevicesModel {}
                     }
+                    delegate: QQC2.ItemDelegate {
+                        id: delegate
+                        icon.name: iconName
+                        text: model.name
+                        width: ListView.view.width
+                        highlighted: false
 
-                QQC2.ItemDelegate {
-                    Layout.fillWidth: true
                         contentItem: Kirigami.IconTitleSubtitle {
-                        icon.name: model.iconName
-                        icon.width: Kirigami.Units.iconSizes.smallMedium
-                        title: model.name
-                        subtitle: model.toolTip
+                            title: delegate.text
+                            subtitle: toolTip
+                            icon: icon.fromControlsIcon(delegate.icon)
                         }
 
-                    enabled: status & DevicesModel.Reachable
-                    checked: pageStack.currentItem && pageStack.currentItem.currentDevice == device
                         onClicked: {
-                        root.pageStack.pop(0)
-                        root.pageStack.push(
-                            Qt.resolvedUrl("DevicePage.qml"),
+                            pageStack.clear()
+                            pageStack.push(
+                                deviceComp,
                                 {currentDevice: device}
                             );
                         }
                     }
                 }
+            }
+
 
             Item {
                 Layout.fillHeight: true
                 Layout.fillWidth: true
             }
 
+            QQC2.Button {
+                text: i18nc("@action:intoolbar", "Refresh")
+                icon.name: 'view-refresh-symbolic'
+                Layout.fillWidth: true
+                Layout.leftMargin: Kirigami.Units.largeSpacing
+                Layout.rightMargin: Kirigami.Units.largeSpacing
+
+                onClicked: {
+                    refresh
+                }
+            }
+
             QQC2.ItemDelegate {
                 text: i18n("Settings")
                 icon.name: "settings-configure"
@@ -138,5 +163,9 @@ Kirigami.ApplicationWindow {
         id: contextDrawer
     }
 
-    pageStack.initialPage: Qt.resolvedUrl("FindDevicesPage.qml")
+    pageStack.initialPage: Qt.resolvedUrl("NoDeviceSelected.qml")
+
+    function refresh() {
+        DaemonDbusInterface.forceOnNetworkChange()
+    }
 }

app/qml/NoDeviceSelected.qml

@@ -0,0 +1,17 @@
+/*
+ * SPDX-FileCopyrightText: 2024 Darshan Phaldesai <dev.darshanphaldesai@gmail.org>
+ *
+ * SPDX-License-Identifier: GPL-2.0-only OR GPL-3.0-only OR LicenseRef-KDE-Accepted-GPL
+ */
+import QtQuick
+import org.kde.kirigami as Kirigami
+
+Kirigami.Page {
+    id: root
+    // TODO:  replace with proper text components instead of HTML
+    Kirigami.PlaceholderMessage {
+        text: i18nd("kdeconnect_app", "<html><head/><body><p>No device selected.<br><br>If you own an Android device, make sure to install the <a href=\"https://play.google.com/store/apps/details?id=org.kde.kdeconnect_tp\"><span style=\" text-decoration: underline;\">KDE Connect Android app</span></a> (also available <a href=\"https://f-droid.org/repository/browse/?fdid=org.kde.kdeconnect_tp\"><span style=\" text-decoration: underline;\">from F-Droid</span></a>) and it should appear in the list. If you have an iPhone, make sure to install the <a href=\"https://apps.apple.com/us/app/kde-connect/id1580245991\"><span style=\" text-decoration: underline;\">KDE Connect iOS app</span></a> <br><br>If you are having problems, visit the <a href=\"https://userbase.kde.org/KDEConnect\"><span style=\" text-decoration: underline;\">KDE Connect Community wiki</span></a> for help.</p></body></html>")
+        anchors.centerIn: parent
+        width: parent.width - (Kirigami.Units.largeSpacing * 4)
+    }
+}