gui: Add confirmation dialog for revert/override (fixes #7520) (#7522)

gui/default/assets/lang/lang-en.json

@@ -25,6 +25,7 @@
    "An external command handles the versioning. It has to remove the file from the shared folder. If the path to the application contains spaces, it should be quoted.": "An external command handles the versioning. It has to remove the file from the shared folder. If the path to the application contains spaces, it should be quoted.",
    "Anonymous Usage Reporting": "Anonymous Usage Reporting",
    "Anonymous usage report format has changed. Would you like to move to the new format?": "Anonymous usage report format has changed. Would you like to move to the new format?",
+   "Are you sure you want to continue?": "Are you sure you want to continue?",
    "Are you sure you want to permanently delete all these files?": "Are you sure you want to permanently delete all these files?",
    "Are you sure you want to remove device {%name%}?": "Are you sure you want to remove device {{name}}?",
    "Are you sure you want to remove folder {%label%}?": "Are you sure you want to remove folder {{label}}?",
@@ -327,6 +328,8 @@
    "The entered device ID does not look valid. It should be a 52 or 56 character string consisting of letters and numbers, with spaces and dashes being optional.": "The entered device ID does not look valid. It should be a 52 or 56 character string consisting of letters and numbers, with spaces and dashes being optional.",
    "The folder ID cannot be blank.": "The folder ID cannot be blank.",
    "The folder ID must be unique.": "The folder ID must be unique.",
+   "The folder content on other devices will be overwritten to become identical with this device. Files not present here will be deleted on other devices.": "The folder content on other devices will be overwritten to become identical with this device. Files not present here will be deleted on other devices.",
+   "The folder content on this device will be overwritten to become identical with other devices. Files newly added here will be deleted.": "The folder content on this device will be overwritten to become identical with other devices. Files newly added here will be deleted.",
    "The folder path cannot be blank.": "The folder path cannot be blank.",
    "The following intervals are used: for the first hour a version is kept every 30 seconds, for the first day a version is kept every hour, for the first 30 days a version is kept every day, until the maximum age a version is kept every week.": "The following intervals are used: for the first hour a version is kept every 30 seconds, for the first day a version is kept every hour, for the first 30 days a version is kept every day, until the maximum age a version is kept every week.",
    "The following items could not be synchronized.": "The following items could not be synchronized.",
@@ -383,6 +386,7 @@
    "Waiting to Clean": "Waiting to Clean",
    "Waiting to Scan": "Waiting to Scan",
    "Waiting to Sync": "Waiting to Sync",
+   "Warning": "Warning",
    "Warning, this path is a parent directory of an existing folder \"{%otherFolder%}\".": "Warning, this path is a parent directory of an existing folder \"{{otherFolder}}\".",
    "Warning, this path is a parent directory of an existing folder \"{%otherFolderLabel%}\" ({%otherFolder%}).": "Warning, this path is a parent directory of an existing folder \"{{otherFolderLabel}}\" ({{otherFolder}}).",
    "Warning, this path is a subdirectory of an existing folder \"{%otherFolder%}\".": "Warning, this path is a subdirectory of an existing folder \"{{otherFolder}}\".",

gui/default/index.html

@@ -535,10 +535,10 @@
                   </table>
                 </div>
                 <div class="panel-footer">
-                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="override(folder.id)" ng-if="folderStatus(folder) == 'outofsync' && folder.type == 'sendonly'">
+                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="revertOverrideConfirmationModal('override', folder.id)" ng-if="folderStatus(folder) == 'outofsync' && folder.type == 'sendonly'">
                     <span class="fas fa-arrow-circle-up"></span>&nbsp;<span translate>Override Changes</span>
                   </button>
-                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="revert(folder.id)" ng-if="canRevert(folder.id)">
+                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="revertOverrideConfirmationModal('revert', folder.id)" ng-if="hasReceiveOnlyChanged(folder)">
                     <span class="fa fa-arrow-circle-down"></span>&nbsp;<span translate>Revert Local Changes</span>
                   </button>
                   <span class="pull-right">
@@ -895,6 +895,7 @@
   <ng-include src="'syncthing/core/aboutModalView.html'"></ng-include>
   <ng-include src="'syncthing/core/discoveryFailuresModalView.html'"></ng-include>
   <ng-include src="'syncthing/folder/removeFolderDialogView.html'"></ng-include>
+  <ng-include src="'syncthing/folder/revertOverrideView.html'"></ng-include>
   <ng-include src="'syncthing/device/removeDeviceDialogView.html'"></ng-include>
   <ng-include src="'syncthing/core/logViewerModalView.html'"></ng-include>
 

gui/default/syncthing/core/syncthingController.js

@@ -2473,10 +2473,6 @@ angular.module('syncthing.core')
             return $scope.model[folder].errors !== 0;
         };
 
