From dc0b3753d8894478ee8f023218e44f16949b8ce7 Mon Sep 17 00:00:00 2001
From: Julian Lam <julian@nodebb.org>
Date: Thu, 29 Sep 2022 16:24:20 -0400
Subject: [PATCH] refactor: buildAvatar attributes to be Map instead of array
 of strings, to allow for easier overwriting

---
 public/src/modules/helpers.common.js | 31 ++++++++++++++--------------
 1 file changed, 15 insertions(+), 16 deletions(-)

diff --git a/public/src/modules/helpers.common.js b/public/src/modules/helpers.common.js
index d1ff893659..00c0e29184 100644
--- a/public/src/modules/helpers.common.js
+++ b/public/src/modules/helpers.common.js
@@ -267,32 +267,31 @@ module.exports = function (utils, Benchpress, relative_path) {
 			userObj = this;
 		}
 
-		const attributes = [
-			'alt="' + userObj.username + '"',
-			'title="' + userObj.username + '"',
-			'data-uid="' + userObj.uid + '"',
-			'loading="lazy"',
-		];
+		const attributes = new Map([
+			['alt', userObj.username],
+			['title', userObj.username],
+			['data-uid', userObj.uid],
+			['loading', 'lazy'],
+		]);
 		const styles = [`--avatar-size: ${size};`];
+		const attr2String = attributes => Array.from(attributes).reduce((output, [prop, value]) => {
+			output += ` ${prop}="${value}"`;
+			return output;
+		}, '');
 		classNames = classNames || '';
 
-		attributes.unshift(`class="avatar ${classNames}${rounded ? ' avatar-rounded' : ''}"`);
-
-		// Component override -- FIXME
-		if (component) {
-			attributes.push('component="' + component + '"');
-		} else {
-			attributes.push('component="avatar/' + (userObj.picture ? 'picture' : 'icon') + '"');
-		}
+		attributes.set('class', `avatar ${classNames}${rounded ? ' avatar-rounded' : ''}`);
 
 		let output = '';
 
 		if (userObj.picture) {
-			output += '<img ' + attributes.join(' ') + ' src="' + userObj.picture + '" style="' + styles.join(' ') + '" onError="this.remove();" />';
+			attributes.set('component', component || 'avatar/picture');
+			output += '<img ' + attr2String(attributes) + ' src="' + userObj.picture + '" style="' + styles.join(' ') + '" onError="this.remove();" />';
 		}
 
+		attributes.set('component', component || 'avatar/icon');
 		styles.push('background-color: ' + userObj['icon:bgColor'] + ';');
-		output += '<span ' + attributes.join(' ') + ' style="' + styles.join(' ') + '">' + userObj['icon:text'] + '</span>';
+		output += '<span ' + attr2String(attributes) + ' style="' + styles.join(' ') + '">' + userObj['icon:text'] + '</span>';
 
 		return output;
 	}