fix update Section Block

apps/spa/src/components/DynamicScentNotesBreakdown.tsx

@@ -11,9 +11,21 @@ export default function DynamicScentNotesBreakdown({ payload }: DynamicScentNote
   const p = payload || {};
   const title = getLocalizedField(p.title, lang);
   const description = getLocalizedField(p.description, lang);
-  const topNotes = getLocalizedField(p.topNotes, lang);
-  const heartNotes = getLocalizedField(p.heartNotes, lang);
-  const baseNotes = getLocalizedField(p.baseNotes, lang);
+  const notes = (value: any) => Array.isArray(value)
+    ? value.map((item) => getLocalizedField(item, lang)).filter(Boolean).join(', ')
+    : getLocalizedField(value, lang);
+  const labels = {
+    th: { top: 'Top Notes', heart: 'Heart Notes', base: 'Base Notes' },
+    en: { top: 'Top Notes', heart: 'Heart Notes', base: 'Base Notes' },
+    ja: { top: 'トップノート', heart: 'ハートノート', base: 'ベースノート' },
+    zh: { top: '前调', heart: '中调', base: '后调' },
+    vi: { top: 'Hương đầu', heart: 'Hương giữa', base: 'Hương cuối' },
+    ko: { top: '탑 노트', heart: '미들 노트', base: '베이스 노트' }
+  } as const;
+  const labelSet = labels[lang as keyof typeof labels] ?? labels.en;
+  const topNotes = notes(p.topNotes);
+  const heartNotes = notes(p.heartNotes ?? p.middleNotes);
+  const baseNotes = notes(p.baseNotes);
 
   return (
     <section className="py-20 px-6 bg-spa-light">
@@ -29,21 +41,21 @@ export default function DynamicScentNotesBreakdown({ payload }: DynamicScentNote
         
         <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
           <div className="p-8 bg-white rounded-2xl shadow-sm border border-spa-stone/10">
-            <h3 className="text-xl font-bold uppercase tracking-widest text-spa-forest mb-4">Top Notes</h3>
+            <h3 className="text-xl font-bold uppercase tracking-widest text-spa-forest mb-4">{labelSet.top}</h3>
             <p className="text-spa-stone font-light leading-relaxed">
               {topNotes || 'The initial, lighter smells of the fragrance.'}
             </p>
           </div>
           
           <div className="p-8 bg-white rounded-2xl shadow-sm border border-spa-stone/10">
-            <h3 className="text-xl font-bold uppercase tracking-widest text-spa-forest mb-4">Heart Notes</h3>
+            <h3 className="text-xl font-bold uppercase tracking-widest text-spa-forest mb-4">{labelSet.heart}</h3>
             <p className="text-spa-stone font-light leading-relaxed">
               {heartNotes || 'The core of the fragrance, emerging just after the top notes.'}
             </p>
           </div>
           
           <div className="p-8 bg-white rounded-2xl shadow-sm border border-spa-stone/10">
-            <h3 className="text-xl font-bold uppercase tracking-widest text-spa-forest mb-4">Base Notes</h3>
+            <h3 className="text-xl font-bold uppercase tracking-widest text-spa-forest mb-4">{labelSet.base}</h3>
             <p className="text-spa-stone font-light leading-relaxed">
               {baseNotes || 'The deepest, richest scents that linger the longest.'}
             </p>