NMC-533 Set new folder name inline

apps/files/js/filelist.js

@@ -1940,7 +1940,7 @@
 			}
 
 			if (options.scrollTo) {
-				this.scrollTo(fileData.name);
+				this.scrollTo(fileData.name, options.showDetailsView !== undefined ? options.showDetailsView : true);
 			}
 
 			// defaults to true if not defined
@@ -3050,7 +3050,7 @@
 		 *
 		 * @since 8.2
 		 */
-		createDirectory: function(name) {
+		 createDirectory: function(name, options) {
 			var self = this;
 			var deferred = $.Deferred();
 			var promise = deferred.promise();
@@ -3066,7 +3066,8 @@
 
 			this.filesClient.createDirectory(targetPath)
 				.done(function() {
-					self.addAndFetchFileInfo(targetPath, '', {scrollTo:true}).then(function(status, data) {
+					options = _.extend({scrollTo: true}, options || {});
+					self.addAndFetchFileInfo(targetPath, '', options).then(function(status, data) {
 						deferred.resolve(status, data);
 					}, function() {
 						OC.Notification.show(t('files', 'Could not create folder "{dir}"',
@@ -3077,8 +3078,9 @@
 				.fail(function(createStatus) {
 					// method not allowed, folder might exist already
 					if (createStatus === 405) {
+						options = _.extend({scrollTo: true}, options || {});
 						// add it to the list, for completeness
-						self.addAndFetchFileInfo(targetPath, '', {scrollTo:true})
+						self.addAndFetchFileInfo(targetPath, '', options)
 							.done(function(status, data) {
 								OC.Notification.show(t('files', 'Could not create folder "{dir}" because it already exists',
 									{dir: name}), {type: 'error'}
@@ -3316,11 +3318,11 @@
 			this.$el.find('.mask').remove();
 			this.$table.removeClass('hidden');
 		},
-		scrollTo:function(file) {
+		scrollTo:function(file, showDetailsView = true) {
 			if (!_.isArray(file)) {
 				file = [file];
 			}
-			if (file.length === 1) {
+			if (file.length === 1 && showDetailsView) {
 				_.defer(function() {
 					this.showDetailsView(file[0]);
 				}.bind(this));
@@ -3536,7 +3538,10 @@
 		},
 
 		getUniqueName: function(name) {
-			if (this.findFileEl(name).exists()) {
+			var fileNamesOld = this.files.findIndex(function(el) {
+				return el.name === name
+			})
+			if (fileNamesOld !== -1) {
 				var numMatch;
 				var parts=name.split('.');
 				var extension = "";

apps/files/js/newfilemenu.js

@@ -52,7 +52,11 @@
 				iconClass: 'icon-folder',
 				fileType: 'folder',
 				actionHandler: function(name) {
-					self.fileList.createDirectory(name);
+					const uniqueName = self.fileList.getUniqueName(name)
+                	let tempPromise = self.fileList.createDirectory(uniqueName, { showDetailsView: false })
+                	Promise.all([tempPromise]).then(() => {
+                		self.fileList.rename(uniqueName)
+                	})
 				}
 		        }];
 
@@ -90,102 +94,12 @@
 
 		_promptFileName: function($target) {
 			var self = this;
-
-			if ($target.find('form').length) {
-				$target.find('input[type=\'text\']').focus();
-				return;
-			}
-
-			// discard other forms
-			this.$el.find('form').remove();
-			this.$el.find('.displayname').removeClass('hidden');
-
-			$target.find('.displayname').addClass('hidden');
-
-			var newName = $target.attr('data-templatename');
-			var fileType = $target.attr('data-filetype');
-			var $form = $(OCA.Files.Templates['newfilemenu_filename_form']({
-				fileName: newName,
-				cid: this.cid,
-				fileType: fileType
-			}));
-
-			//this.trigger('actionPerformed', action);
-			$target.append($form);
-
-			// here comes the OLD code
-			var $input = $form.find('input[type=\'text\']');
-			var $submit = $form.find('input[type=\'submit\']');
-
-			var lastPos;
-			var checkInput = function () {
-				// Special handling for the setup template directory
-				if ($target.attr('data-action') === 'template-init') {
-					return true;
-				}
-
-				var filename = $input.val();
-				try {
-					if (!Files.isFileNameValid(filename)) {
-						// Files.isFileNameValid(filename) throws an exception itself
-					} else if (self.fileList.inList(filename)) {
-						throw t('files', '{newName} already exists', {newName: filename}, undefined, {
-							escape: false
-						});
-					} else {
-						return true;
-					}
-				} catch (error) {
-					$input.attr('title', error);
-					$input.tooltip({placement: 'right', trigger: 'manual', 'container': '.newFileMenu'});
-					$input.tooltip('fixTitle');
-					$input.tooltip('show');
-					$input.addClass('error');
-				}
-				return false;
-			};
-
-			// verify filename on typing
-			$input.keyup(function() {
-				if (checkInput()) {
-					$input.tooltip('hide');
-					$input.removeClass('error');
-				}
-			});
-
-			$submit.click(function(event) {
-				event.stopPropagation();
-				event.preventDefault();
-				$form.submit();
-			});
-
-			$input.focus();
-			// pre select name up to the extension
-			lastPos = newName.lastIndexOf('.');
-			if (lastPos === -1) {
-				lastPos = newName.length;
-			}
-			$input.selectRange(0, lastPos);
-
-			$form.submit(function(event) {
-				event.stopPropagation();
-				event.preventDefault();
-
-				if (checkInput()) {
-					var newname = $input.val().trim();
-
-					/* Find the right actionHandler that should be called.
-					 * Actions is retrieved by using `actionSpec.id` */
-					var action = _.filter(self._menuItems, function(item) {
-						return item.id == $target.attr('data-action');
-					}).pop();
-					action.actionHandler(newname);
-
-					$form.remove();
-					$target.find('.displayname').removeClass('hidden');
-					OC.hideMenus();
-				}
-			});
+			var newname = $target.attr('data-templatename');
+        	var action = _.filter(self._menuItems, function(item) {
+            	return item.id == $target.attr('data-action');
+        	}).pop();
+        	action.actionHandler(newname);
+			OC.hideMenus();
 		},
 
 		/**

apps/files/src/templates.js

@@ -110,7 +110,8 @@ templates.forEach((provider, index) => {
 				iconClass: provider.iconClass || 'icon-file',
 				fileType: 'file',
 				actionHandler(name) {
-					TemplatePicker.open(name, provider)
+					const fileName = FileList.getUniqueName(name)
+					TemplatePicker.open(fileName, provider)
 				},
 			})
 		},

apps/files/src/views/TemplatePicker.vue

@@ -208,18 +208,9 @@ export default {
 				const fileInfo = response.data.ocs.data
 				this.logger.debug('Created new file', fileInfo)
 
-				await fileList?.addAndFetchFileInfo(this.name)
-
-				// Run default action
-				const fileAction = OCA.Files.fileActions.getDefaultFileAction(fileInfo.mime, 'file', OC.PERMISSION_ALL)
-				fileAction.action(fileInfo.basename, {
-					$file: fileList?.findFileEl(this.name),
-					dir: currentDirectory,
-					fileList,
-					fileActions: fileList?.fileActions,
-					fileInfoModel: fileList?.getModelForFile(this.name),
-				})
-
+				const options = _.extend({ scrollTo: true }, { showDetailsView: false } || {})
+				await fileList?.addAndFetchFileInfo(this.name, undefined, options)
+				fileList.rename(this.name)
 				this.close()
 			} catch (error) {
 				this.logger.error('Error while creating the new file from template')

apps/files/tests/js/newfilemenuSpec.js

@@ -62,41 +62,13 @@ describe('OCA.Files.NewFileMenu', function() {
 		beforeEach(function() {
 			createDirectoryStub = sinon.stub(FileList.prototype, 'createDirectory');
 			menu.$el.find('.menuitem').eq(1).click();
-			$input = menu.$el.find('form.filenameform input');
 		});
 		afterEach(function() {
 			createDirectoryStub.restore();
 		});
 
-		it('sets default text in field', function() {
-			// text + submit
-			expect($input.length).toEqual(2);
-			expect($input.val()).toEqual('New folder');
-		});
-		it('prevents entering invalid file names', function() {
-			$input.val('..');
-			$input.trigger(new $.Event('keyup', {keyCode: 13}));
-			$input.closest('form').submit();
-
-			expect(createDirectoryStub.notCalled).toEqual(true);
-		});
-		it('prevents entering file names that already exist', function() {
-			var inListStub = sinon.stub(fileList, 'inList').returns(true);
-			$input.val('existing.txt');
-			$input.trigger(new $.Event('keyup', {keyCode: 13}));
-			$input.closest('form').submit();
-
-			expect(createDirectoryStub.notCalled).toEqual(true);
-			inListStub.restore();
-		});
 		it('creates directory when clicking on create directory field', function() {
-			$input = menu.$el.find('form.filenameform input');
-			$input.val('some folder');
-			$input.trigger(new $.Event('keyup', {keyCode: 13}));
-			$input.closest('form').submit();
-
-			expect(createDirectoryStub.calledOnce).toEqual(true);
-			expect(createDirectoryStub.getCall(0).args[0]).toEqual('some folder');
+			expect(createDirectoryStub.getCall(0).args[0]).toEqual('New folder');
 		});
 	});
 	describe('custom entries', function() {
@@ -135,17 +107,7 @@ describe('OCA.Files.NewFileMenu', function() {
 		});
 		it('calls action handler when clicking on custom item', function() {
 			menu.$el.find('.menuitem').eq(2).click();
-			var $input = menu.$el.find('form.filenameform input');
-			$input.val('some name');
-			$input.trigger(new $.Event('keyup', {keyCode: 13}));
-			$input.closest('form').submit();
-
-			expect(actionStub.calledOnce).toEqual(true);
-			expect(actionStub.getCall(0).args[0]).toEqual('some name');
-		});
-		it('switching fields removes the previous form', function() {
-			menu.$el.find('.menuitem').eq(2).click();
-			expect(menu.$el.find('form').length).toEqual(1);
+			expect(actionStub.getCall(0).args[0]).toEqual('New text file.txt');
 		});
 	});
 });