file preview fix

Author: jiordiviera

app/helpers.php

@@ -91,16 +91,3 @@ function route_to_reply_able(mixed $replyAble): string
             route('discussions.show', $replyAble->slug());
     }
 }
-
-if(! function_exists('getAvatar')) {
-	/**
-	 * @param $title
-	 * @param  bool  $rounded
-	 *
-	 * @return string
-	 */
-    function getAvatar($title,bool $rounded=false): string
-    {
-        return 'https://ui-avatars.com/api/?name=' . urlencode($title). '&background=random&bold=true&format=svg&size=512&rounded='.$rounded;
-    }
-}

resources/views/articles/show.blade.php

@@ -69,7 +69,7 @@
                             <div>
                                 <h2 class="text-xs leading-5 font-medium tracking-wide uppercase text-skin-base">Article suivant</h2>
                                 <a href="{{ route('articles.show', $next) }}" class="mt-3 flex items-start space-x-2">
-                                    <img class="h-8 w-8 object-cover shadow-lg rounded-md" src="{{ $next->getFirstMediaUrl('media') }}" alt="{{ $next->slug }}">
+                                    <img class="h-8 w-8 object-cover shadow-lg rounded-md" src="{{ $next->getFirstMediaUrl('media') }}" alt="{{ $next->slug }}" onerror="this.onerror=null;this.src='{{ asset('images/socialcard.png') }}'">
                                     <span class="text-sm font-medium leading-4 text-skin-inverted hover:text-skin-primary-hover line-clamp-2">{{ $next->title }}</span>
                                 </a>
                             </div>
@@ -79,7 +79,7 @@
                             <div>
                                 <h2 class="text-xs leading-5 font-medium tracking-wide uppercase text-skin-base">Article précédent</h2>
                                 <a href="{{ route('articles.show', $previous) }}" class="mt-3 flex items-start space-x-2">
-                                    <img class="h-8 w-8 object-cover shadow-lg rounded-md" src="{{ $previous->getFirstMediaUrl('media') }}" alt="{{ $previous->slug }}">
+                                    <img class="h-8 w-8 object-cover shadow-lg rounded-md" src="{{ $previous->getFirstMediaUrl('media') }}" alt="{{ $previous->slug }}" onerror="this.onerror=null;this.src='{{ asset('images/socialcard.png') }}'">
                                     <span class="text-sm font-medium leading-4 text-skin-inverted hover:text-skin-primary-hover line-clamp-2">{{ $previous->title }}</span>
                                 </a>
                             </div>
@@ -229,7 +229,7 @@ class="inline-flex items-center py-2 px-4 border border-skin-base rounded-md sha
                             </a>
                             @if($article->isNotApproved())
                                 @hasanyrole('admin|moderator')
-                                    <button onclick="Livewire.emit('openModal', 'modals.approved-article', {{ json_encode([$article->id]) }})" type="button" class="-ml-px relative inline-flex items-center px-4 py-2 border border-skin-base bg-skin-card text-sm font-medium text-green-500 hover:bg-skin-card-muted focus:z-10 focus:outline-none focus:ring-1 focus:ring-green-500 focus:border-green-500 focus:border-green-500 focus:ring-offset-body">
+                                    <button onclick="Livewire.emit('openModal', 'modals.approved-article', {{ json_encode([$article->id]) }})" type="button" class="-ml-px relative inline-flex items-center px-4 py-2 border border-skin-base bg-skin-card text-sm font-medium text-green-500 hover:bg-skin-card-muted focus:z-10 focus:outline-none focus:ring-1 focus:ring-green-500 focus:border-green-500 focus:ring-offset-body">
                                         <span class="sr-only">{{ __('Approuver') }}</span>
                                         <x-untitledui-check-verified-02 class="h-5 w-5" />
                                     </button>
@@ -251,7 +251,7 @@ class="inline-flex items-center py-2 px-4 border border-skin-base rounded-md sha
                             <div>
                                 <h2 class="text-xs leading-5 tracking-wide uppercase text-skin-base">{{ __('Article suivant') }}</h2>
                                 <div class="mt-3 flex items-start space-x-2">
-                                    <img class="h-10 w-10 object-cover shadow-lg rounded-md" src="{{ $next->getFirstMediaUrl('media') ?? asset('images/socialcard.png') }}" alt="{{ $next->slug }}" onerror="this.onerror=null;this.src='{{ getAvatar($next->title) }}'">
+                                    <img class="h-10 w-10 object-cover shadow-lg rounded-md" src="{{ $next->getFirstMediaUrl('media') ?? asset('images/socialcard.png') }}" alt="{{ $next->slug }}" onerror="this.onerror=null;this.src='{{ asset('images/socialcard.png') }}'">
                                     <div class="flex flex-col space-y-1">
                                         <a class="text-base font-medium leading-4 text-skin-inverted hover:text-skin-primary-hover line-clamp-2" href="{{ route('articles.show', $next) }}">{{ $next->title }}</a>
                                         <span class="text-sm text-skin-muted">{{ __(':time min de lecture', ['time' => $next->readTime()]) }}</span>
@@ -264,7 +264,7 @@ class="inline-flex items-center py-2 px-4 border border-skin-base rounded-md sha
                             <div>
                                 <h2 class="text-xs leading-5 tracking-wide uppercase text-skin-base">{{ __('Article précédent') }}</h2>
                                 <div class="mt-3 flex items-start space-x-2">
