Index: resources/views/dashboard/index.blade.php
===================================================================
--- resources/views/dashboard/index.blade.php	(revision c6b84df06586305606df5b76204a64cdc63b09a2)
+++ resources/views/dashboard/index.blade.php	(revision 53d99cebee74350778be99bdbd54a4279a1896c4)
@@ -1,17 +1,11 @@
 @extends('layouts.app')
 
+@section("title", "SaveSpace - Dashboard")
+
 @section('head')
-    <!-- Slick -->
-    <link rel="stylesheet" href="{{ url('/vendors/slick/slick.css') }}" type="text/css">
-    <link rel="stylesheet" href="{{ url('/vendors/slick/slick-theme.css') }}" type="text/css">
-
-    <!-- Daterangepicker -->
-    <link rel="stylesheet" href="{{ url('vendors/datepicker/daterangepicker.css') }}" type="text/css">
 
     <!-- DataTable -->
     <link rel="stylesheet" href="{{ url('vendors/dataTable/datatables.min.css') }}" type="text/css">
 @endsection
-
-@section('pageTitle', 'Dashboard')
 
 @section('content')
@@ -58,5 +52,5 @@
                             <div class="d-flex justify-content-between mb-3">
                                 <div>
-                                    <p class="text-muted">Total Folders</p>
+                                    <p class="text-muted">Number of folders</p>
                                     <h2 class="font-weight-bold">{{ $folders->count() }}</h2>
                                 </div>
@@ -103,120 +97,13 @@
     </div>
 
-    <div class="row">
-        <div class="col-lg-8 col-md-12">
-            <div class="card">
-                <div class="card-body">
-                    <div class="d-flex justify-content-between">
-                        <h6 class="card-title">Revenue</h6>
-                        <div>
-                            <a href="#" class="btn btn-outline-light btn-sm mr-2">
-                                <i class="fa fa-refresh"></i>
-                            </a>
-                            <div class="dropdown">
-                                <a href="#" data-toggle="dropdown"
-                                   class="btn btn-outline-light btn-sm"
-                                   aria-haspopup="true" aria-expanded="false">
-                                    <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
-                                </a>
-                                <div class="dropdown-menu dropdown-menu-right">
-                                    <a class="dropdown-item" href="#">Action</a>
-                                    <a class="dropdown-item" href="#">Another action</a>
-                                    <a class="dropdown-item" href="#">Something else here</a>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="row mb-3">
-                        <div class="col-lg-4">
-                            <p class="mb-2">This Week</p>
-                            <div class="d-flex align-items-end">
-                                <h2 class="mb-0 line-height-30 font-size-35">$235</h2>
-                                <span class="text-success small ml-2 d-flex align-items-center">
-                                    <span class="ti-arrow-up mr-2"></span>
-                                    <span class="badge badge-success rounded d-inline-flex align-items-center">1.9%</span>
-                                </span>
-                            </div>
-                        </div>
-                        <div class="col-lg-4">
-                            <p class="mb-2">Last Week</p>
-                            <div class="d-flex align-items-end">
-                                <h2 class="mb-0 line-height-30 font-size-35">$5,180</h2>
-                                <span class="text-danger small ml-2 d-flex align-items-center">
-                                    <span class="ti-arrow-down mr-2"></span>
-                                    <span class="badge badge-danger rounded d-inline-flex align-items-center">1.9%</span>
-                                </span>
-                            </div>
-                        </div>
-                    </div>
-                    <div id="revenue"></div>
-                </div>
-            </div>
-
-        </div>
-        <div class="col-lg-4 col-md-12">
-            <div class="card">
-                <div class="card-body">
-                    <div class="d-flex justify-content-between">
-                        <h6 class="card-title">Hot Products</h6>
-                        <div>
-                            <div class="dropdown">
-                                <a href="#" data-toggle="dropdown"
-                                   class="btn btn-outline-light btn-sm"
-                                   aria-haspopup="true" aria-expanded="false">
-                                    <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
-                                </a>
-                                <div class="dropdown-menu dropdown-menu-right">
-                                    <a class="dropdown-item" href="#">Action</a>
-                                    <a class="dropdown-item" href="#">Another action</a>
-                                    <a class="dropdown-item" href="#">Something else here</a>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <div id="hot-products"></div>
-                    <div>
-                        <ul class="list-group list-group-flush">
-                            <li class="list-group-item pl-0 pr-0">
-                                <i class="fa fa-circle mr-1 text-secondary"></i> Iphone
-                            </li>
-                            <li class="list-group-item pl-0 pr-0">
-                                <i class="fa fa-circle mr-1 text-warning"></i> Samsung
-                            </li>
-                            <li class="list-group-item pl-0 pr-0">
-                                <i class="fa fa-circle mr-1 text-info"></i> Huawei
-                            </li>
-                            <li class="list-group-item pl-0 pr-0">
-                                <i class="fa fa-circle mr-1 text-success"></i> General Mobile
-                            </li>
-                            <li class="list-group-item pl-0 pr-0">
-                                <i class="fa fa-circle mr-1 text-danger"></i> Xiaomi
-                            </li>
-                        </ul>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
 
     <div class="card">
         <div class="card-body">
             <div class="d-flex justify-content-between">
