fix : overhual unnatural text

components/public/structured-guide.tsx

@@ -54,7 +54,6 @@ import {
 } from "@/lib/guides/talents";
 import { parseYouTubeUrl } from "@/lib/guides/youtube";
 import { normalizeExtraRichText } from "@/lib/rich-text";
-import { exportText, exportStatLabel, type Locale } from "@/lib/guides/export-text";
 import { cn } from "@/lib/utils";
 
 function hasSection(guide: PublicGuide, slug: string): boolean {
@@ -248,6 +247,7 @@ function GuideOverview({
                 height={2000}
                 format="png"
                 fileName={`${guide.name}-materials.png`}
+                allowWithoutNotes={false}
                 captureClassName="p-0"
               >
                 <MaterialPoster
@@ -409,7 +409,7 @@ function WeaponSectionContent({
       <header className="relative z-10 flex items-center justify-center text-center">
         <div className="flex flex-col items-center gap-3">
           <p className="text-sm font-medium text-primary">
-            อาวุธที่แนะนำ
+            {exporting ? "Recommended Weapons" : "อาวุธที่แนะนำ"}
           </p>
           <div className="flex items-center justify-center gap-3">
             <Image
@@ -425,7 +425,7 @@ function WeaponSectionContent({
               )}
             />
             <h1 className="whitespace-nowrap font-heading text-4xl font-semibold">
-              Weapons
+              {exporting ? "Weapons" : "อาวุธ"}
             </h1>
           </div>
           {note ? (
@@ -438,14 +438,14 @@ function WeaponSectionContent({
       <WeaponDisplayModeProvider>
       <ConditionSwitcher
         label="เลือกเงื่อนไขอาวุธ"
-        labels={weaponGroups.map((group, index) => group.name || `Condition ${index + 1}`)}
+        labels={weaponGroups.map((group, index) => group.name || (exporting ? `Condition ${index + 1}` : `เงื่อนไข ${index + 1}`))}
       >
       {weaponGroups.map((group, groupIndex, groups) => (
       <div key={group.id} className="relative z-10 flex flex-col gap-3">
         <div className="flex items-center justify-between gap-3">
           {groups.length > 1 || conditionNumber ? (
             <h2 className="font-heading text-2xl font-semibold">
-              {group.name || `Condition ${conditionNumber ?? groupIndex + 1}`}
+              {group.name || (exporting ? `Condition ${conditionNumber ?? groupIndex + 1}` : `เงื่อนไข ${conditionNumber ?? groupIndex + 1}`)}
             </h2>
           ) : <span />}
           {showExportActions ? (
@@ -617,8 +617,8 @@ function ArtifactSection({ guide }: { guide: PublicGuide }) {
         <ArtifactImageExport
           fileName={`${guide.name}-Artifact.png`}
           hasNote={Boolean(guide.artifactProfile?.note)}
-          recommendedConditionLabels={(guide.artifactProfile?.recommendedConditions ?? []).map((group, index) => group.name || `Condition ${index + 1}`)}
-          targetConditionLabels={targetConditions.map((group, index) => group.name || `Condition ${index + 1}`)}
+          recommendedConditionLabels={(guide.artifactProfile?.recommendedConditions ?? []).map((group, index) => group.name || `เงื่อนไข ${index + 1}`)}
+          targetConditionLabels={targetConditions.map((group, index) => group.name || `เงื่อนไข ${index + 1}`)}
         >
           <ArtifactSectionContent guide={guide} exporting />
         </ArtifactImageExport>
@@ -640,31 +640,31 @@ function ArtifactSectionContent({
   const recommendedConditions = profile?.recommendedConditions ?? [];
   const recommendedCards = recommendedConditions.map((condition, conditionIndex) => (
     <div key={conditionIndex} data-artifact-export-section="best-stats" data-recommended-condition={conditionIndex} className="flex flex-col gap-5">
-      {exporting && recommendedConditions.length > 1 ? <p className="text-sm font-medium">{condition.name || exportText("condition", { index: conditionIndex + 1 })}</p> : null}
+      {exporting && recommendedConditions.length > 1 ? <p className="text-sm font-medium">{condition.name || `Condition ${conditionIndex + 1}`}</p> : null}
       {condition.note ? <p data-export-note className="whitespace-pre-wrap text-sm text-muted-foreground">{condition.note}</p> : null}
       {profile ? (
         <Card data-artifact-export-section="best-stats" className="artifact-export-main-stats overflow-hidden pt-0">
           <CardHeader className="bg-primary py-4 text-center text-primary-foreground">
-            <CardTitle className="text-2xl">{exportText("mainStats", {}, exporting ? "en" : "th")}</CardTitle>
+            <CardTitle className="text-2xl">{exporting ? "Best Main Stats" : "ออฟหลักที่ดีที่สุด"}</CardTitle>
           </CardHeader>
           <CardContent className="grid grid-cols-3 p-0">
             <ArtifactStat
               iconSrc="/icon/Icon_Sands_of_Eon.webp"
-              label={exportText("sands", {}, exporting ? "en" : "th")}
+              label={exporting ? "Sands" : "นาฬิกา"}
               values={condition.sands}
               exporting={exporting}
               elementIconUrls={guide.elementIconUrls}
             />
             <ArtifactStat
               iconSrc="/icon/Icon_Goblet_of_Eonothem.webp"
-              label={exportText("goblet", {}, exporting ? "en" : "th")}
+              label={exporting ? "Goblet" : "ถ้วย"}
               values={condition.goblet}
               exporting={exporting}
               elementIconUrls={guide.elementIconUrls}
             />
             <ArtifactStat
               iconSrc="/icon/Icon_Circlet_of_Logos.webp"
-              label={exportText("circlet", {}, exporting ? "en" : "th")}
+              label={exporting ? "Circlet" : "หัว"}
               values={condition.circlet}
               exporting={exporting}
               elementIconUrls={guide.elementIconUrls}
@@ -675,7 +675,7 @@ function ArtifactSectionContent({
       {condition.substats.length ? (
         <Card data-artifact-export-section="best-stats" className="artifact-export-substats">
           <CardContent className="flex flex-col items-center gap-2 py-5 text-center text-sm">
-            <strong>{exportText("substats", {}, exporting ? "en" : "th")}</strong>
+            <strong>{exporting ? "Best Substats" : "ออฟรองที่ดีที่สุด"}</strong>
             <div className="flex flex-col items-center gap-1">
               {condition.substats.map((stat, index) => (
                 <ArtifactStatValue
@@ -710,7 +710,7 @@ function ArtifactSectionContent({
       <header className="relative z-10 flex items-center justify-center text-center">
         <div className="flex flex-col items-center gap-3">
           <p className="text-sm font-medium text-primary">
-            {exportText("artifactRecommendation", {}, exporting ? "en" : "th")}
+            {exporting ? "Recommended Artifacts & Stats" : "อาร์ติแฟกต์และสแตทที่แนะนำ"}
           </p>
           <div className="flex items-center justify-center gap-3">
             <Image
@@ -726,7 +726,7 @@ function ArtifactSectionContent({
               )}
             />
             <h1 className="whitespace-nowrap font-heading text-4xl font-semibold">
-              {exportText("artifactTitle", {}, exporting ? "en" : "th")}
+              {exporting ? "Artifacts & Stats" : "อาร์ติแฟกต์และค่าสถานะ"}
             </h1>
           </div>
           {action}
@@ -741,7 +741,7 @@ function ArtifactSectionContent({
         {" "}
         <div className="artifact-export-left flex flex-col gap-5">
           {exporting ? recommendedCards : (
-            <ConditionSwitcher label="เลือกเงื่อนไขค่าสถานะแนะนำ" labels={recommendedConditions.map((condition, index) => condition.name || `Condition ${index + 1}`)}>
+            <ConditionSwitcher label="เลือกเงื่อนไขค่าสถานะแนะนำ" labels={recommendedConditions.map((condition, index) => condition.name || `เงื่อนไข ${index + 1}`)}>
               {recommendedCards}
             </ConditionSwitcher>
           )}
@@ -751,9 +751,9 @@ function ArtifactSectionContent({
                 <CardHeader>
                   <CardTitle>
                     {group.name === "Late Game"
-                      ? exportText("lateGame", {}, exporting ? "en" : "th")
+                      ? (exporting ? "Late Game" : "เลทเกม")
                       : group.name === "Early Game"
-                        ? exportText("earlyGame", {}, exporting ? "en" : "th")
+                        ? (exporting ? "Early Game" : "ต้นเกม")
                         : group.name}
                   </CardTitle>
                 </CardHeader>
@@ -806,7 +806,7 @@ function ArtifactSectionContent({
                   exporting ? (
                     profile.targetConditions.filter((group) => group.rows.length).map((group, groupIndex) => (
                   <div key={groupIndex} data-artifact-export-section="target-stats" data-target-condition={groupIndex}>
-                    <p className="mb-2 text-sm font-medium">{exportText("minimumStats", {}, exporting ? "en" : "th")}</p>
+                    <p className="mb-2 text-sm font-medium">{exporting ? "Recommended Minimum Stats" : "ค่าสถานะต่ำๆที่ควรจะปั้นไว้"}</p>
                     {group.note ? <p data-export-note className="mb-2 whitespace-pre-wrap text-sm text-muted-foreground">{group.note}</p> : null}
                     <div className="flex flex-col gap-1">
                       {group.rows.map((target, index) => (
@@ -830,7 +830,7 @@ function ArtifactSectionContent({
                             ) : null}
                             <span>
                               {statLabel(
-                                normalizeTargetStat(target.stat) ?? target.stat, exporting ? "en" : "th",
+                                normalizeTargetStat(target.stat) ?? target.stat, exporting,
                               )}
                             </span>
                           </span>
@@ -841,10 +841,10 @@ function ArtifactSectionContent({
                   </div>
                     ))
                   ) : (
-                    <ConditionSwitcher label="เลือกเงื่อนไขค่าสถานะเป้าหมาย" labels={profile.targetConditions.filter((group) => group.rows.length).map((group, index) => group.name || `Condition ${index + 1}`)}>
+                    <ConditionSwitcher label="เลือกเงื่อนไขค่าสถานะเป้าหมาย" labels={profile.targetConditions.filter((group) => group.rows.length).map((group, index) => group.name || `เงื่อนไข ${index + 1}`)}>
                       {profile.targetConditions.filter((group) => group.rows.length).map((group, groupIndex) => (
                         <div key={groupIndex}>
-                          <p className="mb-2 text-sm font-medium">{exportText("minimumStats", {}, exporting ? "en" : "th")}</p>
+                          <p className="mb-2 text-sm font-medium">{exporting ? "Recommended Minimum Stats" : "ค่าสถานะต่ำๆที่ควรจะปั้นไว้"}</p>
                           {group.note ? <p data-export-note className="mb-2 whitespace-pre-wrap text-sm text-muted-foreground">{group.note}</p> : null}
                           <div className="flex flex-col gap-1">
                             {group.rows.map((target, index) => (
@@ -865,7 +865,7 @@ function ArtifactSectionContent({
                 {profile.talents.length ? (
                   <div data-artifact-export-section="talents">
                     <p className="mb-2 text-sm font-medium">
-                      {exportText("talents", {}, exporting ? "en" : "th")}
+                      {exporting ? "Talent Priority" : "ลำดับการอัพพรสวรรค์"}
                     </p>
                     <div
                       className={cn(
@@ -915,7 +915,7 @@ function ArtifactSectionContent({
                                 </div>
                                 <Badge variant="secondary">
                                   {talent.level
-                                    ? exportText("level", { level: talent.level }, exporting ? "en" : "th")
+                                    ? (exporting ? `Level ${talent.level}+` : `เลเวล ${talent.level}+`)
                                     : "-"}
                                 </Badge>
                                 <p
@@ -932,7 +932,11 @@ function ArtifactSectionContent({
                                     exporting ? "text-xs" : "text-[11px] sm:text-xs",
                                   )}
                                 >
-                                  {exportText(talent.type === "E" ? "skill" : talent.type === "Q" ? "burst" : "normalAttack", {}, exporting ? "en" : "th")}
+                                  {talent.type === "E"
+                                    ? (exporting ? "Elemental Skill" : "สกิลธาตุ")
+                                    : talent.type === "Q"
+                                      ? (exporting ? "Elemental Burst" : "ท่าไม้ตาย")
+                                      : (exporting ? "Normal Attack" : "ตีปกติ")}
                                 </p>
                               </div>
                               {index < talents.length - 1 ? (
@@ -963,7 +967,7 @@ function ArtifactSectionContent({
                 ) : null}
                 {profile.note ? (
                   <div data-export-note data-artifact-export-section="note" className="pt-3">
-                    <p className="mb-2 text-sm font-medium">{exportText("note", {}, exporting ? "en" : "th")}</p>
+                    <p className="mb-2 text-sm font-medium">{exporting ? "Notes" : "โน็ต"}</p>
                     <p className="text-sm leading-6 text-muted-foreground">
                       {profile.note}
                     </p>
@@ -978,8 +982,42 @@ function ArtifactSectionContent({
   );
 }
 
-function statLabel(value: string, locale: Locale = "th"): string {
-  return exportStatLabel(value, locale);
+const thaiStats: Record<string, string> = {
+  HP: "พลังชีวิต",
+  ATK: "พลังโจมตี",
+  DEF: "พลังป้องกัน",
+  EM: "ความชำนาญธาตุ",
+  ER: "ฟื้นฟูพลังงาน",
+  "CRIT RATE": "อัตราคริ",
+  "CRIT DAMAGE": "ความแรงคริ",
+  "ATK%": "พลังโจมตี%",
+  "HP%": "พลังชีวิต%",
+  "DEF%": "พลังป้องกัน%",
+  "CRIT Rate%/CRIT DMG%": "อัตราคริ/ความแรงคริ",
+  "Pyro DMG%": "ความเสียหายธาตุไฟ%",
+  "Hydro DMG%": "ความเสียหายธาตุน้ำ%",
+  "Cryo DMG%": "ความเสียหายธาตุน้ำแข็ง%",
+  "Electro DMG%": "ความเสียหายธาตุไฟฟ้า%",
+  "Anemo DMG%": "ความเสียหายธาตุลม%",
+  "Geo DMG%": "ความเสียหายธาตุดิน%",
+  "Dendro DMG%": "ความเสียหายธาตุไม้%",
+  "Physical DMG%": "ความเสียหายกายภาพ%",
+  "Healing Bonus%": "โบนัสการรักษา%",
+};
+
+const englishStats: Record<string, string> = {
+  HP: "HP",
+  ATK: "ATK",
+  DEF: "DEF",
+  EM: "Elemental Mastery",
+  ER: "Energy Recharge",
+  "CRIT RATE": "CRIT Rate",
+  "CRIT DAMAGE": "CRIT DMG",
+  "CRIT Rate%/CRIT DMG%": "CRIT Rate / CRIT DMG",
+};
+
+function statLabel(value: string, exporting = false): string {
+  return (exporting ? englishStats : thaiStats)[value] ?? value;
 }
 
 function ArtifactStat({
@@ -1080,7 +1118,7 @@ function ArtifactStatValue({
           className="size-5 shrink-0 object-contain brightness-0 invert"
         />
       ) : null}
-      <span className="break-words">{statLabel(value, exporting ? "en" : "th")}</span>
+      <span className="break-words">{statLabel(value, exporting)}</span>
     </span>
   );
 }
@@ -1105,7 +1143,7 @@ function ConstellationSection({ guide }: { guide: PublicGuide }) {
             className="size-14 shrink-0 object-contain"
           />
           <h1 className="whitespace-nowrap font-heading text-4xl font-semibold">
-            Constellations
+            กลุ่มดาว
           </h1>
         </div>
         {note ? (
@@ -1114,7 +1152,7 @@ function ConstellationSection({ guide }: { guide: PublicGuide }) {
           </p>
         ) : null}
       </header>
-      <ConditionSwitcher label="เลือกเงื่อนไขกลุ่มดาว" labels={guide.constellationGroups.filter((group) => group.rows.length > 0).map((group, index) => group.name || `Condition ${index + 1}`)}>
+      <ConditionSwitcher label="เลือกเงื่อนไขกลุ่มดาว" labels={guide.constellationGroups.filter((group) => group.rows.length > 0).map((group, index) => group.name || `เงื่อนไข ${index + 1}`)}>
       {guide.constellationGroups.filter((group) => group.rows.length > 0).map((group, groupIndex, groups) => (
         <div key={group.id} className="flex flex-col gap-4">
           <div>
@@ -1130,7 +1168,7 @@ function ConstellationSection({ guide }: { guide: PublicGuide }) {
               />
             </GuideImageExport>
           </div>
-          {groups.length > 1 ? <h2 className="font-heading text-2xl font-semibold">{group.name || `Condition ${groupIndex + 1}`}</h2> : null}
+          {groups.length > 1 ? <h2 className="font-heading text-2xl font-semibold">{group.name || `เงื่อนไข ${groupIndex + 1}`}</h2> : null}
           {group.note ? <p className="whitespace-pre-wrap">{group.note}</p> : null}
           <div className="grid gap-4 md:grid-cols-2">
             {group.rows.map((row) => (
@@ -1223,7 +1261,7 @@ function ExtraSectionContent({
         />
       ) : null}
       <header className="relative z-10 flex flex-col items-center gap-3 text-center">
-        <p className="text-sm font-medium text-primary">{exportText("extraGuide", {}, exporting ? "en" : "th")}</p>
+        <p className="text-sm font-medium text-primary">{exporting ? "Additional Guide" : "คู่มือเสริม"}</p>
         <h1 className="font-heading text-4xl font-semibold">{extra.title}</h1>
         {action}
       </header>
@@ -1274,7 +1312,7 @@ function ExtraSectionContent({
                     ) : null}
                     <div className="min-w-0">
                       <p className="truncate text-sm font-medium">{item.name}</p>
-                      {!item.available ? <Badge variant="secondary">{exportText("missingItem", {}, exporting ? "en" : "th")}</Badge> : null}
+                      {!item.available ? <Badge variant="secondary">{exporting ? "Item unavailable" : "ไม่พบรายการ"}</Badge> : null}
                     </div>
                     <ArrowUpRightIcon aria-hidden="true" className="ml-auto shrink-0" />
                   </a>