v1.6 released

* dev:
  v1.5.2

.env.example

@@ -5,6 +5,8 @@ APP_DEBUG=true
 APP_URL=http://localhost
 
 LOG_CHANNEL=stack
+SCOUT_DRIVER=tntsearch
+FILESYSTEM_DRIVER=local
 
 DB_CONNECTION=mysql
 DB_HOST=127.0.0.1
@@ -37,10 +39,16 @@ AWS_SECRET_ACCESS_KEY=
 AWS_DEFAULT_REGION=us-east-1
 AWS_BUCKET=
 
-PUSHER_APP_ID=
-PUSHER_APP_KEY=
-PUSHER_APP_SECRET=
-PUSHER_APP_CLUSTER=mt1
+DO_SPACES_KEY=
+DO_SPACES_SECRET=
+DO_SPACES_ENDPOINT=
+DO_SPACES_REGION=
+DO_SPACES_BUCKET=
 
 MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
 MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
+
+PASSPORT_CLIENT_ID=
+PASSPORT_CLIENT_SECRET=
+
+APP_DEPLOY_SECRET=

README.md

@@ -1,50 +1,52 @@
-## VueFileManager - Make your own Private Cloud with VueFileManager client powered by Laravel and Vue
-For installation, please read [Online Documentation](https://vuefilemanager.hi5ve.digital/docs/).
-![VueFileManager](https://vuefilemanager.hi5ve.digital/assets/images/vue-file-manager-in-devices-dark.png)
+### Documentation
+[Read online documentation](https://vuefilemanager.com/docs/)
 
-**Features:**
+### Demo & dev preview links
+* For visit demo version click here [demo.vuefilemanager.com](https://demo.vuefilemanager.com/) 
+* For visit dev version click here [dev.vuefilemanager.com](https://dev.vuefilemanager.com/) (It's auto deployed dev branch. Can be unstable and not ready for production)
 
-### Drag & Drop
-Reorder your files easily, just drag your folder or file and drop to another folder.
+### Installation setup
 
-### List & Grid Preview
-You can change from two types of file and folder previews. Show your items in list or grid preview.
+Run these commands to install vendors:
+```
+composer install
+```
+```
+npm install
+```
 
-### Background Uploading
-Your files is uploaded in the background, so nothing will stop you from working with the files.
+Setup your database in .env and run this command:
+```
+php artisan setup:prod
+```
 
-### File & Folder searching
-Search your items quickly, from anywhere in the app you are.
+It automatically:
+* Migrate database
+* Generate Application key
+* Create Passport Encryption keys
+* Create Password grant client
+* Create Personal access client
 
-### Custom Context Menu
-Quick actions next to your file on your right click.
+Then, copy generated password grant client `Client ID`, `Client secret` and paste it to .env files here:
+```
+PASSPORT_CLIENT_ID=<your_passport_client_id>
+PASSPORT_CLIENT_SECRET=<your_passport_client_secret>
+```
+For sending forgoten password request via email, fill your mail driver in .env
 
-### File Details
-Get preview of your files quickli in right panel next to your files.
+### Run Application
+To start server on your localhost, run this command
+```
+php artisan serve
+```
 
-### Improved Mobile User Experience
-Need to quickly upload or get your files on your smartphone? It’s not problem.
+To compiles and hot-reloads for development, run this command
+```
+npm run hot
+```
 
-### Laravel PHP Framework
-You don't have to create your own API for VueFileManager. You can use our pre-build backend in Laravel PHP Framework.
-
-### Vue.js
-Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web. We ❤️ Vue.
-
-### Online Documentation
-Don’t worry, we will explain all things you should know to successfully start your VueFileManager instance.
-
-### Night Mode
-We add native support for dark mode. Now, it’s easy for your eyes to work with your files at night.
-
-### User Login & Registration
-Let user create their own account with own storage. All these accounts is protected by user login.
-
-### Integrated Trash
-Did you delete something by accident or do you want your deleted files back? Restore your files from trash.
-
-### Navigation Sidebar
-Navigate through your files easily. Add you favourites folder or look on your latest uploads. 
-
-### Storage Limits
-Set storage limits to your user account to sure, you never exceed your storage limits.
+To compiles for production, run this command
+```
+npm run prod
+```
+That's all, happy coding! :tada: :tada: :tada:

app/Console/Commands/Deploy.php

@@ -0,0 +1,66 @@
+<?php
+
+namespace App\Console\Commands;
+
+use Illuminate\Console\Command;
+use Illuminate\Support\Facades\Log;
+
+class Deploy extends Command
+{
+    /**
+     * The name and signature of the console command.
+     *
+     * @var string
+     */
+    protected $signature = 'deploy:production';
+
+    /**
+     * The console command description.
+     *
+     * @var string
+     */
+    protected $description = 'Automatic deployment for production';
+
+    /**
+     * Create a new command instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        parent::__construct();
+    }
+
+    /**
+     * Execute the console command.
+     *
+     * @return mixed
+     */
+    public function handle()
+    {
+        // Start deployment
+        $this->info('Running auto deployment');
+        $this->call('down');
+
+        // Exec commands
+        exec('git pull origin ' . config('app.deploy_branch'));
+        //exec('composer update --no-interaction --prefer-dist');
+        $this->migrateDatabase();
+
+        // Stop deployment
+        $this->call('up');
+        $this->info('Everything is done, congratulations! 🥳🥳🥳');
+
+        Log::info('Application was updated!');
+    }
+
+    /**
+     * Migrate database
+     */
+    public function migrateDatabase()
+    {
+        $this->call('migrate', [
+            '--force' => true,
+        ]);
+    }
+}

app/Console/Commands/SetupDevEnvironment.php

@@ -0,0 +1,124 @@
+<?php
+
+namespace App\Console\Commands;
+
+use App\User;
+use App\UserSettings;
+use Illuminate\Console\Command;
+
+class SetupDevEnvironment extends Command
+{
+    /**
+     * The name and signature of the console command.
+     *
+     * @var string
+     */
+    protected $signature = 'setup:dev';
+
+    /**
+     * The console command description.
+     *
+     * @var string
+     */
+    protected $description = 'Setting production environment';
+
+    /**
+     * Create a new command instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        parent::__construct();
+    }
+
+    /**
+     * Execute the console command.
+     *
+     * @return mixed
+     */
+    public function handle()
+    {
+        $this->info('Setting up production environment');
+
+        $this->migrateDatabase();
+        $this->generateKey();
+        $this->createPassportKeys();
+        $this->createPassportClientPassword();
+        $this->createPassportClientPersonal();
+        $this->createDefaultUser();
+
+        $this->info('Everything is done, congratulations! 🥳🥳🥳');
+
+    }
+
+    /**
+     * Migrate database
+     */
+    public function generateKey()
+    {
+        $this->call('key:generate');
+    }
+
+    /**
+     * Migrate database
+     */
+    public function migrateDatabase()
+    {
+        $this->call('migrate:fresh');
+    }
+
+    /**
+     * Create Passport Encryption keys
+     */
+    public function createPassportKeys()
+    {
+        $this->call('passport:keys', [
+            '--force' => true
+        ]);
+    }
+
+    /**
+     * Create Password grant client
+     */
+    public function createPassportClientPassword()
+    {
+        $this->call('passport:client', [
+            '--password' => true,
+            '--name'     => 'vuefilemanager',
+        ]);
+
+        $this->alert('Please copy these first password grant Client ID & Client secret above to your /.env file.');
+    }
+
+    /**
+     * Create Personal access client
+     */
+    public function createPassportClientPersonal()
+    {
+        $this->call('passport:client', [
+            '--personal' => true,
+            '--name'     => 'shared',
+        ]);
+    }
+
+    /**
+     * Create Default User
+     */
+    public function createDefaultUser()
+    {
+        $user = User::create([
+            'name'     => 'Jane Doe',
+            'email'    => 'howdy@hi5ve.digital',
+            'role'     => 'admin',
+            'password' => \Hash::make('vuefilemanager'),
+        ]);
+
+        // Create settings
+        $settings = UserSettings::create([
+            'user_id' => $user->id
+        ]);
+
+        $this->info('Test user created. Email: ' . $user->email . ' Password: vuefilemanager');
+    }
+}

app/Console/Commands/SetupProductionEnvironment.php

@@ -0,0 +1,101 @@
+<?php
+
+namespace App\Console\Commands;
+
+use Illuminate\Console\Command;
+
+class SetupProductionEnvironment extends Command
+{
+    /**
+     * The name and signature of the console command.
+     *
+     * @var string
+     */
+    protected $signature = 'setup:prod';
+
+    /**
+     * The console command description.
+     *
+     * @var string
+     */
+    protected $description = 'Setting production environment';
+
+    /**
+     * Create a new command instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        parent::__construct();
+    }
+
+    /**
+     * Execute the console command.
+     *
+     * @return mixed
+     */
+    public function handle()
+    {
+        $this->info('Setting up production environment');
+
+        $this->migrateDatabase();
+        $this->generateKey();
+        $this->createPassportKeys();
+        $this->createPassportClientPassword();
+        $this->createPassportClientPersonal();
+
+        $this->info('Everything is done, congratulations! 🥳🥳🥳');
+
+    }
+
+    /**
+     * Migrate database
+     */
+    public function generateKey()
+    {
+        $this->call('key:generate');
+    }
+
+    /**
+     * Migrate database
+     */
+    public function migrateDatabase()
+    {
+        $this->call('migrate:fresh');
+    }
+
+    /**
+     * Create Passport Encryption keys
+     */
+    public function createPassportKeys()
+    {
+        $this->call('passport:keys', [
+            '--force' => true
+        ]);
+    }
+
+    /**
+     * Create Password grant client
+     */
+    public function createPassportClientPassword()
+    {
+        $this->call('passport:client', [
+            '--password' => true,
+            '--name'     => 'vuefilemanager',
+        ]);
+
+        $this->alert('Please copy these first password grant Client ID & Client secret above to your /.env file.');
+    }
+
+    /**
+     * Create Personal access client
+     */
+    public function createPassportClientPersonal()
+    {
+        $this->call('passport:client', [
+            '--personal' => true,
+            '--name'     => 'shared',
+        ]);
+    }
+}

app/Console/Commands/UpgradeApp.php

@@ -0,0 +1,88 @@
+<?php
+
+namespace App\Console\Commands;
+
+use App\User;
+use App\UserSettings;
+use Illuminate\Console\Command;
+
+class UpgradeApp extends Command
+{
+    /**
+     * The name and signature of the console command.
+     *
+     * @var string
+     */
+    protected $signature = 'upgrade:app {version}';
+
+    /**
+     * The console command description.
+     *
+     * @var string
+     */
+    protected $description = 'Upgrade application to new version';
+
+    /**
+     * Create a new command instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        parent::__construct();
+    }
+
+    /**
+     * Execute the console command.
+     *
+     * @return mixed
+     */
+    public function handle()
+    {
+        $this->info('Upgrading your application to version ' . $this->argument('version'));
+        $this->call('down');
+
+        // Version 1.6
+        if ($this->argument('version') === 'v1.6') {
+            $this->version_1_6();
+        }
+
+        $this->call('up');
+        $this->info('Your application was upgraded! 🥳🥳🥳');
+    }
+
+    /**
+     * Upgrade script to version 1.6
+     */
+    public function version_1_6() {
+
+        // Migrate new tables and changes
+        $this->call('migrate');
+
+        // Create user settings records
+        $this->info('Updating users options...');
+
+        User::all()->each(function ($user) {
+            $this->info('Update user with id: ' . $user->id);
+            UserSettings::create(['user_id' => $user->id]);
+        });
+
+        $this->info('Updating user options is done!');
+
+        // Set up admin
+        $email = $this->ask('Which user would you like set up as admin? Please type user email');
+
+        $admin = User::where('email', $email)->first();
+
+        if (! $admin) {
+            $email = $this->ask('We can\'t find user with this email, please try it again');
+            $admin = User::where('email', $email)->first();
+        }
+
+        // Save new role for selected user
+        $admin->role = 'admin';
+        $admin->save();
+
+        $this->info('Admin was set up successfully');
+    }
+}

app/Console/Kernel.php

@@ -2,6 +2,10 @@
 
 namespace App\Console;
 
+use App\Console\Commands\Deploy;
+use App\Console\Commands\SetupDevEnvironment;
+use App\Console\Commands\SetupProductionEnvironment;
+use App\Console\Commands\UpgradeApp;
 use Illuminate\Console\Scheduling\Schedule;
 use Illuminate\Foundation\Console\Kernel as ConsoleKernel;
 
@@ -13,7 +17,10 @@ class Kernel extends ConsoleKernel
      * @var array
      */
     protected $commands = [
-        //
+        SetupProductionEnvironment::class,
+        SetupDevEnvironment::class,
+        UpgradeApp::class,
+        Deploy::class,
     ];
 
     /**

app/FileManagerFile.php

@@ -3,18 +3,61 @@
 namespace App;
 
 use ByteUnits\Metric;
-use Carbon\Carbon;
 use Illuminate\Database\Eloquent\Model;
+use Illuminate\Support\Facades\Storage;
 use Illuminate\Support\Str;
 use Laravel\Scout\Searchable;
 use TeamTNT\TNTSearch\Indexer\TNTIndexer;
 use \Illuminate\Database\Eloquent\SoftDeletes;
-use \Askedio\SoftCascade\Traits\SoftCascadeTrait;
 
+/**
+ * App\FileManagerFile
+ *
+ * @property int $id
+ * @property int|null $user_id
+ * @property int $unique_id
+ * @property int $folder_id
+ * @property string $thumbnail
+ * @property string|null $name
+ * @property string|null $basename
+ * @property string|null $mimetype
+ * @property string $filesize
+ * @property string|null $type
+ * @property string $user_scope
+ * @property string $deleted_at
+ * @property string $created_at
+ * @property \Illuminate\Support\Carbon|null $updated_at
+ * @property-read \App\FileManagerFolder|null $folder
+ * @property-read string $file_url
+ * @property-read \App\FileManagerFolder $parent
+ * @property-read \App\Share|null $shared
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile newModelQuery()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile newQuery()
+ * @method static \Illuminate\Database\Query\Builder|\App\FileManagerFile onlyTrashed()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile query()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereBasename($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereCreatedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereDeletedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereFilesize($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereFolderId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereMimetype($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereName($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereThumbnail($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereType($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereUniqueId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereUpdatedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereUserId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFile whereUserScope($value)
+ * @method static \Illuminate\Database\Query\Builder|\App\FileManagerFile withTrashed()
+ * @method static \Illuminate\Database\Query\Builder|\App\FileManagerFile withoutTrashed()
+ * @mixin \Eloquent
+ */
 class FileManagerFile extends Model
 {
-    use Searchable, SoftDeletes, SoftCascadeTrait;
+    use Searchable, SoftDeletes;
 
+    public $public_access = null;
 
     protected $guarded = [
         'id'
@@ -24,6 +67,16 @@ class FileManagerFile extends Model
         'file_url'
     ];
 
+    /**
+     * Set routes with public access
+     *
+     * @param $token
+     */
+    public function setPublicUrl($token)
+    {
+        $this->public_access = $token;
+    }
+
     /**
      * Format created at date
      *
@@ -41,15 +94,14 @@ class FileManagerFile extends Model
      */
     public function getDeletedAtAttribute()
     {
-        if (! $this->attributes['deleted_at']) return null;
+        if (!$this->attributes['deleted_at']) return null;
 
         return format_date($this->attributes['deleted_at'], __('vuefilemanager.time'));
     }
 
     /**
-     * Format filesize
+     * Format fileSize
      *
-     * @param $value
      * @return string
      */
     public function getFilesizeAttribute()
@@ -60,23 +112,64 @@ class FileManagerFile extends Model
     /**
      * Format thumbnail url
      *
-     * @param $value
      * @return string
      */
     public function getThumbnailAttribute()
     {
-        return $this->attributes['thumbnail'] ? route('thumbnail', ['name' => $this->attributes['thumbnail']]) : null;
+        // Get thumbnail from s3
+        if ($this->attributes['thumbnail'] && is_storage_driver(['s3', 'spaces'])) {
+
+            return Storage::temporaryUrl('file-manager/' . $this->attributes['thumbnail'], now()->addDay());
+        }
+
+        // Get thumbnail from local storage
+        if ($this->attributes['thumbnail'] && is_storage_driver('local')) {
+
+            // Thumbnail route
+            $route = route('thumbnail', ['name' => $this->attributes['thumbnail']]);
+
+            if ($this->public_access) {
+                return $route . '/public/' . $this->public_access;
+            }
+
+            return $route;
+        }
+
+        return null;
     }
 
     /**
      * Format file url
      *
-     * @param $value
      * @return string
      */
     public function getFileUrlAttribute()
     {
-        return route('file', ['name' => $this->attributes['basename']]);
+        // Get file from s3
+        if (is_storage_driver(['s3', 'spaces'])) {
+
+            $header = [
+                "ResponseAcceptRanges"       => "bytes",
+                "ResponseContentType"        => $this->attributes['mimetype'],
+                "ResponseContentLength"      => $this->attributes['filesize'],
+                "ResponseContentRange"       => "bytes 0-600/" . $this->attributes['filesize'],
+                'ResponseContentDisposition' => 'attachment; filename=' . $this->attributes['name'] . '.' . $this->attributes['mimetype'],
+            ];
+
+            return Storage::temporaryUrl('file-manager/' . $this->attributes['basename'], now()->addDay(), $header);
+        }
+
+        // Get thumbnail from local storage
+        if (is_storage_driver('local')) {
+
+            $route = route('file', ['name' => $this->attributes['basename']]);
+
+            if ($this->public_access) {
+                return $route . '/public/' . $this->public_access;
+            }
+
+            return $route;
+        }
     }
 
     /**
@@ -115,4 +208,14 @@ class FileManagerFile extends Model
     {
         return $this->hasOne('App\FileManagerFolder', 'unique_id', 'folder_id');
     }
+
+    /**
+     * Get sharing attributes
+     *
+     * @return \Illuminate\Database\Eloquent\Relations\HasOne
+     */
+    public function shared()
+    {
+        return $this->hasOne('App\Share', 'item_id', 'unique_id');
+    }
 }

app/FileManagerFolder.php

@@ -11,20 +11,62 @@ use RecursiveArrayIterator;
 use RecursiveIteratorIterator;
 use TeamTNT\TNTSearch\Indexer\TNTIndexer;
 use \Illuminate\Database\Eloquent\SoftDeletes;
-use \Askedio\SoftCascade\Traits\SoftCascadeTrait;
 
+/**
+ * App\FileManagerFolder
+ *
+ * @property int $id
+ * @property int|null $user_id
+ * @property int $unique_id
+ * @property int $parent_id
+ * @property string|null $name
+ * @property string|null $type
+ * @property string $user_scope
+ * @property string $deleted_at
+ * @property string $created_at
+ * @property \Illuminate\Support\Carbon|null $updated_at
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFolder[] $children
+ * @property-read int|null $children_count
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFile[] $files
+ * @property-read int|null $files_count
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFolder[] $folders
+ * @property-read int|null $folders_count
+ * @property-read int $items
+ * @property-read int $trashed_items
+ * @property-read \App\FileManagerFolder $parent
+ * @property-read \App\Share|null $shared
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFolder[] $trashed_children
+ * @property-read int|null $trashed_children_count
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFile[] $trashed_files
+ * @property-read int|null $trashed_files_count
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFolder[] $trashed_folders
+ * @property-read int|null $trashed_folders_count
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder newModelQuery()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder newQuery()
+ * @method static \Illuminate\Database\Query\Builder|\App\FileManagerFolder onlyTrashed()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder query()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereCreatedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereDeletedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereName($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereParentId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereType($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereUniqueId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereUpdatedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereUserId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\FileManagerFolder whereUserScope($value)
+ * @method static \Illuminate\Database\Query\Builder|\App\FileManagerFolder withTrashed()
+ * @method static \Illuminate\Database\Query\Builder|\App\FileManagerFolder withoutTrashed()
+ * @mixin \Eloquent
+ */
 class FileManagerFolder extends Model
 {
-    use Searchable, SoftDeletes, SoftCascadeTrait;
+    use Searchable, SoftDeletes;
 
     protected $guarded = [
         'id'
     ];
 
-    protected $softCascade = [
-        'children', 'files'
-    ];
-
     protected $appends = [
         'items', 'trashed_items'
     ];
@@ -116,7 +158,6 @@ class FileManagerFolder extends Model
      */
     public function files()
     {
-
         return $this->hasMany('App\FileManagerFile', 'folder_id', 'unique_id');
     }
 
@@ -171,6 +212,16 @@ class FileManagerFolder extends Model
         return $this->hasMany('App\FileManagerFolder', 'parent_id', 'unique_id')->withTrashed();
     }
 
+    /**
+     * Get sharing attributes
+     *
+     * @return \Illuminate\Database\Eloquent\Relations\HasOne
+     */
+    public function shared()
+    {
+        return $this->hasOne('App\Share', 'item_id', 'unique_id');
+    }
+
     // Delete all folder childrens
     public static function boot()
     {
@@ -178,9 +229,22 @@ class FileManagerFolder extends Model
 
         static::deleting(function ($item) {
 
-            $item->children()->each(function($folder) {
-                $folder->delete();
-            });
+            if ( $item->isForceDeleting() ) {
+
+                $item->trashed_children()->each(function($folder) {
+                    $folder->forceDelete();
+                });
+
+            } else {
+
+                $item->children()->each(function($folder) {
+                    $folder->delete();
+                });
+
+                $item->files()->each(function($file) {
+                    $file->delete();
+                });
+            }
         });
 
         static::restoring(function ($item) {
@@ -196,4 +260,4 @@ class FileManagerFolder extends Model
             });
         });
     }
-}
+}

app/Http/Controllers/Admin/UserController.php

@@ -0,0 +1,222 @@
+<?php
+
+namespace App\Http\Controllers\Admin;
+
+use App\FileManagerFile;
+use App\FileManagerFolder;
+use App\Http\Controllers\Controller;
+use App\Http\Requests\Admin\ChangeRoleRequest;
+use App\Http\Requests\Admin\ChangeStorageCapacityRequest;
+use App\Http\Requests\Admin\CreateUserByAdmin;
+use App\Http\Requests\Admin\DeleteUserRequest;
+use App\Http\Resources\UsersCollection;
+use App\Http\Resources\UserResource;
+use App\Http\Resources\UserStorageResource;
+use App\Http\Tools\Demo;
+use App\Share;
+use App\User;
+use App\UserSettings;
+use Illuminate\Contracts\Routing\ResponseFactory;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Facades\Gate;
+use Illuminate\Support\Facades\Hash;
+use Illuminate\Support\Facades\Password;
+use Illuminate\Support\Str;
+use Storage;
+
+class UserController extends Controller
+{
+    /**
+     * Get user details
+     *
+     * @param $id
+     * @return UserResource
+     */
+    public function details($id)
+    {
+        return new UserResource(User::findOrFail($id));
+    }
+
+    /**
+     * Get user storage details
+     *
+     * @param $id
+     * @return UserStorageResource
+     */
+    public function storage($id)
+    {
+        return new UserStorageResource(User::findOrFail($id));
+    }
+
+    /**
+     * Get all users
+     *
+     * @return UsersCollection
+     */
+    public function users()
+    {
+        return new UsersCollection(User::all());
+    }
+
+    /**
+     * Change user role
+     *
+     * @param ChangeRoleRequest $request
+     * @param $id
+     * @return UserResource
+     */
+    public function change_role(ChangeRoleRequest $request, $id)
+    {
+        $user = User::findOrFail($id);
+
+        // Demo preview
+        if (env('APP_DEMO') && $id == 1) {
+            return new UserResource($user);
+        }
+
+        $user->update($request->input('attributes'));
+
+        return new UserResource($user);
+    }
+
+    /**
+     * Change user storage capacity
+     *
+     * @param ChangeStorageCapacityRequest $request
+     * @param $id
+     * @return UserStorageResource
+     */
+    public function change_storage_capacity(ChangeStorageCapacityRequest $request, $id)
+    {
+        $user = User::findOrFail($id);
+
+        $user->settings()->update($request->input('attributes'));
+
+        return new UserStorageResource($user);
+    }
+
+    /**
+     * Send user password reset link
+     *
+     * @param $id
+     * @return ResponseFactory|\Illuminate\Http\Response
+     */
+    public function send_password_reset_email($id)
+    {
+        $user = User::findOrFail($id);
+
+        // Demo preview
+        if (env('APP_DEMO')) {
+            return response('Done!', 204);
+        }
+
+        // Get password token
+        $token = Password::getRepository()->create($user);
+
+        // Send user email
+        $user->sendPasswordResetNotification($token);
+
+        return response('Done!', 204);
+    }
+
+    /**
+     * Create new user by admin
+     *
+     * @param CreateUserByAdmin $request
+     * @return UserResource
+     */
+    public function create_user(CreateUserByAdmin $request)
+    {
+        // Store avatar
+        if ($request->hasFile('avatar')) {
+
+            // Update avatar
+            $avatar = store_avatar($request->file('avatar'), 'avatars');
+        }
+
+        // Create user
+        $user = User::create([
+            'avatar'   => $request->hasFile('avatar') ? $avatar : null,
+            'name'     => $request->name,
+            'role'     => $request->role,
+            'email'    => $request->email,
+            'password' => Hash::make($request->password),
+        ]);
+
+        // Create settings
+        $settings = UserSettings::create([
+            'user_id'          => $user->id,
+            'storage_capacity' => $request->storage_capacity,
+        ]);
+
+        return new UserResource($user);
+    }
+
+    /**
+     * Delete user with all user data
+     *
+     * @param DeleteUserRequest $request
+     * @param $id
+     * @return ResponseFactory|\Illuminate\Http\Response
+     * @throws \Exception
+     */
+    public function delete_user(DeleteUserRequest $request, $id)
+    {
+        $user = User::findOrFail($id);
+
+        // Demo preview
+        if (env('APP_DEMO')) {
+            return response('Done!', 204);
+        }
+
+        // Check for self deleted account
+        if ($user->id === Auth::id()) {
+            abort(406, 'You can\'t delete your account');
+        }
+
+        // Validate user name
+        if ($user->name !== $request->name) abort(403);
+
+        $shares = Share::where('user_id', $user->id)->get();
+        $files = FileManagerFile::withTrashed()
+            ->where('user_id', $user->id)
+            ->get();
+        $folders = FileManagerFolder::withTrashed()
+            ->where('user_id', $user->id)
+            ->get();
+
+        // Remove all files and thumbnails
+        $files->each(function ($file) {
+
+            // Delete file
+            Storage::delete('/file-manager/' . $file->basename);
+
+            // Delete thumbnail if exist
+            if (!is_null($file->thumbnail)) {
+                Storage::delete('/file-manager/' . $file->getOriginal('thumbnail'));
+            }
+
+            // Delete file permanently
+            $file->forceDelete();
+        });
+
+        // Remove avatar
+        if ($user->avatar) {
+            Storage::delete('/avatars/' . $user->avatar);
+        }
+
+        // Remove folders & shares
+        $folders->each->forceDelete();
+        $shares->each->forceDelete();
+
+        // Remove favourites
+        $user->settings->delete();
+        $user->favourites()->sync([]);
+
+        // Delete user
+        $user->delete();
+
+        return response('Done!', 204);
+    }
+}

app/Http/Controllers/AppFunctionsController.php

@@ -2,8 +2,9 @@
 
 namespace App\Http\Controllers;
 
-use Illuminate\Http\Request;
 use Illuminate\Support\Facades\File;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Http\Request;
 use Response;
 
 class AppFunctionsController extends Controller
@@ -17,28 +18,4 @@ class AppFunctionsController extends Controller
     {
         return view("index");
     }
-
-    /**
-     * Get file
-     *
-     * @param $filename
-     * @return mixed
-     */
-    public function get_avatar($basename)
-    {
-        // Get file path
-        $path = storage_path() . '/app/avatars/' . $basename;
-
-        // Check if file exist
-        if (!File::exists($path)) abort(404);
-
-        $file = File::get($path);
-        $type = File::mimeType($path);
-
-        // Create response
-        $response = Response::make($file, 200);
-        $response->header("Content-Type", $type);
-
-        return $response;
-    }
 }

app/Http/Controllers/Auth/AuthController.php

@@ -2,20 +2,14 @@
 
 namespace App\Http\Controllers\Auth;
 
-use App\ClientProfile;
-use App\Models\User\UserAttribute;
-use App\Models\User\UserNotificationSetting;
-use App\ProviderProfile;
+use App\Http\Requests\Auth\CheckAccountRequest;
 use App\User;
-use GuzzleHttp\Client;
+use App\UserSettings;
 use Illuminate\Http\Request;
 use App\Http\Controllers\Controller;
-use Illuminate\Http\Response;
 use Illuminate\Support\Facades\Auth;
-use Illuminate\Support\Facades\Cookie;
 use Illuminate\Support\Facades\Hash;
 use Illuminate\Support\Facades\Route;
