// Signed-in email plus Admin / Settings / Log out buttons for page headers.
import { useApp } from '../context/AppContext.js';

export default function AuthStatus() {
  const { authUser, setCurrentPage, logout } = useApp();
  if (!authUser) return null;
  return (
    <div className="flex items-center gap-2 text-sm text-slate-300">
      <span className="hidden sm:inline">{authUser.email}</span>
      {authUser.isAdmin && (
        <button
          type="button"
          onClick={() => setCurrentPage('admin')}
          className="rounded-xl border border-white/15 bg-white/10 px-3 py-1.5 text-xs text-white transition hover:bg-white/15"
        >
          🛡 Admin
        </button>
      )}
      <button
        type="button"
        onClick={() => setCurrentPage('settings')}
        className="rounded-xl border border-white/15 bg-white/10 px-3 py-1.5 text-xs text-white transition hover:bg-white/15"
      >
        ⚙ Settings
      </button>
      <button
        type="button"
        onClick={logout}
        className="rounded-xl border border-white/15 bg-white/10 px-3 py-1.5 text-xs text-white transition hover:bg-white/15"
      >
        Log out
      </button>
    </div>
  );
}