"use client";

/** 사이드바 로고 아래에 붙는 로그인 상태. 누구로 들어와 있는지와 나가는 길 */

import { useRouter } from "next/navigation";
import { signOut, useMe } from "@/lib/auth";

export default function AccountBadge() {
  const router = useRouter();
  const { me, setMe } = useMe();

  if (me === null) return null;

  if (me === false) {
    return (
      <button type="button" className="account-badge-link"
        onClick={() => router.push("/login")}>
        로그인
      </button>
    );
  }

  return (
    <div className="account-badge">
      <span className="account-badge-name" title={me.email}>{me.name || me.email}</span>
      <span className="account-badge-quota" title="남은 크레딧">
        {me.jobs_left}/{me.job_limit}
      </span>
      <button type="button" className="account-badge-link"
        onClick={() => { signOut().then(() => setMe(false)).then(() => router.push("/")); }}>
        로그아웃
      </button>
    </div>
  );
}