의류 쇼핑몰 28 | Auth Listener

하나의 listener 안에 authentication 관련 코드를 모아보자. 

 

일단 이 전에 한 코드를 지워준다. 

sign-in-form에 있는 setCurrentUser를 지워준다. 

 

 

 

sign-up-form에서도 useContext 관련을 지운다.

 

 

 

이제 context value가 업데이트 될 때마다 계속 re-run 할 필요가 없어졌다. 

자동으로 performance가 좋아졌다. 

 

 

 

navigation에서도 매뉴얼로 설정해 놓은 

이제 sign out을 하면 onAuthStateChangeListener가 catch하기 때문에 

signOutHandler 버튼이 필요가 없다. 

 

onClick 했을 때 signOutUser만 호출해주면 된다. 

 

 

이제 context로 돌아와서 

listner에서 sign-in 되면 setCurrentUser에 user instance가 들어가고 sign out 되면 null이 들어간다. 

 

 

로그인을 하면 

 

 

콘솔에 정보가 나오고

 

 

화면의 SIGN OUT을 누르면

 

 

 

null이 나오는 것을 볼 수 있다. 

 

 

 

 sign in form 작업 

sign-in-form 에서 

signInWithGoogle 메소드에서 createUserDocumentFromAuth(user)를 떼서 

user.context에 있는 listener 안으로 옮긴다. 

그럼 user를 destructrue 할 필요는 없어진다. 

sign-in-form

 

 

 리스너 안에서 user가 들어올 때만 이 user document를 만든다.

user가 들어오면 createUserDocumentFromAuth(user)를 리턴하고 

아니면 setCurrentUser(user)를 리턴한다.

 

 

 

firebase에서 gmail user 정보를 authentication과 firestore에서 모두 지우고 

이제 Gmail sign-in이 되는지 확인해보자.

 

 

 

둘 다 로그인이 잘 되는 것을 볼 수 있다. 

 

 

 

 

 

 

sign up은 displayName을 받아야 해서 listener 안으로 넣지 않는다.