이번 PR은 퀴즈 신고 모달의 로직을 개선하고, 신고 처리 과정에서 사용자 경험을 향상시키기 위한 수정 사항을 포함하고 있습니다. 신고 사유의 value를 서버 측과 동일한 상수형 값으로 변경하고, 신고 성공 시 사용자에게 알림을 주는 기능을 추가했습니다. !! 또한, 신고 처리 중 발생할 수 있는 다양한 오류에 대한 처리를 강화했습니다.
구현 사항
1. 신고 모달 로직 수정
기존 신고 사유가 단순히 텍스트 값으로 처리되던 것을 상수형 value(INAPPROPRIATE_CONTENT, COPYRIGHT_VIOLATION, FRAUDULENT_INFORMATION, EXPLICIT_CONTENT, ISSUE_ERROR, OTHER)로 수정하였습니다.
이로써 신고 사유에 대한 명확한 식별이 가능해졌고, 추후 유지보수 및 확장성에도 도움이 됩니다.
모달 내 ‘기타’ 사유를 선택한 경우 사용자에게 커스텀 사유를 입력하지 않으면 경고 메시지를 표시하여 필수 입력을 유도하는 기능을 추가했습니다.
2. 신고 성공 시 사용자 피드백 추가
신고가 성공적으로 처리되었을 때 사용자에게 alert을 통해 성공 메시지를 전달하도록 하였습니다.
이를 통해 사용자는 신고가 정상적으로 완료되었는지 즉각적으로 확인할 수 있어, 사용자 경험이 향상되었습니다.
3. 에러 처리 로직 개선
중복 신고 방지: 이미 신고된 퀴즈에 대해 다시 신고하려고 할 경우 HttpStatusCode.Conflict를 감지하여 "이미 신고한 퀴즈입니다."라는 메시지를 alert으로 보여줍니다.
서버 연결 오류 처리: 서버와의 연결이 불안정하거나 존재하지 않는 퀴즈에 대한 신고 시 적절한 에러 메시지를 alert으로 전달하여 사용자에게 문제를 인지시킵니다.
이를 통해 사용자에게 혼란을 줄 수 있는 상황들을 미연에 방지하고, 더 나은 에러 핸들링 경험을 제공하게 되었습니다.
4. 스타일 수정
신고 모달에서 타이틀 컨테이너와 닫기 버튼의 스타일을 수정했습니다.
타이틀과 닫기 버튼을 좌우로 배치하여 레이아웃을 개선했고, 닫기 버튼의 크기와 스타일을 조정하여 더 직관적이고 일관된 사용자 인터페이스를 제공했습니다.
기타
신고 사유가 "기타"일 경우, 필수로 내용을 작성하게 하여 신고 이유의 완성도를 높였습니다.
코드에서 중복된 부분을 제거하여 가독성과 유지보수성을 높였습니다.
불필요한 alert 메시지를 최소화하고, 상황에 맞는 피드백만을 제공하여 더 나은 사용자 경험을 추구했습니다.
이로 인해 개선된 점
유지보수성 향상: 사유 value를 상수형으로 처리하여 향후 새로운 신고 유형이 추가되거나 수정될 때 더 쉽게 확장할 수 있습니다.
사용자 경험 개선: 신고 성공 여부와 입력값 오류에 대한 명확한 피드백을 제공함으로써 사용자가 신고 과정에서 겪는 혼란을 최소화하였습니다.
안정성 강화: 중복 신고 및 서버 연결 문제에 대한 에러 처리가 강화되어 예외 상황에서도 프로그램의 안정성이 높아졌습니다.
UI 개선: 스타일 변경을 통해 시각적 일관성을 높이고, 신고 모달의 사용성을 향상시켰습니다.
개요
이번 PR은 퀴즈 신고 모달의 로직을 개선하고, 신고 처리 과정에서 사용자 경험을 향상시키기 위한 수정 사항을 포함하고 있습니다. 신고 사유의 value를 서버 측과 동일한 상수형 값으로 변경하고, 신고 성공 시 사용자에게 알림을 주는 기능을 추가했습니다. !! 또한, 신고 처리 중 발생할 수 있는 다양한 오류에 대한 처리를 강화했습니다.
구현 사항
1. 신고 모달 로직 수정
INAPPROPRIATE_CONTENT
,COPYRIGHT_VIOLATION
,FRAUDULENT_INFORMATION
,EXPLICIT_CONTENT
,ISSUE_ERROR
,OTHER
)로 수정하였습니다.2. 신고 성공 시 사용자 피드백 추가
3. 에러 처리 로직 개선
HttpStatusCode.Conflict
를 감지하여 "이미 신고한 퀴즈입니다."라는 메시지를 alert으로 보여줍니다.4. 스타일 수정
기타
이로 인해 개선된 점
이미지
신고 모달이 처음 열렸을 때
신고 사유를 클릭했을 때 추가 입력창이 뜨게 됨
신고 사유가 기타인데 사유를 적지 않았을 때
동일 퀴즈에 대해 중복신고를 진행 시