PHPackages                             laravelguru/laravel-filehandler - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [File &amp; Storage](/categories/file-storage)
4. /
5. laravelguru/laravel-filehandler

ActiveLibrary[File &amp; Storage](/categories/file-storage)

laravelguru/laravel-filehandler
===============================

The Laravel Inertia React File Management package seamlessly integrates file management into your Laravel applications using React and Inertia.js. Featuring prebuilt file input components and popup file dialogs, this package simplifies file uploads, storage, browsing, and management.

1.1.0(1y ago)124MITPHPPHP ^7.3|~8.0.0|~8.1.0|~8.2.0|~8.3.0

Since Aug 7Pushed 1y ago1 watchersCompare

[ Source](https://github.com/InsafNilam/file-manager)[ Packagist](https://packagist.org/packages/laravelguru/laravel-filehandler)[ Docs](https://github.com/InsafNilam/file-manager.git)[ RSS](/packages/laravelguru-laravel-filehandler/feed)WikiDiscussions master Synced 2d ago

READMEChangelog (1)Dependencies (5)Versions (2)Used By (0)

Laravel Inertia React File Management Package
=============================================

[](#laravel-inertia-react-file-management-package)

[![Latest Version on Packagist](https://camo.githubusercontent.com/11f05b90a33010aa4b9a47bf0fcbcb9ad507275148f9f1680b2e33ddd276176b/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6c61726176656c677572752f6c61726176656c2d66696c6568616e646c65722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/laravelguru/laravel-filehandler)[![Total Downloads](https://camo.githubusercontent.com/199b0a5f8d1e2bd2701ac6a8d7def2e247f9323c2078961f3e3e17261ae337c4/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6c61726176656c677572752f6c61726176656c2d66696c6568616e646c65722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/laravelguru/laravel-filehandler)[![GitHub Actions](https://github.com/InsafNilam/file-manager/actions/workflows/main.yml/badge.svg)](https://github.com/InsafNilam/file-manager/actions/workflows/main.yml/badge.svg)

Overview
--------

[](#overview)

The Laravel Inertia React File Management package provides seamless file management capabilities for your Laravel applications using React and Inertia.js. It includes prebuilt file input components and popup file dialogs for easy file uploads, storage, browsing, and management.

Features
========

[](#features)

- Seamless integration with React and Inertia.js
- Utilizes ShadCN components for dialogs, buttons, scroll areas, and tabs
- Prebuilt file input components and popup file dialogs
- Smooth single-page application (SPA) transitions
- Comprehensive file operations: upload, download, delete, move files
- Responsive file browser
- Ideal for CMS, e-commerce platforms, project management tools, and personal portfolios

Installation
------------

[](#installation)

You can install the package via composer:

```
composer require laravelguru/laravel-filehandler
```

Register Service Provider
=========================

[](#register-service-provider)

If you are using laravel 11 or update version you should add the service provider into bootstrap/providers.php:

```
validate([
        "cv_path" => ["nullable", "integer", "exists:files,id"],
        "brochures" => ["nullable", "array", "max:5"],
        "brochures.*" => ["nullable", "integer", "exists:files,id"],
    ])
```

- Database Migration Setup

```
    public function up(): void
    {
        Schema::create('courses', function (Blueprint $table) {
            $table->string('brochures')->nullable();
        });
    }
```

- Controller Method for the Create Function (**Ensure Focus on the documents variable during File Synchronization in Your Views**)

```
public function create()
{
    $faculties = Faculty::query()->orderBy('name', 'asc')->get();
    $documents = File::query()->where('user_id', auth()->id())->where('folder', 'documents')->paginate(9)->onEachSide(1);

    return Inertia::render('Courses/Create', [
        'documents' => FileResource::collection($documents),
        'faculties' => FacultyResource::collection($faculties),
    ]);
}
```

- Guide to Using File Input for File Synchronization in your Create View (**Ensure Focus on the documents variable + brochures during File Synchronization in Your Views**)

```
export default function Create({ auth, documents, faculties }) {
    const { data, setData, post, processing, errors, reset } = useForm({
        brochures: null,
    });

    const [files, setFiles] = useState([]);
    const [submitTriggered, setSubmitTriggered] = useState(false);

    const onSubmit = (e) => {
        e.preventDefault();

        if (files.length === 0) {
        post(route("courses.store"), {
            onSuccess: () => {
                reset();
            },
            onError: () => {
                console.log("Error creating course");
            },
        });
        return;
        }

        setData(
            "brochures",
            files.map((file) => file.id)
        );

        setSubmitTriggered(true);
    };

    useEffect(() => {
        if (submitTriggered) {
        post(route("courses.store"), {
            onSuccess: () => {
                reset();
                setSubmitTriggered(false);
            },
            onError: () => {
                console.log("Error creating course");
                setSubmitTriggered(false);
            },
        });
        }
    }, [submitTriggered]);

    return (

            Brochures

                 {
                        setFiles(files);
                    }}
                    apiUrl={route("files.store")}
                    multiple={true}
                    documents={documents}
                />

    )
}
```

- Controller Method for the Store Function (**Ensure Focus on the brochures variable during File Store in respective database table**)

```
    public function store(StoreCourseRequest $request)
        {
            $data = $request->validated();

            if (isset($data['brochures'])) {
                $data['brochures'] = json_encode($data['brochures'], true);
            }

            $data['created_by'] = auth()->id();
            $data['updated_by'] = auth()->id();

            if (Gate::allows('create_course')) {
                Course::create($data);
                return redirect()->route('courses.index')->with('success', 'Course created successfully');
            } else {
                return redirect()->back()->with('error', 'You are not authorized to create a course');
            }
        }
```

- Controller Method for the Edit Function (**Ensure Focus on the documents variable + brochures during File Synchronization in Your Views**)

```
    public function edit(Course $course)
    {
        if (Gate::allows('update_course', $course)) {
            $faculties = Faculty::query()->orderBy('name', 'asc')->get();
            $documents = File::query()->where('user_id', auth()->id())->where('folder', 'documents')->paginate(9)->onEachSide(1);

            $array = json_decode($course->brochures) ?? [];
            $brochures = File::whereIn('id', $array)->get();

        return Inertia::render('Courses/Edit', [
            'course' => new CourseResource($course),
            'brochures' => FileResource::collection($brochures),
            'documents' => FileResource::collection($documents),
            'faculties' => FacultyResource::collection($faculties),
        ]);
        } else {
        return redirect()->back()->with('error', 'You are not authorized to edit this course');
        }
    }
```

- Guide to Using File Input for File Synchronization in your Edit View (**Ensure Focus on the documents variable + brochures during File Synchronization in Your Views**)

```
export default function Edit({auth, course, brochures, documents, faculties }){
    const { data, setData, put, processing, errors, reset } = useForm({
        brochures: null,
    })

    const [files, setFiles] = useState(brochures.data ?? []);

    const onSubmit = (e) => {
        e.preventDefault();
        if (files.length === 0) {
            put(route("courses.update", course.id), {
                preserveScroll: true,
                onSuccess: () => {
                reset();
                },
                onError: () => {
                console.log("Error updating course");
                },
            });
        return;
        }

    setData(
      "brochures",
      files.map((file) => file.id)
    );

    setSubmitTriggered(true);
  };

    useEffect(() => {
        if (submitTriggered) {
        put(route("courses.update", course.id), {
            onSuccess: () => {
            reset();
            setSubmitTriggered(false);
            },
            onError: () => {
            console.log("Error updating course");
            setSubmitTriggered(false);
            },
        });
        }
    }, [submitTriggered]);

    return(

            Brochures

                 {
                    setFiles(files);
                }}
                apiUrl={route("files.store")}
                multiple={true}
                documents={documents}
                />

        )
    }
```

- Controller Method for the Update Function (**Ensure Focus on the brochures variable during File Update in respective database table**)

```
    public function update(UpdateCourseRequest $request, Course $course)
    {
    //
        $data = $request->validated();

        if (isset($data['brochures'])) {
        $data['brochures'] = json_encode($data['brochures'], true);
        }

        $data['updated_by'] = auth()->id();

        if (Gate::allows('update_course', $course)) {
        $course->update($data);
        return redirect()->route('courses.index')->with('success', 'Course updated successfully');
        } else {
        return redirect()->back()->with('error', 'You are not authorized to update this course');
        }
    }
```

#### Handle Single File

[](#handle-single-file)

- Validation Rules Configuration

```
    $data = $request->validate([
        "cv_path" => ["nullable", "integer", "exists:files,id"],
    ])
```

- Database Migration Setup

```
    public function up(): void
    {
        Schema::create('users', function (Blueprint $table) {
            $table->string('cv_path')->nullable();
        });
    }
```

- Controller Method for the Edit Function (**Ensure Focus on the cv\_path and documents variable during File Edit during File Synchronization in Your Views**)

```
  public function edit(User $user)
  {
        $documents = File::query()->where('user_id', auth()->id())->where('folder', 'documents')->paginate(9)->onEachSide(1);

        $cv_array = [json_decode($user->cv_path)] ?? [];
        $cv_path = [];

        if (is_array($cv_array) && count($cv_array) > 0) {
            $cv_path = File::whereIn('id', $cv_array)->get();
        }

        return Inertia::render('User/Edit', [
          'user' => new UserResource($user),
          'cv_path' => FileResource::collection($cv_path),
          'documents' => FileResource::collection($documents),
        ]);
    }
```

- Guide to Using File Input for File Synchronization in your Edit View (**Ensure Focus on the cv\_path variable + brochures during File Synchronization in Your Views**)

```
export default function EditStaff({ auth, user, cv_path, documents }) {
    const { data, setData, put, processing, errors, reset } = useForm({
        cv_path: null
    });

    const [cvFile, setCvFile] = useState(cv_path.data ?? []);

    return (

            Upload CV

                 {
                        setCvFile(files);
                        setData("cv_path", files?.[0]?.id);
                    }}
                    apiUrl={route("files.store")}
                    multiple={false}
                    documents={documents}
                />

    )
}
```

#### Handle Show File

[](#handle-show-file)

- Controller Method for the Show Function (multiple + single) (**Ensure Focus on the brochures variable during File Show during File Synchronization in Your Views**)

```
    public function show(Course $course)
    {
        $modules = $course->modules()->orderBy('created_at', 'asc')
        ->paginate(10)
        ->onEachSide(1);

        $array = json_decode($course->brochures) ?? [];
        $brochures = File::whereIn('id', $array)->get();

        return Inertia::render('Courses/Show', [
            'course' => new CourseResource($course->loadCount('modules')),
            'brochures' => FileResource::collection($brochures),
            'modules' => ModuleResource::collection($modules),
        ]);
    }
```

- Guide to display files that used File Input for File Synchronization in your Show View (**Ensure Focus on the brochures variable during File Synchronization in Your Views**)

```
export default function Show({ auth, course, brochures, modules }) {
    return(

        {
            brochures.data.map((brochure) => (

                            {brochure.name}

                        2.4MB

                        Download

            ))
        }

    )
}
```

### FileDialog

[](#filedialog)

- Validation Rules Configuration

```
    $data = $request->validate([
        "image" => ["nullable", "string"],
    ])
```

- Database Migration Setup

```
    public function up(): void
    {
        Schema::create('courses', function (Blueprint $table) {
            $table->string('image')->nullable();
        });
    }
```

- Frontend Implementation

```

         {
            if (!files?.length) setData("image", null);
            setSelectedFiles(files);
            setData("image", files?.[0]?.path);
            }}
            multiple={false}
            apiUrl={route("files.store")}
            documents={documents}
        >

```

The store and update methods using the File Dialog for models function similarly to how you handle other string variables in Laravel. For detailed guidance, please refer to the [Laravel Documentation](https://laravel.com/docs/11.x/readme).

### Testing

[](#testing)

```
composer test
```

### Changelog

[](#changelog)

Please see [CHANGELOG](CHANGELOG.md) for more information what has changed recently.

Contributing
------------

[](#contributing)

Please see [CONTRIBUTING](CONTRIBUTING.md) for details.

### Security

[](#security)

If you discover any security related issues, please email  instead of using the issue tracker.

Credits
-------

[](#credits)

- [Insaf Nilam](https://github.com/laravelguru)
- [All Contributors](../../contributors)

License
-------

[](#license)

The MIT License (MIT). Please see [License File](LICENSE.md) for more information.

Laravel Package Boilerplate
---------------------------

[](#laravel-package-boilerplate)

This package was generated using the [Laravel Package Boilerplate](https://laravelpackageboilerplate.com).

###  Health Score

28

—

LowBetter than 52% of packages

Maintenance32

Infrequent updates — may be unmaintained

Popularity9

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity55

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Unknown

Total

1

Last Release

696d ago

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/89188261?v=4)[Insaf Nilam](/maintainers/InsafNilam)[@InsafNilam](https://github.com/InsafNilam)

---

Top Contributors

[![InsafNilam](https://avatars.githubusercontent.com/u/89188261?v=4)](https://github.com/InsafNilam "InsafNilam (53 commits)")

---

Tags

laravel-fileupload-componentlaravelgurularavel-filehandlerlaravel-filemanagementreact-filemanagementinertia-filemanagementlaravel-react-fileuploadinertia-laravel-filehandlerreact-laravel-filehandlinglaravel-inertia-filemanagementreact-fileupload-laravelinertia-fileupload-laravelreact-laravel-filestorageinertia-laravel-filestoragereact-filemanager-laravellaravel-inertia-fileuploadlaravel-react-filestorageinertia-laravel-fileuploaderreact-laravel-fileoperationsinertia-filemanagement-reactreact-laravel-filebrowserinertia-laravel-filesystemreact-laravel-filemanager

###  Code Quality

TestsPHPUnit

### Embed Badge

![Health badge](/badges/laravelguru-laravel-filehandler/health.svg)

```
[![Health](https://phpackages.com/badges/laravelguru-laravel-filehandler/health.svg)](https://phpackages.com/packages/laravelguru-laravel-filehandler)
```

###  Alternatives

[statamic/cms

The Statamic CMS Core Package

4.8k3.6M986](/packages/statamic-cms)[code16/sharp

Laravel Content Management Framework

79164.7k8](/packages/code16-sharp)[api-platform/laravel

API Platform support for Laravel

58171.6k14](/packages/api-platform-laravel)[erag/laravel-lang-sync-inertia

A powerful Laravel package for syncing and managing language translations across backend and Inertia.js (Vue/React/Svelte) frontends, offering effortless localization, auto-sync features, and smooth multi-language support for modern Laravel applications.

4925.3k](/packages/erag-laravel-lang-sync-inertia)[emargareten/inertia-modal

Inertia Modal is a Laravel package that lets you implement backend-driven modal dialogs for Inertia apps.

90142.9k](/packages/emargareten-inertia-modal)[tomshaw/electricgrid

A feature-rich Livewire package designed for projects that require dynamic, interactive data tables.

119.4k](/packages/tomshaw-electricgrid)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
