mirror of
https://github.com/nad4-su/meeting-minutes.git
synced 2026-08-12 22:33:25 +09:00
nad4andGitHub
908cc860e8
* feat(phase-1): 저장/목록/상세 UI + 마크다운 라이브러리 + 검색 ROADMAP Phase 1 #3~#7 완료. ## Markdown 렌더링 (#6) - marked + isomorphic-dompurify 도입 - src/lib/markdown.ts 공용 유틸 (renderMarkdownToSafeHtml + markdownToPlainText) - 기존 커스텀 파서(export-minutes.ts) 교체 — 표/리스트/인용/코드블록 정상 렌더 - globals.css에 .prose-minutes 스타일 추가 ## 저장 버튼 (#3) - MinutesViewer에 📌 저장 버튼 + 상태별 피드백 - 미리보기/원문 토글 - 저장 성공 시 /meetings/[id] 상세 링크 배너 - URL.revokeObjectURL 타이밍을 setTimeout으로 지연 (Firefox/Safari 호환) ## 목록 페이지 (#4) - /meetings 서버 컴포넌트, 페이지네이션 (prev/next) - MeetingCard: 제목/날짜/템플릿 배지/참석자/태그/preview - 빈 상태 UI (검색 결과 없음 / 첫 녹음 안내) - preview는 markdown → plain text 변환 후 160자로 자르기 ## 상세 페이지 + 편집 (#5) - /meetings/[id] 서버 컴포넌트 + 클라이언트 편집 island - 제목/본문/참석자/태그 인라인 편집 - 편집 모드에서 좌(textarea) · 우(live preview) 분할 - 삭제 버튼 (confirm) - 원본 transcript는 <details>로 접어둠 ## 검색 (#7) - MeetingSearchBar 클라이언트 컴포넌트 - 300ms debounce + useTransition + URL query 동기화 (replace, scroll false) - 서버에서 ILIKE contains로 title/transcript/markdown 검색 - tsvector GIN 인덱스는 후속 최적화로 분리 (개인용 규모에서 ILIKE 충분) ## Prisma 7 호환 - @prisma/adapter-pg + pg 추가 (driver adapter 필수) - generator를 prisma-client-js로 전환 (안정적 레거시) - src/lib/db.ts에 PrismaPg 어댑터 사용 + DATABASE_URL 누락 시 placeholder로 fallback - DB 접근 페이지/라우트에 export const dynamic = 'force-dynamic' 추가 (Next 16 pre-render 시 Prisma 초기화 회피) - Dockerfile에서 src/generated 복사 제거, .gitignore도 정리 ## UX - 메인 페이지 우상단 "📚 저장된 회의록" 링크 추가 ## 테스트 - src/__tests__/markdown.test.ts 9개 신규 (렌더/sanitize/plain text) - 전체: 80 tests passing (이전 71 + 9) * docs: PR#2 본문 드래프트 추가 * feat(phase-1.5): 웹에서 Gemini API 키 설정 (LocalStorage) .env를 만지지 않고도 브라우저에서 키를 설정·관리할 수 있게 함. 개인용 단일 인스턴스 가정으로 LocalStorage만 사용 (DB 미관여). ## 구조 - src/lib/api-keys.ts (서버): resolveGeminiApiKey() 우선순위 요청 body 키 → process.env.GEMINI_API_KEY → null - src/lib/api-key-storage.ts (클라이언트): get/set/clear/maskApiKey - /api/settings/status: 환경변수 키 존재 여부만 노출 (값 X) - /api/settings/test: 키로 짧은 Gemini 호출 → 200/401/403/429 분류 - /settings 페이지: 입력/저장/삭제/마스킹 표시/테스트 호출 ## 라우트 변경 - /api/summarize, /api/summarize-live가 body.apiKey 수용 - 키 없을 때 summarize는 단순 변환으로 폴백 (UX 보존) - summarize-live는 503 + 안내 메시지 (라이브 요약은 키 필수) ## UI - 메인 헤더에 ⚙️ 설정 링크 추가 - 설정 페이지에 현재 키 소스 배지 (브라우저 / 환경변수 / 없음) - 보이기/숨기기 토글, 테스트 호출 버튼, 보안 안내 ## 테스트 - api-keys.test.ts: 7개 (요청>env, 공백 처리, env 미설정 시 null) - api-key-storage.test.ts: 7개 (LocalStorage CRUD + 마스킹) - 전체: 94 tests (이전 80 + 14) ## 비목표 (개인용 가정) - 다중 사용자 / 권한 - DB 영속화 / 키 암호화 * docs: PR#3 본문 드래프트 추가 * feat(phase-2): 액션 아이템 추출/체크리스트 + Google Docs 호환 복사 ## 액션 아이템 (ROADMAP #8~#11) ROADMAP의 Gemini JSON 출력 대신 마크다운 체크박스 휴리스틱 채택. 모든 템플릿이 이미 - [ ] 형식 출력하므로 Gemini 호출 비용 0. ### Schema - ActionItem 테이블 추가 (Meeting 1:N, cascade delete) - 필드: id, meetingId, task, isDone, position, createdAt, updatedAt - 인덱스: (meetingId, position) / isDone - 마이그레이션 20260428071709_add_action_items ### 추출 (src/lib/action-items.ts) - /^\s*[-*]\s+\[(x|X|\s)\]\s+(.+)/ 매칭 - 빈/짧은(<2자)/점만(...) task 노이즈 제거 - 들여쓰기/대문자 X 모두 허용 - 단위 테스트 8개 ### API - POST /api/meetings: 마크다운에서 액션 아이템 자동 추출 후 함께 저장 - GET /api/meetings (목록): _count로 미완료 액션 카운트 포함 - GET /api/meetings/[id] (상세): actionItems include - PATCH /api/action-items/[id]: isDone 토글, task 수정 - DELETE /api/action-items/[id] - POST /api/meetings/[id]/reparse-action-items: 마크다운 재파싱으로 교체 ### UI - ActionItemList 컴포넌트: 체크박스 + 낙관적 업데이트 + 진행률(완료/전체) + 개별 삭제 (hover ✕) + 🔄 재추출 버튼 - MeetingDetail에 통합 (조회 모드에서만 노출, 편집 중에는 숨김) - MeetingCard에 미완료 카운트 배지 (✅ N 미완료) - /meetings 상단에 "내 미완료 액션 (최근 5)" 위젯 ### 비목표 (이번 단계) - assignee/dueDate 필드 — Gemini JSON 모드 도입 시 추가 - 홈 페이지 대시보드 승격 — 녹음 흐름 보존이 우선 ## Google Docs 호환 복사 - src/lib/markdown.ts: copyMarkdownAsRichText() - ClipboardItem({text/html, text/plain}) 우선 - 미지원 브라우저는 contenteditable + execCommand 폴백 - MinutesViewer / MeetingDetail에 📋 Docs용 버튼 추가 - 기존 .md 복사는 📋 .md로 분리 라벨링 - 다운로드 버튼은 ⬇ 접두로 구분 ## 테스트 - action-items.test.ts: 8개 (다양한 마크다운 패턴) - 전체: 102 tests passing (이전 94 + 8) * docs: PR#4 본문 드래프트 추가
109 lines
4.2 KiB
Markdown
109 lines
4.2 KiB
Markdown
# Phase 2 — 액션 아이템 추출/체크리스트 + Google Docs 호환 복사
|
|
|
|
ROADMAP Phase 2 (#8~#11) + 사용자 추가 요청.
|
|
|
|
## Base
|
|
- 🧱 **Base**: `feat/web-api-key-settings` (PR #3 위에 스택)
|
|
|
|
## 설계 결정 — 휴리스틱 vs Gemini JSON
|
|
|
|
ROADMAP은 Gemini JSON 출력 + zod 검증을 명시했지만 **마크다운 체크박스 휴리스틱**으로 갈음:
|
|
|
|
| 방식 | 장점 | 단점 |
|
|
|---|---|---|
|
|
| **휴리스틱 (채택)** | Gemini 호출 0, 모든 템플릿 호환, 즉시 동작 | assignee/dueDate 미추출 |
|
|
| Gemini JSON | 구조화된 출력, 정확한 메타 | 호출 추가, 프롬프트 재작성, zod 검증 |
|
|
|
|
후속에 정확도 부족 체감 시 JSON 모드로 업그레이드 가능 (테이블 스키마는 이미 확장 가능).
|
|
|
|
## 변경
|
|
|
|
### 신규 파일
|
|
- `prisma/migrations/20260428071709_add_action_items/`
|
|
- `src/lib/action-items.ts` — `parseActionItems(markdown)`
|
|
- `src/app/api/action-items/[id]/route.ts` — PATCH/DELETE
|
|
- `src/app/api/meetings/[id]/reparse-action-items/route.ts` — POST
|
|
- `src/components/meeting/ActionItemList.tsx` — 체크리스트 UI
|
|
- `src/__tests__/action-items.test.ts` — 8 tests
|
|
|
|
### 수정
|
|
- `prisma/schema.prisma` — ActionItem 모델
|
|
- `src/app/api/meetings/route.ts` — POST 시 자동 추출, GET에 미완료 카운트
|
|
- `src/app/api/meetings/[id]/route.ts` — actionItems include
|
|
- `src/app/meetings/page.tsx` — 미완료 위젯 (최근 5)
|
|
- `src/app/meetings/[id]/page.tsx` — actionItems 전달
|
|
- `src/components/meeting/MeetingCard.tsx` — 미완료 배지
|
|
- `src/components/meeting/MeetingDetail.tsx` — ActionItemList 통합 + 📋 Docs용 버튼
|
|
- `src/components/minutes/MinutesViewer.tsx` — 📋 Docs용 버튼
|
|
- `src/lib/markdown.ts` — `copyMarkdownAsRichText()` 추가
|
|
|
|
## API 시그니처
|
|
|
|
```http
|
|
POST /api/meetings
|
|
{ title, markdownMinutes, ... }
|
|
→ 201 { ...meeting, actionItems: [{ id, task, isDone, position }] }
|
|
|
|
PATCH /api/action-items/[id]
|
|
{ isDone?: boolean, task?: string }
|
|
→ 200 { ...item }
|
|
|
|
DELETE /api/action-items/[id]
|
|
→ 204
|
|
|
|
POST /api/meetings/[id]/reparse-action-items
|
|
→ 200 { actionItems: [...], replaced: N }
|
|
```
|
|
|
|
## UX 흐름
|
|
|
|
1. 회의록 생성 → `📌 저장` → 마크다운의 `- [ ]` 자동 추출
|
|
2. `/meetings/[id]` 상세 → 본문 아래 ✅ **액션 아이템** 섹션
|
|
3. 체크박스 클릭 (낙관적 업데이트, 서버 PATCH)
|
|
4. 본문 편집 후 새 항목 추가 시 → `🔄 재추출` 버튼으로 동기화
|
|
⚠️ 재추출은 토글 상태를 모두 초기화 (confirm 표시)
|
|
5. `/meetings` 상단에서 "내 미완료 액션 (최근 5)" 한눈에 파악
|
|
|
|
## Google Docs 복사 (사용자 추가 요청)
|
|
|
|
`copyMarkdownAsRichText(markdown)`:
|
|
- 1차: `navigator.clipboard.write([new ClipboardItem({ 'text/html', 'text/plain' })])` (모던 브라우저)
|
|
- 폴백: 임시 contenteditable + `document.execCommand('copy')`
|
|
|
|
→ Google Docs / Word / Notion에 붙여넣으면 **헤딩/리스트/굵게/코드/표 서식 유지**.
|
|
|
|
버튼 라벨링 정리:
|
|
- `📋 .md` — 마크다운 원문 복사
|
|
- `📋 Docs용` — 서식 유지 복사 (파랑색 강조)
|
|
- `⬇ .md` / `⬇ .html` — 파일 다운로드
|
|
|
|
## 테스트
|
|
- 102 tests passing (이전 94 + 8 action-items)
|
|
|
|
## 확인 방법
|
|
|
|
```bash
|
|
# 마이그레이션 적용 (action_items 테이블 추가)
|
|
docker compose --profile tools run --rm migrate
|
|
|
|
# 빌드 + 기동
|
|
docker compose up -d --build app
|
|
```
|
|
|
|
체크 시나리오:
|
|
1. 회의 녹음 → 마크다운에 `- [ ] 항목` 자동 포함된 상태로 생성
|
|
2. 📌 저장 → /meetings/[id] 이동
|
|
3. 체크박스 토글 → 진행률 변화, 새로고침해도 유지
|
|
4. 본문 편집 → `- [ ] 새 항목` 추가 → 저장 → 🔄 재추출 → 새 항목 등장
|
|
5. 📋 Docs용 → Google Docs에 붙여넣어 서식 확인
|
|
6. /meetings → 카드 배지 + 상단 위젯 노출 확인
|
|
|
|
## Breaking changes
|
|
- 마이그레이션 필요 (`action_items` 테이블)
|
|
- 기존 회의록은 액션 아이템이 비어있음 — 상세에서 🔄 재추출 한 번 누르면 채워짐
|
|
|
|
## 후속 (이 PR 범위 아님)
|
|
- Gemini JSON 출력 모드 (assignee/dueDate 정확 추출)
|
|
- 홈 페이지를 대시보드로 승격
|
|
- 액션 아이템 직접 추가 (체크리스트 UI에서 +)
|