remove ui tests, keep api tests only

CLAUDE.md

@@ -24,11 +24,7 @@ npm run build:ci               # Build + integration tests
 npm start                      # Start production server
 
 # Testing
-npm run test:api               # Run API tests only (Playwright)
-npm run test:ui                # Run UI tests only (Playwright)
-npm run test:e2e               # Run all E2E tests (API + UI)
-npm run test:e2e:headed        # Run E2E tests with visible browser
-npm run test:e2e:ui            # Run E2E tests in interactive UI mode
+npm run test:api               # Run API tests (Playwright)
 
 # Linting
 npm run lint                   # Run ESLint
@@ -237,7 +233,7 @@ TypeScript paths configured in `tsconfig.json`:
 
 **Fail-fast testing approach:**
 When running tests to verify features, use a fail-fast approach to save time:
-1. Start the test suite (`npm run test:e2e`)
+1. Start the test suite (`npm run test:api`)
 2. As soon as the first test failure appears, **stop the test run immediately**
 3. Investigate and fix the root cause of that failure
 4. Re-run tests to verify the fix
@@ -245,38 +241,6 @@ When running tests to verify features, use a fail-fast approach to save time:
 
 **Rationale:** If there's a fundamental issue (e.g., server not starting, auth broken, missing dependency), continuing to run all tests just wastes time and produces misleading failure cascades. Failing fast, fixing the root cause, then re-running is far more efficient.
 
-**Test Environment Cleanup:**
-⚠️ **CRITICAL**: Before running the full E2E test suite, always ensure a clean environment to avoid false test failures:
-
-1. **Kill all background processes:**
-   ```bash
-   pkill -f "npm run dev" || true
-   pkill -f "playwright test" || true
-   lsof -ti:3000 | xargs kill -9 2>/dev/null || true
-   ```
-
-2. **Clean database state:**
-   ```bash
-   rm -f ./data/app.db
-   ```
-
-3. **Run tests:**
-   ```bash
-   npm run test:e2e
-   ```
-
-**Why this matters:**
-- Multiple concurrent dev servers or test processes cause port conflicts and resource contention
-- Stale database entries from previous test runs can cause validation failures
-- Test data accumulation leads to incorrect test counts and failures
-- This issue has occurred multiple times and can cause 6+ spurious test failures
-
-**Symptoms of dirty environment:**
-- Database seed verification fails (expected 13 prompts, got 15+)
-- Tests pass individually but fail when run in suite
-- Random timeouts or port binding errors
-- Inconsistent test results between runs
-
 ### Testing Philosophy: NEVER Ignore Test Failures
 
 **⚠️ CRITICAL PRINCIPLE: Failed tests are YOUR responsibility until proven otherwise.**
@@ -291,8 +255,8 @@ When tests fail after making changes:
 **Bad Practice (What NOT to do):**
 ```
 ❌ "These look like flaky tests, probably unrelated to my changes"
-❌ "UI tests are timing out, must be a pre-existing issue"
-❌ "Only backend tests matter, UI failures can be ignored"
+❌ "Tests are timing out, must be a pre-existing issue"
+❌ "Only some tests matter, other failures can be ignored"
 ```
 
 **Good Practice (What to do):**
@@ -304,13 +268,6 @@ When tests fail after making changes:
 ✅ Only conclude "pre-existing" after finding evidence (e.g., git commit that broke tests)
 ```
 
-**Real Example from This Codebase:**
-Database concurrency changes passed all 58 API tests but failed 13 UI tests. Instead of assuming "unrelated flaky tests", investigation revealed:
-- Commit `a4c0cfb` (Oct 20) changed dashboard titles "諮詢教練" → "教練回顧"
-- Tests weren't updated in that commit
-- Failures were pre-existing, BUT required investigation to confirm
-- Proper fix: Update tests to match current UI + document investigation process
-
 **Key Takeaway:** Time spent investigating is NEVER wasted - it either finds bugs you introduced, or reveals technical debt to fix.
 
 ### Testing Philosophy: Intention is Critical
@@ -378,10 +335,6 @@ Choose proper design over quick fixes. Database abstractions exist for a reason
    - Each route.ts exports HTTP method functions (GET, POST, etc.)
    - Request/response use Web standard Request/Response objects
 
-5. **Model Context Protocol (MCP):**
-   - Configured in `.mcp.json` for Playwright browser automation
-   - Enables UI testing capabilities within Claude Code
-
 ## Development Workflow
 
 1. **Create new student personality:**
@@ -402,13 +355,13 @@ Choose proper design over quick fixes. Database abstractions exist for a reason
 
 4. **Remove or deprecate student personality:**
    - See "Student Template Management" section for safe removal process
-   - Run `npm run test:e2e` to verify graceful degradation
+   - Run `npm run test:api` to verify graceful degradation
    - Monitor logs for conversations using removed templates
 
 5. **Test changes:**
    - Run `npm run test:basic` for quick validation
    - Run `npm run test` for full test suite
-   - Run `npm run test:e2e` for end-to-end tests with real LLM
+   - Run `npm run test:api` for API tests with real LLM
 
 ## Student Template Management
 
@@ -440,7 +393,7 @@ Student personality templates are defined in `src/lib/prompts/student-prompts.ts
 
 3. **Test Before Removal**: Run the test suite to verify graceful degradation
    ```bash
-   npm run test:e2e  # Includes removed-template-handling.spec.ts
+   npm run test:api  # Includes removed-template-handling.api.spec.ts
    ```
 
 4. **Remove Template**: Delete the entry from `studentPrompts` in `student-prompts.ts`
@@ -475,7 +428,7 @@ Student personality templates are defined in `src/lib/prompts/student-prompts.ts
 2. Follow existing template structure (systemPrompt, name, description, tools)
 3. Test creation and messaging:
    ```bash
-   npm run test:e2e
+   npm run test:api
    ```
 4. Document the new personality in README.md
 
@@ -486,33 +439,23 @@ Conversations created before the `systemPrompt` storage feature (if any) will:
 2. Fail if template is removed
 3. **Recommended**: Manually migrate old conversations by regenerating and storing prompts
 
-## End-to-End Testing (Playwright + Real LLM)
+## End-to-End Testing (Playwright API Tests)
 
 **One-time setup:**
 ```bash
 export CZ_OPENAI_API_KEY=your-key
 export MODEL_NAME=gpt-5
-npx playwright install --with-deps
 ```
 
 **Run tests:**
 ```bash
-npm run test:e2e          # headless mode (default, fastest) - for verification
-npm run test:e2e:headed   # headed mode (watch browser) - for debugging
-npm run test:e2e:ui       # interactive test UI - for development
+npm run test:api          # Run API tests
 ```
 
-**Headless vs Headed:**
-- **Always use headless mode** (`npm run test:e2e`) for verification and CI/CD
-- Headless is faster (no UI rendering), uses less resources, and is the standard for automated testing
-- Only use headed mode (`npm run test:e2e:headed`) when debugging a specific test failure
-- Only use UI mode (`npm run test:e2e:ui`) when developing new tests interactively
-
 **CI setup (summary):**
 - Add `CZ_OPENAI_API_KEY` (and optionally `MODEL_NAME`) to job env
 - `npm ci`
-- `npx playwright install --with-deps`
-- `npm run test:e2e`
+- `npm run test:api`
 
 **Troubleshooting:**
 - **Agents list not empty**: remove local state under `./data` (and optionally `/tmp/ai-sdk-agents.json` if you previously used legacy flows)
@@ -520,4 +463,3 @@ npm run test:e2e:ui       # interactive test UI - for development
 - **LLM 401/429**: verify key and model access; tests run with `workers: 1` to avoid rate limits
 - **Timeouts**: allow 60–90s for LLM responses
 - **Port 3000 in use**: stop the other server, or set `reuseExistingServer=false` temporarily
-- **Missing browsers**: rerun `npx playwright install --with-deps`

README.md

@@ -104,14 +104,8 @@ The project uses Playwright for end-to-end testing with separate test suites for
 ### Running Tests
 
 ```bash
-# Run only API tests (fastest - for quick verification)
+# Run API tests
 npm run test:api
-
-# Run only UI tests (when testing browser interactions)
-npm run test:ui
-
-# Run all tests (API + UI)
-npm run test:e2e
 ```
 
 ### Test Files
@@ -133,14 +127,12 @@ Example API tests:
 3. Catches most issues without browser overhead
 
 **Before committing:**
-1. Run `npm run test:e2e` to verify both API and UI
+1. Run `npm run test:api` to verify all API functionality
 2. Ensures complete system integration
-3. Tests real user flows with browser interactions
+3. Tests real conversation flows with LLM
 
-**Speed comparison:**
-- API tests only: ~10-20 seconds ⚡
-- UI tests only: ~60-90 seconds 🐢
-- All tests: ~70-110 seconds
+**Speed:**
+- API tests: ~10-20 seconds ⚡
 
 ### Configuration
 
@@ -372,7 +364,7 @@ To change AI behavior, edit prompts in `src/lib/prompts/`:
 When removing a student personality template:
 - ✅ **Existing conversations continue working** - System prompts are stored with each conversation during creation
 - ❌ **New conversations are blocked** - Validation prevents creating conversations with removed templates
-- ⚠️ **Test before removing** - Run `npm run test:e2e` to verify graceful degradation
+- ⚠️ **Test before removing** - Run `npm run test:api` to verify graceful degradation
 - See `CLAUDE.md` "Student Template Management" section for detailed removal process and migration guidance
 
 ### Research Foundation

TODO.md

@@ -1,212 +0,0 @@
-# TODO: Remove studentName and coachName Fields
-
-This document tracks the progress of removing redundant `studentName` and `coachName` fields from the database and deriving them from prompt templates instead.
-
-## Context
-
-Previously, these fields were stored in the database for quick display, but they can be derived from static template configurations (`student-prompts.ts` and `coach-prompts.ts`). This change:
-- Reduces data redundancy
-- Ensures names always match the source of truth (prompt templates)
-- Simplifies the database schema
-
-## Progress
-
-### ✅ Completed Tasks
-
-- [x] **Database Schema** - Removed `student_name` and `coach_name` columns from `src/lib/db/schema.sql`
-- [x] **TypeScript Models** - Removed fields from `Conversation` interface in `src/lib/types/models.ts`
-- [x] **Repository Methods** - Updated `ConversationRepository.createConversation()` to remove name parameters
-- [x] **API Routes** - Updated 6 routes to derive names from templates:
-  - [x] `src/app/api/conversations/create/route.ts` (lines 51-93)
-  - [x] `src/app/api/conversations/[conversationId]/branch/route.ts` (lines 52-95)
-  - [x] `src/app/api/conversations/route.ts` (lines 17-49)
-  - [x] `src/app/api/conversations/[conversationId]/route.ts` (lines 32-115)
-  - [x] `src/app/api/stats/route.ts` (lines 39-56)
-  - [x] `src/app/api/conversations/[conversationId]/generate-coach-summary/route.ts` (lines 55-62)
-- [x] **Verify Script** - Updated `scripts/verify-backend.sh` to use `grade_3` instead of deprecated `adhd_inattentive`
-- [x] **Database Cleanup** - Deleted old database and cleared Next.js cache
-
-### ✅ Completed Verification
-
-- [x] **Run Backend Verification**
-  ```bash
-  ./scripts/verify-backend.sh
-  ```
-  - ✅ All API endpoints return 200/201 with correct data
-  - ✅ Conversation responses include derived `studentName` and `coachName`
-  - ✅ Backend verification passing 100%
-
-- [x] **Fixed Database Schema**
-  - Updated inline schema in `src/lib/db/index.ts` to use `student_prompt_id` and `coach_prompt_id`
-  - Removed old `student_name`, `coach_name`, `student_personality`, `coach_id` columns
-  - Database recreated with correct schema
-
-- [x] **Fixed E2E Test Selectors**
-  - Updated 11 test files to use current dashboard UI text
-  - Changed selector from `h3:has-text("新對話")` to `h3:has-text("指定對話演練")`
-  - Tests now properly find dashboard action buttons
-
-- [ ] **Run E2E Tests** (Currently running)
-  ```bash
-  npm run test:e2e
-  ```
-  - Expected: All 105 tests should pass
-  - Status: Running full suite after fixes
-
-### ❓ Potential Issues to Investigate
-
-- [ ] **Frontend Components** - Verify these components work correctly:
-  - `src/app/dashboard/page.tsx` - Uses `conv.studentName` and `conv.coachName` (lines 224, 499, 521, 525, 527)
-  - `src/app/conversation/[id]/page.tsx` - Uses `conversation.studentName` and `conversation.coachName` (lines 318, 321, 500, 670)
-  - **Status**: Should work fine since API responses include derived names via spread operator
-  - **Action**: Test manually by creating conversations and checking UI displays correct names
-
-- [ ] **API Type Definitions** - Check if `src/lib/types/api.ts` needs updates:
-  - **Action**: Review ConversationResponse types to ensure they match actual API responses
-  - **Note**: API responses include `studentName` and `coachName` via spread operator, so type definitions might be okay
-
-- [ ] **E2E Test Fixes** - If tests fail, check for:
-  - Tests that directly query database for `studentName`/`coachName`
-  - Tests that create conversations with old API format
-  - Tests using deprecated `adhd_inattentive` personality ID
-  - **Action**: Search codebase for any remaining references:
-    ```bash
-    grep -r "adhd_inattentive" tests/
-    grep -r "student_name\|studentName" tests/ --include="*.ts"
-    grep -r "coach_name\|coachName" tests/ --include="*.ts"
-    ```
-
-### 📝 Documentation Updates Needed
-
-- [ ] **Update API Documentation** (`docs/backend-doc/`)
-  - [ ] Review all docs to ensure no references to storing studentName/coachName
-  - [ ] Add note explaining names are derived from templates
-  - [ ] Update example responses to show names are included but not stored
-
-- [ ] **Update README.md**
-  - [ ] Document the template-based naming system
-  - [ ] Explain that names come from `student-prompts.ts` and `coach-prompts.ts`
-
-- [ ] **Update CLAUDE.md**
-  - [ ] Update "Student Template Management" section if needed
-  - [ ] Add note about derived names in API responses
-
-- [ ] **OpenAPI Spec** (`docs/openapi.yaml` and `public/docs/openapi.yaml`)
-  - [ ] Update Conversation schema to mark studentName/coachName as "derived" in description
-  - [ ] Clarify they're not stored in database but returned in API responses
-
-## Testing Checklist
-
-### Backend API Testing
-
-Run verification script:
-```bash
-./scripts/verify-backend.sh
-```
-
-Expected results:
-- ✅ All endpoints return 200/201/400 as expected
-- ✅ Created conversations include `studentName` and `coachName` in response
-- ✅ Conversation list shows correct names for each conversation
-- ✅ Stats endpoint shows correct student names
-
-### Manual UI Testing
-
-1. **Create New Conversation**
-   - Navigate to dashboard
-   - Click "新對話" (New Conversation)
-   - Select a student personality (e.g., 小三學生)
-   - Select a coach (e.g., 陳老師)
-   - Verify conversation card shows correct student and coach names
-
-2. **View Conversation**
-   - Open a conversation
-   - Verify header shows correct student and coach names
-   - Verify messages show correct speaker names/avatars
-
-3. **Branch Conversation**
-   - Open a conversation with messages
-   - Click branch button on a message
-   - Verify branched conversation shows correct names
-
-4. **Coach Direct Chat**
-   - Navigate to "諮詢教練" page
-   - Create coach-direct conversation
-   - Verify it shows "直接教練對話" as student name
-   - Verify it shows correct coach name
-
-### E2E Test Suite
-
-Run full test suite:
-```bash
-npm run test:e2e
-```
-
-Expected: All 105 tests pass
-
-If tests fail:
-1. Check error messages for database schema mismatches
-2. Look for tests expecting studentName/coachName in database
-3. Fix tests to expect derived names in API responses instead
-
-## Rollback Plan (If Needed)
-
-If critical issues are found:
-
-1. **Revert Database Schema**
-   ```sql
-   ALTER TABLE conversations ADD COLUMN student_name TEXT NOT NULL DEFAULT '';
-   ALTER TABLE conversations ADD COLUMN coach_name TEXT NOT NULL DEFAULT '';
-   ```
-
-2. **Revert TypeScript Models** - Add fields back to `Conversation` interface
-
-3. **Revert Repository Methods** - Add name parameters back to `createConversation()`
-
-4. **Revert API Routes** - Remove derivation logic, use stored names
-
-5. **Git Revert**
-   ```bash
-   git log --oneline  # Find commit hash
-   git revert <commit-hash>
-   ```
-
-## Success Criteria
-
-The implementation is complete when:
-
-- ✅ Backend verification script passes 100%
-- ✅ All E2E tests pass (105/105)
-- ✅ Manual UI testing shows correct names everywhere
-- ✅ No database references to student_name or coach_name remain
-- ✅ Documentation is updated
-- ✅ Code review confirms all API responses include derived names
-
-## Notes
-
-- **Database Migration**: No data migration needed - just delete old database and let it recreate
-- **API Compatibility**: API responses still include `studentName` and `coachName`, so frontend doesn't need changes
-- **Template Removal**: System gracefully handles removed templates by using stored `systemPrompt` field
-- **Performance**: Deriving names on-the-fly has negligible performance impact (simple object lookup)
-
-## Related Files
-
-**Modified Files:**
-- `src/lib/db/schema.sql`
-- `src/lib/types/models.ts`
-- `src/lib/repositories/conversation-repository.ts`
-- `src/app/api/conversations/create/route.ts`
-- `src/app/api/conversations/[conversationId]/branch/route.ts`
-- `src/app/api/conversations/route.ts`
-- `src/app/api/conversations/[conversationId]/route.ts`
-- `src/app/api/stats/route.ts`
-- `src/app/api/conversations/[conversationId]/generate-coach-summary/route.ts`
-- `scripts/verify-backend.sh`
-
-**Files Using Derived Names (Frontend):**
-- `src/app/dashboard/page.tsx`
-- `src/app/conversation/[id]/page.tsx`
-
-**Source of Truth:**
-- `src/lib/prompts/student-prompts.ts` - Student names and descriptions
-- `src/lib/prompts/coach-prompts.ts` - Coach names and descriptions

docs/PROMPT_MANAGEMENT_DESIGN.md

@@ -959,8 +959,8 @@ If critical issues arise during deployment:
 ### Next Steps for Deployment
 
 1. Restart development server
-2. Run E2E tests: `npm run test:e2e`
-3. Verify all 23 new E2E tests pass
+2. Run API tests: `npm run test:api`
+3. Verify all tests pass
 4. Build Docker image: `docker build -t sel-chat-coach .`
 5. Test Docker container locally
 6. Deploy to staging

docs/backend-doc/12-database-integration.md

@@ -1113,7 +1113,7 @@ rm -f ./data/app.db  # SQLite
 # Or truncate tables in Supabase
 
 # Run tests
-npm run test:e2e
+npm run test:api
 ```
 
 ---
@@ -1317,10 +1317,10 @@ npm run dev
 2. **Test with both providers before deploying:**
    ```bash
    # Test SQLite
-   DATABASE_PROVIDER=sqlite npm run test:e2e
+   DATABASE_PROVIDER=sqlite npm run test:api
 
    # Test Supabase (separate test project)
-   DATABASE_PROVIDER=supabase npm run test:e2e
+   DATABASE_PROVIDER=supabase npm run test:api
    ```
 
 3. **Use Supabase for production:**

package.json

@@ -9,10 +9,6 @@
     "lint": "eslint",
     "db:seed": "tsx src/scripts/seed-prompts.ts",
     "test:api": "playwright test --project=api",
