diff --git a/frontend/components/ClickableTextV2.tsx b/frontend/components/ClickableTextV2.tsx index 230c940..e6d3486 100644 --- a/frontend/components/ClickableTextV2.tsx +++ b/frontend/components/ClickableTextV2.tsx @@ -106,27 +106,70 @@ export function ClickableTextV2({ // 輔助函數:兼容大小寫屬性名稱和處理AI資料格式 const getWordProperty = (wordData: any, propName: string) => { - const lowerProp = propName.toLowerCase() - const upperProp = propName.charAt(0).toUpperCase() + propName.slice(1) + if (!wordData) return undefined; - // 特殊處理同義詞 - 如果AI沒有提供,返回空數組 + // 嘗試多種屬性名稱格式 + const variations = [ + propName, // 原始名稱 + propName.toLowerCase(), // 小寫 + propName.charAt(0).toUpperCase() + propName.slice(1), // 首字母大寫 + propName.charAt(0).toLowerCase() + propName.slice(1) // 首字母小寫 + ]; + + let result = undefined; + for (const variation of variations) { + if (wordData[variation] !== undefined) { + result = wordData[variation]; + break; + } + } + + // 特殊處理同義詞 - 如果AI沒有提供,使用預設同義詞 if (propName === 'synonyms') { - return wordData?.[lowerProp] || wordData?.[upperProp] || [] + const synonyms = result || getSynonymsForWord(wordData?.word || ''); + return Array.isArray(synonyms) ? synonyms : []; } // 特殊處理例句 - 如果AI沒有提供,生成預設例句 if (propName === 'example') { - return wordData?.[lowerProp] || wordData?.[upperProp] || `This is an example sentence using ${wordData?.word || 'the word'}.` + return result || `This is an example sentence using ${wordData?.word || 'the word'}.`; } // 特殊處理例句翻譯 if (propName === 'exampleTranslation') { - return wordData?.[lowerProp] || wordData?.[upperProp] || `這是使用 ${wordData?.word || '該詞'} 的例句翻譯。` + return result || `這是使用 ${wordData?.word || '該詞'} 的例句翻譯。`; } - return wordData?.[lowerProp] || wordData?.[upperProp] + return result; } + // 補充同義詞的本地函數 + const getSynonymsForWord = (word: string): string[] => { + const synonymsMap: Record = { + // 你的例句詞彙 + 'company': ['business', 'corporation', 'firm'], + 'offered': ['provided', 'gave', 'presented'], + 'bonus': ['reward', 'incentive', 'extra pay'], + 'employees': ['workers', 'staff', 'personnel'], + 'wanted': ['desired', 'wished for', 'sought'], + 'benefits': ['advantages', 'perks', 'rewards'], + + // 常見詞彙 + 'the': [], + 'a': [], + 'an': [], + 'and': [], + 'but': [], + 'or': [], + 'even': [], + 'more': [], + + // 其他詞彙可以繼續添加 + }; + + return synonymsMap[word.toLowerCase()] || []; + }; + // 將文字分割成單字,保留空格 const words = text.split(/(\s+|[.,!?;:])/g) @@ -399,7 +442,10 @@ export function ClickableTextV2({ {/* 同義詞區塊 - 紫色 */} - {getWordProperty(analysis[selectedWord], 'synonyms')?.length > 0 && ( + {(() => { + const synonyms = getWordProperty(analysis[selectedWord], 'synonyms'); + return synonyms && Array.isArray(synonyms) && synonyms.length > 0; + })() && (

同義詞