chore: vehicle images hotfixes

src/components/Global/StockList.vue

@@ -118,7 +118,7 @@ export default defineComponent({
       if (isLoco) {
         if (/^\d?EN\d{2}/.test(stockName)) fallbackName = 'loco-ezt';
         else if (/^SN\d{2}/.test(stockName)) fallbackName = 'loco-szt';
-        else if (/^\d{1,}?E/.test(stockName)) fallbackName = 'loco-e';
+        else if (/^\d{0,}?E/.test(stockName)) fallbackName = 'loco-e';
         else fallbackName = 'loco-s';
       } else {
         const isCarPassenger = /(\d{3}a|(Bau|Gor)\d{2}|304C)_/.test(stockName);

src/components/Tooltip/VehiclePreviewTooltip.vue

@@ -16,7 +16,9 @@
       :src="`https://static.spythere.eu/images/${tooltipStore.content}--300px.jpg`"
     />
 
-    <div class="vehicle-name" v-if="imageState != 'error'">
+    <div v-if="imageState == 'error'" class="error-placeholder"></div>
+
+    <div class="vehicle-name">
       {{ tooltipStore.content.replace(/_/g, ' ') }}
     </div>
   </div>
@@ -38,6 +40,12 @@ export default defineComponent({
     this.imageState = 'loading';
   },
 
+  watch: {
+    'tooltipStore.type'(prev, val) {
+      if (prev != val) this.imageState = 'loading';
+    }
+  },
+
   methods: {
     onImageLoad() {
       this.imageState = 'loaded';
@@ -80,4 +88,8 @@ img {
   color: #ccc;
   text-wrap: wrap;
 }
+
+.error-placeholder {
+  height: 176px;
+}
 </style>

vite.config.ts

@@ -34,10 +34,6 @@ export default defineConfig({
             handler: 'CacheFirst',
             options: {
               cacheName: 'swdr-images-cache',
-              expiration: {
-                maxEntries: 100,
-                maxAgeSeconds: 60 * 60 * 24 * 7 // <== 7 days
-              },
               cacheableResponse: {
                 statuses: [0, 200, 404]
               }
@@ -48,10 +44,6 @@ export default defineConfig({
             handler: 'CacheFirst',
             options: {
               cacheName: 'spythere-images-cache',
-              expiration: {
-                maxEntries: 100,
-                maxAgeSeconds: 60 * 60 * 24 * 7 // <== 7 days
-              },
               cacheableResponse: {
                 statuses: [0, 200]
               }