feat(weapons) : add conditions and unsaved changes warning

components/public/structured-guide.tsx

@@ -28,7 +28,6 @@ import {
   recommendedStatIconName,
   statPriorityColorClass,
   targetStatIconName,
-  targetStatOptions,
 } from "@/lib/guides/stats";
 import {
   normalizeTalentPriorities,
@@ -346,8 +345,12 @@ function WeaponSectionContent({
         ) : null}
         {action}
       </header>
-      <div className="grid gap-3">
-        {guide.weapons.map((row, index) => (
+      {guide.weaponGroups.filter((group) => group.rows.length > 0).map((group, groupIndex, groups) => (
+      <div key={group.id} className="flex flex-col gap-3">
+        {groups.length > 1 ? <h2 className="font-heading text-2xl font-semibold">Condition {groupIndex + 1}</h2> : null}
+        {group.note ? <p className="whitespace-pre-wrap text-muted-foreground">{group.note}</p> : null}
+        <div className="grid gap-3">
+        {group.rows.map((row, index) => (
           <Card key={row.id} size="sm" className="bg-white py-0">
             <CardContent
               className={cn(
@@ -442,6 +445,8 @@ function WeaponSectionContent({
           </Card>
         ))}
       </div>
+      </div>
+      ))}
     </section>
   );
 }
@@ -608,9 +613,9 @@ function ArtifactSectionContent({
                   ))}
                 </CardContent>
               </Card>
-            ))}
-          </div>
+        ))}
         </div>
+      </div>
         {profile ? (
           <div className="flex flex-col gap-5">
             <Card>
@@ -857,9 +862,7 @@ function ArtifactStatValue({
   exporting?: boolean;
 }) {
   const iconName = recommendedStatIconName(value);
-  const hasIcon =
-    iconName &&
-    targetStatOptions.some((stat) => targetStatIconName(stat) === iconName);
+  const hasIcon = Boolean(iconName);
   return (
     <span
       className={cn(
@@ -869,7 +872,7 @@ function ArtifactStatValue({
     >
       {hasIcon ? (
         <Image
-          src={`/icon/stats/${iconName}.webp`}
+          src={`/icon/stats/${iconName}.${iconName === "elemental-bonus" ? "svg" : "webp"}`}
           alt=""
           width={20}
           height={20}