feat(media): integrate Spatie Media Library + avatar upload (webp) with AvatarUpload component

_ide_helper.php

@@ -5,7 +5,7 @@
 
 /**
  * A helper file for Laravel, to provide autocomplete information to your IDE
- * Generated for Laravel 12.38.1.
+ * Generated for Laravel 12.39.0.
  *
  * This file should not be included in your code, only analyzed by your IDE!
  *
@@ -22608,6 +22608,17 @@ public static function yieldPushContent($section, $default = '')
             return $instance->yieldPushContent($section, $default);
         }
 
+        /**
+         * Determine if the stack has any content in it.
+         *
+         * @static
+         */
+        public static function isStackEmpty($section)
+        {
+            /** @var \Illuminate\View\Factory $instance */
+            return $instance->isStackEmpty($section);
+        }
+
         /**
          * Flush all of the stacks.
          *

_ide_helper_models.php

@@ -197,33 +197,6 @@ class Client extends \Eloquent {}
 	class CommercialProposal extends \Eloquent {}
 }
 
-namespace App\Models{
-/**
- * @property int $id
- * @property string $imageable_type
- * @property int $imageable_id
- * @property string $path
- * @property string|null $alt Alternative text for the image
- * @property bool $is_cover
- * @property \Illuminate\Support\Carbon|null $created_at
- * @property \Illuminate\Support\Carbon|null $updated_at
- * @property-read Model|\Eloquent $imageable
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image newModelQuery()
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image newQuery()
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image query()
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image whereAlt($value)
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image whereCreatedAt($value)
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image whereId($value)
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image whereImageableId($value)
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image whereImageableType($value)
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image whereIsCover($value)
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image wherePath($value)
- * @method static \Illuminate\Database\Eloquent\Builder<static>|Image whereUpdatedAt($value)
- * @mixin \Eloquent
- */
-	class Image extends \Eloquent {}
-}
-
 namespace App\Models{
 /**
  * @property int $id
@@ -410,10 +383,6 @@ class Payable extends \Eloquent {}
  * @property \Illuminate\Support\Carbon|null $updated_at
  * @property string|null $deleted_at
  * @property-read \App\Models\ProductCategory|null $category
- * @property-read \App\Models\Image|null $cover
- * @property-read \Illuminate\Database\Eloquent\Collection<int, \App\Models\Image> $images
- * @property-read int|null $images_count
- * @property-read bool|null $images_exists
  * @method static \Illuminate\Database\Eloquent\Builder<static>|Product newModelQuery()
  * @method static \Illuminate\Database\Eloquent\Builder<static>|Product newQuery()
  * @method static \Illuminate\Database\Eloquent\Builder<static>|Product query()
@@ -682,6 +651,10 @@ class StockMovement extends \Eloquent {}
  * @property-read \Illuminate\Database\Eloquent\Collection<int, \OwenIt\Auditing\Models\Audit> $audits
  * @property-read int|null $audits_count
  * @property-read bool|null $audits_exists
+ * @property-read mixed $avatar
+ * @property-read \Spatie\MediaLibrary\MediaCollections\Models\Collections\MediaCollection<int, Media> $media
+ * @property-read int|null $media_count
+ * @property-read bool|null $media_exists
  * @property-read \Illuminate\Notifications\DatabaseNotificationCollection<int, \Illuminate\Notifications\DatabaseNotification> $notifications
  * @property-read int|null $notifications_count
  * @property-read bool|null $notifications_exists
@@ -716,7 +689,7 @@ class StockMovement extends \Eloquent {}
  * @method static \Illuminate\Database\Eloquent\Builder<static>|User withoutTrashed()
  * @mixin \Eloquent
  */
-	class User extends \Eloquent implements \OwenIt\Auditing\Contracts\Auditable, \Illuminate\Contracts\Auth\MustVerifyEmail {}
+	class User extends \Eloquent implements \OwenIt\Auditing\Contracts\Auditable, \Spatie\MediaLibrary\HasMedia, \Illuminate\Contracts\Auth\MustVerifyEmail {}
 }
 
 namespace App\Models{

app/Http/Controllers/Settings/ProfileController.php

@@ -35,6 +35,10 @@ public function update(ProfileUpdateRequest $request): RedirectResponse
             $request->user()->email_verified_at = null;
         }
 
