Index: resources/views/dashboard/documents/index.blade.php
===================================================================
--- resources/views/dashboard/documents/index.blade.php	(revision 120759b41a3ce01c1ab16d5c512103522ae5568f)
+++ resources/views/dashboard/documents/index.blade.php	(revision bd9e8e32f60b76ec300f4c312ea24835f0a7608d)
@@ -1,18 +1,130 @@
 @extends('layouts.app')
 
-@section('pageTitle', 'File Manager')
+@section("title", "SaveSpace - Documents")
+
+@section('pageTitle', 'SaveSpace - Documents')
 
 @section('content')
 
     <div class="row app-block mb-4">
-        @include('dashboard.documents.fragments.menu')
+        <div class="col-md-3 app-sidebar">
+            <div class="card">
+                <div class="card-body">
+                    <a href="{{ route("dashboard.documents.create") }}" class="btn btn-secondary btn-block file-upload-btn text-white" data-action="{{ route("dashboard.documents.create") }}">
+                        Add document
+                    </a>
+                    <form class="d-none" id="file-upload">
+                        <input type="file" multiple>
+                    </form>
+                </div>
+                <div class="app-sidebar-menu">
+                    <div class="list-group list-group-flush">
+                        <a href="{{route("dashboard.documents.index")}}" class="list-group-item d-flex align-items-center">
+                            <i data-feather="folder" class="width-15 height-15 mr-2"></i>
+                            Documents
+{{--                            <span class="small ml-auto">{{$totalDocs}}</span>--}}
+                        </a>
+                        @foreach($departments as $department)
+                            <a href="{{ route("dashboard.documents.index", ["id" => $department->id]) }}" class="list-group-item d-flex align-items-center">
+                                <i data-feather="folder" class="width-15 height-15 mr-2"></i>
+                                {{$department->name}}
+                                <span class="small ml-auto">{{$department->document->count()}}</span>
+                            </a>
+                        @endforeach
+                        <a href="" class="list-group-item">
+                            <i data-feather="upload-cloud" class="width-15 height-15 mr-2"></i>
+                            Recents
+                        </a>
+                        <a href="" class="list-group-item d-flex align-items-center">
+                            <i data-feather="star" class="width-15 height-15 mr-2"></i>
+                            Important
+                            <span class="small ml-auto">10</span>
+                        </a>
+                        <a href="" class="list-group-item">
+                            <i data-feather="trash" class="width-15 height-15 mr-2"></i>
+                            Deleted Files
+                        </a>
+                    </div>
+                    <div class="card-body">
+                        <h6 class="mb-4">Storage Status</h6>
+                        <div class="d-flex align-items-center">
+                            <div class="mr-3">
+                                <i data-feather="database" class="width-30 height-30"></i>
+                            </div>
+                            <div class="flex-grow-1">
+                                <div class="progress" style="height: 10px">
+                                    <div class="progress-bar progress-bar-striped" role="progressbar"
+                                         style="width: 40%" aria-valuenow="10" aria-valuemin="0"
+                                         aria-valuemax="100"></div>
+                                </div>
+                                <div class="line-height-12 small text-muted mt-2">19.5GB used of 25GB</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
 
         <div class="col-md-9 app-content">
             <div class="app-content-overlay"></div>
-            @include('dashboard.documents.fragments.filters')
+            <div class="app-action">
+                <div class="action-left">
+                    <ul class="list-inline">
+                        <li class="list-inline-item mb-0">
+                            <a href="#" class="btn btn-outline-light dropdown-toggle" data-toggle="dropdown">
+                                <i data-feather="plus" class="mr-1"></i>
+                                Add
+                            </a>
+                            <div class="dropdown-menu">
+                                <a class="dropdown-item" href="{{route("dashboard.departments.create")}}">Department</a>
+                                <a class="dropdown-item" href="{{route("dashboard.documents.create")}}">Document</a>
+                            </div>
+                        </li>
+                        <li class="list-inline-item mb-0">
+                            <a href="#" class="btn btn-outline-light dropdown-toggle" data-toggle="dropdown">Departments</a>
+                            <div class="dropdown-menu">
+                                @foreach($departments as $department)
+                                    <a class="dropdown-item d-flex justify-content-between m-5" href="{{ route("dashboard.documents.index", ["id" => $department->id]) }}">
+                                        {{$department->name}}
+                                        <span class="text-muted">{{$department->document->count()}}</span>
+                                    </a>
+                                @endforeach
+                            </div>
+                        </li>
+                        <li class="list-inline-item mb-0">
+                            <a href="#" class="btn btn-outline-light dropdown-toggle" data-toggle="dropdown">
+                                Order by
+                            </a>
+                            <div class="dropdown-menu">
+                                <a class="dropdown-item" href="#">Date</a>
+                                <a class="dropdown-item" href="#">Name</a>
+                                <a class="dropdown-item" href="#">Size</a>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+                <div class="action-right">
+                    <form class="d-flex mr-3">
+                        <a href="#" class="app-sidebar-menu-button btn btn-outline-light">
+                            <i data-feather="menu"></i>
+                        </a>
+                        <div class="input-group">
+                            <input type="text" class="form-control" placeholder="Search file"
+                                   aria-describedby="button-addon1">
+                            <div class="input-group-append">
+                                <button class="btn btn-outline-light" type="button" id="button-addon1">
+                                    <i data-feather="search"></i>
+                                </button>
+                            </div>
+                        </div>
+                    </form>
+                </div>
+            </div>
+
 
             <p>Documents</p>
             <div class="row">
-                @foreach($documents as $document)
+                @forelse($documents as $document)
                     <div class="col-xl-3 col-lg-4 col-md-6 col-sm-12">
                         <div class="card app-file-list">
@@ -39,6 +151,7 @@
                         </div>
                     </div>
-                @endforeach
-
+                @empty
+                    <div>No items found</div>
+                @endforelse
 
             </div>
@@ -49,22 +162,5 @@
 @section('script')
 
-{{--    <script>--}}
-{{--        $(function () {--}}
-{{--            $(document).on('click', '.file-upload-btn', function () {--}}
-{{--                $('form#file-upload input[type="file"]').trigger('click');--}}
-{{--            });--}}
 
-{{--            $(document).on('click', '.app-sidebar-menu-button', function () {--}}
-{{--                $('.app-block .app-sidebar, .app-content-overlay').addClass('show');--}}
-{{--                // $('.app-block .app-sidebar .app-sidebar-menu').niceScroll().resize();--}}
-{{--                return false;--}}
-{{--            });--}}
-
-{{--            $(document).on('click', '.app-content-overlay', function () {--}}
-{{--                $('.app-block .app-sidebar, .app-content-overlay').removeClass('show');--}}
-{{--                return false;--}}
-{{--            });--}}
-{{--        });--}}
-{{--    </script>--}}
 
 @endsection
