1. 유저 정보에 따른 다른 뷰 보여주기

• 위 페이지에서 가져온 currentUser로 다른 메뉴 보여주기 (조건부 렌더링)
• NavBar ⇒ UserMenu로 currentUser Props로 넘기기

// UserMenu.tsx

<div className='flex flex-col cursor-pointer'>
            {currentUser ? (
              <>
                <MenuItem onClick={() => {}} label='My trips' />
                <MenuItem onClick={() => {}} label='My Favorites' />
                <MenuItem onClick={() => {}} label='My Reservations' />
                <MenuItem onClick={() => {}} label='My Properties' />
                <MenuItem onClick={() => {}} label='Airbnb my home' />
                <hr />
                <MenuItem onClick={() => signOut()} label='Logout' />
              </>
            ) : (
              <>
                <MenuItem onClick={loginModal.onOpen} label='login' />
                <MenuItem onClick={registerModal.onOpen} label='Sign up' />
              </>
            )}

증거 사진

로그아웃 구현하기

• 개쉬움.
• next-auth/react에서 signOut 함수를 import 해와서 호출하기만 하면됨 모든건 다 […nextauth]tsx에 구현되있음.

// UserMenu
<MenuItem onClick={() => signOut()} label='Logout' />

증거 사진