From aa4a9326278d66d6dbe94f2730f285d19f0b40ab Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Sat, 3 Feb 2024 00:09:51 -0800
Subject: fix(tooltip): clean up

---
 src/lib/Tooltip/tooltip.ts | 39 ++++++++++++++++++++++++---------------
 1 file changed, 24 insertions(+), 15 deletions(-)

(limited to 'src')

diff --git a/src/lib/Tooltip/tooltip.ts b/src/lib/Tooltip/tooltip.ts
index cefaa29f..ca3c3570 100644
--- a/src/lib/Tooltip/tooltip.ts
+++ b/src/lib/Tooltip/tooltip.ts
@@ -4,8 +4,8 @@ const tooltip = (element: HTMLElement) => {
 	const tooltipTransitionTime = 200;
 	const tooltipHideDelay = 10;
 	const debounceDelay = 100;
-	let hideTimeout: number | undefined = undefined;
-	let debounceTimer: number;
+	let hideTimeout: number | null = null;
+	let debounceTimer: number | null = null;
 
 	const createTooltip = () => {
 		if (!tooltipDiv) {
@@ -41,7 +41,12 @@ const tooltip = (element: HTMLElement) => {
 	};
 
 	const showTooltip = (content: string, x: number, y: number) => {
-		clearTimeout(hideTimeout);
+		if (hideTimeout !== null) {
+			clearTimeout(hideTimeout);
+
+			hideTimeout = null;
+		}
+
 		createTooltip();
 
 		if (tooltipDiv) {
@@ -69,37 +74,41 @@ const tooltip = (element: HTMLElement) => {
 		}, tooltipHideDelay);
 	};
 
-	element.addEventListener('mouseenter', (event) => {
+	const handleMouseEnter = (event: MouseEvent) => {
 		const title = element.getAttribute('title');
 
 		if (title) {
 			element.removeAttribute('title');
 			showTooltip(title, event.pageX, event.pageY);
 		}
-	});
+	};
 
-	element.addEventListener('mousemove', (event) => {
-		if (debounceTimer) clearTimeout(debounceTimer);
+	const handleMouseMove = (event: MouseEvent) => {
+		if (debounceTimer !== null) clearTimeout(debounceTimer);
 
 		debounceTimer = window.setTimeout(() => {
 			if (tooltipDiv && tooltipDiv.style.opacity === '1')
 				updateTooltipPosition(event.pageX, event.pageY);
 		}, debounceDelay);
-	});
+	};
 
-	element.addEventListener('mouseleave', () => {
+	const handleMouseLeave = () => {
 		element.setAttribute('title', tooltipDiv ? tooltipDiv.textContent || '' : '');
 		hideTooltip();
-	});
+	};
+
+	element.addEventListener('mouseenter', handleMouseEnter);
+	element.addEventListener('mousemove', handleMouseMove);
+	element.addEventListener('mouseleave', handleMouseLeave);
 
 	return {
 		destroy() {
-			element.removeEventListener('mouseenter', showTooltip as unknown as EventListener);
-			element.removeEventListener('mousemove', updateTooltipPosition as unknown as EventListener);
-			element.removeEventListener('mouseleave', hideTooltip as EventListener);
+			element.removeEventListener('mouseenter', handleMouseEnter);
+			element.removeEventListener('mousemove', handleMouseMove);
+			element.removeEventListener('mouseleave', handleMouseLeave);
 
-			if (hideTimeout) clearTimeout(hideTimeout);
-			if (debounceTimer) clearTimeout(debounceTimer);
+			if (hideTimeout !== null) clearTimeout(hideTimeout);
+			if (debounceTimer !== null) clearTimeout(debounceTimer);
 
 			if (tooltipDiv && document.body.contains(tooltipDiv)) {
 				document.body.removeChild(tooltipDiv);
-- 
cgit v1.2.3