-use Illuminate\Support\Facades\Validator;
 
 class AuthController extends Controller
 {
@@ -26,12 +20,7 @@ class AuthController extends Controller
      * @param Request $request
      * @return mixed
      */
-    public function check_account(Request $request) {
-
-        // Validate request
-        $request->validate([
-            'email'    => ['required', 'string', 'email'],
-        ]);
+    public function check_account(CheckAccountRequest $request) {
 
         // Get User
         $user = User::where('email', $request->input('email'))->select(['name', 'avatar'])->first();
@@ -59,7 +48,7 @@ class AuthController extends Controller
 
             $data = json_decode($response->content(), true);
 
-            return response('Login Successfull!', 200)->cookie('token', $data['access_token'], 43200);
+            return response('Login Successfull!', 200)->cookie('access_token', $data['access_token'], 43200);
         } else {
 
             return $response;
@@ -85,19 +74,24 @@ class AuthController extends Controller
         ]);
 
         // Create user
-        User::create([
+        $user = User::create([
             'name'     => $request->name,
             'email'    => $request->email,
             'password' => Hash::make($request->password),
         ]);
 
+        // Create settings
+        $settings = UserSettings::create([
+            'user_id' => $user->id
+        ]);
+
         $response = Route::dispatch(self::make_request($request));
 
         if ($response->isSuccessful()) {
 
             $data = json_decode($response->content(), true);
 
-            return response('Register Successfull!', 200)->cookie('token', $data['access_token'], 43200);
+            return response('Register Successfull!', 200)->cookie('access_token', $data['access_token'], 43200);
         } else {
 
             return $response;
@@ -111,6 +105,12 @@ class AuthController extends Controller
      */
     public function logout()
     {
+        // Demo preview
+        if (is_demo( Auth::id())) {
+            return response('Logout successfull', 204)
+                ->cookie('access_token', '', -1);
+        }
+
         // Get user tokens and remove it
         auth()->user()->tokens()->each(function ($token) {
 
@@ -118,7 +118,8 @@ class AuthController extends Controller
             $token->delete();
         });
 
-        return response('Logout successfull', 200)->cookie('token', '', -1);
+        return response('Logout successfull', 204)
+            ->cookie('access_token', '', -1);
     }
 
     /**
@@ -128,7 +129,7 @@ class AuthController extends Controller
      * @param string $provider
      * @return Request
      */
-    private static function make_request(Request $request)
+    private static function make_request($request)
     {
         $request->request->add([
             'grant_type'    => 'password',
@@ -136,7 +137,7 @@ class AuthController extends Controller
             'client_secret' => config('services.passport.client_secret'),
             'username'      => $request->email,
             'password'      => $request->password,
-            'scope'         => '',
+            'scope'         => 'master',
         ]);
 
         return Request::create(url('/oauth/token'), 'POST', $request->all());

app/Http/Controllers/DeployController.php

@@ -0,0 +1,44 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use Artisan;
+use Illuminate\Support\Facades\Log;
+use Illuminate\Validation\UnauthorizedException;
+use Symfony\Component\HttpKernel\Exception\BadRequestHttpException;
+
+class DeployController extends Controller
+{
+    /**
+     * Get web hook payload and verify request
+     *
+     * @param Request $request
+     * @return \Illuminate\Contracts\Routing\ResponseFactory|\Illuminate\Http\Response
+     */
+    public function github(Request $request)   {
+
+        if (($signature = $request->headers->get('X-Hub-Signature')) == null) {
+            throw new BadRequestHttpException('Header not set');
+        }
+
+        $signature_parts = explode('=', $signature);
+
+        if (count($signature_parts) != 2) {
+            throw new BadRequestHttpException('signature has invalid format');
+        }
+
+        $known_signature = hash_hmac('sha1', $request->getContent(), config('app.deploy_secret'));
+
+        if (! hash_equals($known_signature, $signature_parts[1])) {
+            throw new UnauthorizedException('Could not verify request signature ' . $signature_parts[1]);
+        }
+
+        // Run deploying
+        Artisan::call('deploy:production');
+
+        Log::info('The GitHub webhook was accepted');
+
+        return response('The GitHub webhook was accepted', 202);
+    }
+}

app/Http/Controllers/FileAccessController.php

@@ -0,0 +1,217 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\FileManagerFolder;
+use App\Http\Tools\Guardian;
+use App\Share;
+use Illuminate\Support\Arr;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Facades\DB;
+use Illuminate\Support\Facades\File;
+use Illuminate\Http\Request;
+use App\FileManagerFile;
+use Illuminate\Support\Facades\Storage;
+use Illuminate\Support\Str;
+use Response;
+
+class FileAccessController extends Controller
+{
+    /**
+     * Get avatar
+     *
+     * @param $basename
+     * @return mixed
+     * @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
+     */
+    public function get_avatar($basename)
+    {
+        // Get file path
+        $path = '/avatars/' . $basename;
+
+        // Check if file exist
+        if (!Storage::exists($path)) abort(404);
+
+        // Return avatar
+        return Storage::download($path, $basename);
+    }
+
+    /**
+     * Get file
+     *
+     * @param Request $request
+     * @param $filename
+     * @return mixed
+     * @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
+     */
+    public function get_file(Request $request, $filename)
+    {
+        // Get user id
+        $user_id = Auth::id();
+
+        // Get file record
+        $file = FileManagerFile::withTrashed()
+            ->where('user_id', $user_id)
+            ->where('basename', $filename)
+            ->firstOrFail();
+
+        // Check user permission
+        if (!$request->user()->tokenCan('master')) {
+
+            // Get shared token
+            $shared = get_shared($request->cookie('shared_token'));
+
+            // Check access to file
+            $this->check_file_access($shared, $file);
+        }
+
+        return $this->download_file($file);
+    }
+
+    /**
+     * Get file public
+     *
+     * @param $filename
+     * @param $token
+     * @return mixed
+     * @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
+     */
+    public function get_file_public($filename, $token)
+    {
+        // Get sharing record
+        $shared = get_shared($token);
+
+        // Abort if shared is protected
+        if ($shared->protected) {
+            abort(403, "Sorry, you don't have permission");
+        }
+
+        // Get file record
+        $file = FileManagerFile::where('user_id', $shared->user_id)
+            ->where('basename', $filename)
+            ->firstOrFail();
+
+        // Check file access
+        $this->check_file_access($shared, $file);
+
+        return $this->download_file($file);
+    }
+
+    /**
+     * Get image thumbnail
+     *
+     * @param Request $request
+     * @param $filename
+     * @return mixed
+     * @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
+     */
+    public function get_thumbnail(Request $request, $filename)
+    {
+        // Get file record
+        $file = FileManagerFile::withTrashed()
+            ->where('user_id', $request->user()->id)
+            ->where('thumbnail', $filename)
+            ->firstOrFail();
+
+        // Check user permission
+        if (!$request->user()->tokenCan('master')) {
+            $this->check_file_access($request, $file);
+        }
+
+        return $this->thumbnail_file($file);
+    }
+
+    /**
+     * Get public image thumbnail
+     *
+     * @param $filename
+     * @param $token
+     * @return mixed
+     * @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
+     */
+    public function get_thumbnail_public($filename, $token)
+    {
+        // Get sharing record
+        $shared = get_shared($token);
+
+        // Abort if thumbnail is protected
+        if ($shared->protected) {
+            abort(403, "Sorry, you don't have permission");
+        }
+
+        // Get file record
+        $file = FileManagerFile::where('user_id', $shared->user_id)
+            ->where('thumbnail', $filename)
+            ->firstOrFail();
+
+        // Check file access
+        $this->check_file_access($shared, $file);
+
+        return $this->thumbnail_file($file);
+    }
+
+    /**
+     * Check user file access
+     *
+     * @param $shared
+     * @param $file
+     */
+    protected function check_file_access($shared, $file): void
+    {
+        // Check by parent folder permission
+        if ($shared->type === 'folder') {
+            Guardian::check_item_access($file->folder_id, $shared);
+        }
+
+        // Check by single file permission
+        if ($shared->type === 'file') {
+            if ($shared->item_id !== $file->unique_id) abort(403);
+        }
+    }
+
+    /**
+     * Call and download file
+     *
+     * @param $file
+     * @return mixed
+     * @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
+     */
+    private function download_file($file)
+    {
+        // Format pretty filename
+        $file_pretty_name = $file->name . '.' . $file->mimetype;
+
+        // Get file path
+        $path = '/file-manager/' . $file->basename;
+
+        // Check if file exist
+        if (!Storage::exists($path)) abort(404);
+
+        $header = [
+            "Content-Type"   => Storage::mimeType($path),
+            "Content-Length" => Storage::size($path),
+            "Accept-Ranges"  => "bytes",
+            "Content-Range"  => "bytes 0-600/" . Storage::size($path),
+        ];
+
+        // Get file
+        return Storage::download($path, $file_pretty_name, $header);
+    }
+
+    /**
+     * @param $file
+     * @return mixed
+     * @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
+     */
+    private function thumbnail_file($file)
+    {
+        // Get file path
+        $path = '/file-manager/' . $file->getOriginal('thumbnail');
+
+        // Check if file exist
+        if (!Storage::exists($path)) abort(404);
+
+        // Return image thumbnail
+        return Storage::download($path, $file->getOriginal('thumbnail'));
+    }
+}

app/Http/Controllers/FileBrowser/BrowseController.php

@@ -0,0 +1,224 @@
+<?php
+
+namespace App\Http\Controllers\FileBrowser;
+
+use App\Http\Requests\FileBrowser\SearchRequest;
+use App\User;
+use Illuminate\Support\Facades\Validator;
+use Illuminate\Support\Facades\Auth;
+use App\Http\Controllers\Controller;
+use Illuminate\Support\Collection;
+use Illuminate\Http\Request;
+use App\FileManagerFolder;
+use App\FileManagerFile;
+use App\Share;
+
+class BrowseController extends Controller
+{
+
+    /**
+     * Get trashed files
+     *
+     * @return Collection
+     */
+    public function trash()
+    {
+        // Get user id
+        $user_id = Auth::id();
+
+        // Get folders and files
+        $folders_trashed = FileManagerFolder::onlyTrashed()
+            ->with(['trashed_folders', 'parent'])
+            ->where('user_id', $user_id)
+            ->get(['parent_id', 'unique_id', 'name']);
+
+        $folders = FileManagerFolder::onlyTrashed()
+            ->with(['parent'])
+            ->where('user_id', $user_id)
+            ->whereIn('unique_id', filter_folders_ids($folders_trashed))
+            ->get();
+
+        // Get files trashed
+        $files_trashed = FileManagerFile::onlyTrashed()
+            ->with(['parent'])
+            ->where('user_id', $user_id)
+            ->whereNotIn('folder_id', array_values(array_unique(recursiveFind($folders_trashed->toArray(), 'unique_id'))))
+            ->get();
+
+        // Collect folders and files to single array
+        return collect([$folders, $files_trashed])->collapse();
+    }
+
+    /**
+     * Get user shared items
+     *
+     * @return Collection
+     */
+    public function shared()
+    {
+        // Get user
+        $user_id = Auth::id();
+
+        // Get shared folders and files
+        $folder_ids = Share::where('user_id', $user_id)
+            ->where('type', 'folder')
+            ->pluck('item_id');
+
+        $file_ids = Share::where('user_id', $user_id)
+            ->where('type', '!=', 'folder')
+            ->pluck('item_id');
+
+        // Get folders and files
+        $folders = FileManagerFolder::with(['parent', 'shared:token,id,item_id,permission,protected'])
+            ->where('user_id', $user_id)
+            ->whereIn('unique_id', $folder_ids)
+            ->get();
+
+        $files = FileManagerFile::with(['parent', 'shared:token,id,item_id,permission,protected'])
+            ->where('user_id', $user_id)
+            ->whereIn('unique_id', $file_ids)
+            ->get();
+
+        // Collect folders and files to single array
+        return collect([$folders, $files])->collapse();
+    }
+
+    /**
+     * Get latest user uploads
+     *
+     * @return mixed
+     */
+    public function latest() {
+
+        // Get User
+        $user = User::with(['latest_uploads'])
+            ->where('id', Auth::id())
+            ->first();
+
+        return $user->latest_uploads->makeHidden(['user_id', 'basename']);
+    }
+
+    /**
+     * Get participant uploads
+     *
+     * @return mixed
+     */
+    public function participant_uploads() {
+
+        // Get User
+        $uploads = FileManagerFile::with(['parent'])->where('user_id', Auth::id())
+            ->whereUserScope('editor')->orderBy('created_at', 'DESC')->get();
+
+        return $uploads;
+    }
+
+    /**
+     * Get directory with files
+     *
+     * @param Request $request
+     * @param $unique_id
+     * @return Collection
+     */
+    public function folder(Request $request, $unique_id)
+    {
+        // Get user
+        $user_id = Auth::id();
+
+        // Get folder trash items
+        if ($request->query('trash')) {
+
+            // Get folders and files
+            $folders = FileManagerFolder::onlyTrashed()
+                ->with('parent')
+                ->where('user_id', $user_id)
+                ->where('parent_id', $unique_id)
+                ->get();
+
+            $files = FileManagerFile::onlyTrashed()
+                ->with('parent')
+                ->where('user_id', $user_id)
+                ->where('folder_id', $unique_id)
+                ->get();
+
+            // Collect folders and files to single array
+            return collect([$folders, $files])->collapse();
+        }
+
+        // Get folders and files
+        $folders = FileManagerFolder::with(['parent', 'shared:token,id,item_id,permission,protected'])
+            ->where('user_id', $user_id)
+            ->where('parent_id', $unique_id)
+            ->get();
+
+        $files = FileManagerFile::with(['parent', 'shared:token,id,item_id,permission,protected'])
+            ->where('user_id', $user_id)
+            ->where('folder_id', $unique_id)
+            ->orderBy('created_at', 'DESC')
+            ->get();
+
+        // Collect folders and files to single array
+        return collect([$folders, $files])->collapse();
+    }
+
+    /**
+     * Get user folder tree
+     *
+     * @return array
+     */
+    public function navigation_tree() {
+
+        $folders = FileManagerFolder::with('folders:id,parent_id,unique_id,name')
+            ->where('parent_id', 0)
+            ->where('user_id', Auth::id())
+            ->get(['id', 'parent_id', 'unique_id', 'name']);
+
+        return [
+            [
+                'unique_id' => 0,
+                'name'      => __('vuefilemanager.home'),
+                'location'  => 'base',
+                'folders'  => $folders,
+            ]
+        ];
+    }
+
+    /**
+     * Search files
+     *
+     * @param Request $request
+     * @return \Illuminate\Database\Eloquent\Collection
+     */
+    public function search(SearchRequest $request)
+    {
+        // Get user
+        $user_id = Auth::id();
+
+        // Search files id db
+        $searched_files = FileManagerFile::search($request->input('query'))
+            ->where('user_id', $user_id)
+            ->get();
+        $searched_folders = FileManagerFolder::search($request->input('query'))
+            ->where('user_id', $user_id)
+            ->get();
+
+        // Collect folders and files to single array
+        return collect([$searched_folders, $searched_files])->collapse();
+    }
+
+    /**
+     * Get file record
+     *
+     * @param $unique_id
+     * @return mixed
+     */
+    public function file_detail($unique_id)
+    {
+        // Get user id
+        $user_id = Auth::id();
+
+        return FileManagerFile::with(['shared:token,id,item_id,permission,protected'])
+            ->where('user_id', $user_id)
+            ->where('unique_id', $unique_id)
+            ->firstOrFail();
+    }
+}

app/Http/Controllers/FileFunctions/EditItemsController.php

@@ -0,0 +1,390 @@
+<?php
+
+namespace App\Http\Controllers\FileFunctions;
+
+use App\Http\Requests\FileFunctions\CreateFolderRequest;
+use App\Http\Requests\FileFunctions\DeleteItemRequest;
+use App\Http\Requests\FileFunctions\RenameItemRequest;
+use App\Http\Requests\FileFunctions\MoveItemRequest;
+use App\Http\Requests\FileFunctions\UploadRequest;
+use App\Http\Tools\Demo;
+use Illuminate\Contracts\Routing\ResponseFactory;
+use Illuminate\Database\Eloquent\Model;
+use Illuminate\Support\Facades\Auth;
+use App\Http\Controllers\Controller;
+use App\Http\Tools\Guardian;
+use App\Http\Tools\Editor;
+use App\FileManagerFile;
+use Exception;
+
+
+class EditItemsController extends Controller
+{
+    /**
+     * Create new folder for authenticated master|editor user
+     *
+     * @param CreateFolderRequest $request
+     * @return array
+     * @throws Exception
+     */
+    public function user_create_folder(CreateFolderRequest $request)
+    {
+        // Demo preview
+        if (is_demo(Auth::id())) {
+            return Demo::create_folder($request);
+        }
+
+        // Check permission to create folder for authenticated editor
+        if ($request->user()->tokenCan('editor')) {
+
+            // check if shared_token cookie exist
+            if (!$request->hasCookie('shared_token')) abort('401');
+
+            // Get shared token
+            $shared = get_shared($request->cookie('shared_token'));
+
+            // Check access to requested directory
+            Guardian::check_item_access($request->parent_id, $shared);
+        }
+
+        // Create new folder
+        return Editor::create_folder($request);
+    }
+
+    /**
+     * Create new folder for guest user with edit permission
+     *
+     * @param CreateFolderRequest $request
+     * @param $token
+     * @return array
+     * @throws Exception
+     */
+    public function guest_create_folder(CreateFolderRequest $request, $token)
+    {
+        // Get shared record
+        $shared = get_shared($token);
+
+        if (is_demo($shared->user_id)) {
+            return Demo::create_folder($request);
+        }
+
+        // Check shared permission
+        if (!is_editor($shared)) abort(403);
+
+        // Check access to requested directory
+        Guardian::check_item_access($request->parent_id, $shared);
+
+        // Create folder
+        return Editor::create_folder($request, $shared);
+    }
+
+    /**
+     * Rename item for authenticated master|editor user
+     *
+     * @param RenameItemRequest $request
+     * @param $unique_id
+     * @return mixed
+     * @throws Exception
+     */
+    public function user_rename_item(RenameItemRequest $request, $unique_id)
+    {
+        // Demo preview
+        if (is_demo(Auth::id())) {
+            return Demo::rename_item($request, $unique_id);
+        }
+
+        // Check permission to rename item for authenticated editor
+        if ($request->user()->tokenCan('editor')) {
+
+            // check if shared_token cookie exist
+            if (!$request->hasCookie('shared_token')) abort('401');
+
+            // Get shared token
+            $shared = get_shared($request->cookie('shared_token'));
+
+            // Get file|folder item
+            $item = get_item($request->type, $unique_id, Auth::id());
+
+            // Check access to requested directory
+            if ($request->type === 'folder') {
+                Guardian::check_item_access($item->unique_id, $shared);
+            } else {
+                Guardian::check_item_access($item->folder_id, $shared);
+            }
+        }
+
+        // Rename Item
+        return Editor::rename_item($request, $unique_id);
+    }
+
+    /**
+     * Rename item for guest user with edit permission
+     *
+     * @param RenameItemRequest $request
+     * @param $unique_id
+     * @param $token
+     * @return mixed
+     * @throws Exception
+     */
+    public function guest_rename_item(RenameItemRequest $request, $unique_id, $token)
+    {
+        // Get shared record
+        $shared = get_shared($token);
+
+        // Demo preview
+        if (is_demo($shared->user_id)) {
+            return Demo::rename_item($request, $unique_id);
+        }
+
+        // Check shared permission
+        if (!is_editor($shared)) abort(403);
+
+        // Get file|folder item
+        $item = get_item($request->type, $unique_id, $shared->user_id);
+
+        // Check access to requested item
+        if ($request->type === 'folder') {
+            Guardian::check_item_access($item->unique_id, $shared);
+        } else {
+            Guardian::check_item_access($item->folder_id, $shared);
+        }
+
+        // Rename item
+        $item = Editor::rename_item($request, $unique_id, $shared);
+
+        // Set public url
+        if ($item->type !== 'folder') {
+            $item->setPublicUrl($token);
+        }
+
+        return $item;
+    }
+
+    /**
+     * Delete item for authenticated master|editor user
+     *
+     * @param DeleteItemRequest $request
+     * @param $unique_id
+     * @return ResponseFactory|\Illuminate\Http\Response
+     * @throws Exception
+     */
+    public function user_delete_item(DeleteItemRequest $request, $unique_id)
+    {
+        // Demo preview
+        if (is_demo(Auth::id())) {
+            return Demo::response_204();
+        }
+
+        // Check permission to delete item for authenticated editor
+        if ($request->user()->tokenCan('editor')) {
+
+            // Prevent force delete for non-master users
+            if ($request->force_delete) abort('401');
+
+            // check if shared_token cookie exist
+            if (!$request->hasCookie('shared_token')) abort('401');
+
+            // Get shared token
+            $shared = get_shared($request->cookie('shared_token'));
+
+            // Get file|folder item
+            $item = get_item($request->type, $unique_id, Auth::id());
+
+            // Check access to requested directory
+            if ($request->type === 'folder') {
+                Guardian::check_item_access($item->unique_id, $shared);
+            } else {
+                Guardian::check_item_access($item->folder_id, $shared);
+            }
+        }
+
+        // Delete item
+        Editor::delete_item($request, $unique_id);
+
+        // Return response
+        return response(null, 204);
+    }
+
+    /**
+     * Delete item for guest user with edit permission
+     *
+     * @param DeleteItemRequest $request
+     * @param $unique_id
+     * @param $token
+     * @return ResponseFactory|\Illuminate\Http\Response
+     * @throws Exception
+     */
+    public function guest_delete_item(DeleteItemRequest $request, $unique_id, $token)
+    {
+        // Get shared record
+        $shared = get_shared($token);
+
+        // Demo preview
+        if (is_demo($shared->user_id)) {
+            return Demo::response_204();
+        }
+
+        // Check shared permission
+        if (!is_editor($shared)) abort(403);
+
+        // Get file|folder item
+        $item = get_item($request->type, $unique_id, $shared->user_id);
+
+        // Check access to requested item
+        if ($request->type === 'folder') {
+            Guardian::check_item_access($item->unique_id, $shared);
+        } else {
+            Guardian::check_item_access($item->folder_id, $shared);
+        }
+
+        // Delete item
+        Editor::delete_item($request, $unique_id, $shared);
+
+        // Return response
+        return response(null, 204);
+    }
+
+    /**
+     * Delete file for authenticated master|editor user
+     *
+     * @param UploadRequest $request
+     * @return FileManagerFile|Model
+     * @throws Exception
+     */
+    public function user_upload(UploadRequest $request)
+    {
+        // Demo preview
+        if (is_demo(Auth::id())) {
+            return Demo::upload($request);
+        }
+
+        // Check if user can upload
+        if (config('vuefilemanager.limit_storage_by_capacity') && user_storage_percentage() >= 100) {
+            abort(423, 'You exceed your storage limit!');
+        }
+
+        // Check permission to upload for authenticated editor
+        if ($request->user()->tokenCan('editor')) {
+
+            // check if shared_token cookie exist
+            if (!$request->hasCookie('shared_token')) abort('401');
+
+            // Get shared token
+            $shared = get_shared($request->cookie('shared_token'));
+
+            // Check access to requested directory
+            Guardian::check_item_access($request->parent_id, $shared);
+        }
+
+        // Return new uploaded file
+        return Editor::upload($request);
+    }
+
+    /**
+     * Delete file for guest user with edit permission
+     *
+     * @param UploadRequest $request
+     * @param $token
+     * @return FileManagerFile|Model
+     * @throws Exception
+     */
+    public function guest_upload(UploadRequest $request, $token)
+    {
+        // Get shared record
+        $shared = get_shared($token);
+
+        // Demo preview
+        if (is_demo($shared->user_id)) {
+            return Demo::upload($request);
+        }
+
+        // Check shared permission
+        if (!is_editor($shared)) abort(403);
+
+        // Check access to requested directory
+        Guardian::check_item_access($request->parent_id, $shared);
+
+        // Return new uploaded file
+        $new_file = Editor::upload($request, $shared);
+
+        // Set public access url
+        $new_file->setPublicUrl($token);
+
+        return $new_file;
+    }
+
+    /**
+     * Move item for authenticated master|editor user
+     *
+     * @param MoveItemRequest $request
+     * @param $unique_id
+     * @return ResponseFactory|\Illuminate\Http\Response
+     */
+    public function user_move(MoveItemRequest $request, $unique_id)
+    {
+        // Demo preview
+        if (is_demo(Auth::id())) {
+            return Demo::response_204();
+        }
+
+        // Check permission to upload for authenticated editor
+        if ($request->user()->tokenCan('editor')) {
+
+            // check if shared_token cookie exist
+            if (!$request->hasCookie('shared_token')) abort('401');
+
+            // Get shared token
+            $shared = get_shared($request->cookie('shared_token'));
+
+            // Check access to requested directory
+            Guardian::check_item_access($request->to_unique_id, $shared);
+        }
+
+        // Move item
+        Editor::move($request, $unique_id);
+
+        return response('Done!', 204);
+    }
+
+    /**
+     * Move item for guest user with edit permission
+     *
+     * @param MoveItemRequest $request
+     * @param $unique_id
+     * @param $token
+     * @return ResponseFactory|\Illuminate\Http\Response
+     */
+    public function guest_move(MoveItemRequest $request, $unique_id, $token)
+    {
+        // Get shared record
+        $shared = get_shared($token);
+
+        // Demo preview
+        if (is_demo(Auth::id())) {
+            return Demo::response_204();
+        }
+
+        // Check shared permission
+        if (!is_editor($shared)) abort(403);
+
+        $moving_unique_id = $unique_id;
+
+        if ($request->from_type !== 'folder') {
+            $file = FileManagerFile::where('unique_id', $unique_id)
+                ->where('user_id', $shared->user_id)
+                ->firstOrFail();
+
+            $moving_unique_id = $file->folder_id;
+        }
+
+        // Check access to requested item
+        Guardian::check_item_access([
+            $request->to_unique_id, $moving_unique_id
+        ], $shared);
+
+        // Move item
+        Editor::move($request, $unique_id, $shared);
+
+        return response('Done!', 204);
+    }
+}

app/Http/Controllers/FileFunctions/FavouriteController.php

@@ -0,0 +1,69 @@
+<?php
+
+namespace App\Http\Controllers\FileFunctions;
+
+use App\FileManagerFolder;
+use App\Http\Tools\Demo;
+use Illuminate\Support\Facades\Validator;
+use App\Http\Controllers\Controller;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Http\Request;
+
+class FavouriteController extends Controller
+{
+    /**
+     * Add folder to user favourites
+     *
+     * @param Request $request
+     * @return \Illuminate\Contracts\Routing\ResponseFactory|\Illuminate\Http\Response
+     */
+    public function store(Request $request)
+    {
+        // Validate request
+        $validator = Validator::make($request->all(), [
+            'unique_id' => 'required|integer',
+        ]);
+
+        // Return error
+        if ($validator->fails()) abort(400, 'Bad input');
+
+        // Get user & folder
+        $user = Auth::user();
+        $folder = FileManagerFolder::where('unique_id', $request->unique_id)->first();
+
+        if (is_demo($user->id)) {
+            return Demo::favourites($user);
+        }
+
+        // Check ownership
+        if ($folder->user_id !== $user->id) abort(403);
+
+        // Add folder to user favourites
+        $user->favourites()->syncWithoutDetaching($request->unique_id);
+
+        // Return updated favourites
+        return $user->favourites->makeHidden(['pivot']);
+    }
+
+    /**
+     * Remove folder from user favourites
+     *
+     * @param $unique_id
+     * @return \Illuminate\Contracts\Routing\ResponseFactory|\Illuminate\Http\Response
+     */
+    public function destroy($unique_id)
+    {
+        // Get user
+        $user = Auth::user();
+
+        if (is_demo($user->id)) {
+            return Demo::favourites($user);
+        }
+
+        // Remove folder from user favourites
+        $user->favourites()->detach($unique_id);
+
+        // Return updated favourites
+        return $user->favourites->makeHidden(['pivot']);
+    }
+}

app/Http/Controllers/FileFunctions/ShareController.php

@@ -0,0 +1,107 @@
+<?php
+
+namespace App\Http\Controllers\FileFunctions;
+
+use App\Http\Requests\Share\CreateShareRequest;
+use App\Http\Requests\Share\UpdateShareRequest;
+use App\Http\Resources\ShareResource;
+use Illuminate\Contracts\Routing\ResponseFactory;
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Facades\DB;
+use Illuminate\Support\Facades\Hash;
+use Illuminate\Support\Str;
+use App\Share;
+
+class ShareController extends Controller
+{
+    /**
+     * Get shared record
+     *
+     * @return ShareResource
+     */
+    public function show($token)
+    {
+        // Get record
+        $shared = Share::where(DB::raw('BINARY `token`'), $token)
+            ->firstOrFail();
+
+        return new ShareResource($shared);
+    }
+
+    /**
+     * Generate file share link
+     *
+     * @param CreateShareRequest $request
+     * @return ShareResource
+     */
+    public function store(CreateShareRequest $request)
+    {
+        do {
+            // Generate unique token
+            $token = Str::random(16);
+
+        } while (Share::where(DB::raw('BINARY `token`'), $token)->exists());
+
+        // Create shared options
+        $options = [
+            'password'   => $request->has('password') ? Hash::make($request->password) : null,
+            'type'       => $request->type === 'folder' ? 'folder' : 'file',
+            'protected'  => $request->isPassword,
+            'permission' => $request->permission,
+            'item_id'    => $request->unique_id,
+            'user_id'    => Auth::id(),
+            'token'      => $token,
+        ];
+
+        // Return created shared record
+        return new ShareResource(Share::create($options));
+    }
+
+    /**
+     * Update sharing
+     *
+     * @param UpdateShareRequest $request
+     * @param $token
+     * @return ShareResource
+     */
+    public function update(UpdateShareRequest $request, $token)
+    {
+        // Get sharing record
+        $shared = Share::where('token', $token)
+            ->where('user_id', Auth::id())
+            ->firstOrFail();
+
+        // Update sharing record
+        $shared->update([
+            'permission' => $request->permission,
+            'protected'  => $request->protected,
+            'password'   => $request->password ? Hash::make($request->password) : $shared->password,
+        ]);
+
+        // Return shared record
+        return new ShareResource($shared);
+    }
+
+    /**
+     * Delete sharing item
+     *
+     * @param $token
+     * @return ResponseFactory|\Illuminate\Http\Response
+     * @throws \Exception
+     */
+    public function destroy($token)
+    {
+        // Get sharing record
+        $shared = Share::where('token', $token)
+            ->where('user_id', Auth::id())
+            ->firstOrFail();
+
+        // Delete shared record
+        $shared->delete();
+
+        // Done
+        return response('Done!', 204);
+    }
+}

app/Http/Controllers/FileFunctions/TrashController.php

@@ -0,0 +1,115 @@
+<?php
+
+namespace App\Http\Controllers\FileFunctions;
+
+use App\Http\Tools\Demo;
+use Illuminate\Contracts\Routing\ResponseFactory;
+use Illuminate\Support\Facades\Validator;
+use Illuminate\Support\Facades\Storage;
+use App\Http\Controllers\Controller;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Http\Request;
+use App\FileManagerFolder;
+use App\FileManagerFile;
+
+class TrashController extends Controller
+{
+    /**
+     * Empty user trash
+     *
+     * @return ResponseFactory|\Illuminate\Http\Response
+     */
+    public function clear()
+    {
+        // Get user id
+        $user_id = Auth::id();
+
+        if (is_demo($user_id)) {
+            return Demo::response_204();
+        }
+
+        // Get files and folders
+        $folders = FileManagerFolder::onlyTrashed()->where('user_id', $user_id)->get();
+        $files = FileManagerFile::onlyTrashed()->where('user_id', $user_id)->get();
+
+        // Force delete folder
+        $folders->each->forceDelete();
+
+        // Force delete files
+        foreach ($files as $file) {
+
+            // Delete file
+            Storage::delete('/file-manager/' . $file->basename);
+
+            // Delete thumbnail if exist
+            if ($file->thumbnail) Storage::delete('/file-manager/' . $file->getOriginal('thumbnail'));
+
+            // Delete file permanently
+            $file->forceDelete();
+        }
+
+        // Return response
+        return response('Done!', 204);
+    }
+
+    /**
+     * Restore item from trash
+     *
+     * @param Request $request
+     * @param $unique_id
+     * @return ResponseFactory|\Illuminate\Http\Response
+     */
+    public function restore(Request $request, $unique_id)
+    {
+        // Validate request
+        $validator = Validator::make($request->all(), [
+            'type'      => 'required|string',
+            'to_home'   => 'boolean',
+        ]);
+
+        // Return error
+        if ($validator->fails()) abort(400, 'Bad input');
+
+        // Get user id
+        $user_id = Auth::id();
+
+        if (is_demo($user_id)) {
+            return Demo::response_204();
+        }
+
+        // Get folder
+        if ($request->type === 'folder') {
+
+            // Get folder
+            $item = FileManagerFolder::onlyTrashed()
+                ->where('user_id', $user_id)
+                ->where('unique_id', $unique_id)
+                ->first();
+
+            // Restore item to home directory
+            if ($request->has('to_home') && $request->to_home) {
+                $item->parent_id = 0;
+                $item->save();
+            }
+        } else {
+
+            // Get item
+            $item = FileManagerFile::onlyTrashed()
+                ->where('user_id', $user_id)
+                ->where('unique_id', $unique_id)
+                ->first();
+
+            // Restore item to home directory
+            if ($request->has('to_home') && $request->to_home) {
+                $item->folder_id = 0;
+                $item->save();
+            }
+        }
+
+        // Restore Item
+        $item->restore();
+
+        // Return response
+        return response('Done!', 204);
+    }
+}

app/Http/Controllers/FileManagerController.php

@@ -1,623 +0,0 @@
-<?php
-
-namespace App\Http\Controllers;
-
-use Illuminate\Support\Arr;
-use Illuminate\Support\Facades\Auth;
-use Illuminate\Support\Facades\Cookie;
-use Intervention\Image\ImageManagerStatic as Image;
-use Illuminate\Support\Facades\Validator;
-use Illuminate\Support\Facades\Storage;
-use Illuminate\Support\Facades\File;
-use App\Http\Controllers\Controller;
-use Illuminate\Http\Request;
-use Illuminate\Support\Str;
-use App\FileManagerFolder;
-use App\FileManagerFile;
-use Response;
-
-
-class FileManagerController extends Controller
-{
-    /**
-     * Get trashed files
-     *
-     * @param Request $request
-     * @return FileManagerFile[]|\Illuminate\Database\Eloquent\Builder[]|\Illuminate\Database\Eloquent\Collection|\Illuminate\Database\Query\Builder[]|\Illuminate\Support\Collection
-     */
-    public function trash()
-    {
-        // Get user id
-        $user_id = Auth::id();
-
-        // Get folders and files
-        $folders_trashed = FileManagerFolder::onlyTrashed()
-            ->with(['trashed_folders'])
-            ->where('user_id', $user_id)
-            ->get(['parent_id', 'unique_id', 'name']);
-
-        $folders = FileManagerFolder::onlyTrashed()
-            ->where('user_id', $user_id)
-            ->whereIn('unique_id', filter_folders_ids($folders_trashed))
-            ->get();
-
-        // Get files trashed
-        $files_trashed = FileManagerFile::onlyTrashed()
-            ->where('user_id', $user_id)
-            ->whereNotIn('folder_id', array_values(array_unique(recursiveFind($folders_trashed->toArray(), 'unique_id'))))
-            ->get();
-
-        // Collect folders and files to single array
-        return collect([$folders, $files_trashed])->collapse();
-    }
-
-    /**
-     * Get directory with files
-     *
-     * @return \Illuminate\Support\Collection
-     */
-    public function folder(Request $request, $unique_id)
-    {
-        // Get user
-        $user_id = Auth::id();
-
-        // Get folder trash items
-        if ($request->query('trash')) {
-
-            // Get folders and files
-            $folders = FileManagerFolder::onlyTrashed()
-                ->where('user_id', $user_id)
-                ->with('parent')
-                ->where('parent_id', $unique_id)
-                ->get();
-
-            $files = FileManagerFile::onlyTrashed()
-                ->where('user_id', $user_id)
-                ->with('parent')
-                ->where('folder_id', $unique_id)
-                ->get();
-
-            // Collect folders and files to single array
-            return collect([$folders, $files])->collapse();
-        }
-
-        // Get folders and files
-        $folders = FileManagerFolder::with('parent')
-            ->where('user_id', $user_id)
-            ->where('parent_id', $unique_id)
-            ->get();
-
-        $files = FileManagerFile::with('parent')
-            ->where('user_id', $user_id)
-            ->where('folder_id', $unique_id)
-            ->get();
-
-        // Collect folders and files to single array
-        return collect([$folders, $files])->collapse();
-    }
-
-    /**
-     * Search files
-     *
-     * @param Request $request
-     * @return \Illuminate\Database\Eloquent\Collection
-     */
-    public function search(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'query' => 'required|string',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get user
-        $user_id = Auth::id();
-
-        // Search files id db
-        $searched_files = FileManagerFile::search($request->input('query'))->where('user_id', $user_id)->get();
-        $searched_folders = FileManagerFolder::search($request->input('query'))->where('user_id', $user_id)->get();
-
-        // Collect folders and files to single array
-        return collect([$searched_folders, $searched_files])->collapse();
-    }
-
-    /**
-     * Create new folder
-     *
-     * @param Request $request
-     * @return array
-     */
-    public function create_folder(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'parent_id' => 'required|integer',
-            'name'      => 'string',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get parent_id from request
-        $parent_id = $request->parent_id === 0 ? 0 : $request->parent_id;
-
-        // Create folder
-        $folder = FileManagerFolder::create([
-            'user_id'   => Auth::id(),
-            'parent_id' => $parent_id,
-            'name'      => $request->has('name') ? $request->input('name') : 'New Folder',
-            'type'      => 'folder',
-            'unique_id' => $this->get_unique_id(),
-        ]);
-
-        // Return new folder
-        return $folder;
-    }
-
-    /**
-     * Rename item name
-     *
-     * @param Request $request
-     * @return mixed
-     */
-    public function rename_item(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'unique_id' => 'required|integer',
-            'name'      => 'required|string',
-            'type'      => 'required|string',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get user id
-        $user_id = Auth::id();
-
-        // Update folder name
-        if ($request->type === 'folder') {
-
-            $item = FileManagerFolder::where('unique_id', $request->unique_id)
-                ->where('user_id', $user_id)
-                ->firstOrFail();
-
-            $item->name = $request->name;
-            $item->save();
-
-        } else {
-
-            $item = FileManagerFile::where('unique_id', $request->unique_id)
-                ->where('user_id', $user_id)
-                ->firstOrFail();
-
-            $item->name = $request->name;
-            $item->save();
-        }
-
-        // Return updated item
-        return $item;
-    }
-
-    /**
-     * Delete item
-     *
-     * @param Request $request
-     * @throws \Exception
-     */
-    public function delete_item(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'unique_id'    => 'required|integer',
-            'type'         => 'required|string',
-            'force_delete' => 'required|boolean',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get user id
-        $user = Auth::user();
-
-        // Delete folder
-        if ($request->type === 'folder') {
-
-            $item = FileManagerFolder::withTrashed()
-                ->with('folders')
-                ->where('user_id', $user->id)
-                ->where('unique_id', $request->unique_id)
-                ->first();
-
-            // Remove folder from user favourites
-            $user->favourites()->detach($request->unique_id);
-
-            foreach ($item->files as $file) {
-
-                if ($request->force_delete) {
-
-                    // Delete file
-                    Storage::disk('local')->delete('/file-manager/' . $file->basename);
-
-                    // Delete thumbnail if exist
-                    if (!is_null($file->thumbnail)) Storage::disk('local')->delete('/file-manager/' . $file->getOriginal('thumbnail'));
-
-                    // Delete file permanently
-                    $file->forceDelete();
-                } else {
-
-                    // Delete file from visibility
-                    $file->delete();
-                }
-            }
-
-            // Delete record
-            if ($request->force_delete) {
-
-                $item->forceDelete();
-            } else {
-
-                $item->delete();
-            }
-        }
-
-        if ($request->type === 'file' || $request->type === 'image') {
-
-            $item = FileManagerFile::withTrashed()
-                ->where('user_id', $user->id)
-                ->where('unique_id', $request->unique_id)
-                ->first();
-
-            if ($request->force_delete) {
-
-                // Delete file
-                Storage::disk('local')->delete('/file-manager/' . $item->basename);
-
-                // Delete thumbnail if exist
-                if (!is_null($item->thumbnail)) Storage::disk('local')->delete('/file-manager/' . $item->thumbnail);
-
-                // Delete file permanently
-                $item->forceDelete();
-            } else {
-
-                // Delete file from visibility
-                $item->delete();
-            }
-        }
-    }
-
-    /**
-     * Empty user trash
-     *
-     * @return \Illuminate\Contracts\Routing\ResponseFactory|\Illuminate\Http\Response
-     */
-    public function empty_trash()
-    {
-        // Get user id
-        $user_id = Auth::id();
-
-        // Get files and folders
-        $folders = FileManagerFolder::onlyTrashed()->where('user_id', $user_id)->get();
-        $files = FileManagerFile::onlyTrashed()->where('user_id', $user_id)->get();
-
-        // Force delete every item
-        $folders->each->forceDelete();
-        $files->each->forceDelete();
-
-        // Return response
-        return response('Done!', 200);
-    }
-
-    /**
-     * Restore item from trash
-     *
-     * @param Request $request
-     */
-    public function restore_item(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'unique_id' => 'required|integer',
-            'type'      => 'required|string',
-            'to_home'   => 'boolean',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get user id
-        $user_id = Auth::id();
-
-        // Get folder
-        if ($request->type === 'folder') {
-
-            // Get folder
-            $item = FileManagerFolder::onlyTrashed()->where('user_id', $user_id)->where('unique_id', $request->unique_id)->first();
-
-            // Restore item to home directory
-            if ($request->has('to_home') && $request->to_home) {
-                $item->parent_id = 0;
-                $item->save();
-            }
-        }
-
-        // Get file
-        if ($request->type === 'file' || $request->type === 'image') {
-
-            // Get item
-            $item = FileManagerFile::onlyTrashed()->where('user_id', $user_id)->where('unique_id', $request->unique_id)->first();
-
-            // Restore item to home directory
-            if ($request->has('to_home') && $request->to_home) {
-                $item->folder_id = 0;
-                $item->save();
-            }
-        }
-
-        // Restore Item
-        $item->restore();
-    }
-
-    /**
-     * Delete Item
-     *
-     * @param Request $request
-     */
-    public function delete_items(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'items' => 'required|json',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        foreach ($request->input('items') as $file) {
-
-            if ($file['type'] === 'file' || $file['type'] === 'image') {
-
-                $item = FileManagerFile::where('unique_id', $file['unique_id'])->first();
-
-            } else {
-
-                $item = FileManagerFolder::where('unique_id', $file['unique_id'])->first();
-            }
-
-            // Delete file
-            Storage::disk('local')->delete('/file-manager/' . $item->basename);
-
-            // Delete thumbnail if exist
-            if (!is_null($item->thumbnail)) {
-                Storage::disk('local')->delete('/file-manager/' . $item->thumbnail);
-            }
-
-            // Permanently delete file
-            $item->forceDelete();
-        }
-    }
-
-    /**
-     * Upload items
-     *
-     * @param Request $request
-     * @return array
-     */
-    public function upload_item(Request $request)
-    {
-        // Check if user can upload
-        if (config('vuefilemanager.limit_storage_by_capacity') && user_storage_percentage() >= 100) {
-
-            abort(423, 'You exceed your storage limit!');
-        }
-
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'parent_id' => 'required|integer',
-            'file'      => 'required|file',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get parent_id from request
-        $folder_id = $request->parent_id === 0 ? 0 : $request->parent_id;
-        $file = $request->file('file');
-
-        // File
-        $filename = Str::random() . '-' . str_replace(' ', '', $file->getClientOriginalName());
-        $filetype = get_file_type($file);
-        $thumbnail = null;
-        $filesize = $file->getSize();
-        $directory = 'file-manager';
-
-        // create directory if not exist
-        if (!Storage::disk('local')->exists($directory)) {
-            Storage::disk('local')->makeDirectory($directory);
-        }
-
-        // Store to disk
-        Storage::disk('local')->putFileAs($directory, $file, $filename, 'public');
-
-        // Create image thumbnail
-        if ( $filetype == 'image' ) {
-
-            $thumbnail = 'thumbnail-' . $filename;
-
-            // Create intervention image
-            $image = Image::make($file->getRealPath())->orientate();
-
-            $image->resize(256, null, function ($constraint) {
-                $constraint->aspectRatio();
-            })->stream();
-
-            // Store thumbnail to s3
-            Storage::disk('local')->put($directory . '/' . $thumbnail, $image);
-        }
-
-        // Store file
-        $new_file = FileManagerFile::create([
-            'user_id'   => Auth::id(),
-            'name'      => pathinfo($file->getClientOriginalName())['filename'],
-            'basename'  => $filename,
-            'folder_id' => $folder_id,
-            'mimetype'  => $file->getClientOriginalExtension(),
-            'filesize'  => $filesize,
-            'type'      => $filetype,
-            'thumbnail' => $thumbnail,
-            'unique_id' => $this->get_unique_id(),
-        ]);
-
-        return $new_file;
-    }
-
-    /**
-     * Move item
-     *
-     * @param Request $request
-     */
-    public function move_item(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'from_unique_id' => 'required|integer',
-            'to_unique_id'   => 'required|integer',
-            'from_type'      => 'required|string',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get user id
-        $user_id = Auth::id();
-
-        if ($request->from_type === 'folder') {
-
-            // Move folder
-            $item = FileManagerFolder::where('user_id', $user_id)
-                ->where('unique_id', $request->from_unique_id)
-                ->firstOrFail();
-
-            $item->parent_id = $request->to_unique_id;
-
-        } else {
-
-            // Move file under new folder
-            $item = FileManagerFile::where('user_id', $user_id)
-                ->where('unique_id', $request->from_unique_id)
-                ->firstOrFail();
-
-            $item->folder_id = $request->to_unique_id;
-        }
-
-        $item->update();
-    }
-
-    /**
-     * Get file record
-     *
-     * @param $unique_id
-     * @return mixed
-     */
-    public function get_file_detail($unique_id)
-    {
-        // Get user id
-        $user_id = Auth::id();
-
-        return FileManagerFile::where('user_id', $user_id)->where('unique_id', $unique_id)->firstOrFail();
-    }
-
-    /**
-     * Get file
-     *
-     * @param $filename
-     * @return mixed
-     */
-    public function get_file($filename)
-    {
-        // Get user id
-        $user_id = Auth::id();
-
-        // Get file record
-        $file = FileManagerFile::withTrashed()
-            ->where('user_id', $user_id)
-            ->where('basename', $filename)
-            ->firstOrFail();
-
-        // Get file path
-        $path = storage_path() . '/app/file-manager/' . $file->basename;
-
-        // Check if file exist
-        if (!File::exists($path)) abort(404);
-
-        $file = File::get($path);
-        $type = File::mimeType($path);
-        $size = File::size($path);
-
-        // Create response
-        $response = Response::make($file, 200);
-        $response->header("Content-Type", $type);
-        $response->header("Content-Disposition", 'attachment; filename=' . $filename);
-        $response->header("Content-Length", $size);
-        $response->header("Accept-Ranges", "bytes");
-        $response->header("Content-Range", "bytes 0-" . $size . "/" . $size);
-
-        return $response;
-    }
-
-    /**
-     * Get image thumbnail
-     *
-     * @param $filename
-     * @return mixed
-     */
-    public function get_thumbnail($filename)
-    {
-        // Get user id
-        $user_id = Auth::id();
-
-        // Get file record
-        $file = FileManagerFile::withTrashed()
-            ->where('user_id', $user_id)
-            ->where('thumbnail', $filename)
-            ->firstOrFail();
-
-        // Get file path
-        $path = storage_path() . '/app/file-manager/' . $file->getOriginal('thumbnail');
-
-        // Check if file exist
-        if (!File::exists($path)) abort(404);
-
-        $file = File::get($path);
-        $type = File::mimeType($path);
-
-        // Create response
-        $response = Response::make($file, 200);
-        $response->header("Content-Type", $type);
-
-        return $response;
-    }
-
-    /**
-     * Get unique id
-     *
-     * @return int
-     */
-    private function get_unique_id(): int
-    {
-        // Get files and folders
-        $folders = FileManagerFolder::withTrashed()->get();
-        $files = FileManagerFile::withTrashed()->get();
-
-        // Get last ids
-        $folders_unique = $folders->isEmpty() ? 0 : $folders->last()->unique_id;
-        $files_unique = $files->isEmpty() ? 0 : $files->last()->unique_id;
-
-        // Count new unique id
-        $unique_id = $folders_unique > $files_unique ? $folders_unique + 1 : $files_unique + 1;
-
-        return $unique_id;
-    }
-}

app/Http/Controllers/Sharing/FileSharingController.php

@@ -0,0 +1,405 @@
+<?php
+
+namespace App\Http\Controllers\Sharing;
+
+use App\Http\Controllers\Controller;
+use App\Http\Requests\Share\AuthenticateShareRequest;
+use App\Http\Resources\ShareResource;
+use App\Http\Tools\Guardian;
+use http\Env\Response;
+use Illuminate\Contracts\View\Factory;
+use Illuminate\Support\Facades\Cookie;
+use Illuminate\Support\Facades\DB;
+use Illuminate\Support\Facades\Hash;
+use Illuminate\Support\Collection;
+use Illuminate\Http\Request;
+use Illuminate\Support\Arr;
+use App\FileManagerFolder;
+use App\FileManagerFile;
+use App\User;
+use App\Share;
+use Illuminate\Support\Facades\Storage;
+
+class FileSharingController extends Controller
+{
+
+    /**
+     * Show page index and delete access_token & shared_token cookie
+     *
+     * @return Factory|\Illuminate\View\View
+     */
+    public function index($token)
+    {
+        // Get shared token
+        $shared = Share::where(\DB::raw('BINARY `token`'), $token)
+            ->first();
+
+        if (! $shared) {
+            return view("index");
+        }
+
+        // Delete old access_token if exist
+        Cookie::queue('shared_access_token', '', -1);
+
+        // Set cookies
+        if ($shared->protected) {
+
+            // Set shared token
+            Cookie::queue('shared_token', $token, 43200);
+        }
+
+        // Check if shared is image file and then show it
+        if ($shared->type === 'file' && ! $shared->protected) {
+
+            $image = FileManagerFile::where('user_id', $shared->user_id)
+                ->where('type', 'image')
+                ->where('unique_id', $shared->item_id)
+                ->first();
+
+            if ($image) {
+                return $this->show_image($image);
+            }
+        }
+
+        // Return page index
+        return view("index");
+    }
+
+    /**
+     * Get image from storage and show it
+     *
+     * @param $file
+     * @return \Symfony\Component\HttpFoundation\StreamedResponse
+     */
+    private function show_image($file)
+    {
+        // Format pretty filename
+        $file_pretty_name = $file->name . '.' . $file->mimetype;
+
+        // Get file path
+        $path = '/file-manager/' . $file->basename;
+
+        // Check if file exist
+        if (!Storage::exists($path)) abort(404);
+
+        $header = [
+            "Content-Type"   => Storage::mimeType($path),
+            "Content-Length" => Storage::size($path),
+            "Accept-Ranges"  => "bytes",
+            "Content-Range"  => "bytes 0-600/" . Storage::size($path),
+        ];
+
+        // Get file
+        return Storage::response($path, $file_pretty_name, $header);
+    }
+
+    /**
+     * Check Password for protected item
+     *
+     * @param AuthenticateShareRequest $request
+     * @param $token
+     * @return array
+     */
+    public function authenticate(AuthenticateShareRequest $request, $token)
+    {
+        // Get sharing record
+        $shared = Share::where(DB::raw('BINARY `token`'), $token)->firstOrFail();
+
+        // Check password
+        if (!Hash::check($request->password, $shared->password)) {
+
+            abort(401, __('vuefilemanager.incorrect_password'));
+        }
+
+        // Get owner of shared content
+        $user = User::find($shared->user_id);
+
+        // Define scope
+        $scope = !is_null($shared->permission) ? $shared->permission : 'visitor';
+
+        // Generate token for visitor/editor
+        $access_token = $user->createToken('shared_access_token', [$scope])->accessToken;
+
+        // Return authorize token with shared options
+        return response(new ShareResource($shared), 200)
+            ->cookie('shared_token', $shared->token, 43200)
+            ->cookie('shared_access_token', $access_token, 43200);
+    }
+
+    /**
+     * Browse private folders
+     *
+     * @param Request $request
+     * @param $unique_id
+     * @return Collection
+     */
+    public function get_private_folders(Request $request, $unique_id)
+    {
+        // Get sharing record
+        $shared = Share::where('token', $request->cookie('shared_token'))->firstOrFail();
+
+        // Check if user can get directory
+        Guardian::check_item_access($unique_id, $shared);
+
+        // Get files and folders
+        list($folders, $files) = $this->get_items($unique_id, $shared);
+
+        // Collect folders and files to single array
+        return collect([$folders, $files])->collapse();
+    }
+
+    /**
+     * Browse public folders
+     *
+     * @param $unique_id
+     * @return Collection
+     */
+    public function get_public_folders($unique_id, $token)
+    {
+        // Get sharing record
+        $shared = Share::where(DB::raw('BINARY `token`'), $token)->firstOrFail();
+
+        // Abort if folder is protected
+        if ($shared->protected) {
+            abort(403, "Sorry, you don't have permission");
+        }
+
+        // Check if user can get directory
+        Guardian::check_item_access($unique_id, $shared);
+
+        // Get files and folders
+        list($folders, $files) = $this->get_items($unique_id, $shared);
+
+        // Set thumbnail links for public files
+        $files->map(function ($item) use ($token) {
+            $item->setPublicUrl($token);
+        });
+
+        // Collect folders and files to single array
+        return collect([$folders, $files])->collapse();
+    }
+
+    /**
+     * Get shared public file record
+     *
+     * @param $token
+     * @return mixed
+     */
+    public function file_public($token)
+    {
+        // Get sharing record
+        $shared = Share::where(DB::raw('BINARY `token`'), $token)->firstOrFail();
+
+        // Abort if file is protected
+        if ($shared->protected) {
+            abort(403, "Sorry, you don't have permission");
+        }
+
+        // Get file
+        $file = FileManagerFile::where('user_id', $shared->user_id)
+            ->where('unique_id', $shared->item_id)
+            ->firstOrFail(['name', 'basename', 'thumbnail', 'type', 'filesize', 'mimetype']);
+
+        // Set urls
+        $file->setPublicUrl($token);
+
+        // Return record
+        return $file;
+    }
+
+    /**
+     * Get shared private file record
+     *
+     * @param $token
+     * @return mixed
+     */
+    public function file_private(Request $request)
+    {
+        // Get sharing record
+        $shared = Share::where('token', $request->cookie('shared_token'))->firstOrFail();
+
+        // Return record
+        return FileManagerFile::where('user_id', $shared->user_id)
+            ->where('unique_id', $shared->item_id)
+            ->firstOrFail(['name', 'basename', 'thumbnail', 'type', 'filesize', 'mimetype']);
+    }
+
+    /**
+     * Get navigation tree
+     *
+     * @param Request $request
+     * @return array
+     */
+    public function get_private_navigation_tree(Request $request)
+    {
+        // Get sharing record
+        $shared = get_shared($request->cookie('shared_token'));
+
+        // Check if user can get directory
+        Guardian::check_item_access($shared->item_id, $shared);
+
+        // Get folders
+        $folders = FileManagerFolder::with('folders:id,parent_id,unique_id,name')
+            ->where('parent_id', $shared->item_id)
+            ->where('user_id', $shared->user_id)
+            ->get(['id', 'parent_id', 'unique_id', 'name']);
+
+        // Return folder tree
+        return [
+            [
+                'unique_id' => $shared->item_id,
+                'name'      => __('vuefilemanager.home'),
+                'location'  => 'public',
+                'folders'   => $folders,
+            ]
+        ];
+    }
+
+    /**
+     * Get navigation tree
+     *
+     * @return array
+     */
+    public function get_public_navigation_tree($token)
+    {
+        // Get sharing record
+        $shared = Share::where('token', $token)->firstOrFail();
+
+        // Check if user can get directory
+        Guardian::check_item_access($shared->item_id, $shared);
+
+        // Get folders
+        $folders = FileManagerFolder::with('folders:id,parent_id,unique_id,name')
+            ->where('parent_id', $shared->item_id)
+            ->where('user_id', $shared->user_id)
+            ->get(['id', 'parent_id', 'unique_id', 'name']);
+
+        // Return folder tree
+        return [
+            [
+                'unique_id' => $shared->item_id,
+                'name'      => __('vuefilemanager.home'),
+                'location'  => 'public',
+                'folders'   => $folders,
+            ]
+        ];
+    }
+
+    /**
+     * Search private files
+     *
+     * @param Request $request
+     * @param $token
+     * @return Collection
+     */
+    public function search_private(Request $request)
+    {
+        // Get shared
+        $shared = get_shared($request->cookie('shared_token'));
+
+        // Search files id db
+        $searched_files = FileManagerFile::search($request->input('query'))
+            ->where('user_id', $shared->user_id)
+            ->get();
+        $searched_folders = FileManagerFolder::search($request->input('query'))
+            ->where('user_id', $shared->user_id)
+            ->get();
+
+        // Get all children content
+        $foldersIds = FileManagerFolder::with('folders:id,parent_id,unique_id,name')
+            ->where('user_id', $shared->user_id)
+            ->where('parent_id', $shared->item_id)
+            ->get();
+
+        // Get accessible folders
+        $accessible_folder_ids = Arr::flatten([filter_folders_ids($foldersIds), $shared->item_id]);
+
+        // Filter files to only accessible files
+        $files = $searched_files->filter(function ($file) use ($accessible_folder_ids) {
+            return in_array($file->folder_id, $accessible_folder_ids);
+        });
+
+        // Filter folders to only accessible folders
+        $folders = $searched_folders->filter(function ($folder) use ($accessible_folder_ids) {
+            return in_array($folder->unique_id, $accessible_folder_ids);
+        });
+
+        // Collect folders and files to single array
+        return collect([$folders, $files])->collapse();
+    }
+
+    /**
+     * Search public files
+     *
+     * @param Request $request
+     * @param $token
+     * @return Collection
+     */
+    public function search_public(Request $request, $token)
+    {
+        // Get shared
+        $shared = get_shared($token);
+
+        // Abort if folder is protected
+        if ($shared->protected) {
+            abort(403, "Sorry, you don't have permission");
+        }
+
+        // Search files id db
+        $searched_files = FileManagerFile::search($request->input('query'))
+            ->where('user_id', $shared->user_id)
+            ->get();
+        $searched_folders = FileManagerFolder::search($request->input('query'))
+            ->where('user_id', $shared->user_id)
+            ->get();
+
+        // Get all children content
+        $foldersIds = FileManagerFolder::with('folders:id,parent_id,unique_id,name')
+            ->where('user_id', $shared->user_id)
+            ->where('parent_id', $shared->item_id)
+            ->get();
+
+        // Get accessible folders
+        $accessible_folder_ids = Arr::flatten([filter_folders_ids($foldersIds), $shared->item_id]);
+
+        // Filter files
+        $files = $searched_files->filter(function ($file) use ($accessible_folder_ids, $token) {
+
+            // Set public urls
+            $file->setPublicUrl($token);
+
+            // check if item is in accessible folders
+            return in_array($file->folder_id, $accessible_folder_ids);
+        });
+
+        // Filter folders
+        $folders = $searched_folders->filter(function ($folder) use ($accessible_folder_ids) {
+
+            // check if item is in accessible folders
+            return in_array($folder->unique_id, $accessible_folder_ids);
+        });
+
+        // Collect folders and files to single array
+        return collect([$folders, $files])->collapse();
+    }
+
+    /**
+     * Get folders and files
+     *
+     * @param $unique_id
+     * @param $shared
+     * @return array
+     */
+    private function get_items($unique_id, $shared): array
+    {
+        $folders = FileManagerFolder::where('user_id', $shared->user_id)
+            ->where('parent_id', $unique_id)
+            ->get();
+
+        $files = FileManagerFile::where('user_id', $shared->user_id)
+            ->where('folder_id', $unique_id)
+            ->get();
+
+        return [$folders, $files];
+    }
+}

app/Http/Controllers/User/AccountController.php

@@ -0,0 +1,134 @@
+<?php
+
+namespace App\Http\Controllers\User;
+
+use App\FileManagerFile;
+use App\FileManagerFolder;
+use App\Http\Resources\StorageDetailResource;
+use App\Http\Resources\UserStorageResource;
+use App\Http\Tools\Demo;
+use Illuminate\Contracts\Routing\ResponseFactory;
+use Illuminate\Support\Facades\Validator;
+use App\Http\Controllers\Controller;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Facades\Hash;
+use Illuminate\Http\Request;
+use ByteUnits\Metric;
+use App\User;
+
+class AccountController extends Controller
+{
+    /**
+     * Get all user data to frontend
+     *
+     * @return array
+     */
+    public function user()
+    {
+        // Get User
+        $user = User::with(['favourites', 'latest_uploads'])
+            ->where('id', Auth::id())
+            ->first();
+
+        // Get folder tree
+        $tree = FileManagerFolder::with(['folders.shared', 'shared:token,id,item_id,permission,protected'])
+            ->where('parent_id', 0)
+            ->where('user_id', $user->id)
+            ->get();
+
+        return [
+            'user'       => $user->only(['name', 'email', 'avatar', 'role']),
+            'favourites' => $user->favourites->makeHidden(['pivot']),
+            'tree'       => $tree,
+            'storage'    => [
+                'used'       => Metric::bytes($user->used_capacity)->format(),
+                'capacity'   => format_gigabytes($user->settings->storage_capacity),
+                'percentage' => get_storage_fill_percentage($user->used_capacity, $user->settings->storage_capacity),
+            ],
+        ];
+    }
+
+    /**
+     * Get storage details
+     *
+     * @return UserStorageResource
+     */
+    public function storage()
+    {
+        return new UserStorageResource(Auth::user());
+    }
+
+    /**
+     * Update user profile
+     *
+     * @param Request $request
+     * @return ResponseFactory|\Illuminate\Http\Response
+     */
+    public function update_profile(Request $request)
+    {
+        // Validate request
+        $validator = Validator::make($request->all(), [
+            'avatar' => 'file',
+            'name'   => 'string',
+            'value'  => 'string',
+        ]);
+
+        // Return error
+        if ($validator->fails()) abort(400, 'Bad input');
+
+        // Get user
+        $user = Auth::user();
+
+        // Check if is demo
+        if (is_demo($user->id)) {
+            return Demo::response_204();
+        }
+
+        // Check role
+        if ($request->has('role')) abort(403);
+
+        // Update data
+        if ($request->hasFile('avatar')) {
+
+            // Update avatar
+            $avatar = store_avatar($request->file('avatar'), 'avatars');
+
+            // Update data
+            $user->update(['avatar' => $avatar]);
+
+        } else {
+
+            // Update text data
+            $user->update(make_single_input($request));
+        }
+
+        return response('Saved!', 204);
+    }
+
+    /**
+     * Change user password
+     *
+     * @param Request $request
+     * @return ResponseFactory|\Illuminate\Http\Response
+     */
+    public function change_password(Request $request)
+    {
+        // Validate request
+        $request->validate([
+            'password' => ['required', 'string', 'min:6', 'confirmed'],
+        ]);
+
+        // Get user
+        $user = Auth::user();
+
+        if (is_demo($user->id)) {
+            return Demo::response_204();
+        }
+
+        // Change and store new password
+        $user->password = Hash::make($request->input('password'));
+        $user->save();
+
+        return response('Changed!', 204);
+    }
+}

app/Http/Controllers/UserAccountController.php

@@ -1,177 +0,0 @@
-<?php
-
-namespace App\Http\Controllers;
-
-use App\FileManagerFolder;
-use App\User;
-use ByteUnits\Metric;
-use Illuminate\Http\Request;
-use Illuminate\Support\Facades\Auth;
-use Illuminate\Support\Facades\File;
-use Illuminate\Support\Facades\Hash;
-use App\Http\Controllers\Controller;
-use Illuminate\Support\Facades\Validator;
-
-
-class UserAccountController extends Controller
-{
-    /**
-     * Get all user data to frontend
-     *
-     * @return array|\Illuminate\Database\Eloquent\Builder|\Illuminate\Database\Eloquent\Model|object|null
-     */
-    public function user()
-    {
-        $user_id = Auth::id();
-
-        // Get User
-        $user = User::with(['favourites', 'latest_uploads'])
-            ->where('id', $user_id)
-            ->first();
-
-        return [
-            'user'           => $user->only(['name', 'email', 'avatar']),
-            'favourites'     => $user->favourites->makeHidden(['pivot']),
-            'latest_uploads' => $user->latest_uploads->makeHidden(['user_id', 'basename']),
-            'storage' => [
-                'used'       => Metric::bytes($user->used_capacity)->format(),
-                'capacity'   => format_gigabytes(config('vuefilemanager.user_storage_capacity')),
-                'percentage' => get_storage_fill_percentage($user->used_capacity, config('vuefilemanager.user_storage_capacity')),
-            ],
-        ];
-    }
-
-    /**
-     * Get user folder tree
-     *
-     * @return array
-     */
-    public function folder_tree() {
-
-        $folders = FileManagerFolder::with('folders:id,parent_id,unique_id,name')
-            ->where('parent_id', 0)
-            ->where('user_id', Auth::id())
-            ->get(['id', 'parent_id', 'unique_id', 'name']);
-
-        return [
-            [
-                'unique_id' => 0,
-                'name'      => __('vuefilemanager.home'),
-                'location'  => 'base',
-                'folders'  => $folders,
-            ]
-        ];
-    }
-
-    /**
-     * Update user profile
-     *
-     * @param Request $request
-     * @return \Illuminate\Contracts\Routing\ResponseFactory|\Illuminate\Http\Response
-     */
-    public function update_profile(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'avatar'  => 'file',
-            '_method' => 'string',
-            'name'    => 'string',
-            'value'   => 'string',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get user
-        $user = Auth::user();
-
-        if ($request->hasFile('avatar')) {
-
-            // Update avatar
-            $avatar = store_avatar($request->file('avatar'), 'avatars');
-
-            // Update data
-            $user->update(['avatar' => $avatar]);
-
-        } else {
-
-            // Update text data
-            $user->update(make_single_input($request));
-        }
-
-        return response('Saved!', 200);
-    }
-
-    /**
-     * Change user password
-     *
-     * @param Request $request
-     * @return array
-     */
-    public function change_password(Request $request)
-    {
-        // Validate request
-        $request->validate([
-            'password' => ['required', 'string', 'min:6', 'confirmed'],
-        ]);
-
-        // Get user
-        $user = Auth::user();
-
-        // Change and store new password
-        $user->password = Hash::make($request->input('password'));
-        $user->save();
-    }
-
-    /**
-     * Add folder to user favourites
-     *
-     * @param Request $request
-     * @return \Illuminate\Contracts\Routing\ResponseFactory|\Illuminate\Http\Response
-     */
-    public function add_to_favourites(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'unique_id' => 'required|integer',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get user
-        $user = Auth::user();
-
-        // Add folder to user favourites
-        $user->favourites()->attach($request->unique_id);
-
-        // Return updated favourites
-        return $user->favourites->makeHidden(['pivot']);
-    }
-
-    /**
-     * Remove folder from user favourites
-     *
-     * @param Request $request
-     * @return \Illuminate\Contracts\Routing\ResponseFactory|\Illuminate\Http\Response
-     */
-    public function remove_from_favourites(Request $request)
-    {
-        // Validate request
-        $validator = Validator::make($request->all(), [
-            'unique_id' => 'required|integer',
-        ]);
-
-        // Return error
-        if ($validator->fails()) abort(400, 'Bad input');
-
-        // Get user
-        $user = Auth::user();
-
-        // Remove folder from user favourites
-        $user->favourites()->detach($request->unique_id);
-
-        // Return updated favourites
-        return $user->favourites->makeHidden(['pivot']);
-    }
-}

app/Http/Kernel.php

@@ -2,7 +2,10 @@
 
 namespace App\Http;
 
+use App\Http\Middleware\AdminCheck;
 use App\Http\Middleware\CookieAuth;
+use App\Http\Middleware\LastCheck;
+use App\Http\Middleware\SharedAuth;
 use Illuminate\Foundation\Http\Kernel as HttpKernel;
 
 class Kernel extends HttpKernel
@@ -40,6 +43,7 @@ class Kernel extends HttpKernel
         ],
 
         'api' => [
+            \App\Http\Middleware\EncryptCookies::class,
             //'throttle:60,1',
             \Illuminate\Routing\Middleware\SubstituteBindings::class,
         ],
@@ -53,6 +57,9 @@ class Kernel extends HttpKernel
      * @var array
      */
     protected $routeMiddleware = [
+        'auth.master'      => CookieAuth::class,
+        'auth.shared'      => SharedAuth::class,
+        'auth.admin'       => AdminCheck::class,
         'auth'             => \App\Http\Middleware\Authenticate::class,
         'auth.basic'       => \Illuminate\Auth\Middleware\AuthenticateWithBasicAuth::class,
         'bindings'         => \Illuminate\Routing\Middleware\SubstituteBindings::class,
@@ -63,7 +70,8 @@ class Kernel extends HttpKernel
         'signed'           => \Illuminate\Routing\Middleware\ValidateSignature::class,
         'throttle'         => \Illuminate\Routing\Middleware\ThrottleRequests::class,
         'verified'         => \Illuminate\Auth\Middleware\EnsureEmailIsVerified::class,
-        'auth.cookie'      => CookieAuth::class,
+        'scopes'           => \Laravel\Passport\Http\Middleware\CheckScopes::class,
+        'scope'            => \Laravel\Passport\Http\Middleware\CheckForAnyScope::class,
     ];
 
     /**
@@ -77,6 +85,7 @@ class Kernel extends HttpKernel
         \Illuminate\Session\Middleware\StartSession::class,
         \Illuminate\View\Middleware\ShareErrorsFromSession::class,
         CookieAuth::class,
+        SharedAuth::class,
         \App\Http\Middleware\Authenticate::class,
         \Illuminate\Routing\Middleware\ThrottleRequests::class,
         \Illuminate\Session\Middleware\AuthenticateSession::class,

app/Http/Middleware/AdminCheck.php

@@ -0,0 +1,26 @@
+<?php
+
+namespace App\Http\Middleware;
+
+use Closure;
+use Illuminate\Support\Facades\Gate;
+
+class AdminCheck
+{
+    /**
+     * Handle an incoming request.
+     *
+     * @param  \Illuminate\Http\Request  $request
+     * @param  \Closure  $next
+     * @return mixed
+     */
+    public function handle($request, Closure $next)
+    {
+        // Check if user have access to administration settings
+        if ( ! Gate::allows('admin-settings')) {
+            abort(403, 'You don\'t have access for this operation!');
+        }
+
+        return $next($request);
+    }
+}

app/Http/Middleware/CookieAuth.php

@@ -3,6 +3,7 @@
 namespace App\Http\Middleware;
 
 use Closure;
+use Illuminate\Support\Facades\Auth;
 
 class CookieAuth
 {
@@ -16,14 +17,12 @@ class CookieAuth
     public function handle($request, Closure $next)
     {
         if (!$request->bearerToken()) {
-            if ($request->hasCookie('token')) {
+            if ($request->hasCookie('access_token')) {
 
-                $token = $request->cookie('token');
+                $access_token = $request->cookie('access_token');
 
-                $request->headers->add(['Authorization' => 'Bearer ' . $token]);
+                $request->headers->add(['Authorization' => 'Bearer ' . $access_token]);
 
-            } else {
-                abort(401);
             }
         }
         return $next($request);

app/Http/Middleware/SharedAuth.php

@@ -0,0 +1,29 @@
+<?php
+
+namespace App\Http\Middleware;
+
+use Closure;
+
+class SharedAuth
+{
+    /**
+     * Handle an incoming request.
+     *
+     * @param  \Illuminate\Http\Request  $request
+     * @param  \Closure  $next
+     * @return mixed
+     */
+    public function handle($request, Closure $next)
+    {
+        if (!$request->bearerToken()) {
+            if ($request->hasCookie('shared_access_token')) {
+
+                $shared_access_token = $request->cookie('shared_access_token');
+
+                $request->headers->add(['Authorization' => 'Bearer ' . $shared_access_token]);
+
+            }
+        }
+        return $next($request);
+    }
+}

app/Http/Middleware/VerifyCsrfToken.php

@@ -19,6 +19,6 @@ class VerifyCsrfToken extends Middleware
      * @var array
      */
     protected $except = [
-        //
+        '/deploy',
     ];
 }

app/Http/Requests/Admin/ChangeRoleRequest.php

@@ -0,0 +1,31 @@
+<?php
+
+namespace App\Http\Requests\Admin;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class ChangeRoleRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'attributes'      => 'required|array',
+            'attributes.role' => 'required|string'
+        ];
+    }
+}

app/Http/Requests/Admin/ChangeStorageCapacityRequest.php

@@ -0,0 +1,31 @@
+<?php
+
+namespace App\Http\Requests\Admin;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class ChangeStorageCapacityRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'attributes'                  => 'required|array',
+            'attributes.storage_capacity' => 'required|digits_between:1,9'
+        ];
+    }
+}

