better file password implementation

app/Http/Controllers/MediaController.php

@@ -72,6 +72,13 @@ class MediaController extends Controller
         }
 
         $media = $media->paginate($perPage)->onEachSide(1);
+
+        // Transform the 'password' field of each item in the collection
+        $media->getCollection()->transform(function ($item) {
+            $item->password = $item->password ? 'yes' : null;
+            return $item;
+        });
+
         return $media;
     }
 

app/Models/Media.php

@@ -54,8 +54,7 @@ class Media extends Model
      * @var array
      */
     protected $casts = [
-        'variants' => 'array',
+        'variants' => 'array'
-        'password' => 'hashed'
     ];
 
     /**

app/Traits/HasFiles.php

@@ -10,7 +10,11 @@ trait HasFiles
 {
     public function files($collection = null)
     {
+//        return $this->morphToMany(Media::class, 'mediable')
+//            ->wherePivot('collection', $collection);
+
         return $this->morphToMany(Media::class, 'mediable')
+            ->selectRaw("*, CASE WHEN password IS NULL THEN NULL ELSE 'yes' END AS password")
             ->wherePivot('collection', $collection);
     }
 

resources/js/media-picker.js

@@ -131,6 +131,7 @@ const SMMediaPicker = {
                             x-on:click="SMMediaPicker.updateSelection(item.name)"
                             x-on:dblclick="SMMediaPicker.doubleClick(item.name)"
                             >
+                            <i x-show="item.password" class="fa-solid fa-lock text-xl text-gray-600 absolute -top-2 -left-1" style="text-shadow: -1px -1px 0 #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px 1px 0 #FFF;"></i>
                             <div x-show="$store.media.selected.some(i => i === item.name)" class="absolute -top-1.5 -right-2 w-6 h-6 bg-primary-color text-white flex items-center justify-center text-lg border border-white rounded"><i class="fa-solid fa-check"></i></div>
                             <div class="flex-grow flex items-center justify-center pointer-events-none select-none">
                                 <img x-bind:src="item.thumbnail" class="rounded max-h-32" />

resources/views/admin/media/index.blade.php

@@ -25,7 +25,7 @@
                 <x-slot:body>
                     @foreach ($media as $medium)
                         <tr>
-                            <td><img src="{{ $medium->thumbnail }}" class="max-h-12 max-w-12 -ml-2 -my-3 mr-3 inline rounded" alt="{{ $medium->title }}" />{{ $medium->title }}</td>
+                            <td><img src="{{ $medium->thumbnail }}" class="max-h-12 max-w-12 -ml-2 -my-3 mr-3 inline rounded" alt="{{ $medium->title }}" />{{ $medium->title }}{!! $medium->password !== null ? '<i class="fa-solid fa-lock text-xs text-gray-400 ml-0.5 -translate-y-1.5 scale-75"></i>': '' !!}</td>
                             <td>{{ \App\Helpers::bytesToString($medium->size) }}</td>
                             <td>{{ $medium->mime_type }}</td>
                             <td>{{ \Carbon\Carbon::parse($medium->created_at)->format('M j Y, g:i a') }}</td>

resources/views/components/ui/filelist.blade.php

@@ -12,9 +12,12 @@
     <h3 class="text-xl font-semibold">{{ $label }}</h3>
     <ul x-show="$store.files.length > 0" class="flex flex-col bg-white p-4 border border-gray-300 rounded-lg gap-4 mt-2">
         <template x-for="file in $store.files" :key="file.name">
-        <li class="flex items-center">
+            <li class="flex items-center">
                 <img class="w-10 mr-2" :src="file.thumbnail" />
-                <a class="flex-grow link" :href="file.url" x-text="file.title" target="_blank"></a>
+                <div class="flex-grow">
+                    <a class="link" :href="file.url" x-text="file.title" target="_blank"></a>
+                    <i x-show="file.password" x-cloak class="fa-solid fa-lock text-xs text-gray-400 -translate-x-0.5 -translate-y-1.5 scale-75"></i>
+                </div>
                 <a class="cursor-pointer text-gray-400 w-7 text-center hover:text-primary-color" :href="file.url + '?download=1'"><i class="fa-solid fa-download"></i></a>
                 @if($editor)
                     <i class="text-gray-400 w-7 text-center fa-solid fa-trash hover:text-red-500 cursor-pointer" x-on:click.prevent="removeFile(file.name)"></i>