From 9c2428c2eed9455b1bd413256cfb3a74a7b47fa4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Colomb?= <src@andre.colomb.de>
Date: Fri, 22 Jul 2022 11:09:26 +0200
Subject: [PATCH] gui: Use discovered IDs from cache when adding a new remote
 device (#8382)

* gui: Use discovered IDs from cache when adding a new remote device.

The GUI already does refreshDiscoveryCache() when it comes online and
on every 10 second refresh cycle.  Querying the same information
freshly in addDevice() seems unnecessary and adds some more round-trip
delay on a possibly slow network link.  Instead use the IDs from the
existing discoveryCache property to populate the suggested ID list.

* Increase maximum suggested device ID count to 100.

For the auto-completion list, which is hidden by default and filtered
by the browser, we can offer more discovered device IDs without
causing much confusion.  The list of suggested "nearby" devices is
still limited to the first five.

* Rename $scope.discoveryUnknown.

The old name "discovery" was pretty ambiguous..
---
 .../syncthing/core/syncthingController.js     | 51 +++++++++----------
 .../syncthing/device/editDeviceModalView.html |  6 +--
 2 files changed, 26 insertions(+), 31 deletions(-)

diff --git a/gui/default/syncthing/core/syncthingController.js b/gui/default/syncthing/core/syncthingController.js
index 9c40c2123..60655fcc6 100755
--- a/gui/default/syncthing/core/syncthingController.js
+++ b/gui/default/syncthing/core/syncthingController.js
@@ -1670,34 +1670,29 @@ angular.module('syncthing.core')
         };
 
         $scope.addDevice = function (deviceID, name) {
-            return $http.get(urlbase + '/system/discovery')
-                .success(function (registry) {
-                    $scope.discovery = [];
-                    for (var id in registry) {
-                        if ($scope.discovery.length === 5) {
-                            break;
-                        }
-                        if (id in $scope.devices) {
-                            continue
-                        }
-                        $scope.discovery.push(id);
-                    }
-                })
-                .then(function () {
-                    $http.get(urlbase + '/config/defaults/device').then(function (p) {
-                        $scope.currentDevice = p.data;
-                        $scope.currentDevice.name = name;
-                        $scope.currentDevice.deviceID = deviceID;
-                        if (deviceID) {
-                            $scope.currentDevice._editing = "new-pending";
-                        } else {
-                            $scope.currentDevice._editing = "new";
-                        }
-                        initShareEditing('device');
-                        $scope.currentSharing.unrelated = $scope.folderList();
-                        editDeviceModal();
-                    }, $scope.emitHTTPError);
-                });
+            $scope.discoveryUnknown = [];
+            for (var id in $scope.discoveryCache) {
+                if ($scope.discoveryUnknown.length === 100) {
+                    break;
+                }
+                if (id in $scope.devices) {
+                    continue
+                }
+                $scope.discoveryUnknown.push(id);
+            }
+            return $http.get(urlbase + '/config/defaults/device').then(function (p) {
+                $scope.currentDevice = p.data;
+                $scope.currentDevice.name = name;
+                $scope.currentDevice.deviceID = deviceID;
+                if (deviceID) {
+                    $scope.currentDevice._editing = "new-pending";
+                } else {
+                    $scope.currentDevice._editing = "new";
+                }
+                initShareEditing('device');
+                $scope.currentSharing.unrelated = $scope.folderList();
+                editDeviceModal();
+            }, $scope.emitHTTPError);
         };
 
         $scope.deleteDevice = function () {
diff --git a/gui/default/syncthing/device/editDeviceModalView.html b/gui/default/syncthing/device/editDeviceModalView.html
index 646a235d1..c8ea125d2 100644
--- a/gui/default/syncthing/device/editDeviceModalView.html
+++ b/gui/default/syncthing/device/editDeviceModalView.html
@@ -21,12 +21,12 @@
             </div>
             <div ng-if="editingDeviceNew()">
               <datalist id="discovery-list">
-                <option ng-repeat="id in discovery" value="{{id}}" />
+                <option ng-repeat="id in discoveryUnknown" value="{{id}}" />
               </datalist>
-              <div class="help-block" ng-if="discovery && discovery.length !== 0">
+              <div class="help-block" ng-if="discoveryUnknown && discoveryUnknown.length !== 0">
                 <span translate>You can also select one of these nearby devices:</span>
                 <ul>
-                  <li ng-repeat="id in discovery" style="list-style-type: none;">
+                  <li ng-repeat="id in discoveryUnknown.slice(0, 5)" style="list-style-type: none;">
                     <a href="#" ng-click="currentDevice.deviceID = id">
                       <identicon data-value="id"></identicon>&nbsp;&nbsp;{{id}}
                     </a>