app/Http/Requests/Admin/CreateUserByAdmin.php

@@ -0,0 +1,35 @@
+<?php
+
+namespace App\Http\Requests\Admin;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class CreateUserByAdmin extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'email'            => 'required|string|email|max:255|unique:users',
+            'password'         => 'required|string|min:6|confirmed',
+            'name'             => 'required|string|max:255',
+            'storage_capacity' => 'required|digits_between:1,9',
+            'role'             => 'required|string',
+            'avatar'           => 'sometimes|file',
+        ];
+    }
+}

app/Http/Requests/Admin/DeleteUserRequest.php

@@ -0,0 +1,30 @@
+<?php
+
+namespace App\Http\Requests\Admin;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class DeleteUserRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'name' => 'required|string|max:255',
+        ];
+    }
+}

app/Http/Requests/Auth/CheckAccountRequest.php

@@ -0,0 +1,30 @@
+<?php
+
+namespace App\Http\Requests\Auth;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class CheckAccountRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'email' => 'required|string|email',
+        ];
+    }
+}

app/Http/Requests/FileBrowser/SearchRequest.php

@@ -0,0 +1,30 @@
+<?php
+
+namespace App\Http\Requests\FileBrowser;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class SearchRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'query' => 'required|string',
+        ];
+    }
+}

