granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

characters: connect edit page to real API

Browse source 
Replace simulated save with actual API call to updateCharacter().
Invalidates TanStack Query cache on successful update.

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Justin Edmund 2025-12-01 03:25:14 -08:00
parent 179cc13725
commit 3e23585ee7
1 changed files with 23 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

52
src/routes/(app)/database/characters/[id]/+page.svelte
View file

@ -5,7 +5,7 @@
import { goto } from '$app/navigation' import { goto } from '$app/navigation'
// TanStack Query // TanStack Query
import { createQuery } from '@tanstack/svelte-query' import { createQuery, useQueryClient } from '@tanstack/svelte-query'
import { entityQueries } from '$lib/api/queries/entity.queries' import { entityQueries } from '$lib/api/queries/entity.queries'
import { entityAdapter } from '$lib/api/adapters/entity.adapter' import { entityAdapter } from '$lib/api/adapters/entity.adapter'
import { withInitialData } from '$lib/query/ssr' import { withInitialData } from '$lib/query/ssr'
@ -25,6 +25,8 @@
let { data }: { data: PageData } = $props() let { data }: { data: PageData } = $props()
const queryClient = useQueryClient()
// Use TanStack Query with SSR initial data // Use TanStack Query with SSR initial data
const characterQuery = createQuery(() => ({ const characterQuery = createQuery(() => ({
...entityQueries.character(data.character?.id ?? ''), ...entityQueries.character(data.character?.id ?? ''),
@ -138,48 +140,40 @@
} }
async function saveChanges() { async function saveChanges() {
if (!character?.id) return
isSaving = true isSaving = true
saveError = null saveError = null
saveSuccess = false saveSuccess = false
try { try {
// Prepare the data for API (convert to snake_case) // Prepare the data for API (flat snake_case format)
const payload = { const payload = {
name: editData.name, name_en: editData.name,
granblue_id: editData.granblueId, granblue_id: editData.granblueId,
character_id: editData.characterId, character_id: editData.characterId ? [editData.characterId] : [],
rarity: editData.rarity, rarity: editData.rarity,
element: editData.element, element: editData.element,
race: [editData.race1, editData.race2].filter((r) => r !== null && r !== undefined), race1: editData.race1,
race2: editData.race2,
gender: editData.gender, gender: editData.gender,
proficiency: [editData.proficiency1, editData.proficiency2], proficiency1: editData.proficiency1,
hp: { proficiency2: editData.proficiency2,
min_hp: editData.minHp, min_hp: editData.minHp,
max_hp: editData.maxHp, max_hp: editData.maxHp,
max_hp_flb: editData.maxHpFlb max_hp_flb: editData.maxHpFlb,
}, min_atk: editData.minAtk,
atk: { max_atk: editData.maxAtk,
min_atk: editData.minAtk, max_atk_flb: editData.maxAtkFlb,
max_atk: editData.maxAtk, flb: editData.flb,
max_atk_flb: editData.maxAtkFlb ulb: editData.ulb,
},
uncap: {
flb: editData.flb,
ulb: editData.ulb,
transcendence: editData.transcendence
},
special: editData.special special: editData.special
} }
// TODO: When backend endpoint is ready, make the API call here await entityAdapter.updateCharacter(character.id, payload)
// const response = await fetch(`/api/v1/characters/${character.id}`, {
// method: 'PUT',
// headers: { 'Content-Type': 'application/json' },
// body: JSON.stringify(payload)
// })
// For now, just simulate success // Invalidate TanStack Query cache to refetch fresh data
await new Promise((resolve) => setTimeout(resolve, 1000)) await queryClient.invalidateQueries({ queryKey: ['character', character.id] })
saveSuccess = true saveSuccess = true
editMode = false editMode = false