카카오 알림톡 프론트엔드 (설정 UI 활성화 + 전화번호 입력)
ID: edb84c7f-e87a-4a04-b3b4-678626cba1f6
## 목표
카카오 알림톡 설정 UI 활성화 + 전화번호 입력 필드 추가
## 구현 내용
### 1. 설정 페이지 수정 (`app/views/settings/show.html.erb`)
- 카카오톡 체크박스: `disabled` 제거, "준비 중" 배지 제거
- 카카오톡 체크박스 활성화 시 전화번호 입력 필드 표시
- 전화번호 형식: 010-XXXX-XXXX (한국 모바일)
- 안내 텍스트: "카카오톡으로 QT 알림을 받으려면 전화번호를 입력해주세요"
- Stimulus 컨트롤러 활용: 기존 `notification-methods` 컨트롤러에 kakao 토글 로직 추가
### 2. Users 테이블 phone 컬럼 확인
- users 테이블에 이미 `phone` varchar 컬럼이 존재함
- SettingsController에서 phone 업데이트 가능하도록 수정 필요
### 3. SettingsController 수정 (`app/controllers/settings_controller.rb`)
- `settings_params`에서 phone을 user params로 분리 처리
- 또는 UserSetting에 phone 저장 (설계 선택)
- **중요**: User 모델의 phone 컬럼 활용 (이미 존재)
- update 액션에서 user.phone도 함께 업데이트:
```ruby
current_user.update(phone: params[:phone]) if params[:phone].present?
```
### 4. 전화번호 Stimulus 컨트롤러 (`app/javascript/controllers/notification_methods_controller.js`)
- 기존 notification_methods_controller.js 수정
- kakao 체크박스 토글 시 전화번호 입력 필드 표시/숨김
- 전화번호 유효성 검사 (010으로 시작, 11자리)
### 5. 테스트 (`test/controllers/settings_controller_test.rb`)
- PATCH /settings에서 phone 업데이트 확인
- kakao 포함한 notification_methods 저장 확인
## 파일 목록 (이 파일들만 수정/생성)
- `app/views/settings/show.html.erb` (수정 - 카카오 활성화 + 전화번호)
- `app/controllers/settings_controller.rb` (수정 - phone 파라미터 처리)
- `app/javascript/controllers/notification_methods_controller.js` (수정 - kakao 토글)
- `test/controllers/settings_controller_test.rb` (수정 - kakao + phone 테스트)
## 주의사항
- Tailwind CSS v4 사용 (app/assets/tailwind/application.css 참고)
- 기존 디자인 시스템 파셜 패턴 활용 (shared/_card, _button 등)
- 기존 notification-methods Stimulus 컨트롤러 패턴 유지
- users 테이블에 phone 컬럼이 이미 있는지 먼저 확인 (없으면 마이그레이션 불필요 - 이미 존재)
- bin/rails test로 전체 테스트 통과 확인 필수
- 다른 에이전트(kakao-backend)가 서비스 파일을 수정하므로, 서비스 파일은 절대 수정하지 마세요
첨부 이미지
이미지 추가 (Ctrl+V로 붙여넣기 또는 클릭)
JPEG, PNG, GIF, WebP / 최대 10MB
활동 로그
-
팀팀리드 상태 변경: 리뷰 → 완료
2026년 03월 03일 06:04:48
-
Kkakao-frontend 카카오 프론트엔드 구현 완료
2026년 03월 03일 05:56:04
상세 보기
## 변경 파일
- `app/views/settings/show.html.erb` - 카카오 체크박스 활성화, 전화번호 입력 필드 추가
- `app/controllers/settings_controller.rb` - phone 파라미터 처리 (빈 문자열→nil)
- `app/javascript/controllers/notification_methods_controller.js` - kakaoPhone target 추가, 토글 로직
- `test/controllers/settings_controller_test.rb` - 테스트 3개 추가 (kakao 저장, phone 업데이트, phone 비우기)## 변경 사항
1. 카카오톡 체크박스: `disabled` 제거, `opacity-50` 제거, "준비 중" 배지 제거
2. 전화번호 필드: 카카오 체크 시 표시, `010-0000-0000` placeholder, tel 패턴 검증
3. Stimulus: kakaoPhone target으로 체크박스 연동 토글
4. 컨트롤러: `params[:phone].presence`로 빈 문자열→nil 처리## 테스트 결과
- 9 runs, 35 assertions, 0 failures, 0 errors -
Kkakao-frontend 상태 변경: 할 일 → 리뷰
2026년 03월 03일 05:55:57
-
Kkakao-frontend 카카오 프론트엔드 구현 시작
2026년 03월 03일 05:53:35