Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[fix] 멘토링 확인 프로세스 변경 #237

Merged

Conversation

jinaji
Copy link
Contributor

@jinaji jinaji commented Oct 4, 2023

제가 시작을 좀 전에 해두고 마무리를 오늘 지어서 ... 충돌나는 부분 최대한 잘 해결해본다고 했는데 (프로필 css쪽) 잘 되었는지는 ...... 엄청난 확신은 안 드네요 🥹 죄송합니다
dm창으로 바로 연결할 수는 없을 것 같아서 일단은 슬랙 프로필 링크로 진행했습니닷

변경사항

  • 멘토링 진행과정 중 확인 버튼을 진행하기 버튼으로 수정
  • 진행하기 버튼 누를 때 멘토의 슬랙 프로필 링크로 이동시켜야 하는데 ... 어떻게 해야할지 ,,,
  • 프로필에 socialLink (필수) 추가, 프로필 페이지에서 닉네임 옆의 슬랙 아이콘을 통해 본인 링크만 확인 가능
image
  • 프로필 수정 페이지에 슬랙 링크 란, 물음표 표시 추가
image
  • 슬랙 프로필 링크가 조금 생소하게 느껴질 수 있을 것 같아 추후 물음표 표시 누르면 슬랙 링크 추가에 대한 가이드 추가될 예정 ... 이라 일단 가이드 페이지로 안내했습니다

수정사항 보이면 말씀주세여 ~~

jinaji and others added 7 commits October 4, 2023 23:31
* [fix]: tag 가 width를 넘치는 문제 해소

* [fix]: 불필요한 slice로 복사 붙여넣기 느려지는 문제 해소

* [fix]: # trimming, hashtag 12자 제한

* [fix]: manito42#197, review length 조절 및 ui 일부 변경

UI: input box size row = 6 설정
UI: counter 제공
fid: maxLength 300 제한

* [fix]: 해시태그 문자 제한 제거

* [fix]: 멘토링 분야 선택 manito42#224
@jinaji
Copy link
Contributor Author

jinaji commented Oct 4, 2023

빌드오류 ,,, 알아서척척척 수정하겠습니다

@jinaji
Copy link
Contributor Author

jinaji commented Oct 4, 2023

image

요 에러때문에 빌드 안 된 거였는데 socialLink가 이런저런 DTO에서 충돌이 있는 것 같아여 ...
일단은 옵셔널로 처리하고 빌드했고 ... 조만간 ... 처리해봐여 🥹

Copy link
Member

@falconlee236 falconlee236 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

원래 의도하신 작업은 슬랙 프로필 링크가 없어도 일단 수정하기가 완료되고,
그 다음에 멘토로 활동하기가 토글이 되면 "슬랙 프로필 링크를 추가해야합니다."
라는 alert가 나와야 되는거 같은데,

지금 슬랙링크를 입력하지 않고 수정하기를 누르면 "잘못된 요청입니다" 라는 alert가 나오고 수정이 되지 않는것 같습니다.

@falconlee236 falconlee236 added the enhancement New feature or request label Oct 5, 2023
@falconlee236 falconlee236 linked an issue Oct 5, 2023 that may be closed by this pull request
3 tasks
Copy link
Member

@JuneParkCode JuneParkCode left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  1. 슬랙 링크 등록 후 공백으로 바꾸면 잘못된 요청이 나옵니다 (아마 빈 문자열일 때 social link를 null로 처리하고 요청을 보내면 될 것 같습니다. 그리고, 확인 버튼을 누르고 요청을 보내기 전에 social Link 가 있을 때 regex 로 형태를 검증하여 유저에게 알려줘야할듯...?)
  2. 진행하기 버튼을 눌렀을 때 alert 가 아니라 "멘토의 슬랙프로필 페이지로 이동하시겠습니까?, 네 / 아니오" 를 넣고 "네"를 누르면 새탭으로 슬랙 프로필 페이지를 열어야합니다.

42manito/src/RTK/Apis/User.ts Show resolved Hide resolved
@jinaji
Copy link
Contributor Author

jinaji commented Oct 5, 2023

원래 의도하신 작업은 슬랙 프로필 링크가 없어도 일단 수정하기가 완료되고, 그 다음에 멘토로 활동하기가 토글이 되면 "슬랙 프로필 링크를 추가해야합니다." 라는 alert가 나와야 되는거 같은데,

