diff --git a/ui/app/components/History.vue b/ui/app/components/History.vue
index a5141d9e..ebf9be3a 100644
--- a/ui/app/components/History.vue
+++ b/ui/app/components/History.vue
@@ -271,17 +271,17 @@
-
pImg(e)" :src="getImage(item)" v-if="getImage(item)" />
+
-
pImg(e)" :src="getImage(item)" v-if="getImage(item)" />
+
-
pImg(e)" v-if="getImage(item)" :src="getImage(item)" />
+
@@ -847,6 +847,14 @@ const pImg = (e: Event) => {
}
}
+const onImgError = (e: Event) => {
+ const target = e.target as HTMLImageElement
+ if (target.src.endsWith('/images/placeholder.png')) {
+ return
+ }
+ target.src = '/images/placeholder.png'
+}
+
watch(video_item, (v) => {
if (!bg_enable.value) {
return
diff --git a/ui/app/components/Queue.vue b/ui/app/components/Queue.vue
index c376a0eb..d2aafa29 100644
--- a/ui/app/components/Queue.vue
+++ b/ui/app/components/Queue.vue
@@ -193,13 +193,13 @@
-
pImg(e)"
+
-
pImg(e)" v-if="item.extras?.thumbnail"
+
@@ -579,6 +579,14 @@ const pImg = (e: Event) => {
}
}
+const onImgError = (e: Event) => {
+ const target = e.target as HTMLImageElement
+ if (target.src.endsWith('/images/placeholder.png')) {
+ return
+ }
+ target.src = '/images/placeholder.png'
+}
+
watch(embed_url, v => {
if (!bg_enable.value) {
return
diff --git a/ui/app/components/Simple.vue b/ui/app/components/Simple.vue
index b78a711c..dcc790fb 100644
--- a/ui/app/components/Simple.vue
+++ b/ui/app/components/Simple.vue
@@ -89,7 +89,8 @@
-
+
{{ getDurationLabel(entry.item) }}
@@ -688,18 +689,19 @@ const loadMoreHistory = async (): Promise => {
}
}
-// Setup intersection observer for infinite scroll
-useIntersectionObserver(
- loadMoreTrigger,
- ([entry]) => {
- if (entry?.isIntersecting && !paginationInfo.value.isLoading && paginationInfo.value.page < paginationInfo.value.total_pages) {
- loadMoreHistory()
- }
- },
- {
- threshold: 0.5,
+const onImgError = (e: Event) => {
+ const target = e.target as HTMLImageElement
+ if (target.src.endsWith('/images/placeholder.png')) {
+ return
}
-)
+ target.src = '/images/placeholder.png'
+}
+
+useIntersectionObserver(loadMoreTrigger, ([entry]) => {
+ if (entry?.isIntersecting && !paginationInfo.value.isLoading && paginationInfo.value.page < paginationInfo.value.total_pages) {
+ loadMoreHistory()
+ }
+}, { threshold: 0.5 })