debug de l'application vue

pmoapp/webapp/src/components/AudioCacheManager.vue

@@ -93,8 +93,8 @@
           </div>
           <div class="pk">{{ track.pk }}</div>
           <div class="meta">
-            <span v-if="track.metadata?.duration_ms">
-              {{ formatDuration(track.metadata.duration_ms) }}
+            <span v-if="durationMs(track) !== undefined">
+              {{ formatDuration(durationMs(track)!) }}
             </span>
             <span v-if="track.metadata?.sample_rate">
               {{ formatSampleRate(track.metadata.sample_rate) }}
@@ -147,7 +147,9 @@
             <p v-if="selectedTrack.metadata.year"><strong>Year:</strong> {{ selectedTrack.metadata.year }}</p>
             <p v-if="selectedTrack.metadata.genre"><strong>Genre:</strong> {{ selectedTrack.metadata.genre }}</p>
             <p v-if="selectedTrack.metadata.track_number"><strong>Track:</strong> {{ selectedTrack.metadata.track_number }}</p>
-            <p v-if="selectedTrack.metadata.duration_ms"><strong>Duration:</strong> {{ formatDuration(selectedTrack.metadata.duration_ms) }}</p>
+            <p v-if="durationMs(selectedTrack) !== undefined">
+              <strong>Duration:</strong> {{ formatDuration(durationMs(selectedTrack)!) }}
+            </p>
             <p v-if="selectedTrack.metadata.sample_rate"><strong>Sample Rate:</strong> {{ formatSampleRate(selectedTrack.metadata.sample_rate) }}</p>
             <p v-if="selectedTrack.metadata.bitrate"><strong>Bitrate:</strong> {{ formatBitrate(selectedTrack.metadata.bitrate) }}</p>
             <p v-if="selectedTrack.metadata.channels"><strong>Channels:</strong> {{ selectedTrack.metadata.channels }}</p>
@@ -155,7 +157,11 @@
           <div class="cache-section">
             <h4>Cache Info</h4>
             <p><strong>PK:</strong> {{ selectedTrack.pk }}</p>
-            <p><strong>Source URL:</strong> <a :href="selectedTrack.source_url" target="_blank">{{ selectedTrack.source_url }}</a></p>
+            <p v-if="resolveTrackOrigin(selectedTrack)">
+              <strong>Source URL:</strong>
+              <a :href="resolveTrackOrigin(selectedTrack)" target="_blank">{{ resolveTrackOrigin(selectedTrack) }}</a>
+            </p>
+            <p v-else><strong>Source URL:</strong> Unknown</p>
             <p><strong>Hits:</strong> {{ selectedTrack.hits }}</p>
             <p v-if="selectedTrack.collection"><strong>Collection:</strong> {{ selectedTrack.collection }}</p>
             <p v-if="selectedTrack.last_used"><strong>Last Used:</strong> {{ formatDate(selectedTrack.last_used) }}</p>
@@ -206,6 +212,8 @@ import {
   consolidateCache,
   getTrackUrl,
   getOriginalTrackUrl,
+  getOriginUrl,
+  getDurationMs,
   formatDuration,
   formatBitrate,
   formatSampleRate,
@@ -388,6 +396,14 @@ function copyTrackUrl(pk: string) {
   alert("✅ URL copied!");
 }
 
+function resolveTrackOrigin(track: AudioCacheEntry | null): string | undefined {
+  return track ? getOriginUrl(track) : undefined;
+}
+
+function durationMs(track: AudioCacheEntry | null): number | undefined {
+  return track ? getDurationMs(track.metadata) : undefined;
+}
+
 function formatDate(dateString: string) {
   const d = new Date(dateString);
   const diff = Date.now() - d.getTime();

pmoapp/webapp/src/components/CoverCacheManager.vue

@@ -71,7 +71,7 @@
         <div class="image-wrapper">
           <img
             :src="getImageUrl(image.pk, 256)"
-            :alt="image.source_url"
+            :alt="resolveOrigin(image) || image.pk"
             loading="lazy"
             @error="handleImageError"
           />
@@ -81,8 +81,8 @@
         </div>
         <div class="image-info">
           <div class="pk">{{ image.pk }}</div>
-          <div class="url" :title="image.source_url">
-            {{ truncateUrl(image.source_url) }}
+          <div class="url" :title="resolveOrigin(image) || 'Unknown source'">
+            {{ truncateUrl(resolveOrigin(image)) }}
           </div>
           <div class="meta">
             <span v-if="image.last_used" class="last-used">
@@ -108,13 +108,17 @@
         <button class="modal-close" @click="selectedImage = null">✕</button>
         <img
           :src="getImageUrl(selectedImage.pk)"
-          :alt="selectedImage.source_url"
+          :alt="resolveOrigin(selectedImage) || selectedImage.pk"
           class="modal-image"
         />
         <div class="modal-info">
           <h3>Image Details</h3>
           <p><strong>PK:</strong> {{ selectedImage.pk }}</p>
-          <p><strong>Source URL:</strong> <a :href="selectedImage.source_url" target="_blank">{{ selectedImage.source_url }}</a></p>
+          <p v-if="resolveOrigin(selectedImage)">
+            <strong>Source URL:</strong>
+            <a :href="resolveOrigin(selectedImage)" target="_blank">{{ resolveOrigin(selectedImage) }}</a>
+          </p>
+          <p v-else><strong>Source URL:</strong> Unknown</p>
           <p><strong>Hits:</strong> {{ selectedImage.hits }}</p>
           <p v-if="selectedImage.last_used"><strong>Last Used:</strong> {{ formatDate(selectedImage.last_used) }}</p>
           <div class="modal-actions">
@@ -141,6 +145,7 @@ import {
   purgeCache,
   consolidateCache,
   getImageUrl,
+  getOriginUrl,
   waitForDownload,
 } from "../services/coverCache";
 
@@ -229,7 +234,14 @@ function copyImageUrl(pk:string){
   alert("✅ URL copied!");
 }
 
-function truncateUrl(url:string,maxLength=40){ return url.length<=maxLength?url:url.slice(0,maxLength-3)+"..."; }
+function resolveOrigin(entry: CacheEntry | null): string | undefined {
+  return entry ? getOriginUrl(entry) : undefined;
+}
+
+function truncateUrl(url?:string,maxLength=40){
+  if(!url) return "Unknown source";
+  return url.length<=maxLength?url:url.slice(0,maxLength-3)+"...";
+}
 function formatDate(dateString:string){
   const d=new Date(dateString), diff=Date.now()-d.getTime(), days=Math.floor(diff/(1000*60*60*24));
   if(days===0)return"Today"; if(days===1)return"Yesterday"; if(days<7)return`${days} days ago`; return d.toLocaleDateString();