From aa57a375cd8488c322e81bb28d7b1bf42e91fac3 Mon Sep 17 00:00:00 2001
From: Roardom <roardom@protonmail.com>
Date: Thu, 13 Feb 2025 10:45:41 +0000
Subject: [PATCH] update: add fallback images to quicksearch

---
 .../Controllers/API/QuickSearchController.php |  4 +--
 .../partials/quick-search-dropdown.blade.php  | 27 ++++++++++++++++++-
 2 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/app/Http/Controllers/API/QuickSearchController.php b/app/Http/Controllers/API/QuickSearchController.php
index a28c62cec..16470f966 100644
--- a/app/Http/Controllers/API/QuickSearchController.php
+++ b/app/Http/Controllers/API/QuickSearchController.php
@@ -87,7 +87,7 @@ class QuickSearchController extends Controller
                     'id'    => $hit['id'],
                     'name'  => $hit[$type]['name'],
                     'year'  => $hit[$type]['year'],
-                    'image' => $hit[$type]['poster'] ? tmdb_image('poster_small', $hit[$type]['poster']) : 'https://via.placeholder.com/90x135',
+                    'image' => $hit[$type]['poster'] ? tmdb_image('poster_small', $hit[$type]['poster']) : ($hit['name'][0] ?? '').($hit['name'][1] ?? ''),
                     'url'   => route('torrents.similar', ['category_id' => $hit['category']['id'], 'tmdb' => $hit['tmdb']]),
                     'type'  => $type === 'movie' ? 'Movie' : 'TV Series',
                 ];
@@ -96,7 +96,7 @@ class QuickSearchController extends Controller
                     'id'    => $hit['id'],
                     'name'  => $hit['name'],
                     'year'  => $hit['birthday'],
-                    'image' => $hit['still'] ? tmdb_image('poster_small', $hit['still']) : 'https://via.placeholder.com/90x135',
+                    'image' => $hit['still'] ? tmdb_image('poster_small', $hit['still']) : ($hit['name'][0] ?? '').(str($hit['name'])->explode(' ')->last()[0] ?? ''),
                     'url'   => route('mediahub.persons.show', ['id' => $hit['id']]),
                     'type'  => 'Person',
                 ];
diff --git a/resources/views/partials/quick-search-dropdown.blade.php b/resources/views/partials/quick-search-dropdown.blade.php
index e5a262052..518f24fbe 100755
--- a/resources/views/partials/quick-search-dropdown.blade.php
+++ b/resources/views/partials/quick-search-dropdown.blade.php
@@ -27,7 +27,7 @@
                         x-on:keydown.up.prevent="focusPreviousResult"
                     >
                         <a class="quick-search__result-link" :href="result.url">
-                            <img class="quick-search__image" :src="result.image" alt="" />
+                            <img class="quick-search__image" :src="getSrc(result.image)" alt="" />
                             <h2 class="quick-search__result-text">
                                 <span
                                     class="quick-search__result-name"
@@ -102,6 +102,31 @@
                         el.previousElementSibling?.firstElementChild?.focus();
                     }
                 },
+                getSrc(image) {
+                    return image.length > 2
+                        ? image
+                        : 'data:image/svg+xml;charset=utf-8,' +
+                              `<svg viewBox='0 0 40 60' width='40' height='60' xmlns='http://www.w3.org/2000/svg'>
+                                <defs>
+                                    <linearGradient id='grad' gradientTransform='rotate(90)'>
+                                        <stop offset='0%' stop-color='%23a5abb8' />
+                                        <stop offset='100%' stop-color='%23848993' />
+                                    </linearGradient>
+                                </defs>
+                                <rect width='40' height='60' fill='url(%23grad)'></rect>
+                                <text
+                                    x='50%'
+                                    y='50%'
+                                    dominant-baseline='central'
+                                    text-anchor='middle'
+                                    fill='white'
+                                    font-family='Arial'
+                                    font-size='16px'
+                                >
+                                    ${image}
+                                </text>
+                            </svg>`;
+                },
             };
         }
     </script>