From 65886c580f7ef2a13bd4dd52d544d97bd6bb352d Mon Sep 17 00:00:00 2001
From: Julian Lam <julian@nodebb.org>
Date: Fri, 10 Feb 2023 16:44:22 -0500
Subject: [PATCH] fix: placeholders for userFilter module

---
 public/src/modules/userFilter.js | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/public/src/modules/userFilter.js b/public/src/modules/userFilter.js
index 7c218d9ddb..20b1483ed3 100644
--- a/public/src/modules/userFilter.js
+++ b/public/src/modules/userFilter.js
@@ -1,6 +1,6 @@
 'use strict';
 
-define('userFilter', ['api', 'hooks', 'slugify'], function (api, hooks, slugify) {
+define('userFilter', ['api', 'hooks', 'slugify', 'benchpress'], function (api, hooks, slugify, benchpress) {
 	const userFilter = {};
 
 	userFilter.init = function (el, options) {
@@ -9,6 +9,7 @@ define('userFilter', ['api', 'hooks', 'slugify'], function (api, hooks, slugify)
 		}
 		options = options || {};
 
+		let placeholderHtml;
 		let selectedUsers = [];
 		if (options.selectedUsers) {
 			selectedUsers = options.selectedUsers.map(u => ({ ...u }));
@@ -79,6 +80,10 @@ define('userFilter', ['api', 'hooks', 'slugify'], function (api, hooks, slugify)
 			});
 		}
 
+		el.find('[component="user/filter/search"]').on('keyup', () => {
+			el.find('[component="user/filter/results"]').html(placeholderHtml);
+		});
+
 		el.find('[component="user/filter/search"]').on('keyup', utils.debounce(function () {
 			if (app.user.privileges['search:users']) {
 				doSearch();
@@ -106,6 +111,11 @@ define('userFilter', ['api', 'hooks', 'slugify'], function (api, hooks, slugify)
 				options.onHidden(selectedUsers);
 			}
 		});
+
+		// Pre-render placeholders for search
+		benchpress.render(options.placeholderTemplate || 'partials/userFilter-placeholders').then((html) => {
+			placeholderHtml = html;
+		});
 	};
 
 	return userFilter;