feat: use new db site, cache requests to avoid repeated unneeded fetch calls

app/customizations/page.tsx

@@ -7,6 +7,7 @@ import shared from '../../styles/shared.module.css';
 import styles from '../../styles/Customizations.module.css';
 
 import { getFileName, cleanFolderName, isKiller } from '../../lib/utils';
+import { fetchCharacters, fetchCustomizations } from '../../lib/db';
 import { Character, CustomizationItem, RoleFilter, Tab, TAB_CATEGORIES, CATEGORY_ORDER } from './types';
 import CharacterPicker from './CharacterPicker';
 import CharacterCosmetics from './CharacterCosmetics';
@@ -31,13 +32,11 @@ export default function CustomizationsPage() {
     const [page, setPage] = useState(1);
 
     useEffect(() => {
-        Promise.all([
-            fetch('/data/customization_items.json').then(r => r.json()).catch(() => []),
-            fetch('/data/characters.json').then(r => r.json()).catch(() => []),
-        ]).then(([items, chars]) => {
-            setAllItems(items);
-            setCharacters(chars);
-        });
+        Promise.all([fetchCustomizations(), fetchCharacters()])
+            .then(([items, chars]) => {
+                setAllItems(items);
+                setCharacters(chars);
+            });
     }, []);
 
     useEffect(() => { setPage(1); }, [tab, search]);

app/customizations/types.ts

@@ -26,17 +26,20 @@ export const TAB_CATEGORIES: Partial<Record<Tab, number>> = {
   charms: 8, badges: 9, banners: 10, portraits: 11,
 };
 
+import { DB_BASE_URL } from '../../lib/db';
+
 export const getCosmeticIconUrl = (
   item: CustomizationItem,
   characterMap: Map<number, string>
 ): string => {
   const file = (item.iconFilePath.split('/').pop() ?? '').split('.')[0];
+  const base = DB_BASE_URL;
 
   switch (item.category) {
-    case 8:  return `/icons/customization/charms/${file}.png`;
-    case 9:  return `/icons/customization/badges/${file}.png`;
-    case 10: return `/icons/customization/banners/${file}.png`;
-    case 11: return `/icons/customization/portrait-backgrounds/${file}.png`;
+    case 8:  return `${base}/icons/customization/charms/${file}.png`;
+    case 9:  return `${base}/icons/customization/badges/${file}.png`;
+    case 10: return `${base}/icons/customization/banners/${file}.png`;
+    case 11: return `${base}/icons/customization/portrait-backgrounds/${file}.png`;
   }
 
   const subfolder =
@@ -50,5 +53,5 @@ export const getCosmeticIconUrl = (
   const charFolder = (charName ?? item.associatedCharacter.toString())
     .replace(/[\\/:*?"<>|]/g, '_');
 
-  return `/icons/customization/characters/${charFolder}/${subfolder}/${file}.png`;
+  return `${base}/icons/customization/characters/${charFolder}/${subfolder}/${file}.png`;
 };