Phase 2: 액션 아이템 + Google Docs 호환 복사 (#4)

* 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 본문 드래프트 추가

src/app/settings/page.tsx

@@ -0,0 +1,267 @@
+'use client'
+
+import Link from 'next/link'
+import { useEffect, useState } from 'react'
+import {
+  clearStoredApiKey,
+  getStoredApiKey,
+  maskApiKey,
+  setStoredApiKey,
+} from '@/lib/api-key-storage'
+
+type TestState =
+  | { status: 'idle' }
+  | { status: 'testing' }
+  | { status: 'success'; message: string; reply?: string }
+  | { status: 'failed'; message: string }
+
+export default function SettingsPage() {
+  const [storedKey, setStoredKey] = useState<string | null>(null)
+  const [draftKey, setDraftKey] = useState('')
+  const [showKey, setShowKey] = useState(false)
+  const [envConfigured, setEnvConfigured] = useState<boolean | null>(null)
+  const [testState, setTestState] = useState<TestState>({ status: 'idle' })
+  const [savedToast, setSavedToast] = useState(false)
+
+  useEffect(() => {
+    setStoredKey(getStoredApiKey())
+    fetch('/api/settings/status')
+      .then((r) => r.json())
+      .then((d) => setEnvConfigured(!!d.envConfigured))
+      .catch(() => setEnvConfigured(false))
+  }, [])
+
+  function handleSave() {
+    const trimmed = draftKey.trim()
+    if (!trimmed) return
+    setStoredApiKey(trimmed)
+    setStoredKey(trimmed)
+    setDraftKey('')
+    setSavedToast(true)
+    setTimeout(() => setSavedToast(false), 2000)
+  }
+
+  function handleClear() {
+    if (!confirm('브라우저에 저장된 키를 삭제할까요? 환경변수가 설정되어 있다면 그것을 사용합니다.')) {
+      return
+    }
+    clearStoredApiKey()
+    setStoredKey(null)
+    setTestState({ status: 'idle' })
+  }
+
+  async function handleTest() {
+    const keyToTest = draftKey.trim() || storedKey
+    if (!keyToTest) {
+      setTestState({ status: 'failed', message: '테스트할 키가 없습니다.' })
+      return
+    }
+
+    setTestState({ status: 'testing' })
+    try {
+      const res = await fetch('/api/settings/test', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ apiKey: keyToTest }),
+      })
+      const data = await res.json()
+      if (data.ok) {
+        setTestState({
+          status: 'success',
+          message: data.message,
+          reply: data.reply,
+        })
+      } else {
+        setTestState({ status: 'failed', message: data.error ?? '실패' })
+      }
+    } catch (err) {
+      setTestState({
+        status: 'failed',
+        message: err instanceof Error ? err.message : '네트워크 오류',
+      })
+    }
+  }
+
+  const activeSource = storedKey
+    ? '브라우저 (LocalStorage)'
+    : envConfigured
+      ? '환경변수 (서버)'
+      : '없음'
+
+  const activeBadgeStyle = storedKey
+    ? 'bg-purple-100 text-purple-700'
+    : envConfigured
+      ? 'bg-green-100 text-green-700'
+      : 'bg-red-100 text-red-700'
+
+  return (
+    <main className="flex-1 bg-gradient-to-b from-neutral-50 to-white">
+      <div className="mx-auto max-w-2xl px-6 py-12">
+        <div className="mb-8 flex items-center justify-between">
+          <Link
+            href="/"
+            className="text-sm text-neutral-500 hover:text-neutral-800 transition-colors"
+          >
+            ← 홈으로
+          </Link>
+          <Link
+            href="/meetings"
+            className="text-sm text-neutral-500 hover:text-neutral-800 transition-colors"
+          >
+            📚 저장된 회의록
+          </Link>
+        </div>
+
+        <header className="mb-8">
+          <h1 className="text-3xl font-bold tracking-tight text-neutral-900">
+            ⚙️ 설정
+          </h1>
+          <p className="mt-2 text-sm text-neutral-500">
+            Gemini API 키를 브라우저에 저장합니다. 키는 서버에 저장되지 않으며,
+            요청 시점에만 전송되어 사용됩니다.
+          </p>
+        </header>
+
+        <section className="mb-6 rounded-2xl border border-neutral-200 bg-white p-6">
+          <div className="mb-4 flex items-center justify-between">
+            <h2 className="text-base font-semibold text-neutral-800">
+              현재 키 소스
+            </h2>
+            <span
+              className={`text-xs px-2.5 py-1 rounded-full font-medium ${activeBadgeStyle}`}
+            >
+              {activeSource}
+            </span>
+          </div>
+
+          <div className="space-y-1 text-sm text-neutral-600">
+            <p>
+              <span className="inline-block w-32 text-neutral-500">브라우저 키:</span>{' '}
+              {storedKey ? (
+                <span className="font-mono">{maskApiKey(storedKey)}</span>
+              ) : (
+                <span className="text-neutral-400">미설정</span>
+              )}
+            </p>
+            <p>
+              <span className="inline-block w-32 text-neutral-500">환경변수 키:</span>{' '}
+              {envConfigured === null ? (
+                <span className="text-neutral-400">확인 중...</span>
+              ) : envConfigured ? (
+                <span className="text-green-700">설정됨</span>
+              ) : (
+                <span className="text-neutral-400">미설정</span>
+              )}
+            </p>
+          </div>
+
+          <p className="mt-3 text-xs text-neutral-500">
+            💡 우선순위: 브라우저 키 → 환경변수 → 단순 변환 폴백
+          </p>
+        </section>
+
+        <section className="mb-6 rounded-2xl border border-neutral-200 bg-white p-6">
+          <h2 className="mb-4 text-base font-semibold text-neutral-800">
+            Gemini API 키
+          </h2>
+
+          <label className="block mb-2 text-sm text-neutral-600">
+            새 키 입력
+          </label>
+          <div className="flex gap-2">
+            <input
+              type={showKey ? 'text' : 'password'}
+              value={draftKey}
+              onChange={(e) => setDraftKey(e.target.value)}
+              placeholder="AIzaSy..."
+              className="flex-1 rounded-xl border border-neutral-300 px-4 py-3 font-mono text-sm focus:border-purple-400 focus:outline-none focus:ring-2 focus:ring-purple-100 transition-all"
+            />
+            <button
+              onClick={() => setShowKey((v) => !v)}
+              className="rounded-xl border border-neutral-300 px-3 text-sm hover:bg-neutral-50 transition-colors"
+              title={showKey ? '숨기기' : '보이기'}
+            >
+              {showKey ? '🙈' : '👁️'}
+            </button>
+          </div>
+
+          <p className="mt-2 text-xs text-neutral-500">
+            <a
+              href="https://aistudio.google.com/apikey"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="underline hover:text-purple-600"
+            >
+              Google AI Studio
+            </a>
+            에서 무료로 발급할 수 있습니다.
+          </p>
+
+          <div className="mt-4 flex flex-wrap gap-2">
+            <button
+              onClick={handleSave}
+              disabled={!draftKey.trim()}
+              className="rounded-lg bg-purple-600 px-4 py-2 text-sm font-medium text-white hover:bg-purple-700 disabled:opacity-50 transition-colors"
+            >
+              💾 저장
+            </button>
+            <button
+              onClick={handleTest}
+              disabled={
+                testState.status === 'testing' ||
+                (!draftKey.trim() && !storedKey)
+              }
+              className="rounded-lg border border-purple-300 bg-purple-50 px-4 py-2 text-sm font-medium text-purple-700 hover:bg-purple-100 disabled:opacity-50 transition-colors"
+            >
+              {testState.status === 'testing' ? '테스트 중...' : '🧪 테스트 호출'}
+            </button>
+            {storedKey && (
+              <button
+                onClick={handleClear}
+                className="rounded-lg border border-red-200 bg-red-50 px-4 py-2 text-sm font-medium text-red-700 hover:bg-red-100 transition-colors"
+              >
+                🗑️ 삭제
+              </button>
+            )}
+          </div>
+
+          {savedToast && (
+            <div className="mt-4 rounded-lg border border-purple-200 bg-purple-50 px-3 py-2 text-sm text-purple-700">
+              ✓ 브라우저에 저장되었습니다.
+            </div>
+          )}
+
+          {testState.status === 'success' && (
+            <div className="mt-4 rounded-lg border border-green-200 bg-green-50 px-3 py-2 text-sm text-green-700">
+              <strong>✓ {testState.message}</strong>
+              {testState.reply && (
+                <p className="mt-1 font-mono text-xs text-green-600">
+                  Gemini 응답: {testState.reply}
+                </p>
+              )}
+            </div>
+          )}
+
+          {testState.status === 'failed' && (
+            <div className="mt-4 rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700">
+              ✗ {testState.message}
+            </div>
+          )}
+        </section>
+
+        <section className="rounded-2xl border border-neutral-200 bg-neutral-50 p-5">
+          <h3 className="mb-2 text-sm font-semibold text-neutral-700">
+            보안 안내
+          </h3>
+          <ul className="space-y-1 text-xs text-neutral-600 list-disc list-inside">
+            <li>키는 이 브라우저의 LocalStorage에만 저장됩니다 (서버 DB에 저장되지 않음).</li>
+            <li>요약 요청 시 body로 함께 전송되어 일회성으로 사용됩니다.</li>
+            <li>다른 브라우저/기기에서는 다시 입력해야 합니다.</li>
+            <li>시크릿 모드 종료, 캐시 삭제 시 사라집니다.</li>
+            <li>HTTPS 환경에서 사용하는 것을 권장합니다 (현재 localhost는 예외).</li>
+          </ul>
+        </section>
+      </div>
+    </main>
+  )
+}