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

[BUG] 모바일 비회원일 때 신고 버튼을 눌르면 알 수 없는 에러 메세지입니다라고 떠요 #781

Merged
merged 4 commits into from
Oct 19, 2023

Conversation

chsua
Copy link
Collaborator

@chsua chsua commented Oct 18, 2023

🔥 연관 이슈

close: #734

📝 작업 요약

  • 모바일에서 신고하려고 하면 로그인 후 이용하라고 안내 메세지 보이기
  • 신고하기 api를 쿼리 훅으로 만들기

⏰ 소요 시간

1시간

🔎 작업 상세 설명

  • 모바일에서 신고하려고 하면 로그인 후 이용하라고 안내 메세지 보이기
    • 원래는 포스트 디테일 페이지에서 해주려고 했는데, 그럼 모달까지 다 선택하고 나서 요청을 거절하는 토스트가 나오게 되어 사용성을 저해한다고 생각
    • 때문에 innerHeaderPart/bottomPart에서 action을 취하려고 할때 1차적으로 확인 후 토스트 안내를 내보내기로 결정
  • 신고하기 api를 쿼리 훅으로 만들기

🌟 논의 사항

신고하기 mutate를 게시글/닉네임 같이 사용하는데 문제가 되진 않겠죠?

@github-actions
Copy link

github-actions bot commented Oct 18, 2023

⚡️ Lighthouse report!

Category Score
🟠 Performance 62
🟠 Accessibilty 89
🟢 SEO 100
🟠 PWA 89
Category Score
🟢 First Contentful Paint 0.6 s
🟠 Largest Contentful Paint 3.8 s
🔴 Total Blocking Time 1,630 ms
🟢 Cumulative Layout Shift 0
🟢 Speed Index 2.8 s

!isReportLoading && handleReportClick(selectedOption);
if (isReportLoading) return;

handleReportClick(selectedOption);
Copy link
Member

Choose a reason for hiding this comment

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

오 가독성이 높아졌네요👍

Copy link
Member

Choose a reason for hiding this comment

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

로딩이 끝나야만 action을 null로 세팅하도록 해서
말씀하신 이슈를 해결해볼 수 있을거 같아요!

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

혹시 그럼 네트워크가 느린 사용자가 신고를 하고 기다리다가 오래 걸려서 취소를 누르면 나가지지 않게 될 것 같은데 제가 이해한 바가 맞을까요?? 아님 다르게 작동하나요??

@@ -16,7 +21,8 @@ export const useReportAction = () => {
queryClient.invalidateQueries({ queryKey: [QUERY_KEY.REPORT] });
},
onError: () => {
window.console.error('신고 조치를 실패했습니다.');
const message = error instanceof Error ? error.message : '투표를 실패했습니다.';
addMessage(message);
Copy link
Member

Choose a reason for hiding this comment

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

복붙 때문인지 에러메시지 값이 이상해졌는데 복구해주실 수 있나요🤔

@inyeong-kang
Copy link
Member

fe-리뷰완

Copy link
Collaborator

@Gilpop8663 Gilpop8663 left a comment

Choose a reason for hiding this comment

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

queryHook을 만드니 기존 컴포넌트에 있던 로직들이 옮겨가서 UI 코드, api 관련 코드가 분리되어 보여서 가독성이 너무 좋아졌네요

리팩터링 최고 🌊

mutationFn: async (reportData: ReportRequest) => await reportContent(reportData),
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: [QUERY_KEY.REPORT] });
addMessage('신고를 완료하였습니다.');
Copy link
Collaborator

Choose a reason for hiding this comment

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

신고의 경우에는 성공했을 때 사용자에게 알려주는 것 너무 좋은데여🔥

Comment on lines +62 to +65
if (!loggedInfo.isLoggedIn) {
openToast('로그인 후에 기능을 이용해주세요.');
return;
}
Copy link
Collaborator

Choose a reason for hiding this comment

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

버그 해결 완료 👍👍👍

@Gilpop8663
Copy link
Collaborator

fe-리뷰완

@chsua
Copy link
Collaborator Author

chsua commented Oct 19, 2023

FE-리뷰요청

@chsua chsua merged commit be76414 into dev Oct 19, 2023
1 check passed
@woo-chang woo-chang deleted the feat/#734 branch October 19, 2023 05:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
3 participants