app/Http/Requests/FileFunctions/CreateFolderRequest.php

@@ -0,0 +1,32 @@
+<?php
+
+namespace App\Http\Requests\FileFunctions;
+
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Facades\Auth;
+
+class CreateFolderRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'parent_id' => 'required|integer',
+            'name'      => 'string',
+        ];
+    }
+}

app/Http/Requests/FileFunctions/DeleteItemRequest.php

@@ -0,0 +1,32 @@
+<?php
+
+namespace App\Http\Requests\FileFunctions;
+
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Facades\Auth;
+
+class DeleteItemRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'type'         => 'required|string',
+            'force_delete' => 'required|boolean',
+        ];
+    }
+}

app/Http/Requests/FileFunctions/MoveItemRequest.php

@@ -0,0 +1,32 @@
+<?php
+
+namespace App\Http\Requests\FileFunctions;
+
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Facades\Auth;
+
+class MoveItemRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'to_unique_id'   => 'required|integer',
+            'from_type'      => 'required|string',
+        ];
+    }
+}

app/Http/Requests/FileFunctions/RenameItemRequest.php

@@ -0,0 +1,32 @@
+<?php
+
+namespace App\Http\Requests\FileFunctions;
+
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Facades\Auth;
+
+class RenameItemRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'name'      => 'required|string',
+            'type'      => 'required|string',
+        ];
+    }
+}

app/Http/Requests/FileFunctions/UploadRequest.php

@@ -0,0 +1,32 @@
+<?php
+
+namespace App\Http\Requests\FileFunctions;
+
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Facades\Auth;
+
+class UploadRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return true;
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'parent_id' => 'required|integer',
+            'file'      => 'required|file',
+        ];
+    }
+}

app/Http/Requests/Share/AuthenticateShareRequest.php

@@ -0,0 +1,20 @@
+<?php
+
+namespace App\Http\Requests\Share;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class AuthenticateShareRequest extends FormRequest
+{
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'password' => 'required|string',
+        ];
+    }
+}

app/Http/Requests/Share/CreateShareRequest.php

@@ -0,0 +1,35 @@
+<?php
+
+namespace App\Http\Requests\Share;
+
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Facades\Auth;
+
+class CreateShareRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return Auth::check();
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'isPassword' => 'required|boolean',
+            'unique_id'  => 'required|integer',
+            'type'       => 'required|string',
+            'permission' => 'string',
+            'password'   => 'string',
+        ];
+    }
+}

app/Http/Requests/Share/UpdateShareRequest.php

@@ -0,0 +1,33 @@
+<?php
+
+namespace App\Http\Requests\Share;
+
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Facades\Auth;
+
+class UpdateShareRequest extends FormRequest
+{
+    /**
+     * Determine if the user is authorized to make this request.
+     *
+     * @return bool
+     */
+    public function authorize()
+    {
+        return Auth::check();
+    }
+
+    /**
+     * Get the validation rules that apply to the request.
+     *
+     * @return array
+     */
+    public function rules()
+    {
+        return [
+            'protected'  => 'required|boolean',
+            'permission' => 'nullable|string',
+            'password'   => 'string',
+        ];
+    }
+}

app/Http/Resources/ShareResource.php

@@ -0,0 +1,34 @@
+<?php
+
+namespace App\Http\Resources;
+
+use Illuminate\Http\Resources\Json\JsonResource;
+
+class ShareResource extends JsonResource
+{
+    /**
+     * Transform the resource into an array.
+     *
+     * @param \Illuminate\Http\Request $request
+     * @return array
+     */
+    public function toArray($request)
+    {
+        return [
+            'data' => [
+                'id'         => (string)$this->id,
+                'type'       => 'shares',
+                'attributes' => [
+                    'permission' => $this->permission,
+                    'protected'  => $this->protected,
+                    'item_id'    => $this->item_id,
+                    'token'      => $this->token,
+                    'link'       => $this->link,
+                    'type'       => $this->type,
+                    'created_at' => $this->created_at,
+                    'updated_at' => $this->updated_at,
+                ]
+            ]
+        ];
+    }
+}

app/Http/Resources/UserResource.php

@@ -0,0 +1,38 @@
+<?php
+
+namespace App\Http\Resources;
+
+use Faker\Factory;
+use Illuminate\Http\Resources\Json\JsonResource;
+
+class UserResource extends JsonResource
+{
+    /**
+     * Transform the resource into an array.
+     *
+     * @param \Illuminate\Http\Request $request
+     * @return array
+     */
+    public function toArray($request)
+    {
+        // Faker only for demo purpose
+        $faker = Factory::create();
+
+        return [
+            'data' => [
+                'id'         => (string)$this->id,
+                'type'       => 'user',
+                'attributes' => [
+                    'name'                 => env('APP_DEMO') ? $faker->name : $this->name,
+                    'email'                => env('APP_DEMO') ? $faker->email : $this->email,
+                    'avatar'               => $this->avatar,
+                    'role'                 => $this->role,
+                    'storage'              => $this->storage,
+                    'created_at_formatted' => format_date($this->created_at, '%d. %B. %Y'),
+                    'created_at'           => $this->created_at,
+                    'updated_at'           => $this->updated_at,
+                ]
+            ]
+        ];
+    }
+}

app/Http/Resources/UserStorageResource.php

@@ -0,0 +1,89 @@
+<?php
+
+namespace App\Http\Resources;
+
+use App\FileManagerFile;
+use ByteUnits\Metric;
+use Illuminate\Http\Resources\Json\JsonResource;
+
+class UserStorageResource extends JsonResource
+{
+    /**
+     * Transform the resource into an array.
+     *
+     * @param \Illuminate\Http\Request $request
+     * @return array
+     */
+    public function toArray($request)
+    {
+        $document_mimetypes = [
+            'pdf', 'numbers', 'xlsx', 'xls', 'txt', 'md', 'rtf', 'pptx', 'ppt', 'odt', 'ods', 'odp', 'epub', 'docx', 'doc', 'csv', 'pages'
+        ];
+
+        // Get all images
+        $images = FileManagerFile::where('user_id', $this->id)
+            ->where('type', 'image')->get()->map(function ($item) {
+                return (int)$item->getOriginal('filesize');
+            })->sum();
+
+        // Get all audios
+        $audios = FileManagerFile::where('user_id', $this->id)
+            ->where('type', 'audio')->get()->map(function ($item) {
+                return (int)$item->getOriginal('filesize');
+            })->sum();
+
+        // Get all videos
+        $videos = FileManagerFile::where('user_id', $this->id)
+            ->where('type', 'video')->get()->map(function ($item) {
+                return (int)$item->getOriginal('filesize');
+            })->sum();
+
+        // Get all documents
+        $documents = FileManagerFile::where('user_id', $this->id)
+            ->whereIn('mimetype', $document_mimetypes)->get()->map(function ($item) {
+                return (int)$item->getOriginal('filesize');
+            })->sum();
+
+        // Get all other files
+        $others = FileManagerFile::where('user_id', $this->id)
+            ->whereNotIn('mimetype', $document_mimetypes)
+            ->whereNotIn('type', ['audio', 'video', 'image'])
+            ->get()->map(function ($item) {
+                return (int)$item->getOriginal('filesize');
+            })->sum();
+
+        return [
+            'data' => [
+                'id'            => (string)$this->id,
+                'type'          => 'user-storage',
+                'attributes'    => [
+                    'used'       => Metric::bytes($this->used_capacity)->format(),
+                    'capacity'   => format_gigabytes($this->settings->storage_capacity),
+                    'percentage' => (float)get_storage_fill_percentage($this->used_capacity, $this->settings->storage_capacity),
+                ],
+                'meta' => [
+                    'images'    => [
+                        'used'       => Metric::bytes($images)->format(),
+                        'percentage' => (float)get_storage_fill_percentage($images, $this->settings->storage_capacity),
+                    ],
+                    'audios'    => [
+                        'used'       => Metric::bytes($audios)->format(),
+                        'percentage' => (float)get_storage_fill_percentage($audios, $this->settings->storage_capacity),
+                    ],
+                    'videos'    => [
+                        'used'       => Metric::bytes($videos)->format(),
+                        'percentage' => (float)get_storage_fill_percentage($videos, $this->settings->storage_capacity),
+                    ],
+                    'documents' => [
+                        'used'       => Metric::bytes($documents)->format(),
+                        'percentage' => (float)get_storage_fill_percentage($documents, $this->settings->storage_capacity),
+                    ],
+                    'others'    => [
+                        'used'       => Metric::bytes($others)->format(),
+                        'percentage' => (float)get_storage_fill_percentage($others, $this->settings->storage_capacity),
+                    ],
+                ]
+            ]
+        ];
+    }
+}

app/Http/Resources/UsersCollection.php

@@ -0,0 +1,23 @@
+<?php
+
+namespace App\Http\Resources;
+
+use Illuminate\Http\Resources\Json\ResourceCollection;
+
+class UsersCollection extends ResourceCollection
+{
+    public $collects = UserResource::class;
+
+    /**
+     * Transform the resource collection into an array.
+     *
+     * @param  \Illuminate\Http\Request  $request
+     * @return array
+     */
+    public function toArray($request)
+    {
+        return [
+            'data' => $this->collection,
+        ];
+    }
+}

app/Http/Tools/Demo.php

@@ -0,0 +1,143 @@
+<?php
+
+namespace App\Http\Tools;
+
+use App;
+use App\Share;
+use App\FileManagerFile;
+use App\FileManagerFolder;
+use App\Http\Requests\FileFunctions\RenameItemRequest;
+use App\User;
+use ByteUnits\Metric;
+use Carbon\Carbon;
+use Illuminate\Contracts\Routing\ResponseFactory;
+use Illuminate\Support\Arr;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Facades\Storage;
+use Illuminate\Support\Str;
+use Intervention\Image\ImageManagerStatic as Image;
+
+
+class Demo
+{
+    /**
+     * Create new directory
+     *
+     * @param $request
+     * @return array
+     * @throws \Exception
+     */
+    public static function create_folder($request)
+    {
+        // Get variables
+        $user_scope = $request->user() ? $request->user()->token()->scopes[0] : 'editor';
+        $name = $request->has('name') ? $request->input('name') : 'New Folder';
+
+        return [
+            'user_id'    => 1,
+            'id'         => random_int(1000, 9999),
+            'parent_id'  => random_int(1000, 9999),
+            'name'       => $name,
+            'type'       => 'folder',
+            'unique_id'  => random_int(1000, 9999),
+            'user_scope' => $user_scope,
+            'items'      => '0',
+            'updated_at' => Carbon::now()->format('j M Y \a\t H:i'),
+            'created_at' => Carbon::now()->format('j M Y \a\t H:i'),
+        ];
+    }
+
+    /**
+     * Rename item name
+     *
+     * @param RenameItemRequest $request
+     * @param $unique_id
+     * @return mixed
+     */
+    public static function rename_item($request, $unique_id)
+    {
+        // Get item
+        if ($request->type === 'folder') {
+
+            $item = FileManagerFolder::where('unique_id', $unique_id)
+                ->where('user_id', 1)
+                ->first();
+
+        } else {
+
+            $item = FileManagerFile::where('unique_id', $unique_id)
+                ->where('user_id', 1)
+                ->first();
+        }
+
+        if ($item) {
+            $item->name = $request->name;
+
+            return $item;
+
+        } else {
+
+            return [
+                'unique_id' => $request->unique_id,
+                'name'      => $request->name,
+                'type'      => $request->type,
+            ];
+        }
+    }
+
+    /**
+     * Upload file
+     *
+     * @param $request
+     * @return array
+     * @throws \Exception
+     */
+    public static function upload($request)
+    {
+        // Get user data
+        $user_scope = $request->user() ? $request->user()->token()->scopes[0] : 'editor';
+
+        // File
+        $file = $request->file('file');
+        $filename = Str::random() . '-' . str_replace(' ', '', $file->getClientOriginalName());
+        $thumbnail = null;
+        $filesize = $file->getSize();
+        $filetype = get_file_type($file);
+
+        return [
+            'id'         => random_int(1000, 9999),
+            'unique_id'  => random_int(1000, 9999),
+            'folder_id'  => $request->parent_id,
+            'thumbnail'  => 'data:' . $request->file('file')->getMimeType() . ';base64, ' . base64_encode(file_get_contents($request->file('file'))),
+            'name'       => $file->getClientOriginalName(),
+            'basename'   => $filename,
+            'mimetype'   => $file->getClientOriginalExtension(),
+            'filesize'   => Metric::bytes($filesize)->format(),
+            'type'       => $filetype,
+            'file_url'   => 'https://vuefilemanager.hi5ve.digital/assets/vue-file-manager-preview.jpg',
+            'user_scope' => $user_scope,
+            'created_at' => Carbon::now()->format('j M Y \a\t H:i'),
+            'updated_at' => Carbon::now()->format('j M Y \a\t H:i'),
+        ];
+    }
+
+    /**
+     * Return 204 status
+     *
+     * @return ResponseFactory|\Illuminate\Http\Response
+     */
+    public static function response_204() {
+
+        return response('Done!', 204);
+    }
+
+    /**
+     * Return 204 status
+     *
+     * @return ResponseFactory|\Illuminate\Http\Response
+     */
+    public static function favourites($user) {
+
+        return $user->favourites->makeHidden(['pivot']);
+    }
+}

app/Http/Tools/Editor.php

@@ -0,0 +1,294 @@
+<?php
+
+namespace App\Http\Tools;
+
+use App;
+use App\Share;
+use App\FileManagerFile;
+use App\FileManagerFolder;
+use App\Http\Requests\FileFunctions\RenameItemRequest;
+use App\User;
+use Illuminate\Support\Arr;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Facades\Storage;
+use Illuminate\Support\Str;
+use Intervention\Image\ImageManagerStatic as Image;
+
+
+class Editor
+{
+    /**
+     * Create new directory
+     *
+     * @param $request
+     * @param null $shared
+     * @return FileManagerFolder|\Illuminate\Database\Eloquent\Model
+     */
+    public static function create_folder($request, $shared = null)
+    {
+        // Get variables
+        $user_scope = is_null($shared) ? $request->user()->token()->scopes[0] : 'editor';
+        $name = $request->has('name') ? $request->input('name') : 'New Folder';
+        $user_id = is_null($shared) ? Auth::id() : $shared->user_id;
+
+        // Create folder
+        $folder = FileManagerFolder::create([
+            'parent_id'  => $request->parent_id,
+            'unique_id'  => get_unique_id(),
+            'user_scope' => $user_scope,
+            'user_id'    => $user_id,
+            'type'       => 'folder',
+            'name'       => $name,
+        ]);
+
+        // Return new folder
+        return $folder;
+    }
+
+    /**
+     * Rename item name
+     *
+     * @param RenameItemRequest $request
+     * @param $unique_id
+     * @param null $shared
+     * @return \Illuminate\Database\Eloquent\Builder|\Illuminate\Database\Eloquent\Model
+     * @throws \Exception
+     */
+    public static function rename_item($request, $unique_id, $shared = null)
+    {
+        // Get user id
+        $user_id = is_null($shared) ? Auth::id() : $shared->user_id;
+
+        // Get item
+        $item = get_item($request->type, $unique_id, $user_id);
+
+        // Rename item
+        $item->update([
+            'name' => $request->name
+        ]);
+
+        // Return updated item
+        return $item;
+    }
+
+    /**
+     * Delete file or folder
+     *
+     * @param $request
+     * @param $unique_id
+     * @param null $shared
+     * @throws \Exception
+     */
+    public static function delete_item($request, $unique_id, $shared = null)
+    {
+        // Get user id
+        $user = is_null($shared) ? Auth::user() : User::findOrFail($shared->user_id);
+
+        // Delete folder
+        if ($request->type === 'folder') {
+
+            // Get folder
+            $folder = FileManagerFolder::withTrashed()
+                ->with(['folders'])
+                ->where('user_id', $user->id)
+                ->where('unique_id', $unique_id)
+                ->first();
+
+            // Get folder shared record
+            $shared = Share::where('user_id', $user->id)
+                ->where('type', '=', 'folder')
+                ->where('item_id', $unique_id)
+                ->first();
+
+            // Delete folder shared record
+            if ($shared) {
+                $shared->delete();
+            }
+
+            // Force delete children files
+            if ($request->force_delete) {
+
+                // Get children folder ids
+                $child_folders = filter_folders_ids($folder->trashed_folders, 'unique_id');
+
+                // Get children files
+                $files = FileManagerFile::onlyTrashed()
+                    ->where('user_id', $user->id)
+                    ->whereIn('folder_id', Arr::flatten([$unique_id, $child_folders]))
+                    ->get();
+
+                // Remove all children files
+                foreach ($files as $file) {
+
+                    // Delete file
+                    Storage::delete('/file-manager/' . $file->basename);
+
+                    // Delete thumbnail if exist
+                    if (!is_null($file->thumbnail)) Storage::delete('/file-manager/' . $file->getOriginal('thumbnail'));
+
+                    // Delete file permanently
+                    $file->forceDelete();
+                }
+
+                // Delete folder record
+                $folder->forceDelete();
+            }
+
+            // Soft delete items
+            if (!$request->force_delete) {
+
+                // Remove folder from user favourites
+                $user->favourites()->detach($unique_id);
+
+                // Soft delete folder record
+                $folder->delete();
+            }
+        }
+
+        // Delete item
+        if ($request->type !== 'folder') {
+
+            // Get file
+            $file = FileManagerFile::withTrashed()
+                ->where('user_id', $user->id)
+                ->where('unique_id', $unique_id)
+                ->first();
+
+            // Get folder shared record
+            $shared = Share::where('user_id', $user->id)
+                ->where('type', '=', 'file')
+                ->where('item_id', $unique_id)
+                ->first();
+
+            // Delete file shared record
+            if ($shared) {
+                $shared->delete();
+            }
+
+            // Force delete file
+            if ($request->force_delete) {
+
+                // Delete file
+                Storage::delete('/file-manager/' . $file->basename);
+
+                // Delete thumbnail if exist
+                if ($file->thumbnail) Storage::delete('/file-manager/' . $file->getOriginal('thumbnail'));
+
+                // Delete file permanently
+                $file->forceDelete();
+            }
+
+            // Soft delete file
+            if (!$request->force_delete) {
+
+                // Soft delete file
+                $file->delete();
+            }
+        }
+    }
+
+    /**
+     * Upload file
+     *
+     * @param $request
+     * @param null $shared
+     * @return FileManagerFile|\Illuminate\Database\Eloquent\Model
+     * @throws \Exception
+     */
+    public static function upload($request, $shared = null)
+    {
+        // Get user data
+        $user_scope = is_null($shared) ? $request->user()->token()->scopes[0] : 'editor';
+        $user_id = is_null($shared) ? Auth::id() : $shared->user_id;
+
+        // Get parent_id from request
+        $folder_id = $request->parent_id === 0 ? 0 : $request->parent_id;
+        $file = $request->file('file');
+
+        // File
+        $filename = Str::random() . '-' . str_replace(' ', '', $file->getClientOriginalName());
+        $filetype = get_file_type($file);
+        $filesize = $file->getSize();
+        $directory = 'file-manager';
+        $thumbnail = null;
+
+        // create directory if not exist
+        if (!Storage::exists($directory)) {
+            Storage::makeDirectory($directory);
+        }
+
+        // Store to disk
+        Storage::putFileAs($directory, $file, $filename, 'private');
+
+        // Create image thumbnail
+        if ($filetype == 'image') {
+
+            // Get thumbnail name
+            $thumbnail = 'thumbnail-' . $filename;
+
+            // Create intervention image
+            $image = Image::make($file->getRealPath())->orientate();
+
+            // Resize image
+            $image->resize(564, null, function ($constraint) {
+                $constraint->aspectRatio();
+            })->stream();
+
+            // Store thumbnail to disk
+            Storage::put($directory . '/' . $thumbnail, $image);
+        }
+
+        // Store file
+        $options = [
+            'name'       => pathinfo($file->getClientOriginalName())['filename'],
+            'mimetype'   => $file->getClientOriginalExtension(),
+            'unique_id'  => get_unique_id(),
+            'user_scope' => $user_scope,
+            'folder_id'  => $folder_id,
+            'thumbnail'  => $thumbnail,
+            'basename'   => $filename,
+            'filesize'   => $filesize,
+            'type'       => $filetype,
+            'user_id'    => $user_id,
+        ];
+
+        // Return new file
+        return FileManagerFile::create($options);
+    }
+
+    /**
+     * Move folder or file to new location
+     *
+     * @param $request
+     * @param $unique_id
+     * @param null $shared
+     */
+    public static function move($request, $unique_id, $shared = null)
+    {
+        // Get user id
+        $user_id = is_null($shared) ? Auth::id() : $shared->user_id;
+
+        if ($request->from_type === 'folder') {
+
+            // Move folder
+            $item = FileManagerFolder::where('user_id', $user_id)
+                ->where('unique_id', $unique_id)
+                ->firstOrFail();
+
+            $item->update([
+                'parent_id' => $request->to_unique_id
+            ]);
+
+        } else {
+
+            // Move file under new folder
+            $item = FileManagerFile::where('user_id', $user_id)
+                ->where('unique_id', $unique_id)
+                ->firstOrFail();
+
+            $item->update([
+                'folder_id' => $request->to_unique_id
+            ]);
+        }
+    }
+}

app/Http/Tools/Guardian.php

@@ -0,0 +1,42 @@
+<?php
+
+namespace App\Http\Tools;
+
+use App;
+use App\FileManagerFolder;
+use Illuminate\Support\Arr;
+
+
+class Guardian
+{
+    /**
+     * Check access to requested directory
+     *
+     * @param integer|array $requested_id
+     * @param string $shared Shared record detail
+     */
+    public static function check_item_access($requested_id, $shared)
+    {
+        // Get all children folders
+        $foldersIds = FileManagerFolder::with('folders:id,parent_id,unique_id,name')
+            ->where('user_id', $shared->user_id)
+            ->where('parent_id', $shared->item_id)
+            ->get();
+
+        // Get all authorized parent folders by shared folder as root of tree
+        $accessible_folder_ids = Arr::flatten([filter_folders_ids($foldersIds), $shared->item_id]);
+
+        // Check user access
+        if ( is_array($requested_id) ) {
+            foreach ($requested_id as $id) {
+                if (!in_array($id, $accessible_folder_ids))
+                    abort(403);
+            }
+        }
+
+        if (! is_array($requested_id)) {
+            if (! in_array($requested_id, $accessible_folder_ids))
+                abort(403);
+        }
+    }
+}

app/Http/helpers.php

@@ -1,11 +1,125 @@
 <?php
 
+use App\FileManagerFile;
+use App\FileManagerFolder;
+use App\Share;
 use ByteUnits\Metric;
 use Carbon\Carbon;
+use Illuminate\Database\Eloquent\Model;
+use Illuminate\Support\Facades\Auth;
 use Illuminate\Support\Facades\Storage;
 use Illuminate\Support\Str;
 use Intervention\Image\ImageManagerStatic as Image;
 
+/**
+ * Get app version from config
+ *
+ * @return \Illuminate\Config\Repository|mixed
+ */
+function get_storage() {
+    return env('FILESYSTEM_DRIVER');
+}
+
+/**
+ * Check if is running AWS s3 as storage
+ *
+ * @return bool
+ */
+function is_storage_driver($driver) {
+
+    if (is_array($driver)) {
+        return in_array(env('FILESYSTEM_DRIVER'), $driver);
+    }
+
+    return env('FILESYSTEM_DRIVER') === $driver;
+}
+
+/**
+ * Get app version from config
+ *
+ * @return \Illuminate\Config\Repository|mixed
+ */
+function get_version() {
+    return config('vuefilemanager.version');
+}
+
+/**
+ * Check if is demo
+ *
+ * @return mixed
+ */
+function is_demo($user_id) {
+
+    return env('APP_DEMO', false) && $user_id === 1;
+}
+
+/**
+ * Get folder or file item
+ *
+ * @param $type
+ * @param $unique_id
+ * @param $user_id
+ * @return \Illuminate\Database\Eloquent\Builder|Model
+ */
+function get_item($type, $unique_id, $user_id) {
+
+    if ($type === 'folder') {
+
+        // Return folder item
+        return FileManagerFolder::where('unique_id', $unique_id)
+            ->where('user_id', $user_id)
+            ->firstOrFail();
+    }
+
+    // Return file item
+    return FileManagerFile::where('unique_id', $unique_id)
+        ->where('user_id', $user_id)
+        ->firstOrFail();
+}
+
+/**
+ * Get shared token
+ *
+ * @param $token
+ * @return \Illuminate\Database\Eloquent\Builder|Model
+ */
+function get_shared($token) {
+
+    return Share::where(DB::raw('BINARY `token`'), $token)
+        ->firstOrFail();
+}
+
+/**
+ * Check if shared permission is editor
+ *
+ * @param $shared
+ * @return bool
+ */
+function is_editor($shared) {
+
+    return $shared->permission === 'editor';
+}
+
+/**
+ * Get unique id
+ *
+ * @return int
+ */
+function get_unique_id(): int
+{
+    // Get files and folders
+    $folders = FileManagerFolder::withTrashed()->get();
+    $files = FileManagerFile::withTrashed()->get();
+
+    // Get last ids
+    $folders_unique = $folders->isEmpty() ? 0 : $folders->last()->unique_id;
+    $files_unique = $files->isEmpty() ? 0 : $files->last()->unique_id;
+
+    // Count new unique id
+    $unique_id = $folders_unique > $files_unique ? $folders_unique + 1 : $files_unique + 1;
+
+    return $unique_id;
+}
 
 /**
  * Store user avatar to storage
@@ -20,16 +134,19 @@ function store_avatar($image, $path)
     $path = check_directory($path);
 
     // Store avatar
-    $image_path = $path . '/' . Str::random(8) . '-' . $image->getClientOriginalName();
+    $image_path = Str::random(8) . '-' . $image->getClientOriginalName();
 
     // Create intervention image
     $img = Image::make($image->getRealPath());
 
     // Generate thumbnail
-    $img->fit('150', '150')->save(storage_path() . "/app/" . $image_path, 90);
+    $img->fit('150', '150')->stream();
+
+    // Store thumbnail to disk
+    Storage::put($path . '/' . $image_path, $img);
 
     // Return path to image
-    return $image_path;
+    return $path . '/' . $image_path;
 }
 
 /**
@@ -71,9 +188,9 @@ function make_single_input($request)
  * @param $gigabytes
  * @return string
  */
