type WindowControlKind = "minimize" | "maximize" | "close"

interface TopBarProps {
  onMinimize(): void
  onMaximize(): void
  onClose(): void
}

function WindowControlIcon({ kind }: { kind: WindowControlKind }) {
  if (kind === "minimize") {
    return (
      <svg viewBox="0 0 12 12" aria-hidden="true" focusable="false">
        <path d="M2 6.75h8" fill="none" stroke="currentColor" strokeLinecap="round" strokeWidth="1.6" />
      </svg>
    )
  }

  if (kind === "maximize") {
    return (
      <svg viewBox="0 0 12 12" aria-hidden="true" focusable="false">
        <rect x="2.5" y="2.5" width="7" height="7" rx="1.2" fill="none" stroke="currentColor" strokeWidth="1.4" />
      </svg>
    )
  }

  return (
    <svg viewBox="0 0 12 12" aria-hidden="true" focusable="false">
      <path d="M3 3l6 6M9 3 3 9" fill="none" stroke="currentColor" strokeLinecap="round" strokeWidth="1.6" />
    </svg>
  )
}

export function TopBar({ onMinimize, onMaximize, onClose }: TopBarProps) {
  return (
    <div className="window-controls" aria-label="窗口控制">
      <button type="button" className="window-control-button" aria-label="最小化窗口" onClick={onMinimize}>
        <WindowControlIcon kind="minimize" />
      </button>
      <button type="button" className="window-control-button" aria-label="最大化窗口" onClick={onMaximize}>
        <WindowControlIcon kind="maximize" />
      </button>
      <button type="button" className="window-control-button close" aria-label="关闭窗口" onClick={onClose}>
        <WindowControlIcon kind="close" />
      </button>
    </div>
  )
}