-                <h6 class="card-title">Recent Orders</h6>
+                <h6 class="card-title">Recent Files</h6>
                 <div>
-                    <a href="#" class="btn btn-outline-light btn-sm mr-2">
+                    <a href="{{route("dashboard.index")}}" class="btn btn-outline-light btn-sm mr-2">
                         <i class="fa fa-refresh"></i>
                     </a>
-                    <div class="dropdown">
-                        <a href="#" data-toggle="dropdown"
-                           class="btn btn-outline-light btn-sm"
-                           aria-haspopup="true" aria-expanded="false">
-                            <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
-                        </a>
-                        <div class="dropdown-menu dropdown-menu-right">
-                            <a class="dropdown-item" href="#">Action</a>
-                            <a class="dropdown-item" href="#">Another action</a>
-                            <a class="dropdown-item" href="#">Something else here</a>
-                        </div>
-                    </div>
                 </div>
             </div>
@@ -227,276 +114,140 @@
                             <thead>
                             <tr>
-                                <th>ID</th>
-                                <th>Product Name</th>
-                                <th>Customer</th>
-                                <th>Total Price</th>
-                                <th>Status</th>
-                                <th>Date</th>
-                                <th>Action</th>
+                                <th>
+                                </th>
+                                <th>Image</th>
+                                <th>Name</th>
+                                <th>Created at</th>
+                                <th>Updated at</th>
+                                <th>Folder name</th>
+                                <th>Folder archive ID</th>
+                                <th>Directory</th>
+                                <th>Actions</th>
                             </tr>
                             </thead>
                             <tbody>
