From 7a57680ec1967e8ef7b38f2fbd6d13878d2c0070 Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Mon, 1 Dec 2025 08:35:34 -0800
Subject: [PATCH] use ElementLabel/ProficiencyLabel, show all fields in detail
 pages

---
 .../sections/CharacterTaxonomySection.svelte  | 22 +++++----
 .../sections/SummonTaxonomySection.svelte     | 11 ++---
 .../sections/WeaponTaxonomySection.svelte     | 45 +++++++++++--------
 3 files changed, 46 insertions(+), 32 deletions(-)

diff --git a/src/lib/features/database/characters/sections/CharacterTaxonomySection.svelte b/src/lib/features/database/characters/sections/CharacterTaxonomySection.svelte
index 1785f619..963b709c 100644
--- a/src/lib/features/database/characters/sections/CharacterTaxonomySection.svelte
+++ b/src/lib/features/database/characters/sections/CharacterTaxonomySection.svelte
@@ -3,10 +3,12 @@
 <script lang="ts">
   import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
   import DetailItem from '$lib/components/ui/DetailItem.svelte'
-  import { getElementLabel, getElementOptions } from '$lib/utils/element'
+  import ElementLabel from '$lib/components/labels/ElementLabel.svelte'
+  import ProficiencyLabel from '$lib/components/labels/ProficiencyLabel.svelte'
+  import { getElementOptions } from '$lib/utils/element'
   import { getRaceLabel, getRaceOptions } from '$lib/utils/race'
   import { getGenderLabel, getGenderOptions } from '$lib/utils/gender'
