From 2bcbb7ccf461d093ad72d77de31f62facf8085b2 Mon Sep 17 00:00:00 2001
From: Andrew Simachev <andrew.simachev@gmail.com>
Date: Wed, 26 Feb 2025 13:51:02 +0100
Subject: [PATCH] iconCache refactoring

---
 src/ts/component/util/iconObject.tsx | 21 ++---------
 src/ts/lib/util/common.ts            | 54 ++++++++++++++++++----------
 2 files changed, 38 insertions(+), 37 deletions(-)

diff --git a/src/ts/component/util/iconObject.tsx b/src/ts/component/util/iconObject.tsx
index 1df62a137c..56e71354a3 100644
--- a/src/ts/component/util/iconObject.tsx
+++ b/src/ts/component/util/iconObject.tsx
@@ -99,8 +99,6 @@ const FontSize = {
 
 const Ghost = require('img/icon/ghost.svg');
 
-const iconCache: Map<string, string> = new Map();
-
 const CheckboxTask = {
 	'': {
 		0: require('img/icon/object/checkbox0.svg'),
@@ -332,21 +330,8 @@ const IconObject = observer(forwardRef<IconObjectRefProps, Props>((props, ref) =
 	};
 
 	const typeIcon = (id: string, option: number, color?: string) => {
-		const key = [ id, iconSize, option ].join('-');
-
-		let ret = '';
-		if (iconCache.has(key)) {
-			ret = iconCache.get(key);
-		} else {
-			try {
-				const newColor = color || bgByOption(option);
-
-				ret = U.Common.updateSvg(require(`img/icon/type/default/${id}.svg`), { size, fill: newColor, stroke: newColor });
-				iconCache.set(key, ret);
-			} catch (e) { /**/ };
-		};
-
-		return ret;
+		const newColor = color || bgByOption(option);
+		return U.Common.updateSvg(require(`img/icon/type/default/${id}.svg`), { id, size, fill: newColor, stroke: newColor });
 	};
 
 	switch (layout) {
@@ -484,7 +469,7 @@ const IconObject = observer(forwardRef<IconObjectRefProps, Props>((props, ref) =
 		const img = node.find('img');
 
 		img.attr({ 
-			src: U.Common.updateSvg(require('img/icon/error.svg'), { size, fill: J.Theme[theme]?.error }), 
+			src: U.Common.updateSvg(require('img/icon/error.svg'), { id: 'error', size, fill: J.Theme[theme]?.error }), 
 			class: `iconCommon c${IconSize[size]}`
 		});
 	};
diff --git a/src/ts/lib/util/common.ts b/src/ts/lib/util/common.ts
index fa7db08d92..c343cde597 100644
--- a/src/ts/lib/util/common.ts
+++ b/src/ts/lib/util/common.ts
@@ -8,6 +8,7 @@ const katex = require('katex');
 require('katex/dist/contrib/mhchem');
 
 const TEST_HTML = /<[^>]*>/;
+const iconCache: Map<string, string> = new Map();
 
 class UtilCommon {
 
@@ -1129,30 +1130,45 @@ class UtilCommon {
 	};
 
 	updateSvg (src: string, param: any) {
-		const { size, fill, stroke } = param;
-		const chunk = src.split('base64,')[1];
-		const decoded = atob(chunk).replace(/_COLOR_VAR_/g, fill);
-		const obj = $(decoded);
-		const attr: any = {};
+		const id = String(param.id || '');
+		const size = Number(param.size) || 0;
+		const fill = String(param.fill || '');
+		const stroke = String(param.stroke || '');
+		const key = [ id, size, fill, stroke ].join('-');
 
-		if (size) {
-			attr.width = size;
-			attr.height = size;
+		if (iconCache[key]) {
+			return iconCache[key];
 		};
 
-		if (fill) {
-			attr.fill = fill;
-		};
+		let ret = '';
+		try {
+			const chunk = src.split('base64,')[1];
+			const decoded = atob(chunk).replace(/_COLOR_VAR_/g, fill);
+			const obj = $(decoded);
+			const attr: any = {};
 
-		if (stroke) {
-			attr.stroke = stroke;
-		};
+			if (size) {
+				attr.width = size;
+				attr.height = size;
+			};
 
-		if (this.objectLength(attr)) {
-			obj.attr(attr);
-		};
-		
-		return 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(obj[0].outerHTML)));
+			if (fill) {
+				attr.fill = fill;
+			};
+
+			if (stroke) {
+				attr.stroke = stroke;
+			};
+
+			if (this.objectLength(attr)) {
+				obj.attr(attr);
+			};
+			
+			ret = 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(obj[0].outerHTML)));
+		} catch (e) { /**/ };
+
+		iconCache[key] = ret;
+		return ret;
 	};
 
 };