+        if ($request->hasFile('avatar')) {
+            $request->user()->addMediaFromRequest('avatar')->toMediaCollection('avatar');
+        }
+
         $request->user()->save();
 
         return to_route('profile.edit');

app/Http/Requests/Settings/ProfileUpdateRequest.php

@@ -27,6 +27,8 @@ public function rules(): array
                 'max:255',
                 Rule::unique(User::class)->ignore($this->user()->id),
             ],
+
+            'avatar' => ['nullable', 'image', 'mimes:jpg,png,webp', 'max:2048'], // Max size in KB
         ];
     }
 }

app/Models/Product.php

@@ -21,10 +21,6 @@
  * @property \Illuminate\Support\Carbon|null $updated_at
  * @property string|null $deleted_at
  * @property-read \App\Models\ProductCategory|null $category
- * @property-read \App\Models\Image|null $cover
- * @property-read \Illuminate\Database\Eloquent\Collection<int, \App\Models\Image> $images
- * @property-read int|null $images_count
- * @property-read bool|null $images_exists
  * @method static \Illuminate\Database\Eloquent\Builder<static>|Product newModelQuery()
  * @method static \Illuminate\Database\Eloquent\Builder<static>|Product newQuery()
  * @method static \Illuminate\Database\Eloquent\Builder<static>|Product query()
@@ -80,14 +76,4 @@ public function category()
     {
         return $this->belongsTo(ProductCategory::class);
     }
-
-    public function images()
-    {
-        return $this->morphMany(Image::class, 'imageable');
-    }
-
-    public function cover()
-    {
-        return $this->morphOne(Image::class, 'imageable')->where('is_cover', true);
-    }
 }

app/Models/User.php

@@ -9,6 +9,9 @@
 use Illuminate\Notifications\Notifiable;
 use Laravel\Fortify\TwoFactorAuthenticatable;
 use OwenIt\Auditing\Contracts\Auditable;
+use Spatie\MediaLibrary\HasMedia;
+use Spatie\MediaLibrary\InteractsWithMedia;
+use Spatie\MediaLibrary\MediaCollections\Models\Media;
 use Spatie\Permission\Traits\HasRoles;
 
 /**
@@ -30,6 +33,10 @@
  * @property-read \Illuminate\Database\Eloquent\Collection<int, \OwenIt\Auditing\Models\Audit> $audits
  * @property-read int|null $audits_count
  * @property-read bool|null $audits_exists
+ * @property-read mixed $avatar
+ * @property-read \Spatie\MediaLibrary\MediaCollections\Models\Collections\MediaCollection<int, Media> $media
+ * @property-read int|null $media_count
+ * @property-read bool|null $media_exists
  * @property-read \Illuminate\Notifications\DatabaseNotificationCollection<int, \Illuminate\Notifications\DatabaseNotification> $notifications
  * @property-read int|null $notifications_count
  * @property-read bool|null $notifications_exists
@@ -64,10 +71,18 @@
  * @method static \Illuminate\Database\Eloquent\Builder<static>|User withoutTrashed()
  * @mixin \Eloquent
  */
