centralize raid image urls with env-aware paths

src/lib/components/database/cells/RaidImageCell.svelte

@@ -2,8 +2,7 @@
 
 <script lang="ts">
 	import type { Raid } from '$lib/types/api/entities'
-
+	import { getRaidImage, getRaidCdnImage } from '$lib/utils/images'
-	const ICON_BASE_URL = 'https://prd-game-a-granbluefantasy.akamaized.net/assets_en/img/sp/assets/enemy/m'
 
 	interface Props {
 		raid: Raid
@@ -11,14 +10,17 @@
 
 	const { raid }: Props = $props()
 
-	function getIconUrl(enemyId: number): string {
+	// Prefer local icon image, fallback to CDN
-		return `${ICON_BASE_URL}/${enemyId}.png`
+	const iconUrl = $derived.by(() => {
-	}
+		if (raid.slug) return getRaidImage(raid.slug, 'icon')
+		if (raid.enemy_id) return getRaidCdnImage('icon', raid.enemy_id)
+		return ''
+	})
 </script>
 
 <div class="image-cell">
-	{#if raid.enemy_id}
+	{#if iconUrl}
-		<img src={getIconUrl(raid.enemy_id)} alt="" class="database-image" />
+		<img src={iconUrl} alt="" class="database-image" />
 	{:else}
 		<div class="no-image"></div>
 	{/if}

src/lib/utils/images.ts

@@ -447,10 +447,50 @@ export function getGuidebookImage(granblueId: string | number | undefined): stri
 	return `${getBasePath()}/guidebooks/book_${granblueId}.png`
 }
 
+// ===== Raid Images =====
+
+export type RaidImageVariant = 'icon' | 'thumbnail' | 'lobby' | 'background'
+
+// Game CDN URLs for raid images
+const RAID_ICON_CDN = 'https://prd-game-a-granbluefantasy.akamaized.net/assets_en/img/sp/assets/enemy/m'
+const RAID_THUMBNAIL_CDN = 'https://prd-game-a1-granbluefantasy.akamaized.net/assets_en/img/sp/assets/summon/qm'
+const RAID_LOBBY_CDN = 'https://prd-game-a1-granbluefantasy.akamaized.net/assets_en/img/sp/quest/assets/lobby'
+const RAID_BACKGROUND_CDN = 'https://prd-game-a-granbluefantasy.akamaized.net/assets_en/img/sp/quest/assets/treasureraid'
+
 /**
- * Get raid image URL
+ * Get raid image URL (stored images from our CDN/local)
+ * @param variant - 'icon', 'thumbnail', 'lobby', or 'background'
  */
-export function getRaidImage(slug: string | undefined): string {
+export function getRaidImage(
+	slug: string | undefined,
+	variant: RaidImageVariant = 'thumbnail'
+): string {
 	if (!slug) return getGenericPlaceholder()
-	return `${getBasePath()}/raids/${slug}.png`
+	const directory = `raid-${variant}`
+	return `${getBasePath()}/${directory}/${slug}.png`
+}
+
+/**
+ * Get raid image from game CDN (for images tab and initial downloads)
+ * @param variant - 'icon', 'thumbnail', 'lobby', or 'background'
+ * @param id - enemy_id for icon, summon_id for thumbnail, quest_id for lobby/background
+ */
+export function getRaidCdnImage(
+	variant: RaidImageVariant,
+	id: number | undefined
+): string {
+	if (!id) return getGenericPlaceholder()
+
+	switch (variant) {
+		case 'icon':
+			return `${RAID_ICON_CDN}/${id}.png`
+		case 'thumbnail':
+			return `${RAID_THUMBNAIL_CDN}/${id}_high.png`
+		case 'lobby':
+			return `${RAID_LOBBY_CDN}/${id}1.png`
+		case 'background':
+			return `${RAID_BACKGROUND_CDN}/${id}/raid_image_new.png`
+		default:
+			return getGenericPlaceholder()
+	}
 }