import { useState, useCallback, useRef } from 'react' interface ConfirmOptions { title: string message: string confirmLabel?: string cancelLabel?: string variant?: 'danger' | 'warning' | 'info' } interface ConfirmState extends ConfirmOptions { open: boolean resolve: ((value: boolean) => void) | null } /** * UX-01: Promise-based 确认对话框 hook * 替代原生 confirm(),返回 Promise */ export function useConfirm() { const [state, setState] = useState({ open: false, title: '', message: '', resolve: null }) // 使用 ref 确保回调中能拿到最新的 resolve const resolveRef = useRef<((value: boolean) => void) | null>(null) const confirm = useCallback((options: ConfirmOptions): Promise => { return new Promise((resolve) => { resolveRef.current = resolve setState({ open: true, title: options.title, message: options.message, confirmLabel: options.confirmLabel, cancelLabel: options.cancelLabel, variant: options.variant, resolve }) }) }, []) const handleConfirm = useCallback(() => { resolveRef.current?.(true) setState(prev => ({ ...prev, open: false, resolve: null })) resolveRef.current = null }, []) const handleCancel = useCallback(() => { resolveRef.current?.(false) setState(prev => ({ ...prev, open: false, resolve: null })) resolveRef.current = null }, []) return { confirm, confirmDialogProps: { open: state.open, title: state.title, message: state.message, confirmLabel: state.confirmLabel, cancelLabel: state.cancelLabel, variant: state.variant, onConfirm: handleConfirm, onCancel: handleCancel } } }