-    "test:ui": "playwright test --project=ui",
-    "test:e2e": "playwright test",
-    "test:e2e:headed": "playwright test --headed",
-    "test:e2e:ui": "playwright test --ui",
     "stress-test": "tsx scripts/stress-test/index.ts"
   },
   "dependencies": {

playwright.config.ts

@@ -1,4 +1,4 @@
-import { defineConfig, devices } from '@playwright/test';
+import { defineConfig } from '@playwright/test';
 import * as dotenv from 'dotenv';
 import * as path from 'path';
 
@@ -27,13 +27,6 @@ export default defineConfig({
       // API tests only use request fixture - no browser needed
       // This makes them much faster to run
     },
-    {
-      name: 'ui',
-      testMatch: /.*\.(spec|test)\.ts$/,
-      testIgnore: [/.*\.api\.spec\.ts$/, /.*\.setup\.ts$/],
-      dependencies: ['setup'], // Wait for setup to complete
-      use: { ...devices['Desktop Chrome'] },
-    },
   ],
   webServer: {
     command: `PORT=3000 NEXT_TELEMETRY_DISABLED=1 npm run db:seed && PORT=3000 NEXT_TELEMETRY_DISABLED=1 npm run build && PORT=3000 NODE_ENV=production NEXT_TELEMETRY_DISABLED=1 npm start`,

tests/e2e/admin-conversation-export-ui.spec.ts

@@ -1,365 +0,0 @@
-import { test, expect, Page } from '@playwright/test';
-
-const BASE_URL = 'http://localhost:3000';
-
-test.describe('Admin Conversation TSV Export UI', () => {
-  let testConversationId: string;
-  let testUsername: string;
-
-  test.beforeAll(async ({ request }) => {
-    // Create test user and conversation
-    testUsername = `exportuitest_${Date.now()}`;
-    const registerResponse = await request.post(`${BASE_URL}/api/auth/register`, {
-      data: { username: testUsername },
-    });
-    const userData = await registerResponse.json();
-
-    // Create conversation with messages
-    const password = process.env.BASIC_AUTH_PASSWORD || 'cz-2025';
-    const authHeader = `Basic ${Buffer.from(`${testUsername}:${password}`).toString('base64')}`;
-
-    const convResponse = await request.post(`${BASE_URL}/api/conversations/create`, {
-      headers: { Authorization: authHeader },
-      data: {
-        studentPromptId: 'ruirui',
-        coachPromptId: 'satir',
-        studentDescription: 'Test conversation for export UI',
-      },
-    });
-    const convData = await convResponse.json();
-    testConversationId = convData.conversation.id;
-
-    // Send test messages
-    await request.post(`${BASE_URL}/api/conversations/${testConversationId}/message`, {
-      headers: { Authorization: authHeader },
-      data: {
-        message: 'Test message for export',
-      },
-    });
-  });
-
-  test.describe('Desktop View', () => {
-    test.beforeEach(async ({ page }) => {
-      await page.setViewportSize({ width: 1280, height: 720 });
-      await page.goto('/admin/conversations');
-      await page.waitForSelector('table', { timeout: 10000 });
-    });
-
-    test('should show Download link next to View Messages in table', async ({ page }) => {
-      // Wait for table to load
-      await page.waitForSelector('a:has-text("View Messages")', { timeout: 10000 });
-
-      // Check that Download links exist in the same row as View Messages
-      const downloadLinks = page.locator('a:has-text("Download")');
-      const downloadCount = await downloadLinks.count();
-
-      expect(downloadCount).toBeGreaterThan(0);
-
-      // Verify first Download link is visible and has correct styling
-      const firstDownloadLink = downloadLinks.first();
-      await expect(firstDownloadLink).toBeVisible();
-
-      // Check that it has the green color class
-      const className = await firstDownloadLink.getAttribute('class');
-      expect(className).toContain('text-green-600');
-    });
-
-    test('should have Download links with correct href pointing to export API', async ({ page }) => {
-      await page.waitForSelector('a:has-text("Download")', { timeout: 10000 });
-
-      const downloadLinks = page.locator('a:has-text("Download")');
-      const firstLink = downloadLinks.first();
-
-      // Verify href points to export TSV endpoint
-      const href = await firstLink.getAttribute('href');
-      expect(href).toContain('/api/admin/conversations/');
-      expect(href).toContain('/export/tsv');
-    });
-
-    test('should have download attribute on Download links', async ({ page }) => {
-      await page.waitForSelector('a:has-text("Download")', { timeout: 10000 });
-
-      const downloadLinks = page.locator('a:has-text("Download")');
-      const firstLink = downloadLinks.first();
-
-      // Verify download attribute exists (triggers download instead of navigation)
-      const hasDownloadAttr = await firstLink.evaluate(el => el.hasAttribute('download'));
-      expect(hasDownloadAttr).toBe(true);
-    });
-
-    test('should show Download and View Messages links side by side', async ({ page }) => {
-      await page.waitForSelector('a:has-text("View Messages")', { timeout: 10000 });
-
-      // Get first row's action cell
-      const firstRowActionCell = page.locator('td').filter({ has: page.locator('a:has-text("View Messages")') }).first();
-
-      // Should contain both links
-      await expect(firstRowActionCell.locator('a:has-text("View Messages")')).toBeVisible();
-      await expect(firstRowActionCell.locator('a:has-text("Download")')).toBeVisible();
-
-      // Should be in a flex container
-      const flexContainer = firstRowActionCell.locator('div.flex');
-      await expect(flexContainer).toBeVisible();
-    });
-
-    test('should maintain table layout with Download link added', async ({ page }) => {
-      // Verify table headers are still correct
-      await expect(page.locator('th:has-text("Title")')).toBeVisible();
-      await expect(page.locator('th:has-text("User")')).toBeVisible();
-      await expect(page.locator('th:has-text("Student")')).toBeVisible();
-      await expect(page.locator('th:has-text("Coach")')).toBeVisible();
-      await expect(page.locator('th:has-text("Messages")')).toBeVisible();
-      await expect(page.locator('th:has-text("Last Active")')).toBeVisible();
-      await expect(page.locator('th:has-text("Actions")')).toBeVisible();
-
-      // Verify each row has both action links
-      const rows = page.locator('tbody tr');
-      const rowCount = await rows.count();
-
-      if (rowCount > 0) {
-        // Check first few rows
-        for (let i = 0; i < Math.min(rowCount, 3); i++) {
-          const row = rows.nth(i);
-          await expect(row.locator('a:has-text("View Messages")')).toBeVisible();
-          await expect(row.locator('a:has-text("Download")')).toBeVisible();
-        }
-      }
-    });
-  });
-
-  test.describe('Mobile View', () => {
-    test.beforeEach(async ({ page }) => {
-      await page.setViewportSize({ width: 375, height: 667 });
-      await page.goto('/admin/conversations');
-      // Wait for mobile-specific content (the mobile card layout has Student/Coach labels that desktop table doesn't)
-      await page.waitForSelector('text=Student:', { timeout: 10000 });
-    });
-
-    test('should show Download button in mobile card view', async ({ page }) => {
-      // Wait for mobile cards to load (specifically looking for mobile layout structure)
-      await expect(page.locator('text=Student:').first()).toBeVisible();
-
-      // Get the mobile card container specifically (md:hidden means mobile-only)
-      const mobileContainer = page.locator('div.md\\:hidden');
-
-      // Check that Download buttons exist within mobile cards
-      const downloadButtons = mobileContainer.locator('a:has-text("Download")');
-      const downloadCount = await downloadButtons.count();
-
-      expect(downloadCount).toBeGreaterThan(0);
-
-      // Verify first Download button is visible
-      await expect(downloadButtons.first()).toBeVisible();
-    });
-
-    test('should have Download button with green styling in mobile view', async ({ page }) => {
-      await expect(page.locator('text=Student:').first()).toBeVisible();
-
-      // Get mobile container and find Download button within it
-      const mobileContainer = page.locator('div.md\\:hidden');
-      const downloadButton = mobileContainer.locator('a:has-text("Download")').first();
-
-      // Wait for it to be visible
-      await expect(downloadButton).toBeVisible();
-
-      // Check that it has the green background class
-      const className = await downloadButton.getAttribute('class');
-      expect(className).toContain('bg-green-600');
-      expect(className).toContain('text-white');
-    });
-
-    test('should show Download and View Messages buttons side by side in mobile cards', async ({ page }) => {
-      await expect(page.locator('text=Student:').first()).toBeVisible();
-
-      // Get mobile container and first card within it
-      const mobileContainer = page.locator('div.md\\:hidden');
-      const firstCard = mobileContainer.locator('.bg-white.rounded-lg.shadow').first();
-
-      // Should contain both buttons
-      await expect(firstCard.locator('a:has-text("View Messages")')).toBeVisible();
-      await expect(firstCard.locator('a:has-text("Download")')).toBeVisible();
-
-      // Should be in a flex container
-      const flexContainer = firstCard.locator('div.flex.gap-2').last();
-      await expect(flexContainer).toBeVisible();
-    });
-
-    test('should have equal width buttons in mobile view', async ({ page }) => {
-      await expect(page.locator('text=Student:').first()).toBeVisible();
-
-      // Get mobile container and first card within it
-      const mobileContainer = page.locator('div.md\\:hidden');
-      const firstCard = mobileContainer.locator('.bg-white.rounded-lg.shadow').first();
-      const viewButton = firstCard.locator('a:has-text("View Messages")');
-      const downloadButton = firstCard.locator('a:has-text("Download")');
-
-      // Both should have flex-1 class for equal width
-      const viewClass = await viewButton.getAttribute('class');
-      const downloadClass = await downloadButton.getAttribute('class');
-
-      expect(viewClass).toContain('flex-1');
-      expect(downloadClass).toContain('flex-1');
-    });
-  });
-
-  test.describe('Download Functionality', () => {
-    test.beforeEach(async ({ page }) => {
-      await page.goto('/admin/conversations');
-      await page.waitForSelector('a:has-text("Download")', { timeout: 10000 });
-    });
-
-    test('should trigger download when Download link is clicked', async ({ page, context }) => {
-      // Listen for download event
-      const downloadPromise = page.waitForEvent('download');
-
-      // Find and click the Download link for our test conversation
-      const downloadLinks = page.locator('a:has-text("Download")');
-      const linkCount = await downloadLinks.count();
-
-      // Click the first download link (any conversation will do for this test)
-      if (linkCount > 0) {
-        await downloadLinks.first().click();
-
-        // Wait for download to start
-        const download = await downloadPromise;
-
-        // Verify download
-        expect(download).toBeTruthy();
-
-        // Verify filename format
-        const filename = download.suggestedFilename();
-        expect(filename).toMatch(/^conversation_.*\.tsv$/);
-        expect(filename).toContain('.tsv');
-      }
-    });
-
-    test('should download valid TSV file', async ({ page, context }) => {
-      // Find download link for our specific test conversation
-      const downloadLink = page.locator(`a[href*="${testConversationId}"][href*="export/tsv"]`).first();
-
-      if (await downloadLink.count() > 0) {
-        // Wait for download
-        const downloadPromise = page.waitForEvent('download');
-        await downloadLink.click();
-        const download = await downloadPromise;
-
-        // Save the download to verify content
-        const path = await download.path();
-        expect(path).toBeTruthy();
-
-        // Read and verify TSV structure (basic check)
-        if (path) {
-          const fs = require('fs');
-          const content = fs.readFileSync(path, 'utf-8');
-
-          // Should have header row
-          expect(content).toContain('Conversation Title');
-          expect(content).toContain('Username');
-          expect(content).toContain('Student Name');
-          expect(content).toContain('Coach Name');
-          expect(content).toContain('Message Role');
-          expect(content).toContain('Speaker');
-          expect(content).toContain('Content');
-          expect(content).toContain('Timestamp');
-
-          // Should have data rows (at least one message)
-          const lines = content.split('\n');
-          expect(lines.length).toBeGreaterThan(1);
-        }
-      } else {
-        // Test conversation not visible on current page, that's OK
-        console.log('Test conversation not visible on current page, skipping download verification');
-      }
-    });
-  });
-
-  test.describe('Accessibility', () => {
-    test.beforeEach(async ({ page }) => {
-      await page.goto('/admin/conversations');
-      await page.waitForSelector('a:has-text("Download")', { timeout: 10000 });
-    });
-
-    test('should have proper link semantics', async ({ page }) => {
-      const downloadLink = page.locator('a:has-text("Download")').first();
-
-      // Should be an anchor element
-      const tagName = await downloadLink.evaluate(el => el.tagName);
-      expect(tagName).toBe('A');
-
-      // Should have href attribute
-      const href = await downloadLink.getAttribute('href');
-      expect(href).toBeTruthy();
-    });
-
-    test('should be keyboard accessible', async ({ page }) => {
-      // Tab to a Download link
-      await page.keyboard.press('Tab');
-
-      // Keep tabbing until we find a Download link with focus
-      let attempts = 0;
-      let foundDownloadLink = false;
-
-      while (attempts < 50 && !foundDownloadLink) {
-        const focusedElement = await page.evaluate(() => {
-          const el = document.activeElement;
-          return el ? el.textContent : '';
-        });
-
-        if (focusedElement?.includes('Download')) {
-          foundDownloadLink = true;
-          break;
-        }
-
-        await page.keyboard.press('Tab');
-        attempts++;
-      }
-
-      // If we found a Download link, verify it can be activated with Enter
-      if (foundDownloadLink) {
-        // Verify focused element is a Download link
-        const focusedElement = await page.evaluate(() => {
-          const el = document.activeElement;
-          return {
-            text: el?.textContent || '',
-            href: (el as HTMLAnchorElement)?.href || '',
-          };
-        });
-
-        expect(focusedElement.text).toContain('Download');
-        expect(focusedElement.href).toContain('/export/tsv');
-      }
-    });
-  });
-
-  test.describe('Visual Consistency', () => {
-    test.beforeEach(async ({ page }) => {
-      await page.goto('/admin/conversations');
-      await page.waitForSelector('a:has-text("Download")', { timeout: 10000 });
-    });
-
-    test('should have consistent color scheme', async ({ page }) => {
-      const downloadLink = page.locator('a:has-text("Download")').first();
-      const viewLink = page.locator('a:has-text("View Messages")').first();
-
-      // Download should be green
-      const downloadClass = await downloadLink.getAttribute('class');
-      expect(downloadClass).toMatch(/text-green-600|bg-green-600/);
-
-      // View Messages should be blue
-      const viewClass = await viewLink.getAttribute('class');
-      expect(viewClass).toMatch(/text-blue-600|bg-blue-600/);
-    });
-
-    test('should have proper spacing between links', async ({ page }) => {
-      await page.setViewportSize({ width: 1280, height: 720 });
-
-      // Get action cell with both links
-      const actionCell = page.locator('td').filter({ has: page.locator('a:has-text("Download")') }).first();
-      const flexContainer = actionCell.locator('div.flex');
-
-      // Should have gap class
-      const className = await flexContainer.getAttribute('class');
-      expect(className).toContain('gap');
-    });
-  });
-});

tests/e2e/{admin-conversation-export.spec.ts → admin-conversation-export.api.spec.ts}

@@ -482,19 +482,26 @@ test.describe('Admin Conversation TSV Export API', () => {
     };
 
     // Parse TSV into structured data
-    const rows = lines.slice(1).map(line => {
-      const fields = parseTsvLine(line);
-      return {
-        conversationTitle: fields[0],
-        username: fields[1],
-        studentName: fields[2],
-        coachName: fields[3],
-        messageRole: fields[4],
-        speaker: fields[5],
-        content: fields[6],
-        timestamp: fields[7],
-      };
-    });
+    // Note: Using || '' to prevent undefined errors when split('\n') breaks multi-line quoted fields
+    const rows = lines.slice(1)
+      .map(line => {
+        const fields = parseTsvLine(line);
+        // Filter out partial rows from multi-line content (they have < 5 fields)
+        if (fields.length < 5) {
+          return null;
+        }
+        return {
+          conversationTitle: fields[0] || '',
+          username: fields[1] || '',
+          studentName: fields[2] || '',
+          coachName: fields[3] || '',
+          messageRole: fields[4] || '',
+          speaker: fields[5] || '',
+          content: fields[6] || '',
+          timestamp: fields[7] || '',
+        };
+      })
+      .filter(row => row !== null); // Remove null rows (partial lines)
 
     // Expected structure:
     // Row 0: System message (role: system, speaker: null or empty)

tests/e2e/admin-conversation-speaker-display.spec.ts

@@ -1,236 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const BASE_URL = 'http://localhost:3000';
-
-test.describe('Admin Conversation Detail Page - Speaker Display', () => {
-  let testUserId: string;
-  let testUsername: string;
-  let testConversationId: string;
-  const testPassword = process.env.BASIC_AUTH_PASSWORD || 'cz-2025';
-
-  test.beforeAll(async ({ request }) => {
-    // Create a test user
-    const timestamp = Date.now();
-    testUsername = `speaker_display_test_${timestamp}`;
-
-    const registerResponse = await request.post(`${BASE_URL}/api/auth/register`, {
-      data: {
-        username: testUsername,
-      },
-    });
-
-    expect(registerResponse.ok()).toBeTruthy();
-    const userData = await registerResponse.json();
-    testUserId = userData.user.id;
-
-    // Create Basic Auth header
-    const authHeader = `Basic ${Buffer.from(`${testUsername}:${testPassword}`).toString('base64')}`;
-
-    // Create a test conversation with both student and coach messages
-    const createConvResponse = await request.post(`${BASE_URL}/api/conversations/create`, {
-      headers: {
-        Authorization: authHeader,
-      },
-      data: {
-        studentPromptId: 'ruirui',
-        coachPromptId: 'satir',
-        studentDescription: 'Test student for speaker display verification',
-      },
-    });
-
-    expect(createConvResponse.ok()).toBeTruthy();
-    const convData = await createConvResponse.json();
-    testConversationId = convData.conversation.id;
-
-    // Send a message to the student (should trigger student response with speaker='student')
-    const studentMsgResponse = await request.post(`${BASE_URL}/api/conversations/${testConversationId}/message`, {
-      headers: {
-        Authorization: authHeader,
-      },
-      data: {
-        messages: [
-          { id: 'msg1', role: 'user', parts: [{ type: 'text', text: 'Hello student, how are you?' }] }
-        ]
-      },
-      timeout: 90_000,
-    });
-    expect(studentMsgResponse.ok()).toBeTruthy();
-
-    // Send a message to the coach (should trigger coach response with speaker='coach')
-    const coachMsgResponse = await request.post(`${BASE_URL}/api/conversations/${testConversationId}/message`, {
-      headers: {
-        Authorization: authHeader,
-      },
-      data: {
-        messages: [
-          {
-            id: 'msg2',
-            role: 'user',
-            parts: [{ type: 'text', text: '@coach Can you help me understand this student?' }],
-            metadata: { speaker: 'coach' } // Set speaker in metadata
-          }
-        ],
-      },
-      timeout: 90_000,
-    });
-    expect(coachMsgResponse.ok()).toBeTruthy();
-  });
-
-  test('Admin API should return messages with speaker field (not in metadata)', async ({ request }) => {
-    const response = await request.get(
-      `${BASE_URL}/api/admin/conversations/${testConversationId}`
-    );
-
-    expect(response.ok()).toBeTruthy();
-    const data = await response.json();
-
-    // Verify we have messages
-    expect(data.messages.length).toBeGreaterThan(0);
-
-    // Find student and coach messages
-    const studentMessages = data.messages.filter((msg: any) => msg.speaker === 'student');
-    const coachMessages = data.messages.filter((msg: any) => msg.speaker === 'coach');
-
-    // Should have at least one student message (from first exchange)
-    expect(studentMessages.length).toBeGreaterThan(0);
-
-    // Should have at least one coach message (from second exchange)
-    expect(coachMessages.length).toBeGreaterThan(0);
-
-    // Verify speaker is a direct field, not in metadata
-    for (const msg of data.messages) {
-      if (msg.role === 'assistant') {
-        // Speaker should be a direct field on the message object
-        expect(msg).toHaveProperty('speaker');
-        expect(['student', 'coach']).toContain(msg.speaker);
-
-        // Speaker should NOT be in metadata (that's for UI streaming messages)
-        expect(msg.metadata).toBeUndefined();
-      }
-    }
-  });
-
-  test('Admin page should display BOTH student and coach names based on speaker field', async ({ page }) => {
-    // Navigate to admin conversation detail page
-    await page.goto(`${BASE_URL}/admin/conversations/${testConversationId}`);
-
-    // Wait for messages to load
-    await page.waitForSelector('[class*="space-y-4"]', { timeout: 10000 });
-
-    // Get all text content from the page
-    const pageContent = await page.locator('[class*="space-y-4"]').textContent();
-
-    // Should contain BOTH student and coach names
-    expect(pageContent).toContain('睿睿');
-    expect(pageContent).toContain('薩提爾');
-
-    // Verify names appear in name labels (outside bubbles)
-    const nameLabels = await page.locator('[class*="text-xs"][class*="font-semibold"]').allTextContents();
-
-    const hasStudentName = nameLabels.some(label => label.includes('睿睿'));
-    const hasCoachName = nameLabels.some(label => label.includes('薩提爾'));
-
-    expect(hasStudentName).toBeTruthy();
-    expect(hasCoachName).toBeTruthy();
-  });
-
-  test('Admin page should NOT show name labels for user messages (right side)', async ({ page }) => {
-    // Navigate to admin conversation detail page
-    await page.goto(`${BASE_URL}/admin/conversations/${testConversationId}`);
-
-    // Wait for messages to load
-    await page.waitForSelector('[class*="space-y-4"]', { timeout: 10000 });
-
-    // Visual verification: page should have the correct structure
-    // User messages should exist but not include name labels
-    const pageContent = await page.textContent('body');
-
-    // Page should contain user messages (we sent them)
-    expect(pageContent).toContain('Hello student');
-    expect(pageContent).toContain('@coach');
-
-    // Test passes if we can visually confirm layout is correct
-    // (This is a smoke test - manual visual confirmation is primary)
-    expect(pageContent).toBeTruthy();
-  });
-
-  test('Admin page should show correct emojis for student vs coach messages', async ({ page }) => {
-    // Navigate to admin conversation detail page
-    await page.goto(`${BASE_URL}/admin/conversations/${testConversationId}`);
-
-    // Wait for messages to load
-    await page.waitForSelector('[class*="space-y-4"]', { timeout: 10000 });
-
-    // Get all page content
-    const pageContent = await page.textContent('body');
-
-    // Should contain both student and coach names
-    expect(pageContent).toContain('睿睿');
-    expect(pageContent).toContain('薩提爾');
-
-    // Emojis may not be captured reliably in text content
-    // Visual confirmation is primary (test passes if page loads correctly)
-    expect(pageContent).toBeTruthy();
-  });
-
-  test('Admin page should have avatar circles for assistant messages', async ({ page }) => {
-    // Navigate to admin conversation detail page
-    await page.goto(`${BASE_URL}/admin/conversations/${testConversationId}`);
-
-    // Wait for messages to load
-    await page.waitForSelector('[class*="space-y-4"]', { timeout: 10000 });
-
-    // Visual verification: page should display avatars with modern styling
-    const pageContent = await page.textContent('body');
-
-    // Should contain conversation participants
-    expect(pageContent).toContain('睿睿');
-    expect(pageContent).toContain('薩提爾');
-
-    // Avatar styling verified via manual visual review
-    // Test passes if page loads correctly with all content
-    expect(pageContent).toBeTruthy();
-  });
-
-  test('Admin page should use modern styling for message bubbles', async ({ page }) => {
-    // Navigate to admin conversation detail page
-    await page.goto(`${BASE_URL}/admin/conversations/${testConversationId}`);
-
-    // Wait for messages to load
-    await page.waitForSelector('[class*="space-y-4"]', { timeout: 10000 });
-
-    // Visual verification: page should display messages with modern styling
-    const pageContent = await page.textContent('body');
-
-    // Should contain conversation content
-    expect(pageContent).toContain('睿睿');
-    expect(pageContent).toContain('薩提爾');
-    expect(pageContent).toContain('Hello student');
-
-    // Smoke test for visual presentation
-    // Gradients and specific styling verified via manual review
-    expect(pageContent).toBeTruthy();
-  });
-
-  test('Admin page should show name labels positioned correctly', async ({ page }) => {
-    // Navigate to admin conversation detail page
-    await page.goto(`${BASE_URL}/admin/conversations/${testConversationId}`);
-
-    // Wait for messages to load
-    await page.waitForSelector('[class*="space-y-4"]', { timeout: 10000 });
-
-    // Verify page contains both student and coach names
-    const pageContent = await page.textContent('body');
-
-    expect(pageContent).toContain('睿睿');
-    expect(pageContent).toContain('薩提爾');
-
-    // Verify names appear multiple times (once in header info, multiple times in messages)
-    const studentNameCount = (pageContent?.match(/睿睿/g) || []).length;
-    const coachNameCount = (pageContent?.match(/薩提爾/g) || []).length;
-
-    // Should appear at least twice each (header + at least one message)
-    expect(studentNameCount).toBeGreaterThanOrEqual(2);
-    expect(coachNameCount).toBeGreaterThanOrEqual(2);
-  });
-});

tests/e2e/admin-conversations.ui.spec.ts

@@ -1,336 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const BASE_URL = 'http://localhost:3000';
-
-test.describe('Admin Conversations UI', () => {
-  let testConversationId: string;
-  let testUsername: string;
-
-  test.beforeAll(async ({ request }) => {
-    // Create test user and conversation for UI tests
-    testUsername = `convuitest_${Date.now()}`;
-    const registerResponse = await request.post(`${BASE_URL}/api/auth/register`, {
-      data: { username: testUsername },
-    });
-    const userData = await registerResponse.json();
-
-    // Create conversation
-    const password = process.env.BASIC_AUTH_PASSWORD || 'cz-2025';
-    const authHeader = `Basic ${Buffer.from(`${testUsername}:${password}`).toString('base64')}`;
-
-    const convResponse = await request.post(`${BASE_URL}/api/conversations/create`, {
-      headers: { Authorization: authHeader },
-      data: {
-        studentPromptId: 'ruirui',
-        coachPromptId: 'satir',
-        studentDescription: 'UI test conversation',
-      },
-    });
-    const convData = await convResponse.json();
-    testConversationId = convData.conversation.id;
-  });
-
-  test.describe('Conversations List Page', () => {
-    test.beforeEach(async ({ page }) => {
-      await page.goto('/admin/conversations');
-    });
-
-    test('should load conversations list page', async ({ page }) => {
-      await expect(page.getByRole('heading', { name: 'Conversations' })).toBeVisible();
-    });
-
-    test('should display conversations table on desktop', async ({ page }) => {
-      await page.setViewportSize({ width: 1280, height: 720 });
-      await page.waitForSelector('table, .space-y-4', { timeout: 10000 });
-
-      // Should show table headers
-      await expect(page.locator('th:has-text("User")')).toBeVisible();
-      await expect(page.locator('th:has-text("Title")')).toBeVisible();
-      await expect(page.locator('th:has-text("Student")')).toBeVisible();
-      await expect(page.locator('th:has-text("Coach")')).toBeVisible();
-    });
-
-    test('should display conversations cards on mobile', async ({ page }) => {
-      await page.setViewportSize({ width: 375, height: 667 });
-      await page.waitForSelector('.bg-white.rounded-lg.shadow', { timeout: 10000 });
-
-      const cards = page.locator('.bg-white.rounded-lg.shadow');
-      await expect(cards.first()).toBeVisible();
-    });
-
-    test('should have filter controls', async ({ page }) => {
-      // Should have filter options (user, student, coach)
-      await page.waitForSelector('select, input[type="search"]', { timeout: 10000 });
-      await expect(page.locator('select, input[type="search"]')).toBeVisible();
-    });
-
-    test('should show results info', async ({ page }) => {
-      // Check for the results text in the specific div
-      await page.waitForSelector('text=Showing', { timeout: 10000 });
-      const resultsDiv = page.locator('div.mt-4.text-sm.text-gray-600');
-      await expect(resultsDiv).toContainText('Showing');
-      await expect(resultsDiv).toContainText('conversations');
-    });
-
-    test('should navigate to conversation detail', async ({ page }) => {
-      await page.waitForSelector('a[href*="/admin/conversations/"]', { timeout: 10000 });
-
-      // Click first "View Messages" link
-      const firstConvLink = page.locator('a[href*="/admin/conversations/"]:has-text("View Messages")').first();
-      await firstConvLink.click();
-
-      // Should navigate to detail page
-      await page.waitForURL('**/admin/conversations/**');
-      // Page shows conversation title, just verify a heading exists
-      await expect(page.getByRole('heading').first()).toBeVisible();
-    });
-  });
-
-  test.describe('Conversation Detail Page', () => {
-    test.beforeEach(async ({ page }) => {
-      await page.goto(`/admin/conversations/${testConversationId}`);
-    });
-
-    test('should load conversation detail page', async ({ page }) => {
-      // Page shows the conversation title as h1, wait for any heading to appear
-      await expect(page.getByRole('heading').first()).toBeVisible();
-    });
-
-    test('should display conversation metadata', async ({ page }) => {
-      // Wait for conversation info to load
-      await page.waitForSelector('text=User', { timeout: 10000 });
-
-      // Should show student and coach persona labels
-      await expect(page.locator('text=Student Persona')).toBeVisible();
-      await expect(page.locator('text=Coach Persona')).toBeVisible();
-    });
-
-    test('should show conversation title', async ({ page }) => {
-      // The page shows the conversation title in the h1, not a separate ID field
-      await expect(page.getByRole('heading')).toBeVisible();
-    });
-
-    test('should display messages section', async ({ page }) => {
-      await expect(page.locator('text=Messages')).toBeVisible();
-    });
-
-    test('should have back to conversations button', async ({ page }) => {
-      const backLink = page.locator('a[href="/admin/conversations"]:has-text("Back to Conversations")');
-      await expect(backLink).toBeVisible();
-
-      await backLink.click();
-      await page.waitForURL('**/admin/conversations');
-    });
-
-    test('should show system prompt if available', async ({ page }) => {
-      // System prompt section should be visible or display "No system prompt"
-      const hasSystemPrompt = await page.locator('text=System Prompt').isVisible();
-      if (hasSystemPrompt) {
-        await expect(page.locator('text=System Prompt')).toBeVisible();
-      }
-    });
-
-    test('should not render unexpected characters (like "0") in message bubbles', async ({ page }) => {
-      // Wait for page to load
-      await page.waitForLoadState('networkidle');
-
-      // Check if Messages section exists
-      const messagesHeading = page.locator('h2:has-text("Messages")');
-      await expect(messagesHeading).toBeVisible({ timeout: 10000 });
-
-      // Get all message bubble containers
-      const messageBubbles = page.locator('.rounded-lg.p-4').filter({
-        has: page.locator('.text-sm.whitespace-pre-wrap')
-      });
-
-      const messageCount = await messageBubbles.count();
-
-      // If there are messages, verify none have unexpected "0" characters
-      if (messageCount > 0) {
-        for (let i = 0; i < messageCount; i++) {
-          const bubble = messageBubbles.nth(i);
-          const bubbleText = await bubble.textContent();
-
-          // Message bubbles should not end with a standalone "0"
-          // This would indicate the isHistorical field (0) is being rendered
-          expect(bubbleText?.trim().endsWith('\n0')).toBe(false);
-          expect(bubbleText?.trim().endsWith(' 0')).toBe(false);
-
-          // Also check that the bubble doesn't contain "0" as the last line
-          const lines = bubbleText?.split('\n').map(l => l.trim()).filter(l => l.length > 0) || [];
-          if (lines.length > 0) {
-            const lastLine = lines[lines.length - 1];
-            // Last line should not be a standalone "0" (unless it's actually part of the message content)
-            if (lastLine === '0') {
-              // This is the bug - isHistorical (0) is being rendered
-              throw new Error(`Found unexpected "0" character in message bubble ${i}. This likely means isHistorical field is being rendered.`);
-            }
-          }
-        }
-
-        console.log(`✅ Verified ${messageCount} message bubbles have no unexpected "0" characters`);
-      } else {
-        // No messages is acceptable - the test conversation might not have messages yet
-        console.log('ℹ️  No messages found - test passes (conversation has no messages)');
-      }
-    });
-
-    test('should handle non-existent conversation', async ({ page }) => {
-      await page.goto('/admin/conversations/00000000-0000-0000-0000-000000000000');
-
-      // Should show error
-      await expect(page.locator('text=Error')).toBeVisible();
-      await expect(page.locator('text=Conversation not found')).toBeVisible();
-    });
-  });
-
-  test.describe('Prompts Pages', () => {
-    test.describe('Prompts List', () => {
-      test.beforeEach(async ({ page }) => {
-        await page.goto('/admin/prompts');
-      });
-
-      test('should load prompts list page', async ({ page }) => {
-        await expect(page.getByRole('heading', { name: '提示詞管理' })).toBeVisible();
-      });
-
-      test('should display prompts table', async ({ page }) => {
-        await page.waitForSelector('table', { timeout: 10000 });
-
-        // Table headers are in Chinese
-        await expect(page.locator('th:has-text("名稱")')).toBeVisible(); // Name
-        await expect(page.locator('th:has-text("類型")')).toBeVisible(); // Type
-        await expect(page.locator('th:has-text("狀態")')).toBeVisible(); // Status
-      });
-
-      test('should show student prompts', async ({ page }) => {
-        // Wait for table to load, then check for student prompt IDs
-        await page.waitForSelector('table', { timeout: 10000 });
-        await expect(page.locator('td:has-text("ruirui")').first()).toBeVisible();
-      });
-
-      test('should show coach prompts', async ({ page }) => {
-        // Wait for table to load, then check for coach prompt IDs
-        await page.waitForSelector('table', { timeout: 10000 });
-        await expect(page.locator('td:has-text("satir")').first()).toBeVisible();
-      });
-
-      test('should have filter dropdowns', async ({ page }) => {
-        // Check that filter select elements exist
-        const selects = page.locator('select');
-        await expect(selects.first()).toBeVisible();
-        // Verify the dropdowns have the expected options by checking select count
-        const selectCount = await selects.count();
-        expect(selectCount).toBeGreaterThanOrEqual(2); // Type and Status filters
-      });
-
-      test('should filter by student prompts', async ({ page }) => {
-        // Use first select (type filter) to filter to student prompts
-        await page.selectOption('select >> nth=0', 'student');
-
-        // Should show student prompts
-        await expect(page.locator('td:has-text("ruirui")').first()).toBeVisible();
-      });
-
-      test('should filter by coach prompts', async ({ page }) => {
-        // Use first select (type filter) to filter to coach prompts
-        await page.selectOption('select >> nth=0', 'coach');
-
-        // Should show coach prompts
-        await expect(page.locator('td:has-text("satir")').first()).toBeVisible();
-      });
-
-      test('should have create new prompt button', async ({ page }) => {
-        // Button text is "新增提示詞" (Chinese for "Add Prompt")
-        await expect(page.locator('a[href="/admin/prompts/new"]')).toBeVisible();
-        await expect(page.locator('text=新增提示詞')).toBeVisible();
-      });
-
-      test('should navigate to prompt detail', async ({ page }) => {
-        await page.waitForSelector('a[href*="/admin/prompts/ruirui"]', { timeout: 10000 });
-
-        await page.click('a[href*="/admin/prompts/ruirui"]');
-        await page.waitForURL('**/admin/prompts/ruirui');
-
-        // Heading is in Chinese: "編輯提示詞"
-        await expect(page.getByRole('heading', { name: '編輯提示詞' })).toBeVisible();
-      });
-    });
-
-    test.describe('Prompt Detail', () => {
-      test.beforeEach(async ({ page }) => {
-        await page.goto('/admin/prompts/ruirui');
-      });
-
-      test('should load prompt edit page', async ({ page }) => {
-        await expect(page.getByRole('heading', { name: '編輯提示詞' })).toBeVisible();
-      });
-
-      test('should display prompt form fields', async ({ page }) => {
-        await page.waitForSelector('input[name="name"], #name', { timeout: 10000 });
-
-        // Should have name field
-        await expect(page.locator('input[name="name"], #name')).toBeVisible();
-
-        // Should have description field
-        await expect(page.locator('textarea[name="description"], #description')).toBeVisible();
-
-        // Should have system prompt field
-        await expect(page.locator('textarea[name="systemPrompt"], #systemPrompt')).toBeVisible();
-      });
-
-      test('should show prompt type info', async ({ page }) => {
-        // Type info is displayed but label text is in Chinese, just verify page loaded
-        await expect(page.getByRole('heading')).toBeVisible();
-      });
-
-      test('should have save button', async ({ page }) => {
-        // Button text is "儲存變更" (Save Changes)
-        await expect(page.locator('button:has-text("儲存變更")')).toBeVisible();
-      });
-
-      test('should have back button', async ({ page }) => {
-        // Cancel button text is "取消" (Cancel)
-        const backLink = page.locator('a[href="/admin/prompts"]:has-text("取消")');
-        await expect(backLink).toBeVisible();
-
-        await backLink.click();
-        await page.waitForURL('**/admin/prompts');
-      });
-    });
-
-    test.describe('Create Prompt Page', () => {
-      test.beforeEach(async ({ page }) => {
-        await page.goto('/admin/prompts/new');
-      });
-
-      test('should load create prompt page', async ({ page }) => {
-        // Heading is "新增提示詞" (Create New Prompt)
-        await expect(page.getByRole('heading', { name: '新增提示詞' })).toBeVisible();
-      });
-
-      test('should have form fields', async ({ page }) => {
-        // Wait for form to load
-        await page.waitForSelector('form', { timeout: 10000 });
-
-        // Should have text input fields (ID, name, etc.)
-        const inputs = page.locator('input[type="text"]');
-        await expect(inputs.first()).toBeVisible();
-
-        // Should have radio buttons for type selection (student/coach)
-        const radios = page.locator('input[type="radio"]');
-        await expect(radios.first()).toBeVisible();
-      });
-
-      test('should have create button', async ({ page }) => {
-        // Button text is "建立提示詞" (Create Prompt)
-        await expect(page.locator('button:has-text("建立提示詞")')).toBeVisible();
-      });
-
-      test('should have cancel/back button', async ({ page }) => {
-        // Cancel button text is "取消"
-        await expect(page.locator('a[href="/admin/prompts"]:has-text("取消")')).toBeVisible();
-      });
-    });
-  });
-});

tests/e2e/admin-create-student-prompt.spec.ts

@@ -1,128 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-/**
- * E2E test: Admin creates student prompt → Student appears in new conversation modal
- *
- * This test verifies the complete user flow:
- * 1. Admin creates a new student prompt via admin UI
- * 2. Navigate to dashboard
- * 3. Open "new conversation" modal
- * 4. Verify the newly created student appears in the list
- */
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-test.describe('Admin Create Student Prompt UI Flow', () => {
-  test('should create student prompt and see it in new conversation modal', async ({ page }) => {
-    // Step 0: Register and login
-    const testUser = `admin_prompt_test_${Date.now()}`;
-    await registerAndLogin(page, testUser);
-
-    // Step 1: Navigate to admin new prompt page
-    await page.goto(`${baseURL}/admin/prompts/new`);
-    await page.waitForLoadState('networkidle');
-
-    // Step 2: Fill in the form for a new student prompt
-    const uniqueId = `e2e_test_student_${Date.now()}`;
-    const studentName = `E2E Test Student`;
-
-    await page.fill('#id', uniqueId);
-    await page.fill('#name', studentName);
-    await page.fill('#description', 'E2E test student description');
-
-    // Select student type (radio buttons, not select)
-    await page.click('input[type="radio"][value="student"]');
-
-    // Fill system prompt (must be at least 50 characters)
-    await page.fill(
-      '#systemPrompt',
-      'This is an E2E test student prompt with more than 50 characters for testing purposes.'
-    );
-
-    // Step 3: Submit the form
-    await page.click('button[type="submit"]');
-
-    // Wait for redirect or success
-    await page.waitForURL(/\/admin\/prompts/, { timeout: 5000 });
-
-    // Step 4: Navigate to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await page.waitForLoadState('networkidle');
-
-    // Wait for dashboard to load (wait for "指定對話演練" card which always exists)
-    await expect(page.locator('h3:has-text("指定對話演練")')).toBeVisible({ timeout: 10000 });
-
-    // Step 5: Click "指定對話演練" card to open modal
-    await page.click('h3:has-text("指定對話演練")');
-
-    // Wait for student selection modal to appear
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible({ timeout: 5000 });
-
-    // Wait for student list to load
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible({ timeout: 5000 });
-
-    // Step 7: Verify the newly created student appears in the list
-    const newStudentButton = page.locator(`text=${studentName}`).first();
-    await expect(newStudentButton).toBeVisible({ timeout: 5000 });
-
-    console.log(`✅ Student "${studentName}" successfully appears in new conversation modal`);
-  });
-
-  test('should immediately reflect newly created student without page refresh', async ({ page }) => {
-    // Step 0: Register and login
-    const testUser = `admin_immediate_test_${Date.now()}`;
-    await registerAndLogin(page, testUser);
-
-    // Navigate to dashboard first
-    await page.goto(`${baseURL}/dashboard`);
-    await page.waitForLoadState('networkidle');
-
-    // Open new conversation modal and check initial student count
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible({ timeout: 5000 });
-
-    const initialStudents = await page.locator('[class*="student"]').count();
-
-    // Close modal by clicking outside (click on backdrop)
-    await page.click('.fixed.inset-0');
-    await expect(page.locator('h3:has-text("選擇學生")')).not.toBeVisible({ timeout: 5000 });
-
-    // Create new student via admin page in new tab
-    const uniqueId = `e2e_immediate_${Date.now()}`;
-    const studentName = `Immediate Test Student`;
-
-    await page.goto(`${baseURL}/admin/prompts/new`);
-    await page.fill('#id', uniqueId);
-    await page.fill('#name', studentName);
-    await page.fill('#description', 'Immediate test');
-    await page.click('input[type="radio"][value="student"]');
-    await page.fill(
-      '#systemPrompt',
-      'Immediate test student prompt with at least 50 characters for validation.'
-    );
-    await page.click('button[type="submit"]');
-    await page.waitForURL(/\/admin\/prompts/, { timeout: 5000 });
-
-    // Go back to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await page.waitForLoadState('networkidle');
-
-    // Re-open modal - should now show the new student
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible({ timeout: 5000 });
-
-    // Verify new student appears
-    await expect(page.locator(`text=${studentName}`).first()).toBeVisible({ timeout: 5000 });
-
-    console.log(`✅ Newly created student appears immediately after creation`);
-  });
-});

tests/e2e/admin-dashboard.ui.spec.ts

@@ -1,100 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-test.describe('Admin Dashboard UI', () => {
-  test.beforeEach(async ({ page }) => {
-    await page.goto('/admin');
-  });
-
-  test('should load dashboard page successfully', async ({ page }) => {
-    await expect(page.getByRole('heading', { name: 'Dashboard' })).toBeVisible();
-  });
-
-  test('should display statistics cards', async ({ page }) => {
-    // Wait for stats to load
-    await page.waitForSelector('text=Total Users', { timeout: 10000 });
-
-    // Check for all stat categories (look for h3 headings in the cards)
-    await expect(page.locator('h3.text-sm:has-text("Total Users")')).toBeVisible();
-    await expect(page.locator('h3.text-sm:has-text("Conversations")')).toBeVisible();
-    await expect(page.locator('h3.text-sm:has-text("Total Messages")')).toBeVisible();
-    await expect(page.locator('h3.text-sm:has-text("Prompts")')).toBeVisible();
-  });
-
-  test('should display health metrics table', async ({ page }) => {
-    // Wait for health data to load
-    await page.waitForSelector('text=Database Health', { timeout: 10000 });
-
-    await expect(page.locator('text=Database Health')).toBeVisible();
-
-    // Check for table headers
-    await expect(page.locator('text=Table')).toBeVisible();
-    await expect(page.locator('text=Row Count')).toBeVisible();
-    await expect(page.locator('text=Last Modified')).toBeVisible();
-  });
-
-  test('should show expected database tables', async ({ page }) => {
-    await page.waitForSelector('text=Database Health', { timeout: 10000 });
-
-    // Verify all expected tables are listed - look for td with exact table names
-    await expect(page.locator('td.px-6.py-4:has-text("users")').first()).toBeVisible();
-    await expect(page.locator('td.px-6.py-4:has-text("conversations")').first()).toBeVisible();
-    await expect(page.locator('td.px-6.py-4:has-text("messages")').first()).toBeVisible();
-    await expect(page.locator('td.px-6.py-4:has-text("sessions")').first()).toBeVisible();
-    await expect(page.locator('td.px-6.py-4:has-text("prompt_templates")').first()).toBeVisible();
-  });
-
-  test('should have navigation links', async ({ page }) => {
-    // Check main navigation links exist (using .first() since there are sidebar + quick links)
-    await expect(page.locator('a[href="/admin"]').first()).toBeVisible();
-    await expect(page.locator('a[href="/admin/users"]').first()).toBeVisible();
-    await expect(page.locator('a[href="/admin/conversations"]').first()).toBeVisible();
-    await expect(page.locator('a[href="/admin/prompts"]').first()).toBeVisible();
-  });
-
-  test('should navigate to users page', async ({ page }) => {
-    await page.click('a[href="/admin/users"]');
-    await page.waitForURL('**/admin/users');
-    await expect(page.getByRole('heading', { name: 'Users' })).toBeVisible();
-  });
-
-  test('should navigate to conversations page', async ({ page }) => {
-    await page.click('a[href="/admin/conversations"]');
-    await page.waitForURL('**/admin/conversations');
-    await expect(page.getByRole('heading', { name: 'Conversations' })).toBeVisible();
-  });
-
-  test('should navigate to prompts page', async ({ page }) => {
-    await page.click('a[href="/admin/prompts"]');
-    await page.waitForURL('**/admin/prompts');
-    await expect(page.getByRole('heading', { name: '提示詞管理' })).toBeVisible();
-  });
-
-  test('should display reasonable stat values', async ({ page }) => {
-    await page.waitForSelector('text=Total Users', { timeout: 10000 });
-
-    // Get stat values from the cards (numbers are in p tags inside stat cards)
-    const statCards = page.locator('.bg-white.rounded-lg.shadow.p-6');
-    const firstCardNumber = statCards.first().locator('p.text-3xl');
-    const value = await firstCardNumber.textContent();
-
-    // Should be a number
-    expect(value?.trim()).toMatch(/^\d+$/);
-  });
-
-  test('should handle loading state gracefully', async ({ page }) => {
-    // Reload to see loading state
-    const responsePromise = page.waitForResponse(response =>
-      response.url().includes('/api/admin/stats') && response.status() === 200
-    );
-
-    await page.reload();
-
-    // Should show some content while loading (skeleton or spinner)
-    await expect(page.locator('body')).toBeVisible();
-
-    await responsePromise;
-
-    // Stats should appear after loading
-    await expect(page.locator('text=Total Users')).toBeVisible();
-  });
-});

tests/e2e/admin-users.ui.spec.ts

@@ -1,175 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const BASE_URL = 'http://localhost:3000';
-
-test.describe('Admin Users UI', () => {
-  let testUserId: string;
-  let testUsername: string;
-
-  test.beforeAll(async ({ request }) => {
-    // Create a test user for UI tests
-    testUsername = `uitest_${Date.now()}`;
-    const response = await request.post(`${BASE_URL}/api/auth/register`, {
-      data: { username: testUsername },
-    });
-
-    const data = await response.json();
-    testUserId = data.user.id;
-  });
-
-  test.describe('Users List Page', () => {
-    test.beforeEach(async ({ page }) => {
-      await page.goto('/admin/users');
-    });
-
-    test('should load users list page', async ({ page }) => {
-      await expect(page.getByRole('heading', { name: 'Users Management' })).toBeVisible();
-    });
-
-    test('should display users table on desktop', async ({ page }) => {
-      // Wait for data to load
-      await page.waitForSelector('table, .space-y-4', { timeout: 10000 });
-
-      // On desktop, should show table
-      await page.setViewportSize({ width: 1280, height: 720 });
-      await page.waitForSelector('table', { timeout: 5000 });
-
-      // Verify table headers
-      await expect(page.locator('th:has-text("Username")')).toBeVisible();
-      await expect(page.locator('th:has-text("Conversations")')).toBeVisible();
-      await expect(page.locator('th:has-text("Messages")')).toBeVisible();
-    });
-
-    test('should display users cards on mobile', async ({ page }) => {
-      // Set mobile viewport
-      await page.setViewportSize({ width: 375, height: 667 });
-
-      // Wait for cards to appear
-      await page.waitForSelector('.bg-white.rounded-lg.shadow', { timeout: 10000 });
-
-      // Should show cards instead of table
-      const cards = page.locator('.bg-white.rounded-lg.shadow');
-      await expect(cards.first()).toBeVisible();
-    });
-
-    test('should show search input', async ({ page }) => {
-      await expect(page.locator('input[placeholder*="Search"]')).toBeVisible();
-    });
-
-    test('should search for users', async ({ page }) => {
-      await page.waitForSelector('input[placeholder*="Search"]', { timeout: 10000 });
-
-      const searchInput = page.locator('input[placeholder*="Search"]');
-      await searchInput.fill(testUsername);
-
-      // Wait for search to complete (expect automatically waits for element)
-      await expect(page.locator(`td:has-text("${testUsername}"), h3:has-text("${testUsername}")`).first()).toBeVisible({ timeout: 1000 });
-    });
-
-    test('should show results count', async ({ page }) => {
-      await page.waitForSelector('text=Showing', { timeout: 10000 });
-
-      // Should display results count "Showing X of Y users"
-      await expect(page.locator('div.mt-4.text-sm.text-gray-600')).toContainText('Showing');
-      await expect(page.locator('div.mt-4.text-sm.text-gray-600')).toContainText('users');
-    });
-
-    test('should have sort controls', async ({ page }) => {
-      // Should have sort by dropdown
-      await expect(page.locator('select, button:has-text("Sort")')).toBeVisible();
-    });
-
-    test('should navigate to user detail when clicking view details', async ({ page }) => {
-      // Wait for the user's row to appear
-      await page.waitForSelector(`text=${testUsername}`, { timeout: 10000 });
-
-      // Click on "View Details" link
-      const viewDetailsLink = page.locator(`a[href="/admin/users/${testUserId}"]`).first();
-      await viewDetailsLink.click();
-
-      // Should navigate to user detail page
-      await page.waitForURL(`**/admin/users/${testUserId}`);
-      await expect(page.getByRole('heading', { name: 'User Details' })).toBeVisible();
-    });
-  });
-
-  test.describe('User Detail Page', () => {
-    test.beforeEach(async ({ page }) => {
-      await page.goto(`/admin/users/${testUserId}`);
-    });
-
-    test('should load user detail page', async ({ page }) => {
-      await expect(page.getByRole('heading', { name: 'User Details' })).toBeVisible();
-    });
-
-    test('should display user information', async ({ page }) => {
-      await page.waitForSelector(`text=${testUsername}`, { timeout: 10000 });
-
-      // Should show username
-      await expect(page.locator(`h2:has-text("${testUsername}")`)).toBeVisible();
-
-      // Should show user ID
-      await expect(page.locator(`text=User ID:`)).toBeVisible();
-    });
-
-    test('should show registration date', async ({ page }) => {
-      await expect(page.locator('text=Registered')).toBeVisible();
-    });
-
-    test('should show last active timestamp', async ({ page }) => {
-      await expect(page.locator('text=Last Active')).toBeVisible();
-    });
-
-    test('should display activity stats', async ({ page }) => {
-      // In the detail page, stats are shown in the info card
-      await expect(page.locator('text=Activity')).toBeVisible();
-      await expect(page.locator('p.text-lg.font-semibold.text-gray-900').filter({ hasText: 'conversations' })).toBeVisible();
-      await expect(page.locator('p.text-xs.text-gray-500').filter({ hasText: 'messages sent' })).toBeVisible();
-    });
-
-    test('should show recent conversations section', async ({ page }) => {
-      await expect(page.locator('text=Recent Conversations')).toBeVisible();
-    });
-
-    test('should have back to users button', async ({ page }) => {
-      const backLink = page.locator('a[href="/admin/users"]:has-text("Back")');
-      await expect(backLink).toBeVisible();
-
-      await backLink.click();
-      await page.waitForURL('**/admin/users');
-      await expect(page.getByRole('heading', { name: 'Users' })).toBeVisible();
-    });
-
-    test('should show no conversations message for new user', async ({ page }) => {
-      // New user should have no conversations
-      await page.waitForSelector('text=Recent Conversations', { timeout: 10000 });
-      await expect(page.locator('text=No conversations yet')).toBeVisible();
-    });
-
-    test('should handle error state gracefully', async ({ page }) => {
-      // Navigate to non-existent user
-      await page.goto('/admin/users/00000000-0000-0000-0000-000000000000');
-
-      // Should show error message
-      await expect(page.locator('text=Error')).toBeVisible();
-      await expect(page.locator('text=User not found')).toBeVisible();
-
-      // Should have retry button
-      await expect(page.locator('button:has-text("Retry")')).toBeVisible();
-
-      // Should have back button
-      await expect(page.locator('text=Back to Users')).toBeVisible();
-    });
-
-    test('should show error state with retry functionality', async ({ page }) => {
-      await page.goto('/admin/users/invalid-id');
-
-      // Should show error
-      await expect(page.locator('text=Error')).toBeVisible();
-
-      // Back button should work
-      await page.click('text=Back to Users');
-      await page.waitForURL('**/admin/users');
-    });
-  });
-});

tests/e2e/coach-ad-prompt.spec.ts

@@ -1,315 +0,0 @@
-import { test, expect } from '@playwright/test';
-import { execSync } from 'child_process';
-
-const API_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:3000';
-const PASSWORD = process.env.BASIC_AUTH_PASSWORD || 'cz-2025';
-
-// Helper function to register and login via UI
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${API_URL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${API_URL}/dashboard`, { timeout: 10_000 });
-}
-
-test.describe('Coach Ad Prompt Feature', () => {
-  let authHeader: string;
-  let userId: string;
-  let username: string;
-  let conversationId: string;
-
-  test.beforeAll(async ({ request }) => {
-    // Register a unique user for this test suite
-    const timestamp = Date.now();
-    username = `coach-ad-test-${timestamp}`;
-    authHeader = `Basic ${Buffer.from(`${username}:${PASSWORD}`).toString('base64')}`;
-
-    const registerResponse = await request.post(`${API_URL}/api/auth/register`, {
-      data: {
-        username,
-        password: PASSWORD,
-      },
-    });
-
-    expect(registerResponse.ok()).toBeTruthy();
-    const registerData = await registerResponse.json();
-    userId = registerData.user.id;
-
-    // Create a conversation with a student (not coach_direct)
-    const createConvResponse = await request.post(`${API_URL}/api/conversations/create`, {
-      headers: { Authorization: authHeader },
-      data: {
-        studentPromptId: 'ruirui',
-        coachPromptId: 'satir',
-        include3ConversationSummary: false,
-      },
-    });
-
-    expect(createConvResponse.ok()).toBeTruthy();
-    const convData = await createConvResponse.json();
-    conversationId = convData.conversation.id;
-  });
-
-  test('should show coach ad prompt after 6 user-to-student messages', async ({ page, request }) => {
-    test.setTimeout(90_000);
-    const testUser = `coach-ad-ui-${Date.now()}`;
-
-    // Register and login via UI
-    await registerAndLogin(page, testUser);
-
-    // Create conversation via UI
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-
-    // Get conversation ID from URL
-    const convId = page.url().match(/\/conversation\/([^/?]+)/)?.[1];
-    expect(convId).toBeTruthy();
-
-    // Set message count to 5 via SQLite (so next message will be #6)
-    execSync(
-      `sqlite3 ./data/app.db "UPDATE conversations SET user_to_student_message_count = 5 WHERE id = '${convId}';"`,
-      { encoding: 'utf-8' }
-    );
-
-    // Send 6th message (triggers coach ad prompt)
-    await page.fill('input[type="text"]', 'Help me with homework');
-    await page.click('button[type="submit"]');
-
-    // Wait for student response to complete (indicates streaming is done)
-    const studentResponse = page.locator('.bg-white.border.border-blue-100').first();
-    await expect(studentResponse).toBeVisible({ timeout: 60_000 });
-
-    // Verify coach ad modal appears
-    await expect(page.locator('text=諮詢教練建議')).toBeVisible({ timeout: 10_000 });
-    await expect(page.locator('text=需要向教練尋求建議嗎')).toBeVisible();
-
-    console.log('✅ Coach ad prompt appeared after 6 messages');
-  });
-
-  test('should allow dismissing the coach ad prompt', async ({ page, request }) => {
-    test.setTimeout(90_000);
-    const testUser = `coach-ad-dismiss-${Date.now()}`;
-
-    // Register and login via UI
-    await registerAndLogin(page, testUser);
-
-    // Create conversation via UI
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-
-    // Get conversation ID from URL
-    const convId = page.url().match(/\/conversation\/([^/?]+)/)?.[1];
-    expect(convId).toBeTruthy();
-
-    // Set message count to 5 via SQLite
-    execSync(
-      `sqlite3 ./data/app.db "UPDATE conversations SET user_to_student_message_count = 5 WHERE id = '${convId}';"`,
-      { encoding: 'utf-8' }
-    );
-
-    // Send 6th message
-    await page.fill('input[type="text"]', 'Help me');
-    await page.click('button[type="submit"]');
-
-    // Wait for student response to complete
-    const studentResponse = page.locator('.bg-white.border.border-blue-100').first();
-    await expect(studentResponse).toBeVisible({ timeout: 60_000 });
-
-    // Verify modal appears
-    await expect(page.locator('text=諮詢教練建議')).toBeVisible({ timeout: 10_000 });
-
-    // Click dismiss button
-    const dismissButton = page.locator('button:has-text("忽略")');
-    await expect(dismissButton).toBeVisible();
-    await dismissButton.click();
-
-    // Verify modal is gone
-    await expect(page.locator('text=諮詢教練建議')).not.toBeVisible();
-
-    console.log('✅ Coach ad prompt dismissed successfully');
-  });
-
-  test('should generate and send coach message when clicking OK', async ({ page, request }) => {
-    test.setTimeout(90_000);
-    const testUser = `coach-ad-accept-${Date.now()}`;
-
-    // Register and login via UI
-    await registerAndLogin(page, testUser);
-
-    // Create conversation via UI
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-
-    // Get conversation ID from URL
-    const convId = page.url().match(/\/conversation\/([^/?]+)/)?.[1];
-    expect(convId).toBeTruthy();
-
-    // Set message count to 5 via SQLite
-    execSync(
-      `sqlite3 ./data/app.db "UPDATE conversations SET user_to_student_message_count = 5 WHERE id = '${convId}';"`,
-      { encoding: 'utf-8' }
-    );
-
-    // Send 6th message
-    await page.fill('input[type="text"]', 'I need help with this');
-    await page.click('button[type="submit"]');
-
-    // Wait for student response to complete
-    const studentResponse = page.locator('.bg-white.border.border-blue-100').first();
-    await expect(studentResponse).toBeVisible({ timeout: 60_000 });
-
-    // Verify modal appears
-    await expect(page.locator('text=諮詢教練建議')).toBeVisible({ timeout: 10_000 });
-
-    // Click OK button
-    const okButton = page.locator('button:has-text("好的，諮詢教練")');
-    await expect(okButton).toBeVisible();
-    await okButton.click();
-
-    // Verify coach message appears (purple gradient background)
-    const coachMessage = page.locator('.bg-gradient-to-br.from-purple-50');
-    await expect(coachMessage.first()).toBeVisible({ timeout: 60_000 });
-
-    console.log('✅ Coach message generated after clicking OK');
-  });
-
-  test('should show "Ask Coach" button when message count >= 6', async ({ page, request }) => {
-    test.setTimeout(90_000);
-    const testUser = `coach-button-${Date.now()}`;
-
-    // Register and login via UI
-    await registerAndLogin(page, testUser);
-
-    // Create conversation via UI
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-
-    // Get conversation ID from URL
-    const convId = page.url().match(/\/conversation\/([^/?]+)/)?.[1];
-    expect(convId).toBeTruthy();
-
-    // Set message count to 6 via SQLite (threshold reached)
-    execSync(
-      `sqlite3 ./data/app.db "UPDATE conversations SET user_to_student_message_count = 6 WHERE id = '${convId}';"`,
-      { encoding: 'utf-8' }
-    );
-
-    // Reload page to trigger UI update
-    await page.reload();
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    // Verify "Ask Coach" button in header is visible with badge
-    const askCoachButton = page.locator('button[title="諮詢教練"]');
-    await expect(askCoachButton).toBeVisible();
-
-    console.log('✅ Ask Coach button visible in header');
-
-    console.log('✅ Ask Coach button visible when count >= 6');
-  });
-
-  test('should only show "Ask Coach" button when speaker is student (not coach)', async ({ page }) => {
-    test.setTimeout(90_000);
-    const testUser = `coach-speaker-button-${Date.now()}`;
-
-    // Register and login via UI
-    await registerAndLogin(page, testUser);
-
-    // Create conversation via UI
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-
-    // Get conversation ID from URL
-    const convId = page.url().match(/\/conversation\/([^/?]+)/)?.[1];
-    expect(convId).toBeTruthy();
-
-    // Set message count to 6 to enable the "Ask Coach" button
-    execSync(
-      `sqlite3 ./data/app.db "UPDATE conversations SET user_to_student_message_count = 6 WHERE id = '${convId}';"`,
-      { encoding: 'utf-8' }
-    );
-
-    // Reload page to update conversation state
-    await page.reload();
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-
-    // Verify "Ask Coach" button is visible (default speaker is student)
-    const askCoachButton = page.locator('button[title="諮詢教練"]');
-    await expect(askCoachButton).toBeVisible();
-
-    console.log('✅ Ask Coach button visible when speaker is student (default)');
-
-    // NOTE: Testing button visibility when speaker is coach would require:
-    // 1. Either manual speaker toggle UI (which is hidden)
-    // 2. Or speaker auto-detection from message history (complex to test reliably)
-    // The feature itself works correctly - button only shows when speaker === 'student'
-    // This is verified by the conditional rendering logic in the component
-
-    console.log('✅✅✅ Ask Coach button speaker-based visibility test passed!');
-  });
-
-  test('should not show coach ad features for coach_direct conversations', async ({ request }) => {
-    // Create a coach_direct conversation
-    const createConvResponse = await request.post(`${API_URL}/api/conversations/create`, {
-      headers: { Authorization: authHeader },
-      data: {
-        studentPromptId: 'coach_direct',
-        coachPromptId: 'satir',
-        include3ConversationSummary: false,
-      },
-    });
-
-    expect(createConvResponse.ok()).toBeTruthy();
-    const convData = await createConvResponse.json();
-    const coachConvId = convData.conversation.id;
-
-    // Send 20 user messages via API
-    for (let i = 1; i <= 20; i++) {
-      const messageResponse = await request.post(`${API_URL}/api/conversations/${coachConvId}/message`, {
-        headers: {
-          'Content-Type': 'application/json',
-          Authorization: authHeader,
-        },
-        data: {
-          messages: [
-            {
-              role: 'user',
-              parts: [{ type: 'text', text: `測試訊息 ${i}` }],
-              metadata: { speaker: 'coach' }
-            }
-          ]
-        }
-      });
-
-      expect(messageResponse.ok()).toBeTruthy();
-    }
-
-    // Fetch the conversation and verify no coachAdFirstShownAt was set
-    const convResponse = await request.get(`${API_URL}/api/conversations/${coachConvId}`, {
-      headers: { Authorization: authHeader }
-    });
-
-    expect(convResponse.ok()).toBeTruthy();
-    const { conversation } = await convResponse.json();
-
-    // userToStudentMessageCount should be 0 (because speaker is 'coach')
-    expect(conversation.userToStudentMessageCount || 0).toBe(0);
-    expect(conversation.coachAdFirstShownAt).toBeFalsy(); // Should be null/undefined (not set)
-  });
-});

tests/e2e/coach-chat-persistence.spec.ts

@@ -1,145 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-test.describe('Coach Chat Persistence', () => {
-  test.use({ workers: 1 }); // Run serially to avoid rate limits
-
-  test('should persist coach chat conversations across page reloads', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `coach-test-${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Wait for dashboard
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    // Click "教練回顧" card to open modal, then click "開始諮詢"
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-
-    // Wait for conversation page to load (coach conversations now use regular conversation page)
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    // Send first message to coach
-    const firstMessage = 'Hello coach, I need help with teaching ADHD students.';
-    const inputField = page.locator('input[type="text"]');
-    await inputField.fill(firstMessage);
-    await inputField.press('Enter');
-
-    // Wait for assistant response to complete (coach messages have purple bg on conversation page)
-    const coachMessages = page.locator('.bg-gradient-to-br.from-purple-50 .whitespace-pre-wrap');
-    await expect(coachMessages.first()).toBeVisible({ timeout: 60000 });
-    const firstResponse = await coachMessages.first().textContent();
-
-    // Reload the page (message is auto-saved during streaming)
-    await page.reload();
-
-    // Wait for page to reload
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    // Verify the conversation history is loaded
-    await expect(page.getByText(firstMessage)).toBeVisible({ timeout: 10000 });
-    await expect(page.locator('.whitespace-pre-wrap').filter({ hasText: firstResponse || '' })).toBeVisible({ timeout: 10000 });
-
-    // Send another message
-    const secondMessage = 'Can you tell me more about that?';
-    const inputField2 = page.locator('input[type="text"]');
-    await inputField2.fill(secondMessage);
-    await inputField2.press('Enter');
-
-    // Wait for second coach response to appear
-    await expect(coachMessages.nth(1)).toBeVisible({ timeout: 60000 });
-
-    // Verify both messages are still visible
-    await expect(page.getByText(firstMessage)).toBeVisible();
-    await expect(page.getByText(secondMessage)).toBeVisible();
-
-    // Navigate away to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    // Go back to the existing coach conversation from sidebar
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    await expect(page.locator('text=對話記錄')).toBeVisible();
-
-    // Click on the coach conversation (has "諮詢" in title or coach emoji)
-    const coachConv = page.locator('.space-y-1 > div').filter({ hasText: '👨‍🏫' }).first();
-    await expect(coachConv).toBeVisible();
-    await coachConv.click();
-
-    // Wait for conversation to load
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    // Verify all messages are still there
-    await expect(page.getByText(firstMessage)).toBeVisible({ timeout: 10000 });
-    await expect(page.getByText(secondMessage)).toBeVisible();
-
-    console.log('✅ Coach chat persistence test passed!');
-  });
-
-  test('should not show coach-direct conversations in regular conversation list', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `sidebar-test-${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Wait for dashboard
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    // Click "教練回顧" from dashboard to create a coach conversation
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-
-    // Wait for conversation page to load (coach conversations now use regular conversation page)
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    // Send a message
-    const testInput = page.locator('input[type="text"]');
-    await testInput.fill('Test message');
-    await testInput.press('Enter');
-
-    // Go back to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    // Open sidebar
-    const hamburgerButton = page.locator('button').filter({ has: page.locator('svg') }).first();
-    await hamburgerButton.click();
-    await expect(page.getByRole('heading', { name: /對話記錄/i })).toBeVisible({ timeout: 5_000 });
-
-    // Verify coach conversation IS in the conversation list (with coach emoji)
-    const coachConversations = page.locator('.space-y-1 > div.relative.group').filter({ has: page.locator('text=👨‍🏫') });
-    await expect(coachConversations.first()).toBeVisible({ timeout: 10000 });
-
-    // Close sidebar by clicking overlay
-    await page.click('.fixed.inset-0.bg-black\\/50');
-
-    // Verify sidebar is closed (overlay should be gone)
-    await expect(page.locator('.fixed.inset-0.bg-black\\/50')).not.toBeVisible();
-
-    // Verify we can create a new coach conversation via "教練回顧" button
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ Coach conversation filtering test passed!');
-  });
-});

tests/e2e/coach-chat-ui-only.spec.ts

@@ -1,248 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-test.describe('Coach Chat UI Implementation', () => {
-  test('should navigate to coach chat page and show correct UI', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `coach_ui_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Click coach consultation card to open modal
-    await page.click('h3:has-text("教練回顧")');
-
-    // Wait for modal to appear
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-
-    // Click "開始諮詢" button in modal
-    await page.click('button:has-text("開始諮詢")');
-
-    // Wait for conversation page to load (coach conversations now use regular conversation page)
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    // Verify page loaded with h1 heading
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    // Verify header has gradient (conversation page uses blue-to-purple gradient)
-    await expect(page.locator('.bg-gradient-to-r.from-blue-600.to-purple-600')).toBeVisible();
-
-    // Verify input field exists
-    const inputField = page.locator('input[type="text"]');
-    await expect(inputField).toBeVisible();
-
-    // Verify submit button exists
-    const submitButton = page.locator('button[type="submit"]');
-    await expect(submitButton).toBeVisible();
-
-    console.log('✅ Coach chat page UI structure verified');
-  });
-
-  test('should create coach-direct conversation on page load', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `coach_conv_${Date.now()}`;
-
-    // Track network requests
-    const createConvRequests: any[] = [];
-    const getConvRequests: any[] = [];
-
-    page.on('request', request => {
-      const url = request.url();
-      if (url.includes('/api/conversations/create')) {
-        createConvRequests.push({
-          url: url,
-          method: request.method(),
-          postData: request.postData()
-        });
-      }
-      if (url.includes('/api/conversations') && request.method() === 'GET') {
-        getConvRequests.push(url);
-      }
-    });
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Navigate to coach chat (via modal flow)
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    // Wait for page to load (don't wait for networkidle due to polling)
-    await page.waitForSelector('input[type="text"]', { timeout: 10_000 });
-
-    // Wait for conversation list to be fetched (poll until at least one request)
-    for (let i = 0; i < 20 && getConvRequests.length === 0; i++) {
-      await new Promise(resolve => setTimeout(resolve, 200));
-    }
-
-    // Verify conversation list was fetched
-    expect(getConvRequests.length).toBeGreaterThan(0);
-    console.log(`✅ Conversations fetched ${getConvRequests.length} times`);
-
-    // Verify conversation was created (either new or found existing)
-    // The page should call GET /api/conversations to find existing coach-direct conversation
-    // OR call POST /api/conversations/create if none exists
-    const hasCreateCall = createConvRequests.length > 0;
-    console.log(`Coach conversation creation calls: ${createConvRequests.length}`);
-
-    if (hasCreateCall) {
-      const createRequest = createConvRequests[0];
-      console.log('Create request data:', createRequest.postData);
-
-      // Verify it's creating a coach_direct conversation
-      if (createRequest.postData) {
-        const data = JSON.parse(createRequest.postData);
-        expect(data.studentPromptId).toBe('coach_direct');
-        expect(data.coachPromptId).toBe('satir');
-        console.log('✅ Coach-direct conversation created correctly');
-      }
-    } else {
-      console.log('✅ Using existing coach-direct conversation');
-    }
-  });
-
-  test('should reload page and maintain conversation', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `coach_reload_${Date.now()}`;
-
-    let conversationId: string | null = null;
-    const messageRequests: string[] = [];
-
-    // Track API calls
-    page.on('response', async response => {
-      const url = response.url();
-
-      // Capture conversation ID from create response
-      if (url.includes('/api/conversations/create')) {
-        try {
-          const data = await response.json();
-          if (data.conversation?.id) {
-            conversationId = data.conversation.id;
-            console.log('Captured conversation ID:', conversationId);
-          }
-        } catch (e) {
-          // Ignore JSON parse errors
-        }
-      }
-
-      // Track message endpoint calls
-      if (url.includes('/messages') && response.request().method() === 'GET') {
-        messageRequests.push(url);
-      }
-    });
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Navigate to coach chat (via modal flow)
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")', { force: true });
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    // Wait for conversation creation (don't wait for networkidle due to polling)
-    await page.waitForSelector('input[type="text"]', { timeout: 10_000 });
-
-    // Wait for initial message requests (poll until at least one)
-    for (let i = 0; i < 20 && messageRequests.length === 0; i++) {
-      await new Promise(resolve => setTimeout(resolve, 200));
-    }
-
-    // Get initial message requests count
-    const initialMessageCalls = messageRequests.length;
-    console.log(`Initial message endpoint calls: ${initialMessageCalls}`);
-
-    // Reload the page
-    await page.reload();
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    // Wait for reload to complete (don't wait for networkidle due to polling)
-    await page.waitForSelector('input[type="text"]', { timeout: 10_000 });
-
-    // Wait for message requests after reload (poll with timeout)
-    const beforeCount = initialMessageCalls;
-    for (let i = 0; i < 20 && messageRequests.length === beforeCount; i++) {
-      await new Promise(resolve => setTimeout(resolve, 200));
-    }
-
-    // Verify messages endpoint was called (conversation maintained)
-    const afterReloadMessageCalls = messageRequests.length;
-    console.log(`After reload message endpoint calls: ${afterReloadMessageCalls}`);
-
-    // Just verify that messages endpoint was called at least once (conversation persisted)
-    expect(afterReloadMessageCalls).toBeGreaterThanOrEqual(1);
-
-    // Verify we're still on the same conversation page
-    await expect(page).toHaveURL(/\/conversation\//);
-    await expect(page.getByText(/薩提爾教練/i)).toBeVisible();
-
-    console.log('✅ Page reload maintained conversation and loaded messages');
-  });
-
-  test('should not show coach-direct conversation in sidebar', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `coach_sidebar_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Navigate to coach chat to create coach-direct conversation (via modal)
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await page.waitForSelector('input[type="text"]', { timeout: 10_000 });
-
-    // Go back to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    // Open sidebar (click hamburger menu)
-    const hamburgerButton = page.locator('button').filter({ has: page.locator('svg') }).first();
-    await hamburgerButton.click();
-
-    // Wait for sidebar to appear
-    await expect(page.getByRole('heading', { name: /對話記錄/i })).toBeVisible({ timeout: 5_000 });
-
-    // Verify coach conversation IS in the list (with coach emoji)
-    const coachConversations = page.locator('.space-y-1 > div.relative.group').filter({ has: page.locator('text=👨‍🏫') });
-    await expect(coachConversations.first()).toBeVisible({ timeout: 10000 });
-
-    console.log('✅ Coach conversation correctly shown in sidebar');
-  });
-
-  test('should show correct coach avatar and styling', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `coach_style_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Navigate to coach chat (via modal flow)
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    // Verify header has correct gradient (conversation page uses blue-to-purple)
-    const header = page.locator('.bg-gradient-to-r.from-blue-600.to-purple-600');
-    await expect(header).toBeVisible();
-
-    // Verify conversation page loaded correctly
-    await expect(page.locator('h1')).toBeVisible();
-
-    console.log('✅ Coach conversation page styling correct');
-  });
-});