-  import { getProficiencyLabel, getProficiencyOptions } from '$lib/utils/proficiency'
+  import { getProficiencyOptions } from '$lib/utils/proficiency'
 
   interface Props {
     character: any
@@ -31,14 +33,18 @@
     <DetailItem label="Proficiency 1" bind:value={editData.proficiency1} editable={true} type="select" options={proficiencyOptions} />
     <DetailItem label="Proficiency 2" bind:value={editData.proficiency2} editable={true} type="select" options={proficiencyOptions} />
   {:else}
-    <DetailItem label="Element" value={getElementLabel(character.element)} />
+    <DetailItem label="Element">
+      <ElementLabel element={character.element} size="medium" />
+    </DetailItem>
     <DetailItem label="Race 1" value={getRaceLabel(character.race?.[0])} />
-    {#if character.race?.[1]}
-      <DetailItem label="Race 2" value={getRaceLabel(character.race?.[1])} />
-    {/if}
+    <DetailItem label="Race 2" value={getRaceLabel(character.race?.[1])} />
     <DetailItem label="Gender" value={getGenderLabel(character.gender)} />
-    <DetailItem label="Proficiency 1" value={getProficiencyLabel(character.proficiency?.[0] ?? 0)} />
-    <DetailItem label="Proficiency 2" value={getProficiencyLabel(character.proficiency?.[1] ?? 0)} />
+    <DetailItem label="Proficiency 1">
+      <ProficiencyLabel proficiency={character.proficiency?.[0] ?? 0} size="medium" />
+    </DetailItem>
+    <DetailItem label="Proficiency 2">
+      <ProficiencyLabel proficiency={character.proficiency?.[1] ?? 0} size="medium" />
+    </DetailItem>
   {/if}
 </DetailsContainer>
 
diff --git a/src/lib/features/database/summons/sections/SummonTaxonomySection.svelte b/src/lib/features/database/summons/sections/SummonTaxonomySection.svelte
index 03543c42..ae558dc5 100644
--- a/src/lib/features/database/summons/sections/SummonTaxonomySection.svelte
+++ b/src/lib/features/database/summons/sections/SummonTaxonomySection.svelte
@@ -3,7 +3,8 @@
 <script lang="ts">
 	import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
 	import DetailItem from '$lib/components/ui/DetailItem.svelte'
-	import { getElementLabel, getElementOptions } from '$lib/utils/element'
+	import ElementLabel from '$lib/components/labels/ElementLabel.svelte'
+	import { getElementOptions } from '$lib/utils/element'
 
 	interface Props {
 		summon: any
@@ -33,9 +34,9 @@
 			placeholder="Series name"
 		/>
 	{:else}
-		<DetailItem label="Element" value={getElementLabel(summon.element)} />
-		{#if summon.series}
-			<DetailItem label="Series" value={summon.series} />
-		{/if}
+		<DetailItem label="Element">
+			<ElementLabel element={summon.element} size="medium" />
+		</DetailItem>
+		<DetailItem label="Series" value={summon.series || '—'} />
 	{/if}
 </DetailsContainer>
diff --git a/src/lib/features/database/weapons/sections/WeaponTaxonomySection.svelte b/src/lib/features/database/weapons/sections/WeaponTaxonomySection.svelte
index e4ea3f38..fc002b8e 100644
--- a/src/lib/features/database/weapons/sections/WeaponTaxonomySection.svelte
+++ b/src/lib/features/database/weapons/sections/WeaponTaxonomySection.svelte
@@ -3,8 +3,10 @@
 <script lang="ts">
 	import DetailsContainer from '$lib/components/ui/DetailsContainer.svelte'
 	import DetailItem from '$lib/components/ui/DetailItem.svelte'
+	import ElementLabel from '$lib/components/labels/ElementLabel.svelte'
+	import ProficiencyLabel from '$lib/components/labels/ProficiencyLabel.svelte'
 	import { getElementLabel, getElementOptions } from '$lib/utils/element'
-	import { getProficiencyLabel, getProficiencyOptions } from '$lib/utils/proficiency'
+	import { getProficiencyOptions } from '$lib/utils/proficiency'
 	import { getWeaponSeriesOptions, getWeaponSeriesSlug } from '$lib/utils/weaponSeries'
 
 	type ElementName = 'wind' | 'fire' | 'water' | 'earth' | 'dark' | 'light'
@@ -27,6 +29,17 @@
 		const label = getElementLabel(el)
 		return label !== '—' && label !== 'Null' ? (label.toLowerCase() as ElementName) : undefined
 	})
+
+	// Format series label
+	function formatSeriesLabel(series: number | undefined): string {
+		if (!series) return '—'
+		const seriesSlug = getWeaponSeriesSlug(series)
+		if (!seriesSlug) return String(series)
+		return seriesSlug
+			.split('_')
+			.map((w) => w.charAt(0).toUpperCase() + w.slice(1))
+			.join(' ')
+	}
 </script>
 
 <DetailsContainer title="Details">
@@ -77,24 +90,18 @@
 			element={elementName}
 		/>
 	{:else}
-		<DetailItem label="Element" value={getElementLabel(weapon.element)} />
-		<DetailItem
-			label="Proficiency"
-			value={getProficiencyLabel(
-				Array.isArray(weapon.proficiency) ? weapon.proficiency[0] : weapon.proficiency
-			)}
-		/>
-		{#if weapon.series}
-			{@const seriesLabel = getWeaponSeriesSlug(weapon.series)}
-			<DetailItem
-				label="Series"
-				value={seriesLabel
-					? seriesLabel
-							.split('_')
-							.map((w) => w.charAt(0).toUpperCase() + w.slice(1))
-							.join(' ')
-					: String(weapon.series)}
+		<DetailItem label="Element">
+			<ElementLabel element={weapon.element} size="medium" />
+		</DetailItem>
+		<DetailItem label="Proficiency">
+			<ProficiencyLabel
+				proficiency={Array.isArray(weapon.proficiency) ? weapon.proficiency[0] : weapon.proficiency}
+				size="medium"
 			/>
-		{/if}
+		</DetailItem>
+		<DetailItem label="Series" value={formatSeriesLabel(weapon.series)} />
+		<DetailItem label="Extra" sublabel="Can be placed in Additional Weapons" value={weapon.extra ? 'Yes' : 'No'} />
+		<DetailItem label="Limit" sublabel="Only one copy can be placed in a team" value={weapon.limit ? 'Yes' : 'No'} />
+		<DetailItem label="AX Skills" sublabel="Can have AX Skills" value={weapon.ax ? 'Yes' : 'No'} />
 	{/if}
 </DetailsContainer>