鄭沛軒
|
b9f89361d9
|
feat: 重新設計AI生成頁面為統一界面
重大更新:
- 完全重新設計為上下流式統一界面,無需切換頁面
- 移除showAnalysisView狀態,左側輸入右側即時顯示結果
- 添加句子播放按鈕,支援整句語音播放
- 實現localStorage分析結果持久化,跳頁後保留內容
- 統一WordPopup所有區塊顏色為灰色主題,保持視覺一致
- 優化詞彙統計顯示,移除多餘的進度條
- 添加保存提醒警告,避免查詢紀錄消失
- 程度指示器整合到頁面標題區域
用戶體驗大幅提升:
- 更直觀的操作流程
- 更豐富的互動功能
- 更一致的視覺設計
- 更好的數據持久化
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-10-08 03:11:42 +08:00 |
鄭沛軒
|
3b6b52c0d4
|
feat: 統一詞性簡寫顯示並修復複習日期問題
- 統一全站詞性顯示為標準簡寫格式 (n., v., adj., adv.)
- 修復詞卡詳細頁面 1970/1/1 日期顯示問題:
* 後端 GetFlashcard API 添加複習記錄查詢
* 前端添加安全的日期格式化處理
- 重新設計手機版詞卡管理頁面:
* 優化 FlashcardCard 手機版布局,解決擠壓問題
* 重新設計 SearchControls 導航為垂直分層布局
- 移除過時的掌握度顯示,簡化界面
- 改進詞卡詳細頁面間距,增加視覺舒適度
現在詞卡管理和詳細頁面在手機版和桌面版都有更好的用戶體驗。
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-10-07 17:23:55 +08:00 |
鄭沛軒
|
262312b02a
|
feat: 實現慣用語彈窗智能定位 + 簡化 WordPopup 組件
## 慣用語彈窗智能定位系統
- ✅ 創建智能定位工具 (popupPositioning.ts)
- ✅ 自動檢測可用空間,防止彈窗被底部遮蔽
- ✅ 智能選擇彈出方向 (上方/下方/居中)
- ✅ 響應式適配:桌面智能定位 + 手機底部modal
- ✅ 修正底部慣用語點擊體驗問題
## WordPopup 組件簡化
- 🔧 移除未使用的 useState import
- 🔧 簡化過度的響應式設計 (移除多處 sm: 斷點)
- 🔧 替換 ContentBlock 為簡單 div 結構
- 🔧 簡化條件渲染邏輯 (IIFE → 簡單 &&)
- ✅ 統一字體大小,與慣用語彈窗保持一致
## 技術改進
- 📱 設備檢測:自動適配移動/桌面體驗
- 🎯 智能定位:邊界檢測 + 動態位置計算
- 🧹 代碼簡化:減少複雜度,提升維護性
- 🎨 設計統一:兩種彈窗風格對齊
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-10-06 00:42:05 +08:00 |
鄭沛軒
|
184c84d944
|
refactor: 完成 Hook 和類型定義重構 + import 路徑更新
## Word 模組重構完成
- 📁 移動 useWordAnalysis Hook 到 hooks/word/
- 📄 移動 WordAnalysis 類型到 lib/types/word/
- 🧹 清理空目錄和錯放的文件
- ✅ 更新所有 import 路徑
## Import 路徑統一更新
- ✅ WordPopup: 更新 Hook 和類型引用
- ✅ ClickableTextV2: 更新 Hook 和類型引用
- ✅ review/page.tsx: 更新重構後的組件路徑
- ✅ review-design/page.tsx: 更新重構後的組件路徑
## 架構標準化完成
- 🎯 components/ 只放純組件
- 🪝 hooks/ 放自定義 Hook
- 📋 lib/types/ 放類型定義
- ✅ 符合 React 項目最佳實踐
功能驗證: 所有頁面正常編譯運行
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-10-03 16:30:35 +08:00 |
鄭沛軒
|
d742cf52f9
|
feat: BluePlayButton 內建 TTS 邏輯重構 + TypeScript 錯誤修復
重構亮點:
• BluePlayButton 內建完整 TTS 播放邏輯
• 移除 8 個組件中 97 行重複代碼
• 組件使用極度簡化:複雜配置 → 一行代碼
技術優化:
• 修復 TypeScript "Type 'never'" 錯誤
• 重新設計邏輯流程,清晰的條件分支
• 支援標準 TTS + 自定義播放兩種模式
使用簡化:
• 從: <BluePlayButton isPlaying={state} onToggle={handler} />
• 到: <BluePlayButton text="hello" />
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-10-02 16:51:45 +08:00 |
鄭沛軒
|
df1c2b92ef
|
feat: 全應用播放按鈕統一為藍底漸層設計 + 架構簡化
組件統一:
• 創建 BluePlayButton 統一組件 - 支援 sm/md/lg 三種尺寸
• 替換 10 個組件中的播放按鈕為統一的藍底漸層設計
• 移除 AudioPlayer 中間層抽象,直接使用 BluePlayButton
清理優化:
• 刪除未使用的 TTSButton 和 AudioPlayer 組件
• 簡化組件架構,每個組件內建 TTS 播放邏輯
• 統一 speechSynthesis API 使用方式
視覺統一:
• 藍底漸層 + 綠色播放中狀態 + 波紋動畫
• 響應式尺寸適配不同使用場景
• 完整的播放/暫停/禁用狀態設計
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-10-02 15:11:02 +08:00 |
鄭沛軒
|
6600dbf33a
|
feat: 完成ClickableTextV2組件重構 + 多頁面組件優化
重構成果:
1. ClickableTextV2: 413→114行 (減少72%)
2. Flashcards頁面: 305→277行 (減少9%)
3. 新建10個通用組件,大幅提升重用性
ClickableTextV2重構亮點:
- 建立word組件模組 (types.ts, useWordAnalysis Hook, WordPopup)
- 重用現有Modal + ContentBlock組件
- 業務邏輯與UI完全分離
- 編譯通過,功能完整
通用組件庫建立:
- LoadingState, ErrorState (全站通用狀態)
- StatisticsCard, ContentBlock (多色彩變體)
- ValidatedTextInput, TabNavigation (表單與導航)
- FlashcardActions, EditingControls等詞卡專用組件
Bundle優化:
- flashcards詳情頁: 8.62KB→6.36KB
- flashcards列表頁: 12.1KB→10.4KB
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-10-02 00:53:23 +08:00 |