지금 슬랙링크를 입력하지 않고 수정하기를 누르면 "잘못된 요청입니다" 라는 alert가 나오고 수정이 되지 않는것 같습니다.

  1. 슬랙 링크 등록 후 공백으로 바꾸면 잘못된 요청이 나옵니다 (아마 빈 문자열일 때 social link를 null로 처리하고 요청을 보내면 될 것 같습니다. 그리고, 확인 버튼을 누르고 요청을 보내기 전에 social Link 가 있을 때 regex 로 형태를 검증하여 유저에게 알려줘야할듯...?)

프로필 업데이트 요청 보낼 때, socialLink가 빈문자열일 경우 그대로 빈문자열로 보내는 오류로 생각되어서 성준님 1번 댓글 참고해서 null로 수정했습니다. undefined로 수정하니 반영이 되질 않네요 ..? 그런데
image

요 오류를 봐서 이렇게 처리하는게 맞는 방식인지는 모르겠네염 ...

두 분 말씀주신 대로 setsHide 에 보내는 socialLink 제거했는데 socialLink 있는 상태에서 멘토 활성화 토글 눌렀을 때 소셜 링크가 필요하다는 400 에러가 발생하는데 확인 부탁드려도 될까여?

요거 해결하려고 백엔드쪽 130번 이슈에서 뮤님한테 여쭤봤었는데,

enable(isHide : false)할때는 같이보내주시고 disable(isHide: true)할때는 안보내주시면됩니다

라고 하셔서 보냈던 건데 없는 상태로 보내면 안 가져와지는 것 같거든요 ... 제가 백쪽은 잘 몰라서 ... 요 부분은 @JuneParkCode 죄송하지만 확인하시고 설명 부탁드려도 될까용 ㅠ

@JuneParkCode
Copy link
Member

원래 의도하신 작업은 슬랙 프로필 링크가 없어도 일단 수정하기가 완료되고, 그 다음에 멘토로 활동하기가 토글이 되면 "슬랙 프로필 링크를 추가해야합니다." 라는 alert가 나와야 되는거 같은데,
지금 슬랙링크를 입력하지 않고 수정하기를 누르면 "잘못된 요청입니다" 라는 alert가 나오고 수정이 되지 않는것 같습니다.

  1. 슬랙 링크 등록 후 공백으로 바꾸면 잘못된 요청이 나옵니다 (아마 빈 문자열일 때 social link를 null로 처리하고 요청을 보내면 될 것 같습니다. 그리고, 확인 버튼을 누르고 요청을 보내기 전에 social Link 가 있을 때 regex 로 형태를 검증하여 유저에게 알려줘야할듯...?)

프로필 업데이트 요청 보낼 때, socialLink가 빈문자열일 경우 그대로 빈문자열로 보내는 오류로 생각되어서 성준님 1번 댓글 참고해서 null로 수정했습니다. undefined로 수정하니 반영이 되질 않네요 ..? 그런데 image

요 오류를 봐서 이렇게 처리하는게 맞는 방식인지는 모르겠네염 ...

두 분 말씀주신 대로 setsHide 에 보내는 socialLink 제거했는데 socialLink 있는 상태에서 멘토 활성화 토글 눌렀을 때 소셜 링크가 필요하다는 400 에러가 발생하는데 확인 부탁드려도 될까여?

요거 해결하려고 백엔드쪽 130번 이슈에서 뮤님한테 여쭤봤었는데,

enable(isHide : false)할때는 같이보내주시고 disable(isHide: true)할때는 안보내주시면됩니다

라고 하셔서 보냈던 건데 없는 상태로 보내면 안 가져와지는 것 같거든요 ... 제가 백쪽은 잘 몰라서 ... 요 부분은 @JuneParkCode 죄송하지만 확인하시고 설명 부탁드려도 될까용 ㅠ

음... 조금 설계가 잘못되었던 것 같네요. 프론트 입장에서 setHide 에 대한 정보만 보내면 된다고 생각합니다... 명환님하고 한번 이야기해볼게요.

@JuneParkCode
Copy link
Member

string | undefined 문제의 경우, 일단 undefined 처리를 하고 한번 시도 해보시면 될 것 같습니다. 생각해보니까 그게 오히려 맞는 것 같기도 하고...

@koreanddinghwan
Copy link
Contributor

