import { useGetMeQuery } from "@/models/authAPI";

const UserAccount = () => {
  const { data: user } = useGetMeQuery();

  if (!user?.product_user_id) return null;

  return (
    <div
      className="fixed bottom-21 right-0 p-2
            bg-slate-700 text-zinc-200 z-50
            font-mono
            "
    >
      <div className="grid grid-cols-[auto_1fr] text-xs">
        <div className="label text-left pr-2">Email:</div>
        <div className="value text-left">{user.email} </div>
        <div className="label text-left pr-2">Name:</div>
        <div className="value text-left">{user.display_name ?? "___"}</div>{" "}
      </div>
    </div>
  );
};

export default UserAccount;