-                            <tr>
-                                <td>
-                                    <a href="#">3145</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product1.png') }}"
-                                             class="rounded mr-3" alt="grape">
-                                        <span>HP Pavilion 15-EC0005NT AMD</span>
-                                    </a>
-                                </td>
-                                <td>Dollie Bullock</td>
-                                <td>$230</td>
-                                <td>
-                                    <span
-                                        class="badge bg-secondary-bright text-secondary">On pre-order (not paid)</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>
-                                    <a href="#">7321</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product2.png') }}"
-                                             class="rounded mr-3" alt="banana">
-                                        <span>Samsung Galaxy A51 128 GB</span>
-                                    </a>
-                                </td>
-                                <td>Holmes Hines</td>
-                                <td>$300</td>
-                                <td>
-                                    <span class="badge bg-success-bright text-success">Payment accepted</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>
-                                    <a href="#">9342</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product3.png') }}"
-                                             class="rounded mr-3" alt="cherry">
-                                        <span>Snopy SN-BT96 Pretty</span>
-                                    </a>
-                                </td>
-                                <td>Serena Glover</td>
-                                <td>$250</td>
-                                <td>
-                                    <span class="badge bg-danger-bright text-danger">Payment error</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>
-                                    <a href="#">6416</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product4.png') }}"
-                                             class="rounded mr-3" alt="papaya">
-                                        <span>Ultimate Ears Wonderboom</span>
-                                    </a>
-                                </td>
-                                <td>Dianne Prince</td>
-                                <td>$550</td>
-                                <td>
-                                    <span class="badge bg-success-bright text-success">Payment accepted</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>
-                                    <a href="#">92327</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product5.png') }}"
-                                             class="rounded mr-3" alt="pig">
-                                        <span>Canon Pixma E3140 Printer</span>
-                                    </a>
-                                </td>
-                                <td>Morgan Pitts</td>
-                                <td>$280</td>
-                                <td>
-                                    <span class="badge bg-warning-bright text-warning">Preparing the order</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>
-                                    <a href="#">3013</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product6.png') }}"
-                                             class="rounded mr-3" alt="pineapple">
-                                        <span>Canon 4000D 18-55 MM</span>
-                                    </a>
-                                </td>
-                                <td>Merrill Richardson</td>
-                                <td>$128</td>
-                                <td>
-                                    <span class="badge bg-info-bright text-info">Awaiting PayPal payment</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>
-                                    <a href="#">10323</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product7.png') }}"
-                                             class="rounded mr-3" alt="pomegranate">
-                                        <span>Lenovo Tab E10 TB-X104F 32GB 10.1"</span>
-                                    </a>
-                                </td>
-                                <td>Krista Mathis</td>
-                                <td>$500</td>
-                                <td>
-                                    <span class="badge bg-secondary-bright text-secondary">Shipped</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>
-                                    <a href="#">4218</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product8.png') }}"
-                                             class="rounded mr-3" alt="raspberry">
-                                        <span>Samsung 55Q60RAT 55"</span>
-                                    </a>
-                                </td>
-                                <td>Frankie Hewitt</td>
-                                <td>$300</td>
-                                <td>
-                                    <span class="badge bg-success-bright text-success">Remote payment accepted</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>
-                                    <a href="#">3158</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product9.png') }}"
-                                             class="rounded mr-3" alt="strawberry">
-                                        <span>Toshiba Canvio Basic 1TB 2.5"</span>
-                                    </a>
-                                </td>
-                                <td>Hayden Fitzgerald</td>
-                                <td>$200</td>
-                                <td>
-                                    <span class="badge bg-success-bright text-success">Delivered</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <td>
-                                    <a href="#">9610</a>
-                                </td>
-                                <td>
-                                    <a href="testproduct-detail') }}" class="d-flex align-items-center">
-                                        <img width="40" src="{{ url('assets/media/image/products/product10.png') }}"
-                                             class="rounded mr-3" alt="watermelon">
-                                        <span>Fms Wireless Controller</span>
-                                    </a>
-                                </td>
-                                <td>Cole Holcomb</td>
-                                <td>$700</td>
-                                <td>
-                                    <span
-                                        class="badge bg-secondary-bright text-secondary">On pre-order (not paid)</span>
-                                </td>
-                                <td>2018/08/28 21:24:36</td>
-                                <td>
-                                    <a href="#" class="text-secondary" data-toggle="tooltip" title="Edit">
-                                        <i class="ti-pencil"></i>
-                                    </a>
-                                    <a href="#" class="text-danger ml-2" data-toggle="tooltip" title="Delete">
-                                        <i class="ti-trash"></i>
-                                    </a>
-                                </td>
-                            </tr>
+                            @foreach($recentFiles as $file)
+                                <tr>
+                                    <td></td>
+                                    <td>
+                                        @if(in_array(explode('.', $file->name)[1], $excelExt))
+                                            <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
+                                                <i class="fa fa-file-excel-o text-success fa-2x"></i>
+                                            </div>
+                                        @else @if(in_array(explode('.', $file->name)[1], $textExt))
+                                            <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
+                                                <i class="fa fa-file-word-o text-info fa-2x"></i>
+                                            </div>
+                                        @else @if(explode('.', $file->name)[1] == 'pdf')
+                                                <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
+                                                    <i class="fa fa-file-pdf-o text-danger fa-2x"></i>
+                                                </div>
+                                            @else @if(in_array(explode('.', $file->name)[1], $imageExt))
+                                                    <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
+                                                        <a href="{{ url('/uploads/' . $file->location) }}" class="image-popup-gallery-item">
+                                                            <div class="image-hover">
+                                                                <img src="{{ url('/uploads/' . $file->location) }}" class="rounded" width="30" alt="image">
+                                                            </div>
+                                                        </a>
+                                                    </div>
+                                                @else
+                                                    <div class="col-xl-1 col-lg-1 col-md-1 col-sm-2">
+                                                        <i class="fa fa-file-text-o text-warning fa-2x"></i>
+                                                    </div>
+                                                @endif
+                                            @endif
+                                        @endif
+                                        @endif
+
+
+                                    </td>
+                                    <td>{{ $file->name }}</td>
+                                    <td>{{ date('d.m.Y - H:i', strtotime($file->created_at)) }}</td>
+                                    @if($file->updated_at==NULL)
+                                        <td>/</td>
+                                    @else
+                                        <td>{{ date('d.m.Y - H:i', strtotime($file->updated_at)) }}</td>
+                                    @endif
+                                    <td><a href="{{ route('dashboard.folders.files', ['id' => $file->folder_id]) }}" class="text-linkedin">{{ \App\Models\Folder::find($file->folder_id)->name }}</a></td>
+                                    <td>{{ \App\Models\Folder::find($file->folder_id)->arch_id }}</td>
+                                    <!-- Trigger -->
+                                    <td><button data-clipboard-text="{{$file->location}}" class="btn btn-sm btn-primary text-white" data-toggle="tooltip" data-placement="right" title="{{$file->location}}"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-clipboard" viewBox="0 0 16 16">
+                                                <path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/>
+                                                <path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/>
+                                            </svg></button>
+                                    </td>
+                                    <td>
+                                        <a href="javascript:void(0)" class="text-secondary" data-toggle="modal" data-target="#editModal_{{$file->id}}" title="Edit">
+                                            <i class="ti-pencil"></i>
+                                        </a>
+                                        <a href="{{ route("dashboard.files.downloadFile", ['id' => $file->id]) }}" class="text-danger ml-2"title="Download">
+                                            <i class="ti-download"></i>
+                                        </a>
+                                        <a href="javascript:void(0)" class="text-danger ml-2" data-toggle="modal" data-target="#deleteModal_{{$file->id}}" title="Delete">
+                                            <i class="ti-trash"></i>
+                                        </a>
+                                    </td>
+                                </tr>
+                                <div class="modal fade" id="deleteModal_{{$file->id}}" tabindex="-1" role="dialog" aria-hidden="true">
+                                    <div class="modal-dialog modal-dialog-centered" role="document">
+                                        <div class="modal-content">
+                                            <div class="modal-header">
+                                                <h5 class="modal-title" id="exampleModalCenterTitle">Delete confirmation</h5>
+                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                                    <i class="ti-close"></i>
+                                                </button>
+                                            </div>
+                                            <div class="modal-body">
+                                                <form action="{{ route("dashboard.files.deleteFile", $file->id) }}" method="POST">
+                                                    @csrf
+                                                    @method('DELETE')
+                                                    <p>Are you sure you want to delete file {{$file->name}}?</p>
+                                                    <p>Location: <span class="pr-1">{{$file->location}}</span></p>
+                                                    <div class="modal-footer">
+                                                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close
+                                                        </button>
+                                                        <button type="submit" class="btn btn-primary">Save changes</button>
+                                                    </div>
+                                                </form>
+                                            </div>
+
+                                        </div>
+                                    </div>
+                                </div>
+
+                                <div class="modal fade" id="editModal_{{$file->id}}" tabindex="-1" role="dialog" aria-hidden="true">
+                                    <div class="modal-dialog modal-dialog-centered" role="document">
+                                        <div class="modal-content">
+                                            <div class="modal-header">
+                                                <h5 class="modal-title" id="exampleModalCenterTitle">Rename file</h5>
+                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                                                    <i class="ti-close"></i>
+                                                </button>
+                                            </div>
+                                            <div class="modal-body">
+                                                <form action="{{ route("dashboard.files.renameFile", ["id" =>$file->id]) }}" method="post" accept-charset="utf-8">
+                                                    @method("patch")
+                                                    @csrf
+                                                    <div class="row">
+                                                        <div class="col-md-12">
+                                                            <div class="form-group">
+                                                                <label class="form-label">Current name: {{$file->name}}</label>
+                                                                <input type="text" name="name" value="{{ explode('.', $file->name)[0] }}" maxlength="255" title="Don't include: '\/.|'" pattern="^[^.\/|]+$" class="form-control" required>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                    <br/>
+                                                    <div class="modal-footer">
+                                                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close
+                                                        </button>
+                                                        <button type="submit" class="btn btn-primary">Save changes</button>
+                                                    </div>
+                                                </form>
+                                            </div>
+
+                                        </div>
+                                    </div>
+                                </div>
+                            @endforeach
                             </tbody>
                         </table>
