[FEATURE] 알림 발송 Modal 구현 #115
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Deploying sopt-admin with
|
| Latest commit: |
7a3967f
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://0c49744e.sopt-admin.pages.dev |
| Branch Preview URL: | https://feature-alarm-modal.sopt-admin.pages.dev |
|
여기 베이스로 잡고 API 연결 작업 들어갈게요! |
Brokyeom
reviewed
Oct 15, 2024
Merged
* yarn install version 4.5.0 * Revert "feat: 알림 발송 API 연결" This reverts commit d25d07e. * feat: 알림 발송 API 연결 * fix: remoce legacy postAlarm function. * fix: remove legacy Alarm Modal component. * feat: 알림 앱링크 연결 * refactor: selectOptions 항목 utils로 이동 * lint * feat: CSV 파일 업로드 로직 이식 * fix: 불필요한 코드 삭제 * feat: CSV 파일 검사 로직 추가 * Add onClose * fix: csv 조건문 수정
스펙 변경입니다! |
7a3967f에서 변경사항 반영 완료했습니다!! |
Brokyeom
added a commit
that referenced
this pull request
Nov 29, 2024
* [FEATURE] 알림 발송 Modal 구현 (#115) * feat: 알림 발송 Modal UI 구현 * fix: description 필드 제거 * fix: resolve build error * chore: set yarn 4.5.0 * feat: 알림 발송 API 연결 * Revert "feat: 알림 발송 API 연결" This reverts commit d25d07e. * Revert "chore: set yarn 4.5.0" This reverts commit e931706. * fix: DatePicker용 커스텀 Select 컴포넌트로 대체 * [FEATURE] 알림 발송 API 연결 (#116) * yarn install version 4.5.0 * Revert "feat: 알림 발송 API 연결" This reverts commit d25d07e. * feat: 알림 발송 API 연결 * fix: remoce legacy postAlarm function. * fix: remove legacy Alarm Modal component. * feat: 알림 앱링크 연결 * refactor: selectOptions 항목 utils로 이동 * lint * feat: CSV 파일 업로드 로직 이식 * fix: 불필요한 코드 삭제 * feat: CSV 파일 검사 로직 추가 * Add onClose * fix: csv 조건문 수정 * update cache * fix: 발송금지시간 스펙 변경사항 반영 --------- Co-authored-by: Brokyeom <goindol40@gmail.com> Co-authored-by: HyeongKyeom Kim <97586683+Brokyeom@users.noreply.github.com> * style: nav, header 스타일 추가 * feat: 알림 리스트 query 수정 * feat: 알림 리스트 mds 적용 및 변경된 스펙 적용 * feat: 알림 조회 WIP * feat: 알림 조회 링크 & 디자인 추가 * fix: line-height를 padding-top으로 대체 * fix: mds Chip으로 대체 * refact: utils 분리 * fix: Alarm type 수정 * Feat: Chip에 disabled 추가 (#158) * chore: update mds version to 2.7.15 * feat: Chip에 disabled 추가 * resolve conflict --------- Co-authored-by: Brokyeom <goindol40@gmail.com> --------- Co-authored-by: Jungwoo LEE <jungwoo3490@naver.com> Co-authored-by: sohee <soheek@fairsquarelab.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
✨ 구현 기능 명세
close #114
알림 발송 모달 UI를 구현했어요.
기존 CreateAlarmModal 컴포넌트를 수정하는 방향으로 진행하려 했지만, 거의 새로운 모달 수준으로 디자인이 변경되어서 CreateNewAlarmModal 컴포넌트를 새로 만드는 방향으로 진행했어요.
기존 모달과 다르게 즉시 발송 / 예약 발송 2가지 case로 나뉘므로
sendType인터페이스를 추가했어요.이
sendType을 기준으로 분기하여 모달 내부 UI를 변경합니다.각 필드의 선택값들을 state로 관리하도록 했고, state 선언부에 각 state가 어떤 값을 관리하는지 주석으로 달아놨으니 참고하면 좋을 것 같아요!!
아직 서버 명세를 몰라서 값 타입을 그냥 선택하는 그 문자열 값 그 자체로 임시로 해두었어요.
CSV 첨부 옵션을 선택했을 때 CSV Input이 나와야 하고, Input이 어디에 위치해야 하는지는 주석으로 표시해두었어요.
스타일 커스텀이 필요한 곳이 굉장히 많았고, 은근 겹치는 부분이 없어 공통으로 사용하기 쉽지 않더라구요... 스타일 파일에서 얘 뭐지..? 싶은 부분은 다 MDS 컴포넌트를 커스텀하는 부분이라고 이해하시면 될 것 같아요!
checkDisabled는 발송/예약 버튼의 활성화 상태를 검증하는 함수에요. true를 반환하면 발송/예약 버튼이 비활성화되고, false를 반환하면 활성화되어요. 검증 케이스들은 어느정도 다 추가해뒀는데 CSV는 아직 구현이 안 된 상태여서 구현이 완료되면 여기에 검증 로직도 추가해야 할 것 같아요.각 검증 라인이 어떤 케이스를 검증하는지를 주석으로 달아뒀어요!! 모든 케이스 검증이 성공되어야 버튼이 활성화됩니다.
현재 DatePicker의 Month를 전환하는 arrow 스타일이 조금 이상해서 이거 픽스하는 작업을 이어서 할 예정이에요.
++ 아직 스크롤 이슈 해결된 건 반영이 안 된 상황입니다! 지금 보니까 스크롤 색상도 white로 되어있네요... 이 부분도 여기서 커스텀해서 사용하는 게 좋을까요??
👉🏻 즉시 발송
2024-10-13.7.47.48.mov
👉🏻 예약 발송
2024-10-13.7.51.37.mov