chore: undo ffmpeg waveform

Author: sifferhans

backend/cmd/server/main.go

@@ -166,7 +166,6 @@ func main() {
 		cantemoToken: os.Getenv("CANTEMO_TOKEN"),
 	})
 	mux.Handle("/vault/image", newVaultImageHandler(cantemoClient, os.Getenv("CANTEMO_TOKEN")))
-	mux.Handle("/vault/waveform", newVaultWaveformHandler(cantemoClient, os.Getenv("CANTEMO_TOKEN")))
 
 	mux.Handle("/", http.HandlerFunc(serveFiles))
 

backend/cmd/server/vault_waveform.go

@@ -33,20 +33,10 @@ const previewSrc = computed(
         `${props.base}/vault/image?vxid=${encodeURIComponent(props.item.VXID)}&width=400`,
 );
 
-// /vault/waveform renders a PNG peak-waveform of the audio preview, used
-// directly in place of a thumbnail for audio items (Cantemo doesn't
-// auto-generate /thumbnailresource for audio either).
-const waveformSrc = computed(
-    () =>
-        `${props.base}/vault/waveform?vxid=${encodeURIComponent(props.item.VXID)}&width=400&height=120`,
+const imgSrc = computed(() =>
+    imgStage.value === "thumbnail" ? thumbSrc.value : previewSrc.value,
 );
 
-const imgSrc = computed(() => {
-    if (imgStage.value === "failed") return undefined;
-    if (props.item.mediaType === "audio") return waveformSrc.value;
-    return imgStage.value === "thumbnail" ? thumbSrc.value : previewSrc.value;
-});
-
 function onImgError() {
     if (imgStage.value === "thumbnail" && props.item.mediaType === "image") {
         imgStage.value = "preview";

frontend/app/components/vault/VaultCard.vue

@@ -34,10 +34,6 @@ const previewSrc = computed(
 const thumbSrc = computed(
     () => `${base}/vault/thumbnail?vxid=${encodeURIComponent(vxId.value)}`,
 );
-const waveformSrc = computed(
-    () =>
-        `${base}/vault/waveform?vxid=${encodeURIComponent(vxId.value)}&width=1200&height=200`,
-);
 
 const isVideo = computed(() => item.value?.mediaType === "video");
 const isAudio = computed(() => item.value?.mediaType === "audio");
@@ -50,9 +46,6 @@ const imageSrc = computed(() =>
     imageFailed.value ? thumbSrc.value : previewSrc.value,
 );
 
-// Waveform may fail to render (e.g. non-MP3 audio); fall back to the icon.
-const waveformFailed = ref(false);
-
 const bigIcon = computed(() => {
     switch (item.value?.mediaType) {
         case "video":
@@ -112,18 +105,7 @@ const lengthLabel = computed(() => {
                         v-else-if="isAudio"
                         class="bg-muted text-muted flex aspect-video w-full flex-col items-center justify-center gap-6 p-6"
                     >
-                        <img
-                            v-if="!waveformFailed"
-                            :src="waveformSrc"
-                            alt=""
-                            class="w-full max-w-2xl"
-                            @error="waveformFailed = true"
-                        />
-                        <UIcon
-                            v-else
-                            :name="bigIcon"
-                            class="size-14 opacity-40"
-                        />
+                        <UIcon :name="bigIcon" class="size-14 opacity-40" />
                         <audio
                             :src="previewSrc"
                             controls

frontend/app/pages/vault/[id].vue

@@ -95,6 +95,7 @@ const rangeTo = computed(() =>
             <UInput
                 v-model="query"
                 icon="tabler:search"
+                loading-icon="lucide:loader-circle"
                 size="lg"
                 :loading="loading"
                 :placeholder="t('vault.searchPlaceholder')"