"use client"

import { UserCircle } from "lucide-react"
import { logout } from "@/lib/features/login/session"

interface LogoutButtonProps {
  userName?: string
}

export function LogoutButton({ userName }: LogoutButtonProps) {
  const handleLogout = async () => {
    await logout()
  }

  return (
    <button onClick={handleLogout} className="flex items-center space-x-2 text-gray-700 hover:text-green-600">
      <UserCircle className="h-5 w-5" />
      <span>{userName}</span>
    </button>
  )
}