-        $scope.override = function (folder) {
-            $http.post(urlbase + "/db/override?folder=" + encodeURIComponent(folder));
-        };
-
         $scope.showLocalChanged = function (folder) {
             $scope.localChangedFolder = folder;
             $scope.localChanged = $scope.refreshLocalChanged(1, 10);
@@ -2486,10 +2482,6 @@ angular.module('syncthing.core')
             });
         };
 
-        $scope.revert = function (folder) {
-            $http.post(urlbase + "/db/revert?folder=" + encodeURIComponent(folder));
-        };
-
         $scope.canRevert = function (folder) {
             var f = $scope.model[folder];
             if (!f) {
@@ -2498,6 +2490,35 @@ angular.module('syncthing.core')
             return $scope.model[folder].receiveOnlyTotalItems > 0;
         };
 
+        $scope.revertOverride = function () {
+            $http.post(
+                urlbase + "/db/" + $scope.revertOverrideParams.operation +"?folder="
+                +encodeURIComponent($scope.revertOverrideParams.folderID));
+        };
+
+        $scope.revertOverrideConfirmationModal = function (type, folderID) {
+            var params = {
+                type: type,
+                folderID: folderID,
+            };
+            switch (type) {
+                case "override":
+                    params.heading = $translate.instant("Override");
+                    params.operation = "override";
+                    break;
+                case "revert":
+                    params.heading = $translate.instant("Revert");
+                    params.operation = "revert";
+                    break;
+                case "deleteEnc":
+                    params.heading = $translate.instant("Delete Unexpected Items");
+                    params.operation = "revert";
+                    break;
+            }
+            $scope.revertOverrideParams = params;
+            $('#revert-override-confirmation').modal('show');
+        };
+
         $scope.advanced = function () {
             $scope.advancedConfig = angular.copy($scope.config);
             $scope.advancedConfig.devices.sort(deviceCompare);

gui/default/syncthing/folder/revertOverrideView.html

@@ -0,0 +1,33 @@
+<modal id="revert-override-confirmation" status="danger" icon="fas fa-question-circle" heading="{{revertOverrideParams.heading}}" large="no" closeable="yes">
+  <div class="modal-body" ng-switch="revertOverrideParams.type">
+    <div ng-switch-when="deleteEnc">
+      <p>
+        <span translate>Unexpected items have been found in this folder.</span></br>
+        <span translate translate-value-receive-encrypted="{{'Receive Encrypted' | translate}}">You should never add or change anything locally in a "{%receiveEncrypted%}" folder.</span>
+      </p>
+      <p translate>
+        Are you sure you want to permanently delete all these files?
+      </p>
+    </div>
+    <div ng-switch-default>
+      <p>
+        <span translate>Warning</span>:</br>
+        <span ng-switch="revertOverrideParams.type">
+          <span ng-switch-when="override" translate>The folder content on other devices will be overwritten to become identical with this device. Files not present here will be deleted on other devices.</span>
+          <span ng-switch-default translate>The folder content on this device will be overwritten to become identical with other devices. Files newly added here will be deleted.</span>
+        </span>
+      </p>
+      <p translate>
+        Are you sure you want to continue?
+      </p>
+    </div>
+  </div>
+  <div class="modal-footer">
+    <button type="button" class="btn btn-danger pull-left btn-sm" data-dismiss="modal" ng-click="revertOverride()">
+      <span class="fas fa-check"></span>&nbsp;<span translate>Yes</span>
+    </button>
+    <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">
+      <span class="fas fa-times"></span>&nbsp;<span translate>No</span>
+    </button>
+  </div>
+</modal>

gui/default/untrusted/index.html

@@ -544,13 +544,13 @@
                   </table>
                 </div>
                 <div class="panel-footer">
-                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="override(folder.id)" ng-if="folderStatus(folder) == 'outofsync' && folder.type == 'sendonly'">
+                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="revertOverrideConfirmationModal('override', folder.id)" ng-if="folderStatus(folder) == 'outofsync' && folder.type == 'sendonly'">
                     <span class="fas fa-arrow-circle-up"></span>&nbsp;<span translate>Override Changes</span>
                   </button>
-                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="revert(folder.id)" ng-if="hasReceiveOnlyChanged(folder)">
+                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="revertOverrideConfirmationModal('revert', folder.id)" ng-if="hasReceiveOnlyChanged(folder)">
                     <span class="fa fa-arrow-circle-down"></span>&nbsp;<span translate>Revert Local Changes</span>
                   </button>
-                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="deleteEncryptionModal(folder.id)" ng-if="hasReceiveEncryptedItems(folder)">
+                  <button type="button" class="btn btn-sm btn-danger pull-left" ng-click="revertOverrideConfirmationModal('deleteEnc', folder.id)" ng-if="hasReceiveEncryptedItems(folder)">
                     <span class="fa fa-arrow-lock"></span>&nbsp;<span translate>Delete Unexpected Items</span>
                   </button>
                   <span class="pull-right">
@@ -907,7 +907,7 @@
   <ng-include src="'syncthing/core/aboutModalView.html'"></ng-include>
   <ng-include src="'syncthing/core/discoveryFailuresModalView.html'"></ng-include>
   <ng-include src="'syncthing/folder/removeFolderDialogView.html'"></ng-include>
-  <ng-include src="'syncthing/folder/deleteEncryptionFolderDialogView.html'"></ng-include>
+  <ng-include src="'syncthing/folder/revertOverrideView.html'"></ng-include>
   <ng-include src="'syncthing/device/removeDeviceDialogView.html'"></ng-include>
   <ng-include src="'syncthing/core/logViewerModalView.html'"></ng-include>
 

gui/default/untrusted/syncthing/core/syncthingController.js

@@ -2513,10 +2513,6 @@ angular.module('syncthing.core')
             return $scope.model[folder].errors !== 0;
         };
 
-        $scope.override = function (folder) {
-            $http.post(urlbase + "/db/override?folder=" + encodeURIComponent(folder));
-        };
-
         $scope.showLocalChanged = function (folder, folderType) {
             $scope.localChangedFolder = folder;
             $scope.localChangedType = folderType;
@@ -2551,15 +2547,33 @@ angular.module('syncthing.core')
             return counts.receiveOnlyTotalItems - counts.receiveOnlyChangedDeletes;
         }
 
-        $scope.revert = function (folder) {
+        $scope.revertOverride = function () {
-            $http.post(urlbase + "/db/revert?folder=" + encodeURIComponent(folder));
+            $http.post(
+                urlbase + "/db/" + $scope.revertOverrideParams.operation +"?folder="
+                +encodeURIComponent($scope.revertOverrideParams.folderID));
         };
 
-        $scope.deleteEncryptionModal = function (folderID) {
+        $scope.revertOverrideConfirmationModal = function (type, folderID) {
-            $scope.revertEncryptionFolder = folderID;
+            var params = {
-            $('#delete-encryption-confirmation').modal('show').one('hidden.bs.modal', function () {
+                type: type,
-                $scope.revertEncryptionFolder = undefined;
+                folderID: folderID,
-            });
+            };
+            switch (type) {
+                case "override":
+                    params.heading = $translate.instant("Override");
+                    params.operation = "override";
+                    break;
+                case "revert":
+                    params.heading = $translate.instant("Revert");
+                    params.operation = "revert";
+                    break;
+                case "deleteEnc":
+                    params.heading = $translate.instant("Delete Unexpected Items");
+                    params.operation = "revert";
+                    break;
+            }
+            $scope.revertOverrideParams = params;
+            $('#revert-override-confirmation').modal('show');
         };
 
         $scope.advanced = function () {
@@ -2777,7 +2791,6 @@ angular.module('syncthing.core')
                     address.indexOf('unix://') == 0 ||
                     address.indexOf('unixs://') == 0);
         }
-
     })
     .directive('shareTemplate', function () {
         return {

gui/default/untrusted/syncthing/folder/deleteEncryptionFolderDialogView.html

@@ -1,19 +0,0 @@
-<modal id="delete-encryption-confirmation" status="danger" icon="fas fa-question-circle" heading="{{'Delete Unexpected Items' | translate}}" large="no" closeable="yes">
-  <div class="modal-body">
-    <p>
-      <span translate>Unexpected items have been found in this folder.</span></br>
-      <span translate translate-value-receive-encrypted="{{'Receive Encrypted' | translate}}">You should never add or change anything locally in a "{%receiveEncrypted%}" folder.</span>
-    </p>
-    <p translate>
-      Are you sure you want to permanently delete all these files?
-    </p>
-  </div>
-  <div class="modal-footer">
-    <button type="button" class="btn btn-danger pull-left btn-sm" data-dismiss="modal" ng-click="revert(revertEncryptionFolder)">
-      <span class="fas fa-check"></span>&nbsp;<span translate>Yes</span>
-    </button>
-    <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">
-      <span class="fas fa-times"></span>&nbsp;<span translate>No</span>
-    </button>
-  </div>
-</modal>