@@ -512,12 +263,6 @@
                 <div class="card-body">
                     <div class="d-md-flex mb-2 mb-sm-0 justify-content-between">
-                        <h6 class="card-title">Activities</h6>
-                        <div>
-                            <div id="reportrange" class="form-control">
-                                <span></span>
-                            </div>
-                        </div>
-                    </div>
-                    <div id="ecommerce-activity-chart"></div>
+                        <canvas id="canvas"></canvas>
+                    </div>
                 </div>
             </div>
@@ -527,6 +272,6 @@
                 <div class="card-body pb-0">
                     <div class="d-flex justify-content-between align-items-start mb-3">
-                        <h6 class="card-title mb-0">Top Sales</h6>
-                        <a href="#" class="small">All Sales</a>
+                        <h6 class="card-title mb-0">Largest departments</h6>
+                        <a href="{{route("dashboard.departments.index")}}" class="small text-linkedin">View</a>
                     </div>
                 </div>
@@ -535,57 +280,20 @@
                         <thead>
                         <tr>
-                            <th>Product</th>
-                            <th>Total Sales</th>
+                            <th>Department</th>
+                            <th>Number of folders</th>
                         </tr>
                         </thead>
                         <tbody>
+                        @foreach($largestDepartments as $department)
                         <tr>