-class User extends Authenticatable implements Auditable, MustVerifyEmail
+class User extends Authenticatable implements Auditable, HasMedia, MustVerifyEmail
 {
-    /** @use HasFactory<\Database\Factories\UserFactory> */
-    use HasFactory, HasRoles, Notifiable, \OwenIt\Auditing\Auditable, SoftDeletes, TwoFactorAuthenticatable;
+    /**
+     * @use HasFactory<\Database\Factories\UserFactory>
+     * @use HasRoles<\Spatie\Permission\Traits\HasRoles>
+     * @use InteractsWithMedia<\Spatie\MediaLibrary\InteractsWithMedia>
+     * @use Notifiable<\Illuminate\Notifications\Notifiable>
+     * @use \OwenIt\Auditing\Auditable<\OwenIt\Auditing\Contracts\Auditable>
+     * @use SoftDeletes<\Illuminate\Database\Eloquent\SoftDeletes>
+     * @use TwoFactorAuthenticatable<\Laravel\Fortify\TwoFactorAuthenticatable>
+     */
+    use HasFactory, HasRoles, InteractsWithMedia, Notifiable, \OwenIt\Auditing\Auditable, SoftDeletes, TwoFactorAuthenticatable;
 
     /**
      * The attributes that are mass assignable.
@@ -90,6 +105,7 @@ class User extends Authenticatable implements Auditable, MustVerifyEmail
         'two_factor_secret',
         'two_factor_recovery_codes',
         'remember_token',
+        'media',
     ];
 
     /**
@@ -106,6 +122,38 @@ protected function casts(): array
         ];
     }
 
+    protected $appends = ['avatar'];
+
+    public function getAvatarAttribute()
+    {
+        $media = $this->getFirstMedia('avatar');
+
+        if ($media) {
+            return [
+                'original' => $media->getUrl(),
+                'webp' => $media->getUrl('webp'),
+            ];
+        }
+
+        return null;
+    }
+
+    public function registerMediaCollections(?Media $media = null): void
+    {
+        $this
+            ->addMediaCollection('avatar')
+            ->singleFile()
+            ->acceptsMimeTypes(['image/jpeg', 'image/png', 'image/webp'])
+            ->registerMediaConversions(function () {
+                $this
+                    ->addMediaConversion('webp')
+                    ->format('webp')
+                    ->width(100)
+                    ->height(100)
+                    ->sharpen(10);
+            });
+    }
+
     public function addresses()
     {
         return $this->morphMany(Address::class, 'addressable');

components.json

@@ -1,21 +1,24 @@
 {
-    "$schema": "https://ui.shadcn.com/schema.json",
-    "style": "new-york",
-    "rsc": false,
-    "tsx": true,
-    "tailwind": {
-        "config": "",
-        "css": "resources/css/app.css",
-        "baseColor": "neutral",
-        "cssVariables": true,
-        "prefix": ""
-    },
-    "aliases": {
-        "components": "@/components",
-        "utils": "@/lib/utils",
-        "ui": "@/components/ui",
-        "lib": "@/lib",
-        "hooks": "@/hooks"
-    },
-    "iconLibrary": "lucide"
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "",
+    "css": "resources/css/app.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  },
+  "registries": {
+    "@reui": "https://reui.io/r/{name}.json"
+  }
 }

composer.json

@@ -12,23 +12,24 @@
         "php": "^8.4",
         "asika/agent": "^2.7",
         "inertiajs/inertia-laravel": "^2.0",
-        "laravel/fortify": "^1.30",
-        "laravel/framework": "^12.0",
-        "laravel/tinker": "^2.10.1",
-        "laravel/wayfinder": "^0.1.9",
+        "laravel/fortify": "^1.32",
+        "laravel/framework": "^12.39",
+        "laravel/tinker": "^2.10",
+        "laravel/wayfinder": "^0.1",
         "owen-it/laravel-auditing": "^14.0",
+        "spatie/laravel-medialibrary": "^11.17",
         "spatie/laravel-permission": "^6.23"
     },
     "require-dev": {
         "barryvdh/laravel-debugbar": "^3.16",
         "barryvdh/laravel-ide-helper": "^3.6",
-        "fakerphp/faker": "^1.23",
+        "fakerphp/faker": "^1.24",
         "laravel/boost": "^1.8",
-        "laravel/pail": "^1.2.2",
-        "laravel/pint": "^1.24",
-        "laravel/sail": "^1.41",
+        "laravel/pail": "^1.2",
+        "laravel/pint": "^1.25",
+        "laravel/sail": "^1.48",
         "mockery/mockery": "^1.6",
-        "nunomaduro/collision": "^8.6",
+        "nunomaduro/collision": "^8.8",
         "pestphp/pest": "^4.1",
         "pestphp/pest-plugin-laravel": "^4.0"
     },