nodebb-plugin-composer-default 10.3.20 → 10.3.22

package/library.js

@@ -241,7 +241,7 @@ function generateDiscardRoute(req, topicData) {
 }
 
 async function generateBody(req, postData) {
-	let body = '';
+	let body;
 	// Quoted reply
 	if (req.query.toPid && parseInt(req.query.quoted, 10) === 1 && postData) {
 		const username = await user.getUserField(postData.uid, 'username');
@@ -250,8 +250,9 @@ async function generateBody(req, postData) {
 			`> ${postData ? `${postData.content.replace(/\n/g, '\n> ')}\n\n` : ''}`;
 	} else if (req.query.body || req.query.content) {
 		body = validator.escape(String(req.query.body || req.query.content));
+	} else {
+		body = postData ? postData.content : '';
 	}
-	body = postData ? postData.content : '';
 	return translator.escape(body);
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-composer-default",
-  "version": "10.3.20",
+  "version": "10.3.22",
   "description": "Default composer for NodeBB",
   "main": "library.js",
   "repository": {
@@ -33,8 +33,8 @@
     "validator": "^13.7.0"
   },
   "devDependencies": {
-    "eslint": "^9.25.1",
-    "eslint-config-nodebb": "^1.1.4",
+    "eslint": "^10.0.0",
+    "eslint-config-nodebb": "^2.0.1",
     "eslint-plugin-import": "^2.31.0"
   }
 }

package/static/lib/client.js

@@ -74,7 +74,7 @@ $(document).ready(function () {
 		data.title = data.title || data.topicName;
 		if (config['composer-default'].composeRouteEnabled !== 'on') {
 			require(['composer'], function (composer) {
-				var topicUUID = composer.findByTid(data.tid);
+				const topicUUID = composer.findByTid(data.tid);
 				composer.addQuote({
 					tid: data.tid,
 					toPid: data.pid,

package/static/lib/composer/autocomplete.js

@@ -3,7 +3,7 @@
 define('composer/autocomplete', [
 	'composer/preview', 'autocomplete',
 ], function (preview, Autocomplete) {
-	var autocomplete = {
+	const autocomplete = {
 		_active: {},
 	};
 
@@ -15,9 +15,9 @@ define('composer/autocomplete', [
 	});
 
 	autocomplete.init = function (postContainer, post_uuid) {
-		var element = postContainer.find('.write');
-		var dropdownClass = 'composer-autocomplete-dropdown-' + post_uuid;
-		var timer;
+		const element = postContainer.find('.write');
+		const dropdownClass = 'composer-autocomplete-dropdown-' + post_uuid;
+		let timer;
 
 		if (!element.length) {
 			/**
@@ -29,7 +29,7 @@ define('composer/autocomplete', [
 			return;
 		}
 
-		var data = {
+		const data = {
 			element: element,
 			strategies: [],
 			options: {
@@ -46,13 +46,13 @@ define('composer/autocomplete', [
 		element.on('keyup', function () {
 			clearTimeout(timer);
 			timer = setTimeout(function () {
-				var dropdown = document.querySelector('.' + dropdownClass);
+				const dropdown = document.querySelector('.' + dropdownClass);
 				if (dropdown) {
-					var pos = dropdown.getBoundingClientRect();
+					const pos = dropdown.getBoundingClientRect();
 
-					var margin = parseFloat(dropdown.style.marginTop, 10) || 0;
+					const margin = parseFloat(dropdown.style.marginTop, 10) || 0;
 
-					var offset = window.innerHeight + margin - 10 - pos.bottom;
+					const offset = window.innerHeight + margin - 10 - pos.bottom;
 					dropdown.style.marginTop = Math.min(offset, 0) + 'px';
 				}
 			}, 0);

package/static/lib/composer/categoryList.js

@@ -3,12 +3,13 @@
 define('composer/categoryList', [
 	'categorySelector', 'taskbar', 'api',
 ], function (categorySelector, taskbar, api) {
-	var categoryList = {};
+	const categoryList = {};
 
-	var selector;
+	let selector;
+	let mobileSelector;
 
 	categoryList.init = function (postContainer, postData) {
-		var listContainer = postContainer.find('.category-list-container');
+		const listContainer = postContainer.find('.category-list-container');
 		if (!listContainer.length) {
 			return;
 		}
@@ -25,31 +26,35 @@ define('composer/categoryList', [
 			onSelect: function (selectedCategory) {
 				if (postData.hasOwnProperty('cid')) {
 					changeCategory(postContainer, postData, selectedCategory);
+					mobileSelector.selectCategory(selectedCategory.cid, selectedCategory.categoryEl);
 				}
 			},
 		});
 		if (!selector) {
 			return;
 		}
-		if (postData.cid && postData.category) {
-			selector.selectedCategory = { cid: postData.cid, name: postData.category.name };
-		} else if (ajaxify.data.template.compose && ajaxify.data.selectedCategory) {
-			// separate composer route
-			selector.selectedCategory = { cid: ajaxify.data.cid, name: ajaxify.data.selectedCategory };
-		}
-
 		// this is the mobile category selector
-		categorySelector.init(
+		mobileSelector = categorySelector.init(
 			postContainer.find('.mobile-navbar [component="category-selector"]'), {
 				privilege: 'topics:create',
 				states: ['watching', 'tracking', 'notwatching', 'ignoring'],
 				onSelect: function (selectedCategory) {
 					if (postData.hasOwnProperty('cid')) {
 						changeCategory(postContainer, postData, selectedCategory);
+						selector.selectCategory(selectedCategory.cid, selectedCategory.categoryEl);
 					}
 				},
 			});
 
+		if (postData.cid && postData.category) {
+			selector.selectedCategory = { cid: postData.cid, name: postData.category.name };
+			mobileSelector.selectedCategory = { cid: postData.cid, name: postData.category.name };
+		} else if (ajaxify.data.template.compose && ajaxify.data.selectedCategory) {
+			// separate composer route
+			selector.selectedCategory = { cid: ajaxify.data.cid, name: ajaxify.data.selectedCategory };
+			mobileSelector.selectedCategory = { cid: ajaxify.data.cid, name: ajaxify.data.selectedCategory };
+		}
+
 		toggleDropDirection(postContainer);
 	};
 
@@ -58,7 +63,7 @@ define('composer/categoryList', [
 	}
 
 	categoryList.getSelectedCid = function () {
-		var selectedCategory;
+		let selectedCategory;
 		if (selector) {
 			selectedCategory = selector.getSelectedCategory();
 		}
@@ -75,7 +80,7 @@ define('composer/categoryList', [
 
 	function updateTaskbarByCategory(postContainer, category) {
 		if (category) {
-			var uuid = postContainer.attr('data-uuid');
+			const uuid = postContainer.attr('data-uuid');
 			taskbar.update('composer', uuid, {
 				image: category.backgroundImage,
 				color: category.color,

package/static/lib/composer/controls.js

@@ -1,13 +1,13 @@
 'use strict';
 
 define('composer/controls', ['composer/preview'], function (preview) {
-	var controls = {};
+	const controls = {};
 
 	/** ********************************************** */
 	/* Rich Textarea Controls                        */
 	/** ********************************************** */
 	controls.insertIntoTextarea = function (textarea, value) {
-		var payload = {
+		const payload = {
 			context: this,
 			textarea: textarea,
 			value: value,
@@ -19,9 +19,9 @@ define('composer/controls', ['composer/preview'], function (preview) {
 			return;
 		}
 
-		var $textarea = $(payload.textarea);
-		var currentVal = $textarea.val();
-		var postContainer = $textarea.parents('[component="composer"]');
+		const $textarea = $(payload.textarea);
+		const currentVal = $textarea.val();
+		const postContainer = $textarea.parents('[component="composer"]');
 
 		$textarea.val(
 			currentVal.slice(0, payload.textarea.selectionStart) +
@@ -33,7 +33,7 @@ define('composer/controls', ['composer/preview'], function (preview) {
 	};
 
 	controls.replaceSelectionInTextareaWith = function (textarea, value) {
-		var payload = {
+		const payload = {
 			context: this,
 			textarea: textarea,
 			value: value,
@@ -45,9 +45,9 @@ define('composer/controls', ['composer/preview'], function (preview) {
 			return;
 		}
 
-		var $textarea = $(payload.textarea);
-		var currentVal = $textarea.val();
-		var postContainer = $textarea.parents('[component="composer"]');
+		const $textarea = $(payload.textarea);
+		const currentVal = $textarea.val();
+		const postContainer = $textarea.parents('[component="composer"]');
 
 		$textarea.val(
 			currentVal.slice(0, payload.textarea.selectionStart) +
@@ -59,7 +59,7 @@ define('composer/controls', ['composer/preview'], function (preview) {
 	};
 
 	controls.wrapSelectionInTextareaWith = function (textarea, leading, trailing) {
-		var payload = {
+		const payload = {
 			context: this,
 			textarea: textarea,
 			leading: leading,
@@ -76,10 +76,10 @@ define('composer/controls', ['composer/preview'], function (preview) {
 			trailing = leading;
 		}
 
-		var $textarea = $(textarea);
-		var currentVal = $textarea.val();
+		const $textarea = $(textarea);
+		const currentVal = $textarea.val();
 
-		var matches = /^(\s*)([\s\S]*?)(\s*)$/.exec(currentVal.slice(textarea.selectionStart, textarea.selectionEnd));
+		let matches = /^(\s*)([\s\S]*?)(\s*)$/.exec(currentVal.slice(textarea.selectionStart, textarea.selectionEnd));
 
 		if (!matches[2]) {
 			// selection is entirely whitespace
@@ -100,7 +100,7 @@ define('composer/controls', ['composer/preview'], function (preview) {
 	};
 
 	controls.updateTextareaSelection = function (textarea, start, end) {
-		var payload = {
+		const payload = {
 			context: this,
 			textarea: textarea,
 			start: start,
@@ -119,12 +119,11 @@ define('composer/controls', ['composer/preview'], function (preview) {
 
 	controls.getBlockData = function (textareaEl, query, selectionStart) {
 		// Determines whether the cursor is sitting inside a block-type element (bold, italic, etc.)
-		var value = textareaEl.value;
+		let value = textareaEl.value;
 		query = query.replace(/[-[\]/{}()*+?.\\^$|]/g, '\\$&');
-		var regex = new RegExp(query, 'g');
-		var match;
-		var matchIndices = [];
-		var payload;
+		const regex = new RegExp(query, 'g');
+		let match;
+		const matchIndices = [];
 
 		// Isolate the line the cursor is on
 		value = value.split('\n').reduce(function (memo, line) {
@@ -146,7 +145,7 @@ define('composer/controls', ['composer/preview'], function (preview) {
 			matchIndices.push(match.index);
 		}
 
-		payload = {
+		const payload = {
 			in: !!(matchIndices.reduce(function (memo, cur) {
 				if (selectionStart >= cur + 2) {
 					memo += 1;

package/static/lib/composer/drafts.js

@@ -259,6 +259,7 @@ define('composer/drafts', ['api', 'alerts'], function (api, alerts) {
 		require(['composer'], function (composer) {
 			if (draft.action === 'topics.post') {
 				composer.newTopic({
+					fromDraft: true,
 					save_id: draft.save_id,
 					cid: draft.cid,
 					handle: app.user && app.user.uid ? undefined : utils.escapeHTML(draft.handle),
@@ -274,6 +275,7 @@ define('composer/drafts', ['api', 'alerts'], function (api, alerts) {
 					}
 
 					composer.newReply({
+						fromDraft: true,
 						save_id: draft.save_id,
 						tid: draft.tid,
 						toPid: draft.toPid,
@@ -283,6 +285,7 @@ define('composer/drafts', ['api', 'alerts'], function (api, alerts) {
 				});
 			} else if (draft.action === 'posts.edit') {
 				composer.editPost({
+					fromDraft: true,
 					save_id: draft.save_id,
 					pid: draft.pid,
 					title: draft.title ? utils.escapeHTML(draft.title) : undefined,
@@ -295,10 +298,10 @@ define('composer/drafts', ['api', 'alerts'], function (api, alerts) {
 
 	// Feature detection courtesy of: https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API
 	function canSave(type) {
-		var storage;
+		let storage;
 		try {
 			storage = window[type];
-			var x = '__storage_test__';
+			const x = '__storage_test__';
 			storage.setItem(x, x);
 			storage.removeItem(x);
 			return true;

package/static/lib/composer/formatting.js

@@ -3,18 +3,18 @@
 define('composer/formatting', [
 	'composer/preview', 'composer/resize', 'topicThumbs', 'screenfull',
 ], function (preview, resize, topicThumbs, screenfull) {
-	var formatting = {};
+	const formatting = {};
 
-	var formattingDispatchTable = {
+	const formattingDispatchTable = {
 		picture: function () {
-			var postContainer = this;
+			const postContainer = this;
 			postContainer.find('#files')
 				.attr('accept', 'image/*')
 				.click();
 		},
 
 		upload: function () {
-			var postContainer = this;
+			const postContainer = this;
 			postContainer.find('#files')
 				.attr('accept', '')
 				.click();
@@ -22,7 +22,7 @@ define('composer/formatting', [
 
 		thumbs: function () {
 			formatting.exitFullscreen();
-			var postContainer = this;
+			const postContainer = this;
 			require(['composer'], function (composer) {
 				const uuid = postContainer.get(0).getAttribute('data-uuid');
 				const composerObj = composer.posts[uuid];
@@ -39,12 +39,12 @@ define('composer/formatting', [
 		},
 
 		tags: function () {
-			var postContainer = this;
+			const postContainer = this;
 			postContainer.find('.tags-container').toggleClass('hidden');
 		},
 
 		zen: function () {
-			var postContainer = this;
+			const postContainer = this;
 			$(window).one('resize', function () {
 				function onResize() {
 					if (!screenfull.isFullscreen) {
@@ -70,7 +70,7 @@ define('composer/formatting', [
 		},
 	};
 
-	var buttons = [];
+	const buttons = [];
 
 	formatting.exitFullscreen = function () {
 		if (screenfull.isEnabled && screenfull.isFullscreen) {
@@ -82,7 +82,7 @@ define('composer/formatting', [
 		const formattingBarEl = $('.formatting-bar');
 		const fileForm = formattingBarEl.find('.formatting-group #fileForm');
 		buttons.forEach((btn) => {
-			let markup = ``;
+			let markup;
 			if (Array.isArray(btn.dropdownItems) && btn.dropdownItems.length) {
 				markup = generateFormattingDropdown(btn);
 			} else {
@@ -178,8 +178,8 @@ define('composer/formatting', [
 
 	formatting.addHandler = function (postContainer) {
 		postContainer.on('click', '.formatting-bar [data-format]', function (event) {
-			var format = $(this).attr('data-format');
-			var textarea = $(this).parents('[component="composer"]').find('textarea')[0];
+			const format = $(this).attr('data-format');
+			const textarea = $(this).parents('[component="composer"]').find('textarea')[0];
 
 			if (formattingDispatchTable.hasOwnProperty(format)) {
 				formattingDispatchTable[format].call(

package/static/lib/composer/preview.js

@@ -1,7 +1,7 @@
 'use strict';
 
 define('composer/preview', ['hooks'], function (hooks) {
-	var preview = {};
+	const preview = {};
 
 	preview.render = function (postContainer, callback) {
 		callback = callback || function () {};
@@ -9,7 +9,7 @@ define('composer/preview', ['hooks'], function (hooks) {
 			return callback();
 		}
 
-		var textarea = postContainer.find('textarea');
+		const textarea = postContainer.find('textarea');
 
 		socket.emit('plugins.composer.renderPreview', textarea.val(), function (err, preview) {
 			if (err) {
@@ -27,17 +27,17 @@ define('composer/preview', ['hooks'], function (hooks) {
 		if (!postContainer.find('.preview-container').is(':visible')) {
 			return;
 		}
-		var textarea = postContainer.find('textarea');
-		var preview = postContainer.find('.preview');
+		const textarea = postContainer.find('textarea');
+		const preview = postContainer.find('.preview');
 
 		if (textarea.length && preview.length) {
-			var diff = textarea[0].scrollHeight - textarea.height();
+			const diff = textarea[0].scrollHeight - textarea.height();
 
 			if (diff === 0) {
 				return;
 			}
 
-			var scrollPercent = textarea.scrollTop() / diff;
+			const scrollPercent = textarea.scrollTop() / diff;
 
 			preview.scrollTop(Math.max(preview[0].scrollHeight - preview.height(), 0) * scrollPercent);
 		}

package/static/lib/composer/resize.js

@@ -2,18 +2,18 @@
 'use strict';
 
 define('composer/resize', ['taskbar'], function (taskbar) {
-	var resize = {};
-	var oldRatio = 0;
-	var minimumRatio = 0.3;
-	var snapMargin = 0.05;
-	var smallMin = 768;
-
-	var $body = $('body');
-	var $window = $(window);
-	var $headerMenu = $('[component="navbar"]');
+	const resize = {};
+	let oldRatio = 0;
+	const minimumRatio = 0.3;
+	const snapMargin = 0.05;
+	const smallMin = 768;
+
+	const $body = $('body');
+	const $window = $(window);
+	const $headerMenu = $('[component="navbar"]');
 	const content = document.getElementById('content');
 
-	var header = $headerMenu[0];
+	const header = $headerMenu[0];
 
 	function getSavedRatio() {
 		return localStorage.getItem('composer:resizeRatio') || 0.5;
@@ -24,7 +24,7 @@ define('composer/resize', ['taskbar'], function (taskbar) {
 	}
 
 	function getBounds() {
-		var headerRect;
+		let headerRect;
 		if (header) {
 			headerRect = header.getBoundingClientRect();
 		} else {
@@ -32,9 +32,9 @@ define('composer/resize', ['taskbar'], function (taskbar) {
 			headerRect = { bottom: 0 };
 		}
 
-		var headerBottom = Math.max(headerRect.bottom, 0);
+		const headerBottom = Math.max(headerRect.bottom, 0);
 
-		var rect = {
+		const rect = {
 			top: 0,
 			left: 0,
 			right: window.innerWidth,
@@ -51,24 +51,24 @@ define('composer/resize', ['taskbar'], function (taskbar) {
 	}
 
 	function doResize(postContainer, ratio) {
-		var bounds = getBounds();
-		var elem = postContainer[0];
-		var style = window.getComputedStyle(elem);
+		const bounds = getBounds();
+		const elem = postContainer[0];
+		const style = window.getComputedStyle(elem);
 
 		// Adjust minimumRatio for shorter viewports
-		var minHeight = parseInt(style.getPropertyValue('min-height'), 10);
-		var adjustedMinimum = Math.max(minHeight / window.innerHeight, minimumRatio);
+		const minHeight = parseInt(style.getPropertyValue('min-height'), 10);
+		const adjustedMinimum = Math.max(minHeight / window.innerHeight, minimumRatio);
 
 		if (bounds.width >= smallMin) {
 			const boundedDifference = (bounds.height - bounds.boundedHeight) / bounds.height;
 			ratio = Math.min(Math.max(ratio, adjustedMinimum + boundedDifference), 1);
 
-			var top = ratio * bounds.boundedHeight / bounds.height;
+			const top = ratio * bounds.boundedHeight / bounds.height;
 			elem.style.top = ((1 - top) * 100).toString() + '%';
 
 			// Add some extra space at the bottom of the body so that
 			// the user can still scroll to the last post w/ composer open
-			var rect = elem.getBoundingClientRect();
+			const rect = elem.getBoundingClientRect();
 			content.style.paddingBottom = (rect.bottom - rect.top).toString() + 'px';
 		} else {
 			elem.style.top = 0;
@@ -80,8 +80,8 @@ define('composer/resize', ['taskbar'], function (taskbar) {
 		taskbar.updateActive(postContainer.attr('data-uuid'));
 	}
 
-	var resizeIt = doResize;
-	var raf = window.requestAnimationFrame ||
+	let resizeIt = doResize;
+	const raf = window.requestAnimationFrame ||
 		window.webkitRequestAnimationFrame ||
 		window.mozRequestAnimationFrame;
 
@@ -99,7 +99,7 @@ define('composer/resize', ['taskbar'], function (taskbar) {
 	}
 
 	resize.reposition = function (postContainer) {
-		var ratio = getSavedRatio();
+		let ratio = getSavedRatio();
 
 		if (ratio >= 1 - snapMargin) {
 			ratio = 1;
@@ -118,15 +118,15 @@ define('composer/resize', ['taskbar'], function (taskbar) {
 	};
 
 	resize.handleResize = function (postContainer) {
-		var resizeOffset = 0;
-		var resizeBegin = 0;
-		var resizeEnd = 0;
-		var $resizer = postContainer.find('.resizer');
-		var resizer = $resizer[0];
+		let resizeOffset = 0;
+		let resizeBegin = 0;
+		let resizeEnd = 0;
+		const $resizer = postContainer.find('.resizer');
+		const resizer = $resizer[0];
 
 		function resizeStart(e) {
-			var resizeRect = resizer.getBoundingClientRect();
-			var resizeCenterY = (resizeRect.top + resizeRect.bottom) / 2;
+			const resizeRect = resizer.getBoundingClientRect();
+			const resizeCenterY = (resizeRect.top + resizeRect.bottom) / 2;
 
 			resizeOffset = (resizeCenterY - e.clientY) / 2;
 			resizeBegin = e.clientY;
@@ -137,9 +137,9 @@ define('composer/resize', ['taskbar'], function (taskbar) {
 		}
 
 		function resizeAction(e) {
-			var position = e.clientY - resizeOffset;
-			var bounds = getBounds();
-			var ratio = (bounds.height - position) / (bounds.boundedHeight);
+			const position = e.clientY - resizeOffset;
+			const bounds = getBounds();
+			const ratio = (bounds.height - position) / (bounds.boundedHeight);
 
 			resizeIt(postContainer, ratio);
 		}
@@ -153,9 +153,9 @@ define('composer/resize', ['taskbar'], function (taskbar) {
 			$window.off('mouseup', resizeStop);
 			$body.off('touchmove', resizeTouchAction);
 
-			var position = resizeEnd - resizeOffset;
-			var bounds = getBounds();
-			var ratio = (bounds.height - position) / (bounds.boundedHeight);
+			const position = resizeEnd - resizeOffset;
+			const bounds = getBounds();
+			let ratio = (bounds.height - position) / (bounds.boundedHeight);
 
 			if (resizeEnd - resizeBegin === 0 && postContainer.hasClass('maximized')) {
 				postContainer.removeClass('maximized');

package/static/lib/composer/tags.js

@@ -2,13 +2,13 @@
 'use strict';
 
 define('composer/tags', ['alerts'], function (alerts) {
-	var tags = {};
+	const tags = {};
 
-	var minTags;
-	var maxTags;
+	let minTags;
+	let maxTags;
 
 	tags.init = function (postContainer, postData) {
-		var tagEl = postContainer.find('.tags');
+		const tagEl = postContainer.find('.tags');
 		if (!tagEl.length) {
 			return;
 		}
@@ -58,9 +58,9 @@ define('composer/tags', ['alerts'], function (alerts) {
 			addTags(postData.tags, tagEl);
 
 			tagEl.on('beforeItemAdd', function (event) {
-				var reachedMaxTags = maxTags && maxTags <= tags.getTags(postContainer.attr('data-uuid')).length;
-				var cleanTag = utils.cleanUpTag(event.item, config.maximumTagLength);
-				var different = cleanTag !== event.item;
+				const reachedMaxTags = maxTags && maxTags <= tags.getTags(postContainer.attr('data-uuid')).length;
+				const cleanTag = utils.cleanUpTag(event.item, config.maximumTagLength);
+				const different = cleanTag !== event.item;
 				event.cancel = different ||
 					event.item.length < config.minimumTagLength ||
 					event.item.length > config.maximumTagLength ||
@@ -73,7 +73,7 @@ define('composer/tags', ['alerts'], function (alerts) {
 				} else if (reachedMaxTags) {
 					return alerts.error('[[error:too-many-tags, ' + maxTags + ']]');
 				}
-				var cid = postData.hasOwnProperty('cid') ? postData.cid : ajaxify.data.cid;
+				const cid = postData.hasOwnProperty('cid') ? postData.cid : ajaxify.data.cid;
 				$(window).trigger('action:tag.beforeAdd', {
 					cid,
 					tagEl,
@@ -109,7 +109,7 @@ define('composer/tags', ['alerts'], function (alerts) {
 				if (event.options && event.options.skipAddCheck) {
 					return;
 				}
-				var cid = postData.hasOwnProperty('cid') ? postData.cid : ajaxify.data.cid;
+				const cid = postData.hasOwnProperty('cid') ? postData.cid : ajaxify.data.cid;
 				socket.emit('topics.isTagAllowed', { tag: event.item, cid: cid || 0 }, function (err, allowed) {
 					if (err) {
 						return alerts.error(err);
@@ -136,7 +136,7 @@ define('composer/tags', ['alerts'], function (alerts) {
 		});
 
 		$('[component="composer/tag/dropdown"]').on('click', 'li', function () {
-			var tag = $(this).attr('data-tag');
+			const tag = $(this).attr('data-tag');
 			if (tag) {
 				addTags([tag], tagEl);
 			}
@@ -153,7 +153,7 @@ define('composer/tags', ['alerts'], function (alerts) {
 	};
 
 	tags.onChangeCategory = function (postContainer, postData, cid, categoryData) {
-		var tagDropdown = postContainer.find('[component="composer/tag/dropdown"]');
+		const tagDropdown = postContainer.find('[component="composer/tag/dropdown"]');
 		if (!tagDropdown.length) {
 			return;
 		}
@@ -168,8 +168,8 @@ define('composer/tags', ['alerts'], function (alerts) {
 	};
 
 	function toggleTagInput(postContainer, postData, data) {
-		var tagEl = postContainer.find('.tags');
-		var input = postContainer.find('.bootstrap-tagsinput input');
+		const tagEl = postContainer.find('.tags');
+		const input = postContainer.find('.bootstrap-tagsinput input');
 		if (!input.length) {
 			return;
 		}
@@ -212,7 +212,7 @@ define('composer/tags', ['alerts'], function (alerts) {
 
 	function triggerEnter(input) {
 		// http://stackoverflow.com/a/3276819/583363
-		var e = jQuery.Event('keypress');
+		const e = jQuery.Event('keypress');
 		e.which = 13;
 		e.keyCode = 13;
 		setTimeout(function () {
@@ -222,7 +222,7 @@ define('composer/tags', ['alerts'], function (alerts) {
 
 	function addTags(tags, tagEl) {
 		if (tags && tags.length) {
-			for (var i = 0; i < tags.length; ++i) {
+			for (let i = 0; i < tags.length; ++i) {
 				tagEl.tagsinput('add', tags[i]);
 			}
 		}

package/static/lib/composer/uploads.js

@@ -8,11 +8,11 @@ define('composer/uploads', [
 	'uploadHelpers',
 	'jquery-form',
 ], function (preview, categoryList, translator, alerts, uploadHelpers) {
-	var uploads = {
+	const uploads = {
 		inProgress: {},
 	};
 
-	var uploadingText = '';
+	let uploadingText = '';
 
 	uploads.initialize = function (post_uuid) {
 		initializeDragAndDrop(post_uuid);
@@ -26,10 +26,10 @@ define('composer/uploads', [
 	};
 
 	function addChangeHandlers(post_uuid) {
-		var postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
+		const postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
 
 		postContainer.find('#files').on('change', function (e) {
-			var files = (e.target || {}).files ||
+			const files = (e.target || {}).files ||
 				($(this).val() ? [{ name: $(this).val(), type: utils.fileMimeType($(this).val()) }] : null);
 			if (files) {
 				uploadContentFiles({ files: files, post_uuid: post_uuid, route: '/api/post/upload' });
@@ -38,7 +38,7 @@ define('composer/uploads', [
 	}
 
 	function initializeDragAndDrop(post_uuid) {
-		var postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
+		const postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
 		uploadHelpers.handleDragDrop({
 			container: postContainer,
 			callback: function (upload) {
@@ -53,7 +53,7 @@ define('composer/uploads', [
 	}
 
 	function initializePaste(post_uuid) {
-		var postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
+		const postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
 		uploadHelpers.handlePaste({
 			container: postContainer,
 			callback: function (upload) {
@@ -77,35 +77,34 @@ define('composer/uploads', [
 	}
 
 	function uploadContentFiles(params) {
-		var files = [...params.files];
-		var post_uuid = params.post_uuid;
-		var postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
-		var textarea = postContainer.find('textarea');
-		var text = textarea.val();
-		var uploadForm = postContainer.find('#fileForm');
-		var doneUploading = false;
+		const files = [...params.files];
+		const post_uuid = params.post_uuid;
+		const postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
+		const textarea = postContainer.find('textarea');
+		let text = textarea.val();
+		const uploadForm = postContainer.find('#fileForm');
+		let doneUploading = false;
 		uploadForm.attr('action', config.relative_path + params.route);
 
-		var cid = categoryList.getSelectedCid();
+		let cid = categoryList.getSelectedCid();
 		if (!cid && ajaxify.data.cid) {
 			cid = ajaxify.data.cid;
 		}
-		var i = 0;
-		var isImage = false;
-		for (i = 0; i < files.length; ++i) {
-			isImage = files[i].type.match(/image./);
+
+		for (let i = 0; i < files.length; ++i) {
+			const isImage = files[i].type.match(/image./);
 			if ((isImage && !app.user.privileges['upload:post:image']) || (!isImage && !app.user.privileges['upload:post:file'])) {
 				return alerts.error('[[error:no-privileges]]');
 			}
 		}
 
-		var filenameMapping = [];
+		const filenameMapping = [];
 		let filesText = '';
-		for (i = 0; i < files.length; ++i) {
+		for (let i = 0; i < files.length; ++i) {
 			// The filename map has datetime and iterator prepended so that they can be properly tracked even if the
 			// filenames are identical.
 			filenameMapping.push(i + '_' + Date.now() + '_' + (params.fileNames ? params.fileNames[i] : files[i].name));
-			isImage = files[i].type.match(/image./);
+			const isImage = files[i].type.match(/image./);
 
 			if (!app.user.isAdmin && files[i].size > parseInt(config.maximumFileSize, 10) * 1024) {
 				uploadForm[0].reset();
@@ -136,12 +135,12 @@ define('composer/uploads', [
 
 		uploadForm.off('submit').submit(function () {
 			function updateTextArea(filename, text, trim) {
-				var newFilename;
+				let newFilename;
 				if (trim) {
 					newFilename = filename.replace(/^\d+_\d{13}_/, '');
 				}
-				var current = textarea.val();
-				var re = new RegExp(escapeRegExp(filename) + ']\\([^)]+\\)', 'g');
+				const current = textarea.val();
+				const re = new RegExp(escapeRegExp(filename) + ']\\([^)]+\\)', 'g');
 				textarea.val(current.replace(re, (newFilename || filename) + '](' + text + ')'));
 
 				$(window).trigger('action:composer.uploadUpdate', {
@@ -171,7 +170,7 @@ define('composer/uploads', [
 					doneUploading = true;
 					postContainer.find('[data-action="post"]').prop('disabled', false);
 					const errorMsg = onUploadError(xhr, post_uuid);
-					for (var i = 0; i < files.length; ++i) {
+					for (let i = 0; i < files.length; ++i) {
 						updateTextArea(filenameMapping[i], errorMsg, true);
 					}
 					preview.render(postContainer);
@@ -182,7 +181,7 @@ define('composer/uploads', [
 						if (doneUploading) {
 							return;
 						}
-						for (var i = 0; i < files.length; ++i) {
+						for (let i = 0; i < files.length; ++i) {
 							updateTextArea(filenameMapping[i], translated);
 						}
 					});
@@ -192,7 +191,7 @@ define('composer/uploads', [
 					const uploads = res.response.images;
 					doneUploading = true;
 					if (uploads && uploads.length) {
-						for (var i = 0; i < uploads.length; ++i) {
+						for (let i = 0; i < uploads.length; ++i) {
 							uploads[i].filename = filenameMapping[i].replace(/^\d+_\d{13}_/, '');
 							uploads[i].isImage = /image./.test(files[i].type);
 							updateTextArea(filenameMapping[i], uploads[i].url, true);
@@ -221,7 +220,7 @@ define('composer/uploads', [
 	}
 
 	function onUploadError(xhr, post_uuid) {
-		var msg = (xhr.responseJSON &&
+		let msg = (xhr.responseJSON &&
 			(xhr.responseJSON.error || (xhr.responseJSON.status && xhr.responseJSON.status.message))) ||
 			'[[error:parse-error]]';
 

package/static/lib/composer.js

@@ -25,7 +25,7 @@ define('composer', [
 ], function (taskbar, translator, uploads, formatting, drafts, tags,
 	categoryList, preview, resize, autocomplete, scheduler, postQueue, scrollStop,
 	topicThumbs, api, bootbox, alerts, hooks, messagesModule, search, screenfull) {
-	var composer = {
+	const composer = {
 		active: undefined,
 		posts: {},
 		bsEnvironment: undefined,
@@ -41,7 +41,7 @@ define('composer', [
 	});
 
 	window.addEventListener('popstate', function () {
-		var env = utils.findBootstrapEnvironment();
+		const env = utils.findBootstrapEnvironment();
 		if (composer.active && (env === 'xs' || env === 'sm')) {
 			if (!composer.posts[composer.active].modified) {
 				composer.discard(composer.active);
@@ -64,15 +64,15 @@ define('composer', [
 	});
 
 	function removeComposerHistory() {
-		var env = composer.bsEnvironment;
+		const env = composer.bsEnvironment;
 		if (ajaxify.data.template.compose === true || env === 'xs' || env === 'sm') {
 			history.back();
 		}
 	}
 
 	function onWindowResize() {
-		var env = utils.findBootstrapEnvironment();
-		var isMobile = env === 'xs' || env === 'sm';
+		const env = utils.findBootstrapEnvironment();
+		const isMobile = env === 'xs' || env === 'sm';
 
 		if (preview.toggle && preview.env !== env) {
 			preview.env = env;
@@ -93,9 +93,7 @@ define('composer', [
 
 	function alreadyOpen(post) {
 		// If a composer for the same cid/tid/pid is already open, return the uuid, else return bool false
-		var type;
-		var id;
-
+		let type;
 		if (post.hasOwnProperty('cid')) {
 			type = 'cid';
 		} else if (post.hasOwnProperty('tid')) {
@@ -104,11 +102,11 @@ define('composer', [
 			type = 'pid';
 		}
 
-		id = post[type];
+		const id = String(post[type]);
 
 		// Find a match
 		for (const uuid of Object.keys(composer.posts)) {
-			if (composer.posts[uuid].hasOwnProperty(type) && id === composer.posts[uuid][type]) {
+			if (composer.posts[uuid].hasOwnProperty(type) && id === String(composer.posts[uuid][type])) {
 				return uuid;
 			}
 		}
@@ -122,12 +120,10 @@ define('composer', [
 			return;
 		}
 
-		var uuid = utils.generateUUID();
-		var existingUUID = alreadyOpen(post);
-
+		const existingUUID = alreadyOpen(post);
 		if (existingUUID) {
 			taskbar.updateActive(existingUUID);
-			if (post.body) {
+			if (post.body && !post.fromDraft) {
 				const postContainer = $('.composer[data-uuid="' + existingUUID + '"]');
 				const bodyEl = postContainer.find('textarea');
 				const prevText = bodyEl.val();
@@ -137,18 +133,16 @@ define('composer', [
 			}
 			return composer.load(existingUUID);
 		}
-
-		var actionText = '[[topic:composer.new-topic]]';
+		const uuid = utils.generateUUID();
+		let actionText = '[[topic:composer.new-topic]]';
 		if (post.action === 'posts.reply') {
-			actionText = '[[topic:composer.replying-to]]';
+			actionText = translator.compile('topic:composer.replying-to', `"${post.title}"`);
 		} else if (post.action === 'posts.edit') {
-			actionText = '[[topic:composer.editing-in]]';
+			actionText = translator.compile('topic:composer.editing-in', `"${post.title}"`);
 		}
 
-		translator.translate(actionText, function (translatedAction) {
-			taskbar.push('composer', uuid, {
-				title: translatedAction.replace('%1', '"' + post.title + '"'),
-			});
+		taskbar.push('composer', uuid, {
+			title: actionText,
 		});
 
 		composer.posts[uuid] = post;
@@ -188,6 +182,7 @@ define('composer', [
 
 	composer.newTopic = async (data) => {
 		let pushData = {
+			fromDraft: data.fromDraft,
 			save_id: data.save_id,
 			action: 'topics.post',
 			cid: data.cid,
@@ -212,7 +207,7 @@ define('composer', [
 		// tid, toPid, selectedPid, title, username, text, uuid
 		data.uuid = data.uuid || composer.active;
 
-		var escapedTitle = (data.title || '')
+		const escapedTitle = (data.title || '')
 			.replace(/([\\`*_{}[\]()#+\-.!])/g, '\\$1')
 			.replace(/\[/g, '[')
 			.replace(/\]/g, ']')
@@ -246,9 +241,9 @@ define('composer', [
 			composer.load(data.uuid);
 		}
 
-		var postContainer = $('.composer[data-uuid="' + data.uuid + '"]');
-		var bodyEl = postContainer.find('textarea');
-		var prevText = bodyEl.val();
+		const postContainer = $('.composer[data-uuid="' + data.uuid + '"]');
+		const bodyEl = postContainer.find('textarea');
+		const prevText = bodyEl.val();
 
 		translator.translate(quoteKey, config.defaultLang, function (translated) {
 			composer.posts[data.uuid].body = (prevText.length ? prevText + '\n\n' : '') + translated + data.body;
@@ -261,6 +256,7 @@ define('composer', [
 	composer.newReply = function (data) {
 		translator.translate(data.body, config.defaultLang, function (translated) {
 			push({
+				fromDraft: data.fromDraft,
 				save_id: data.save_id,
 				action: 'posts.reply',
 				tid: data.tid,
@@ -279,6 +275,7 @@ define('composer', [
 			if (err) {
 				return alerts.error(err);
 			}
+			postData.fromDraft = data.fromDraft;
 			postData.save_id = data.save_id;
 			postData.action = 'posts.edit';
 			postData.pid = data.pid;
@@ -296,7 +293,7 @@ define('composer', [
 	};
 
 	composer.load = function (post_uuid) {
-		var postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
+		const postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
 		if (postContainer.length) {
 			activate(post_uuid);
 			resize.reposition(postContainer);
@@ -432,12 +429,12 @@ define('composer', [
 	}
 
 	async function createNewComposer(post_uuid) {
-		var postData = composer.posts[post_uuid];
+		let postData = composer.posts[post_uuid];
 
-		var isTopic = postData ? postData.hasOwnProperty('cid') : false;
-		var isMain = postData ? !!postData.isMain : false;
-		var isEditing = postData ? !!postData.pid : false;
-		var isGuestPost = postData ? parseInt(postData.uid, 10) === 0 : false;
+		const isTopic = postData ? postData.hasOwnProperty('cid') : false;
+		const isMain = postData ? !!postData.isMain : false;
+		const isEditing = postData ? !!postData.pid : false;
+		const isGuestPost = postData ? parseInt(postData.uid, 10) === 0 : false;
 		const isScheduled = postData.timestamp > Date.now();
 
 		postData.category = await getSelectedCategory(postData);
@@ -512,7 +509,7 @@ define('composer', [
 
 			$(document.body).append(composerTemplate);
 
-			var postContainer = $(composerTemplate[0]);
+			const postContainer = $(composerTemplate[0]);
 
 			resize.reposition(postContainer);
 			composer.enhance(postContainer, post_uuid, postData);
@@ -535,10 +532,10 @@ define('composer', [
 			resize.handleResize(postContainer);
 
 			if (composer.bsEnvironment === 'xs' || composer.bsEnvironment === 'sm') {
-				var submitBtns = postContainer.find('.composer-submit');
-				var mobileSubmitBtn = postContainer.find('.mobile-navbar .composer-submit');
-				var textareaEl = postContainer.find('.write');
-				var idx = textareaEl.attr('tabindex');
+				const submitBtns = postContainer.find('.composer-submit');
+				const mobileSubmitBtn = postContainer.find('.mobile-navbar .composer-submit');
+				const textareaEl = postContainer.find('.write');
+				const idx = textareaEl.attr('tabindex');
 
 				submitBtns.removeAttr('tabindex');
 				mobileSubmitBtn.attr('tabindex', parseInt(idx, 10) + 1);
@@ -582,7 +579,7 @@ define('composer', [
 			message: '[[modules:composer.remote-pid-content-immutable]]',
 			timeout: 15000,
 		});
-		var container = postContainer.find('.write-container');
+		const container = postContainer.find('.write-container');
 		container.addClass('hidden');
 	}
 
@@ -605,10 +602,10 @@ define('composer', [
 	}
 
 	function handleSearch(postContainer) {
-		var uuid = postContainer.attr('data-uuid');
-		var isEditing = composer.posts[uuid] && composer.posts[uuid].action === 'posts.edit';
-		var env = utils.findBootstrapEnvironment();
-		var isMobile = env === 'xs' || env === 'sm';
+		const uuid = postContainer.attr('data-uuid');
+		const isEditing = composer.posts[uuid] && composer.posts[uuid].action === 'posts.edit';
+		const env = utils.findBootstrapEnvironment();
+		const isMobile = env === 'xs' || env === 'sm';
 		if (isEditing || isMobile) {
 			return;
 		}
@@ -642,7 +639,7 @@ define('composer', [
 
 	function focusElements(postContainer) {
 		setTimeout(function () {
-			var title = postContainer.find('input.title');
+			const title = postContainer.find('input.title');
 
 			if (title.length) {
 				title.focus();
@@ -653,13 +650,13 @@ define('composer', [
 	}
 
 	async function post(post_uuid) {
-		var postData = composer.posts[post_uuid];
-		var postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
-		var handleEl = postContainer.find('.handle');
-		var titleEl = postContainer.find('.title');
-		var bodyEl = postContainer.find('textarea');
-		var thumbEl = postContainer.find('input#topic-thumb-url');
-		var onComposeRoute = postData.hasOwnProperty('template') && postData.template.compose === true;
+		const postData = composer.posts[post_uuid];
+		const postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
+		const handleEl = postContainer.find('.handle');
+		const titleEl = postContainer.find('.title');
+		const bodyEl = postContainer.find('textarea');
+		const thumbEl = postContainer.find('input#topic-thumb-url');
+		const onComposeRoute = postData.hasOwnProperty('template') && postData.template.compose === true;
 		const submitBtn = postContainer.find('.composer-submit');
 
 		titleEl.val(titleEl.val().trim());
@@ -668,13 +665,13 @@ define('composer', [
 			thumbEl.val(thumbEl.val().trim());
 		}
 
-		var action = postData.action;
+		const action = postData.action;
 
-		var checkTitle = (postData.hasOwnProperty('cid') || parseInt(postData.pid, 10)) && postContainer.find('input.title').length;
-		var isCategorySelected = !checkTitle || (checkTitle && postData.cid);
+		const checkTitle = (postData.hasOwnProperty('cid') || parseInt(postData.pid, 10)) && postContainer.find('input.title').length;
+		const isCategorySelected = !checkTitle || (checkTitle && postData.cid);
 
 		// Specifically for checking title/body length via plugins
-		var payload = {
+		const payload = {
 			post_uuid: post_uuid,
 			postData: postData,
 			postContainer: postContainer,
@@ -751,7 +748,7 @@ define('composer', [
 				timestamp: scheduler.getTimestamp(),
 			};
 		}
-		var submitHookData = {
+		const submitHookData = {
 			composerEl: postContainer,
 			action: action,
 			composerData: composerData,
@@ -763,8 +760,8 @@ define('composer', [
 		hooks.fire('action:composer.submit', Object.freeze(submitHookData));
 
 		// Minimize composer (and set textarea as readonly) while submitting
-		var taskbarIconEl = $('#taskbar .composer[data-uuid="' + post_uuid + '"] i');
-		var textareaEl = postContainer.find('.write');
+		const taskbarIconEl = $('#taskbar .composer[data-uuid="' + post_uuid + '"] i');
+		const textareaEl = postContainer.find('.write');
 		taskbarIconEl.removeClass('fa-plus').addClass('fa-circle-o-notch fa-spin');
 		composer.minimize(post_uuid);
 		textareaEl.prop('readonly', true);
@@ -830,8 +827,8 @@ define('composer', [
 
 	composer.discard = function (post_uuid) {
 		if (composer.posts[post_uuid]) {
-			var postData = composer.posts[post_uuid];
-			var postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
+			const postData = composer.posts[post_uuid];
+			const postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
 			postContainer.remove();
 			drafts.removeDraft(postData.save_id);
 			topicThumbs.deleteAll(post_uuid);
@@ -854,7 +851,7 @@ define('composer', [
 	composer.close = composer.discard;
 
 	composer.minimize = function (post_uuid) {
-		var postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
+		const postContainer = $('.composer[data-uuid="' + post_uuid + '"]');
 		postContainer.css('visibility', 'hidden');
 		composer.active = undefined;
 		taskbar.minimize('composer', post_uuid);

package/static/templates/composer.tpl

@@ -17,7 +17,7 @@
 
 			<div class="d-flex gap-1 flex-nowrap">
 				<button class="btn btn-sm btn-primary display-scheduler fs-5 {{{ if !canSchedule }}} hidden{{{ end }}}">
-					<i class="fa fa-clock-o"></i>
+					<i class="fa fa-fw fa-clock-o"></i>
 				</button>
 				<button class="btn btn-sm btn-primary composer-submit fs-5" data-action="post" tabindex="-1"><i class="fa fa-fw fa-chevron-right"></i></button>
 			</div>