Skip to content

Commit 6b01b0b

Browse files
ARRY7686crazywoola
andauthored
feat: implement TooltipManager for managing tooltip lifecycle (langgenius#24236)
Co-authored-by: crazywoola <427733928@qq.com>
1 parent c5614d0 commit 6b01b0b

File tree

2 files changed

+25
-2
lines changed

2 files changed

+25
-2
lines changed
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
class TooltipManager {
2+
private activeCloser: (() => void) | null = null
3+
4+
register(closeFn: () => void) {
5+
if (this.activeCloser)
6+
this.activeCloser()
7+
this.activeCloser = closeFn
8+
}
9+
10+
clear(closeFn: () => void) {
11+
if (this.activeCloser === closeFn)
12+
this.activeCloser = null
13+
}
14+
}
15+
16+
export const tooltipManager = new TooltipManager()

web/app/components/base/tooltip/index.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ import type { OffsetOptions, Placement } from '@floating-ui/react'
66
import { RiQuestionLine } from '@remixicon/react'
77
import cn from '@/utils/classnames'
88
import { PortalToFollowElem, PortalToFollowElemContent, PortalToFollowElemTrigger } from '@/app/components/base/portal-to-follow-elem'
9+
import { tooltipManager } from './TooltipManager'
10+
911
export type TooltipProps = {
1012
position?: Placement
1113
triggerMethod?: 'hover' | 'click'
@@ -56,22 +58,26 @@ const Tooltip: FC<TooltipProps> = ({
5658
isHoverTriggerRef.current = isHoverTrigger
5759
}, [isHoverTrigger])
5860

61+
const close = () => setOpen(false)
62+
5963
const handleLeave = (isTrigger: boolean) => {
6064
if (isTrigger)
6165
setNotHoverTrigger()
62-
6366
else
6467
setNotHoverPopup()
6568

6669
// give time to move to the popup
6770
if (needsDelay) {
6871
setTimeout(() => {
69-
if (!isHoverPopupRef.current && !isHoverTriggerRef.current)
72+
if (!isHoverPopupRef.current && !isHoverTriggerRef.current) {
7073
setOpen(false)
74+
tooltipManager.clear(close)
75+
}
7176
}, 300)
7277
}
7378
else {
7479
setOpen(false)
80+
tooltipManager.clear(close)
7581
}
7682
}
7783

@@ -87,6 +93,7 @@ const Tooltip: FC<TooltipProps> = ({
8793
onMouseEnter={() => {
8894
if (triggerMethod === 'hover') {
8995
setHoverTrigger()
96+
tooltipManager.register(close)
9097
setOpen(true)
9198
}
9299
}}

0 commit comments

Comments
 (0)