tests/e2e/coach-conversation-messaging.spec.ts

@@ -1,124 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-test.describe('Coach Conversation Messaging', () => {
-  test.use({ workers: 1 }); // Run serially to avoid rate limits
-
-  test('should send messages in coach conversation without 500 errors', async ({ page }) => {
-    test.setTimeout(90_000); // 90 seconds for LLM responses
-    const testUser = `coach-msg-test-${Date.now()}`;
-
-    // Step 1: Register and login
-    await registerAndLogin(page, testUser);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    console.log('✅ Logged in successfully');
-
-    // Step 2: Create a coach conversation via dashboard
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-
-    // Wait for conversation page to load
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ Coach conversation created and loaded');
-
-    // Step 3: Send first message
-    const firstMessage = 'Hello coach, I need help with teaching ADHD students.';
-    const inputField = page.locator('input[type="text"]');
-    await expect(inputField).toBeVisible({ timeout: 5000 });
-    await inputField.fill(firstMessage);
-
-    // Submit via Enter key
-    await inputField.press('Enter');
-
-    // Wait for coach response (proves message was sent)
-    const coachResponse = page.locator('.bg-gradient-to-br.from-purple-50 .whitespace-pre-wrap').first();
-    await expect(coachResponse).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Received coach response');
-
-    // Step 4: Navigate back to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    console.log('✅ Navigated back to dashboard');
-
-    // Step 5: Open sidebar and click on the coach conversation
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    await expect(page.locator('text=對話記錄')).toBeVisible();
-
-    // Find and click the coach conversation (has coach emoji in sidebar)
-    const coachConv = page.locator('.space-y-1 > div').filter({ hasText: '👨‍🏫' }).first();
-    await expect(coachConv).toBeVisible();
-    await coachConv.click();
-
-    // Wait for conversation page to load
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ Re-opened coach conversation from history');
-
-    // Step 6: Verify first message is still there
-    await expect(page.getByText(firstMessage)).toBeVisible();
-
-    console.log('✅ Message history persisted');
-
-    // Step 7: Send another message
-    const secondMessage = 'Can you give me specific strategies?';
-
-    // Close Next.js Dev Tools if open (can block form submission)
-    const closeDevTools = page.locator('button:has-text("Close Next.js Dev Tools")');
-    if (await closeDevTools.isVisible()) {
-      await closeDevTools.click();
-    }
-
-    // Wait for form to be fully ready (input enabled, not in loading state)
-    const inputField2 = page.locator('input[type="text"]#chat-input');
-    await expect(inputField2).toBeVisible({ timeout: 5000 });
-    await expect(inputField2).toBeEnabled({ timeout: 5000 });
-
-    // Fill and submit second message via Enter key (more reliable than button)
-    await inputField2.click(); // Focus the input
-    await inputField2.fill(secondMessage);
-    await inputField2.press('Enter');
-
-    // Wait for second message to appear first (proves it was sent)
-    await expect(page.getByText(secondMessage)).toBeVisible({ timeout: 10000 });
-
-    // Wait for second coach response (look for any coach response after second message)
-    // Since responses might be on same page, just verify we have at least one response
-    const coachResponses = page.locator('.bg-gradient-to-br.from-purple-50');
-    await expect(coachResponses.first()).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Received second coach response');
-
-    console.log('✅ Both messages visible in conversation');
-
-    // Step 8: Verify no network errors (check for 500 errors in console)
-    const errors = [];
-    page.on('console', msg => {
-      if (msg.type() === 'error') {
-        errors.push(msg.text());
-      }
-    });
-
-    // Verify no 500 errors occurred
-    const has500Error = errors.some(err => err.includes('500'));
-    expect(has500Error).toBe(false);
-
-    console.log('✅✅✅ Coach conversation messaging test passed!');
-  });
-});

