import { useState, useRef, useEffect } from 'react'

/**
 * AR-02: 从 Sidebar.tsx 提取的 resize 逻辑
 */
export function useSidebarResize() {
  const [isResizing, setIsResizing] = useState(false)
  const sidebarRef = useRef<HTMLDivElement>(null)

  useEffect(() => {
    if (!isResizing) return

    const handleMouseMove = (e: MouseEvent): void => {
      if (sidebarRef.current) {
        const newWidth = Math.max(180, Math.min(500, e.clientX))
        sidebarRef.current.style.width = newWidth + 'px'
      }
    }

    const handleMouseUp = (): void => setIsResizing(false)

    document.addEventListener('mousemove', handleMouseMove)
    document.addEventListener('mouseup', handleMouseUp)
    return () => {
      document.removeEventListener('mousemove', handleMouseMove)
      document.removeEventListener('mouseup', handleMouseUp)
    }
  }, [isResizing])

  const startResize = (): void => setIsResizing(true)

  return { sidebarRef, isResizing, startResize }
}