원래 의도하신 작업은 슬랙 프로필 링크가 없어도 일단 수정하기가 완료되고, 그 다음에 멘토로 활동하기가 토글이 되면 "슬랙 프로필 링크를 추가해야합니다." 라는 alert가 나와야 되는거 같은데,
지금 슬랙링크를 입력하지 않고 수정하기를 누르면 "잘못된 요청입니다" 라는 alert가 나오고 수정이 되지 않는것 같습니다.

  1. 슬랙 링크 등록 후 공백으로 바꾸면 잘못된 요청이 나옵니다 (아마 빈 문자열일 때 social link를 null로 처리하고 요청을 보내면 될 것 같습니다. 그리고, 확인 버튼을 누르고 요청을 보내기 전에 social Link 가 있을 때 regex 로 형태를 검증하여 유저에게 알려줘야할듯...?)

프로필 업데이트 요청 보낼 때, socialLink가 빈문자열일 경우 그대로 빈문자열로 보내는 오류로 생각되어서 성준님 1번 댓글 참고해서 null로 수정했습니다. undefined로 수정하니 반영이 되질 않네요 ..? 그런데 image
요 오류를 봐서 이렇게 처리하는게 맞는 방식인지는 모르겠네염 ...
두 분 말씀주신 대로 setsHide 에 보내는 socialLink 제거했는데 socialLink 있는 상태에서 멘토 활성화 토글 눌렀을 때 소셜 링크가 필요하다는 400 에러가 발생하는데 확인 부탁드려도 될까여?
요거 해결하려고 백엔드쪽 130번 이슈에서 뮤님한테 여쭤봤었는데,

enable(isHide : false)할때는 같이보내주시고 disable(isHide: true)할때는 안보내주시면됩니다

라고 하셔서 보냈던 건데 없는 상태로 보내면 안 가져와지는 것 같거든요 ... 제가 백쪽은 잘 몰라서 ... 요 부분은 @JuneParkCode 죄송하지만 확인하시고 설명 부탁드려도 될까용 ㅠ

음... 조금 설계가 잘못되었던 것 같네요. 프론트 입장에서 setHide 에 대한 정보만 보내면 된다고 생각합니다... 명환님하고 한번 이야기해볼게요.

dto validation로직이 확실히 불필요한 것 같아요 인자값 유효한지 검증만 컨트롤러 레이어에서하고, 이전에 controller layer에서 하던 validation은 트랜잭션으로 묶어서 처리해야할 것 같아요

@JuneParkCode
Copy link
Member

  • profile update 시 필수 인자들이 비워지는 경우 hide 처리를 해줘야합니당

@koreanddinghwan
Copy link
Contributor

  • profile update 시 필수 인자들이 비워지는 경우 hide 처리를 해줘야합니당

profile Update 하나 안에 isHide관련 로직을 관련해서 너무 많은것들을 처리해야해서, 트랜잭션이 상당히 길어질거에요. 컨트롤러를 분리하는게 나아보입니다. (isHide 관련해서만)

@JuneParkCode
Copy link
Member

맞는 것 같습니당. isHide 에 대해서 별도로 분리하고
그래도 update 시에 필수 항목이 사라진 경우 isHide 가 풀리는게 맞다고 생각하는데 이건 어떻게 생각하시나용?

@koreanddinghwan
Copy link
Contributor

맞는 것 같습니당. isHide 에 대해서 별도로 분리하고 그래도 update 시에 필수 항목이 사라진 경우 isHide 가 풀리는게 맞다고 생각하는데 이건 어떻게 생각하시나용?

그러면 update시에 필수항목 사라진 결과를 서버에서 리턴하면 재렌더링해주셔야합니다 가능하신가여

@JuneParkCode
Copy link
Member

그건 이미 되있어서 상관없습니다~

@koreanddinghwan
Copy link
Contributor

백엔드에서 처리할게요

@JuneParkCode
Copy link
Member

두 쪽에서 다 처리해야하지 않을까요? 일단은 400 리퀘스트 자체가 안가도록 만들어줘야한다고 생각합니당...
제일 좋은 방안은 input 에서 regex 검사해서 빨간색 처리 해주던가 하는 것도 있겠지만(비밀번호 폼처럼) 귀찮으니까 수정하기 쪽에서 처리해도 될 것 같아요.

