{"id":47258055,"url":"https://github.com/slimani-dev/filament-media-manager","last_synced_at":"2026-04-01T18:25:31.454Z","repository":{"id":344355234,"uuid":"1180496976","full_name":"slimani-dev/filament-media-manager","owner":"slimani-dev","description":"A media manager plugin for Filament.","archived":false,"fork":false,"pushed_at":"2026-03-21T17:44:15.000Z","size":154,"stargazers_count":4,"open_issues_count":0,"forks_count":1,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-03-27T15:39:55.142Z","etag":null,"topics":["filament-plugin","laravel","spatie-media-library"],"latest_commit_sha":null,"homepage":"https://media-manager.slimani.dev","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/slimani-dev.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-03-13T05:16:03.000Z","updated_at":"2026-03-25T05:06:47.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/slimani-dev/filament-media-manager","commit_stats":null,"previous_names":["slimani-dev/filament-media-manager"],"tags_count":29,"template":false,"template_full_name":null,"purl":"pkg:github/slimani-dev/filament-media-manager","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/slimani-dev%2Ffilament-media-manager","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/slimani-dev%2Ffilament-media-manager/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/slimani-dev%2Ffilament-media-manager/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/slimani-dev%2Ffilament-media-manager/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/slimani-dev","download_url":"https://codeload.github.com/slimani-dev/filament-media-manager/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/slimani-dev%2Ffilament-media-manager/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31290843,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-01T13:12:26.723Z","status":"ssl_error","status_checked_at":"2026-04-01T13:12:25.102Z","response_time":53,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["filament-plugin","laravel","spatie-media-library"],"created_at":"2026-03-14T21:01:50.470Z","updated_at":"2026-04-01T18:25:31.445Z","avatar_url":"https://github.com/slimani-dev.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Filament Media Manager\n\n[![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/slimani-dev/filament-media-manager/run-tests.yml?branch=main\u0026label=tests\u0026style=flat-square)](https://github.com/slimani-dev/filament-media-manager/actions/workflows/run-tests.yml)\n[![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/slimani-dev/filament-media-manager/phpstan.yml?branch=main\u0026label=phpstan\u0026style=flat-square)](https://github.com/slimani-dev/filament-media-manager/actions/workflows/phpstan.yml)\n[![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/slimani-dev/filament-media-manager/fix-php-code-style-issues.yml?branch=main\u0026label=code%20style\u0026style=flat-square)](https://github.com/slimani-dev/filament-media-manager/actions/workflows/fix-php-code-style-issues.yml)\n[![Total Downloads](https://img.shields.io/packagist/dt/slimani/filament-media-manager.svg?style=flat-square)](https://packagist.org/packages/slimani/filament-media-manager)\n[![License](https://img.shields.io/packagist/l/slimani/filament-media-manager.svg?style=flat-square)](https://github.com/slimani-dev/filament-media-manager/blob/main/LICENSE)\n\nA comprehensive media manager plugin for Filament v4 and v5.\n\n## Features\n\n- **Folder-based organization**: Organize your media into hierarchical folders.\n- **Native Filament integration**: Built specifically for Filament with support for forms, tables, and actions across both v4 and v5 versions.\n- **Smooth UI**: Modern, responsive media browser with search and filtering capabilities.\n- **Hierarchical Folder Navigation**: Browse and organize media using a powerful tree selection interface, thanks to `filament-select-tree`.\n- **Taggable media**: Add tags to your files for easier searching and filtering.\n- **Support for multiple disks**: Configure which disk to use for storage per field or globally.\n\n## Screenshots\n\n### Media Manager Overview\n![Media Manager Overview](https://s3.slimani.dev/media-manager/Screen%20Shot%202026-03-19%20at%2021.35.40.png)\n\n### File Upload\n![Folder Navigation](https://s3.slimani.dev/media-manager/Screen%20Shot%202026-03-19%20at%2021.36.12.png)\n\n### File Details\n![](https://s3.slimani.dev/media-manager/Screen%20Shot%202026-03-19%20at%2021.36.41.png)\n\n### File Preview\n![](https://s3.slimani.dev/media-manager/Screen%20Shot%202026-03-19%20at%2021.36.46.png)\n\n### Filter, Search and Sort (with Multiple selectin and Actions)\n![Rich Text Editor Integration](https://s3.slimani.dev/media-manager/Screen%20Shot%202026-03-19%20at%2021.37.50.png)\n\n### Move Action Dialoge\n![File Details](https://s3.slimani.dev/media-manager/Screen%20Shot%202026-03-19%20at%2021.36.36.png)\n\n### Filtering by Type (Document) and Sorting By size\n![Image Editor](https://s3.slimani.dev/media-manager/Screen%20Shot%202026-03-19%20at%2021.39.24.png)\n\n### Rich Text Integration, Media Picker, MediaEntries \n![Bulk Actions](https://s3.slimani.dev/media-manager/Screen%20Shot%202026-03-19%20at%2021.40.41.png)\n\n### Media Picker (in Action)\n![Settings \u0026 Configuration](https://s3.slimani.dev/media-manager/Screen%20Shot%202026-03-19%20at%2021.41.23.png)\n\n## Installation\n\nYou can install the package via composer:\n\n```bash\ncomposer require slimani/filament-media-manager\n```\n\n```bash\n# Publish Media Manager migrations\nphp artisan vendor:publish --tag=\"media-manager-migrations\"\n\n# Publish Spatie MediaLibrary migrations (if not already published)\nphp artisan vendor:publish --provider=\"Spatie\\MediaLibrary\\MediaLibraryServiceProvider\" --tag=\"medialibrary-migrations\"\n\n# Run migrations\nphp artisan migrate\n```\n\nYou can publish the config file with:\n\n```bash\nphp artisan vendor:publish --tag=\"media-manager-config\"\n```\n\n## Styling\n\nIf you are using a [Custom Filament Theme](https://filamentphp.com/docs/5.x/styling/overview#creating-a-custom-theme), you must include both the plugin's pre-defined styles and allow Tailwind to scan your components for utility classes.\n\nAdd the following lines to your `theme.css` file:\n\n```css\n@import '../../../../vendor/slimani/filament-media-manager/resources/css/media-manager.css';\n\n@source '../../../../vendor/slimani/filament-media-manager/resources/**/*';\n```\n\n### Why both?\n- **@import**: Loads the custom component styles (like the media grid and picker layouts) that are unique to this plugin.\n- **@source**: Allows Tailwind to scan the plugin's Blade files and generate any standard utility classes (like `p-4`, `flex`, etc.) that are used in the UI.\n\n## Usage\n\n### Plugin Registration\n\nRegister the plugin in your Panel Provider:\n\n```php\nuse Slimani\\MediaManager\\MediaManagerPlugin;\n\npublic function panel(Panel $panel): Panel\n{\n    return $panel\n        -\u003eplugin(MediaManagerPlugin::make());\n}\n```\n\n### Prepare Model\n\nTo use the media manager with your models, add the `InteractsWithMediaFiles` trait. This is required for relationships and picker functionality.\n\n#### 1. Prepare your Migration\n\n- **For single-file relationships** (like `avatar_id` or `cv_id`), you need to add the foreign key columns to your model's migration:\n\n```php\nSchema::table('users', function (Blueprint $table) {\n    $table-\u003eforeignId('avatar_id')-\u003enullable()-\u003econstrained('media_files')-\u003enullOnDelete();\n    $table-\u003eforeignId('cv_id')-\u003enullable()-\u003econstrained('media_files')-\u003enullOnDelete();\n});\n```\n\n- **For multiple/polymorphic relationships** (using `$this-\u003emediaFiles()`), **no migration is required**. These relationships utilize the built-in `media_attachments` table included in the package migrations.\n\n#### 2. Prepare your Model\n\nAdd the trait and define your specific relationships. Don't forget to add the foreign keys to your `$fillable` array.\n\n```php\nnamespace App\\Models;\n\nuse Illuminate\\Database\\Eloquent\\Model;\nuse Slimani\\MediaManager\\Concerns\\InteractsWithMediaFiles;\n\nclass User extends Model\n{\n    use InteractsWithMediaFiles;\n\n    protected $fillable = [\n        'name',\n        'email',\n        'avatar_id',\n        'cv_id',\n    ];\n\n    public function avatar(): \\Illuminate\\Database\\Eloquent\\Relations\\BelongsTo\n    {\n        return $this-\u003emediaFile('avatar_id');\n    }\n\n    public function cv(): \\Illuminate\\Database\\Eloquent\\Relations\\BelongsTo\n    {\n        return $this-\u003emediaFile('cv_id');\n    }\n\n    /**\n     * Optional: Define custom collection relationships\n     */\n    public function documents(): \\Illuminate\\Database\\Eloquent\\Relations\\MorphToMany\n    {\n        return $this-\u003emediaFiles('documents');\n    }\n}\n```\n\n### Media Picker Field\n\nUse the `MediaPicker` field in your Filament forms. It uses the \"Prepare Model\" setup to handle file selection via a modal.\n\n```php\nuse Slimani\\MediaManager\\Form\\MediaPicker;\nuse Filament\\Forms\\Form;\n\npublic static function form(Form $form): Form\n{\n    return $form\n        -\u003eschema([\n            // Single file selection with specific names (requires InteractsWithMediaFiles in Model)\n            MediaPicker::make('avatar_id')\n                -\u003erelationship('avatar')\n                -\u003elabel('User Avatar')\n                -\u003erequired(),\n\n            MediaPicker::make('cv_id')\n                -\u003erelationship('cv')\n                -\u003elabel('User CV'),\n\n            // Multiple file selection (requires MorphToMany relationship in Model)\n            MediaPicker::make('documents')\n                -\u003erelationship('documents')\n                -\u003emultiple()\n                -\u003elabel('User Documents'),\n        ]);\n}\n```\n\n### Media Column\n\nDisplay media in your Filament tables using the `MediaColumn`:\n\n```php\nuse Slimani\\MediaManager\\Tables\\Columns\\MediaColumn;\n\nMediaColumn::make('avatar')\n    -\u003ecircular()\n    -\u003estacked()\n```\n\n### Media Infolist Entries\n\nThe package provides two types of infolist entries: `MediaImageEntry` for image-specific features and `MediaFileEntry` for general file types with preview actions.\n\n#### Media Image Entry\nUse `MediaImageEntry` when you want to display image thumbnails with native Filament `ImageEntry` features (circular, stacked, etc.) and media manager conversion support.\n\n```php\nuse Slimani\\MediaManager\\Infolists\\Components\\MediaImageEntry;\n\nMediaImageEntry::make('avatar')\n    -\u003elabel('User Avatar')\n    -\u003econversion('thumb') // Optional, defaults to 'thumb'\n    -\u003ecircular() // Native Filament feature\n    -\u003ewidth(100)\n```\n\n#### Media File Entry\nUse `MediaFileEntry` for a generic media display that includes an automatic \"Open Preview\" action, ideal for documents, videos, and mixed media.\n\n```php\nuse Slimani\\MediaManager\\Infolists\\Components\\MediaFileEntry;\n\nMediaFileEntry::make('cv')\n    -\u003elabel('User CV')\n```\n\nBoth components support the media preview action that opens files in a slide-over.\n\n### Rich Text Editor Integration\n\nThe Media Manager integrates deeply with Filament's `RichEditor`, allowing you to insert images directly from your media library and ensuring that images always use fresh, valid URLs (supporting signed/temporary URLs).\n\n#### 1. Prepare your Model\n\nImplement the `HasRichContent` interface and use the `InteractsWithRichContent` trait. Then, use `setUpRichContent` to register the media manager configuration for your field.\n\n```php\nuse Filament\\Forms\\Components\\RichEditor\\Models\\Concerns\\InteractsWithRichContent;\nuse Filament\\Forms\\Components\\RichEditor\\Models\\Contracts\\HasRichContent;\nuse Slimani\\MediaManager\\Form\\RichEditor\\MediaManagerRichContentPlugin;\n\nclass User extends Authenticatable implements HasRichContent\n{\n    use InteractsWithRichContent;\n\n    public function setUpRichContent(): void\n    {\n        $this-\u003eregisterRichContent('resume')\n            -\u003eplugins([\n                MediaManagerRichContentPlugin::make()\n                    -\u003ecollection('preview')\n                    -\u003edirectory('User/Resumes'),\n            ]);\n    }\n}\n```\n\n\u003e **Note**: Implementing `HasFileAttachmentProvider` in the plugin means that Filament automatically resolves the correct provider. You no longer need to call `fileAttachmentProvider()` manually on the attribute or renderer.\n\n#### 2. Use in Forms\n\nAdd the `MediaManagerRichContentPlugin` to your `RichEditor` component. This adds a \"Media Library\" button to the toolbar.\n\n```php\nuse Filament\\Forms\\Components\\RichEditor;\nuse Slimani\\MediaManager\\Form\\RichEditor\\MediaManagerRichContentPlugin;\n\nRichEditor::make('resume')\n    -\u003eplugins([\n        MediaManagerRichContentPlugin::make()\n            -\u003eacceptedFileTypes([\"image/*\"]), // Optional: Limit to images only\n    ])\n```\n\n#### 3. Use in Infolists (Dynamic Rendering)\n\nTo ensure that images in your rich text always use fresh URLs (especially important if using temporary or signed URLs), use the `renderRichContent` method in your Infolist.\n\n```php\nuse Filament\\Infolists\\Components\\TextEntry;\n\nTextEntry::make('resume')\n    -\u003ehtml()\n    -\u003estate(fn ($record) =\u003e $record-\u003erenderRichContent('resume'))\n```\n\nThis method parses the stored HTML and resolves each image ID into a fresh URL on the fly, solving the \"expired link\" problem entirely.\n\n\n### Plugin Customization\n\nYou can customize the Media Manager directly in your Panel Provider:\n\n```php\nuse Slimani\\MediaManager\\MediaManagerPlugin;\n\nMediaManagerPlugin::make()\n    -\u003enavigationGroup('System')\n    -\u003enavigationLabel('Assets')\n    -\u003enavigationIcon('heroicon-o-folder')\n    -\u003enavigationSort(5)\n    -\u003eshouldRegisterNavigation(fn () =\u003e auth()-\u003euser()-\u003eisAdmin())\n    -\u003eheaderWidgets([\n        MyCustomWidget::class,\n    ])\n    -\u003efooterWidgets([\n        AnotherWidget::class,\n    ])\n    -\u003eheader(view('custom.header'))\n    -\u003efooter(view('custom.footer'))\n    -\u003ewithVideoThumbnails() // Optional: Enable video thumbnails (requires FFMPEG)\n```\n\n#### Video Thumbnails\n\nThumbnail generation for videos is handled natively by the underlying Spatie MediaLibrary when **FFMPEG** and **FFProbe** are installed on your server.\n\nTo use this feature, you must install the FFMPEG PHP dependency:\n\n```bash\ncomposer require php-ffmpeg/php-ffmpeg\n```\n\nFor more information on video processing requirements, please refer to the [Spatie MediaLibrary Documentation](https://spatie.be/docs/laravel-medialibrary/v11/advanced-usage/generating-thumbnails-for-videos).\n\n#### Media Library Conversions\n\nYou can customize or add media conversions from your application's `AppServiceProvider` or a dedicated Service Provider. Default conversions (`thumb` and `preview`) are registered first, and your callback can override them or add new ones.\n\n```php\nuse Slimani\\MediaManager\\Models\\File;\nuse Spatie\\MediaLibrary\\MediaCollections\\Models\\Media;\n\npublic function boot(): void\n{\n    File::registerMediaConversionsUsing(function (File $file, ?Media $media = null) {\n        // Override default 'thumb' (300x300)\n        $file-\u003eaddMediaConversion('thumb')\n            -\u003ewidth(150)\n            -\u003eheight(150)\n            -\u003enonQueued();\n\n        // Add a new custom conversion\n        $file-\u003eaddMediaConversion('square')\n            -\u003ewidth(500)\n            -\u003eheight(500)\n            -\u003enonQueued();\n        \n        // Default 'preview' (800x800) is kept if not overridden\n    });\n}\n```\n\n#### Using Conversions in Components\n\nAfter defining your conversions, you can specify which one to use in your components using the `conversion()` method. This controls which conversion is used for the table thumbnail, infolist image, or form picker preview.\n\n```php\nuse Slimani\\MediaManager\\Tables\\Columns\\MediaColumn;\nuse Slimani\\MediaManager\\Infolists\\Components\\MediaImageEntry;\nuse Slimani\\MediaManager\\Form\\MediaPicker;\n\n// In Tables\nMediaColumn::make('avatar')\n    -\u003econversion('thumb')\n\n// In Infolists\nMediaImageEntry::make('avatar')\n    -\u003econversion('preview')\n\nMediaFileEntry::make('cv')\n    -\u003econversion('thumb')\n\n// In Forms (controls the picker's file preview)\nMediaPicker::make('avatar_id')\n    -\u003econversion('thumb')\n```\n\nAll components default to the `thumb` conversion if none is specified.\n\n## Testing \u0026 Support\n\n### Seeders Example\n\nTo populate your media manager with initial data, you can use a seeder. Here is an example of how to set up folders and files:\n\n```php\nuse Slimani\\MediaManager\\Models\\Folder;\nuse Slimani\\MediaManager\\Models\\File;\n\npublic function run(): void\n{\n    $images = Folder::create(['name' =\u003e 'Project Images']);\n    $docs = Folder::create(['name' =\u003e 'Documents']);\n\n    // here should be the code if you have real files\n    // for now we will use dummy data\n\n    $banner = File::create([\n        'name' =\u003e 'Main Banner',\n        'folder_id' =\u003e $images-\u003eid,\n        'size' =\u003e 1024,\n        'extension' =\u003e 'jpg',\n        'mime_type' =\u003e 'image/jpeg',\n        'uploaded_by_user_id' =\u003e 1,\n    ]);\n\n    // Attach actual media using Spatie MediaLibrary\n    $banner-\u003eaddMediaFromUrl('https://picsum.photos/1200/800')\n        -\u003etoMediaCollection('default');\n}\n```\n\n### Running Tests\n\n```bash\ncomposer test\n```\n\n## Changelog\n\nPlease see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.\n\n## Contributing\n\nPlease see [CONTRIBUTING](CONTRIBUTING.md) for details.\n\n## Security Vulnerabilities\n\nPlease review [our security policy](SECURITY.md) on how to report security vulnerabilities.\n\n## Credits\n\n- [CodeWithDennis - Select Tree](https://filamentphp.com/plugins/codewithdennis-select-tree)\n- [HugoMyb - Media Action](https://filamentphp.com/plugins/hugomyb-media-action)\n- [All Contributors](../../contributors)\n\n## License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fslimani-dev%2Ffilament-media-manager","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fslimani-dev%2Ffilament-media-manager","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fslimani-dev%2Ffilament-media-manager/lists"}