+
                             <td>
-                                <a href="#">Apple</a>
+                                <a href="#">{{$department->name}}</a>
                             </td>
-                            <td>21</td>
+                            <td>
+                                <a href="#">{{$department->no_of_folders}}</a>
+                            </td>
                         </tr>
-                        <tr>
-                            <td>
-                                <a href="#">Samsung <span class="badge badge-danger ml-1">New</span></a>
-                            </td>
-                            <td>52</td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <a href="#">Huawei</a>
-                            </td>
-                            <td>74</td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <a href="#">General Mobile</a>
-                            </td>
-                            <td>25</td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <a href="#">Xiaomi</a>
-                            </td>
-                            <td>11</td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <a href="#">Nokia</a>
-                            </td>
-                            <td>8</td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <a href="#">Sony</a>
-                            </td>
-                            <td>5</td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <a href="#">Alcatel</a>
-                            </td>
-                            <td>5</td>
-                        </tr>
+                        @endforeach
                         </tbody>
                     </table>
@@ -594,390 +302,4 @@
         </div>
     </div>
-
-    <div class="row">
-        <div class="col-md-6">
-            <div class="card">
-                <div class="card-body">
-                    <h6 class="card-title d-flex justify-content-between">
-                        <span>Income Distribution</span>
-                        <span class="dropdown">
-                            <a class="btn btn-outline-light btn-sm dropdown-toggle" href="#"
-                               data-toggle="dropdown">USA</a>
-                            <span class="dropdown-menu dropdown-menu-right">
-                                <a href="#" class="dropdown-item">USA</a>
-                                <a href="#" class="dropdown-item">Germany</a>
-                                <a href="#" class="dropdown-item">France</a>
-                                <a href="#" class="dropdown-item">Italy</a>
-                            </span>
-                        </span>
-                    </h6>
-                    <div id="vmap_usa_en" style="height: 300px"></div>
-                </div>
-                <div class="table-responsive">
-                    <table class="table table-borderless table-lg table-striped mb-0">
-                        <thead>
-                        <tr>
-                            <th class="wd-40">States</th>
-                            <th class="wd-25 text-center">Orders</th>
-                            <th class="wd-35 text-center">Earnings</th>
-                            <th class="wd-35"></th>
-                        </tr>
-                        </thead>
-                        <tbody>
-                        <tr>
-                            <td>California</td>
-                            <td class="text-center">12,201</td>
-                            <td class="text-center text-success">$150,200.80</td>
-                            <td class="text-right">
-                                <a href="#" data-toggle="tooltip" title="Detail">
-                                    <i class="fa fa-external-link"></i>
-                                </a>
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>Texas</td>
-                            <td class="text-center">11,950</td>
-                            <td class="text-center text-success">$138,910.20</td>
-                            <td class="text-right">
-                                <a href="#" data-toggle="tooltip" title="Detail">
-                                    <i class="fa fa-external-link"></i>
-                                </a>
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>Wyoming</td>
-                            <td class="text-center">11,198</td>
-                            <td class="text-center text-danger">$132,050.00</td>
-                            <td class="text-right">
-                                <a href="#" data-toggle="tooltip" title="Detail">
-                                    <i class="fa fa-external-link"></i>
-                                </a>
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>Florida</td>
-                            <td class="text-center">9,885</td>
-                            <td class="text-center text-success">$127,762.10</td>
-                            <td class="text-right">
-                                <a href="#" data-toggle="tooltip" title="Detail">
-                                    <i class="fa fa-external-link"></i>
-                                </a>
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>New York</td>
-                            <td class="text-center">21,198</td>
-                            <td class="text-center text-danger">$432,410.00</td>
-                            <td class="text-right">
-                                <a href="#" data-toggle="tooltip" title="Detail">
-                                    <i class="fa fa-external-link"></i>
-                                </a>
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>Montana</td>
-                            <td class="text-center">2,885</td>
-                            <td class="text-center text-success">$7,100.00</td>
-                            <td class="text-right">
-                                <a href="#" data-toggle="tooltip" title="Detail">
-                                    <i class="fa fa-external-link"></i>
-                                </a>
-                            </td>
-                        </tr>
-                        </tbody>
-                    </table>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="card">
-                <div class="card-body">
-                    <div class="card-title d-flex justify-content-between">
-                        <h6 class="card-title">Revenue by Country</h6>
-                        <div>
-                            <a href="#" class="btn btn-outline-light btn-sm mr-2">
-                                <i class="fa fa-refresh"></i>
-                            </a>
-                            <div class="dropdown">
-                                <a href="#" data-toggle="dropdown"
-                                   class="btn btn-outline-light btn-sm"
-                                   aria-haspopup="true" aria-expanded="false">
-                                    <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
-                                </a>
-                                <div class="dropdown-menu dropdown-menu-right">
-                                    <a class="dropdown-item" href="#">Action</a>
-                                    <a class="dropdown-item" href="#">Another action</a>
-                                    <a class="dropdown-item" href="#">Something else here</a>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <p>Total Revenue</p>
-                    <h2 class="mb-4 font-size-35">$469,453</h2>
-                    <div class="progress mb-3" style="height: 10px">
-                        <div class="progress-bar w-25 bg-secondary-gradient" role="progressbar"></div>
-                        <div class="progress-bar w-50 bg-info-gradient" role="progressbar"></div>
-                        <div class="progress-bar w-25 bg-warning-gradient" role="progressbar"></div>
-                        <div class="progress-bar w-25 bg-success-gradient" role="progressbar"></div>
-                        <div class="progress-bar w-50 bg-danger-gradient" role="progressbar"></div>
-                    </div>
-                </div>
-                <div class="p-4 bg-dark-gradient">
-                    <ul class="list-inline ">
-                        <li class="list-inline-item mr-4 mb-3">
-                            <div class="d-flex align-items-center">
-                                <span class="d-inline-flex align-items-center">
-                                    <i class="fa fa-circle text-secondary mr-1 small"></i> Russia
-                                </span>
-                                <small class="ml-3 text-success d-inline-flex align-items-center">
-                                    <i class="fa fa-caret-up mr-1"></i> 40%
-                                </small>
-                            </div>
-                        </li>
-                        <li class="list-inline-item mr-4 mb-3">
-                            <div class="d-flex align-items-center">
-                                <span class="d-inline-flex align-items-center">
-                                    <i class="fa fa-circle text-info mr-1 small"></i> Australia
-                                </span>
-                                <small class="ml-3 text-danger d-inline-flex align-items-center">
-                                    <i class="fa fa-caret-down mr-1"></i> 25%
-                                </small>
-                            </div>
-                        </li>
-                        <li class="list-inline-item mr-4 mb-3">
-                            <div class="d-flex align-items-center">
-                                <span class="d-inline-flex align-items-center">
-                                <i class="fa fa-circle text-warning mr-1 small"></i> China
-                                </span>
-                                <small class="ml-3 text-success d-inline-flex align-items-center">
-                                    <i class="fa fa-caret-up mr-1"></i> 30%
-                                </small>
-                            </div>
-                        </li>
-                        <li class="list-inline-item mr-4 mb-3">
-                            <div class="d-flex align-items-center">
-                                <span class="d-inline-flex align-items-center">
-                                <i class="fa fa-circle text-success mr-1 small"></i> Tunisia
-                                </span>
-                                <small class="ml-3 text-success d-inline-flex align-items-center">
-                                    <i class="fa fa-caret-up mr-1"></i> 10%
-                                </small>
-                            </div>
-                        </li>
-                        <li class="list-inline-item mr-4 mb-3">
-                            <div class="d-flex align-items-center">
-                                <span class="d-inline-flex align-items-center">
-                                <i class="fa fa-circle text-success mr-1 small"></i> Spain
-                                </span>
-                                <small class="ml-3 text-danger d-inline-flex align-items-center">
-                                    <i class="fa fa-caret-down mr-1"></i> 10%
-                                </small>
-                            </div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-            <div class="card">
-                <div class="card-body">
-                    <h6 class="card-title">Reviews</h6>
-                    <div class="card-scroll">
-                        <ul class="list-group list-group-flush">
-                            <li class="list-group-item d-flex pl-0 pr-0">
-                                <a href="#">
-                                    <figure class="avatar mr-3">
-                                        <img src="{{ url('assets/media/image/user/man_avatar1.jpg') }}" class="rounded-circle" alt="image">
-                                    </figure>
-                                </a>
-                                <div>
-                                    <div class="d-flex justify-content-between">
-                                        <a href="#">
-                                            <h6>Valentine Maton</h6>
-                                            <ul class="list-inline mb-1">
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">(5)</li>
-                                            </ul>
-                                        </a>
-                                        <div class="ml-auto">
-                                            <div class="dropdown">
-                                                <a href="#" data-toggle="dropdown"
-                                                   class="btn btn-outline-light btn-sm"
-                                                   aria-haspopup="true" aria-expanded="false">
-                                                    <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
-                                                </a>
-                                                <div class="dropdown-menu dropdown-menu-right">
-                                                    <a href="#" class="dropdown-item">View</a>
-                                                    <a href="#" class="dropdown-item">Send Message</a>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio, tempora.</p>
-                                </div>
-                            </li>
-                            <li class="list-group-item d-flex pl-0 pr-0">
-                                <a href="#">
-                                    <figure class="avatar mr-3">
-                                        <img src="{{ url('assets/media/image/user/man_avatar2.jpg') }}" class="rounded-circle" alt="image">
-                                    </figure>
-                                </a>
-                                <div>
-                                    <div class="d-flex justify-content-between">
-                                        <a href="#">
-                                            <h6>Valentine Maton</h6>
-                                            <ul class="list-inline mb-1">
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star-half-o text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star-o"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">(3.5)</li>
-                                            </ul>
-                                        </a>
-                                        <div class="ml-auto">
-                                            <div class="dropdown">
-                                                <a href="#" data-toggle="dropdown"
-                                                   class="btn btn-outline-light btn-sm"
-                                                   aria-haspopup="true" aria-expanded="false">
-                                                    <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
-                                                </a>
-                                                <div class="dropdown-menu dropdown-menu-right">
-                                                    <a href="#" class="dropdown-item">View</a>
-                                                    <a href="#" class="dropdown-item">Send Message</a>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio, tempora.</p>
-                                </div>
-                            </li>
-                            <li class="list-group-item d-flex pl-0 pr-0">
-                                <a href="#">
-                                    <figure class="avatar mr-3">
-                                        <img src="{{ url('assets/media/image/user/man_avatar3.jpg') }}" class="rounded-circle" alt="image">
-                                    </figure>
-                                </a>
-                                <div>
-                                    <div class="d-flex justify-content-between">
-                                        <a href="#">
-                                            <h6>Valentine Maton</h6>
-                                            <ul class="list-inline mb-1">
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star-half-o text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">(4.5)</li>
-                                            </ul>
-                                        </a>
-                                        <div class="ml-auto">
-                                            <div class="dropdown">
-                                                <a href="#" data-toggle="dropdown"
-                                                   class="btn btn-outline-light btn-sm"
-                                                   aria-haspopup="true" aria-expanded="false">
-                                                    <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
-                                                </a>
-                                                <div class="dropdown-menu dropdown-menu-right">
-                                                    <a href="#" class="dropdown-item">View</a>
-                                                    <a href="#" class="dropdown-item">Send Message</a>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio, tempora.</p>
-                                </div>
-                            </li>
-                            <li class="list-group-item d-flex pl-0 pr-0">
-                                <a href="#">
-                                    <figure class="avatar mr-3">
-                                        <img src="{{ url('assets/media/image/user/man_avatar4.jpg') }}" class="rounded-circle" alt="image">
-                                    </figure>
-                                </a>
-                                <div>
-                                    <div class="d-flex justify-content-between">
-                                        <a href="#">
-                                            <h6>Valentine Maton</h6>
-                                            <ul class="list-inline mb-1">
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star text-warning"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">
-                                                    <i class="fa fa-star-o"></i>
-                                                </li>
-                                                <li class="list-inline-item mb-0">(4)</li>
-                                            </ul>
-                                        </a>
-                                        <div class="ml-auto">
-                                            <div class="dropdown">
-                                                <a href="#" data-toggle="dropdown"
-                                                   class="btn btn-outline-light btn-sm"
-                                                   aria-haspopup="true" aria-expanded="false">
-                                                    <i class="fa fa-ellipsis-h" aria-hidden="true"></i>
-                                                </a>
-                                                <div class="dropdown-menu dropdown-menu-right">
-                                                    <a href="#" class="dropdown-item">View</a>
-                                                    <a href="#" class="dropdown-item">Send Message</a>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio, tempora.</p>
-                                </div>
-                            </li>
-                        </ul>
-                    </div>
-                    <div class="mt-3 text-center">
-                        <a href="#" class="btn btn-primary">
-                            View All
-                        </a>
-                    </div>
-                </div>
-            </div>
-
-        </div>
-    </div>
-
 @endsection
 
@@ -1019,4 +341,38 @@
 
     <script src="{{ url('assets/js/examples/pages/ecommerce-dashboard.js') }}"></script>
-
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
+    <script>
+        var year = <?php echo $year; ?>;
+        var file = <?php echo $file; ?>;
+        var barChartData = {
+            labels: year,
+            datasets: [{
+                label: 'File',
+                backgroundColor: "red",
+                data: file
+            }]
+        };
+
+        window.onload = function() {
+            var ctx = document.getElementById("canvas").getContext("2d");
+            window.myBar = new Chart(ctx, {
+                type: 'bar',
+                data: barChartData,
+                options: {
+                    elements: {
+                        rectangle: {
+                            borderWidth: 2,
+                            borderColor: '#c1c1c1',
+                            borderSkipped: 'bottom'
+                        }
+                    },
+                    responsive: true,
+                    title: {
+                        display: true,
+                        text: 'Yearly uploaded files'
+                    }
+                }
+            });
+        };
+    </script>
 @endsection
