Implement error handling and visual enhancements in map components

- Introduced MapErrorBoundary component to handle map loading errors gracefully.
- Enhanced MapView with a reconnection status indicator for live updates.
- Added tile freshness animation to indicate updated tiles visually.
- Preloaded marker icon images to improve rendering performance.
- Updated various pages to utilize the new MapErrorBoundary for better user experience.

frontend-nuxt/pages/character/[characterId].vue

@@ -1,7 +1,9 @@
 <template>
   <div class="h-full min-h-0">
     <MapPageWrapper>
-      <MapView :character-id="characterId" />
+      <MapErrorBoundary>
+        <MapView :character-id="characterId" />
+      </MapErrorBoundary>
     </MapPageWrapper>
   </div>
 </template>

frontend-nuxt/pages/grid/[map]/[gridX]/[gridY]/[zoom].vue

@@ -1,11 +1,13 @@
 <template>
   <MapPageWrapper>
-    <MapView
-      :map-id="mapId"
-      :grid-x="gridX"
-      :grid-y="gridY"
-      :zoom="zoom"
-    />
+    <MapErrorBoundary>
+      <MapView
+        :map-id="mapId"
+        :grid-x="gridX"
+        :grid-y="gridY"
+        :zoom="zoom"
+      />
+    </MapErrorBoundary>
   </MapPageWrapper>
 </template>
 

frontend-nuxt/pages/index.vue

@@ -1,6 +1,8 @@
 <template>
   <MapPageWrapper>
-    <MapView />
+    <MapErrorBoundary>
+      <MapView />
+    </MapErrorBoundary>
   </MapPageWrapper>
 </template>