[비밀번호 재설정] api 연결 & 처리 #60
Conversation
1) 백엔드에서 넘겨준 url에 code로 페이지 유효한지 체크 2) 비밀번호 재설정 버튼 클릭 시, api호출 후 로그인 시킴
에러메시지로 알려줌
| @@ -90,6 +96,16 @@ const authSlice = createSlice({ | |||
| state.isLogin = true; | |||
| setAccessTokenInAxiosHeaders(action.payload); | |||
| }) | |||
| .addCase(resetPassword.fulfilled, (state, action) => { | |||
There was a problem hiding this comment.
resetPassword,fulfileed에도, signInUseCode.fulfiled에도 동일한 처리를 하게 되는데 리덕스 툴킷 내에서 재사용할 수 있는 방법을 혹시 아시나요?
There was a problem hiding this comment.
그러게요.. 뭔가 필요하긴 하겠는데 막상 방법이 떠오르지않네요
There was a problem hiding this comment.
찾아보니 addMatcher와 isAllOf 등을 사용하는 방법이 있다네요? 정확히 맞는지는 모르겠지만 한 번 확인해보세요!
| @@ -90,6 +96,16 @@ const authSlice = createSlice({ | |||
| state.isLogin = true; | |||
| setAccessTokenInAxiosHeaders(action.payload); | |||
| }) | |||
| .addCase(resetPassword.fulfilled, (state, action) => { | |||
| state.isLoading = false; | |||
There was a problem hiding this comment.
isLoading값으로 로딩처리해주는 부분을 깜빡했네요. 추가하겠습니다!
| state.errorMessage = `전에 사용한 적 없는 새로운 비밀번호를 만드세요.`; | ||
| }) | ||
| .addCase(checkCurrentURL.rejected, (state) => { | ||
| // 유효하지 않은 url ** |
There was a problem hiding this comment.
비밀번호 재설정 페이지에 들어오자마자, query의 code로 유효한 코드인지 체크해서 만료된 코드일 경우 여기로 넘어오는데요, 여기서상태값을 이용해 잘못된 url이거나 삭제된 페이지라는 화면을 보여주려고 합니다.
-> 회의때 공유해서 토의함
회의 내용(5월 18일)
|
|
좋습니당! 잘봤어요 |
merge한 pr입니다, 코드리뷰용 입니다 |
There was a problem hiding this comment.
- 남겨두셨던 다른 pr 비밀번호 재설정 기능 버그 수정 #93 이전 코드인 것 같아서 그 부분 제외하고 코멘트 남겨두었습니다!
- 그리고 에러 페이지는 다른 곳에서도 쓰일 것 같아서 따로 만드는 게 좋아보입니다. state라는 건 rejected되었을 때 변경해줄 값이라고 보면 될까요?
| @@ -90,6 +96,16 @@ const authSlice = createSlice({ | |||
| state.isLogin = true; | |||
| setAccessTokenInAxiosHeaders(action.payload); | |||
| }) | |||
| .addCase(resetPassword.fulfilled, (state, action) => { | |||
There was a problem hiding this comment.
찾아보니 addMatcher와 isAllOf 등을 사용하는 방법이 있다네요? 정확히 맞는지는 모르겠지만 한 번 확인해보세요!
|
|
||
| .error-message { | ||
| color: #ed4956; | ||
| font-size: 14px; |
There was a problem hiding this comment.
프로젝트 기본 font-size가 14px 아니었나요?
There was a problem hiding this comment.
// globalStyle.ts
body, input,textarea ,button {
font-size: 14px;
line-height: 18px;
padding:0;
margin:0;
}globalStyle보니까 그렇네요..!!
There was a problem hiding this comment.
네네 저 부분은 중복되서 삭제해도 좋을 것 같아요!
개요
작업사항
고민
method 리턴 타입이 여러개일 때, 어떻게 처리해서 이용하시나요?
string | (string | null) [] | nullas String으로 추론하기 ?typeof value === “string”인지 체크하고 이용하기? 현재 이 방법으로 구현했는데, 그 값을 이용할 때마다 반복해서 체크해야하다보니..좋지 않은 거 같습니다.비밀번호 재설정버튼 클릭 시, url query의 code를 이용해 유효한 페이지인지 체크하는데요, 만료된 코드여서 유효하지 않은 페이지를 보여줘야할 때, 리덕스 상태값을 하나 만들어서 라우터를 변경하는 게 어떨까 생각했습니다.
auth외에서 이 페이지를 이용할 경우가 없을까요?