From 271dcb3c811b9e59bf2dac5fc547f9c9b1d45e75 Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Fri, 28 Nov 2025 21:46:48 -0800
Subject: [PATCH] refactor: add wx-svelte-grid Cell type for database cells
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Phase 2.2: Add proper type definitions for wx-svelte-grid
- Created Cell interface export in wx-svelte-grid declarations
- Updated all 9 database cell components to use Cell type
- Removed custom Props interfaces with loose IRow typing
- Improved IntelliSense support for grid component props

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../components/database/cells/CharacterImageCell.svelte   | 8 ++------
 .../components/database/cells/CharacterUncapCell.svelte   | 8 ++------
 src/lib/components/database/cells/ElementCell.svelte      | 8 ++------
 src/lib/components/database/cells/LastUpdatedCell.svelte  | 7 ++-----
 src/lib/components/database/cells/ProficiencyCell.svelte  | 8 ++------
 src/lib/components/database/cells/SummonImageCell.svelte  | 8 ++------
 src/lib/components/database/cells/SummonUncapCell.svelte  | 8 ++------
 src/lib/components/database/cells/WeaponImageCell.svelte  | 8 ++------
 src/lib/components/database/cells/WeaponUncapCell.svelte  | 8 ++------
 src/lib/types/declarations.d.ts                           | 8 ++++++--
 10 files changed, 24 insertions(+), 55 deletions(-)

diff --git a/src/lib/components/database/cells/CharacterImageCell.svelte b/src/lib/components/database/cells/CharacterImageCell.svelte
index 7d89710b..99630bd2 100644
--- a/src/lib/components/database/cells/CharacterImageCell.svelte
+++ b/src/lib/components/database/cells/CharacterImageCell.svelte
@@ -1,14 +1,10 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-	import type { IRow } from 'wx-svelte-grid'
+	import type { Cell } from 'wx-svelte-grid'
 	import { getCharacterImage } from '$lib/features/database/detail/image'
 
-	interface Props {
-		row: IRow
-	}
-
-	const { row }: Props = $props()
+	const { row }: Cell = $props()
 </script>
 
 <div class="image-cell">
diff --git a/src/lib/components/database/cells/CharacterUncapCell.svelte b/src/lib/components/database/cells/CharacterUncapCell.svelte
index 5b667e4b..9984efc1 100644
--- a/src/lib/components/database/cells/CharacterUncapCell.svelte
+++ b/src/lib/components/database/cells/CharacterUncapCell.svelte
@@ -1,14 +1,10 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-	import type { IRow } from 'wx-svelte-grid'
+	import type { Cell } from 'wx-svelte-grid'
 	import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
 
-	interface Props {
-		row: IRow
-	}
-
-	let { row }: Props = $props()
+	let { row }: Cell = $props()
 
 	// For database view, show maximum possible uncap level
 	// Not the user's current uncap level
diff --git a/src/lib/components/database/cells/ElementCell.svelte b/src/lib/components/database/cells/ElementCell.svelte
index d59bddbd..1f9a34ab 100644
--- a/src/lib/components/database/cells/ElementCell.svelte
+++ b/src/lib/components/database/cells/ElementCell.svelte
@@ -1,14 +1,10 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-	import type { IRow } from 'wx-svelte-grid'
+	import type { Cell } from 'wx-svelte-grid'
 	import ElementLabel from '$lib/components/labels/ElementLabel.svelte'
 
-	interface Props {
-		row: IRow
-	}
-
-	const { row }: Props = $props()
+	const { row }: Cell = $props()
 
 	const element = $derived(row.element)
 </script>
diff --git a/src/lib/components/database/cells/LastUpdatedCell.svelte b/src/lib/components/database/cells/LastUpdatedCell.svelte
index 5d7b5fa6..3a6d8a98 100644
--- a/src/lib/components/database/cells/LastUpdatedCell.svelte
+++ b/src/lib/components/database/cells/LastUpdatedCell.svelte
@@ -1,12 +1,9 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-	interface Props {
-		row: any
-		[key: string]: any  // Allow additional props from wx-svelte-grid
-	}
+	import type { Cell } from 'wx-svelte-grid'
 