@koreanddinghwan
Copy link
Contributor

스읍....근데 alert띄우는게 생각보다 ux적으로 좋지 않아서요 수정하기 버튼 우측이라던지 error message남기는 칸이 있으면 좋지 않을까요 + 서버에서 던지는 error message를 그쪽에 렌더링하고, 프론트에서 validation한것도 거기에 처리하면 어떨까요

@koreanddinghwan
Copy link
Contributor

axios 인스턴스가 래핑되어있엇..ㅓ ㅋㅋㅋㅋㅋㅋ 겁나큰작업일것같긴한데..ㅋㅋㅋㅋ

@JuneParkCode
Copy link
Member

넹... 그래서 그냥 input 값만 검사하고 되는 놈들만 쿼리 보내자... (왜냐면 이미 멘토링 영역 / 관심 영역은 그렇게 처리됨) 라는게 제 의견임당

@jinaji
Copy link
Contributor Author

jinaji commented Oct 5, 2023

profileUpdate 시 slackLink URL 검증이 아직 안되는 것 같습니다. (수정하기 클릭시 해당 요소 regex로 검증 필요.

아 이거 백에서 하는 것 같아서 안 했었는데 하는게 낫겠져?

수정하기 버튼 우측이라던지 error message남기는 칸이 있으면 좋지 않을까요

이런식으로 처리해볼게여 alert 말고 수정하기 창에 에러메세지 렌더링 ... 일단은 슬랙 링크만 유효성 검사하고 띄우는 식으로 해보겠습니다 다른 애들도 쓸 수 있도록 만들어볼게욘
근데 지금 해시태그 한글자 입력하면 나오던 2 ~ 12글자 이거 안 뜨고 잘못된 요청 뜨는데 요거 맞나여
체크 후에 유효한 애들만 보내보기 ... 해보겠습니다~! (확인 alert도 수정할게여~)

물음표 URL 은
https://github.com/manito42/guide/wiki/42-%EB%A7%88%EB%8B%88%EB%98%90-%EC%9D%B4%EC%9A%A9%ED%95%98%EA%B8%B0#%EC%8A%AC%EB%9E%99-%EB%A7%81%ED%81%AC-%EA%B0%80%EC%A0%B8%EC%98%A4%EA%B8%B0
여기로 잡아주시면 됩니다!

체크완

@JuneParkCode
Copy link
Member

JuneParkCode commented Oct 5, 2023

앗... 수정과정에서 1글자 체크를 안해놨었네요..

@jinaji
Copy link
Contributor Author

jinaji commented Oct 5, 2023

image
  • invalidInput state를 통해 에러메세지 수정하기 버튼 위에 출력할 수 있도록 설정
    → 해시태그나 카테고리는 각각 입력 컴포넌트 안에서 처리되는 것 같아서 일단 socialLink에만 적용했습니닷

  • regex 통해 슬랙 프로필 형식 검사 ... 유효한 링크인지까지는 못 하고 형식만 봅니다 regex 검사 통과 못 하면 업데이트 안 되게 막았고 빈문자열은 통과 되게 해뒀습니다 ... 만 지금 빈문자열 넣으면 undefined 설정 돼서 안 될 거예여 ... 요건 제가 null로 바꿔서 테스트 해봤고 업데이트 잘 됐습니다~

  • 진행버튼 눌렀을 때 handlePatchReservation 에 전달되던 msg와 errorMsg 제거

@JuneParkCode
Copy link
Member

regex 통해 슬랙 프로필 형식 검사 ... 유효한 링크인지까지는 못 하고 형식만 봅니다 regex 검사 통과 못 하면 업데이트 안 되게 막았고 빈문자열은 통과 되게 해뒀습니다 ... 만 지금 빈문자열 넣으면 undefined 설정 돼서 안 될 거예여 ... 요건 제가 null로 바꿔서 테스트 해봤고 업데이트 잘 됐습니다~

이게 다시 비웠을 때 처리 안되는거죠??

@jinaji
Copy link
Contributor Author

jinaji commented Oct 5, 2023

regex 통해 슬랙 프로필 형식 검사 ... 유효한 링크인지까지는 못 하고 형식만 봅니다 regex 검사 통과 못 하면 업데이트 안 되게 막았고 빈문자열은 통과 되게 해뒀습니다 ... 만 지금 빈문자열 넣으면 undefined 설정 돼서 안 될 거예여 ... 요건 제가 null로 바꿔서 테스트 해봤고 업데이트 잘 됐습니다~

이게 다시 비웠을 때 처리 안되는거죠??

네 맞아여! 요거 테스트 해보시려면 updateButtonHandler 안쪽 form.socialLink = socialLink === "" ? undefined : socialLink; 요부분 null로 바꾸시면 됩니닷 경고떠서 일단 undefined 처리 해뒀어용

@jinaji
Copy link
Contributor Author

jinaji commented Oct 5, 2023

아마도 ,,,,,, toggle 활성화 빼고 다 될 것 같아여 ......

@JuneParkCode
Copy link
Member

JuneParkCode commented Oct 5, 2023

안비워지는 문제가 동일하게 나는데 이건 백엔드 문제라서.. 일단 여기서 스탑!

image

ㅠㅠ 이거 success 뜨는게 생각해보니까

  const handlePatchReservation = async (
    data: any,
    patchFunc: any,
    msg?: string,
    errorMsg?: string
  ) => {
    try {
      const res = await patchFunc(data).unwrap();
      dispatch(setSelectedReservation(res));
      alert(msg ? msg : "Success"); // if (msg) alert(msg) 변경
    } catch (e: BaseQueryError<any>) {
      alert(errorMsg ? errorMsg : "Error");
    }
  };

이 부분에서 없을때도 그냥 뿌려줘서 그러는건데, success case 에서는 없으면 그냥 alert 처리 안하게 해도 될 것 같아요 (저희가 핸들링하는 경우에는 다 처리하고 있으니까...) 그것만 고치면 다 오케이일듯!

Copy link
Member

@JuneParkCode JuneParkCode left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

대작업 고생 많으셨습니다

@koreanddinghwan
Copy link
Contributor

백엔드 수정 api 배포완료됐습니다 테스트해보시고~ 안되는거 말씀해주세용홍홍

@JuneParkCode
Copy link
Member

activation도 정상적으로 작동합니다!

@falconlee236
Copy link
Member

수업 1시애 끝나고 바로 리뷰할게요😂

Copy link
Member

@falconlee236 falconlee236 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

각자 uid accesstoken 받아서 안드로이드하고 웹 모두 테스트 해봤습니다!!
정상 작동 되는 것 같아요 대 작업 고생 많으셨습니다

@jinaji jinaji merged commit 3faf0d3 into manito42:dev Oct 6, 2023
1 check passed
@jinaji jinaji deleted the 226-todo-멘토링-확인-프로세스-변경-1 branch October 6, 2023 07:34
obvoso pushed a commit to obvoso/42manito-front that referenced this pull request Oct 27, 2023
* feat: 프로필에 소셜 링크 추가

* feat: 소셜링크 받아와지는 것 확인

* [Fix] manito42#208,manito42#206,manito42#197 (manito42#220)

* [fix]: tag 가 width를 넘치는 문제 해소

* [fix]: 불필요한 slice로 복사 붙여넣기 느려지는 문제 해소

* [fix]: # trimming, hashtag 12자 제한

* [fix]: manito42#197, review length 조절 및 ui 일부 변경

UI: input box size row = 6 설정
UI: counter 제공
fid: maxLength 300 제한

* [fix]: 해시태그 문자 제한 제거

* [fix]: 멘토링 분야 선택 manito42#224

* feat: 프로필에 소셜 링크 추가

* feat: 멘토 프로필에 socialLink 추가, 토글 활성화 조건 추가

* refactor: css

* fix: 진행버튼

* fix: build error

* fix: socialLink 공백인 경우 null 처리

* feat: 멘토링 진행하기 버튼 클릭시 슬랙 프로필 링크 이동여부 모달

* fix: 테스트

* fix: css 제대로 병합

* fix: 소셜링크 없을 때 undefined, 프로필 슬랙 이미지 비활성화

* fix: 진행 alert 제거, socialLink Regex 검사

* fix: 이번엔 진짜 진행하기... , dto 변경

* fix: success alert 제거

* ✨ [Feat]: mentorProfile activation

---------

Co-authored-by: Photogrammer <81505228+JuneParkCode@users.noreply.github.com>
Co-authored-by: myukang <myunghwan0421@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[todo] 멘토링 확인 프로세스 변경
4 participants