fix: resolve TypeScript type errors in TanStack Query integration

- Make total and perPage optional in PartyPageResult interface to match adapter return type
- Fix withInitialData to properly handle null values with NonNullable<TData>
- Fix slot indexing in job.mutations.ts by casting through unknown to keyof type

Co-Authored-By: Justin Edmund <justin@jedmund.com>
This commit is contained in:
Devin AI 2025-11-29 08:24:45 +00:00
parent cce93e367b
commit 5bf53ea671
3 changed files with 14 additions and 8 deletions

View file

@ -129,9 +129,11 @@ export function useRemovePartyJobSkill() {
const previousParty = queryClient.getQueryData<Party>(partyKeys.detail(shortcode))
// Optimistically remove the skill from the slot
// Convert slot number to string key to match jobSkills type (0-3)
if (previousParty?.jobSkills) {
const updatedSkills = { ...previousParty.jobSkills }
delete updatedSkills[slot]
const key = String(slot) as unknown as keyof typeof updatedSkills
delete updatedSkills[key]
queryClient.setQueryData(partyKeys.detail(shortcode), {
...previousParty,
jobSkills: updatedSkills

View file

@ -21,8 +21,8 @@ export interface PartyPageResult {
results: Party[]
page: number
totalPages: number
total: number
perPage: number
total?: number
perPage?: number
}
/**

View file

@ -15,9 +15,10 @@ import type { QueryClient } from '@tanstack/svelte-query'
*/
export interface InitialDataOptions<TData> {
/**
* The data fetched on the server to use as initial data
* The data fetched on the server to use as initial data.
* TanStack Query accepts TData | undefined but NOT null.
*/
initialData: TData | undefined | null
initialData?: TData
/**
* Optional timestamp when the data was fetched on the server.
@ -33,6 +34,9 @@ export interface InitialDataOptions<TData> {
* Use this helper when you have data fetched in a +page.server.ts load function
* and want to use it as initial data for a TanStack Query.
*
* Note: This helper strips `null` from the input since TanStack Query's
* initialData only accepts `TData | undefined`, not `null`.
*
* @example
* ```svelte
* <script lang="ts">
@ -51,16 +55,16 @@ export interface InitialDataOptions<TData> {
* </script>
* ```
*
* @param initialData - The data fetched on the server
* @param initialData - The data fetched on the server (null is converted to undefined)
* @param updatedAt - Optional timestamp when data was fetched (defaults to 0)
* @returns Query options object with initialData and initialDataUpdatedAt
*/
export function withInitialData<TData>(
initialData: TData | undefined | null,
updatedAt?: number
): InitialDataOptions<TData> {
): InitialDataOptions<NonNullable<TData>> {
return {
initialData: initialData ?? undefined,
initialData: (initialData ?? undefined) as NonNullable<TData> | undefined,
initialDataUpdatedAt: updatedAt ?? 0
}
}