userObj를 props로 받아와서 displayName을 이용해주면 된다.
<Link to="/profile">{userObj.displayName ?? "profile"}</Link>
프로필 이름이나 사진 등을 바꿀 수 있게 하기 위해 updateProfile
을 이용한다.
현재 사용자 정보를 바로바로 업데이트 할 수 있게 해줌.
App.js
import { updateCurrentUser } from "firebase/auth";
const refreshUser = async () => {
await updateCurrentUser(authService, authService.currentUser);
setUserObj(authService.currentUser);
};
Profile.js
const onSubmit = async (event) => {
event.preventDefault();
if (newDisplayName !== userObj.displayName) {
await updateProfile(userObj, { displayName: newDisplayName });
refreshUser();
}
};