Frontend updates: caching basic data (json) from CDragon

Implement caching in the patch_detector, consume the cache from API routes in frontend

frontend/components/build/Viewer.vue

@@ -13,16 +13,11 @@ const props = defineProps<{
   summonerSpells?: Array<{ id: number; count: number; pickrate: number }> // API data when available
 }>()
 
-// Constants
-const ITEMS_API_URL = CDRAGON_BASE + 'plugins/rcp-be-lol-game-data/global/default/v1/items.json'
-const SUMMONER_SPELLS_URL =
-  CDRAGON_BASE + 'plugins/rcp-be-lol-game-data/global/default/v1/summoner-spells.json'
-
 // State
 const currentlySelectedBuild = ref(0)
 
-// Fetch items
-const { data: items } = useFetch<Array<Item>>(ITEMS_API_URL, {
+// Fetch items from cached API
+const { data: items } = useFetch<Array<Item>>('/api/cdragon/items', {
   lazy: true,
   server: false
 })
@@ -44,11 +39,14 @@ watch(
   { immediate: true }
 )
 
-// Fetch summoner spells
-const { data: summonerSpellsData } = useFetch<Array<SummonerSpell>>(SUMMONER_SPELLS_URL, {
-  lazy: true,
-  server: false
-})
+// Fetch summoner spells from cached API
+const { data: summonerSpellsData } = useFetch<Array<SummonerSpell>>(
+  '/api/cdragon/summoner-spells',
+  {
+    lazy: true,
+    server: false
+  }
+)
 const summonerSpellMap = ref<Map<number, SummonerSpell>>(new Map())
 
 watch(
@@ -143,17 +141,13 @@ const primaryStyles: Ref<Array<PerkStyle>> = ref(Array(props.runes.length))
 const secondaryStyles: Ref<Array<PerkStyle>> = ref(Array(props.runes.length))
 const keystoneIds: Ref<Array<number>> = ref(Array(props.runes.length))
 
-const { data: perks_data }: PerksResponse = await useFetch(
-  CDRAGON_BASE + 'plugins/rcp-be-lol-game-data/global/default/v1/perks.json'
-)
+const { data: perks_data }: PerksResponse = await useFetch('/api/cdragon/perks')
 const perks = reactive(new Map())
 for (const perk of perks_data.value) {
   perks.set(perk.id, perk)
 }
 
-const { data: stylesData }: PerkStylesResponse = await useFetch(
-  CDRAGON_BASE + 'plugins/rcp-be-lol-game-data/global/default/v1/perkstyles.json'
-)
+const { data: stylesData }: PerkStylesResponse = await useFetch('/api/cdragon/perkstyles')
 
 function refreshStylesKeystones() {
   for (const style of stylesData.value.styles) {