Load textures using cache data instead of data sent from server

src/components/game/character/Character.vue

@@ -20,6 +20,7 @@ import { useGameStore } from '@/stores/gameStore'
 import { useMapStore } from '@/stores/mapStore'
 import { Container, refObj, Sprite, useScene } from 'phavuer'
 import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
+import { CharacterTypeStorage } from '@/storage/storages'
 
 // import CharacterChest from '@/components/game/character/partials/CharacterChest.vue'
 
@@ -152,14 +153,18 @@ watch(
 
 watch(() => props.mapCharacter, updateSprite)
 
-loadSpriteTextures(scene, props.mapCharacter.character.characterType as string)
-  .then(() => {
-    charSprite.value!.setTexture(charTexture.value)
-    charSprite.value!.setFlipX(isFlippedX.value)
-  })
-  .catch((error) => {
-    console.error('Error loading texture:', error)
-  })
+const characterTypeStorage = new CharacterTypeStorage()
+characterTypeStorage.getSpriteId(props.mapCharacter.character.characterType!).then((spriteId) => {
+  console.log(spriteId)
+  loadSpriteTextures(scene, spriteId)
+    .then(() => {
+      charSprite.value!.setTexture(charTexture.value)
+      charSprite.value!.setFlipX(isFlippedX.value)
+    })
+    .catch((error) => {
+      console.error('Error loading texture:', error)
+    })
+})
 
 onMounted(() => {
   charContainer.value!.setName(props.mapCharacter.character!.name)