로그인 에러 질문입니다.

안녕하세요 제로초님 강의 듣던 중 동작이 원하는대로 안되어서 질문 드립니다.

1. 로그인 후 로그아웃 후 다른 아이디로 로그인 해도 로그아웃 버튼에는 전 계정의 정보가 뜹니다.

   
   아래는 로그인 모달의 코드입니다.
   

   "use client";
   
   import style from "@/app/(beforelogin)/_component/login.module.css";
   import { ChangeEventHandler, FormEventHandler, useState } from "react";
   import { redirect, useRouter } from "next/navigation";
   import { signIn } from "next-auth/react";
   
   export default function LoginModal() {
     const [id, setId] = useState("");
     const [password, setPassword] = useState("");
     const [message, setMessage] = useState("");
     const router = useRouter();
   
     const onSubmit: FormEventHandler<HTMLFormElement> = async (e) => {
       e.preventDefault();
       setMessage("");
       try {
         const response = await signIn("credentials", {
           username: id,
           password,
           redirect: false,
         });
         console.log(response, "1");
         router.replace("/home");
         console.log("2");
       } catch (err) {
         console.error(err);
         setMessage("아이디와 비밀번호가 일치하지 않습니다.");
       }
     };
     const onClickClose = () => {
       router.back();
     };
   
     const onChangeId: ChangeEventHandler<HTMLInputElement> = (e) => {
       setId(e.target.value);
     };
   
     const onChangePassword: ChangeEventHandler<HTMLInputElement> = (e) => {
       setPassword(e.target.value);
     };
   
     return (
       <div className={style.modalBackground}>
         <div className={style.modal}>
           <div className={style.modalHeader}>
             <button className={style.closeButton} onClick={onClickClose}>
               <svg
                 width={24}
                 viewBox="0 0 24 24"
                 aria-hidden="true"
                 className="r-18jsvk2 r-4qtqp9 r-yyyyoo r-z80fyv r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-19wmn03"
               >
                 <g>
                   <path d="M10.59 12L4.54 5.96l1.42-1.42L12 10.59l6.04-6.05 1.42 1.42L13.41 12l6.05 6.04-1.42 1.42L12 13.41l-6.04 6.05-1.42-1.42L10.59 12z"></path>
                 </g>
               </svg>
             </button>
             <div>로그인하세요.</div>
           </div>
           <form onSubmit={onSubmit}>
             <div className={style.modalBody}>
               <div className={style.inputDiv}>
                 <label className={style.inputLabel} htmlFor="id">
                   아이디
                 </label>
                 <input
                   id="id"
                   className={style.input}
                   value={id}
                   onChange={onChangeId}
                   type="text"
                   placeholder=""
                 />
               </div>
               <div className={style.inputDiv}>
                 <label className={style.inputLabel} htmlFor="password">
                   비밀번호
                 </label>
                 <input
                   id="password"
                   className={style.input}
                   value={password}
                   onChange={onChangePassword}
                   type="password"
                   placeholder=""
                 />
               </div>
             </div>
             <div className={style.message}>{message}</div>
             <div className={style.modalFooter}>
               <button className={style.actionButton} disabled={!id && !password}>
                 로그인하기
               </button>
             </div>
           </form>
         </div>
       </div>
     );
   }
   

아래는 로그아웃 버튼의 코드입니다.

"use client";

import { useRouter } from "next/navigation";
import style from "./logoutButton.module.css";
import { signOut } from "next-auth/react";
import { Session } from "@auth/core/types";

type Props = {
  me: Session | null;
};

export default function LogoutButton({ me }: Props) {
  const router = useRouter();

  const onLogout = async () => {
    try {
      const response = await signOut({
        redirect: false,
      });
      console.log("signout", response);
      router.replace("/");
    } catch (err) {
      console.log(err);
    }
  };
  console.log("me", me);
  if (!me?.user) {
    return null;
  }

  return (
    <button className={style.logOutButton} onClick={onLogout}>
      <div className={style.logOutUserImage}>
        <img src={me.user?.image as string} alt={me.user?.email as string} />
      </div>
      <div className={style.logOutUserName}>
        <div>{me.user?.name}</div>
        <div>@{me.user?.email}</div>
      </div>
    </button>
  );
}

로그아웃 버튼에는 알려주신대로 레이아웃의

const session = await auth();

session을 prop으로 내려주어서 사용하였습니다.

처음 test 계정으로 로그인 했을 때의 콘솔을 찍어보면
이렇게 test 계정이 정상적으로 나옵니다.
이후 로그아웃 후에(session token 쿠키는 정상적으로 지워진 상태입니다) test4 계정으로 다시 로그인 하면
이렇게 콘솔에 me 데이터가 test로 찍혀있고 test4의 정보가 로그아웃 버튼에 있습니다.

하지만 서버쪽 콘솔은 이렇게 test4로 나옵니다.

이 상태에서 페이지 새로고침을 하면 정상적으로 로그아웃 버튼에는 test4의 데이터가 다시 들어가게 됩니다.
로그아웃을 누를 때 세션 토큰이 정상적으로 지워지는 것을 확인했고, 재 로그인을 했는데 서버쪽에는 test4데이터가 찍히고 클라이언트 콘솔에는 test데이터가 찍히는 이유가 궁금합니다..

2. 틀린 아이디 비밀번호를 입력했을 때에 제로초님과 응답이 다르게 날라옵니다.

로그인 시에 틀린 아이디 비밀번호를 입력시에 저는 401에러가 아닌
이런 응답이 날라옵니다.
이 부분은 에러인지 아니면 버전이 달라서 응답이 다른 것 인지는 잘 모르겠습니다.
error는 credentialSignIn으로 날라오지만 ok와 status는 true에 200으로 날라오는데, 버전차이인가요 ..?
next-auth 버전은 5.0.0-beta.17 입니다.