refactor(toast): HUD 상태 라인 피드백 통합 및 우선순위 큐 적용

This commit is contained in:
2026-03-04 20:46:19 +09:00
parent c451175b9c
commit 06dbee8d63
6 changed files with 186 additions and 32 deletions

View File

@@ -1,6 +1,6 @@
import { useCallback, useEffect, useRef, useState } from 'react';
import type { HudStatusLineItem, HudStatusLinePayload } from '@/shared/lib/useHudStatusLine';
import { useReducedMotion } from '@/shared/lib/useReducedMotion';
import { useToast } from '@/shared/ui';
import { SpaceTimerHudWidget } from '@/widgets/space-timer-hud';
import { GoalCompleteSheet } from './GoalCompleteSheet';
import { GoalFlashOverlay } from './GoalFlashOverlay';
@@ -10,6 +10,9 @@ interface SpaceFocusHudWidgetProps {
timerLabel: string;
visible: boolean;
onGoalUpdate: (nextGoal: string) => void;
statusLine: HudStatusLineItem | null;
onStatusAction: () => void;
onStatusMessage: (payload: HudStatusLinePayload) => void;
}
export const SpaceFocusHudWidget = ({
@@ -17,8 +20,10 @@ export const SpaceFocusHudWidget = ({
timerLabel,
visible,
onGoalUpdate,
statusLine,
onStatusAction,
onStatusMessage,
}: SpaceFocusHudWidgetProps) => {
const { pushToast } = useToast();
const reducedMotion = useReducedMotion();
const [flashVisible, setFlashVisible] = useState(false);
const [sheetOpen, setSheetOpen] = useState(false);
@@ -95,9 +100,18 @@ export const SpaceFocusHudWidget = ({
<SpaceTimerHudWidget
timerLabel={timerLabel}
goal={goal}
statusLine={
statusLine
? {
message: statusLine.message,
actionLabel: statusLine.action?.label,
}
: null
}
isImmersionMode
className="pr-[4.2rem]"
onGoalCompleteRequest={handleOpenCompleteSheet}
onStatusAction={onStatusAction}
onPlaybackStateChange={(state) => {
if (reducedMotion) {
playbackStateRef.current = state;
@@ -117,21 +131,21 @@ export const SpaceFocusHudWidget = ({
onClose={() => setSheetOpen(false)}
onRest={() => {
setSheetOpen(false);
pushToast({ title: '좋아요. 5분 뒤에 다시 알려드릴게요.' });
onStatusMessage({ message: '좋아요. 5분 뒤에 다시 알려드릴게요.' });
if (restReminderTimerRef.current) {
window.clearTimeout(restReminderTimerRef.current);
}
restReminderTimerRef.current = window.setTimeout(() => {
pushToast({ title: '5분이 지났어요. 다음 한 조각으로 돌아와요.' });
onStatusMessage({ message: '5분이 지났어요. 다음 한 조각으로 돌아와요.' });
restReminderTimerRef.current = null;
}, 5 * 60 * 1000);
}}
onConfirm={(nextGoal) => {
onGoalUpdate(nextGoal);
setSheetOpen(false);
pushToast({ title: '다음 한 조각으로 이어갑니다.' });
onStatusMessage({ message: '다음 한 조각으로 이어갑니다.' });
triggerFlash(1200);
}}
/>