refactor: enhance character data transformation and improve fetching logic in character-related scripts

2026-03-14 18:32:43 +01:00
parent 8b08950719
commit b1cc691422
8 changed files with 129 additions and 102 deletions
@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { page } from '$app/stores';
 	import ProfileButton from '$lib/components/ProfileButton.svelte';
+	import { resolve } from '$app/paths';

 	let { children, data } = $props();

@@ -29,9 +30,9 @@
 			<h2 class="text-lg font-black uppercase tracking-[0.15em] text-amber-50">Admin</h2>
 		</div>
 		<nav class="flex-1 space-y-2 px-3">
-			{#each navItems as item}
+			{#each navItems as item (item.label)}
 				<a
-					href={item.href}
+					href={resolve(item.href)}
 					class={`flex items-center gap-3 rounded-lg px-4 py-3 text-sm font-medium transition-colors ${
 						isActive(item.href, $page.url.pathname)
 							? 'bg-amber-600 text-white'
@@ -45,7 +46,7 @@
 		</nav>
 		<div class="border-t border-white/5 p-3">
 			<a
-				href="/"
+				href={resolve('/')}
 				class="flex items-center gap-2 rounded-lg px-4 py-3 text-sm font-medium text-gray-300 transition-colors hover:bg-slate-800 hover:text-white"
 				title="Return to site"
 			>
@@ -26,6 +26,7 @@ async function upsertCharacterFromScrapeValidation(characterId: string): Promise
 		.values({
 			id: scraped.id,
 			name: scraped.name,
+			frName: scraped.frName,
 			gender: scraped.gender,
 			age: scraped.age,
 			affiliations: scraped.affiliations,
@@ -36,17 +37,21 @@ async function upsertCharacterFromScrapeValidation(characterId: string): Promise
 			bounty: scraped.bounty,
 			height: scraped.height,
 			origin: scraped.origin,
+			frOrigin: scraped.frOrigin,
 			firstAppearance: scraped.firstAppearance,
 			pictureUrl: scraped.pictureUrl,
 			epithets: scraped.epithets,
+			frEpithets: scraped.frEpithets,
 			status: scraped.status,
 			arcId: scraped.arcId,
-			url: scraped.url
+			url: scraped.url,
+			frUrl: scraped.frUrl,
 		})
 		.onConflictDoUpdate({
 			target: character.id,
 			set: {
 				name: scraped.name,
+				frName: scraped.frName,
 				gender: scraped.gender,
 				age: scraped.age,
 				affiliations: scraped.affiliations,
@@ -57,12 +62,15 @@ async function upsertCharacterFromScrapeValidation(characterId: string): Promise
 				bounty: scraped.bounty,
 				height: scraped.height,
 				origin: scraped.origin,
+				frOrigin: scraped.frOrigin,
 				firstAppearance: scraped.firstAppearance,
 				pictureUrl: scraped.pictureUrl,
 				epithets: scraped.epithets,
+				frEpithets: scraped.frEpithets,
 				status: scraped.status,
 				arcId: scraped.arcId,
-				url: scraped.url
+				url: scraped.url,
+				frUrl: scraped.frUrl
 			}
 		});

@@ -101,6 +109,7 @@ export async function load() {
 			const differences: Record<string, { current: any; scraped: any }> = {};
 			const fieldsToCompare = [
 				'name',
+				'frName',
 				'gender',
 				'age',
 				'affiliations',
@@ -111,12 +120,15 @@ export async function load() {
 				'bounty',
 				'height',
 				'origin',
+				'frOrigin',
 				'firstAppearance',
 				'pictureUrl',
 				'epithets',
+				'frEpithets',
 				'status',
 				'arcId',
-				'url'
+				'url',
+				'frUrl'
 			];

 			for (const field of fieldsToCompare) {
@@ -1,6 +1,4 @@
 <script lang="ts">
-	import { page } from '$app/stores';
-
 	let { data, form } = $props();

 	const newCharacters = $derived(data.changes.filter((c: any) => c.type === 'new'));
@@ -13,7 +13,10 @@

 	let { data }: Props = $props();

-	let configItems = $state<ConfigItem[]>([]);
+	let configItems = $derived(data.config.map((item) => ({
+			key: item.key,
+			value: item.value ?? ''
+		})));
 	let newKey = $state('');
 	let newValue = $state('');
 	let editingKey = $state<string | null>(null);
@@ -21,12 +24,7 @@
 	let isSaving = $state(false);
 	let saveMessage = $state<{ type: 'success' | 'error'; text: string } | null>(null);

-	$effect(() => {
-		configItems = data.config.map((item) => ({
-			key: item.key,
-			value: item.value ?? ''
-		}));
-	});
+	;

 	const startEdit = (item: ConfigItem) => {
 		editingKey = item.key;
@@ -70,6 +68,7 @@
 				saveMessage = { type: 'error', text: 'Failed to add config' };
 			}
 		} catch (error) {
+			console.error('Error adding config:', error);
 			saveMessage = { type: 'error', text: 'Error adding config' };
 		} finally {
 			isSaving = false;
@@ -99,6 +98,7 @@
 				saveMessage = { type: 'error', text: 'Failed to delete config' };
 			}
 		} catch (error) {
+			console.error('Error deleting config:', error);
 			saveMessage = { type: 'error', text: 'Error deleting config' };
 		} finally {
 			isSaving = false;
@@ -155,7 +155,7 @@
 					</tr>
 				</thead>
 				<tbody>
-				{#each configItems as item}
+				{#each configItems as item (item.key)}
 					{#if editingKey === item.key}
 						<tr class="border-b border-white/5 bg-slate-800/50">
 							<td class="px-6 py-4 text-sm text-white">{item.key}</td>
@@ -11,7 +11,6 @@
 	let searchQuery = $state('');
 	let filterType = $state<'all' | 'Paramecia' | 'Zoan' | 'Logia' | 'Unknown'>('all');
 	let isEditModalOpen = $state(false);
-	let selectedFruitId = $state<string | null>(null);
 	let isSaving = $state(false);
 	let saveMessage = $state<{ type: 'success' | 'error'; text: string } | null>(null);

@@ -33,14 +32,12 @@
 	});

 	const openEditModal = (fruit: any) => {
-		selectedFruitId = fruit.id;
 		editForm = { ...fruit };
 		isEditModalOpen = true;
 	};

 	const closeModal = () => {
 		isEditModalOpen = false;
-		selectedFruitId = null;
 		editForm = {
 			id: '',
 			name: '',
@@ -88,6 +85,7 @@
 				}, 3000);
 			}
 		} catch (error) {
+			console.error('Error deleting devil fruit:', error);
 			saveMessage = {
 				type: 'error',
 				text: 'Error deleting devil fruit'
@@ -150,7 +148,7 @@
 					</tr>
 				</thead>
 				<tbody>
-				{#each filteredFruits as fruit}
+				{#each filteredFruits as fruit (fruit.id)}
 					<tr class="border-b border-white/5 hover:bg-slate-800/50">
 						<td class="px-6 py-4 text-sm text-white">{fruit.name}</td>
 						<td class="px-6 py-4 text-sm">
@@ -233,7 +231,7 @@
 							bind:value={editForm.type}
 							class="mt-1 w-full rounded-lg bg-slate-700 px-4 py-2 text-sm text-white outline-none transition focus:ring-2 focus:ring-amber-600"
 						>
-							{#each fruitTypes as type}
+							{#each fruitTypes as type (type)}
 								<option value={type}>{type}</option>
 							{/each}
 						</select>
@@ -13,7 +13,6 @@
 	let isEditModalOpen = $state(false);
 	let isSaving = $state(false);
 	let saveMessage = $state<{ type: 'success' | 'error'; message: string } | null>(null);
-	let selectedUserId = $state<string | null>(null);

 	let editForm = $state<any>({
 		id: '',
@@ -35,7 +34,6 @@
 	});

 	const openEditModal = (usr: any) => {
-		selectedUserId = usr.id;
 		editForm = { ...usr };
 		isEditModalOpen = true;
 		saveMessage = null;
@@ -43,7 +41,6 @@

 	const closeModal = () => {
 		isEditModalOpen = false;
-		selectedUserId = null;
 		editForm = {
 			id: '',
 			name: '',
@@ -120,7 +117,7 @@
 					</tr>
 				</thead>
 				<tbody>
-				{#each filteredUsers as usr}
+				{#each filteredUsers as usr (usr.id)}
 					<tr class="border-b border-white/5 hover:bg-slate-800/50">
 						<td class="px-6 py-4 text-sm text-white">{usr.name}</td>
 						<td class="px-6 py-4 text-sm text-gray-400">{usr.email}</td>