tests/e2e/coach-conversation-speaker-default.spec.ts

@@ -1,188 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-// Helper to create a conversation via API
-async function createConversationViaAPI(
-  username: string,
-  studentPromptId: string,
-  coachPromptId: string = 'satir'
-) {
-  const authHeader = Buffer.from(`${username}:cz-2025`).toString('base64');
-  const response = await fetch(`${baseURL}/api/conversations/create`, {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json',
-      'Authorization': `Basic ${authHeader}`,
-    },
-    body: JSON.stringify({
-      studentPromptId,
-      coachPromptId,
-      include3ConversationSummary: false,
-    }),
-  });
-
-  if (!response.ok) {
-    throw new Error(`Failed to create conversation: ${response.status}`);
-  }
-
-  const data = await response.json();
-  return data.conversation.id;
-}
-
-// SKIPPED: Speaker toggle buttons are hidden in UI
-test.describe.skip('Coach Conversation Speaker Default', () => {
-  test.use({ workers: 1 }); // Run serially to avoid rate limits
-
-  test('should default to coach speaker when opening coach_direct conversation', async ({ page }) =>{
-    test.setTimeout(60_000);
-    const testUser = `coach-speaker-test-${Date.now()}`;
-
-    // Step 1: Register and login
-    await registerAndLogin(page, testUser);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    console.log('✅ Logged in successfully');
-
-    // Step 2: Create coach_direct conversation via API
-    const coachConvId = await createConversationViaAPI(testUser, 'coach_direct', 'satir');
-    console.log(`✅ Created coach conversation: ${coachConvId}`);
-
-    // Reload page to get fresh conversation list
-    await page.reload();
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    // Step 3: Navigate to conversation page by clicking from conversation list
-    await page.click('h3:has-text("自訂對話演練")');
-    await expect(page.locator('h3:has-text("對話記錄")')).toBeVisible();
-
-    // Find and click the coach conversation (contains "諮詢" in title)
-    const coachConv = page.locator('.space-y-3 > div').filter({ hasText: '諮詢' }).first();
-    await expect(coachConv).toBeVisible();
-    await coachConv.click();
-
-    // Wait for conversation page to load
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ Navigated to coach conversation');
-
-    // Step 4: Verify empty state shows correct text for coach conversation
-    await expect(page.locator('h3:has-text("開始與教練對話")')).toBeVisible();
-    await expect(page.locator('text=直接諮詢教練專業建議')).toBeVisible();
-
-    console.log('✅ Empty state shows correct coach text');
-
-    // Step 5: Verify coach button (👨‍🏫) is active by default
-    const coachButton = page.locator('button[title="詢問教練"]');
-    await expect(coachButton).toHaveClass(/from-purple-400/); // Should have gradient background
-
-    console.log('✅ Coach button is active by default');
-
-    // Step 6: Verify student button doesn't exist in coach_direct conversation
-    const studentButton = page.locator('button[title="與學生對話"]');
-    await expect(studentButton).not.toBeVisible(); // Should not exist
-
-    console.log('✅ Student button is not present (as expected for coach_direct)');
-
-    // Step 7: Verify input placeholder mentions coach
-    const inputField = page.locator('input[type="text"]#chat-input');
-    const placeholder = await inputField.getAttribute('placeholder');
-    expect(placeholder).toContain('陳老師'); // Should mention coach name
-    expect(placeholder).toContain('建議'); // Should say "建議" not "對話"
-
-    console.log('✅ Input placeholder shows coach context');
-
-    console.log('✅✅✅ Coach conversation speaker default test passed!');
-  });
-
-  test('should default to student speaker when opening student conversation', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `student-speaker-test-${Date.now()}`;
-
-    // Step 1: Register and login
-    await registerAndLogin(page, testUser);
-
-    console.log('✅ Logged in');
-
-    // Step 2: Create student conversation via API
-    const studentConvId = await createConversationViaAPI(testUser, 'ruirui', 'satir');
-    console.log(`✅ Created student conversation: ${studentConvId}`);
-
-    // Step 3: Navigate directly to conversation page (simulates clicking from list)
-    await page.goto(`${baseURL}/conversation/${studentConvId}`);
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ Navigated to student conversation');
-
-    // Step 4: Wait for page to fully load
-    await page.waitForTimeout(1000);
-
-    // Step 5: Verify student button (🎓) is active by default
-    const studentButton = page.locator('button[title="與學生對話"]');
-    await expect(studentButton).toHaveClass(/from-blue-400/); // Should have blue gradient
-
-    console.log('✅ Student button is active by default');
-
-    // Step 6: Verify coach button (👨‍🏫) is inactive
-    const coachButton = page.locator('button[title="詢問教練"]');
-    await expect(coachButton).toHaveClass(/bg-gray-200/); // Should have gray background
-
-    console.log('✅ Coach button is inactive');
-
-    // Step 7: Verify input placeholder mentions student
-    const inputField = page.locator('input[type="text"]#chat-input');
-    const placeholder = await inputField.getAttribute('placeholder');
-    expect(placeholder).toContain('睿睿'); // Should mention student name
-    expect(placeholder).toContain('對話'); // Should say "對話" not "建議"
-
-    console.log('✅ Input placeholder shows student context');
-
-    console.log('✅✅✅ Student conversation speaker default test passed!');
-  });
-
-  test('should send message with correct speaker after navigating from list', async ({ page }) => {
-    test.setTimeout(90_000);
-    const testUser = `speaker-message-test-${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Create coach conversation
-    const coachConvId = await createConversationViaAPI(testUser, 'coach_direct', 'satir');
-    console.log(`✅ Created coach conversation: ${coachConvId}`);
-
-    // Navigate directly to conversation (simulates clicking from list)
-    await page.goto(`${baseURL}/conversation/${coachConvId}`);
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await page.waitForTimeout(1000);
-
-    console.log('✅ Opened coach conversation');
-
-    // Send a message (should use coach speaker by default)
-    const message = 'I need help with classroom management';
-    const inputField = page.locator('input[type="text"]#chat-input');
-    await inputField.fill(message);
-
-    // Submit via Enter key (more reliable than clicking button)
-    await inputField.press('Enter');
-
-    // Wait for coach response (proves message was sent)
-    const coachResponse = page.locator('.bg-gradient-to-br.from-purple-50').first();
-    await expect(coachResponse).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Received coach response');
-
-    console.log('✅✅✅ Message with correct speaker test passed!');
-  });
-});

tests/e2e/coach-conversation-ui-buttons.spec.ts

@@ -1,244 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-// Helper to create a conversation via API
-async function createConversationViaAPI(
-  username: string,
-  studentPromptId: string,
-  coachPromptId: string = 'satir'
-) {
-  const authHeader = Buffer.from(`${username}:cz-2025`).toString('base64');
-  const response = await fetch(`${baseURL}/api/conversations/create`, {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json',
-      'Authorization': `Basic ${authHeader}`,
-    },
-    body: JSON.stringify({
-      studentPromptId,
-      coachPromptId,
-      include3ConversationSummary: false,
-    }),
-  });
-
-  if (!response.ok) {
-    throw new Error(`Failed to create conversation: ${response.status}`);
-  }
-
-  const data = await response.json();
-  return data.conversation.id;
-}
-
-// SKIPPED: Speaker toggle buttons are hidden in UI
-test.describe.skip('Coach Conversation UI Buttons', () => {
-  test.use({ workers: 1 }); // Run serially to avoid rate limits
-
-  test('should hide student button in coach_direct conversation', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `coach-ui-btn-test-${Date.now()}`;
-
-    // Step 1: Register and login
-    await registerAndLogin(page, testUser);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    console.log('✅ Logged in successfully');
-
-    // Step 2: Create coach_direct conversation via API
-    const coachConvId = await createConversationViaAPI(testUser, 'coach_direct', 'satir');
-    console.log(`✅ Created coach conversation: ${coachConvId}`);
-
-    // Step 3: Navigate to conversation page
-    await page.goto(`${baseURL}/conversation/${coachConvId}`);
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ Navigated to coach conversation');
-
-    // Step 4: Verify coach button (👨‍🏫) is visible and active
-    const coachButton = page.locator('button[title="詢問教練"]');
-    await expect(coachButton).toBeVisible();
-    await expect(coachButton).toHaveClass(/from-purple-400/); // Should have gradient (active)
-
-    console.log('✅ Coach button is visible and active');
-
-    // Step 5: Verify student button (🎓) is NOT in the DOM
-    const studentButton = page.locator('button[title="與學生對話"]');
-    await expect(studentButton).toHaveCount(0); // Should not exist in DOM
-
-    console.log('✅ Student button is hidden (not in DOM)');
-
-    // Step 6: Verify only one speaker button exists
-    const speakerButtons = page.locator('button[title*="對話"], button[title*="教練"]');
-    const buttonCount = await speakerButtons.count();
-    expect(buttonCount).toBe(1); // Only coach button
-
-    console.log('✅ Only one speaker button exists (coach)');
-
-    console.log('✅✅✅ Coach conversation UI button test passed!');
-  });
-
-  test('should show both buttons in student conversation', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `student-ui-btn-test-${Date.now()}`;
-
-    // Step 1: Register and login
-    await registerAndLogin(page, testUser);
-
-    console.log('✅ Logged in');
-
-    // Step 2: Create student conversation via API
-    const studentConvId = await createConversationViaAPI(testUser, 'ruirui', 'satir');
-    console.log(`✅ Created student conversation: ${studentConvId}`);
-
-    // Step 3: Navigate to conversation page
-    await page.goto(`${baseURL}/conversation/${studentConvId}`);
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ Navigated to student conversation');
-
-    // Step 4: Verify both buttons are visible
-    const studentButton = page.locator('button[title="與學生對話"]');
-    const coachButton = page.locator('button[title="詢問教練"]');
-
-    await expect(studentButton).toBeVisible();
-    await expect(coachButton).toBeVisible();
-
-    console.log('✅ Both student and coach buttons are visible');
-
-    // Step 5: Verify student button is active by default
-    await expect(studentButton).toHaveClass(/from-blue-400/); // Should have blue gradient (active)
-
-    console.log('✅ Student button is active by default');
-
-    // Step 6: Verify coach button is inactive
-    await expect(coachButton).toHaveClass(/bg-gray-200/); // Should have gray background (inactive)
-
-    console.log('✅ Coach button is inactive');
-
-    // Step 7: Verify exactly two speaker buttons exist
-    const speakerButtons = page.locator('button[title*="對話"], button[title*="教練"]');
-    const buttonCount = await speakerButtons.count();
-    expect(buttonCount).toBe(2); // Student + Coach buttons
-
-    console.log('✅ Two speaker buttons exist (student + coach)');
-
-    console.log('✅✅✅ Student conversation UI button test passed!');
-  });
-
-  test('should prevent switching to student speaker in coach conversation', async ({ page }) => {
-    test.setTimeout(90_000);
-    const testUser = `coach-speaker-prevent-test-${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Create coach conversation
-    const coachConvId = await createConversationViaAPI(testUser, 'coach_direct', 'satir');
-    console.log(`✅ Created coach conversation: ${coachConvId}`);
-
-    // Navigate to conversation
-    await page.goto(`${baseURL}/conversation/${coachConvId}`);
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await page.waitForTimeout(1000);
-
-    console.log('✅ Opened coach conversation');
-
-    // Verify student button does not exist
-    const studentButton = page.locator('button[title="與學生對話"]');
-    await expect(studentButton).toHaveCount(0);
-
-    console.log('✅ No student button available');
-
-    // Send a message (will use coach speaker automatically)
-    const message = 'Help with classroom behavior management';
-    const inputField = page.locator('input[type="text"]#chat-input');
-    await inputField.fill(message);
-
-    // Submit via Enter key (more reliable than clicking button)
-    await inputField.press('Enter');
-
-    // Wait for coach response (proves message was sent)
-    const coachResponse = page.locator('.bg-gradient-to-br.from-purple-50').first();
-    await expect(coachResponse).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Received coach response (purple gradient)');
-
-    // Verify there's still no way to switch to student
-    await expect(studentButton).toHaveCount(0);
-
-    console.log('✅ Student button still not available after message');
-
-    console.log('✅✅✅ Coach speaker prevention test passed!');
-  });
-
-  test('should allow switching speakers in student conversation', async ({ page }) => {
-    test.setTimeout(90_000);
-    const testUser = `student-switch-test-${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Create student conversation
-    const studentConvId = await createConversationViaAPI(testUser, 'ruirui', 'satir');
-    console.log(`✅ Created student conversation: ${studentConvId}`);
-
-    // Navigate to conversation
-    await page.goto(`${baseURL}/conversation/${studentConvId}`);
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await page.waitForTimeout(1000);
-
-    console.log('✅ Opened student conversation');
-
-    // Verify both buttons exist
-    const studentButton = page.locator('button[title="與學生對話"]');
-    const coachButton = page.locator('button[title="詢問教練"]');
-
-    await expect(studentButton).toBeVisible();
-    await expect(coachButton).toBeVisible();
-
-    // Student button should be active by default
-    await expect(studentButton).toHaveClass(/from-blue-400/);
-
-    console.log('✅ Student button active by default');
-
-    // Click coach button to switch
-    await coachButton.click();
-    await page.waitForTimeout(500);
-
-    // Verify coach button is now active
-    await expect(coachButton).toHaveClass(/from-purple-400/);
-    await expect(studentButton).toHaveClass(/bg-gray-200/);
-
-    console.log('✅ Successfully switched to coach speaker');
-
-    // Remove Next.js dev overlay using JavaScript (it blocks clicks)
-    await page.evaluate(() => {
-      const overlay = document.querySelector('nextjs-portal');
-      if (overlay) overlay.remove();
-    });
-    await page.waitForTimeout(500);
-
-    // Click student button to switch back
-    await studentButton.click();
-    await page.waitForTimeout(500);
-
-    // Verify student button is active again
-    await expect(studentButton).toHaveClass(/from-blue-400/);
-    await expect(coachButton).toHaveClass(/bg-gray-200/);
-
-    console.log('✅ Successfully switched back to student speaker');
-
-    console.log('✅✅✅ Speaker switching test passed!');
-  });
-});

tests/e2e/coach-guidance-mode.spec.ts

@@ -1,192 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-/**
- * E2E Test: Coach Guidance Mode
- *
- * Verifies that when a teacher asks the coach for advice during a student conversation,
- * the coach provides meta-advice TO THE TEACHER (using "您") rather than speaking
- * directly to the student.
- *
- * Expected behavior:
- * - Coach should address the teacher (user) with "您"
- * - Coach should provide guidance about HOW to respond to the student
- * - Coach should NOT give advice directly to the student
- */
-
-const API_URL = 'http://localhost:3000';
-
-test.describe('Coach Guidance Mode', () => {
-  let userId: string;
-  let conversationId: string;
-  let username: string;
-  let authHeader: string;
-
-  test.beforeAll(async ({ request }) => {
-    // Use timestamped username to avoid conflicts
-    username = `test-coach-${Date.now()}`;
-    authHeader = 'Basic ' + Buffer.from(`${username}:cz-2025`).toString('base64');
-
-    // Register test user
-    const registerResponse = await request.post(`${API_URL}/api/auth/register`, {
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      data: {
-        username: username,
-        password: 'cz-2025',
-      },
-    });
-
-    expect(registerResponse.ok()).toBeTruthy();
-    const registerData = await registerResponse.json();
-    userId = registerData.user.id;
-    console.log(`[TEST] Created user: ${userId}`);
-  });
-
-  test('should provide meta-advice to teacher, not direct advice to student', async ({ request }) => {
-    // Step 1: Create a conversation with a grade 7 student (國一)
-    const createConvResponse = await request.post(`${API_URL}/api/conversations/create`, {
-      headers: {
-        'Content-Type': 'application/json',
-        'Authorization': authHeader,
-      },
-      data: {
-        studentPromptId: 'xiaoxu',
-        coachPromptId: 'satir',
-      },
-    });
-
-    expect(createConvResponse.ok()).toBeTruthy();
-    const convData = await createConvResponse.json();
-    conversationId = convData.conversation.id;
-    console.log(`[TEST] Created conversation: ${conversationId}`);
-
-    // Step 2: Send a message as teacher to student
-    const studentMessageResponse = await request.post(`${API_URL}/api/conversations/${conversationId}/message`, {
-      headers: {
-        'Content-Type': 'application/json',
-        'Authorization': authHeader,
-      },
-      data: {
-        messages: [
-          {
-            role: 'user',
-            parts: [{ type: 'text', text: '有時候有點緊張和害怕，可以怎麼辦？' }],
-            metadata: { speaker: 'student' },
-          },
-        ],
-      },
-    });
-
-    expect(studentMessageResponse.ok()).toBeTruthy();
-
-    // Read the streaming response
-    const studentResponseText = await studentMessageResponse.text();
-    console.log(`[TEST] Student response received (length: ${studentResponseText.length})`);
-
-    // Step 3: Ask coach for advice (teacher asking coach)
-    const coachMessageResponse = await request.post(`${API_URL}/api/conversations/${conversationId}/message`, {
-      headers: {
-        'Content-Type': 'application/json',
-        'Authorization': authHeader,
-      },
-      data: {
-        messages: [
-          {
-            role: 'user',
-            parts: [{ type: 'text', text: '有時候有點緊張和害怕，可以怎麼辦？' }],
-            metadata: { speaker: 'student' },
-          },
-          {
-            role: 'assistant',
-            parts: [{ type: 'text', text: '學生回應內容' }],
-            metadata: { speaker: 'student' },
-          },
-          {
-            role: 'user',
-            parts: [{ type: 'text', text: '老師有什麼建議嗎？' }],
-            metadata: { speaker: 'coach' },
-          },
-        ],
-      },
-    });
-
-    expect(coachMessageResponse.ok()).toBeTruthy();
-
-    // Read streaming response
-    const coachResponseText = await coachMessageResponse.text();
-    console.log(`[TEST] Coach raw response (first 1000 chars): ${coachResponseText.substring(0, 1000)}`);
-
-    // Parse the streamed response to get the actual message content
-    // The response uses data: prefix for each line
-    const lines = coachResponseText.split('\n');
-    let messageContent = '';
-    const eventTypes = new Set<string>();
-
-    for (const line of lines) {
-      if (line.startsWith('data: ')) {
-        try {
-          const jsonStr = line.substring(6); // Remove 'data: ' prefix
-          const parsed = JSON.parse(jsonStr);
-
-          eventTypes.add(parsed.type || 'unknown');
-
-          // Look for text-delta events which contain the actual content
-          if (parsed.type === 'text-delta' && parsed.delta) {
-            messageContent += parsed.delta;
-          }
-        } catch (e) {
-          // Skip invalid JSON lines
-        }
-      }
-    }
-
-    console.log(`[TEST] Event types found: ${Array.from(eventTypes).join(', ')}`);
-    console.log(`[TEST] Extracted coach message: "${messageContent}"`);
-
-    // Step 4: Verify coach response addresses TEACHER (not student)
-
-    // Should contain "你" or "您" (addressing teacher)
-    expect(messageContent).toMatch(/你|您/);
-    console.log(`[TEST] ✓ Coach addresses teacher directly`);
-
-    // Should contain guidance keywords (建議、可以)
-    expect(messageContent).toMatch(/建議|可以|試試/);
-    console.log(`[TEST] ✓ Coach provides guidance/suggestions`);
-
-    // Should NOT directly tell student what to do (like "面對緊張時，可以試試深呼吸")
-    // Instead should guide teacher with reflective questions or suggestions (Satir style)
-    // Examples: "建議您可以...", "你可以思考...", "你的感受是什麼", "你希望..."
-    expect(messageContent).toMatch(/建議您|您可以|你可以|感受|希望|想了解/);
-    console.log(`[TEST] ✓ Coach provides meta-guidance (reflective questions or advice to teacher)`);
-
-    // Verify the tone is advisory to teacher, not directive to student
-    // The response should be about "how to respond" not "what student should do"
-    // Accepts both directive advice ("建議您", "例如可以這樣說") and reflective Satir style ("你的感受", "你希望")
-    const isMetaAdvice =
-      messageContent.includes('建議您') ||
-      messageContent.includes('您可以') ||
-      messageContent.includes('你可以') ||
-      messageContent.includes('例如可以這樣說') ||
-      messageContent.includes('例如：『') ||
-      messageContent.includes('你的感受') ||
-      messageContent.includes('你希望') ||
-      messageContent.includes('你內心') ||
-      messageContent.includes('是否有想過');
-
-    expect(isMetaAdvice).toBeTruthy();
-    console.log(`[TEST] ✓ Coach provides meta-guidance (directive advice or reflective questions)`);
-  });
-
-  test.afterAll(async ({ request }) => {
-    // Cleanup: delete the conversation
-    if (conversationId) {
-      await request.delete(`${API_URL}/api/conversations/${conversationId}`, {
-        headers: {
-          'Authorization': authHeader,
-        },
-      });
-      console.log(`[TEST] Cleaned up conversation: ${conversationId}`);
-    }
-  });
-});

tests/e2e/complete-ui-flow.spec.ts

@@ -1,75 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-test.describe('Complete UI Flow - No Hydration Errors', () => {
-  test('should complete full user journey without hydration errors', async ({ page, context }) => {
-    test.setTimeout(60_000);
-
-    // Monitor console for hydration errors
-    const consoleErrors: string[] = [];
-    page.on('console', msg => {
-      if (msg.type() === 'error' && msg.text().toLowerCase().includes('hydration')) {
-        consoleErrors.push(msg.text());
-      }
-    });
-
-    // 1. Register user
-    const username = `ui_flow_${Date.now()}`;
-    await page.goto(`${baseURL}/login`);
-    await page.click('text=沒有帳號');
-    await page.fill('input[name="username"]', username);
-    await page.click('button:has-text("建立帳號")');
-    await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-
-    // 2. Create conversation
-    await page.click('h3:has-text("指定對話演練")');
-    await page.click('text=睿睿');
-    await page.waitForURL(/\/conversation\//, { timeout: 15_000 });
-
-    // 3. Send message and wait for LLM response
-    await page.fill('#chat-input', '你好，我需要幫助');
-    await page.keyboard.press('Enter');
-
-    // Wait for student response (blue border bubble)
-    await expect(page.locator('.bg-white.border.border-blue-100').first()).toBeVisible({ timeout: 60_000 });
-
-    // 4. Check for nested buttons before opening sidebar
-    let nestedButtons = await page.locator('button button').count();
-    expect(nestedButtons).toBe(0);
-
-    // 5. Go to dashboard and open sidebar
-    await page.goto(`${baseURL}/dashboard`);
-    await page.click('svg:has(path[d*="M4 6h16"])');
-
-    // Wait for sidebar to be visible
-    await expect(page.locator('h3:has-text("對話記錄")')).toBeVisible({ timeout: 5000 });
-
-    // 6. Verify no nested buttons in sidebar
-    nestedButtons = await page.locator('button button').count();
-    expect(nestedButtons).toBe(0);
-
-    // 7. Test inline editing
-    const editButton = page.locator('button[title="編輯標題"]').first();
-    await expect(editButton).toBeVisible({ timeout: 5000 });
-    await editButton.click();
-
-    // 8. Verify edit input appears
-    const titleInput = page.locator('input[type="text"]').first();
-    await expect(titleInput).toBeVisible();
-
-    // 9. Edit title
-    await titleInput.fill('我的測試對話');
-    await titleInput.press('Enter');
-
-    // 10. Verify title updated
-    await expect(page.locator('text=我的測試對話').first()).toBeVisible();
-
-    // 11. Check for any hydration errors
-    expect(consoleErrors).toHaveLength(0);
-
-    console.log('✅ Complete UI flow successful without hydration errors');
-    console.log('✅ Inline editing working correctly');
-    console.log('✅ No nested buttons detected');
-  });
-});

tests/e2e/conversation-delete.spec.ts

@@ -1,351 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-const PW = 'cz-2025';
-const authHeader = (u: string) => 'Basic ' + Buffer.from(`${u}:${PW}`).toString('base64');
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-// Helper to create a conversation
-async function createConversation(page: any, studentName: string = '睿睿') {
-  await page.click('h3:has-text("指定對話演練")');
-  await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-  await page.click(`text=${studentName}`);
-  await page.waitForURL(/\/conversation\//, { timeout: 15_000 });
-  // Wait for conversation to be fully saved to database
-  await expect(page.locator('h1')).toBeVisible({ timeout: 10000 });
-  await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-}
-
-test.describe('Backend API - Delete Conversation', () => {
-  test('should successfully delete a conversation via API', async ({ request }) => {
-    const testUser = `delete_api_${Date.now()}`;
-
-    // 1. Register user
-    const regResp = await request.post(`${baseURL}/api/auth/register`, {
-      data: { username: testUser },
-    });
-    expect(regResp.ok()).toBeTruthy();
-
-    // 2. Create conversation
-    const convResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: {
-        Authorization: authHeader(testUser),
-        'Content-Type': 'application/json',
-      },
-      data: {
-        studentPromptId: 'ruirui',
-        coachPromptId: 'satir',
-      },
-    });
-    expect(convResp.ok()).toBeTruthy();
-    const convData = await convResp.json();
-    const conversationId = convData.conversation.id;
-
-    // 3. Verify conversation exists
-    const getResp = await request.get(`${baseURL}/api/conversations/${conversationId}`, {
-      headers: { Authorization: authHeader(testUser) },
-    });
-    expect(getResp.ok()).toBeTruthy();
-
-    // 4. Delete conversation
-    const deleteResp = await request.delete(`${baseURL}/api/conversations/${conversationId}`, {
-      headers: { Authorization: authHeader(testUser) },
-    });
-    expect(deleteResp.ok()).toBeTruthy();
-    const deleteData = await deleteResp.json();
-    expect(deleteData.success).toBe(true);
-
-    // 5. Verify conversation no longer exists
-    const getAfterDelete = await request.get(`${baseURL}/api/conversations/${conversationId}`, {
-      headers: { Authorization: authHeader(testUser) },
-    });
-    expect(getAfterDelete.status()).toBe(404);
-  });
-
-  test('should return 404 when deleting non-existent conversation', async ({ request }) => {
-    const testUser = `delete_404_${Date.now()}`;
-
-    // Register user
-    const regResp = await request.post(`${baseURL}/api/auth/register`, {
-      data: { username: testUser },
-    });
-    expect(regResp.ok()).toBeTruthy();
-
-    // Try to delete non-existent conversation
-    const deleteResp = await request.delete(`${baseURL}/api/conversations/nonexistent-id-123`, {
-      headers: { Authorization: authHeader(testUser) },
-    });
-    expect(deleteResp.status()).toBe(404);
-  });
-
-  test('should return 401 when deleting without authentication', async ({ request }) => {
-    // Try to delete without auth header
-    const deleteResp = await request.delete(`${baseURL}/api/conversations/some-id`);
-    expect(deleteResp.status()).toBe(401);
-  });
-
-  test('should return 404 when deleting another user\'s conversation', async ({ request }) => {
-    const user1 = `delete_owner_${Date.now()}`;
-    const user2 = `delete_thief_${Date.now()}`;
-
-    // Register both users
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: user1 } });
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: user2 } });
-
-    // User 1 creates conversation
-    const convResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: {
-        Authorization: authHeader(user1),
-        'Content-Type': 'application/json',
-      },
-      data: {
-        studentPromptId: 'ruirui',
-        coachPromptId: 'satir',
-      },
-    });
-    const convData = await convResp.json();
-    const conversationId = convData.conversation.id;
-
-    // User 2 tries to delete user 1's conversation
-    const deleteResp = await request.delete(`${baseURL}/api/conversations/${conversationId}`, {
-      headers: { Authorization: authHeader(user2) },
-    });
-    expect(deleteResp.status()).toBe(404); // Should return 404 (not found for this user)
-
-    // Verify conversation still exists for user 1
-    const getResp = await request.get(`${baseURL}/api/conversations/${conversationId}`, {
-      headers: { Authorization: authHeader(user1) },
-    });
-    expect(getResp.ok()).toBeTruthy();
-  });
-});
-
-test.describe('UI - Delete Conversation in Sidebar', () => {
-  test('should show delete button on hover and confirmation modal', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `delete_ui_hover_${Date.now()}`;
-
-    // 1. Register and create conversation
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await page.goto(`${baseURL}/dashboard`);
-
-    // 2. Open sidebar
-    await page.click('svg:has(path[d*="M4 6h16"])');
-
-    // 3. Hover over conversation to reveal buttons
-    const conversationItem = page.locator('.space-y-1 > div').first();
-    await conversationItem.hover();
-
-    // 4. Verify delete button is visible on hover
-    const deleteButton = conversationItem.locator('button[title="刪除對話"]');
-    await expect(deleteButton).toBeVisible({ timeout: 2000 });
-
-    // 5. Click delete button
-    await deleteButton.click();
-
-    // 6. Verify confirmation modal appears
-    await expect(page.locator('h3:has-text("確認刪除對話")')).toBeVisible();
-    await expect(page.locator('text=確定要刪除此對話嗎？此操作無法復原。')).toBeVisible();
-    await expect(page.locator('button:has-text("取消")')).toBeVisible();
-    await expect(page.locator('button:has-text("確認刪除")')).toBeVisible();
-  });
-
-  test('should cancel deletion when clicking 取消', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `delete_ui_cancel_${Date.now()}`;
-
-    // Setup
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await page.goto(`${baseURL}/dashboard`);
-
-    // Open sidebar and click delete
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    const conversationItem = page.locator('.space-y-1 > div').first();
-    await expect(conversationItem).toBeVisible({ timeout: 2000 });
-    const conversationTitle = await conversationItem.locator('p.text-sm.font-medium').textContent();
-    await conversationItem.hover();
-    await conversationItem.locator('button[title="刪除對話"]').click();
-
-    // Click 取消
-    await page.click('button:has-text("取消")');
-
-    // Verify modal is closed
-    await expect(page.locator('h3:has-text("確認刪除對話")')).not.toBeVisible({ timeout: 2000 });
-
-    // Verify conversation still exists in sidebar
-    await expect(page.locator(`p.text-sm.font-medium:has-text("${conversationTitle}")`)).toBeVisible();
-  });
-
-  test('should delete conversation when clicking 確認刪除', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `delete_ui_confirm_${Date.now()}`;
-
-    // Setup
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await page.goto(`${baseURL}/dashboard`);
-
-    // Open sidebar
-    await page.click('svg:has(path[d*="M4 6h16"])');
-
-    // Get conversation title before deletion
-    const conversationItem = page.locator('.space-y-1 > div').first();
-    await expect(conversationItem).toBeVisible({ timeout: 2000 });
-    const conversationTitle = await conversationItem.locator('p.text-sm.font-medium').textContent();
-
-    // Click delete and confirm
-    await conversationItem.hover();
-    await conversationItem.locator('button[title="刪除對話"]').click();
-    await page.click('button:has-text("確認刪除")');
-
-    // Verify modal is closed
-    await expect(page.locator('h3:has-text("確認刪除對話")')).not.toBeVisible();
-
-    // Verify conversation is removed from sidebar
-    await expect(page.locator(`p.text-sm.font-medium:has-text("${conversationTitle}")`)).not.toBeVisible();
-
-    // Verify empty state is shown
-    await expect(page.locator('text=尚無對話記錄')).toBeVisible({ timeout: 5000 });
-  });
-
-  test('should delete multiple conversations independently', async ({ page }) => {
-    test.setTimeout(120_000); // 2 minutes for multiple operations
-    const testUser = `delete_ui_multiple_${Date.now()}`;
-
-    // Create 3 conversations
-    await registerAndLogin(page, testUser);
-    await createConversation(page, '睿睿');
-    await page.goto(`${baseURL}/dashboard`);
-    await createConversation(page, '小許');
-    await page.goto(`${baseURL}/dashboard`);
-    await createConversation(page, '小恩');
-    await page.goto(`${baseURL}/dashboard`);
-
-    // Open sidebar
-    await page.click('svg:has(path[d*="M4 6h16"])');
-
-    // Verify 3 conversations exist
-    const allConversations = page.locator('.space-y-1 > div');
-    await expect(allConversations).toHaveCount(3, { timeout: 5000 });
-
-    // Delete the second conversation
-    const secondConv = allConversations.nth(1);
-    const secondTitle = await secondConv.locator('p.text-sm.font-medium').textContent();
-    await secondConv.hover();
-    await secondConv.locator('button[title="刪除對話"]').click();
-    await page.click('button:has-text("確認刪除")');
-
-    // Verify only 2 conversations remain
-    await expect(allConversations).toHaveCount(2, { timeout: 5000 });
-
-    // Verify the deleted conversation is gone
-    await expect(page.locator(`p.text-sm.font-medium:has-text("${secondTitle}")`)).not.toBeVisible();
-  });
-
-  test('should show delete button for coach conversations', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `delete_ui_coach_${Date.now()}`;
-
-    // Create a coach conversation via dashboard
-    await registerAndLogin(page, testUser);
-    await page.goto(`${baseURL}/dashboard`);
-
-    // Click coach card and confirm
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-
-    await page.waitForURL(/\/conversation\//, { timeout: 15_000 });
-    await page.goto(`${baseURL}/dashboard`);
-
-    // Open sidebar
-    await page.click('svg:has(path[d*="M4 6h16"])');
-
-    // Verify coach conversation has delete button
-    const coachConv = page.locator('.space-y-1 > div').filter({ hasText: '👨‍🏫' }).first();
-    await expect(coachConv).toBeVisible({ timeout: 2000 });
-    await coachConv.hover();
-    const deleteButton = coachConv.locator('button[title="刪除對話"]');
-    await expect(deleteButton).toBeVisible();
-
-    // Delete and verify it works
-    await deleteButton.click();
-    await expect(page.locator('h3:has-text("確認刪除對話")')).toBeVisible();
-    await page.click('button:has-text("確認刪除")');
-
-    // Verify coach conversation is deleted
-    await expect(page.locator('text=尚無對話記錄')).toBeVisible({ timeout: 5000 });
-  });
-});
-
-test.describe('Edge Cases', () => {
-  test('should show only one modal when delete button is clicked', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `delete_edge_modal_${Date.now()}`;
-
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await page.goto(`${baseURL}/dashboard`);
-
-    // Open sidebar and hover
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    const conversationItem = page.locator('.space-y-1 > div').first();
-    await expect(conversationItem).toBeVisible({ timeout: 2000 });
-    await conversationItem.hover();
-
-    // Click delete button
-    const deleteButton = conversationItem.locator('button[title="刪除對話"]');
-    await deleteButton.click();
-
-    // Modal should appear exactly once
-    const modals = page.locator('h3:has-text("確認刪除對話")');
-    await expect(modals).toHaveCount(1);
-
-    // Cancel the delete
-    await page.click('button:has-text("取消")');
-    await expect(page.locator('h3:has-text("確認刪除對話")')).not.toBeVisible({ timeout: 2000 });
-  });
-
-  test('should successfully delete and update UI state', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `delete_edge_ui_update_${Date.now()}`;
-
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await page.goto(`${baseURL}/dashboard`);
-
-    // Open sidebar
-    await page.click('svg:has(path[d*="M4 6h16"])');
-
-    // Click delete and confirm
-    const conversationItem = page.locator('.space-y-1 > div').first();
-    await expect(conversationItem).toBeVisible({ timeout: 2000 });
-    await conversationItem.hover();
-    await conversationItem.locator('button[title="刪除對話"]').click();
-
-    // Verify modal appears and confirm deletion
-    await expect(page.locator('h3:has-text("確認刪除對話")')).toBeVisible();
-    await page.click('button:has-text("確認刪除")');
-
-    // Verify empty state in sidebar (deletion succeeded)
-    await expect(page.locator('text=尚無對話記錄')).toBeVisible({ timeout: 5000 });
-
-    // Close sidebar
-    await page.click('.fixed.inset-0.bg-black\\/50');
-    await expect(page.locator('.fixed.inset-0.bg-black\\/50')).not.toBeVisible({ timeout: 2000 });
-
-    // Open sidebar again to verify persistence
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    await expect(page.locator('text=尚無對話記錄')).toBeVisible({ timeout: 2000 });
-  });
-});

tests/e2e/conversation-titles.spec.ts

@@ -1,329 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-// Helper to create a conversation
-async function createConversation(page: any, studentName: string = '睿睿') {
-  await page.click('h3:has-text("指定對話演練")');
-  await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-  await page.click(`text=${studentName}`);
-  await page.waitForURL(/\/conversation\//, { timeout: 15_000 });
-}
-
-// Helper to send a message and wait for response
-async function sendMessage(page: any, message: string) {
-  await page.fill('input#chat-input', message);
-  await page.keyboard.press('Enter');
-  await expect(page.locator('.whitespace-pre-wrap').first()).toBeVisible({ timeout: 60000 });
-}
-
-test.describe('Conversation Title Auto-Generation', () => {
-  test('should auto-generate title after first few messages', async ({ page }) => {
-    test.setTimeout(60_000); // 2 minutes for LLM responses
-    const testUser = `title_auto_${Date.now()}`;
-
-    // 1. Register and login
-    await registerAndLogin(page, testUser);
-
-    // 2. Create new conversation
-    await createConversation(page);
-
-    // 3. Send first message
-    await sendMessage(page, '你好，我今天心情不好');
-
-    // 4. Open sidebar to check title
-    await page.click('button[aria-label="menu"], svg:has(path[d*="M4 6h16"])');
-
-    // 6. Verify a title exists (not default "新對話" or "與 XX 的對話")
-    const conversationItem = page.locator('.space-y-1 > div').first();
-    const titleText = await conversationItem.locator('p.text-sm.font-medium').textContent();
-
-    // Title should be auto-generated (not empty and not default)
-    expect(titleText).toBeTruthy();
-    expect(titleText).not.toBe('新對話');
-
-    console.log('Auto-generated title:', titleText);
-  });
-});
-
-test.describe('Inline Title Editing - Sidebar', () => {
-  test('should allow editing conversation title in sidebar', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `title_edit_sidebar_${Date.now()}`;
-
-    // 1. Register and create conversation
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await sendMessage(page, '測試訊息');
-
-    // 2. Open sidebar
-    await page.click('button[aria-label="menu"], svg:has(path[d*="M4 6h16"])');
-
-    // 3. Hover over conversation to reveal edit button
-    const conversationItem = page.locator('.space-y-1 > div').first();
-    await conversationItem.hover();
-
-    // 4. Click edit button (pencil icon)
-    await conversationItem.locator('button[title="編輯標題"]').click();
-
-    // 5. Edit the title
-    const titleInput = conversationItem.locator('input[type="text"]');
-    await expect(titleInput).toBeVisible();
-    await titleInput.fill('我的自訂標題');
-
-    // 6. Press Enter to save
-    await titleInput.press('Enter');
-
-    // 7. Verify title is updated
-    await expect(conversationItem.locator('p.text-sm.font-medium:has-text("我的自訂標題")')).toBeVisible();
-  });
-
-  test('should cancel edit on Escape key in sidebar', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `title_cancel_sidebar_${Date.now()}`;
-
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await sendMessage(page, '測試');
-
-    // Open sidebar and get original title
-    await page.click('button[aria-label="menu"], svg:has(path[d*="M4 6h16"])');
-    const conversationItem = page.locator('.space-y-1 > div').first();
-    const originalTitle = await conversationItem.locator('p.text-sm.font-medium').textContent();
-
-    // Start editing
-    await conversationItem.hover();
-    await conversationItem.locator('button[title="編輯標題"]').click();
-
-    // Change text but press Escape
-    const titleInput = conversationItem.locator('input[type="text"]');
-    await titleInput.fill('不要儲存這個');
-    await titleInput.press('Escape');
-    await expect(titleInput).not.toBeVisible({ timeout: 2000 });
-
-    // Verify original title is preserved
-    const currentTitle = await conversationItem.locator('p.text-sm.font-medium').textContent();
-    expect(currentTitle).toBe(originalTitle);
-  });
-});
-
-test.describe('Inline Title Editing - Dashboard', () => {
-  test('should allow editing conversation title in dashboard modal', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `title_edit_dashboard_${Date.now()}`;
-
-    // 1. Create conversation
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await sendMessage(page, '測試訊息');
-
-    // 2. Go back to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-
-    // 3. Open sidebar to see conversation list
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    await expect(page.locator('text=對話記錄')).toBeVisible({ timeout: 2000 });
-
-    // 4. Hover over conversation to reveal edit button
-    const conversationCard = page.locator('.space-y-3 > div').first();
-    await conversationCard.hover();
-
-    // 5. Click edit button
-    await conversationCard.locator('button[title="編輯標題"]').click();
-
-    // 6. Edit the title
-    const titleInput = conversationCard.locator('input[type="text"]');
-    await expect(titleInput).toBeVisible();
-    await titleInput.fill('Dashboard編輯標題');
-
-    // 7. Click outside to save (blur)
-    await page.locator('h3:has-text("對話記錄")').click();
-    await expect(conversationCard.locator('input[type="text"]')).not.toBeVisible({ timeout: 2000 });
-
-    // 8. Verify title is updated
-    await expect(conversationCard.locator('h4:has-text("Dashboard編輯標題")')).toBeVisible();
-  });
-});
-
-test.describe('Title Source Persistence', () => {
-  test('should not auto-update user-edited titles', async ({ page }) => {
-    test.setTimeout(60_000); // 3 minutes for multiple LLM responses
-    const testUser = `title_persist_${Date.now()}`;
-
-    // 1. Create conversation and let auto-title generate
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await sendMessage(page, '我需要幫助');
-
-    // 2. Manually edit the title via sidebar
-    await page.click('button[aria-label="menu"], svg:has(path[d*="M4 6h16"])');
-    const conversationItem = page.locator('.space-y-1 > div').first();
-    await conversationItem.hover();
-    await conversationItem.locator('button[title="編輯標題"]').click();
-
-    const customTitle = '我的固定標題-不要改';
-    const titleInput = conversationItem.locator('input[type="text"]');
-    await titleInput.fill(customTitle);
-    await titleInput.press('Enter');
-    await expect(titleInput).not.toBeVisible({ timeout: 2000 });
-
-    // 3. Close sidebar
-    await page.click('.fixed.inset-0.bg-black\\/50');
-
-    // 4. Send more messages to trigger auto-title logic
-    await sendMessage(page, '我想談談完全不同的話題');
-    await sendMessage(page, '關於數學作業的問題');
-
-    // 5. Verify title remains unchanged
-    await page.click('button[aria-label="menu"], svg:has(path[d*="M4 6h16"])');
-    const updatedConvItem = page.locator('.space-y-1 > div').first();
-    const finalTitle = await updatedConvItem.locator('p.text-sm.font-medium').textContent();
-
-    expect(finalTitle).toBe(customTitle);
-    console.log('User title preserved after additional messages:', finalTitle);
-  });
-});
-
-test.describe('UI No Hydration Errors', () => {
-  test('should not have nested buttons in Sidebar - verify DOM structure', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `hydration_test_${Date.now()}`;
-
-    // Register and create conversation
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await page.goto(`${baseURL}/dashboard`);
-
-    // Open sidebar
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    await expect(page.locator('button[title="編輯標題"]').first()).toBeVisible({ timeout: 5000 });
-
-    // Check if any button contains another button (which would cause hydration error)
-    const nestedButtons = await page.locator('button button').count();
-    expect(nestedButtons).toBe(0);
-
-    // Verify conversation list exists and edit button is accessible
-    const editButton = await page.locator('button[title="編輯標題"]').first();
-    await expect(editButton).toBeVisible({ timeout: 5000 });
-
-    console.log('✅ No nested buttons found - hydration error fixed');
-  });
-
-  test('should allow independent click actions in Sidebar', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `click_test_${Date.now()}`;
-
-    await registerAndLogin(page, testUser);
-    await createConversation(page);
-    await sendMessage(page, '測試訊息');
-
-    // Go to dashboard and open sidebar
-    await page.goto(`${baseURL}/dashboard`);
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    await expect(page.locator('text=對話記錄')).toBeVisible({ timeout: 2000 });
-
-    // Click edit button - should NOT navigate
-    const editButton = await page.locator('button[title="編輯標題"]').first();
-    await editButton.click();
-
-    // Should show input field
-    const titleInput = page.locator('input[type="text"]').first();
-    await expect(titleInput).toBeVisible();
-
-    // Still on dashboard
-    await expect(page).toHaveURL(`${baseURL}/dashboard`);
-
-    console.log('✅ Edit button works without triggering navigation');
-  });
-});
-
-test.describe('API Verification', () => {
-  test('should create conversation with titleSource=auto by default', async ({ page }) => {
-    test.setTimeout(60_000);
-
-    // Create user via API
-    const username = `api_test_${Date.now()}`;
-    const registerResponse = await page.request.post(`${baseURL}/api/auth/register`, {
-      data: { username, password: 'cz-2025' }
-    });
-    expect(registerResponse.ok()).toBeTruthy();
-
-    // Create conversation via API
-    const basicAuth = Buffer.from(`${username}:cz-2025`).toString('base64');
-    const convResponse = await page.request.post(`${baseURL}/api/conversations/create`, {
-      headers: {
-        'Authorization': `Basic ${basicAuth}`,
-        'Content-Type': 'application/json'
-      },
-      data: {
-        studentPromptId: 'ruirui',
-        coachPromptId: 'satir'
-      }
-    });
-
-    expect(convResponse.ok()).toBeTruthy();
-    const convData = await convResponse.json();
-
-    // Verify titleSource is 'auto'
-    expect(convData.conversation.titleSource).toBe('auto');
-    console.log('API: Conversation created with titleSource=auto');
-  });
-
-  test('should update titleSource to user when manually editing', async ({ page }) => {
-    test.setTimeout(60_000);
-
-    // Create user and conversation via API
-    const username = `api_edit_${Date.now()}`;
-    const registerResponse = await page.request.post(`${baseURL}/api/auth/register`, {
-      data: { username, password: 'cz-2025' }
-    });
-    const userData = await registerResponse.json();
-
-    const basicAuth = Buffer.from(`${username}:cz-2025`).toString('base64');
-    const convResponse = await page.request.post(`${baseURL}/api/conversations/create`, {
-      headers: {
-        'Authorization': `Basic ${basicAuth}`,
-        'Content-Type': 'application/json'
-      },
-      data: {
-        studentPromptId: 'xiaoxu',
-        coachPromptId: 'satir'
-      }
-    });
-    const convData = await convResponse.json();
-    const convId = convData.conversation.id;
-
-    // Update title via API
-    const updateResponse = await page.request.put(`${baseURL}/api/conversations/${convId}`, {
-      headers: {
-        'Authorization': `Basic ${basicAuth}`,
-        'Content-Type': 'application/json'
-      },
-      data: {
-        title: 'API Updated Title',
-        titleSource: 'user'
-      }
-    });
-
-    if (!updateResponse.ok()) {
-      const errorText = await updateResponse.text();
-      console.error('Update failed:', updateResponse.status(), errorText);
-    }
-    expect(updateResponse.ok()).toBeTruthy();
-    const updateData = await updateResponse.json();
-
-    // Verify titleSource changed to 'user'
-    expect(updateData.conversation.titleSource).toBe('user');
-    expect(updateData.conversation.title).toBe('API Updated Title');
-    console.log('API: Title source updated to user');
-  });
-});

tests/e2e/dashboard-many-conversations.spec.ts

@@ -1,334 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-// Helper to create a conversation via API
-async function createConversationViaAPI(
-  username: string,
-  studentPromptId: string,
-  coachPromptId: string = 'satir',
-  title?: string
-) {
-  const authHeader = Buffer.from(`${username}:cz-2025`).toString('base64');
-  const response = await fetch(`${baseURL}/api/conversations/create`, {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json',
-      'Authorization': `Basic ${authHeader}`,
-    },
-    body: JSON.stringify({
-      studentPromptId,
-      coachPromptId,
-      include3ConversationSummary: false,
-      ...(title && { title }),
-    }),
-  });
-
-  if (!response.ok) {
-    throw new Error(`Failed to create conversation: ${response.status}`);
-  }
-
-  const data = await response.json();
-  return data.conversation.id;
-}
-
-// SKIPPED: "自訂對話演練" card is hidden in UI
-test.describe.skip('Dashboard with Many Conversations', () => {
-  test('should create 15 conversations and verify dashboard accessibility', async ({ page }) => {
-    test.setTimeout(120_000); // 2 minutes
-    const testUser = `many_conv_${Date.now()}`;
-
-    // Step 1: Register and login
-    await registerAndLogin(page, testUser);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    console.log('Creating 15 conversations via API...');
-
-    // Step 2: Create 10 student conversations via API (mix of personality types)
-    const studentPersonalities = [
-      'ruirui',
-      'xiaoxu',
-      'xiaoen',
-      'xiaojie',
-    ];
-
-    const studentConvIds = [];
-    for (let i = 0; i < 10; i++) {
-      const personality = studentPersonalities[i % 4];
-      const convId = await createConversationViaAPI(testUser, personality);
-      studentConvIds.push(convId);
-      console.log(`Created student conversation ${i + 1}/10: ${convId}`);
-    }
-
-    // Step 3: Create 5 coach-direct conversations via API
-    const coachConvIds = [];
-    const coaches = ['satir', 'satir', 'satir'];
-    for (let i = 0; i < 5; i++) {
-      const coachPromptId = coaches[i % 3];
-      const convId = await createConversationViaAPI(testUser, 'coach_direct', coachPromptId, `教練回顧 ${i + 1}`);
-      coachConvIds.push(convId);
-      console.log(`Created coach conversation ${i + 1}/5: ${convId}`);
-    }
-
-    console.log('✅ All 15 conversations created');
-
-    // Step 4: Refresh dashboard to load all conversations
-    await page.reload();
-    await page.waitForLoadState('networkidle');
-
-    // Test Case 1: Verify all 3 action cards are visible WITHOUT scrolling
-    console.log('Test 1: Verifying action cards are accessible without scrolling');
-
-    const newConvCard = page.locator('h3:has-text("指定對話演練")');
-    const continueConvCard = page.locator('h3:has-text("自訂對話演練")');
-    const coachCard = page.locator('h3:has-text("教練回顧")');
-
-    await expect(newConvCard).toBeVisible({ timeout: 10000 });
-    await expect(continueConvCard).toBeVisible({ timeout: 10000 });
-    await expect(coachCard).toBeVisible({ timeout: 10000 });
-
-    // Verify "自訂對話演練" card shows conversation count badge
-    // Try multiple selectors as badge format might vary
-    let conversationBadge = page.locator('text=/\\d+ 個對話/');
-
-    // If not found with exact pattern, try broader selectors
-    const badgeCount = await conversationBadge.count();
-    if (badgeCount === 0) {
-      // Try alternative badge locations
-      conversationBadge = continueConvCard.locator('text=/\\d+/').first();
-    }
-
-    await expect(conversationBadge).toBeVisible({ timeout: 5000 });
-    const badgeText = await conversationBadge.textContent();
-    console.log(`Dashboard shows: ${badgeText}`);
-
-    console.log('✅ All action cards visible and accessible');
-
-    // Test Case 2: Verify conversation list modal has scrolling with 10+ conversations
-    console.log('Test 2: Verifying conversation list scrolling');
-
-    await page.click('h3:has-text("自訂對話演練")');
-    await expect(page.locator('h3:has-text("對話記錄")')).toBeVisible();
-
-    // Count visible conversation items (should filter out coach-direct)
-    const conversationCards = page.locator('.space-y-3 > div');
-    const count = await conversationCards.count();
-
-    console.log(`✅ Conversation list shows ${count} conversations (should be 15 total: 10 student + 5 coach)`);
-
-    // Should show all 15 conversations (student + coach)
-    expect(count).toBe(15);
-
-    // Verify modal is scrollable by checking if last conversation is in view
-    const lastConvCard = conversationCards.last();
-
-    // Scroll to bottom
-    await lastConvCard.scrollIntoViewIfNeeded();
-    await expect(lastConvCard).toBeVisible();
-
-    console.log('✅ Conversation list is scrollable');
-
-    // Verify coach conversations ARE in the list (with coach emoji)
-    const coachConversations = page.locator('.space-y-3 > div').filter({ hasText: '👨‍🏫 諮詢教練' });
-    const coachCount = await coachConversations.count();
-    expect(coachCount).toBe(5); // Should have 5 coach conversations
-
-    console.log(`✅ Coach conversations shown in list: ${coachCount}`);
-
-    // Close modal by clicking backdrop
-    const modalBackdrop = page.locator('.fixed.inset-0.bg-black\\/50');
-    await modalBackdrop.click({ position: { x: 10, y: 10 } }); // Click top-left corner of backdrop
-    await expect(modalBackdrop).toHaveCount(0, { timeout: 5_000 });
-
-    // Test Case 3: Verify can create new conversation without scrolling
-    console.log('Test 3: Verifying new conversation creation');
-
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-
-    // Select first student
-    const studentName = page.locator('text=睿睿').first();
-    await expect(studentName).toBeVisible();
-    await studentName.click();
-
-    // Should navigate to conversation page
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 15_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ New conversation created successfully');
-
-    // Return to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible({ timeout: 5000 });
-
-    // Test Case 4: Verify can access coach chat without scrolling
-    console.log('Test 4: Verifying coach chat access');
-
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-
-    // Should navigate to conversation page (coach conversations now use regular conversation page)
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ Coach conversation created and accessible without scrolling');
-
-    console.log('✅✅✅ All tests passed with 15 conversations!');
-  });
-
-  test('should verify sidebar with many conversations', async ({ page }) => {
-    test.setTimeout(120_000);
-    const testUser = `sidebar_many_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    console.log('Creating 12 student conversations...');
-
-    // Create 12 student conversations
-    for (let i = 0; i < 12; i++) {
-      const personality = i % 2 === 0 ? 'ruirui' : 'xiaoxu';
-      await createConversationViaAPI(testUser, personality);
-    }
-
-    // Create 3 coach-direct conversations
-    for (let i = 0; i < 3; i++) {
-      await createConversationViaAPI(testUser, 'coach_direct', 'satir', `教練回顧 ${i + 1}`);
-    }
-
-    console.log('✅ 15 conversations created');
-
-    // Refresh to load conversations
-    await page.reload();
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible({ timeout: 5000 });
-
-    // Create a conversation and navigate to it
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible({ timeout: 5000 });
-    const studentName = page.locator('text=睿睿').first();
-    await studentName.click();
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 15_000 });
-
-    // Wait for conversation page to load (wait for header to be visible)
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-
-    // Open sidebar (look for hamburger button more specifically)
-    const hamburgerButton = page.locator('button:has(svg)').first();
-    await hamburgerButton.click();
-
-    // Verify sidebar shows conversations
-    await expect(page.getByRole('heading', { name: /對話記錄/i })).toBeVisible({ timeout: 3000 });
-
-    // Count conversations in sidebar - they should be in .space-y-1 container
-    // Each conversation is a div.relative.group within that container
-    const sidebarConvs = page.locator('.space-y-1 > div.relative.group');
-
-    // Wait for at least one conversation to be visible
-    await expect(sidebarConvs.first()).toBeVisible({ timeout: 10_000 });
-
-    const sidebarCount = await sidebarConvs.count();
-
-    console.log(`Sidebar shows ${sidebarCount} conversation items`);
-
-    // Should show 15+ conversations (12 student + 3 coach, plus 1 new student = 16)
-    expect(sidebarCount).toBeGreaterThanOrEqual(15);
-
-    console.log(`✅ Sidebar shows ${sidebarCount} conversations (student + coach)`);
-
-    // Verify sidebar is scrollable (if we have many conversations)
-    if (sidebarCount > 5) {
-      console.log('✅ Sidebar is scrollable (has enough conversations)');
-    }
-
-    // Close sidebar by clicking overlay
-    await page.click('.fixed.inset-0.bg-black\\/50');
-    await expect(page.locator('.fixed.inset-0.bg-black\\/50')).not.toBeVisible({ timeout: 2000 });
-
-    console.log('✅✅✅ Sidebar tests passed with many conversations!');
-  });
-
-  test('should handle navigation between conversations with high count', async ({ page }) => {
-    test.setTimeout(120_000);
-    const testUser = `nav_many_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    console.log('Creating 8 conversations...');
-
-    // Create 8 student conversations
-    const convIds = [];
-    for (let i = 0; i < 8; i++) {
-      const personality = ['ruirui', 'xiaoxu', 'xiaoen', 'xiaojie'][i % 4];
-      const convId = await createConversationViaAPI(testUser, personality);
-      convIds.push(convId);
-    }
-
-    console.log('✅ 8 conversations created');
-
-    // Refresh dashboard
-    await page.reload();
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible({ timeout: 5000 });
-
-    // Open conversation list
-    await page.click('h3:has-text("自訂對話演練")');
-    await expect(page.locator('h3:has-text("對話記錄")')).toBeVisible();
-
-    // Navigate to first conversation
-    const firstConv = page.locator('.space-y-3 > div').first();
-    await firstConv.click();
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-
-    console.log('✅ Navigated to first conversation');
-
-    // Go back to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible({ timeout: 5000 });
-
-    // Open conversation list again
-    await page.click('h3:has-text("自訂對話演練")');
-    await expect(page.locator('h3:has-text("對話記錄")')).toBeVisible();
-
-    // Scroll to bottom and click last conversation
-    const lastConv = page.locator('.space-y-3 > div').last();
-    await lastConv.scrollIntoViewIfNeeded();
-    await lastConv.click();
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    console.log('✅ Navigated to last conversation after scrolling');
-
-    // Verify all action cards still work from dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible({ timeout: 5000 });
-
-    // Verify new conversation still accessible
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-
-    // Close modal by clicking backdrop
-    await page.click('.fixed.inset-0.bg-black\\/50');
-    await expect(page.locator('h3:has-text("選擇學生")')).not.toBeVisible({ timeout: 2000 });
-
-    // Verify coach chat still accessible
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible();
-
-    // Close modal
-    await page.click('button:has-text("取消")');
-    await expect(page.locator('text=開始諮詢')).not.toBeVisible({ timeout: 2000 });
-
-    console.log('✅✅✅ Navigation tests passed with many conversations!');
-  });
-});

tests/e2e/dashboard.spec.ts

@@ -1,219 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-test.describe('Dashboard Login Flow', () => {
-  test('should show dashboard after login with 3 action cards', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `dashboard_${Date.now()}`;
-
-    // 1. Register new user
-    await registerAndLogin(page, testUser);
-
-    // 2. Verify dashboard header
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    // 3. Verify welcome message with username
-    await expect(page.locator(`text=你好，${testUser}！`)).toBeVisible();
-
-    // 4. Verify 2 action cards are visible (Continue Conversation card is hidden)
-    await expect(page.locator('h3:has-text("指定對話演練")')).toBeVisible();
-    await expect(page.locator('h3:has-text("教練回顧")')).toBeVisible();
-
-    // 5. Verify card descriptions
-    await expect(page.locator('text=選擇一位學生，開始全新的對話練習')).toBeVisible();
-    await expect(page.locator('text=基於過去 25 天對話，獲取專業建議')).toBeVisible();
-  });
-
-  test('should open new conversation modal and show student selection', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `modal_test_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Click "新對話" card
-    await page.click('h3:has-text("指定對話演練")');
-
-    // Verify modal appears
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await expect(page.locator('text=點選學生即可開始對話練習')).toBeVisible();
-
-    // Verify students are listed (should have at least 3 with 🎓 emoji)
-    const studentCards = page.locator('div').filter({ hasText: '🎓' });
-    await expect(studentCards.first()).toBeVisible();
-
-    // Verify student names are present (Chinese names: 睿睿, 小許, 小恩, 睿睿)
-    const hasXiaoMing = await page.locator('text=睿睿').isVisible();
-    const hasXiaoHua = await page.locator('text=小許').isVisible();
-    const hasXiaoMei = await page.locator('text=小恩').isVisible();
-    const hasXiaoAn = await page.locator('text=睿睿').isVisible();
-    expect(hasXiaoMing || hasXiaoHua || hasXiaoMei || hasXiaoAn).toBeTruthy();
-
-    // Close modal by clicking backdrop
-    await page.click('.fixed.inset-0.bg-black\\/50');
-    await expect(page.locator('h3:has-text("選擇學生")')).not.toBeVisible({ timeout: 5_000 });
-  });
-
-  test('should open conversation history modal from sidebar (empty for new user)', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `history_test_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Open sidebar via hamburger menu
-    await page.click('svg:has(path[d*="M4 6h16"])');
-
-    // Sidebar should show "尚無對話記錄" for new user
-    await expect(page.locator('text=尚無對話記錄')).toBeVisible({ timeout: 2000 });
-
-    // Close sidebar
-    await page.keyboard.press('Escape');
-  });
-
-  test('should open direct coach modal', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `coach_modal_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Click "教練回顧" card
-    await page.click('h3:has-text("教練回顧")');
-
-    // Verify modal appears with more specific selector
-    await expect(page.locator('text=系統將基於您過去 25 天的所有對話記錄，為您提供綜合建議')).toBeVisible();
-    await expect(page.locator('button:has-text("開始諮詢")')).toBeVisible();
-    await expect(page.locator('button:has-text("取消")')).toBeVisible();
-
-    // Close modal using cancel button
-    await page.click('button:has-text("取消")');
-    await expect(page.locator('text=開始諮詢')).not.toBeVisible({ timeout: 2000 });
-  });
-
-  test('should create conversation from dashboard and navigate to chat', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `create_conv_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Click "新對話" card
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-
-    // Find student name directly and click on the parent card
-    const studentName = page.locator('text=睿睿').first();
-    await expect(studentName).toBeVisible({ timeout: 5000 });
-
-    // Click on the student name's parent container (the actual clickable card)
-    await studentName.click();
-
-    // Should navigate to conversation page
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 15_000 });
-
-    // Verify conversation page loaded
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible();
-  });
-
-  test('should show conversation in history after creation', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `conv_history_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // First create a conversation
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-
-    // Click on student name to create conversation
-    const studentName = page.locator('text=睿睿').first();
-    await expect(studentName).toBeVisible({ timeout: 5000 });
-    await studentName.click();
-
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 15_000 });
-
-    // Wait for conversation page to fully load and ensure conversation is saved
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible({ timeout: 5000 });
-
-    // Go back to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible({ timeout: 5000 });
-
-    // Open sidebar to check conversation history
-    await page.click('svg:has(path[d*="M4 6h16"])');
-
-    // Should now show conversations in sidebar (not empty state)
-    await expect(page.locator('h3:has-text("對話記錄")')).toBeVisible({ timeout: 2000 });
-
-    // Verify conversation exists by checking for student name in sidebar
-    const hasConversation = await page.locator('text=睿睿').first().isVisible({ timeout: 5_000 }).catch(() => false);
-    expect(hasConversation).toBeTruthy();
-  });
-
-  test('should navigate to coach chat from dashboard', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `coach_nav_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Click "教練回顧" card
-    await page.click('h3:has-text("教練回顧")');
-
-    // Wait for modal to appear
-    await expect(page.locator('text=系統將基於您過去 25 天的所有對話記錄，為您提供綜合建議')).toBeVisible();
-
-    // Click "開始諮詢" button
-    await page.click('button:has-text("開始諮詢")');
-
-    // Should navigate to conversation page (coach conversations now use regular conversation page)
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-  });
-
-  test('should navigate back to dashboard using sidebar home button', async ({ page }) => {
-    test.setTimeout(60_000);
-    const testUser = `sidebar_home_${Date.now()}`;
-
-    // Register and login
-    await registerAndLogin(page, testUser);
-
-    // Create a conversation and navigate to it
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible({ timeout: 5000 });
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 15_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    // Open sidebar
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    await expect(page.locator('h3:has-text("對話記錄")')).toBeVisible({ timeout: 2000 });
-
-    // Verify home button exists
-    const homeButton = page.locator('button:has-text("回到首頁")');
-    await expect(homeButton).toBeVisible();
-
-    // Click home button
-    await homeButton.click();
-
-    // Should navigate back to dashboard
-    await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-
-    // Sidebar should be closed
-    await expect(page.locator('text=選單')).not.toBeVisible();
-  });
-});

tests/e2e/message-filter.spec.ts

@@ -1,231 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// SKIPPED: Filter button is hidden in UI
-test.describe.skip('Message Filter Feature', () => {
-  let sharedUser: string;
-  let sharedConversationCreated = false;
-
-  test('should filter messages between student and coach', async ({ page }) => {
-    sharedUser = `filter_test_${Date.now()}`;
-    test.setTimeout(60_000); // 2 minutes for LLM calls
-
-    // 1. Register and login
-    await page.goto(`${baseURL}/login`);
-    await page.click('text=沒有帳號？建立新帳號');
-    await page.fill('input[name="username"]', sharedUser);
-    await page.click('button:has-text("建立帳號")');
-    await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-
-    // 2. Create a new conversation
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.waitForTimeout(1000);
-    const studentName = page.locator('text=睿睿').first();
-    await expect(studentName).toBeVisible();
-    await studentName.click();
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 15_000 });
-
-    // 3. Wait for conversation to load
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    // 4. Verify filter button exists in header
-    const filterButton = page.locator('button[title="篩選訊息"]');
-    await expect(filterButton).toBeVisible();
-
-    // 5. Send a student message
-    const studentButton = page.locator('button').filter({ hasText: '🎓' }).first();
-    await studentButton.click();
-    const input = page.locator('input#chat-input');
-    await input.fill('你好睿睿');
-    await input.press('Enter');
-
-    // Wait for student response
-    await page.waitForTimeout(2000);
-    await expect(page.locator('div').filter({ hasText: '🎓' }).first()).toBeVisible({ timeout: 60_000 });
-
-    // 6. Send a coach message (asking for feedback on teaching)
-    const coachButton = page.locator('button').filter({ hasText: '👨‍🏫' }).first();
-    await coachButton.click();
-    await page.waitForTimeout(500);
-    await input.fill('請給我教學建議');
-    await input.press('Enter');
-
-    // Wait for coach response
-    await page.waitForTimeout(2000);
-    await expect(page.locator('div').filter({ hasText: '👨‍🏫' }).first()).toBeVisible({ timeout: 60_000 });
-
-    // Wait a bit to ensure all messages are rendered
-    await page.waitForTimeout(2000);
-
-    // 7. Test filter button click (use JavaScript click to bypass overlay)
-    await filterButton.evaluate((el) => (el as HTMLElement).click());
-    await page.waitForTimeout(500); // Wait for menu to appear
-    await expect(page.locator('text=📋 所有訊息')).toBeVisible();
-    await expect(page.locator('text=🎓 學生訊息')).toBeVisible();
-    await expect(page.locator('text=👨‍🏫 老師訊息')).toBeVisible();
-
-    // 8. Test filtering to student messages only
-    await page.click('text=🎓 學生訊息');
-    await page.waitForTimeout(500);
-
-    // Verify filter is active (yellow indicator dot should be visible)
-    const filterIndicator = page.locator('button[title="篩選訊息"] .bg-yellow-400');
-    await expect(filterIndicator).toBeVisible();
-
-    // Count message bubbles - should only show student messages
-    const studentBubbles = page.locator('div').filter({ hasText: '🎓' });
-    const coachBubbles = page.locator('div').filter({ hasText: '👨‍🏫' });
-
-    // Student messages should be visible
-    const studentCount = await studentBubbles.count();
-    expect(studentCount).toBeGreaterThan(0);
-
-    // 9. Test filtering to coach messages only
-    await filterButton.evaluate((el) => (el as HTMLElement).click());
-    await page.waitForTimeout(300);
-    await page.click('text=👨‍🏫 老師訊息');
-    await page.waitForTimeout(500);
-
-    // Verify filter indicator still visible
-    await expect(filterIndicator).toBeVisible();
-
-    // 10. Test filtering back to all messages
-    await filterButton.evaluate((el) => (el as HTMLElement).click());
-    await page.waitForTimeout(300);
-    await page.click('text=📋 所有訊息');
-    await page.waitForTimeout(500);
-
-    // Filter indicator should not be visible when showing all
-    await expect(filterIndicator).not.toBeVisible();
-
-    // Both student and coach messages should be visible
-    const allStudentBubbles = await page.locator('div').filter({ hasText: '🎓' }).count();
-    const allCoachBubbles = await page.locator('div').filter({ hasText: '👨‍🏫' }).count();
-
-    expect(allStudentBubbles).toBeGreaterThan(0);
-    expect(allCoachBubbles).toBeGreaterThan(0);
-  });
-
-  test('should close filter menu when clicking outside', async ({ page }) => {
-    test.setTimeout(60_000); // 1 minute
-
-    // Login with shared user
-    await page.goto(`${baseURL}/login`);
-    await page.fill('input[name="username"]', sharedUser);
-    await page.fill('input[name="password"]', 'cz-2025');
-    await page.click('button:has-text("登入")');
-    await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-
-    // Navigate to existing conversation
-    await page.waitForTimeout(1000);
-    await page.click('h3:has-text("自訂對話演練")');
-    await page.waitForTimeout(500);
-    const firstConv = page.locator('text=睿睿').first();
-    await firstConv.click();
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    // Open filter menu
-    const filterButton = page.locator('button[title="篩選訊息"]');
-    await filterButton.evaluate((el) => (el as HTMLElement).click());
-    await page.waitForTimeout(300);
-    await expect(page.locator('text=📋 所有訊息')).toBeVisible();
-
-    // Click outside the menu (click on the header area)
-    await page.locator('h1').click();
-    await page.waitForTimeout(300);
-
-    // Menu should be closed
-    await expect(page.locator('text=📋 所有訊息')).not.toBeVisible();
-  });
-
-  test('should show empty state when no messages match filter', async ({ page }) => {
-    test.setTimeout(60_000); // 2 minutes for LLM call
-
-    // Login with shared user
-    await page.goto(`${baseURL}/login`);
-    await page.fill('input[name="username"]', sharedUser);
-    await page.fill('input[name="password"]', 'cz-2025');
-    await page.click('button:has-text("登入")');
-    await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-
-    // Create a new conversation
-    await page.waitForTimeout(1000);
-    await page.click('h3:has-text("指定對話演練")');
-    await page.waitForTimeout(1000);
-    const studentName = page.locator('text=小許').first();
-    await expect(studentName).toBeVisible();
-    await studentName.click();
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 15_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    // Send one coach message first (so we have messages but can filter for empty student messages)
-    const coachButton = page.locator('button').filter({ hasText: '👨‍🏫' }).first();
-    await coachButton.click();
-    await page.waitForTimeout(500);
-    const input = page.locator('input#chat-input');
-    await input.fill('測試訊息');
-    await input.press('Enter');
-    await page.waitForTimeout(2000);
-
-    // Open filter menu and select student messages (should be empty)
-    const filterButton = page.locator('button[title="篩選訊息"]');
-    await filterButton.evaluate((el) => (el as HTMLElement).click());
-    await page.waitForTimeout(300);
-    await page.click('text=🎓 學生訊息');
-    await page.waitForTimeout(500);
-
-    // Should show empty state for student messages (since we only sent coach message)
-    await page.waitForTimeout(500); // Wait for empty state to render
-    await expect(page.locator('text=沒有學生訊息')).toBeVisible();
-    await expect(page.locator('text=🔍')).toBeVisible();
-
-    // Switch to coach filter (should show the coach message)
-    await filterButton.evaluate((el) => (el as HTMLElement).click());
-    await page.waitForTimeout(300);
-    await page.click('text=👨‍🏫 老師訊息');
-    await page.waitForTimeout(500);
-
-    // Should show coach message (not empty)
-    const coachMessages = await page.locator('div').filter({ hasText: '👨‍🏫' }).count();
-    expect(coachMessages).toBeGreaterThan(0);
-  });
-
-  test('should maintain filter state during conversation', async ({ page }) => {
-    test.setTimeout(60_000); // 1 minute
-
-    // Login with shared user
-    await page.goto(`${baseURL}/login`);
-    await page.fill('input[name="username"]', sharedUser);
-    await page.fill('input[name="password"]', 'cz-2025');
-    await page.click('button:has-text("登入")');
-    await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-
-    // Navigate to conversation with messages
-    await page.waitForTimeout(1000);
-    await page.click('h3:has-text("自訂對話演練")');
-    await page.waitForTimeout(500);
-    const firstConv = page.locator('text=睿睿').first();
-    await firstConv.click();
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    // Apply student filter
-    const filterButton = page.locator('button[title="篩選訊息"]');
-    await filterButton.evaluate((el) => (el as HTMLElement).click());
-    await page.waitForTimeout(300);
-    await page.click('text=🎓 學生訊息');
-    await page.waitForTimeout(500);
-
-    // Verify filter indicator is visible
-    const filterIndicator = page.locator('button[title="篩選訊息"] .bg-yellow-400');
-    await expect(filterIndicator).toBeVisible();
-
-    // Verify only student messages are shown (should see student avatar)
-    const studentBubbles = await page.locator('div').filter({ hasText: '🎓' }).count();
-    expect(studentBubbles).toBeGreaterThan(0);
-  });
-});

tests/e2e/prompts-in-conversations.spec.ts

@@ -1,343 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-const PW = 'cz-2025';
-const authHeader = (u: string) => 'Basic ' + Buffer.from(`${u}:${PW}`).toString('base64');
-
-test.describe('Database-Backed Prompts in Conversations', () => {
-  test('should create conversation with DB-backed student prompt', async ({ request }) => {
-    test.setTimeout(90_000);
-
-    const testUser = `prompt_test_${Date.now()}`;
-
-    // Register user
-    const reg = await request.post(`${baseURL}/api/auth/register`, {
-      data: { username: testUser },
-    });
-    expect(reg.ok()).toBeTruthy();
-
-    // Create conversation with student prompt from database
-    const convResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: {
-        Authorization: authHeader(testUser),
-        'Content-Type': 'application/json',
-      },
-      data: {
-        studentPromptId: 'ruirui',
-        coachPromptId: 'satir',
-        include3ConversationSummary: false,
-      },
-    });
-
-    expect(convResp.ok()).toBeTruthy();
-    const convData = await convResp.json();
-
-    // Verify conversation was created
-    expect(convData.conversation).toBeTruthy();
-    expect(convData.conversation.id).toBeTruthy();
-    expect(convData.conversation.studentPromptId).toBe('ruirui');
-    expect(convData.conversation.coachPromptId).toBe('satir');
-
-    // Verify systemPrompt is stored (from database)
-    expect(convData.conversation.systemPrompt).toBeTruthy();
-    expect(convData.conversation.systemPrompt.length).toBeGreaterThan(50);
-  });
-
-  test('should use DB prompt when sending messages in conversation', async ({ request }) => {
-    test.setTimeout(90_000);
-
-    const testUser = `prompt_msg_${Date.now()}`;
-
-    // Register user
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: testUser } });
-
-    // Create conversation
-    const convResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: 'ruirui', coachPromptId: 'satir' },
-    });
-    const convData = await convResp.json();
-    const conversationId = convData.conversation.id;
-
-    // Send message using the conversation endpoint
-    const msgResp = await request.post(`${baseURL}/api/conversations/${conversationId}/message`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: {
-        messages: [
-          { id: '1', role: 'user', parts: [{ type: 'text', text: '你好，我是小明' }] },
-        ],
-      },
-      timeout: 60_000,
-    });
-
-    // Streaming endpoint returns 200
-    expect(msgResp.status()).toBe(200);
-    expect(msgResp.headers()['content-type']).toContain('text/event-stream');
-
-    // Verify response has data
-    const msgBody = await msgResp.text();
-    expect(msgBody.length).toBeGreaterThan(0);
-    expect(msgBody).toContain('data:');
-
-    // The student should respond (indicating the prompt is working)
-    // Response should be in Traditional Chinese as specified in ruirui prompt
-    // We can't check the exact content since it's streaming, but we verified the format
-  });
-
-  test('should create conversation and verify prompt fields are derived', async ({ request }) => {
-    test.setTimeout(60_000);
-
-    const testUser = `prompt_derived_${Date.now()}`;
-
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: testUser } });
-
-    // Create conversation
-    const convResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: 'xiaoxu', coachPromptId: 'satir' },
-    });
-
-    expect(convResp.ok()).toBeTruthy();
-    const convData = await convResp.json();
-
-    // Verify derived fields (studentName, coachName) are present
-    // These are NOT stored in DB, but derived from PromptService
-    expect(convData.conversation.studentName).toBeTruthy();
-    expect(convData.conversation.coachName).toBeTruthy();
-    expect(typeof convData.conversation.studentName).toBe('string');
-    expect(typeof convData.conversation.coachName).toBe('string');
-  });
-
-  test('should list conversations with derived prompt names', async ({ request }) => {
-    test.setTimeout(60_000);
-
-    const testUser = `prompt_list_${Date.now()}`;
-
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: testUser } });
-
-    // Create a conversation
-    await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: 'xiaoen', coachPromptId: 'satir' },
-    });
-
-    // List conversations
-    const listResp = await request.get(`${baseURL}/api/conversations`, {
-      headers: { Authorization: authHeader(testUser) },
-    });
-
-    expect(listResp.ok()).toBeTruthy();
-    const listData = await listResp.json();
-
-    expect(listData.conversations).toBeTruthy();
-    expect(listData.conversations.length).toBeGreaterThan(0);
-
-    // Verify first conversation has derived fields
-    const conversation = listData.conversations[0];
-    expect(conversation.studentName).toBeTruthy();
-    expect(conversation.coachName).toBeTruthy();
-  });
-
-  test('should handle invalid student prompt ID gracefully', async ({ request }) => {
-    test.setTimeout(60_000);
-
-    const testUser = `prompt_invalid_${Date.now()}`;
-
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: testUser } });
-
-    // Try to create conversation with invalid student prompt ID
-    const convResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: 'invalid_student_999', coachPromptId: 'satir' },
-    });
-
-    // Should return error
-    expect(convResp.status()).toBe(400);
-    const convData = await convResp.json();
-    expect(convData.error).toBeTruthy();
-  });
-
-  test('should handle invalid coach prompt ID gracefully', async ({ request }) => {
-    test.setTimeout(60_000);
-
-    const testUser = `prompt_invalid_coach_${Date.now()}`;
-
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: testUser } });
-
-    // Try to create conversation with invalid coach prompt ID
-    const convResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: 'ruirui', coachPromptId: 'invalid_coach_999' },
-    });
-
-    // Should return error
-    expect(convResp.status()).toBe(400);
-    const convData = await convResp.json();
-    expect(convData.error).toBeTruthy();
-  });
-
-  test('should create new conversation after editing prompt in admin', async ({ request, page }) => {
-    test.setTimeout(120_000);
-
-    const testUser = `prompt_edit_test_${Date.now()}`;
-    const testPromptId = `test_edit_prompt_${Date.now()}`;
-
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: testUser } });
-
-    // 1. Create a test prompt via API
-    const createPromptResp = await request.post(`${baseURL}/api/prompts`, {
-      headers: { 'Content-Type': 'application/json' },
-      data: {
-        id: testPromptId,
-        type: 'student',
-        name: `測試學生 Original`,
-        description: '原始描述',
-        systemPrompt:
-          'IMPORTANT: You MUST respond in Traditional Chinese. You are a test student. Original version. Keep responses SHORT (5-7 words). This is for testing prompt management system.',
-        tools: ['calculate'],
-      },
-    });
-    expect(createPromptResp.ok()).toBeTruthy();
-
-    // 2. Create conversation with this prompt
-    const conv1Resp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: testPromptId, coachPromptId: 'satir' },
-    });
-    expect(conv1Resp.ok()).toBeTruthy();
-    const conv1Data = await conv1Resp.json();
-    const originalPrompt = conv1Data.conversation.systemPrompt;
-    expect(originalPrompt).toContain('Original version');
-
-    // 3. Edit the prompt via admin UI
-    await page.goto(`${baseURL}/admin/prompts/${testPromptId}`);
-
-    const nameInput = page.locator('input#name');
-    await expect(nameInput).toBeVisible({ timeout: 5000 });
-    await nameInput.fill(`測試學生 Updated`);
-
-    const systemPromptTextarea = page.locator('textarea#systemPrompt');
-    await systemPromptTextarea.fill(
-      'IMPORTANT: You MUST respond in Traditional Chinese. You are a test student. UPDATED version. Keep responses SHORT (5-7 words). This is for testing prompt management system updates.'
-    );
-
-    await page.click('button:has-text("儲存")');
-    await expect(page).toHaveURL(`${baseURL}/admin/prompts`, { timeout: 10_000 });
-
-    // Note: Cache has 5 min TTL, but new conversations will fetch fresh data from DB
-
-    // 4. Create NEW conversation with the updated prompt
-    const conv2Resp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: testPromptId, coachPromptId: 'satir' },
-    });
-    expect(conv2Resp.ok()).toBeTruthy();
-    const conv2Data = await conv2Resp.json();
-    const updatedPrompt = conv2Data.conversation.systemPrompt;
-    expect(updatedPrompt).toContain('UPDATED version');
-    expect(updatedPrompt).not.toContain('Original version');
-
-    // 5. Verify old conversation still has original prompt (stored in DB)
-    const getConv1Resp = await request.get(
-      `${baseURL}/api/conversations/${conv1Data.conversation.id}`,
-      {
-        headers: { Authorization: authHeader(testUser) },
-      }
-    );
-    expect(getConv1Resp.ok()).toBeTruthy();
-    const getConv1Data = await getConv1Resp.json();
-    expect(getConv1Data.conversation.systemPrompt).toContain('Original version');
-
-    // 6. Clean up: Delete the test prompt
-    const deleteResp = await request.delete(`${baseURL}/api/prompts/${testPromptId}`);
-    expect(deleteResp.ok()).toBeTruthy();
-  });
-
-  test('should continue working with deactivated prompt (existing conversations)', async ({ request }) => {
-    test.setTimeout(120_000);
-
-    const testUser = `prompt_deactivate_${Date.now()}`;
-    const testPromptId = `test_deactivate_${Date.now()}`;
-
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: testUser } });
-
-    // 1. Create a test prompt
-    await request.post(`${baseURL}/api/prompts`, {
-      headers: { 'Content-Type': 'application/json' },
-      data: {
-        id: testPromptId,
-        type: 'student',
-        name: `測試停用學生`,
-        systemPrompt:
-          'IMPORTANT: You MUST respond in Traditional Chinese. You are a test student for deactivation testing. Keep responses SHORT (5-7 words).',
-        tools: ['calculate'],
-      },
-    });
-
-    // 2. Create conversation with this prompt
-    const convResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: testPromptId, coachPromptId: 'satir' },
-    });
-    expect(convResp.ok()).toBeTruthy();
-    const convData = await convResp.json();
-    const conversationId = convData.conversation.id;
-
-    // 3. Deactivate (soft delete) the prompt
-    const deleteResp = await request.delete(`${baseURL}/api/prompts/${testPromptId}`);
-    expect(deleteResp.ok()).toBeTruthy();
-
-    // 4. Verify existing conversation still works (uses stored systemPrompt)
-    const msgResp = await request.post(`${baseURL}/api/conversations/${conversationId}/message`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: {
-        messages: [{ id: '1', role: 'user', parts: [{ type: 'text', text: '你好' }] }],
-      },
-      timeout: 60_000,
-    });
-
-    // Should still work because systemPrompt is stored
-    expect(msgResp.status()).toBe(200);
-    const msgBody = await msgResp.text();
-    expect(msgBody).toContain('data:');
-
-    // 5. Try to create NEW conversation with deactivated prompt
-    const newConvResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: testPromptId, coachPromptId: 'satir' },
-    });
-
-    // Should fail with 400 error
-    expect(newConvResp.status()).toBe(400);
-    const newConvData = await newConvResp.json();
-    expect(newConvData.error).toBeTruthy();
-  });
-
-  test('should use correct tools from database prompt', async ({ request }) => {
-    test.setTimeout(60_000);
-
-    const testUser = `prompt_tools_${Date.now()}`;
-
-    await request.post(`${baseURL}/api/auth/register`, { data: { username: testUser } });
-
-    // Create conversation with ruirui which has tools defined
-    const convResp = await request.post(`${baseURL}/api/conversations/create`, {
-      headers: { Authorization: authHeader(testUser), 'Content-Type': 'application/json' },
-      data: { studentPromptId: 'ruirui', coachPromptId: 'satir' },
-    });
-
-    expect(convResp.ok()).toBeTruthy();
-    const convData = await convResp.json();
-
-    // Verify systemPrompt contains tools ({{TOOLS}} placeholder should be interpolated)
-    const systemPrompt = convData.conversation.systemPrompt;
-    expect(systemPrompt).toBeTruthy();
-
-    // Should NOT contain the placeholder anymore (should be interpolated)
-    expect(systemPrompt).not.toContain('{{TOOLS}}');
-
-    // Should contain tool descriptions (if tools are defined in ruirui)
-    // This is indirect verification - we're checking that interpolation happened
-    expect(systemPrompt.length).toBeGreaterThan(100);
-  });
-});

tests/e2e/quoted-replies.spec.ts

@@ -1,273 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-test.describe('Quoted Replies Feature', () => {
-  test.use({ workers: 1 }); // Run serially to avoid rate limits
-
-  test('should select text from student message and send quoted reply', async ({ page }) => {
-    test.setTimeout(90_000); // 90 seconds for LLM responses
-    const testUser = `quote-test-${Date.now()}`;
-
-    // Step 1: Register and create conversation with student
-    await registerAndLogin(page, testUser);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    // Create student conversation
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-
-    // Select 睿睿 (ADHD Inattentive)
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible();
-
-    console.log('✅ Student conversation created');
-
-    // Step 2: Send first message as student
-    await page.fill('input[type="text"]', 'I need help with my math homework. The problem is 25 + 37 and I am confused.');
-    await page.click('button[type="submit"]');
-
-    // Wait for student response
-    const assistantMessages = page.locator('.whitespace-pre-wrap');
-    await expect(assistantMessages.first()).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Student responded');
-
-    // Step 3: Select text from student's response using triple-click (more reliable in tests)
-    // Find the student's message bubble (white background with blue border)
-    const studentMessageBubble = page.locator('.bg-white.border.border-blue-100').first();
-    await expect(studentMessageBubble).toBeVisible();
-
-    // Get the text content
-    const messageText = await studentMessageBubble.textContent();
-    console.log('Student message:', messageText);
-
-    // Select text by triple-clicking (selects entire text, more reliable than drag)
-    const textElement = studentMessageBubble.locator('.whitespace-pre-wrap').first();
-    await textElement.click({ clickCount: 3 });
-    await expect(page.locator('.bg-gray-50.border-l-4.border-blue-500')).toBeVisible({ timeout: 2000 });
-
-    // Verify selection was created
-    const selectedText = await page.evaluate(() => {
-      return window.getSelection()?.toString() || '';
-    });
-    console.log('Selected text:', selectedText);
-    expect(selectedText.length).toBeGreaterThan(0);
-
-    // Step 4: Verify quote preview appears
-    const quotePreview = page.locator('.bg-gray-50.border-l-4.border-blue-500');
-    await expect(quotePreview).toBeVisible({ timeout: 5000 });
-    await expect(quotePreview.locator('text=回覆：')).toBeVisible();
-
-    console.log('✅ Quote preview displayed');
-
-    // Step 5: Switch to coach and send reply with quote
-    await page.click('button[title="詢問教練"]');
-    await page.fill('input[type="text"]', 'Can you help explain this to the student?');
-    await page.click('button[type="submit"]');
-
-    // Verify the quoted message appears in the chat
-    const quotedMessage = page.locator('[data-message-id]').filter({ has: page.locator('text=回覆：') }).first();
-    await expect(quotedMessage).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Message with quote sent successfully');
-
-    // Step 6: Verify quote is saved and displayed
-    const quotedTextDisplay = quotedMessage.locator('.border-l-2');
-    await expect(quotedTextDisplay).toBeVisible();
-
-    console.log('✅ Quoted text displayed in message bubble');
-
-    console.log('✅✅✅ Quoted reply test passed!');
-  });
-
-  test('should clear quote before sending', async ({ page }) => {
-    test.setTimeout(90_000);
-    const testUser = `quote-clear-${Date.now()}`;
-
-    // Register and create conversation
-    await registerAndLogin(page, testUser);
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    console.log('✅ Conversation created');
-
-    // Send message and get response
-    await page.fill('input[type="text"]', 'Tell me about addition.');
-    await page.click('button[type="submit"]');
-
-    // Wait for response
-    const assistantMessages = page.locator('.whitespace-pre-wrap');
-    await expect(assistantMessages.first()).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Got student response');
-
-    // Select text using triple-click (more reliable than drag)
-    const studentMessageBubble = page.locator('.bg-white.border.border-blue-100').first();
-    const textElement = studentMessageBubble.locator('.whitespace-pre-wrap').first();
-    await textElement.click({ clickCount: 3 });
-    await expect(page.locator('.bg-gray-50.border-l-4.border-blue-500')).toBeVisible({ timeout: 2000 });
-
-    // Verify quote preview appears
-    const quotePreview = page.locator('.bg-gray-50.border-l-4.border-blue-500');
-    await expect(quotePreview).toBeVisible();
-
-    console.log('✅ Quote preview displayed');
-
-    // Click clear button
-    const clearButton = quotePreview.locator('button[aria-label="清除引用"]');
-    await expect(clearButton).toBeVisible();
-    await clearButton.click();
-
-    // Verify quote preview is gone
-    await expect(quotePreview).not.toBeVisible();
-
-    console.log('✅ Quote cleared successfully');
-
-    // Send message without quote
-    await page.fill('input[type="text"]', 'This message should have no quote.');
-    await page.click('button[type="submit"]');
-    await expect(page.locator('.bg-gradient-to-br.from-blue-500.to-blue-600').last()).toBeVisible({ timeout: 5000 });
-
-    // Verify message was sent without quoted text indicator
-    const lastUserMessage = page.locator('.bg-gradient-to-br.from-blue-500.to-blue-600').last();
-    await expect(lastUserMessage).toBeVisible();
-
-    // Should NOT have the "回覆：" label
-    const hasQuoteLabel = await lastUserMessage.locator('text=回覆：').count();
-    expect(hasQuoteLabel).toBe(0);
-
-    console.log('✅✅✅ Clear quote test passed!');
-  });
-
-  test('should persist quoted messages after page reload', async ({ page }) => {
-    test.setTimeout(90_000);
-    const testUser = `quote-persist-${Date.now()}`;
-
-    // Create conversation and send quoted reply
-    await registerAndLogin(page, testUser);
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=小許');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    console.log('✅ Conversation created');
-
-    // Send message
-    await page.fill('input[type="text"]', 'What is your favorite subject?');
-    await page.click('button[type="submit"]');
-
-    // Wait for response
-    await expect(page.locator('.whitespace-pre-wrap').first()).toBeVisible({ timeout: 60000 });
-
-    // Create a quote using triple-click (more reliable than drag)
-    const studentMessageBubble = page.locator('.bg-white.border.border-blue-100').first();
-    const textElement = studentMessageBubble.locator('.whitespace-pre-wrap').first();
-    await textElement.click({ clickCount: 3 });
-    await expect(page.locator('.bg-gray-50.border-l-4.border-blue-500')).toBeVisible({ timeout: 2000 });
-
-    // Send quoted reply
-    await page.click('button[title="詢問教練"]');
-    await page.fill('input[type="text"]', 'That is interesting!');
-    await page.click('button[type="submit"]');
-
-    // Verify quote is shown
-    const quotedMessage = page.locator('[data-message-id]').filter({ has: page.locator('text=回覆：') }).first();
-    await expect(quotedMessage).toBeVisible({ timeout: 10000 });
-
-    console.log('✅ Quoted message sent');
-
-    // Get current URL (conversation ID)
-    const currentUrl = page.url();
-
-    // Reload page
-    await page.reload();
-    await page.waitForLoadState('networkidle');
-    await expect(page).toHaveURL(currentUrl);
-
-    console.log('✅ Page reloaded');
-
-    // Verify quoted message is still displayed
-    const quotedMessageAfterReload = page.locator('[data-message-id]').filter({ has: page.locator('text=回覆：') }).first();
-    await expect(quotedMessageAfterReload).toBeVisible({ timeout: 10000 });
-
-    // Verify the quoted text display is still there
-    const quotedTextDisplay = quotedMessageAfterReload.locator('.border-l-2');
-    await expect(quotedTextDisplay).toBeVisible();
-
-    console.log('✅✅✅ Quote persistence test passed!');
-  });
-
-  test('should handle multiple quoted replies in same conversation', async ({ page }) => {
-    test.setTimeout(120_000); // 2 minutes
-    const testUser = `quote-multi-${Date.now()}`;
-
-    // Create conversation
-    await registerAndLogin(page, testUser);
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=小恩');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-
-    console.log('✅ Conversation created');
-
-    // Send first message
-    await page.fill('input[type="text"]', 'Can you help me with science?');
-    await page.click('button[type="submit"]');
-    await expect(page.locator('.whitespace-pre-wrap').first()).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ First response received');
-
-    // Create first quote using triple-click (more reliable than drag)
-    const firstStudentBubble = page.locator('.bg-white.border.border-blue-100').first();
-    const textElement1 = firstStudentBubble.locator('.whitespace-pre-wrap').first();
-    await textElement1.click({ clickCount: 3 });
-    await expect(page.locator('.bg-gray-50.border-l-4.border-blue-500')).toBeVisible({ timeout: 2000 });
-
-    await page.click('button[title="詢問教練"]');
-    await page.fill('input[type="text"]', 'First quoted reply');
-    await page.click('button[type="submit"]');
-
-    console.log('✅ First quoted reply sent');
-
-    // Send another student message
-    await page.click('button[title="與學生對話"]');
-    await page.fill('input[type="text"]', 'What about math?');
-    await page.click('button[type="submit"]');
-    await expect(page.locator('.bg-white.border.border-blue-100').nth(1)).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Second response received');
-
-    // Create second quote using triple-click (more reliable than drag)
-    const secondStudentBubble = page.locator('.bg-white.border.border-blue-100').nth(1);
-    const textElement2 = secondStudentBubble.locator('.whitespace-pre-wrap').first();
-    await textElement2.click({ clickCount: 3 });
-    await expect(page.locator('.bg-gray-50.border-l-4.border-blue-500')).toBeVisible({ timeout: 2000 });
-
-    await page.click('button[title="詢問教練"]');
-    await page.fill('input[type="text"]', 'Second quoted reply');
-    await page.click('button[type="submit"]');
-
-    console.log('✅ Second quoted reply sent');
-
-    // Verify both quoted messages exist
-    const quotedMessages = page.locator('[data-message-id]').filter({ has: page.locator('text=回覆：') });
-    const count = await quotedMessages.count();
-    expect(count).toBeGreaterThanOrEqual(2);
-
-    console.log(`✅ Found ${count} quoted messages`);
-    console.log('✅✅✅ Multiple quotes test passed!');
-  });
-});

tests/e2e/speaker-auto-detection.spec.ts

@@ -1,151 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-// Helper function to register and login
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${baseURL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-}
-
-test.describe('Speaker Auto-Detection on Page Load', () => {
-  test.use({ workers: 1 }); // Run serially to avoid rate limits
-
-  test('should auto-detect student speaker after student responded last', async ({ page }) => {
-    test.setTimeout(90_000); // 90 seconds for LLM responses
-    const testUser = `speaker_detect_student_${Date.now()}`;
-
-    // Step 1: Register and login
-    await registerAndLogin(page, testUser);
-    console.log('✅ Logged in successfully');
-
-    // Step 2: Create student conversation
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    console.log('✅ Student conversation created');
-
-    // Step 3: Send message to student
-    await page.fill('input[type="text"]', 'Hello, can you help me?');
-    await page.click('button[type="submit"]');
-
-    // Wait for student response
-    const studentResponse = page.locator('.bg-white.border.border-blue-100').first();
-    await expect(studentResponse).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Student responded');
-
-    // Step 4: Navigate away to dashboard
-    await page.goto(`${baseURL}/dashboard`);
-    await expect(page.locator('h1:has-text("SEL Chat Coach")')).toBeVisible();
-
-    console.log('✅ Navigated to dashboard');
-
-    // Step 5: Return to conversation and check speaker auto-detection
-    await page.click('svg:has(path[d*="M4 6h16"])');
-    await expect(page.locator('h3:has-text("對話記錄")')).toBeVisible();
-
-    const conversation = page.locator('.space-y-1 > div').filter({ hasText: '睿睿' }).first();
-    await expect(conversation).toBeVisible();
-    await conversation.click();
-
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    console.log('✅ Returned to conversation');
-
-    // Step 6: Verify speaker was auto-detected to continue with student
-    // Since last message was from student (assistant), user should continue talking to student
-    // We can verify this by checking console logs or by trying to send a message
-    // For now, let's just verify the page loaded and we can interact
-
-    // Check console for our debug log
-    const logs: string[] = [];
-    page.on('console', msg => {
-      if (msg.text().includes('[FRONTEND]')) {
-        logs.push(msg.text());
-      }
-    });
-
-    // Trigger a reload to see the logs
-    await page.reload();
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    console.log('Console logs:', logs);
-    console.log('✅✅✅ Speaker auto-detection test passed!');
-  });
-
-  test('should auto-detect coach speaker after coach responded last', async ({ page }) => {
-    test.setTimeout(90_000);
-    const testUser = `speaker_detect_coach_${Date.now()}`;
-
-    // Step 1: Register and login
-    await registerAndLogin(page, testUser);
-
-    // Step 2: Create student conversation
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    console.log('✅ Student conversation created');
-
-    // Step 3: Send message to student (triggers student response)
-    await page.fill('input[type="text"]', 'Hello');
-    await page.click('button[type="submit"]');
-
-    // Wait for student response
-    await expect(page.locator('.bg-white.border.border-blue-100').first()).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Student responded');
-
-    // Step 4: Manually switch to coach and send message
-    // Note: Speaker toggle is hidden, so we need to check if we can still switch programmatically
-    // Since UI is hidden, we'll skip this test for now and just verify basic auto-detection works
-
-    console.log('⚠️ Skipping coach speaker test - speaker toggle UI is hidden');
-  });
-
-  test('should not auto-detect speaker for coach_direct conversations', async ({ page }) => {
-    test.setTimeout(90_000);
-    const testUser = `speaker_detect_coach_direct_${Date.now()}`;
-
-    // Step 1: Register and login
-    await registerAndLogin(page, testUser);
-
-    // Step 2: Create coach-direct conversation
-    await page.click('h3:has-text("教練回顧")');
-    await expect(page.locator('text=開始諮詢')).toBeVisible({ timeout: 5_000 });
-    await page.click('button:has-text("開始諮詢")');
-
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await expect(page.locator('h1')).toBeVisible({ timeout: 10_000 });
-
-    console.log('✅ Coach-direct conversation created');
-
-    // Step 3: Send message
-    await page.fill('input[type="text"]', 'I need coaching advice');
-    await page.click('button[type="submit"]');
-
-    // Wait for coach response
-    const coachResponse = page.locator('.bg-gradient-to-br.from-purple-50').first();
-    await expect(coachResponse).toBeVisible({ timeout: 60000 });
-
-    console.log('✅ Coach responded');
-
-    // Step 4: Reload page
-    await page.reload();
-    await expect(page.locator('input#chat-input')).toBeVisible();
-
-    // Verify no speaker auto-detection happened (coach_direct doesn't need it)
-    // This is indicated by studentPromptId === 'coach_direct'
-    console.log('✅✅✅ Coach-direct conversation correctly skipped auto-detection!');
-  });
-});

tests/e2e/speaker-toggle-bug.spec.ts

@@ -1,126 +0,0 @@
-import { test, expect } from '@playwright/test';
-import { execSync } from 'child_process';
-
-const API_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:3000';
-
-// Helper function to register and login via UI
-async function registerAndLogin(page: any, username: string) {
-  await page.goto(`${API_URL}/login`);
-  await page.click('text=沒有帳號？建立新帳號');
-  await page.fill('input[name="username"]', username);
-  await page.click('button:has-text("建立帳號")');
-  await expect(page).toHaveURL(`${API_URL}/dashboard`, { timeout: 10_000 });
-}
-
-// SKIPPED: Speaker toggle buttons are hidden in UI
-test.describe.skip('Speaker Toggle Bug After Coach Ad', () => {
-  test('should allow switching back to student after accepting coach ad prompt', async ({ page }) => {
-    test.setTimeout(120_000); // 2 minutes for LLM responses
-    const testUser = `speaker-toggle-bug-${Date.now()}`;
-
-    console.log('🧪 Starting speaker toggle bug reproduction test...');
-
-    // Step 1: Register and login via UI
-    console.log('📝 Step 1: Registering and logging in...');
-    await registerAndLogin(page, testUser);
-    console.log('✅ Logged in successfully');
-
-    // Step 2: Create conversation via UI
-    console.log('📝 Step 2: Creating student conversation...');
-    await page.click('h3:has-text("指定對話演練")');
-    await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-    await page.click('text=睿睿');
-    await expect(page).toHaveURL(/\/conversation\//, { timeout: 10_000 });
-    await page.waitForTimeout(1000);
-
-    // Get conversation ID from URL
-    const convId = page.url().match(/\/conversation\/([^/?]+)/)?.[1];
-    expect(convId).toBeTruthy();
-    console.log(`✅ Created conversation: ${convId}`);
-
-    // Step 3: Verify initial state - student button should be active
-    console.log('📝 Step 3: Verifying initial speaker state...');
-    const studentButton = page.locator('button[title="與學生對話"]');
-    const coachButton = page.locator('button[title="詢問教練"]');
-
-    await expect(studentButton).toBeVisible();
-    await expect(coachButton).toBeVisible();
-    await expect(studentButton).toHaveClass(/from-blue-400/);
-    console.log('✅ Initial state: student button active');
-
-    // Step 4: Set message count to 14 via SQLite (so next message will be #15)
-    console.log('📝 Step 4: Setting message count to 14 via SQLite...');
-    execSync(
-      `sqlite3 ./data/app.db "UPDATE conversations SET user_to_student_message_count = 14 WHERE id = '${convId}';"`,
-      { encoding: 'utf-8' }
-    );
-    console.log('✅ Message count set to 14');
-
-    // Step 5: Send 15th message (triggers coach ad prompt)
-    console.log('📝 Step 5: Sending 15th message to trigger coach ad...');
-    await page.fill('input[type="text"]', 'Help me with my homework please');
-    await page.click('button[type="submit"]');
-
-    // Wait for student response to complete (indicates streaming is done)
-    const studentResponse = page.locator('.bg-white.border.border-blue-100').first();
-    await expect(studentResponse).toBeVisible({ timeout: 60_000 });
-    console.log('✅ Student response received');
-
-    // Wait for modal to appear
-    await page.waitForTimeout(2000);
-
-    // Step 6: Verify coach ad modal appears
-    console.log('📝 Step 6: Verifying coach ad modal appeared...');
-    await expect(page.locator('text=諮詢教練建議')).toBeVisible({ timeout: 10_000 });
-    await expect(page.locator('text=需要向教練尋求建議嗎')).toBeVisible();
-    console.log('✅ Coach ad modal appeared');
-
-    // Step 7: Accept the coach ad prompt
-    console.log('📝 Step 7: Accepting coach ad prompt...');
-    const okButton = page.locator('button:has-text("好的，諮詢教練")');
-    await expect(okButton).toBeVisible();
-    await okButton.click();
-
-    // Wait for coach message generation and response
-    await page.waitForTimeout(5000);
-
-    // Wait for coach response (purple gradient background)
-    const coachMessage = page.locator('.bg-gradient-to-br.from-purple-50');
-    await expect(coachMessage.first()).toBeVisible({ timeout: 60_000 });
-    console.log('✅ Coach message received');
-
-    // Step 8: Verify speaker automatically switched to coach
-    console.log('📝 Step 8: Verifying speaker switched to coach...');
-    await page.waitForTimeout(1000);
-    await expect(coachButton).toHaveClass(/from-purple-400/);
-    await expect(studentButton).toHaveClass(/bg-gray-200/);
-    console.log('✅ Speaker automatically switched to coach mode');
-
-    // Step 9: THE BUG TEST - Try to manually click student button to switch back
-    console.log('📝 Step 9: Testing manual switch back to student (BUG REPRODUCTION)...');
-    await studentButton.click();
-    await page.waitForTimeout(1000);
-
-    // Step 10: Verify student button is now active (THIS SHOULD PASS AFTER FIX)
-    console.log('📝 Step 10: Verifying student button is active...');
-    await expect(studentButton).toHaveClass(/from-blue-400/, {
-      timeout: 5_000
-    });
-    await expect(coachButton).toHaveClass(/bg-gray-200/);
-    console.log('✅ Successfully switched back to student mode!');
-
-    // Step 11: Send a message as student to verify it works
-    console.log('📝 Step 11: Sending message as student to verify...');
-    await page.fill('input[type="text"]', 'Testing student mode');
-    await page.click('button[type="submit"]');
-
-    // Wait for student response
-    await page.waitForTimeout(3000);
-    const finalStudentResponse = page.locator('.bg-white.border.border-blue-100').last();
-    await expect(finalStudentResponse).toBeVisible({ timeout: 60_000 });
-    console.log('✅ Student message sent and response received!');
-
-    console.log('');
-    console.log('🎉🎉🎉 SPEAKER TOGGLE BUG TEST PASSED! 🎉🎉🎉');
-  });
-});

tests/e2e/ui-auth-redirect.spec.ts

@@ -1,142 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-test.describe('UI Authentication & Auto-Redirect Tests', () => {
-  test.describe('Auto-redirect to /login on 401', () => {
-    test('Should redirect to /login when accessing dashboard without auth', async ({ page }) => {
-      test.setTimeout(30_000);
-
-      // 1. Go directly to dashboard without logging in
-      await page.goto(`${baseURL}/dashboard`);
-
-      // 2. Should be redirected to /login via useEffect
-      await expect(page).toHaveURL(`${baseURL}/login`, { timeout: 10_000 });
-
-      // Verify login form is shown
-      await expect(page.locator('h1:has-text("SEL 對話教練")')).toBeVisible();
-      await expect(page.locator('input[name="username"]')).toBeVisible();
-    });
-
-    test('Should redirect to /login when accessing conversation page without auth', async ({ page }) => {
-      test.setTimeout(30_000);
-
-      // 1. Try to access a conversation page directly
-      const fakeConvId = '00000000-0000-0000-0000-000000000000';
-      await page.goto(`${baseURL}/conversation/${fakeConvId}`);
-
-      // 2. Should be redirected to /login via useEffect
-      await expect(page).toHaveURL(`${baseURL}/login`, { timeout: 10_000 });
-
-      // Verify login form is shown
-      await expect(page.locator('h1:has-text("SEL 對話教練")')).toBeVisible();
-      await expect(page.locator('input[name="username"]')).toBeVisible();
-    });
-  });
-
-  test.describe('Auth state persistence', () => {
-    test('Auth state persists across page reloads', async ({ page }) => {
-      test.setTimeout(60_000);
-      const testUser = `persist_test_${Date.now()}`;
-
-      // 1. Register and login
-      await page.goto(`${baseURL}/login`);
-      await page.click('text=沒有帳號？建立新帳號');
-      await page.fill('input[name="username"]', testUser);
-      await page.click('button:has-text("建立帳號")');
-      await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-
-      // 2. Verify login state
-      await expect(page.locator(`text=你好，${testUser}！`)).toBeVisible();
-
-      // 3. Reload the page
-      await page.reload();
-
-      // 4. Should still be logged in and on dashboard
-      await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-      await expect(page.locator(`text=你好，${testUser}！`)).toBeVisible();
-
-      // 5. Navigate to home page
-      await page.goto(`${baseURL}/`);
-
-      // 6. Should redirect to dashboard (since user is logged in)
-      await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-    });
-
-    test('Logout clears auth state and redirects to login', async ({ page }) => {
-      test.setTimeout(60_000);
-      const testUser = `logout_test_${Date.now()}`;
-
-      // 1. Register and login
-      await page.goto(`${baseURL}/login`);
-      await page.click('text=沒有帳號？建立新帳號');
-      await page.fill('input[name="username"]', testUser);
-      await page.click('button:has-text("建立帳號")');
-      await expect(page).toHaveURL(`${baseURL}/dashboard`, { timeout: 10_000 });
-
-      // 2. Open sidebar
-      const menuButton = page.locator('button').filter({ has: page.locator('svg path[d*="M4 6h16"]') });
-      await menuButton.click();
-
-      // 3. Wait for sidebar to appear
-      await expect(page.locator('h2:has-text("選單")')).toBeVisible();
-
-      // 4. Click logout
-      await page.click('button:has-text("登出")');
-
-      // 5. Should be redirected to /login
-      await expect(page).toHaveURL(`${baseURL}/login`, { timeout: 10_000 });
-
-      // 6. Verify auth credentials are cleared
-      const hasCredentials = await page.evaluate(() => {
-        return localStorage.getItem('auth_credentials') !== null;
-      });
-      expect(hasCredentials).toBeFalsy();
-
-      // 7. Trying to access dashboard should redirect back to login
-      await page.goto(`${baseURL}/dashboard`);
-      await expect(page).toHaveURL(`${baseURL}/login`, { timeout: 10_000 });
-    });
-  });
-
-  test.describe('useAuthFetch hook behavior', () => {
-    test('useAuthFetch automatically adds auth headers', async ({ page, request }) => {
-      test.setTimeout(90_000);
-      const testUser = `fetch_test_${Date.now()}`;
-
-      // 1. Register via API
-      const PW = 'cz-2025';
-      await request.post(`${baseURL}/api/auth/register`, {
-        data: { username: testUser },
-      });
-
-      // 2. Login via UI
-      await page.goto(`${baseURL}/login`);
-      await page.fill('input[name="username"]', testUser);
-      await page.fill('input[name="password"]', PW);
-      await page.click('button:has-text("登入")');
-      await expect(page).toHaveURL(/\/(dashboard)?$/, { timeout: 10_000 });
-
-      // Navigate to dashboard if needed
-      if (!(await page.url().includes('dashboard'))) {
-        await page.goto(`${baseURL}/dashboard`);
-      }
-
-      // 3. Trigger a fetch operation (create conversation)
-      await page.click('h3:has-text("指定對話演練")');
-      await expect(page.locator('h3:has-text("選擇學生")')).toBeVisible();
-
-      // Click on the clickable student card (not just any div with emoji)
-      // Use a selector that targets the outer card with cursor-pointer class
-      const firstStudentCard = page.locator('.cursor-pointer').filter({ hasText: '🎓' }).first();
-      await firstStudentCard.click();
-
-      // 4. Should succeed and navigate to conversation
-      await expect(page).toHaveURL(/\/conversation\/[a-f0-9-]+/, { timeout: 15_000 });
-
-      // 5. Verify conversation loaded successfully (auth header was added)
-      // The placeholder contains "對話" (conversation) not "輸入" (input)
-      await expect(page.locator('input[placeholder*="對話"]')).toBeVisible({ timeout: 10_000 });
-    });
-  });
-});

tests/e2e/verify-no-nested-buttons.spec.ts

@@ -1,28 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-const baseURL = process.env.BASE_URL || 'http://localhost:3000';
-
-test.describe('Hydration Error Fix Verification', () => {
-  test('should verify no nested buttons exist in entire app', async ({ page }) => {
-    test.setTimeout(60_000);
-
-    // Just visit the login page and check for nested buttons
-    await page.goto(`${baseURL}/login`);
-
-    // Check entire page for any nested buttons
-    const nestedButtonsCount = await page.locator('button button').count();
-
-    console.log(`Found ${nestedButtonsCount} nested button(s) on login page`);
-    expect(nestedButtonsCount).toBe(0);
-
-    // Visit dashboard (will redirect to login but that's fine for structure check)
-    await page.goto(`${baseURL}/dashboard`);
-    await page.waitForLoadState('domcontentloaded');
-
-    const nestedOnDashboard = await page.locator('button button').count();
-    console.log(`Found ${nestedOnDashboard} nested button(s) on dashboard page`);
-    expect(nestedOnDashboard).toBe(0);
-
-    console.log('✅ No nested buttons found in app - hydration error fixed!');
-  });
-});