# task-933.1 완료 보고서: 대시보드 팀 카드에 진행 중 작업 제목 표시

## SCQA

**S**: 대시보드 팀 카드에 팀명 + "진행 N건" 배지 + 팀원 목록이 표시되며, 팀명과 첫 번째 팀원 사이에 여백이 존재한다.

**C**: 어떤 작업이 진행 중인지 팀 카드만 보고는 파악할 수 없어, 진행 중 작업 배너(최상단)나 팀원 개별 currentTask 정보까지 확인해야 했다.

**Q**: 팀 카드의 헤더와 팀원 목록 사이에 현재 진행 중인 작업 제목을 표시하여 직관성을 높일 수 있는가?

**A**: TeamCard 컴포넌트에 `runningTasks` prop을 추가하고, 팀명 헤더 아래에 진행 중 작업 제목을 표시하는 UI를 구현했다. 수정 파일 2개, JS 구문 검증 통과(braces/parens/brackets 균형 0-0-0), API 데이터 정합성 확인 완료.

## 수정 파일 목록

- `/home/jay/workspace/dashboard/components/utils.js` — TeamCard 컴포넌트에 runningTasks prop + 작업 제목 표시 영역 추가 (line 115-146)
- `/home/jay/workspace/dashboard/components/App.js` — TeamCard 호출부에 runningTasks prop 전달 추가 (line 433)

## 변경 상세

### 1. App.js (line 433)
- `runningTasks={running.filter(t => t.team_id === team.sub_team_id)}` prop 추가
- 기존 `runningCount` 필터와 동일한 조건으로 실제 task 객체 배열 전달

### 2. utils.js TeamCard (line 115-146)
- props에 `runningTasks = []` 추가
- 팀명 헤더(`mb-1.5` div)와 팀원 목록(`space-y-0.5` div) 사이에 작업 제목 영역 삽입
- description 정제: markdown 헤더 제거(`replace(/^#+ /gm, '')`), 첫 줄만 추출(`.split('\n')[0]`), 중복 task_id 제거
- 디자인: `text-[11px] text-slate-400` (작은 폰트 + 회색), CSS `truncate`(말줄임표), 에메랄드 dot(`w-1 h-1 bg-emerald-400`)
- 최대 2건 표시, 3건 이상 시 "+N건 더" 안내
- 진행 중 작업 없으면 영역 미표시

## 발견 이슈 및 해결

### 자체 해결 (3건)
1. **API description 필드에 전체 마크다운 포함** — `.replace(/^#+ /gm, '').split('\n')[0]`으로 첫 줄만 추출하고 헤더 마크업 제거
2. **description에 task_id가 중복 포함** — `replace(new RegExp('^' + t.task_id + '[:\\s]*'), '')` 으로 중복 제거
3. **긴 제목 카드 너비 초과 가능성** — CSS `truncate` 클래스로 말줄임표 처리 + `title` 속성에 전문 표시

## 셀프 QC 체크리스트
- [x] 1. 영향 파일: utils.js, App.js (2개 한정)
- [x] 2. 엣지 케이스: 빈 runningTasks(미표시), description 없음(빈문자열), 3건 이상(2건+안내), 마크다운 포함 description(정제)
- [x] 3. 작업 지시와 정확히 일치: 팀명과 첫 팀원 사이에 작업 제목 표시 ✓
- [x] 4. 에러 처리: default empty array, 빈 description 대응, null-safe optional chaining
- [x] 5. 테스트: JS 구문 균형 검증 통과 (React CDN 컴포넌트로 단위 테스트 해당 없음)
- [x] 6. 발견 이슈 3건 모두 자체 해결

## 검증 결과
- JS 구문 균형 검증: utils.js BALANCED OK, App.js BALANCED OK
- API 데이터 확인: `/api/tasks` 응답에서 running task 4건 확인, task_id/description 필드 정상
- 대시보드 HTML 로딩: `curl http://100.76.130.39:8000/dashboard/` 정상 응답 (HTTP 200)
