Merge pull request #2471 from overleaf/cmg-ns-existing-item-modal

display modal if file exists in drop location

GitOrigin-RevId: 2dbcbce26c32903f1acfdfbf7fdddb676c130098

services/web/app/views/project/editor/file-tree.pug

@@ -281,7 +281,7 @@ script(type='text/ng-template', id='entityListItemTemplate')
 									href
 									ng-click="openNewDocModal()"
 									right-click="openNewDocModal()"
-								) #{translate("new_file")} 
+								) #{translate("new_file")}
 							li
 								a(
 									href
@@ -333,7 +333,7 @@ script(type='text/ng-template', id='newFolderModalTemplate')
 		button.btn.btn-default(
 			ng-disabled="state.inflight"
 			ng-click="cancel()"
-		) #{translate("cancel")} 
+		) #{translate("cancel")}
 		button.btn.btn-primary(
 			ng-disabled="newFolderForm.$invalid || state.inflight"
 			ng-click="create()"
@@ -341,6 +341,16 @@ script(type='text/ng-template', id='newFolderModalTemplate')
 			span(ng-hide="state.inflight") #{translate("create")}
 			span(ng-show="state.inflight") #{translate("creating")}...
 
+script(type='text/ng-template', id='duplicateFileModalTemplate')
+	.modal-header
+		h3 #{translate("duplicate_file")}
+	.modal-body
+		p #{translate("file_already_exists_in_this_location", { fileName: "'{{ fileName }}'" })}
+	.modal-footer
+		button.btn.btn-default(
+			ng-click="cancel()"
+		) #{translate("dismiss")}
+
 include ./new-file-modal
 
 script(type='text/ng-template', id='deleteEntityModalTemplate')

services/web/frontend/js/ide/file-tree/FileTreeManager.js

@@ -676,21 +676,18 @@ define([
       })
     }
 
-    moveEntity(entity, parent_folder, callback) {
+    moveEntity(entity, parent_folder) {
       // Abort move if the folder being moved (entity) has the parent_folder as child
       // since that would break the tree structure.
-      if (callback == null) {
-        callback = function(error) {}
-      }
       if (this._isChildFolder(entity, parent_folder)) {
         return
       }
       // check if a doc/file/folder already exists with this name
       if (this.existsInThisFolder(parent_folder, entity.name)) {
-        return this.nameExistsError()
+        throw new Error('file exists in this location')
       }
       // Wait for the http response before doing the move
-      return this.ide.queuedHttp
+      this.ide.queuedHttp
         .post(
           `/project/${this.ide.project_id}/${entity.type}/${entity.id}/move`,
           {
@@ -699,7 +696,7 @@ define([
           }
         )
         .then(() => {
-          return this._moveEntityInScope(entity, parent_folder)
+          this._moveEntityInScope(entity, parent_folder)
         })
     }
 

services/web/frontend/js/ide/file-tree/controllers/FileTreeController.js

@@ -124,6 +124,15 @@ define(['base'], function(App) {
     return ($scope.cancel = () => $modalInstance.dismiss('cancel'))
   })
 
+  App.controller('DuplicateFileModalController', function(
+    $scope,
+    $modalInstance,
+    fileName
+  ) {
+    $scope.fileName = fileName
+    $scope.cancel = () => $modalInstance.dismiss('cancel')
+  })
+
   App.controller('NewFileModalController', function(
     $scope,
     ide,

services/web/frontend/js/ide/file-tree/controllers/FileTreeFolderController.js

@@ -39,7 +39,19 @@ define(['base'], App =>
         entities = [$(ui.draggable).scope().entity]
       }
       for (let dropped_entity of Array.from(entities)) {
-        ide.fileTreeManager.moveEntity(dropped_entity, $scope.entity)
+        try {
+          ide.fileTreeManager.moveEntity(dropped_entity, $scope.entity)
+        } catch (err) {
+          $modal.open({
+            templateUrl: 'duplicateFileModalTemplate',
+            controller: 'DuplicateFileModalController',
+            resolve: {
+              fileName() {
+                return dropped_entity.name
+              }
+            }
+          })
+        }
       }
       $scope.$digest()
       // clear highlight explicitly

services/web/frontend/js/ide/file-tree/controllers/FileTreeRootFolderController.js

@@ -13,7 +13,7 @@
  * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
  */
 define(['base'], App =>
-  App.controller('FileTreeRootFolderController', function($scope, ide) {
+  App.controller('FileTreeRootFolderController', function($scope, $modal, ide) {
     const { rootFolder } = $scope
     return ($scope.onDrop = function(events, ui) {
       let entities
@@ -23,7 +23,19 @@ define(['base'], App =>
         entities = [$(ui.draggable).scope().entity]
       }
       for (let dropped_entity of Array.from(entities)) {
-        ide.fileTreeManager.moveEntity(dropped_entity, rootFolder)
+        try {
+          ide.fileTreeManager.moveEntity(dropped_entity, rootFolder)
+        } catch (err) {
+          $modal.open({
+            templateUrl: 'duplicateFileModalTemplate',
+            controller: 'DuplicateFileModalController',
+            resolve: {
+              fileName() {
+                return dropped_entity.name
+              }
+            }
+          })
+        }
       }
       $scope.$digest()
       // clear highlight explicitly