-function format_gigabytes($megabytes)
+function format_gigabytes($gigabytes)
 {
-    return Metric::megabytes($megabytes)->format();
+    return Metric::gigabytes($gigabytes)->format();
 }
 
 /**
@@ -86,7 +203,7 @@ function format_gigabytes($megabytes)
 function get_storage_fill_percentage($used, $capacity)
 {
     // Format gigabytes to bytes
-    $total = intval(Metric::megabytes($capacity)->numberOfBytes());
+    $total = intval(Metric::gigabytes($capacity)->numberOfBytes());
 
     // Count progress
     $progress = ($used * 100) / $total;
@@ -102,10 +219,9 @@ function get_storage_fill_percentage($used, $capacity)
  */
 function user_storage_percentage()
 {
+    $user = Auth::user();
 
-    $user = \Illuminate\Support\Facades\Auth::user();
-
-    return get_storage_fill_percentage($user->used_capacity, config('vuefilemanager.user_storage_capacity'));
+    return get_storage_fill_percentage($user->used_capacity, $user->settings->storage_capacity);
 }
 
 /**
@@ -153,9 +269,9 @@ function appeared_once($arr)
  * @param $folders
  * @return array
  */
-function filter_folders_ids($folders)
+function filter_folders_ids($folders, $by_column = 'unique_id')
 {
-    $folder_unique_ids = recursiveFind($folders->toArray(), 'unique_id');
+    $folder_unique_ids = recursiveFind($folders->toArray(), $by_column);
 
     return appeared_once($folder_unique_ids);
 }

app/Notifications/ResetPassword.php

@@ -43,10 +43,12 @@ class ResetPassword extends Notification
         $reset_url = url('/create-new-password?token=' . $this->token);
 
         return (new MailMessage)
-            ->subject('Reset password for your account on ' . config('vuefilemanager.app_name'))
-            ->line('You are receiving this email because we received a password reset request for your account.')
-            ->action('Reset Password', $reset_url)
-            ->line('If you did not request a password reset, no further action is required.');
+            ->subject(__('vuefilemanager.reset_password_subject') . config('vuefilemanager.app_name'))
+            ->greeting(__('vuefilemanager.reset_password_greeting'))
+            ->line(__('vuefilemanager.reset_password_line_1'))
+            ->action(__('vuefilemanager.reset_password_action'), $reset_url)
+            ->line(__('vuefilemanager.reset_password_line_2'))
+            ->salutation(__('vuefilemanager.salutation') . ', ' . config('vuefilemanager.app_name'));
     }
 
     /**

app/Providers/AuthServiceProvider.php

@@ -26,6 +26,23 @@ class AuthServiceProvider extends ServiceProvider
     {
         $this->registerPolicies();
 
+        // Define admin settings gate
+        Gate::define('admin-settings', function ($user) {
+            return $user->role === 'admin';
+        });
+
         Passport::routes();
+
+        Passport::tokensCan([
+            'master'  => 'Master',
+            'editor'  => 'Editor',
+            'visitor' => 'Visitor',
+        ]);
+
+        Passport::setDefaultScope([
+            'master',
+            'editor',
+            'visitor',
+        ]);
     }
 }

app/Share.php

@@ -0,0 +1,51 @@
+<?php
+
+namespace App;
+
+use Illuminate\Database\Eloquent\Model;
+
+/**
+ * App\Share
+ *
+ * @property int $id
+ * @property int $user_id
+ * @property string $token
+ * @property int $item_id
+ * @property string $type
+ * @property string|null $permission
+ * @property int $protected
+ * @property string|null $password
+ * @property \Illuminate\Support\Carbon|null $created_at
+ * @property \Illuminate\Support\Carbon|null $updated_at
+ * @property-read string $link
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share newModelQuery()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share newQuery()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share query()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share whereCreatedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share whereId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share whereItemId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share wherePassword($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share wherePermission($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share whereProtected($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share whereToken($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share whereType($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share whereUpdatedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\Share whereUserId($value)
+ * @mixin \Eloquent
+ */
+class Share extends Model
+{
+    protected $guarded = ['id'];
+
+    protected $appends = ['link'];
+
+    /**
+     * Generate share link
+     *
+     * @return string
+     */
+    public function getLinkAttribute() {
+
+        return url('/shared', ['token' => $this->attributes['token']]);
+    }
+}

app/User.php

@@ -12,6 +12,47 @@ use Illuminate\Support\Facades\Hash;
 use Illuminate\Support\Facades\Notification;
 use Laravel\Passport\HasApiTokens;
 
+/**
+ * App\User
+ *
+ * @property int $id
+ * @property string $name
+ * @property string $email
+ * @property \Illuminate\Support\Carbon|null $email_verified_at
+ * @property string $password
+ * @property \Illuminate\Contracts\Routing\UrlGenerator|string $avatar
+ * @property string|null $remember_token
+ * @property \Illuminate\Support\Carbon|null $created_at
+ * @property \Illuminate\Support\Carbon|null $updated_at
+ * @property-read \Illuminate\Database\Eloquent\Collection|\Laravel\Passport\Client[] $clients
+ * @property-read int|null $clients_count
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFolder[] $favourites
+ * @property-read int|null $favourites_count
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFile[] $files
+ * @property-read int|null $files_count
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFile[] $files_with_trashed
+ * @property-read int|null $files_with_trashed_count
+ * @property-read mixed $used_capacity
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\FileManagerFile[] $latest_uploads
+ * @property-read int|null $latest_uploads_count
+ * @property-read \Illuminate\Notifications\DatabaseNotificationCollection|\Illuminate\Notifications\DatabaseNotification[] $notifications
+ * @property-read int|null $notifications_count
+ * @property-read \Illuminate\Database\Eloquent\Collection|\Laravel\Passport\Token[] $tokens
+ * @property-read int|null $tokens_count
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User newModelQuery()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User newQuery()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User query()
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User whereAvatar($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User whereCreatedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User whereEmail($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User whereEmailVerifiedAt($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User whereId($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User whereName($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User wherePassword($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User whereRememberToken($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|\App\User whereUpdatedAt($value)
+ * @mixin \Eloquent
+ */
 class User extends Authenticatable
 {
     use HasApiTokens, Notifiable;
@@ -22,7 +63,7 @@ class User extends Authenticatable
      * @var array
      */
     protected $fillable = [
-        'name', 'email', 'password', 'avatar',
+        'name', 'email', 'password', 'avatar', 'role',
     ];
 
     /**
@@ -45,9 +86,23 @@ class User extends Authenticatable
     ];
 
     protected $appends = [
-        'used_capacity'
+        'used_capacity', 'storage'
     ];
 
+    /**
+     * Get user used storage details
+     *
+     * @return mixed
+     */
+    public function getStorageAttribute() {
+
+        return [
+            'used' => (float) get_storage_fill_percentage($this->used_capacity, $this->settings->storage_capacity),
+            'capacity' => $this->settings->storage_capacity,
+            'capacity_formatted' => Metric::gigabytes($this->settings->storage_capacity)->format(),
+        ];
+    }
+
     /**
      * Get user used storage capacity in bytes
      *
@@ -94,7 +149,7 @@ class User extends Authenticatable
      */
     public function favourites()
     {
-        return $this->belongsToMany(FileManagerFolder::class, 'favourite_folder', 'user_id', 'folder_unique_id', 'id', 'unique_id')->select(['unique_id', 'name', 'type']);
+        return $this->belongsToMany(FileManagerFolder::class, 'favourite_folder', 'user_id', 'folder_unique_id', 'id', 'unique_id')->with('shared:token,id,item_id,permission,protected');
     }
 
     /**
@@ -104,7 +159,7 @@ class User extends Authenticatable
      */
     public function latest_uploads() {
 
-        return $this->hasMany(FileManagerFile::class)->orderBy('created_at', 'DESC')->take(7);
+        return $this->hasMany(FileManagerFile::class)->with(['parent'])->orderBy('created_at', 'DESC')->take(40);
     }
 
     /**
@@ -126,4 +181,14 @@ class User extends Authenticatable
 
         return $this->hasMany(FileManagerFile::class)->withTrashed();
     }
+
+    /**
+     * Get user attributes
+     *
+     * @return \Illuminate\Database\Eloquent\Relations\HasOne
+     */
+    public function settings() {
+
+        return $this->hasOne(UserSettings::class);
+    }
 }

app/UserSettings.php

@@ -0,0 +1,12 @@
+<?php
+
+namespace App;
+
+use Illuminate\Database\Eloquent\Model;
+
+class UserSettings extends Model
+{
+    public $timestamps = false;
+
+    protected $guarded = ['id'];
+}

composer.json

