gui: Keep short deviceID length consistent + xrefs (fixes #9313) (#9314)

Making short deviceID length consistent and referencing to protocol file
for future-proof edits. Closes #9313.

3 files changed, 8 insertions, 5 deletions

diff --git a/gui/default/index.html b/gui/default/index.html
index 729e50580..6e26461ce 100644
--- a/gui/default/index.html
+++ b/gui/default/index.html
@@ -910,7 +910,7 @@
                       </tr>
                       <tr ng-if="deviceCfg.introducedBy">
                         <th><span class="far fa-fw fa-handshake-o"></span>&nbsp;<span translate>Introduced By</span></th>
-                        <td class="text-right">{{ deviceName(devices[deviceCfg.introducedBy]) || deviceCfg.introducedBy.substring(0, 5) }}</td>
+                        <td class="text-right">{{ deviceName(devices[deviceCfg.introducedBy]) || deviceShortID(deviceCfg.introducedBy) }}</td>
                       </tr>
                       <tr ng-if="deviceCfg.autoAcceptFolders">
                         <th><span class="fa fa-fw fa-level-down"></span>&nbsp;<span translate>Auto Accept</span></th>
diff --git a/gui/default/syncthing/app.js b/gui/default/syncthing/app.js
index 0a961f508..2731445cd 100644
--- a/gui/default/syncthing/app.js
+++ b/gui/default/syncthing/app.js
@@ -18,6 +18,9 @@ var syncthing = angular.module('syncthing', [
 var urlbase = 'rest';
 var authUrlbase = urlbase + '/noauth/auth';
 
+// keep consistent with ShortIDStringLength in lib/protocol/deviceid.go
+var shortIDStringLength = 7;
+
 syncthing.config(function ($httpProvider, $translateProvider, LocaleServiceProvider) {
     // language and localisation
 
diff --git a/gui/default/syncthing/core/syncthingController.js b/gui/default/syncthing/core/syncthingController.js
index 32fca420e..b31f94188 100755
--- a/gui/default/syncthing/core/syncthingController.js
+++ b/gui/default/syncthing/core/syncthingController.js
@@ -1460,7 +1460,7 @@ angular.module('syncthing.core')
 
         $scope.friendlyNameFromShort = function (shortID) {
             var matches = Object.keys($scope.devices).filter(function (id) {
-                return id.substr(0, 7) === shortID;
+                return id.substr(0, shortIDStringLength) === shortID;
             });
             if (matches.length !== 1) {
                 return shortID;
@@ -1473,7 +1473,7 @@ angular.module('syncthing.core')
             if (match) {
                 return $scope.deviceName(match);
             }
-            return deviceID.substr(0, 6);
+            return deviceID.substr(0, shortIDStringLength);
         };
 
         $scope.deviceName = function (deviceCfg) {
@@ -1490,7 +1490,7 @@ angular.module('syncthing.core')
             if (typeof deviceID === 'undefined') {
                 return "";
             }
-            return deviceID.substr(0, 6);
+            return deviceID.substr(0, shortIDStringLength);
         };
 
         $scope.thisDeviceName = function () {
@@ -1501,7 +1501,7 @@ angular.module('syncthing.core')
             if (device.name) {
                 return device.name;
             }
-            return device.deviceID.substr(0, 6);
+            return device.deviceID.substr(0, shortIDStringLength);
         };
 
         $scope.showDeviceIdentification = function (deviceCfg) {