diff --git a/src/renderer/components/team/TaskTooltip.tsx b/src/renderer/components/team/TaskTooltip.tsx index 5b287d88..ba887fc5 100644 --- a/src/renderer/components/team/TaskTooltip.tsx +++ b/src/renderer/components/team/TaskTooltip.tsx @@ -1,4 +1,4 @@ -import { memo, useMemo } from 'react'; +import { memo, useCallback, useMemo, useState } from 'react'; import { useAppTranslation } from '@features/localization/renderer'; import { MarkdownViewer } from '@renderer/components/chat/viewers/MarkdownViewer'; @@ -65,16 +65,36 @@ interface TaskTooltipProps { side?: 'top' | 'bottom' | 'left' | 'right'; } -/** - * Tooltip that shows task summary on hover over any #taskId link. - * Reads task data from the current team in the store. - */ export const TaskTooltip = memo(function TaskTooltip({ taskId, teamName, children, side = 'top', }: TaskTooltipProps): React.JSX.Element { + const [open, setOpen] = useState(false); + const handleOpenChange = useCallback((nextOpen: boolean) => { + setOpen(nextOpen); + }, []); + + return ( + + {children} + {open ? : null} + + ); +}); + +interface TaskTooltipContentProps { + taskId: string; + teamName?: string; + side: 'top' | 'bottom' | 'left' | 'right'; +} + +const TaskTooltipContent = memo(function TaskTooltipContent({ + taskId, + teamName, + side, +}: TaskTooltipContentProps): React.JSX.Element | null { const { t } = useAppTranslation('team'); const { selectedTeamName, selectedTeamData, selectedTeamMembers, globalTasks, teamByName } = useStore( @@ -127,7 +147,7 @@ export const TaskTooltip = memo(function TaskTooltip({ ); // If task not found, render children without tooltip - if (!task) return children; + if (!task) return null; const column = getEffectiveColumn(task); const statusColor = STATUS_COLORS[column] ?? STATUS_COLORS.pending; @@ -142,63 +162,60 @@ export const TaskTooltip = memo(function TaskTooltip({ : null; return ( - - {children} - - {resolvedTeamName ? ( -
- {resolvedTeamDisplayName || resolvedTeamName} -
- ) : null} - {/* Subject */} -
- {formatTaskDisplayLabel(task)}{' '} - {task.subject} + + {resolvedTeamName ? ( +
+ {resolvedTeamDisplayName || resolvedTeamName}
+ ) : null} + {/* Subject */} +
+ {formatTaskDisplayLabel(task)}{' '} + {task.subject} +
- {/* Status badge */} -
+ {/* Status badge */} +
+ + {label} + + {isTeamTaskNeedsFixActionable(task) ? ( - {label} + {REVIEW_STATE_DISPLAY.needsFix.label} - {isTeamTaskNeedsFixActionable(task) ? ( - - {REVIEW_STATE_DISPLAY.needsFix.label} - - ) : null} - - {/* Owner */} - {task.owner && members.length > 0 ? ( - - ) : task.owner ? ( - {task.owner} - ) : ( - - {t('tasks.unassigned')} - - )} -
- - {/* Description — full markdown with scroll */} - {task.description ? ( -
- -
) : null} - - + + {/* Owner */} + {task.owner && members.length > 0 ? ( + + ) : task.owner ? ( + {task.owner} + ) : ( + + {t('tasks.unassigned')} + + )} +
+ + {/* Description — full markdown with scroll */} + {task.description ? ( +
+ +
+ ) : null} +
); });