-                                    <img class="h-10 w-10 object-cover shadow-lg rounded-md" src="{{ $previous->getFirstMediaUrl('media') ?? asset('images/socialcard.png') }}" alt="{{ $previous->slug }}" onerror="this.onerror=null;this.src='{{ getAvatar($previous->title) }}'">
+                                    <img class="h-10 w-10 object-cover shadow-lg rounded-md" src="{{ $previous->getFirstMediaUrl('media') ?? asset('images/socialcard.png') }}" alt="{{ $previous->slug }}" onerror="this.onerror=null; this.src='{{ asset('images/socialcard.png') }}'">
                                     <div class="flex flex-col space-y-1">
                                         <a class="text-base font-medium leading-4 text-skin-inverted hover:text-skin-primary-hover line-clamp-2" href="{{ route('articles.show', $previous) }}">{{ $previous->title }}</a>
                                         <span class="text-sm text-skin-muted">{{ __(':time min de lecture', ['time' => $previous->readTime()]) }}</span>

resources/views/components/articles/card-with-author.blade.php

@@ -24,7 +24,7 @@
             {!! $article->excerpt(175) !!}
         </p>
         <div class="relative h-96 overflow-hidden">
-            <img class="w-full h-full object-cover shadow-lg rounded-lg group-hover:opacity-75" src="{{ $article->getFirstMediaUrl('media') }}" alt="{{ $article->title }}" />
+            <img class="w-full h-full object-cover shadow-lg rounded-lg group-hover:opacity-75" src="{{ $article->getFirstMediaUrl('media') }}" alt="{{ $article->title }}" onerror="this.src='{{ asset('images/socialcard.png') }}'" />
         </div>
         <div class="flex justify-between space-x-8">
             <div class="flex space-x-6">

resources/views/components/articles/card.blade.php

@@ -12,7 +12,7 @@
 >
     <a href="{{ route('articles.show', $article) }}" class="group">
         <div class="aspect-w-3 aspect-h-2">
-            <img class="object-cover shadow-lg rounded-lg group-hover:opacity-75" src="{{ $article->getFirstMediaUrl('media') }}" alt="{{ $article->title }}" onerror="this.onerror=null;this.src='{{ getAvatar($article->title) }}'"  />
+            <img class="object-cover shadow-lg rounded-lg group-hover:opacity-75" src="{{ $article->getFirstMediaUrl('media') }}" alt="{{ $article->title }}" onerror="this.onerror=null;this.src='{{ asset('images/socialcard.png') }}'"  />
         </div>
     </a>
     <div

resources/views/components/articles/overview.blade.php

@@ -5,7 +5,7 @@
         <div class="aspect-w-3 aspect-h-2">
             <img class="object-cover shadow-lg rounded-lg group-hover:opacity-75"
                  src="{{ $article->getFirstMediaUrl('media') }}"
-                 alt="{{ $article->title }}"
+                 alt="{{ $article->title }}" onerror="this.src='{{ asset('images/socialcard.png') }}'"
             />
         </div>
     </a>

resources/views/components/forms/single-upload.blade.php

@@ -32,7 +32,7 @@
                 <p class="mt-1 text-xs text-skin-muted">
                     {{ __('PNG, JPG, GIF up to 1MB') }}
                 </p>
-                <input @focus="focused = true" @blur="focused = false" class="sr-only" type="file" {{ $attributes }} />
+                <input @focus="focused = true" @blur="focused = false" class="sr-only" type="file" accept="image/jpg, image/jpeg, image/png" {{ $attributes }} />
             </div>
             <div class="w-full h-full hidden flex items-center justify-center" wire:loading.class.remove="hidden" wire:target="file">
                 <x-loader wire:loading wire:target="file" class="text-green-600" />

resources/views/livewire/articles/_form.blade.php

@@ -22,7 +22,7 @@
                             {{ __('Enregistrer') }}
                         </button>
                         <span x-data="{ open: false }" @keydown.escape.stop="open = false;" @click.away="open = false" class="-ml-px relative block">
-                            <button type="button" class="relative inline-flex items-center px-2 py-2 rounded-r-md border border-transparent text-sm font-medium text-white text-white bg-green-600 hover:bg-green-700 focus:z-10 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-body focus:ring-green-500"
+                            <button type="button" class="relative inline-flex items-center px-2 py-2 rounded-r-md border border-transparent text-sm font-medium text-white bg-green-600 hover:bg-green-700 focus:z-10 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-body focus:ring-green-500"
                                     id="option-menu-button"
                                     x-ref="button"
                                     @click="open = !open"
@@ -253,7 +253,7 @@ class="flex items-center justify-center text-sm leading-none text-center rounded
                 wire:model="title"
                 name="title"
                 id="title"
-                class="block w-full h-auto px-0 py-4 text-3xl sm:text-4xl font-bold placeholder-skin-input focus:placeholder-skin-input-focus font-normal text-skin-inverted bg-transparent border-0 leading-normal border-0 appearance-none focus:ring-0 shadow-none"
+                class="block w-full h-auto px-0 py-4 text-3xl sm:text-4xl font-bold placeholder-skin-input focus:placeholder-skin-input-focus font-normal text-skin-inverted bg-transparent leading-normal border-0 appearance-none focus:ring-0 shadow-none"
                 placeholder="Titre de votre article..."
                 autofocus
                 autocomplete="off"