diff --git a/src/widgets/space-focus-hud/ui/GoalCompleteSheet.tsx b/src/widgets/space-focus-hud/ui/GoalCompleteSheet.tsx index 3b1edfc..c7de573 100644 --- a/src/widgets/space-focus-hud/ui/GoalCompleteSheet.tsx +++ b/src/widgets/space-focus-hud/ui/GoalCompleteSheet.tsx @@ -1,5 +1,6 @@ 'use client'; +import type { FormEvent } from 'react'; import { useEffect, useMemo, useRef, useState } from 'react'; import { cn } from '@/shared/lib/cn'; @@ -54,6 +55,15 @@ export const GoalCompleteSheet = ({ }, [currentGoal]); const canConfirm = draft.trim().length > 0; + const handleSubmit = (event: FormEvent) => { + event.preventDefault(); + + if (!canConfirm) { + return; + } + + onConfirm(draft.trim()); + }; return (
-
+
))}
-
- + + ); diff --git a/src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx b/src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx index 9626c71..1cf7c27 100644 --- a/src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx +++ b/src/widgets/space-focus-hud/ui/SpaceFocusHudWidget.tsx @@ -1,6 +1,5 @@ import { useCallback, useEffect, useRef, useState } from 'react'; import { useReducedMotion } from '@/shared/lib/useReducedMotion'; -import { cn } from '@/shared/lib/cn'; import { useToast } from '@/shared/ui'; import { SpaceTimerHudWidget } from '@/widgets/space-timer-hud'; import { GoalCompleteSheet } from './GoalCompleteSheet'; @@ -23,10 +22,9 @@ export const SpaceFocusHudWidget = ({ const reducedMotion = useReducedMotion(); const [flashVisible, setFlashVisible] = useState(false); const [sheetOpen, setSheetOpen] = useState(false); - const [completePulseVisible, setCompletePulseVisible] = useState(false); const playbackStateRef = useRef<'running' | 'paused'>('running'); const flashTimerRef = useRef(null); - const completePulseTimerRef = useRef(null); + const restReminderTimerRef = useRef(null); const triggerFlash = useCallback((durationMs: number) => { if (reducedMotion || !visible) { @@ -51,9 +49,9 @@ export const SpaceFocusHudWidget = ({ window.clearTimeout(flashTimerRef.current); flashTimerRef.current = null; } - if (completePulseTimerRef.current) { - window.clearTimeout(completePulseTimerRef.current); - completePulseTimerRef.current = null; + if (restReminderTimerRef.current) { + window.clearTimeout(restReminderTimerRef.current); + restReminderTimerRef.current = null; } }; }, []); @@ -88,34 +86,12 @@ export const SpaceFocusHudWidget = ({ } const handleOpenCompleteSheet = () => { - setCompletePulseVisible(true); - - if (completePulseTimerRef.current) { - window.clearTimeout(completePulseTimerRef.current); - } - - completePulseTimerRef.current = window.setTimeout(() => { - setCompletePulseVisible(false); - setSheetOpen(true); - completePulseTimerRef.current = null; - }, 700); + setSheetOpen(true); }; return ( <> -
-
- 완료! -
-
setSheetOpen(false)} onRest={() => { setSheetOpen(false); - pushToast({ title: '좋아요, 잠깐 쉬고 다시 이어가요.' }); + pushToast({ title: '좋아요. 5분 뒤에 다시 알려드릴게요.' }); + + if (restReminderTimerRef.current) { + window.clearTimeout(restReminderTimerRef.current); + } + + restReminderTimerRef.current = window.setTimeout(() => { + pushToast({ title: '5분이 지났어요. 다음 한 조각으로 돌아와요.' }); + restReminderTimerRef.current = null; + }, 5 * 60 * 1000); }} onConfirm={(nextGoal) => { onGoalUpdate(nextGoal);