diff --git a/src/widgets/space-focus-hud/ui/GoalFlashOverlay.tsx b/src/widgets/space-focus-hud/ui/GoalFlashOverlay.tsx deleted file mode 100644 index 02e008f..0000000 --- a/src/widgets/space-focus-hud/ui/GoalFlashOverlay.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import { cn } from '@/shared/lib/cn'; - -interface GoalFlashOverlayProps { - goal: string; - visible: boolean; -} - -export const GoalFlashOverlay = ({ goal, visible }: GoalFlashOverlayProps) => { - const normalizedGoal = goal.trim().length > 0 ? goal.trim() : '이번 한 조각을 잊지 마세요.'; - - return ( -
-
- 이번 한 조각: {normalizedGoal} -
-
- ); -}; diff --git a/src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx b/src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx index acac19e..3b66a77 100644 --- a/src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx +++ b/src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx @@ -1,9 +1,7 @@ -import { useCallback, useEffect, useRef, useState } from 'react'; +import { useEffect, useRef, useState } from 'react'; import type { HudStatusLinePayload } from '@/shared/lib/useHudStatusLine'; -import { useReducedMotion } from '@/shared/lib/useReducedMotion'; import { SpaceTimerHudWidget } from '@/widgets/space-timer-hud'; import { GoalCompleteSheet } from './GoalCompleteSheet'; -import { GoalFlashOverlay } from './GoalFlashOverlay'; interface SpaceFocusHudWidgetProps { goal: string; @@ -34,36 +32,14 @@ export const SpaceFocusHudWidget = ({ onGoalUpdate, onStatusMessage, }: SpaceFocusHudWidgetProps) => { - const reducedMotion = useReducedMotion(); - const [flashVisible, setFlashVisible] = useState(false); const [sheetOpen, setSheetOpen] = useState(false); + const visibleRef = useRef(false); const playbackStateRef = useRef<'running' | 'paused'>(playbackState); - const flashTimerRef = useRef(null); const restReminderTimerRef = useRef(null); - - const triggerFlash = useCallback((durationMs: number) => { - if (reducedMotion || !visible) { - return; - } - - setFlashVisible(true); - - if (flashTimerRef.current) { - window.clearTimeout(flashTimerRef.current); - } - - flashTimerRef.current = window.setTimeout(() => { - setFlashVisible(false); - flashTimerRef.current = null; - }, durationMs); - }, [reducedMotion, visible]); + const normalizedGoal = goal.trim().length > 0 ? goal.trim() : '집중을 시작해요.'; useEffect(() => { return () => { - if (flashTimerRef.current) { - window.clearTimeout(flashTimerRef.current); - flashTimerRef.current = null; - } if (restReminderTimerRef.current) { window.clearTimeout(restReminderTimerRef.current); restReminderTimerRef.current = null; @@ -72,56 +48,24 @@ export const SpaceFocusHudWidget = ({ }, []); useEffect(() => { - if (!visible || reducedMotion) { - const rafId = window.requestAnimationFrame(() => { - setFlashVisible(false); + if (visible && !visibleRef.current) { + onStatusMessage({ + message: `이번 한 조각 · ${normalizedGoal}`, }); - - return () => { - window.cancelAnimationFrame(rafId); - }; } - const timeoutId = window.setTimeout(() => { - triggerFlash(2000); - }, 0); - - return () => { - window.clearTimeout(timeoutId); - }; - }, [visible, reducedMotion, triggerFlash]); + visibleRef.current = visible; + }, [normalizedGoal, onStatusMessage, visible]); useEffect(() => { - if (playbackStateRef.current === 'paused' && playbackState === 'running' && visible && !reducedMotion) { - const timeoutId = window.setTimeout(() => { - triggerFlash(1000); - }, 0); - - playbackStateRef.current = playbackState; - - return () => { - window.clearTimeout(timeoutId); - }; + if (playbackStateRef.current === 'paused' && playbackState === 'running' && visible) { + onStatusMessage({ + message: `이번 한 조각 · ${normalizedGoal}`, + }); } playbackStateRef.current = playbackState; - }, [playbackState, reducedMotion, triggerFlash, visible]); - - useEffect(() => { - const ENABLE_PERIODIC_FLASH = false; - - if (!visible || reducedMotion || !ENABLE_PERIODIC_FLASH) { - return; - } - - const intervalId = window.setInterval(() => { - triggerFlash(800); - }, 10 * 60 * 1000); - - return () => { - window.clearInterval(intervalId); - }; - }, [visible, reducedMotion, triggerFlash]); + }, [normalizedGoal, onStatusMessage, playbackState, visible]); if (!visible) { return null; @@ -133,7 +77,6 @@ export const SpaceFocusHudWidget = ({ return ( <> -