-	const { row }: Props = $props()
+	const { row }: Cell = $props()
 
 	// Get the most recent date from various date fields
 	const getLastUpdated = (item: any): Date | null => {
diff --git a/src/lib/components/database/cells/ProficiencyCell.svelte b/src/lib/components/database/cells/ProficiencyCell.svelte
index f4d92d5d..f8b2b5b3 100644
--- a/src/lib/components/database/cells/ProficiencyCell.svelte
+++ b/src/lib/components/database/cells/ProficiencyCell.svelte
@@ -1,14 +1,10 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-	import type { IRow } from 'wx-svelte-grid'
+	import type { Cell } from 'wx-svelte-grid'
 	import ProficiencyLabel from '$lib/components/labels/ProficiencyLabel.svelte'
 
-	interface Props {
-		row: IRow
-	}
-
-	const { row }: Props = $props()
+	const { row }: Cell = $props()
 
 	const proficiency = $derived(row.proficiency)
 </script>
diff --git a/src/lib/components/database/cells/SummonImageCell.svelte b/src/lib/components/database/cells/SummonImageCell.svelte
index 66fe751f..ec0395dc 100644
--- a/src/lib/components/database/cells/SummonImageCell.svelte
+++ b/src/lib/components/database/cells/SummonImageCell.svelte
@@ -1,14 +1,10 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-	import type { IRow } from 'wx-svelte-grid'
+	import type { Cell } from 'wx-svelte-grid'
 	import { getSummonImage } from '$lib/features/database/detail/image'
 
-	interface Props {
-		row: IRow
-	}
-
-	const { row }: Props = $props()
+	const { row }: Cell = $props()
 </script>
 
 <div class="image-cell">
diff --git a/src/lib/components/database/cells/SummonUncapCell.svelte b/src/lib/components/database/cells/SummonUncapCell.svelte
index 87409d50..be858995 100644
--- a/src/lib/components/database/cells/SummonUncapCell.svelte
+++ b/src/lib/components/database/cells/SummonUncapCell.svelte
@@ -1,14 +1,10 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-	import type { IRow } from 'wx-svelte-grid'
+	import type { Cell } from 'wx-svelte-grid'
 	import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
 
-	interface Props {
-		row: IRow
-	}
-
-	let { row }: Props = $props()
+	let { row }: Cell = $props()
 
 	// For database view, show maximum possible uncap level
 	const uncap = $derived(row.uncap ?? {})
diff --git a/src/lib/components/database/cells/WeaponImageCell.svelte b/src/lib/components/database/cells/WeaponImageCell.svelte
index 97b21f56..62902d27 100644
--- a/src/lib/components/database/cells/WeaponImageCell.svelte
+++ b/src/lib/components/database/cells/WeaponImageCell.svelte
@@ -1,14 +1,10 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-	import type { IRow } from 'wx-svelte-grid'
+	import type { Cell } from 'wx-svelte-grid'
 	import { getWeaponImage } from '$lib/features/database/detail/image'
 
-	interface Props {
-		row: IRow
-	}
-
-	const { row }: Props = $props()
+	const { row }: Cell = $props()
 </script>
 
 <div class="image-cell">
diff --git a/src/lib/components/database/cells/WeaponUncapCell.svelte b/src/lib/components/database/cells/WeaponUncapCell.svelte
index 38abbfa6..655c8a16 100644
--- a/src/lib/components/database/cells/WeaponUncapCell.svelte
+++ b/src/lib/components/database/cells/WeaponUncapCell.svelte
@@ -1,14 +1,10 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-	import type { IRow } from 'wx-svelte-grid'
+	import type { Cell } from 'wx-svelte-grid'
 	import UncapIndicator from '$lib/components/uncap/UncapIndicator.svelte'
 
-	interface Props {
-		row: IRow
-	}
-
-	let { row }: Props = $props()
+	let { row }: Cell = $props()
 
 	// For database view, show maximum possible uncap level
 	const uncap = $derived(row.uncap ?? {})
diff --git a/src/lib/types/declarations.d.ts b/src/lib/types/declarations.d.ts
index 51f91702..09a1d978 100644
--- a/src/lib/types/declarations.d.ts
+++ b/src/lib/types/declarations.d.ts
@@ -32,12 +32,16 @@ declare module 'wx-svelte-grid' {
     [key: string]: any
   }
 
-  export interface ICellProps {
+  // Cell component props - used by custom cell components
+  export interface Cell {
     row: IRow
     col: IColumn
-    value: any
+    value?: any
   }
 
+  // Alias for backward compatibility
+  export interface ICellProps extends Cell {}
+
   export interface IDataConfig {
     data: IRow[]
     columns: IColumn[]