@@ -9,7 +9,6 @@
     "license": "MIT",
     "require": {
         "php": "^7.2",
-        "askedio/laravel-soft-cascade": "^6.0",
         "doctrine/dbal": "^2.10",
         "fideloper/proxy": "^4.0",
         "fruitcake/laravel-cors": "^1.0",
@@ -19,9 +18,12 @@
         "laravel/passport": "^8.4",
         "laravel/scout": "^7.2",
         "laravel/tinker": "^2.0",
+        "league/flysystem-aws-s3-v3": "^1.0",
+        "league/flysystem-cached-adapter": "^1.0",
         "teamtnt/laravel-scout-tntsearch-driver": "^7.2"
     },
     "require-dev": {
+        "barryvdh/laravel-ide-helper": "^2.7",
         "facade/ignition": "^1.4",
         "fzaninotto/faker": "^1.4",
         "mockery/mockery": "^1.0",

config/app.php

@@ -233,6 +233,9 @@ return [
 
     ],
 
+    'deploy_secret' => env('APP_DEPLOY_SECRET'),
+    'deploy_branch' => env('APP_DEPLOY_BRANCH'),
+
     'debug_blacklist' => [
         '_ENV' => [
             'APP_KEY',

config/filesystems.php

@@ -64,6 +64,15 @@ return [
             'url' => env('AWS_URL'),
         ],
 
+        'spaces' => [
+            'driver' => 's3',
+            'key' => env('DO_SPACES_KEY'),
+            'secret' => env('DO_SPACES_SECRET'),
+            'endpoint' => env('DO_SPACES_ENDPOINT'),
+            'region' => env('DO_SPACES_REGION'),
+            'bucket' => env('DO_SPACES_BUCKET'),
+        ],
+
     ],
 
 ];

config/vuefilemanager.php

@@ -2,6 +2,8 @@
 
 return [
 
+    'version' => '1.6',
+
     // Your app name
     'app_name' => 'VueFileManager',
 
@@ -13,7 +15,4 @@ return [
 
     // Limit your storage size for every user if this option is enabled
     'limit_storage_by_capacity' => true,
-
-    // Define user storage capacity in MB. E.g. value 2000 is 2.00GB
-    'user_storage_capacity' => 5000,
 ];

database/migrations/2020_04_20_071047_create_shares_table.php

@@ -0,0 +1,38 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class CreateSharesTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::create('shares', function (Blueprint $table) {
+            $table->bigIncrements('id');
+            $table->bigInteger('user_id');
+            $table->string('token', 16)->unique();
+            $table->bigInteger('item_id');
+            $table->enum('type', ['file', 'files', 'folder']);
+            $table->enum('permission', ['visitor', 'editor'])->nullable();
+            $table->boolean('protected');
+            $table->string('password')->nullable();
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::dropIfExists('shares');
+    }
+}

database/migrations/2020_04_24_055817_add_user_scope_to_file_manager_files_table.php

@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class AddUserScopeToFileManagerFilesTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('file_manager_files', function (Blueprint $table) {
+            $table->string('user_scope')->after('type')->default('master');
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('file_manager_files', function (Blueprint $table) {
+            //
+        });
+    }
+}

database/migrations/2020_04_24_080943_add_user_scope_to_file_manager_folders_table.php

@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class AddUserScopeToFileManagerFoldersTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('file_manager_folders', function (Blueprint $table) {
+            $table->string('user_scope')->after('type')->default('master');
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('file_manager_folders', function (Blueprint $table) {
+            //
+        });
+    }
+}

database/migrations/2020_05_26_062714_add_role_to_users_table.php

@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class AddRoleToUsersTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('users', function (Blueprint $table) {
+            $table->enum('role', ['admin', 'user'])->default('user')->after('id');
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('users', function (Blueprint $table) {
+            //
+        });
+    }
+}

database/migrations/2020_05_26_092649_create_user_settings_table.php

@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class CreateUserSettingsTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::create('user_settings', function (Blueprint $table) {
+            $table->bigIncrements('id');
+            $table->integer('user_id');
+            $table->integer('storage_capacity')->default(5);
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::dropIfExists('user_attributes');
+    }
+}

database/vue-file-manager-127.0.0.103-04-2020

@@ -1,273 +0,0 @@
-# ************************************************************
-# Sequel Pro SQL dump
-# Version 4541
-#
-# http://www.sequelpro.com/
-# https://github.com/sequelpro/sequelpro
-#
-# Host: 127.0.0.1 (MySQL 5.7.25)
-# Database: file-manager
-# Generation Time: 2020-04-03 07:57:39 +0000
-# ************************************************************
-
-
-/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
-/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
-/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
-/*!40101 SET NAMES utf8 */;
-/*!40014 SET @OLD_FOREIGN_KEY_CHECKS=@@FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS=0 */;
-/*!40101 SET @OLD_SQL_MODE=@@SQL_MODE, SQL_MODE='NO_AUTO_VALUE_ON_ZERO' */;
-/*!40111 SET @OLD_SQL_NOTES=@@SQL_NOTES, SQL_NOTES=0 */;
-
-
-# Dump of table failed_jobs
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `failed_jobs`;
-
-CREATE TABLE `failed_jobs` (
-  `id` bigint(20) unsigned NOT NULL AUTO_INCREMENT,
-  `connection` text COLLATE utf8mb4_unicode_ci NOT NULL,
-  `queue` text COLLATE utf8mb4_unicode_ci NOT NULL,
-  `payload` longtext COLLATE utf8mb4_unicode_ci NOT NULL,
-  `exception` longtext COLLATE utf8mb4_unicode_ci NOT NULL,
-  `failed_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
-  PRIMARY KEY (`id`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-# Dump of table favourite_folder
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `favourite_folder`;
-
-CREATE TABLE `favourite_folder` (
-  `user_id` bigint(20) NOT NULL,
-  `folder_unique_id` bigint(20) NOT NULL
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-# Dump of table file_manager_files
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `file_manager_files`;
-
-CREATE TABLE `file_manager_files` (
-  `id` bigint(20) unsigned NOT NULL AUTO_INCREMENT,
-  `user_id` bigint(20) DEFAULT NULL,
-  `unique_id` int(11) NOT NULL,
-  `folder_id` int(11) NOT NULL DEFAULT '0',
-  `thumbnail` text COLLATE utf8mb4_unicode_ci,
-  `name` text COLLATE utf8mb4_unicode_ci,
-  `basename` text COLLATE utf8mb4_unicode_ci,
-  `mimetype` text COLLATE utf8mb4_unicode_ci,
-  `filesize` text COLLATE utf8mb4_unicode_ci,
-  `type` text COLLATE utf8mb4_unicode_ci,
-  `deleted_at` timestamp NULL DEFAULT NULL,
-  `created_at` timestamp NULL DEFAULT NULL,
-  `updated_at` timestamp NULL DEFAULT NULL,
-  PRIMARY KEY (`id`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-# Dump of table file_manager_folders
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `file_manager_folders`;
-
-CREATE TABLE `file_manager_folders` (
-  `id` bigint(20) unsigned NOT NULL AUTO_INCREMENT,
-  `user_id` bigint(20) DEFAULT NULL,
-  `unique_id` int(11) NOT NULL,
-  `parent_id` int(11) NOT NULL DEFAULT '0',
-  `name` text COLLATE utf8mb4_unicode_ci,
-  `type` text COLLATE utf8mb4_unicode_ci,
-  `deleted_at` timestamp NULL DEFAULT NULL,
-  `created_at` timestamp NULL DEFAULT NULL,
-  `updated_at` timestamp NULL DEFAULT NULL,
-  PRIMARY KEY (`id`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-# Dump of table migrations
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `migrations`;
-
-CREATE TABLE `migrations` (
-  `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
-  `migration` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `batch` int(11) NOT NULL,
-  PRIMARY KEY (`id`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-LOCK TABLES `migrations` WRITE;
-/*!40000 ALTER TABLE `migrations` DISABLE KEYS */;
-
-INSERT INTO `migrations` (`id`, `migration`, `batch`)
-VALUES
-	(1,'2014_10_12_000000_create_users_table',1),
-	(2,'2014_10_12_100000_create_password_resets_table',1),
-	(3,'2016_06_01_000001_create_oauth_auth_codes_table',1),
-	(4,'2016_06_01_000002_create_oauth_access_tokens_table',1),
-	(5,'2016_06_01_000003_create_oauth_refresh_tokens_table',1),
-	(6,'2016_06_01_000004_create_oauth_clients_table',1),
-	(7,'2016_06_01_000005_create_oauth_personal_access_clients_table',1),
-	(8,'2019_08_15_171328_create_file_manager_folders',1),
-	(9,'2019_08_15_171345_create_file_manager_files',1),
-	(10,'2019_08_19_000000_create_failed_jobs_table',1),
-	(11,'2020_03_03_065147_add_user_id_to_file_manager_files_table',2),
-	(12,'2020_03_03_065155_add_user_id_to_file_manager_folders_table',2),
-	(13,'2020_03_03_070319_create_favourites_folders_table',3),
-	(14,'2020_04_02_055021_change_type_attribute_in_file_manager_files_table',4);
-
-/*!40000 ALTER TABLE `migrations` ENABLE KEYS */;
-UNLOCK TABLES;
-
-
-# Dump of table oauth_access_tokens
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `oauth_access_tokens`;
-
-CREATE TABLE `oauth_access_tokens` (
-  `id` varchar(100) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `user_id` bigint(20) unsigned DEFAULT NULL,
-  `client_id` bigint(20) unsigned NOT NULL,
-  `name` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL,
-  `scopes` text COLLATE utf8mb4_unicode_ci,
-  `revoked` tinyint(1) NOT NULL,
-  `created_at` timestamp NULL DEFAULT NULL,
-  `updated_at` timestamp NULL DEFAULT NULL,
-  `expires_at` datetime DEFAULT NULL,
-  PRIMARY KEY (`id`),
-  KEY `oauth_access_tokens_user_id_index` (`user_id`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-# Dump of table oauth_auth_codes
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `oauth_auth_codes`;
-
-CREATE TABLE `oauth_auth_codes` (
-  `id` varchar(100) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `user_id` bigint(20) unsigned NOT NULL,
-  `client_id` bigint(20) unsigned NOT NULL,
-  `scopes` text COLLATE utf8mb4_unicode_ci,
-  `revoked` tinyint(1) NOT NULL,
-  `expires_at` datetime DEFAULT NULL,
-  PRIMARY KEY (`id`),
-  KEY `oauth_auth_codes_user_id_index` (`user_id`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-# Dump of table oauth_clients
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `oauth_clients`;
-
-CREATE TABLE `oauth_clients` (
-  `id` bigint(20) unsigned NOT NULL AUTO_INCREMENT,
-  `user_id` bigint(20) unsigned DEFAULT NULL,
-  `name` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `secret` varchar(100) COLLATE utf8mb4_unicode_ci DEFAULT NULL,
-  `redirect` text COLLATE utf8mb4_unicode_ci NOT NULL,
-  `personal_access_client` tinyint(1) NOT NULL,
-  `password_client` tinyint(1) NOT NULL,
-  `revoked` tinyint(1) NOT NULL,
-  `created_at` timestamp NULL DEFAULT NULL,
-  `updated_at` timestamp NULL DEFAULT NULL,
-  PRIMARY KEY (`id`),
-  KEY `oauth_clients_user_id_index` (`user_id`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-LOCK TABLES `oauth_clients` WRITE;
-/*!40000 ALTER TABLE `oauth_clients` DISABLE KEYS */;
-
-INSERT INTO `oauth_clients` (`id`, `user_id`, `name`, `secret`, `redirect`, `personal_access_client`, `password_client`, `revoked`, `created_at`, `updated_at`)
-VALUES
-	(1,1,'vue-filemanager-auth','oULKgESrN8egvBWW0DGNW3aE8yaHWISUODq3ZDRn','/',0,1,0,'2020-03-01 07:49:48','2020-03-01 07:49:48');
-
-/*!40000 ALTER TABLE `oauth_clients` ENABLE KEYS */;
-UNLOCK TABLES;
-
-
-# Dump of table oauth_personal_access_clients
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `oauth_personal_access_clients`;
-
-CREATE TABLE `oauth_personal_access_clients` (
-  `id` bigint(20) unsigned NOT NULL AUTO_INCREMENT,
-  `client_id` bigint(20) unsigned NOT NULL,
-  `created_at` timestamp NULL DEFAULT NULL,
-  `updated_at` timestamp NULL DEFAULT NULL,
-  PRIMARY KEY (`id`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-# Dump of table oauth_refresh_tokens
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `oauth_refresh_tokens`;
-
-CREATE TABLE `oauth_refresh_tokens` (
-  `id` varchar(100) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `access_token_id` varchar(100) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `revoked` tinyint(1) NOT NULL,
-  `expires_at` datetime DEFAULT NULL,
-  PRIMARY KEY (`id`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-# Dump of table password_resets
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `password_resets`;
-
-CREATE TABLE `password_resets` (
-  `email` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `token` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `created_at` timestamp NULL DEFAULT NULL,
-  KEY `password_resets_email_index` (`email`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-# Dump of table users
-# ------------------------------------------------------------
-
-DROP TABLE IF EXISTS `users`;
-
-CREATE TABLE `users` (
-  `id` bigint(20) unsigned NOT NULL AUTO_INCREMENT,
-  `name` varchar(191) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `email` varchar(191) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `email_verified_at` timestamp NULL DEFAULT NULL,
-  `password` varchar(191) COLLATE utf8mb4_unicode_ci NOT NULL,
-  `avatar` varchar(191) COLLATE utf8mb4_unicode_ci DEFAULT NULL,
-  `remember_token` varchar(100) COLLATE utf8mb4_unicode_ci DEFAULT NULL,
-  `created_at` timestamp NULL DEFAULT NULL,
-  `updated_at` timestamp NULL DEFAULT NULL,
-  PRIMARY KEY (`id`),
-  UNIQUE KEY `users_email_unique` (`email`)
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
-
-
-
-
-/*!40111 SET SQL_NOTES=@OLD_SQL_NOTES */;
-/*!40101 SET SQL_MODE=@OLD_SQL_MODE */;
-/*!40014 SET FOREIGN_KEY_CHECKS=@OLD_FOREIGN_KEY_CHECKS */;
-/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
-/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
-/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

package-lock.json

@@ -1671,6 +1671,11 @@
                 }
             }
         },
+        "babel-helper-vue-jsx-merge-props": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-2.0.3.tgz",
+            "integrity": "sha512-gsLiKK7Qrb7zYJNgiXKpXblxbV5ffSwR0f5whkPAaBAR4fhi6bwRZxX9wBlIc5M/v8CCkXUbXZL4N/nSE97cqg=="
+        },
         "babel-loader": {
             "version": "8.1.0",
             "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-8.1.0.tgz",
@@ -2755,11 +2760,6 @@
                 "timsort": "^0.3.0"
             }
         },
-        "css-element-queries": {
-            "version": "1.2.3",
-            "resolved": "https://registry.npmjs.org/css-element-queries/-/css-element-queries-1.2.3.tgz",
-            "integrity": "sha512-QK9uovYmKTsV2GXWQiMOByVNrLn2qz6m3P7vWpOR4IdD6I3iXoDw5qtgJEN3Xq7gIbdHVKvzHjdAtcl+4Arc4Q=="
-        },
         "css-loader": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-1.0.1.tgz",
@@ -5328,9 +5328,9 @@
             "dev": true
         },
         "in-publish": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
-            "integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E="
+            "version": "2.0.1",
+            "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.1.tgz",
+            "integrity": "sha512-oDM0kUSNFC31ShNxHKUyfZKy8ZeXZBWMjMdZHKLOk13uvT27VTL/QzRGfRUcevJhpkZAvlhPYuXkF7eNWrtyxQ=="
         },
         "indent-string": {
             "version": "4.0.0",
@@ -6645,9 +6645,9 @@
             "dev": true
         },
         "node-sass": {
-            "version": "4.13.1",
-            "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.13.1.tgz",
-            "integrity": "sha512-TTWFx+ZhyDx1Biiez2nB0L3YrCZ/8oHagaDalbuBSlqXgUPsdkUSzJsVxeDO9LtPB49+Fh3WQl3slABo6AotNw==",
+            "version": "4.14.0",
+            "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.14.0.tgz",
+            "integrity": "sha512-AxqU+DFpk0lEz95sI6jO0hU0Rwyw7BXVEv6o9OItoXLyeygPeaSpiV4rwQb10JiTghHaa0gZeD21sz+OsQluaw==",
             "requires": {
                 "async-foreach": "^0.1.3",
                 "chalk": "^1.1.1",
@@ -8051,9 +8051,9 @@
             "integrity": "sha1-8FKijacOYYkX7wqKw0wa5aaChrM="
         },
         "psl": {
-            "version": "1.7.0",
-            "resolved": "https://registry.npmjs.org/psl/-/psl-1.7.0.tgz",
-            "integrity": "sha512-5NsSEDv8zY70ScRnOTn7bK7eanl2MvFrOrS/R6x+dBt5g1ghnj9Zv90kO8GwT8gxcu2ANyFprnFYB85IogIJOQ=="
+            "version": "1.8.0",
+            "resolved": "https://registry.npmjs.org/psl/-/psl-1.8.0.tgz",
+            "integrity": "sha512-RIdOzyoavK+hA18OGGWDqUTsCLhtA7IcZ/6NCs4fFJaHBDab+pDDmDIByWFRQJq2Cd7r1OoQxBGKOaztq+hjIQ=="
         },
         "public-encrypt": {
             "version": "4.0.3",
@@ -9316,9 +9316,9 @@
             }
         },
         "spdx-exceptions": {
-            "version": "2.2.0",
-            "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.2.0.tgz",
-            "integrity": "sha512-2XQACfElKi9SlVb1CYadKDXvoajPgBVPn/gOQLrTvHdElaVhr7ZEbqJaRnJLVNeaI4cMEAgVCeBMKF6MWRDCRA=="
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz",
+            "integrity": "sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A=="
         },
         "spdx-expression-parse": {
             "version": "3.0.0",
@@ -10328,9 +10328,9 @@
             "dev": true
         },
         "vee-validate": {
-            "version": "3.2.5",
-            "resolved": "https://registry.npmjs.org/vee-validate/-/vee-validate-3.2.5.tgz",
-            "integrity": "sha512-qUgx4fcD077aNYuaRmK5qZ6G/qRHI0igC5tvGP1IRtvkScOyhCHuZwCcto4VPy5Cip0yAOqrbFudD9JOevwZhw=="
+            "version": "3.3.0",
+            "resolved": "https://registry.npmjs.org/vee-validate/-/vee-validate-3.3.0.tgz",
+            "integrity": "sha512-+QQZgA0I9ZTDsYNOSFlUqOvGIqW4yxjloxQCC6TD0rPn407G9hifn6RnId8kzl6+zHfl3/dE+bko49mYzgNNGg=="
         },
         "vendors": {
             "version": "1.0.4",
@@ -10359,6 +10359,14 @@
             "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.11.tgz",
             "integrity": "sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ=="
         },
+        "vue-feather-icons": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/vue-feather-icons/-/vue-feather-icons-5.0.0.tgz",
+            "integrity": "sha512-uvi2l3i0aeRRzG3vX24/AH+8BkcXkSJboAv8XkUZ6aPkEC9n6LXDcKp5/ho+3moVQ9wlga3N6BjL89pmkHBzPw==",
+            "requires": {
+                "babel-helper-vue-jsx-merge-props": "^2.0.2"
+            }
+        },
         "vue-hot-reload-api": {
             "version": "2.3.4",
             "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
@@ -10366,9 +10374,9 @@
             "dev": true
         },
         "vue-i18n": {
-            "version": "8.16.0",
-            "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.16.0.tgz",
-            "integrity": "sha512-cp9JOsx4ETzlCsnD22FE8ZhAmD8kcyNLRKV0DPsS7bBNTCdIlOKuyTGonWKYcGCUtNMtwemDWRBevRm8eevBVg=="
+            "version": "8.17.4",
+            "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.17.4.tgz",
+            "integrity": "sha512-wpk/drIkPf6gHCtvHc8zAZ1nsWBZ+/OOJYtJxqhYD6CKT0FJAG5oypwgF9kABt30FBWhl8NEb/QY+vaaBARlFg=="
         },
         "vue-loader": {
             "version": "15.9.1",
@@ -10383,6 +10391,11 @@
                 "vue-style-loader": "^4.1.0"
             }
         },
+        "vue-router": {
+            "version": "3.1.6",
+            "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.1.6.tgz",
+            "integrity": "sha512-GYhn2ynaZlysZMkFE5oCHRUTqE8BWs/a9YbKpNLi0i7xD6KG1EzDqpHQmv1F5gXjr8kL5iIVS8EOtRaVUEXTqA=="
+        },
         "vue-style-loader": {
             "version": "4.1.2",
             "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz",
@@ -10410,9 +10423,9 @@
             "dev": true
         },
         "vuex": {
-            "version": "3.1.3",
-            "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.3.tgz",
-            "integrity": "sha512-k8vZqNMSNMgKelVZAPYw5MNb2xWSmVgCKtYKAptvm9YtZiOXnRXFWu//Y9zQNORTrm3dNj1n/WaZZI26tIX6Mw=="
+            "version": "3.3.0",
+            "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.3.0.tgz",
+            "integrity": "sha512-1MfcBt+YFd20DPwKe0ThhYm1UEXZya4gVKUvCy7AtS11YAOUR+9a6u4fsv1Rr6ePZCDNxW/M1zuIaswp6nNv8Q=="
         },
         "watchpack": {
             "version": "1.6.1",

package.json

@@ -21,12 +21,13 @@
         "@fortawesome/fontawesome-svg-core": "^1.2.28",
         "@fortawesome/free-solid-svg-icons": "^5.13.0",
         "@fortawesome/vue-fontawesome": "^0.1.9",
-        "css-element-queries": "^1.2.3",
         "lodash": "^4.17.15",
-        "node-sass": "^4.13.1",
-        "vee-validate": "^3.2.5",
+        "node-sass": "^4.14.0",
+        "vee-validate": "^3.3.0",
         "vue": "^2.6.10",
-        "vue-i18n": "^8.16.0",
-        "vuex": "^3.0.1"
+        "vue-feather-icons": "^5.0.0",
+        "vue-i18n": "^8.17.4",
+        "vue-router": "^3.1.6",
+        "vuex": "^3.3.0"
     }
 }

public/js/main.js.LICENSE.txt

@@ -4,8 +4,14 @@
  * Released under the MIT License.
  */
 
+/*!
+ * vue-i18n v8.17.4 
+ * (c) 2020 kazuya kawaguchi
+ * Released under the MIT License.
+ */
+
 /**
-  * vee-validate v3.2.5
+  * vee-validate v3.3.0
   * (c) 2020 Abdelrahman Awad
   * @license MIT
   */
@@ -20,7 +26,7 @@
  */
 
 /**
- * vuex v3.1.3
+ * vuex v3.3.0
  * (c) 2020 Evan You
  * @license MIT
  */

resources/js/App.vue

@@ -1,25 +1,160 @@
 <template>
-    <div id="app">
-        <VueFileManager style="height: 100%; width: 100%"/>
+    <div id="vue-file-manager" v-cloak>
+
+        <!--System alerts-->
+        <Alert/>
+
+        <div id="application-wrapper" v-if="layout === 'authorized'">
+
+            <MobileNavigation />
+
+            <!--Share Item setup-->
+            <ShareCreate/>
+            <ShareEdit/>
+
+            <!--Move item setup-->
+            <MoveItem/>
+
+            <!--Mobile Menu-->
+            <MobileMenu/>
+
+            <!--Navigation Sidebar-->
+            <MenuBar/>
+
+            <!--Toastr-->
+            <ToastrWrapper/>
+
+            <!--File page-->
+            <keep-alive :include="['Admin', 'Users']">
+                <router-view :class="{'is-scaled-down': isScaledDown}"/>
+            </keep-alive>
+        </div>
+
+        <router-view v-if="layout === 'unauthorized'"/>
+
+        <!--Background vignette-->
+        <Vignette/>
     </div>
 </template>
 
 <script>
-    import VueFileManager from './components/VueFileManager.vue'
+    import ToastrWrapper from '@/components/Others/Notifications/ToastrWrapper'
+    import MobileNavigation from '@/components/Others/MobileNavigation'
+    import MobileMenu from '@/components/FilesView/MobileMenu'
+    import ShareCreate from '@/components/Others/ShareCreate'
+    import ShareEdit from '@/components/Others/ShareEdit'
+    import MoveItem from '@/components/Others/MoveItem'
+    import Vignette from '@/components/Others/Vignette'
+    import MenuBar from '@/components/Sidebar/MenuBar'
+    import Alert from '@/components/FilesView/Alert'
+    import {includes} from 'lodash'
+    import {mapGetters} from 'vuex'
+    import {events} from "./bus"
 
     export default {
         name: 'app',
         components: {
-            VueFileManager
+            MobileNavigation,
+            ToastrWrapper,
+            ShareCreate,
+            MobileMenu,
+            ShareEdit,
+            MoveItem,
+            Vignette,
+            MenuBar,
+            Alert,
         },
+        computed: {
+            ...mapGetters([
+                'isLogged', 'isGuest'
+            ]),
+            layout() {
+                if (includes(['VerifyByPassword', 'SharedPage', 'NotFoundShared', 'SignIn', 'SignUp', 'ForgottenPassword', 'CreateNewPassword'], this.$route.name)) {
+                    return 'unauthorized'
+                }
+
+                return 'authorized'
+            }
+        },
+        data() {
+            return {
+                isScaledDown: false,
+            }
+        },
+        beforeMount() {
+
+            // Store config to vuex
+            this.$store.commit('INIT', {
+                authCookie: this.$root.$data.config.hasAuthCookie,
+                config: this.$root.$data.config,
+                rootDirectory: {
+                    name: this.$t('locations.home'),
+                    location: 'base',
+                    unique_id: 0,
+                }
+            })
+        },
+        mounted() {
+            // Handle mobile navigation scale animation
+            events.$on('show:mobile-navigation', () => this.isScaledDown = true)
+            events.$on('hide:mobile-navigation', () => this.isScaledDown = false)
+            events.$on('mobileMenu:show', () => this.isScaledDown = true)
+            events.$on('fileItem:deselect', () => this.isScaledDown = false)
+        }
     }
 </script>
 
 <style lang="scss">
+    @import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;600;700;900&display=swap');
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
-    #app {
-        height: 100%;
+    [v-cloak],
+    [v-cloak] > * {
+        display: none
+    }
+
+    * {
+        outline: 0;
+        margin: 0;
+        padding: 0;
+        font-family: 'Nunito', sans-serif;
+        -webkit-font-smoothing: antialiased;
+        -moz-osx-font-smoothing: grayscale;
+        box-sizing: border-box;
+        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+        font-size: 16px;
+    }
+
+    #auth {
         width: 100%;
+        height: 100%;
+    }
+
+    #vue-file-manager {
         position: absolute;
+        width: 100%;
+        height: 100%;
+        overflow-y: auto;
+    }
+
+    @media only screen and (max-width: 690px) {
+
+        .is-scaled-down {
+            @include transform(scale(0.95));
+        }
+    }
+
+    // Dark mode support
+    @media (prefers-color-scheme: dark) {
+
+        body, html {
+            background: $dark_mode_background;
+            color: $dark_mode_text_primary;
+
+            img {
+                opacity: .95;
+            }
+        }
     }
 </style>

resources/js/components/Auth/AuthButton.vue

@@ -28,7 +28,8 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .button {
         cursor: pointer;

resources/js/components/Auth/AuthContent.vue

@@ -19,8 +19,3 @@
         }
     }
 </script>
-
-<style scoped lang="scss">
-
-
-</style>

resources/js/components/Auth/AuthContentWrapper.vue

@@ -11,7 +11,6 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
 
     #auth {
         height: 100%;

resources/js/components/FilesView/Alert.vue

@@ -23,7 +23,7 @@
 </template>
 
 <script>
-    import ButtonBase from '@/components/VueFileManagerComponents/FilesView/ButtonBase'
+    import ButtonBase from '@/components/FilesView/ButtonBase'
     import {events} from '@/bus'
 
     export default {
@@ -56,7 +56,7 @@
 
                 this.button = this.$t('alerts.error_confirm')
                 this.emoji = '😢😢😢'
-                this.buttonStyle = 'danger'
+                this.buttonStyle = 'danger-solid'
 
                 if (args.emoji) {
                     this.emoji = args.emoji
@@ -88,7 +88,8 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .popup {
         position: absolute;
@@ -98,6 +99,7 @@
         bottom: 0;
         z-index: 20;
         overflow: auto;
+        height: 100%;
     }
 
     .popup-wrapper {
@@ -109,7 +111,7 @@
         top: 50%;
         transform: translateY(-50%) scale(1);
         margin: 0 auto;
-        padding: 40px;
+        padding: 20px;
         box-shadow: $light_mode_popup_shadow;
         border-radius: 8px;
         text-align: center;
@@ -135,7 +137,7 @@
 
         .message {
             @include font-size(16);
-            color: #8b8f9a;
+            color: #333;
             margin-top: 5px;
         }
     }

resources/js/components/FilesView/ButtonBase.vue

@@ -1,21 +1,25 @@
 <template>
     <button class="button-base" :class="buttonStyle" type="button">
-        <slot></slot>
+        <span v-if="loading" class="icon">
+			<FontAwesomeIcon icon="sync-alt" class="sync-alt"/>
+		</span>
+        <slot v-if="! loading"></slot>
     </button>
 </template>
 
 <script>
     export default {
         name: 'ButtonBase',
-        props: ['buttonStyle']
+        props: ['buttonStyle', 'loading']
     }
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .button-base {
-        @include font-size(16);
+        @include font-size(15);
         font-weight: 700;
         cursor: pointer;
         transition: 0.15s all ease;
@@ -23,6 +27,7 @@
         border: 0;
         padding: 10px 28px;
         display: inline-block;
+        white-space: nowrap;
 
         &:active {
             transform: scale(0.95);
@@ -38,12 +43,30 @@
             background: rgba($danger, .1);
         }
 
+        &.danger-solid {
+            color: white;
+            background: $danger;
+        }
+
         &.secondary {
             color: $text;
             background: $light_background;
         }
     }
 
+    .sync-alt {
+        animation: spin 1s linear infinite;
+    }
+
+    @keyframes spin {
+        0% {
+            transform: rotate(0);
+        }
+        100% {
+            transform: rotate(360deg);
+        }
+    }
+
     @media (prefers-color-scheme: dark) {
 
         .button-base {

resources/js/components/FilesView/ButtonUpload.vue

@@ -31,10 +31,11 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .button-base {
-        @include font-size(16);
+        @include font-size(15);
         font-weight: 700;
         cursor: pointer;
         transition: 0.15s all ease;

resources/js/components/FilesView/ContextMenu.vue

@@ -0,0 +1,515 @@
+<template>
+    <div
+            :style="{ top: positionY + 'px', left: positionX + 'px' }"
+            @click="closeAndResetContextMenu"
+            class="contextmenu"
+            v-show="isVisible"
+            ref="contextmenu"
+    >
+        <!--ContextMenu for trash location-->
+        <div v-if="$isThisLocation(['trash', 'trash-root']) && $checkPermission('master')" id="menu-list" class="menu-options">
+            <ul class="menu-option-group">
+                <li class="menu-option" @click="$store.dispatch('restoreItem', item)" v-if="item">
+                    <div class="icon">
+                        <life-buoy-icon size="17"></life-buoy-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.restore') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="deleteItem" v-if="item">
+                    <div class="icon">
+                        <trash-2-icon size="17"></trash-2-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.delete') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="$store.dispatch('emptyTrash')">
+                    <div class="icon">
+                        <trash-icon size="17"></trash-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.empty_trash') }}
+                    </div>
+                </li>
+            </ul>
+            <ul class="menu-option-group" v-if="item">
+                <li class="menu-option" @click="ItemDetail">
+                    <div class="icon">
+                        <eye-icon size="17"></eye-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.detail') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="downloadItem" v-if="! isFolder">
+                    <div class="icon">
+                        <download-cloud-icon size="17"></download-cloud-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.download') }}
+                    </div>
+                </li>
+            </ul>
+        </div>
+
+        <!--ContextMenu for Base location with MASTER permission-->
+        <div v-if="$isThisLocation(['shared']) && $checkPermission('master')" id="menu-list" class="menu-options">
+            <ul class="menu-option-group" v-if="item && isFolder">
+                <li class="menu-option" @click="addToFavourites">
+                    <div class="icon">
+                        <star-icon size="17"></star-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites') }}
+                    </div>
+                </li>
+            </ul>
+            <ul class="menu-option-group" v-if="item">
+                <li class="menu-option" @click="shareItem">
+                    <div class="icon">
+                        <link-icon size="17"></link-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ item.shared ? $t('context_menu.share_edit') : $t('context_menu.share') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="deleteItem">
+                    <div class="icon">
+                        <trash-2-icon size="17"></trash-2-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.delete') }}
+                    </div>
+                </li>
+            </ul>
+            <ul class="menu-option-group" v-if="item">
+                <li class="menu-option" @click="ItemDetail" v-if="item">
+                    <div class="icon">
+                        <eye-icon size="17"></eye-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.detail') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="downloadItem" v-if="! isFolder">
+                    <div class="icon">
+                        <download-cloud-icon size="17"></download-cloud-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.download') }}
+                    </div>
+                </li>
+            </ul>
+        </div>
+
+        <!--ContextMenu for Base location with MASTER permission-->
+        <div v-if="$isThisLocation(['base', 'participant_uploads', 'latest']) && $checkPermission('master')" id="menu-list" class="menu-options">
+
+            <ul class="menu-option-group" v-if="! $isThisLocation(['participant_uploads', 'latest'])">
+                <li class="menu-option" @click="addToFavourites" v-if="item && isFolder">
+                    <div class="icon">
+                        <star-icon size="17"></star-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="createFolder">
+                    <div class="icon">
+                        <folder-plus-icon size="17"></folder-plus-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.create_folder') }}
+                    </div>
+                </li>
+            </ul>
+            <ul class="menu-option-group" v-if="item">
+                <li class="menu-option" @click="moveItem">
+                    <div class="icon">
+                        <corner-down-right-icon size="17"></corner-down-right-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.move') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="shareItem">
+                    <div class="icon">
+                        <link-icon size="17"></link-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ item.shared ? $t('context_menu.share_edit') : $t('context_menu.share') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="deleteItem">
+                    <div class="icon">
+                        <trash-2-icon size="17"></trash-2-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.delete') }}
+                    </div>
+                </li>
+            </ul>
+            <ul class="menu-option-group" v-if="item">
+                <li class="menu-option" @click="ItemDetail">
+                    <div class="icon">
+                        <eye-icon size="17"></eye-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.detail') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="downloadItem" v-if="! isFolder">
+                    <div class="icon">
+                        <download-cloud-icon size="17"></download-cloud-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.download') }}
+                    </div>
+                </li>
+            </ul>
+        </div>
+
+        <!--ContextMenu for Base location with EDITOR permission-->
+        <div v-if="$isThisLocation(['base', 'public']) && $checkPermission('editor')" id="menu-list" class="menu-options">
+            <ul class="menu-option-group">
+                <li class="menu-option" @click="createFolder">
+                    <div class="icon">
+                        <folder-plus-icon size="17"></folder-plus-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.create_folder') }}
+                    </div>
+                </li>
+            </ul>
+            <ul class="menu-option-group" v-if="item">
+                <li class="menu-option" @click="moveItem">
+                    <div class="icon">
+                        <corner-down-right-icon size="17"></corner-down-right-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.move') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="deleteItem">
+                    <div class="icon">
+                        <trash-2-icon size="17"></trash-2-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.delete') }}
+                    </div>
+                </li>
+            </ul>
+            <ul class="menu-option-group" v-if="item">
+                <li class="menu-option" @click="ItemDetail">
+                    <div class="icon">
+                        <eye-icon size="17"></eye-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.detail') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="downloadItem" v-if="! isFolder">
+                    <div class="icon">
+                        <download-cloud-icon size="17"></download-cloud-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.download') }}
+                    </div>
+                </li>
+            </ul>
+        </div>
+
+        <!--ContextMenu for Base location with VISITOR permission-->
+        <div v-if="$isThisLocation(['base', 'public']) && $checkPermission('visitor')" id="menu-list" class="menu-options">
+            <ul class="menu-option-group" v-if="item">
+                <li class="menu-option" @click="ItemDetail">
+                    <div class="icon">
+                        <eye-icon size="17"></eye-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.detail') }}
+                    </div>
+                </li>
+                <li class="menu-option" @click="downloadItem" v-if="! isFolder">
+                    <div class="icon">
+                        <download-cloud-icon size="17"></download-cloud-icon>
+                    </div>
+                    <div class="text-label">
+                        {{ $t('context_menu.download') }}
+                    </div>
+                </li>
+            </ul>
+        </div>
+    </div>
+</template>
+
+<script>
+    import {
+        CornerDownRightIcon,
+        DownloadCloudIcon,
+        FolderPlusIcon,
+        LifeBuoyIcon,
+        Trash2Icon,
+        TrashIcon,
+        StarIcon,
+        LinkIcon,
+        EyeIcon,
+    } from 'vue-feather-icons'
+    import {mapGetters} from 'vuex'
+    import {events} from '@/bus'
+
+    export default {
+        name: 'ContextMenu',
+        components: {
+            CornerDownRightIcon,
+            DownloadCloudIcon,
+            FolderPlusIcon,
+            LifeBuoyIcon,
+            Trash2Icon,
+            TrashIcon,
+            LinkIcon,
+            StarIcon,
+            EyeIcon,
+        },
+        computed: {
+            ...mapGetters(['app']),
+            isFolder() {
+                return this.item && this.item.type === 'folder'
+            },
+            isFile() {
+                return (this.item && this.item.type !== 'folder') && (this.item && this.item.type !== 'image')
+            },
+            isImage() {
+                return this.item && this.item.type === 'image'
+            },
+            isInFavourites() {
+                return this.app.favourites.find(el => el.unique_id == this.item.unique_id)
+            },
+        },
+        data() {
+            return {
+                item: undefined,
+                isVisible: false,
+                positionX: 0,
+                positionY: 0
+            }
+        },
+        methods: {
+            moveItem() {
+                // Open move item popup
+                events.$emit('popup:open', {name: 'move', item: this.item})
+            },
+            shareItem() {
+                if (this.item.shared) {
+                    // Open share item popup
+                    events.$emit('popup:open', {name: 'share-edit', item: this.item})
+                } else {
+                    // Open share item popup
+                    events.$emit('popup:open', {name: 'share-create', item: this.item})
+                }
+            },
+            addToFavourites() {
+                // Check if folder is in favourites and then add/remove from favourites
+                if (this.app.favourites && !this.app.favourites.find(el => el.unique_id == this.item.unique_id)) {
+                    this.$store.dispatch('addToFavourites', this.item)
+                } else {
+                    this.$store.dispatch('removeFromFavourites', this.item)
+                }
+            },
+            downloadItem() {
+                // Download file
+                this.$downloadFile(
+                    this.item.file_url,
+                    this.item.name + '.' + this.item.mimetype
+                )
+            },
+            ItemDetail() {
+
+                // Dispatch load file info detail
+                this.$store.commit('GET_FILEINFO_DETAIL', this.item)
+
+                // Show panel if is not open
+                this.$store.dispatch('fileInfoToggle', true)
+            },
+            deleteItem() {
+                // Dispatch remove item
+                this.$store.dispatch('deleteItem', this.item)
+            },
+            createFolder() {
+                // Create folder
+                this.$createFolder(this.$t('popup_create_folder.folder_default_name'))
+            },
+            closeAndResetContextMenu() {
+                // Close context menu
+                this.isVisible = false
+
+                // Reset item container
+                this.item = undefined
+            },
+            showFolderActionsMenu() {
+                let container = document.getElementById('folder-actions')
+
+                this.positionX = container.offsetLeft + 16
+                this.positionY = container.offsetTop + 30
+
+                // Show context menu
+                this.isVisible = true
+            },
+            showContextMenu(event) {
+                let parent = document.getElementById('menu-list')
+                let nodesSameClass = parent.getElementsByClassName("menu-option")
+
+                let VerticalOffsetArea = nodesSameClass.length * 50
+                let HorizontalOffsetArea = 190
+
+                let container = document.getElementById('files-view')
+
+                var offset = container.getClientRects()[0];
+
+                let x = event.clientX - offset.left
+                let y = event.clientY - offset.top
+
+                // Set position Y
+                if ((container.offsetHeight - y) < VerticalOffsetArea) {
+                    this.positionY = y - VerticalOffsetArea
+                } else {
+                    this.positionY = y
+                }
+
+                // Set position X
+                if ((container.offsetWidth - x) < HorizontalOffsetArea) {
+                    this.positionX = x - HorizontalOffsetArea
+                } else {
+                    this.positionX = x
+                }
+
+                // Show context menu
+                this.isVisible = true
+            }
+        },
+        created() {
+            events.$on('contextMenu:show', (event, item) => {
+
+                // Store item
+                this.item = item
+
+                // Show context menu
+                setTimeout(() => this.showContextMenu(event, item), 10)
+            })
+
+            events.$on('contextMenu:hide', () => (this.closeAndResetContextMenu()))
+
+            events.$on('folder:actions', folder => {
+
+                // Store item
+                this.item = folder
+
+                if (this.isVisible)
+                    this.isVisible = false
+                else
+                    this.showFolderActionsMenu()
+
+            })
+        }
+    }
+</script>
+
+<style scoped lang="scss">
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
+
+    .menu-option {
+        display: flex;
+        align-items: center;
+
+        .icon {
+            margin-right: 20px;
+            line-height: 0;
+        }
+
+        .text-label {
+            @include font-size(16);
+        }
+    }
+
+    .contextmenu {
+        min-width: 250px;
+        position: absolute;
+        z-index: 99;
+        box-shadow: $shadow;
+        background: white;
+        border-radius: 8px;
+        overflow: hidden;
+
+        &.showed {
+            display: block;
+        }
+    }
+
+    .menu-options {
+        list-style: none;
+        width: 100%;
+        margin: 0;
+        padding: 0;
+
+        .menu-option-group {
+            padding: 5px 0;
+            border-bottom: 1px solid $light_mode_border;
+
+            &:first-child {
+                padding-top: 0;
+            }
+
+            &:last-child {
+                padding-bottom: 0;
+                border-bottom: none;
+            }
+        }
+
+        .menu-option {
+            white-space: nowrap;
+            font-weight: 700;
+            @include font-size(14);
+            padding: 15px 20px;
+            cursor: pointer;
+            width: 100%;
+            color: $text;
+
+            &:hover {
+                background: $light_background;
+
+                .text-label {
+                    color: $theme;
+                }
+
+                path, line, polyline, rect, circle, polygon {
+                    stroke: $theme;
+                }
+            }
+        }
+    }
+
+    @media (prefers-color-scheme: dark) {
+
+        .contextmenu {
+            background: $dark_mode_foreground;
+
+            .menu-options {
+
+                .menu-option-group {
+                    border-color: $dark_mode_border_color;
+                }
+
+                .menu-option {
+                    color: $dark_mode_text_primary;
+
+                    &:hover {
+                        background: rgba($theme, 0.1);
+                    }
+                }
+            }
+        }
+    }
+</style>

resources/js/components/FilesView/DesktopToolbar.vue

@@ -0,0 +1,354 @@
+<template>
+    <div id="desktop-toolbar">
+        <div class="toolbar-wrapper">
+
+            <!-- Go back-->
+            <div class="toolbar-go-back" v-if="homeDirectory">
+                <div @click="goBack" class="go-back-button">
+                    <chevron-left-icon size="17" :class="{'is-active': browseHistory.length > 1}" class="icon-back"></chevron-left-icon>
+
+                    <span class="back-directory-title">
+                        {{ directoryName }}
+                    </span>
+
+                    <span @click.stop="folderActions" v-if="browseHistory.length > 1 && $isThisLocation(['base', 'public'])" class="folder-options" id="folder-actions">
+                        <more-horizontal-icon size="14" class="icon-more"></more-horizontal-icon>
+                    </span>
+                </div>
+            </div>
+
+            <!-- Tools-->
+            <div class="toolbar-tools">
+                <!--Search bar-->
+                <div class="toolbar-button-wrapper">
+                    <SearchBar/>
+                </div>
+
+                <!--Files controlls-->
+                <div class="toolbar-button-wrapper" v-if="$checkPermission(['master', 'editor'])">
+                    <ToolbarButtonUpload
+                            :class="{'is-inactive': canUploadInView}"
+                            :action="$t('actions.upload')"
+                    />
+                    <ToolbarButton
+                            :class="{'is-inactive': canCreateFolderInView}"
+                            @click.native="createFolder"
+                            source="folder-plus"
+                            :action="$t('actions.create_folder')"
+                    />
+                </div>
+
+                <div class="toolbar-button-wrapper"
+                     v-if="$checkPermission(['master', 'editor'])">
+                    <ToolbarButton
+                            source="move"
+                            :class="{'is-inactive': canMoveInView}"
+                            :action="$t('actions.move')"
+                            @click.native="moveItem"
+                    />
+                    <ToolbarButton
+                            v-if="! $isThisLocation(['public'])"
+                            source="share"
+                            :class="{'is-inactive': canShareInView}"
+                            :action="$t('actions.share')"
+                            @click.native="shareItem"
+                    />
+                    <ToolbarButton
+                            source="trash"
+                            :class="{'is-inactive': canDeleteInView}"
+                            :action="$t('actions.delete')"
+                            @click.native="deleteItem"
+                    />
+                </div>
+
+                <!--View options-->
+                <div class="toolbar-button-wrapper">
+                    <ToolbarButton
+                            :source="preview"
+                            :action="$t('actions.preview')"
+                            @click.native="$store.dispatch('changePreviewType')"
+                    />
+                    <ToolbarButton
+                            :class="{ active: fileInfoVisible }"
+                            @click.native="$store.dispatch('fileInfoToggle')"
+                            source="info"
+                    />
+                </div>
+            </div>
+        </div>
+        <UploadProgress />
+    </div>
+</template>
+
+<script>
+    import ToolbarButtonUpload from '@/components/FilesView/ToolbarButtonUpload'
+    import { ChevronLeftIcon, MoreHorizontalIcon } from 'vue-feather-icons'
+    import UploadProgress from '@/components/FilesView/UploadProgress'
+    import ToolbarButton from '@/components/FilesView/ToolbarButton'
+    import SearchBar from '@/components/FilesView/SearchBar'
+    import {mapGetters} from 'vuex'
+    import {events} from '@/bus'
+    import {last} from 'lodash'
+
+    export default {
+        name: 'ToolBar',
+        components: {
+            ToolbarButtonUpload,
+            MoreHorizontalIcon,
+            ChevronLeftIcon,
+            UploadProgress,
+            ToolbarButton,
+            SearchBar
+        },
+        computed: {
+            ...mapGetters([
+                'FilePreviewType',
+                'fileInfoVisible',
+                'fileInfoDetail',
+                'currentFolder',
+                'browseHistory',
+                'homeDirectory',
+            ]),
+            directoryName() {
+                return this.currentFolder ? this.currentFolder.name : this.homeDirectory.name
+            },
+            preview() {
+                return this.FilePreviewType === 'list' ? 'th' : 'th-list'
+            },
+            canCreateFolderInView() {
+                return ! this.$isThisLocation(['base', 'public'])
+            },
+            canDeleteInView() {
+                return ! this.$isThisLocation(['trash', 'trash-root', 'base', 'participant_uploads', 'latest', 'shared', 'public'])
+            },
+            canUploadInView() {
+                return ! this.$isThisLocation(['base', 'public'])
+            },
+            canMoveInView() {
+                return ! this.$isThisLocation(['base', 'participant_uploads', 'latest', 'shared', 'public'])
+            },
+            canShareInView() {
+                return ! this.$isThisLocation(['base', 'participant_uploads', 'latest', 'shared', 'public'])
+            }
+        },
+        methods: {
+            goBack() {
+                // Get previous folder
+                let previousFolder = last(this.browseHistory)
+
+                if (! previousFolder)
+                    return
+
+                if (previousFolder.location === 'trash-root') {
+                    this.$store.dispatch('getTrash')
+
+                } else if (previousFolder.location === 'shared') {
+                    this.$store.dispatch('getShared')
+
+                } else {
+
+                    if ( this.$isThisLocation('public') ) {
+                        this.$store.dispatch('browseShared', [{folder: previousFolder, back: true, init: false}])
+                    } else {
+                        this.$store.dispatch('getFolder', [{folder: previousFolder, back: true, init: false}])
+                    }
+                }
+            },
+            folderActions() {
+                events.$emit('folder:actions', this.currentFolder)
+            },
+            deleteItem() {
+                events.$emit('items:delete')
+            },
+            createFolder() {
+                this.$createFolder()
+            },
+            moveItem() {
+                events.$emit('popup:open', {name: 'move', item: this.fileInfoDetail})
+            },
+            shareItem() {
+                if (this.fileInfoDetail.shared) {
+                    events.$emit('popup:open', {name: 'share-edit', item: this.fileInfoDetail})
+                } else {
+                    events.$emit('popup:open', {name: 'share-create', item: this.fileInfoDetail})
+                }
+            }
+        },
+    }
+</script>
+
+<style scoped lang="scss">
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
+
+    .toolbar-wrapper {
+        padding-top: 10px;
+        padding-bottom: 10px;
+        display: flex;
+        position: relative;
+        z-index: 2;
+
+        > div {
+            flex-grow: 1;
+            align-self: center;
+            white-space: nowrap;
+        }
+    }
+
+    .directory-name {
+        vertical-align: middle;
+        @include font-size(17);
+        color: $text;
+        font-weight: 700;
+        max-width: 220px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        display: inline-block;
+    }
+
+    .icon-back {
+        vertical-align: middle;
+        cursor: pointer;
+        margin-right: 6px;
+        opacity: 0.15;
+        pointer-events: none;
+        @include transition(150ms);
+
+        &.is-active {
+            opacity: 1;
+            pointer-events: initial;
+        }
+    }
+
+    .toolbar-go-back {
+        cursor: pointer;
+
+        .folder-options {
+            vertical-align: middle;
+            margin-left: 6px;
+            padding: 1px 4px;
+            line-height: 0;
+            border-radius: 3px;
+            @include transition(150ms);
+
+            svg circle {
+                @include transition(150ms);
+            }
+
+            &:hover {
+                background: $light_background;
+
+                svg circle {
+                    stroke: $theme;
+                }
+            }
+
+            .icon-more {
+                vertical-align: middle;
+            }
+        }
+
+
+        .back-directory-title {
+            @include font-size(15);
+            line-height: 1;
+            font-weight: 700;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            display: inline-block;
+            vertical-align: middle;
+            color: $text;
+        }
+    }
+
+    .toolbar-position {
+        text-align: center;
+
+        span {
+            @include font-size(17);
+            font-weight: 600;
+        }
+    }
+
+    .toolbar-tools {
+        text-align: right;
+
+        .toolbar-button-wrapper {
+            margin-left: 28px;
+            display: inline-block;
+            vertical-align: middle;
+
+            &:first-child {
+                margin-left: 0 !important;
+            }
+        }
+
+        .button {
+            margin-left: 5px;
+
+            &.active {
+                /deep/ svg {
+                    line, circle {
+                        stroke: $theme;
+                    }
+                }
+            }
+
+            &.is-inactive {
+                opacity: 0.25;
+                pointer-events: none;
+            }
+
+            &:first-child {
+                margin-left: 0;
+            }
+        }
+    }
+
+    @media only screen and (max-width: 1024px) {
+
+        .toolbar-go-back .back-directory-title {
+            max-width: 120px;
+        }
+
+        .toolbar-tools {
+
+            .button {
+                margin-left: 0;
+                height: 40px;
+                width: 40px;
+            }
+
+            .toolbar-button-wrapper {
+                margin-left: 25px;
+            }
+        }
+    }
+
+    @media only screen and (max-width: 960px) {
+
+        #desktop-toolbar {
+            display: none;
+        }
+    }
+
+    @media (prefers-color-scheme: dark) {
+        .toolbar .directory-name {
+            color: $dark_mode_text_primary;
+        }
+
+        .toolbar-go-back {
+
+            .back-directory-title {
+                color: $dark_mode_text_primary;
+            }
+
+            .folder-options {
+
+                &:hover {
+                    background: $dark_mode_foreground;
+                }
+            }
+        }
+    }
+</style>

resources/js/components/FilesView/EmptyMessage.vue

@@ -0,0 +1,67 @@
+<template>
+    <div class="empty-message">
+        <div class="message">
+            <eye-off-icon v-if="icon === 'eye-off'" size="36" class="icon"></eye-off-icon>
+            <p>{{ message }}</p>
+        </div>
+    </div>
+</template>
+
+<script>
+    import { EyeOffIcon } from 'vue-feather-icons'
+
+    export default {
+        name: 'EmptyMessage',
+        props: ['icon', 'message'],
+        components: {
+            EyeOffIcon
+        }
+    }
+</script>
+
+<style scoped lang="scss">
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
+
+    .empty-message {
+        text-align: center;
+        display: flex;
+        align-items: center;
+        height: 100%;
+
+        .message {
+            margin: 0 auto;
+
+            p {
+                margin-top: 10px;
+                max-width: 130px;
+                @include font-size(13);
+                font-weight: 500;
+                color: $text-muted;
+            }
+
+            .icon {
+                path, line, polyline, rect, circle {
+                    stroke: $text;
+                }
+            }
+        }
+    }
+
+    @media (prefers-color-scheme: dark) {
+        .empty-message {
+
+            .message {
+                .icon {
+                    path, line, polyline, rect, circle {
+                        stroke: $dark_mode_text_secondary;
+                    }
+                }
+
+                p {
+                    color: $dark_mode_text_secondary;
+                }
+            }
+        }
+    }
+</style>

resources/js/components/FilesView/EmptyPage.vue

@@ -1,20 +1,35 @@
 <template>
     <div class="empty-page" v-if="isLoading || isEmpty">
         <div class="empty-state">
-            <div class="text-content" v-if="isEmpty && !isLoading">
-                <h1 class="title">{{ $t('empty_page.title') }}</h1>
-                <p v-if="! isTrash" class="description">
-                    {{ $t('empty_page.description') }}
-                </p>
-                <ButtonUpload
-                        v-if="! isTrash"
-                        @input.native="$uploadFiles(files)"
-                        v-model="files"
-                        button-style="theme"
-                >{{ $t('empty_page.call_to_action') }}
-                </ButtonUpload
-                >
+
+            <!--Shared empty message-->
+            <div class="text-content" v-if="$isThisLocation(['shared']) && ! isLoading">
+                <h1 class="title">{{ $t('shared.empty_shared') }}</h1>
             </div>
+
+            <!--Trash empty message-->
+            <div class="text-content" v-if="$isThisLocation(['trash', 'trash-root']) && ! isLoading">
+                <h1 class="title">{{ $t('empty_page.title') }}</h1>
+            </div>
+
+            <!--Trash empty message-->
+            <div class="text-content" v-if="$isThisLocation(['participant_uploads']) && ! isLoading">
+                <h1 class="title">{{ $t('messages.nothing_from_participants') }}</h1>
+            </div>
+
+            <!--Base file browser empty message-->
+            <div class="text-content" v-if="$isThisLocation(['base', 'public', 'latest']) && !isLoading">
+                <h1 class="title">{{ $t('empty_page.title') }}</h1>
+                <p v-if="$checkPermission(['master', 'editor'])" class="description">{{ $t('empty_page.description') }}</p>
+                <ButtonUpload
+                        v-if="$checkPermission(['master', 'editor'])"
+                        button-style="theme"
+                >
+                    {{ $t('empty_page.call_to_action') }}
+                </ButtonUpload>
+            </div>
+
+            <!--Spinner-->
             <div class="text-content" v-if="isLoading">
                 <Spinner/>
             </div>
@@ -23,8 +38,8 @@
 </template>
 
 <script>
-    import ButtonUpload from '@/components/VueFileManagerComponents/FilesView/ButtonUpload'
-    import Spinner from '@/components/VueFileManagerComponents/FilesView/Spinner'
+    import ButtonUpload from '@/components/FilesView/ButtonUpload'
+    import Spinner from '@/components/FilesView/Spinner'
     import {mapGetters} from 'vuex'
 
     export default {
@@ -37,22 +52,15 @@
         computed: {
             ...mapGetters(['data', 'isLoading', 'currentFolder']),
             isEmpty() {
-                return this.data.length == 0
-            },
-            isTrash() {
-                return this.currentFolder.location === 'trash' || this.currentFolder.location === 'trash-root'
-            }
-        },
-        data() {
-            return {
-                files: undefined
+                return this.data && this.data.length == 0
             }
         }
     }
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .empty-page {
         position: absolute;
@@ -76,14 +84,14 @@
         margin: 30px 0;
 
         .title {
-            @include font-size(24);
+            @include font-size(20);
             color: $text;
             font-weight: 700;
             margin: 0;
         }
 
         .description {
-            @include font-size(15);
+            @include font-size(13);
             color: $text-muted;
             margin-bottom: 20px;
             display: block;

resources/js/components/FilesView/FileBrowser.vue

@@ -8,30 +8,25 @@
         <div
                 class="files-container"
                 ref="fileContainer"
-                :class="{
-				'is-fileinfo-visible': fileInfoVisible && !$isMinimalScale()
-			}"
+                :class="{'is-fileinfo-visible': fileInfoVisible && !$isMinimalScale() }"
                 @click.self="filesContainerClick"
         >
             <!--MobileToolbar-->
-            <MobileToolbar v-if="$isMinimalScale()"/>
+            <MobileToolbar />
 
             <!--Searchbar-->
-            <SearchBar v-if="$isMinimalScale()" class="mobile-search"/>
+            <SearchBar class="mobile-search" />
 
             <!--Mobile Actions-->
-            <MobileActions v-if="$isMinimalScale()" />
+            <MobileActions />
 
             <!--Item previews list-->
-            <div
-                    v-if="isList"
-                    class="file-list-wrapper"
-            >
+            <div v-if="isList" class="file-list-wrapper">
                 <transition-group
                         name="file"
                         tag="section"
                         class="file-list"
-                        :class="preview_type"
+                        :class="FilePreviewType"
                 >
                     <FileItemList
                             @dragstart="dragStart(item)"
@@ -51,7 +46,7 @@
                         name="file"
                         tag="section"
                         class="file-list"
-                        :class="preview_type"
+                        :class="FilePreviewType"
                 >
                     <FileItemGrid
                             @dragstart="dragStart(item)"
@@ -66,7 +61,7 @@
             </div>
 
             <!--Show empty page if folder is empty-->
-            <EmptyPage v-if="!isSearching"/>
+            <EmptyPage v-if="! isSearching"/>
 
             <!--Show empty page if no search results-->
             <EmptyMessage
@@ -76,33 +71,26 @@
             />
         </div>
 
-        <div
-                v-if="!$isMinimalScale()"
-                class="file-info-container"
-                :class="{ 'is-fileinfo-visible': fileInfoVisible }"
-        >
+        <!--File Info Panel-->
+        <div v-if="! $isMinimalScale()" class="file-info-container" :class="{ 'is-fileinfo-visible': fileInfoVisible }">
             <!--File info panel-->
             <FileInfoPanel v-if="fileInfoDetail"/>
 
             <!--If file info panel empty show message-->
-            <EmptyMessage
-                    v-if="!fileInfoDetail"
-                    :message="$t('messages.nothing_to_preview')"
-                    icon="eye-slash"
-            />
+            <EmptyMessage v-if="!fileInfoDetail" :message="$t('messages.nothing_to_preview')" icon="eye-off"/>
         </div>
     </div>
 </template>
 
 <script>
-    import MobileToolbar from '@/components/VueFileManagerComponents/FilesView/MobileToolbar'
-    import MobileActions from '@/components/VueFileManagerComponents/FilesView/MobileActions'
-    import FileInfoPanel from '@/components/VueFileManagerComponents/FilesView/FileInfoPanel'
-    import FileItemList from '@/components/VueFileManagerComponents/FilesView/FileItemList'
-    import FileItemGrid from '@/components/VueFileManagerComponents/FilesView/FileItemGrid'
-    import EmptyMessage from '@/components/VueFileManagerComponents/FilesView/EmptyMessage'
-    import EmptyPage from '@/components/VueFileManagerComponents/FilesView/EmptyPage'
-    import SearchBar from '@/components/VueFileManagerComponents/FilesView/SearchBar'
+    import MobileToolbar from '@/components/FilesView/MobileToolbar'
+    import MobileActions from '@/components/FilesView/MobileActions'
+    import FileInfoPanel from '@/components/FilesView/FileInfoPanel'
+    import FileItemList from '@/components/FilesView/FileItemList'
+    import FileItemGrid from '@/components/FilesView/FileItemGrid'
+    import EmptyMessage from '@/components/FilesView/EmptyMessage'
+    import EmptyPage from '@/components/FilesView/EmptyPage'
+    import SearchBar from '@/components/FilesView/SearchBar'
     import {mapGetters} from 'vuex'
     import {events} from '@/bus'
 
@@ -124,16 +112,16 @@
                 'fileInfoVisible',
                 'fileInfoDetail',
                 'currentFolder',
-                'preview_type',
+                'FilePreviewType',
                 'isSearching',
                 'isLoading',
                 'data'
             ]),
             isGrid() {
-                return this.preview_type === 'grid'
+                return this.FilePreviewType === 'grid'
             },
             isList() {
-                return this.preview_type === 'list'
+                return this.FilePreviewType === 'list'
             },
             isEmpty() {
                 return this.data.length == 0
@@ -214,34 +202,15 @@
 
             // On items delete
             events.$on('items:delete', () => {
-                this.$store.dispatch('removeItem', this.fileInfoDetail)
-
-                //let ids = []
-                //let items = []
-
-                // Get ids
-                /*this.$children[0].$children.filter(item => {
-
-                            if (item.isClicked) {
-
-                                ids.push(item.data.unique_id)
-
-                                items.push({
-                                    unique_id: item.data.unique_id,
-                                    type: item.data.type,
-                                })
-                            }
-                        })*/
-
-                // Dispatch action
-                /*this.$store.dispatch('removeItems', [ids, items])*/
+                this.$store.dispatch('deleteItem', this.fileInfoDetail)
             })
         }
     }
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .button-upload {
         display: block;
@@ -250,6 +219,7 @@
     }
 
     .mobile-search {
+        display: none;
         margin-bottom: 10px;
         margin-top: 10px;
     }
@@ -257,6 +227,7 @@
     .file-content {
         display: flex;
         flex-wrap: nowrap;
+        height: 100%;
 
         &.is-dragging {
             @include transform(scale(0.99));
@@ -264,6 +235,7 @@
     }
 
     .files-container {
+        overflow-x: hidden;
         overflow-y: auto;
         flex: 0 0 100%;
         @include transition(150ms);
@@ -308,7 +280,72 @@
         transform: translateX(-20px);
     }
 
-    .file-leave-active {
-        position: absolute;
+    @media only screen and (min-width: 960px) {
+
+        .file-content {
+            position: absolute;
+            top: 72px;
+            left: 15px;
+            right: 15px;
+            bottom: 0;
+            @include transition;
+
+            &.is-offset {
+                margin-top: 50px;
+            }
+        }
+    }
+
+    @media only screen and (max-width: 960px) {
+
+        .file-info-container {
+            display: none;
+        }
+
+        .mobile-search {
+            display: block;
+        }
+    }
+
+    @media only screen and (max-width: 690px) {
+
+        .files-container {
+            padding-left: 15px;
+            padding-right: 15px;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            position: fixed;
+            overflow-y: auto;
+
+            .file-list {
+
+                &.grid {
+                    grid-template-columns: repeat(auto-fill, 120px);
+                }
+            }
+        }
+
+        .file-content {
+            position: absolute;
+            top: 0;
+            left: 0px;
+            right: 0px;
+            bottom: 0;
+            @include transition;
+
+            &.is-offset {
+                margin-top: 50px;
+            }
+        }
+
+        .mobile-search {
+            margin-bottom: 0;
+        }
+        
+        .file-info-container {
+            display: none;
+        }
     }
 </style>

resources/js/components/FilesView/FileInfoPanel.vue

@@ -0,0 +1,297 @@
+<template>
+    <div class="file-info-content" v-if="fileInfoDetail">
+        <div class="file-headline" spellcheck="false">
+            <FilePreview />
+
+            <!--File info-->
+            <div class="flex">
+                <div class="icon">
+                    <div class="icon-preview">
+                        <image-icon v-if="fileType === 'image'" size="21"></image-icon>
+                        <video-icon v-if="fileType === 'video'" size="21"></video-icon>
+                        <folder-icon v-if="fileType === 'folder'" size="21"></folder-icon>
+                        <file-icon v-if="fileType === 'file'" size="21"></file-icon>
+                    </div>
+                </div>
+                <div class="file-info">
+					<span ref="name" class="name">{{ fileInfoDetail.name }}</span>
+                    <span class="mimetype" v-if="fileInfoDetail.mimetype">.{{ fileInfoDetail.mimetype }}</span>
+                </div>
+            </div>
+        </div>
+
+        <!--Info list-->
+        <ul class="list-info">
+
+            <!--Filesize-->
+            <li v-if="fileInfoDetail.filesize" class="list-info-item">
+                <b>{{ $t('file_detail.size') }}</b>
+                <span>{{ fileInfoDetail.filesize }}</span>
+            </li>
+
+            <!--Latest change-->
+            <li v-if="$checkPermission(['master']) && fileInfoDetail.user_scope !== 'master'" class="list-info-item">
+                <b>{{ $t('file_detail.author') }}</b>
+                <span>{{ $t('file_detail.author_participant') }}</span>
+            </li>
+
+            <!--Latest change-->
+            <li class="list-info-item">
+                <b>{{ $t('file_detail.created_at') }}</b>
+                <span>{{ fileInfoDetail.created_at }}</span>
+            </li>
+
+            <!--Parent-->
+            <li v-if="$checkPermission(['master'])" class="list-info-item">
+                <b>{{ $t('file_detail.where') }}</b>
+                <div class="action-button" @click="moveItem">
+                    <span>{{ fileInfoDetail.parent ? fileInfoDetail.parent.name : $t('locations.home') }}</span>
+                    <edit-2-icon size="10" class="edit-icon"></edit-2-icon>
+                </div>
+            </li>
+
+            <!--Parent-->
+            <li v-if="$checkPermission('master') && fileInfoDetail.shared" class="list-info-item">
+                <b>{{ $t('file_detail.shared') }}</b>
+                <div class="action-button" @click="shareItemOptions">
+                    <span>{{ sharedInfo }}</span>
+                    <edit-2-icon size="10" class="edit-icon"></edit-2-icon>
+                </div>
+                <div class="sharelink">
+                    <lock-icon v-if="isLocked" @click="shareItemOptions" class="lock-icon" size="17"></lock-icon>
+                    <unlock-icon v-if="! isLocked" @click="shareItemOptions" class="lock-icon" size="17"></unlock-icon>
+
+                    <CopyInput class="copy-sharelink" size="small" :value="fileInfoDetail.shared.link" />
+                </div>
+            </li>
+        </ul>
+    </div>
+</template>
+
+<script>
+    import { Edit2Icon, LockIcon, UnlockIcon, ImageIcon, VideoIcon, FolderIcon, FileIcon } from 'vue-feather-icons'
+    import FilePreview from '@/components/FilesView/FilePreview'
+    import CopyInput from '@/components/Others/Forms/CopyInput'
+    import {mapGetters} from 'vuex'
+    import {events} from "@/bus"
+
+    export default {
+        name: 'FileInfoPanel',
+        components: {
+            FilePreview,
+            FolderIcon,
+            UnlockIcon,
+            VideoIcon,
+            CopyInput,
+            ImageIcon,
+            FileIcon,
+            Edit2Icon,
+            LockIcon,
+        },
+        computed: {
+            ...mapGetters(['fileInfoDetail', 'permissionOptions']),
+            fileType() {
+                return this.fileInfoDetail.type
+/*                switch () {
+                    case 'folder':
+                        return 'folder'
+                    break;
+                    case 'file':
+                        return 'file'
+                    break;
+                    case 'image':
+                        return 'file-image'
+                    break;
+                    case 'video':
+                        return 'file-video'
+                    break;
+                    case 'file':
+                        return 'file-audio'
+                    break;
+                }*/
+            },
+            sharedInfo() {
+
+                // Get permission title
+                let title = this.permissionOptions.find(option => {
+                    return option.value === this.fileInfoDetail.shared.permission
+                })
+
+                return title ? title.label : this.$t('shared.can_download')
+            },
+            sharedIcon() {
+                switch (this.fileInfoDetail.shared.permission) {
+                    case 'editor':
+                        return 'user-edit'
+                    break
+                    case 'visitor':
+                        return 'user'
+                    break
+                    default:
+                        return 'download'
+                }
+            },
+            isLocked() {
+                return this.fileInfoDetail.shared.protected
+            }
+        },
+        methods: {
+            shareItemOptions() {
+                // Open share item popup
+                events.$emit('popup:open', {name: 'share-edit', item: this.fileInfoDetail})
+            },
+            moveItem() {
+                // Move item fire popup
+                events.$emit('popup:open', {name: 'move', item: this.fileInfoDetail})
+            }
+        }
+    }
+</script>
+
+<style scoped lang="scss">
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
+
+    .file-info-content {
+        padding-bottom: 20px;
+    }
+
+    .file-headline {
+        margin-bottom: 20px;
+        border-radius: 8px;
+
+        .flex {
+            display: flex;
+            align-items: flex-start;
+        }
+
+        .icon-preview {
+            display: inline-flex;
+            align-items: center;
+            justify-content: center;
+            padding: 0;
+            text-align: center;
+            cursor: pointer;
+            white-space: nowrap;
+            outline: none;
+            border: none;
+        }
+
+        .file-info {
+            padding-left: 10px;
+            width: 100%;
+            word-break: break-all;
+
+            .name {
+                @include font-size(14);
+                font-weight: 700;
+                line-height: 1.4;
+                display: block;
+                color: $text;
+            }
+
+            .mimetype {
+                @include font-size(12);
+                font-weight: 600;
+                color: $theme;
+                display: block;
+            }
+        }
+    }
+
+    .list-info {
+
+        .list-info-item {
+            display: block;
+            padding-top: 20px;
+
+            &:first-child {
+                padding-top: 0;
+            }
+
+            .action-button {
+                cursor: pointer;
+
+                .edit-icon {
+                    display: inline-block;
+                    margin-left: 3px;
+                }
+            }
+
+            b {
+                display: block;
+                @include font-size(13);
+                color: $theme;
+                margin-bottom: 2px;
+            }
+
+            span {
+                display: inline-block;
+                @include font-size(14);
+                font-weight: bold;
+                color: $text;
+            }
+        }
+    }
+
+    .sharelink {
+        display: flex;
+        width: 100%;
+        align-items: center;
+        margin-top: 10px;
+
+        .lock-icon {
+            display: inline-block;
+            width: 15px;
+            margin-right: 9px;
+            cursor: pointer;
+        }
+
+        .copy-sharelink {
+            width: 100%;
+        }
+    }
+
+    @media (prefers-color-scheme: dark) {
+
+        .file-headline {
+
+            .file-info {
+
+                .name {
+                    color: $dark_mode_text_primary;
+                }
+            }
+        }
+
+        .list-info {
+
+            .list-info-item {
+
+                span {
+                    color: $dark_mode_text_primary
+                }
+
+                .action-button {
+
+                    .icon {
+                        color: $dark_mode_text_primary;
+                    }
+                }
+            }
+        }
+
+        .sharelink {
+
+            .lock-icon {
+
+                &:hover {
+
+                    path, rect {
+                        stroke: $theme;
+                    }
+                }
+            }
+        }
+    }
+</style>

resources/js/components/FilesView/FileItemGrid.vue

@@ -7,7 +7,7 @@
     >
         <!--Grid preview-->
         <div
-                :draggable="! isDeleted"
+                :draggable="canDrag"
                 @dragstart="$emit('dragstart')"
                 @drop="
 				$emit('drop')
@@ -20,10 +20,11 @@
         >
             <!--Thumbnail for item-->
             <div class="icon-item">
+
                 <!--If is file or image, then link item-->
-                <span v-if="isFile" class="file-icon-text">{{
-					data.mimetype
-				}}</span>
+                <span v-if="isFile" class="file-icon-text">
+                    {{ data.mimetype }}
+                </span>
 
                 <!--Folder thumbnail-->
                 <FontAwesomeIcon v-if="isFile" class="file-icon" icon="file"/>
@@ -38,41 +39,62 @@
             <!--Name-->
             <div class="item-name">
                 <!--Name-->
-                <span
+                <b
                         ref="name"
-                        @input="changeItemName"
-                        :contenteditable="!$isMobile()"
+                        @input="renameItem"
+                        :contenteditable="canEditName"
                         class="name"
-                >{{ itemName }}</span
                 >
+                    {{ itemName }}
+                </b>
 
-                <!--Other attributes-->
-                <span v-if="! isFolder" class="item-size">{{
-					data.filesize
-				}}</span>
+                <div class="item-info">
 
-                <span v-if="isFolder" class="item-length">
-					{{ folderItems == 0 ? $t('folder.empty') : $tc('folder.item_counts', folderItems) }}
-				</span>
+                    <!--Shared Icon-->
+                    <div v-if="$checkPermission('master') && data.shared" class="item-shared">
+                        <link-icon size="12" class="shared-icon"></link-icon>
+                    </div>
+
+                    <!--Participant owner Icon-->
+                    <div v-if="$checkPermission('master') && data.user_scope !== 'master'" class="item-shared">
+                        <user-plus-icon size="12" class="shared-icon"></user-plus-icon>
+                    </div>
+
+                    <!--Filesize-->
+                    <span v-if="! isFolder" class="item-size">{{ data.filesize }}</span>
+
+                    <!--Folder item counts-->
+                    <span v-if="isFolder" class="item-length">
+                        {{ folderItems == 0 ? $t('folder.empty') : $tc('folder.item_counts', folderItems) }}
+				    </span>
+                </div>
             </div>
 
-            <span @click.stop="showItemActions" class="show-actions" v-if="$isMobile()">
-					<FontAwesomeIcon icon="ellipsis-h" class="icon-action"></FontAwesomeIcon>
-				</span>
+            <span @click.stop="showItemActions" class="show-actions"
+                  v-if="$isMobile() && ! ( $checkPermission('visitor') && isFolder ) && canShowMobileOptions">
+                <FontAwesomeIcon icon="ellipsis-h" class="icon-action"></FontAwesomeIcon>
+            </span>
         </div>
     </div>
 </template>
 
 <script>
+    import { LinkIcon, UserPlusIcon } from 'vue-feather-icons'
     import {debounce} from 'lodash'
     import {mapGetters} from 'vuex'
     import {events} from '@/bus'
 
     export default {
-        name: 'FileItem',
+        name: 'FileItemGrid',
         props: ['data'],
+        components: {
+            UserPlusIcon,
+            LinkIcon,
+        },
         computed: {
-            ...mapGetters(['preview_type']),
+            ...mapGetters([
+                'FilePreviewType', 'sharedDetail'
+            ]),
             isFolder() {
                 return this.data.type === 'folder'
             },
@@ -82,6 +104,18 @@
             isImage() {
                 return this.data.type === 'image'
             },
+            canEditName() {
+                return !this.$isMobile()
+                    && !this.$isThisLocation(['trash', 'trash-root'])
+                    && !this.$checkPermission('visitor')
+                    && !(this.sharedDetail && this.sharedDetail.type === 'file')
+            },
+            canShowMobileOptions() {
+                return ! (this.sharedDetail && this.sharedDetail.type === 'file')
+            },
+            canDrag() {
+                return !this.isDeleted && this.$checkPermission(['master', 'editor'])
+            },
             timeStamp() {
                 return this.data.deleted_at ? this.$t('item_thumbnail.deleted_at', this.data.deleted_at) : this.data.created_at
             },
@@ -102,7 +136,7 @@
         methods: {
             showItemActions() {
                 // Load file info detail
-                this.$store.dispatch('loadFileInfoDetail', this.data)
+                this.$store.commit('GET_FILEINFO_DETAIL', this.data)
 
                 events.$emit('mobileMenu:show')
             },
@@ -125,11 +159,15 @@
                 if (this.$isMobile() && this.isFolder) {
 
                     // Go to folder
-                    this.$store.dispatch('goToFolder', [this.data, false])
+                    if (this.$isThisLocation('public')) {
+                        this.$store.dispatch('browseShared', [{folder: this.data, back: false, init: false}])
+                    } else {
+                        this.$store.dispatch('getFolder', [{folder: this.data, back: false, init: false}])
+                    }
                 }
 
                 // Load file info detail
-                this.$store.dispatch('loadFileInfoDetail', this.data)
+                this.$store.commit('GET_FILEINFO_DETAIL', this.data)
 
                 // Get target classname
                 let itemClass = e.target.className
@@ -154,16 +192,20 @@
                 }
 
                 if (this.isFolder) {
-                    // Go to folder
-                    this.$store.dispatch('goToFolder', [this.data, false])
+
+                    if (this.$isThisLocation('public')) {
+                        this.$store.dispatch('browseShared', [{folder: this.data, back: false, init: false}])
+                    } else {
+                        this.$store.dispatch('getFolder', [{folder: this.data, back: false, init: false}])
+                    }
                 }
             },
-            changeItemName: debounce(function (e) {
+            renameItem: debounce(function (e) {
 
                 // Prevent submit empty string
-                if (e.target.innerText === '') return
+                if (e.target.innerText.trim() === '') return
 
-                this.$store.dispatch('changeItemName', {
+                this.$store.dispatch('renameItem', {
                     unique_id: this.data.unique_id,
                     type: this.data.type,
                     name: e.target.innerText
@@ -187,7 +229,8 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .show-actions {
         cursor: pointer;
@@ -203,6 +246,7 @@
     }
 
     .file-wrapper {
+        user-select: none;
         position: relative;
         text-align: center;
         display: inline-block;
@@ -217,22 +261,32 @@
 
             .item-size,
             .item-length {
-                @include font-size(12);
+                @include font-size(11);
                 font-weight: 400;
-                color: $text-muted;
-                display: block;
+                color: rgba($text, 0.7);
+                display: inline-block;
             }
 
-            .name {
+            .item-info {
                 display: block;
+                line-height: 1;
+            }
 
-                &[contenteditable] {
-                    -webkit-user-select: text;
-                    user-select: text;
+            .item-shared {
+                display: inline-block;
+
+                .label {
+                    @include font-size(12);
+                    font-weight: 400;
+                    color: $theme;
                 }
 
-                &[contenteditable='true']:hover {
-                    text-decoration: underline;
+                .shared-icon {
+                    vertical-align: middle;
+
+                    path, circle, line {
+                        stroke: $theme;
+                    }
                 }
             }
 
@@ -243,6 +297,16 @@
                 max-height: 40px;
                 overflow: hidden;
                 text-overflow: ellipsis;
+                word-break: break-all;
+
+                &[contenteditable] {
+                    -webkit-user-select: text;
+                    user-select: text;
+                }
+
+                &[contenteditable='true']:hover {
+                    text-decoration: underline;
+                }
 
                 &.actived {
                     max-height: initial;
@@ -310,6 +374,7 @@
                 left: 0;
                 right: 0;
                 color: $theme;
+                @include font-size(12);
                 font-weight: 600;
                 user-select: none;
                 max-width: 65px;
@@ -326,6 +391,7 @@
                 height: 110px;
                 border-radius: 5px;
                 margin: 0 auto;
+                pointer-events: none;
             }
 
             .folder-icon {
@@ -346,14 +412,75 @@
         }
     }
 
+    @media only screen and (max-width: 960px) {
+
+        .file-wrapper {
+
+            .icon-item {
+                margin-bottom: 15px;
+            }
+        }
+    }
+
+    @media only screen and (max-width: 690px) {
+        .file-wrapper {
+
+            .file-item {
+                width: 120px;
+            }
+
+            .icon-item {
+                margin-bottom: 10px;
+                height: 90px;
+
+                .file-icon {
+                    @include font-size(75);
+                }
+
+                .file-icon-text {
+                    @include font-size(12);
+                }
+
+                .folder-icon {
+                    @include font-size(75);
+                    margin-top: 0;
+                    margin-bottom: 0;
+                }
+
+                .image {
+                    width: 90px;
+                    height: 90px;
+                }
+            }
+
+            .item-name .name {
+                @include font-size(13);
+                line-height: .9;
+                max-height: 30px;
+            }
+        }
+    }
+
     @media (prefers-color-scheme: dark) {
         .file-wrapper {
 
-            .icon-item .file-icon {
+            .icon-item {
 
-                path {
-                    fill: $dark_mode_foreground;
-                    stroke: #2F3C54;
+                .file-icon {
+
+                    path {
+                        fill: $dark_mode_foreground;
+                        stroke: #2F3C54;
+                    }
+                }
+
+                .folder-icon {
+
+                    &.is-deleted {
+                        path {
+                            fill: lighten($dark_mode_foreground, 5%);
+                        }
+                    }
                 }
             }
 
@@ -372,9 +499,20 @@
                 }
             }
 
-            .item-name .name {
-                color: $dark_mode_text_primary;
+            .item-name {
+
+                .name {
+                    color: $dark_mode_text_primary;
+                }
+
+                .item-size,
+                .item-length {
+                    color: $dark_mode_text_secondary;
+                }
             }
+
         }
     }
+
+
 </style>

resources/js/components/FilesView/FileItemList.vue

@@ -1,12 +1,13 @@
 <template>
     <div
-            @click.stop="clickedItem" @dblclick="goToItem"
             class="file-wrapper"
+            @click.stop="clickedItem"
+            @dblclick="goToItem"
             spellcheck="false"
     >
         <!--List preview-->
         <div
-                :draggable="! isDeleted"
+                :draggable="canDrag"
                 @dragstart="$emit('dragstart')"
                 @drop="
 				$emit('drop')
@@ -20,9 +21,9 @@
             <!--Thumbnail for item-->
             <div class="icon-item">
                 <!--If is file or image, then link item-->
-                <span v-if="isFile" class="file-icon-text">{{
-					data.mimetype | limitCharacters
-				}}</span>
+                <span v-if="isFile" class="file-icon-text">
+                    {{ data.mimetype | limitCharacters }}
+                </span>
 
                 <!--Folder thumbnail-->
                 <FontAwesomeIcon v-if="isFile" class="file-icon" icon="file"/>
@@ -37,23 +38,39 @@
             <!--Name-->
             <div class="item-name">
                 <!--Name-->
-                <span
+                <b
                         ref="name"
-                        @input="changeItemName"
-                        :contenteditable="!$isMobile() && !$isTrashLocation()"
+                        @input="renameItem"
+                        :contenteditable="canEditName"
                         class="name"
-                >{{ itemName }}</span>
+                >
+                    {{ itemName }}
+                </b>
 
-                <!--Other attributes-->
-                <span v-if="! isFolder" class="item-size">{{ data.filesize }}, {{ timeStamp }}</span>
+                <div class="item-info">
 
-                <span v-if="isFolder" class="item-length">
-					{{ folderItems == 0 ? $t('folder.empty') : $tc('folder.item_counts', folderItems) }}, {{ timeStamp }}
-				</span>
+                    <!--Shared Icon-->
+                    <div v-if="$checkPermission('master') && data.shared" class="item-shared">
+                        <link-icon size="12" class="shared-icon"></link-icon>
+                    </div>
+
+                    <!--Participant owner Icon-->
+                    <div v-if="$checkPermission('master') && data.user_scope !== 'master'" class="item-shared">
+                        <user-plus-icon size="12" class="shared-icon"></user-plus-icon>
+                    </div>
+
+                    <!--Filesize and timestamp-->
+                    <span v-if="! isFolder" class="item-size">{{ data.filesize }}, {{ timeStamp }}</span>
+
+                    <!--Folder item counts-->
+                    <span v-if="isFolder" class="item-length">
+                        {{ folderItems == 0 ? $t('folder.empty') : $tc('folder.item_counts', folderItems) }}, {{ timeStamp }}
+                    </span>
+                </div>
             </div>
 
             <!--Go Next icon-->
-            <div class="actions" v-if="$isMobile()">
+            <div class="actions" v-if="$isMobile() && ! ( $checkPermission('visitor') && isFolder )">
 				<span @click.stop="showItemActions" class="show-actions">
 					<FontAwesomeIcon icon="ellipsis-v" class="icon-action"></FontAwesomeIcon>
 				</span>
@@ -63,15 +80,20 @@
 </template>
 
 <script>
+    import { LinkIcon, UserPlusIcon } from 'vue-feather-icons'
     import {debounce} from 'lodash'
     import {mapGetters} from 'vuex'
     import {events} from '@/bus'
 
     export default {
-        name: 'FileItem',
+        name: 'FileItemList',
         props: ['data'],
+        components: {
+            UserPlusIcon,
+            LinkIcon,
+        },
         computed: {
-            ...mapGetters(['preview_type']),
+            ...mapGetters(['FilePreviewType']),
             isFolder() {
                 return this.data.type === 'folder'
             },
@@ -81,6 +103,15 @@
             isImage() {
                 return this.data.type === 'image'
             },
+            canEditName() {
+                return !this.$isMobile()
+                    && !this.$isThisLocation(['trash', 'trash-root'])
+                    && !this.$checkPermission('visitor')
+                    && !(this.sharedDetail && this.sharedDetail.type === 'file')
+            },
+            canDrag() {
+                return !this.isDeleted && this.$checkPermission(['master', 'editor'])
+            },
             timeStamp() {
                 return this.data.deleted_at ? this.$t('item_thumbnail.deleted_at', {time: this.data.deleted_at}) : this.data.created_at
             },
@@ -112,7 +143,7 @@
         methods: {
             showItemActions() {
                 // Load file info detail
-                this.$store.dispatch('loadFileInfoDetail', this.data)
+                this.$store.commit('GET_FILEINFO_DETAIL', this.data)
 
                 //this.isClicked = true
 
@@ -137,20 +168,20 @@
                 if (this.$isMobile() && this.isFolder) {
 
                     // Go to folder
-                    this.$store.dispatch('goToFolder', [this.data, false])
+                    if (this.$isThisLocation('public')) {
+                        this.$store.dispatch('browseShared', [{folder: this.data, back: false, init: false}])
+                    } else {
+                        this.$store.dispatch('getFolder', [{folder: this.data, back: false, init: false}])
+                    }
                 }
 
                 // Load file info detail
-                this.$store.dispatch('loadFileInfoDetail', this.data)
+                this.$store.commit('GET_FILEINFO_DETAIL', this.data)
 
                 // Get target classname
                 let itemClass = e.target.className
 
-                if (
-                    ['name', 'icon', 'file-link', 'file-icon-text'].includes(
-                        itemClass
-                    )
-                )
+                if (['name', 'icon', 'file-link', 'file-icon-text'].includes(itemClass))
                     return
             },
             goToItem() {
@@ -166,16 +197,20 @@
                 }
 
                 if (this.isFolder) {
-                    // Go to folder
-                    this.$store.dispatch('goToFolder', [this.data, false])
+
+                    if (this.$isThisLocation('public')) {
+                        this.$store.dispatch('browseShared', [{folder: this.data, back: false, init: false}])
+                    } else {
+                        this.$store.dispatch('getFolder', [{folder: this.data, back: false, init: false}])
+                    }
                 }
             },
-            changeItemName: debounce(function (e) {
+            renameItem: debounce(function (e) {
 
                 // Prevent submit empty string
-                if (e.target.innerText === '') return
+                if (e.target.innerText.trim() === '') return
 
-                this.$store.dispatch('changeItemName', {
+                this.$store.dispatch('renameItem', {
                     unique_id: this.data.unique_id,
                     type: this.data.type,
                     name: e.target.innerText
@@ -199,9 +234,11 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .file-wrapper {
+        user-select: none;
         position: relative;
 
         &:hover {
@@ -233,12 +270,34 @@
             text-overflow: ellipsis;
             white-space: nowrap;
 
+            .item-info {
+                display: block;
+                line-height: 1;
+            }
+
+            .item-shared {
+                display: inline-block;
+
+                .label {
+                    @include font-size(12);
+                    font-weight: 400;
+                    color: $theme;
+                }
+
+                .shared-icon {
+                    vertical-align: middle;
+
+                    path, circle, line {
+                        stroke: $theme;
+                    }
+                }
+            }
+
             .item-size,
             .item-length {
-                @include font-size(12);
+                @include font-size(11);
                 font-weight: 400;
-                color: $text-muted;
-                display: block;
+                color: rgba($text, 0.7);
             }
 
             .name {
@@ -331,6 +390,7 @@
                 border-radius: 5px;
                 width: 50px;
                 height: 50px;
+                pointer-events: none;
             }
         }
 
@@ -359,16 +419,29 @@
     }
 
     @media (prefers-color-scheme: dark) {
+
         .file-wrapper {
 
-            .icon-item .file-icon {
+            .icon-item {
+                .file-icon {
 
-                path {
-                    fill: $dark_mode_foreground;
-                    stroke: #2F3C54;
+                    path {
+                        fill: $dark_mode_foreground;
+                        stroke: #2F3C54;
+                    }
+                }
+
+                .folder-icon {
+
+                    &.is-deleted {
+                        path {
+                            fill: lighten($dark_mode_foreground, 5%);
+                        }
+                    }
                 }
             }
 
+
             .file-item {
 
                 &:hover,
@@ -384,8 +457,16 @@
                 }
             }
 
-            .item-name .name {
-                color: $dark_mode_text_primary;
+            .item-name {
+
+                .name {
+                    color: $dark_mode_text_primary;
+                }
+
+                .item-size,
+                .item-length {
+                    color: $dark_mode_text_secondary;
+                }
             }
         }
     }

resources/js/components/FilesView/FilePreview.vue

@@ -26,7 +26,8 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .preview {
         width: 100%;

resources/js/components/FilesView/MobileActionButton.vue

@@ -0,0 +1,100 @@
+<template>
+    <button class="mobile-action-button">
+        <div class="flex">
+            <folder-plus-icon v-if="icon === 'folder-plus'" size="15" class="icon"></folder-plus-icon>
+            <list-icon v-if="icon === 'th-list'" size="15" class="icon"></list-icon>
+            <trash-icon v-if="icon === 'trash'" size="15" class="icon"></trash-icon>
+            <grid-icon v-if="icon === 'th'" size="15" class="icon"></grid-icon>
+            <user-plus-icon v-if="icon === 'user-plus'" size="15" class="icon"></user-plus-icon>
+            <span class="label">
+                <slot></slot>
+            </span>
+        </div>
+    </button>
+</template>
+
+<script>
+    import { FolderPlusIcon, ListIcon, GridIcon, TrashIcon, UserPlusIcon } from 'vue-feather-icons'
+
+    export default {
+        name: 'MobileActionButton',
+        props: [
+            'icon'
+        ],
+        components: {
+            FolderPlusIcon,
+            UserPlusIcon,
+            TrashIcon,
+            ListIcon,
+            GridIcon,
+        }
+    }
+</script>
+
+<style scoped lang="scss">
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
+
+    .mobile-action-button {
+        background: $light_background;
+        margin-right: 15px;
+        border-radius: 8px;
+        padding: 7px 10px;
+        cursor: pointer;
+        border: none;
+        @include transition(150ms);
+
+        .flex {
+            display: flex;
+            align-items: center;
+        }
+
+        .icon {
+            margin-right: 10px;
+            @include font-size(14);
+
+            path, line, polyline, rect, circle {
+                @include transition(150ms);
+            }
+        }
+
+        .label {
+            @include transition(150ms);
+            @include font-size(14);
+            font-weight: 700;
+            color: $text;
+        }
+
+        &:active {
+            @include transform(scale(0.95));
+        }
+
+        &:hover {
+            background: rgba($theme, 0.1);
+
+            .icon {
+                path, line, polyline, rect, circle {
+                    stroke: $theme;
+                }
+            }
+
+            .label {
+                color: $theme;
+            }
+        }
+    }
+
+    @media (prefers-color-scheme: dark) {
+        .mobile-action-button {
+            background: $dark_mode_foreground;
+
+            path, line, polyline, rect, circle {
+                stroke: $theme;
+            }
+
+            .label {
+                color: $dark_mode_text_primary;
+            }
+        }
+    }
+</style>

resources/js/components/FilesView/MobileActionButtonUpload.vue

@@ -0,0 +1,80 @@
+<template>
+    <button class="mobile-action-button">
+        <div class="flex">
+            <upload-cloud-icon class="icon" size="15"></upload-cloud-icon>
+            <label label="file" class="label button file-input button-base">
+                <slot></slot>
+                <input
+                        @change="emmitFiles"
+                        v-show="false"
+                        id="file"
+                        type="file"
+                        name="files[]"
+                        multiple
+                />
+            </label>
+        </div>
+    </button>
+</template>
+
+<script>
+    import { UploadCloudIcon } from 'vue-feather-icons'
+
+    export default {
+        name: 'MobileActionButtonUpload',
+        components: {
+            UploadCloudIcon,
+        },
+        methods: {
+            emmitFiles(e) {
+                this.$uploadFiles(e.target.files)
+            }
+        }
+    }
+</script>
+
+<style scoped lang="scss">
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
+
+    .mobile-action-button {
+        background: $light_background;
+        margin-right: 15px;
+        border-radius: 8px;
+        padding: 7px 10px;
+        cursor: pointer;
+        border: none;
+
+        .flex {
+            display: flex;
+            align-items: center;
+        }
+
+        .icon {
+            vertical-align: middle;
+            margin-right: 10px;
+            @include font-size(14);
+        }
+
+        .label {
+            vertical-align: middle;
+            @include font-size(14);
+            font-weight: 700;
+            color: $text;
+        }
+    }
+
+    @media (prefers-color-scheme: dark) {
+        .mobile-action-button {
+            background: $dark_mode_foreground;
+
+            path, line, polyline, rect, circle {
+                stroke: $theme;
+            }
+
+            .label {
+                color: $dark_mode_text_primary;
+            }
+        }
+    }
+</style>

resources/js/components/FilesView/MobileActions.vue

@@ -0,0 +1,114 @@
+<template>
+    <div id="mobile-actions-wrapper">
+
+        <!--Actions for trash location with MASTER permission--->
+        <div v-if="$isThisLocation(['trash', 'trash-root']) && $checkPermission('master')" class="mobile-actions">
+            <MobileActionButton @click.native="switchPreview" :icon="previewIcon">
+                {{ previewText }}
+            </MobileActionButton>
+            <MobileActionButton @click.native="$store.dispatch('emptyTrash')" icon="trash">
+                {{ $t('context_menu.empty_trash') }}
+            </MobileActionButton>
+        </div>
+
+        <!--ContextMenu for Base location with MASTER permission-->
+        <div v-if="$isThisLocation(['base', 'public']) && $checkPermission(['master', 'editor'])" class="mobile-actions">
+            <MobileActionButton @click.native="createFolder" icon="folder-plus">
+                {{ $t('context_menu.add_folder') }}
+            </MobileActionButton>
+            <MobileActionButtonUpload>
+                {{ $t('context_menu.upload') }}
+            </MobileActionButtonUpload>
+            <MobileActionButton @click.native="switchPreview" :icon="previewIcon">
+                {{ previewText }}
+            </MobileActionButton>
+        </div>
+
+        <!--ContextMenu for Base location with VISITOR permission-->
+        <div v-if="($isThisLocation(['base', 'shared', 'public']) && $checkPermission('visitor')) || ($isThisLocation(['latest', 'shared']) && $checkPermission('master'))" class="mobile-actions">
+            <MobileActionButton @click.native="switchPreview" :icon="previewIcon">
+                {{ previewText }}
+            </MobileActionButton>
+        </div>
+
+        <!--Upload Progressbar-->
+        <UploadProgress />
+    </div>
+</template>
+
+<script>
+    import MobileActionButtonUpload from '@/components/FilesView/MobileActionButtonUpload'
+    import MobileActionButton from '@/components/FilesView/MobileActionButton'
+    import UploadProgress from '@/components/FilesView/UploadProgress'
+    import {mapGetters} from 'vuex'
+    import {debounce} from 'lodash'
+    import {events} from '@/bus'
+
+    export default {
+        name: 'MobileActions',
+        components: {
+            MobileActionButtonUpload,
+            MobileActionButton,
+            UploadProgress,
+        },
+        computed: {
+            ...mapGetters(['FilePreviewType']),
+            previewIcon() {
+                return this.FilePreviewType === 'list' ? 'th' : 'th-list'
+            },
+            previewText() {
+                return this.FilePreviewType === 'list' ? this.$t('preview_type.grid') : this.$t('preview_type.list')
+            }
+        },
+        methods: {
+            switchPreview() {
+                this.$store.dispatch('changePreviewType')
+            },
+            createFolder() {
+                if (this.$isMobile()) {
+                    // Get folder name
+                    let folderName = prompt(this.$t('popup_create_folder.title'))
+
+                    // Create folder
+                    if (folderName) this.$createFolder(folderName)
+                } else {
+                    // Create folder
+                    this.$createFolder(this.$t('popup_create_folder.folder_default_name'))
+                }
+            },
+        }
+    }
+</script>
+
+<style scoped lang="scss">
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
+
+    #mobile-actions-wrapper {
+        display: none;
+        background: white;
+        position: sticky;
+        top: 35px;
+        z-index: 3;
+    }
+
+    .mobile-actions {
+        padding-top: 10px;
+        padding-bottom: 10px;
+        white-space: nowrap;
+        overflow-x: auto;
+    }
+
+    @media only screen and (max-width: 960px) {
+
+        #mobile-actions-wrapper {
+            display: block;
+        }
+    }
+
+    @media (prefers-color-scheme: dark) {
+        #mobile-actions-wrapper {
+            background: $dark_mode_background;
+        }
+    }
+</style>

resources/js/components/FilesView/MobileMenu.vue

@@ -0,0 +1,487 @@
+<template>
+    <div class="options-wrapper">
+        <transition name="context-menu">
+            <div
+                    v-if="isVisible"
+                    ref="contextmenu"
+                    class="options"
+                    @click="closeAndResetContextMenu"
+            >
+                <div class="menu-wrapper">
+
+                    <!--Item Thumbnail-->
+                    <ThumbnailItem class="item-thumbnail" :item="fileInfoDetail" info="metadata"/>
+
+                    <!--Mobile for trash location-->
+                    <div v-if="$isThisLocation(['trash', 'trash-root']) && $checkPermission('master')" class="menu-options">
+
+                        <ul class="menu-option-group">
+                            <li class="menu-option" @click="$store.dispatch('restoreItem', fileInfoDetail)" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <life-buoy-icon size="17"></life-buoy-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.restore') }}
+                                </div>
+                            </li>
+                            <li class="menu-option delete" @click="deleteItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <trash-2-icon size="17"></trash-2-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.delete') }}
+                                </div>
+                            </li>
+                        </ul>
+
+                        <ul class="menu-option-group" v-if="! isFolder">
+                            <li class="menu-option" @click="downloadItem">
+                                <div class="icon">
+                                    <download-cloud-icon size="17"></download-cloud-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.download') }}
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <!--Mobile for Base location-->
+                    <div v-if="$isThisLocation(['shared']) && $checkPermission('master')" class="menu-options">
+
+                        <ul class="menu-option-group">
+                            <li class="menu-option" @click="addToFavourites" v-if="fileInfoDetail && isFolder">
+                                <div class="icon">
+                                    <star-icon size="17"></star-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ isInFavourites ? $t('context_menu.remove_from_favourites') :
+                                    $t('context_menu.add_to_favourites') }}
+                                </div>
+                            </li>
+                        </ul>
+
+                        <ul class="menu-option-group">
+                            <li class="menu-option" @click="renameItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <edit-2-icon size="17"></edit-2-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.rename') }}
+                                </div>
+                            </li>
+                            <li class="menu-option" @click="shareItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <link-icon size="17"></link-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ fileInfoDetail.shared ? $t('context_menu.share_edit') : $t('context_menu.share') }}
+                                </div>
+                            </li>
+                            <li class="menu-option delete" @click="deleteItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <trash-2-icon size="17"></trash-2-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.delete') }}
+                                </div>
+                            </li>
+                        </ul>
+
+                        <ul class="menu-option-group">
+                            <li class="menu-option" @click="downloadItem" v-if="! isFolder">
+                                <div class="icon">
+                                    <download-cloud-icon size="17"></download-cloud-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.download') }}
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <!--Mobile for Base location-->
+                    <div v-if="$isThisLocation(['base', 'participant_uploads', 'latest']) && $checkPermission('master')" class="menu-options">
+                        <ul class="menu-option-group" v-if="fileInfoDetail && isFolder">
+                            <li class="menu-option" @click="addToFavourites">
+                                <div class="icon">
+                                    <star-icon size="17"></star-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ isInFavourites ? $t('context_menu.remove_from_favourites') :
+                                    $t('context_menu.add_to_favourites') }}
+                                </div>
+                            </li>
+                        </ul>
+
+                        <ul class="menu-option-group">
+                            <li class="menu-option" @click="renameItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <edit-2-icon size="17"></edit-2-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.rename') }}
+                                </div>
+                            </li>
+                            <li class="menu-option" @click="moveItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <corner-down-right-icon size="17"></corner-down-right-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.move') }}
+                                </div>
+                            </li>
+                            <li class="menu-option" @click="shareItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <link-icon size="17"></link-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ fileInfoDetail.shared ? $t('context_menu.share_edit') : $t('context_menu.share') }}
+                                </div>
+                            </li>
+                            <li class="menu-option delete" @click="deleteItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <trash-2-icon size="17"></trash-2-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.delete') }}
+                                </div>
+                            </li>
+                        </ul>
+
+                        <ul class="menu-option-group">
+                            <li class="menu-option" @click="downloadItem" v-if="! isFolder">
+                                <div class="icon">
+                                    <download-cloud-icon size="17"></download-cloud-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.download') }}
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <!--Mobile for Base location with EDITOR permission-->
+                    <div v-if="$isThisLocation(['base', 'public']) && $checkPermission('editor')" class="menu-options">
+
+                        <ul class="menu-option-group">
+                            <li class="menu-option" @click="renameItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <edit-2-icon size="17"></edit-2-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.rename') }}
+                                </div>
+                            </li>
+                            <li class="menu-option" @click="moveItem" v-if="fileInfoDetail">
+                                <div class="icon">
+                                    <corner-down-right-icon size="17"></corner-down-right-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.move') }}
+                                </div>
+                            </li>
+                            <li class="menu-option" @click="deleteItem">
+                                <div class="icon">
+                                    <trash-2-icon size="17"></trash-2-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.delete') }}
+                                </div>
+                            </li>
+                        </ul>
+
+                        <ul class="menu-option-group">
+                            <li class="menu-option" @click="downloadItem" v-if="! isFolder">
+                                <div class="icon">
+                                    <download-cloud-icon size="17"></download-cloud-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.download') }}
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <!--Mobile for Base location with VISITOR permission-->
+                    <div v-if="$isThisLocation(['base', 'public']) && $checkPermission('visitor')" class="menu-options">
+                        <ul class="menu-option-group">
+                            <li class="menu-option" @click="downloadItem" v-if="! isFolder">
+                                <div class="icon">
+                                    <download-cloud-icon size="17"></download-cloud-icon>
+                                </div>
+                                <div class="text-label">
+                                    {{ $t('context_menu.download') }}
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </transition>
+        <transition name="fade">
+            <div v-show="isVisible" class="vignette" @click="closeAndResetContextMenu"></div>
+        </transition>
+    </div>
+</template>
+
+<script>
+    import ThumbnailItem from '@/components/Others/ThumbnailItem'
+    import {
+        CornerDownRightIcon,
+        DownloadCloudIcon,
+        FolderPlusIcon,
+        LifeBuoyIcon,
+        Trash2Icon,
+        Edit2Icon,
+        TrashIcon,
+        StarIcon,
+        LinkIcon,
+        EyeIcon,
+    } from 'vue-feather-icons'
+    import {events} from '@/bus'
+    import {mapGetters} from 'vuex'
+
+    export default {
+        name: 'MobileMenu',
+        components: {
+            CornerDownRightIcon,
+            DownloadCloudIcon,
+            FolderPlusIcon,
+            ThumbnailItem,
+            LifeBuoyIcon,
+            Trash2Icon,
+            Edit2Icon,
+            TrashIcon,
+            LinkIcon,
+            StarIcon,
+            EyeIcon,
+        },
+        computed: {
+            ...mapGetters(['fileInfoDetail', 'app']),
+            isInFavourites() {
+                return this.app.favourites.find(el => el.unique_id == this.fileInfoDetail.unique_id)
+            },
+            isFile() {
+                return (this.fileInfoDetail && this.fileInfoDetail.type !== 'folder') && (this.fileInfoDetail && this.fileInfoDetail.type !== 'image')
+            },
+            isImage() {
+                return this.fileInfoDetail && this.fileInfoDetail.type === 'image'
+            },
+            isFolder() {
+                return this.fileInfoDetail && this.fileInfoDetail.type === 'folder'
+            }
+        },
+        data() {
+            return {
+                isVisible: false
+            }
+        },
+        methods: {
+            moveItem() {
+                // Open move item popup
+                events.$emit('popup:open', {name: 'move', item: this.fileInfoDetail})
+            },
+            shareItem() {
+                if (this.fileInfoDetail.shared) {
+                    // Open share item popup
+                    events.$emit('popup:open', {name: 'share-edit', item: this.fileInfoDetail})
+                } else {
+                    // Open share item popup
+                    events.$emit('popup:open', {name: 'share-create', item: this.fileInfoDetail})
+                }
+            },
+            addToFavourites() {
+                if (this.app.favourites && !this.app.favourites.find(el => el.unique_id == this.fileInfoDetail.unique_id)) {
+                    this.$store.dispatch('addToFavourites', this.fileInfoDetail)
+                } else {
+                    this.$store.dispatch('removeFromFavourites', this.fileInfoDetail)
+                }
+            },
+            downloadItem() {
+                this.$downloadFile(
+                    this.fileInfoDetail.file_url,
+                    this.fileInfoDetail.name + '.' + this.fileInfoDetail.mimetype
+                )
+            },
+            deleteItem() {
+                this.$store.dispatch('deleteItem', this.fileInfoDetail)
+            },
+            renameItem() {
+                let itemName = prompt(
+                    this.$t('popup_rename.title'),
+                    this.fileInfoDetail.name
+                )
+
+                if (itemName && itemName !== '') {
+
+                    let item = {
+                        unique_id: this.fileInfoDetail.unique_id,
+                        type: this.fileInfoDetail.type,
+                        name: itemName
+                    }
+
+                    this.$store.dispatch('renameItem', item)
+
+                    // Change item name if is mobile device or prompted
+                    if (this.$isMobile()) {
+                        events.$emit('change:name', item)
+                    }
+                }
+            },
+            closeAndResetContextMenu() {
+                events.$emit('fileItem:deselect')
+
+                // Close context menu
+                this.isVisible = false
+            }
+        },
+        created() {
+
+            // Show context menu
+            events.$on('mobileMenu:show', () => {
+                this.isVisible = !this.isVisible
+            })
+
+            // Hide mobile menu
+            events.$on('mobileMenu:hide', () => {
+                this.isVisible = false
+            })
+        }
+    }
+</script>
+
+<style scoped lang="scss">
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
+
+    .menu-option {
+        display: flex;
+        align-items: center;
+
+        .icon {
+            margin-right: 20px;
+            line-height: 0;
+        }
+
+        .text-label {
+            @include font-size(16);
+        }
+    }
+
+    .vignette {
+        background: rgba(0, 0, 0, 0.35);
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        z-index: 9;
+        cursor: pointer;
+        opacity: 1;
+    }
+
+    .options {
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        z-index: 99;
+        overflow: hidden;
+        background: white;
+        border-top-left-radius: 12px;
+        border-top-right-radius: 12px;
+
+        &.showed {
+            display: block;
+        }
+
+        .item-thumbnail {
+            padding: 20px 20px 10px;
+            margin-bottom: 0px;
+        }
+
+        .menu-options {
+            margin-top: 10px;
+            list-style: none;
+            width: 100%;
+
+            .menu-option-group {
+                padding: 5px 0;
+                border-bottom: 1px solid $light_mode_border;
+
+                &:first-child {
+                    padding-top: 0;
+                }
+
+                &:last-child {
+                    padding-bottom: 0;
+                    border-bottom: none;
+                }
+            }
+
+            .menu-option {
+                font-weight: 700;
+                letter-spacing: 0.15px;
+                @include font-size(14);
+                cursor: pointer;
+                width: 100%;
+                padding: 17px 20px;
+                text-align: center;
+
+                &:last-child {
+                    border: none;
+                }
+            }
+        }
+    }
+
+    @media (prefers-color-scheme: dark) {
+
+        .vignette {
+            background: $dark_mode_vignette;
+        }
+
+        .options {
+            background: $dark_mode_background;
+
+            .menu-options {
+                background: $dark_mode_background;
+
+                .menu-option-group {
+                    border-color: $dark_mode_border_color;
+                }
+
+                .menu-option {
+                    color: $dark_mode_text_primary;
+                }
+            }
+        }
+    }
+
+    // Transition
+    .context-menu-enter-active,
+    .fade-enter-active {
+        transition: all 200ms;
+    }
+
+    .context-menu-leave-active,
+    .fade-leave-active {
+        transition: all 200ms;
+    }
+
+    .fade-enter,
+    .fade-leave-to {
+        opacity: 0;
+    }
+
+    .context-menu-enter,
+    .context-menu-leave-to {
+        opacity: 0;
+        transform: translateY(100%);
+    }
+
+    .context-menu-leave-active {
+        position: absolute;
+    }
+</style>

resources/js/components/FilesView/MobileToolbar.vue

@@ -3,79 +3,73 @@
 
         <!-- Go back-->
         <div @click="goBack" class="go-back-button">
-            <FontAwesomeIcon
-                    :class="{'is-visible': browseHistory.length > 0}"
-                    class="icon-back"
-                    icon="chevron-left"
-            ></FontAwesomeIcon>
+            <chevron-left-icon size="17" :class="{'is-visible': browseHistory.length > 1}" class="icon-back"></chevron-left-icon>
         </div>
 
         <!--Folder Title-->
         <div class="directory-name">{{ directoryName }}</div>
 
         <!--More Actions-->
-        <div class="more-actions-button" @click="showSidebarMenu">
-            <div class="tap-area">
-                <FontAwesomeIcon icon="bars" v-if="isSmallAppSize"></FontAwesomeIcon>
+        <div class="more-actions-button">
+            <div class="tap-area" @click="showMobileNavigation" v-if="$checkPermission('master')">
+                <menu-icon size="17"></menu-icon>
             </div>
         </div>
     </div>
 </template>
 
 <script>
-    import ToolbarButtonUpload from '@/components/VueFileManagerComponents/FilesView/ToolbarButtonUpload'
-    import ToolbarButton from '@/components/VueFileManagerComponents/FilesView/ToolbarButton'
-    import SearchBar from '@/components/VueFileManagerComponents/FilesView/SearchBar'
+    import ToolbarButtonUpload from '@/components/FilesView/ToolbarButtonUpload'
+    import ToolbarButton from '@/components/FilesView/ToolbarButton'
+    import SearchBar from '@/components/FilesView/SearchBar'
+    import { MenuIcon, ChevronLeftIcon } from 'vue-feather-icons'
     import {mapGetters} from 'vuex'
     import {events} from '@/bus'
+    import {last} from 'lodash'
 
     export default {
         name: 'MobileToolBar',
         components: {
             ToolbarButtonUpload,
+            ChevronLeftIcon,
             ToolbarButton,
-            SearchBar
+            SearchBar,
+            MenuIcon,
         },
         computed: {
             ...mapGetters([
                 'fileInfoVisible',
+                'FilePreviewType',
                 'fileInfoDetail',
                 'currentFolder',
                 'browseHistory',
                 'homeDirectory',
-                'preview_type',
-                'appSize',
             ]),
             directoryName() {
                 return this.currentFolder ? this.currentFolder.name : this.homeDirectory.name
-            },
-            previousFolder() {
-                const length = this.browseHistory.length - 2
-
-                return this.browseHistory[length] ? this.browseHistory[length] : this.homeDirectory
-            },
-            isSmallAppSize() {
-                return this.appSize === 'small'
-            }
-        },
-        data() {
-            return {
-                isSidebarMenu: false,
             }
         },
         methods: {
-            showSidebarMenu() {
-                this.isSidebarMenu = ! this.isSidebarMenu
-                events.$emit('show:sidebar')
+            showMobileNavigation() {
+                events.$emit('show:mobile-navigation')
             },
             goBack() {
 
-                if (this.previousFolder.location === 'trash-root') {
+                let previousFolder = last(this.browseHistory)
+
+                if (previousFolder.location === 'trash-root') {
                     this.$store.dispatch('getTrash')
-                    this.$store.commit('FLUSH_BROWSER_HISTORY')
+
+                } else if (previousFolder.location === 'shared') {
+                    this.$store.dispatch('getShared')
 
                 } else {
-                    this.$store.dispatch('goToFolder', [this.previousFolder, true])
+
+                    if ( this.$isThisLocation('public') ) {
+                        this.$store.dispatch('browseShared', [{folder: previousFolder, back: true, init: false}])
+                    } else {
+                        this.$store.dispatch('getFolder', [{folder: previousFolder, back: true, init: false}])
+                    }
                 }
             },
         },
@@ -89,13 +83,13 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
-
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .mobile-toolbar {
         background: white;
         text-align: center;
-        display: flex;
+        display: none;
         padding: 10px 0;
         position: sticky;
         top: 0;
@@ -117,6 +111,7 @@
                 cursor: pointer;
                 opacity: 0;
                 visibility: hidden;
+                margin-top: -2px;
 
                 &.is-visible {
                     opacity: 1;
@@ -150,10 +145,21 @@
                 position: absolute;
                 right: -10px;
                 top: -20px;
+
+                path, line, polyline, rect, circle {
+                    stroke: $text;
+                }
             }
         }
     }
 
+    @media only screen and (max-width: 960px) {
+
+        .mobile-toolbar {
+            display: flex;
+        }
+    }
+
     @media (prefers-color-scheme: dark) {
 
         .mobile-toolbar {
@@ -163,8 +169,11 @@
                 color: $dark_mode_text_primary;
             }
 
-            .more-actions-button svg path {
-                fill: $dark_mode_text_primary;
+            .more-actions-button .tap-area {
+
+                path, line, polyline, rect, circle {
+                    stroke: $dark_mode_text_primary;
+                }
             }
         }
     }

resources/js/components/FilesView/ProgressBar.vue

@@ -12,7 +12,8 @@ export default {
 </script>
 
 <style scoped lang="scss">
-	@import "@assets/app.scss";
+	@import '@assets/vue-file-manager/_variables';
+	@import '@assets/vue-file-manager/_mixins';
 
 	.progress-bar {
 		width: 100%;

resources/js/components/FilesView/SearchBar.vue

@@ -1,5 +1,11 @@
 <template>
     <div class="search-bar">
+        <div class="icon" v-if="!isQuery">
+            <search-icon size="19"></search-icon>
+        </div>
+        <div class="icon" v-if="isQuery" @click="resetQuery">
+            <x-icon class="pointer" size="19"></x-icon>
+        </div>
         <input
                 v-model="query"
                 class="query"
@@ -7,22 +13,21 @@
                 name="query"
                 :placeholder="$t('inputs.placeholder_search_files')"
         />
-        <div class="icon" v-if="!isQuery">
-            <FontAwesomeIcon icon="search"></FontAwesomeIcon>
-        </div>
-        <div class="icon" v-if="isQuery" @click="resetQuery">
-            <FontAwesomeIcon icon="times" class="pointer"></FontAwesomeIcon>
-        </div>
     </div>
 </template>
 
 <script>
+    import { SearchIcon, XIcon } from 'vue-feather-icons'
     import {mapGetters} from 'vuex'
     import {debounce} from 'lodash'
     import {events} from '@/bus'
 
     export default {
         name: 'SearchBar',
+        components: {
+            SearchIcon,
+            XIcon,
+        },
         computed: {
             ...mapGetters(['currentFolder']),
             isQuery() {
@@ -49,11 +54,13 @@
                     this.$store.dispatch('getSearchResult', value)
                 } else if (typeof value !== 'undefined') {
                     if (this.currentFolder) {
+
                         // Get back after delete query to previosly folder
-                        this.$store.dispatch('goToFolder', [
-                            this.currentFolder,
-                            true
-                        ])
+                        if ( this.$isThisLocation('public') ) {
+                            this.$store.dispatch('browseShared', [{folder: this.currentFolder, back: true, init: false}])
+                        } else {
+                            this.$store.dispatch('getFolder', [{folder: this.currentFolder, back: true, init: false}])
+                        }
                     }
 
                     this.$store.commit('CHANGE_SEARCHING_STATE', false)
@@ -67,20 +74,20 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     .search-bar {
         position: relative;
 
         input {
-            //width: 100%;
-            background: $light_background;
+            background: transparent;
             border-radius: 8px;
             outline: 0;
-            padding: 9px 20px;
-            font-weight: 100;
+            padding: 9px 20px 9px 43px;
+            font-weight: 400;
             @include font-size(16);
-            min-width: 380px;
+            min-width: 175px;
             transition: 0.15s all ease;
             border: 1px solid white;
             -webkit-appearance: none;
@@ -88,7 +95,7 @@
             &::placeholder {
                 color: $text;
                 @include font-size(14);
-                font-weight: 400;
+                font-weight: 500;
             }
 
             &:focus {
@@ -106,8 +113,8 @@
         .icon {
             position: absolute;
             top: 0;
-            right: 0;
-            padding: 10px 15px;
+            left: 0;
+            padding: 11px 15px;
 
             .pointer {
                 cursor: pointer;
@@ -115,11 +122,42 @@
         }
     }
 
+    @media only screen and (max-width: 1024px) {
+
+        .search-bar input {
+            max-width: 190px;
+            padding-right: 0;
+        }
+    }
+
+    @media only screen and (max-width: 690px) {
+
+        .search-bar {
+
+            input {
+                min-width: initial;
+                width: 100%;
+                max-width: initial;
+                padding: 9px 20px 9px 30px;
+
+                &:focus {
+                    border: 1px solid transparent;
+                    box-shadow: none;
+                }
+            }
+
+            .icon {
+                padding: 11px 15px 11px 0;
+            }
+        }
+
+    }
+
     @media (prefers-color-scheme: dark) {
         .search-bar {
             input {
-                background: $dark_mode_foreground;
-                border-color: $dark_mode_foreground;
+                border-color: transparent;
+                color: $dark_mode_text_primary;
 
                 &::placeholder {
                     color: $dark_mode_text_secondary;

resources/js/components/FilesView/Spinner.vue

@@ -11,7 +11,8 @@
 </script>
 
 <style scoped lang="scss">
-    @import "@assets/app.scss";
+    @import '@assets/vue-file-manager/_variables';
+    @import '@assets/vue-file-manager/_mixins';
 
     #loading-bar-spinner.spinner {
         left: 50%;