diff --git a/browserslist b/.browserslistrc
similarity index 100%
rename from browserslist
rename to .browserslistrc
diff --git a/angular.json b/angular.json
index c4d4625c924991c63b81d1b11354245a1ee41bfc..ba76327052d4f7b1a1ada53b110a527f85ab0316 100755
--- a/angular.json
+++ b/angular.json
@@ -40,15 +40,17 @@
             ],
             "styles": [
               {
-                "input": "./src/frontend/core/theme/variables.scss"
+                "input": "./src/frontend/core/theme/variables.scss",
+                "inject": true
               },
               {
-                "input": "./src/frontend/core/global.scss"
+                "input": "./src/frontend/core/global.scss",
+                "inject": true
               },
               "./src/frontend/core/styles.scss",
               "./node_modules/@fortawesome/fontawesome-free/css/all.min.css",
-              "node_modules/angular2-draggable/css/resizable.min.css"
-
+              "./node_modules/ng2-dnd/bundles/style.css",
+              "./node_modules/angular2-draggable/css/resizable.min.css"
             ],
             "scripts": [
               "./node_modules/jquery/dist/jquery.min.js",
@@ -72,7 +74,6 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
               "aot": true,
               "extractLicenses": true,
diff --git a/package.json b/package.json
index 771256477cd7768ba013ef28d17f246d022cfac4..50eca9cf59e9073f580732a6cb62d2b97f19d9f6 100644
--- a/package.json
+++ b/package.json
@@ -23,24 +23,25 @@
   "license": "GPL-3.0",
   "dependencies": {
     "core-js": "3.6.4",
-    "tslib": "^1.11.1",
+    "ng2-dnd": "^5.0.2",
+    "tslib": "^2.0.0",
     "zone.js": "~0.10.2"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.901.0",
-    "@angular/animations": "^9.1.0",
-    "@angular/cdk": "^9.2.0",
-    "@angular/cli": "^9.1.0",
-    "@angular/common": "^9.1.0",
-    "@angular/compiler": "^9.1.0",
-    "@angular/compiler-cli": "^9.1.0",
-    "@angular/core": "^9.1.0",
-    "@angular/forms": "^9.1.0",
-    "@angular/language-service": "^9.1.0",
-    "@angular/material": "^9.2.0",
-    "@angular/platform-browser": "^9.1.0",
-    "@angular/platform-browser-dynamic": "^9.1.0",
-    "@angular/router": "^9.1.0",
+    "@angular-devkit/build-angular": "~0.1100.0",
+    "@angular/animations": "^11.0.0",
+    "@angular/cdk": "^11.0.0",
+    "@angular/cli": "^11.0.0",
+    "@angular/common": "^11.0.0",
+    "@angular/compiler": "^11.0.0",
+    "@angular/compiler-cli": "^11.0.0",
+    "@angular/core": "^11.0.0",
+    "@angular/forms": "^11.0.0",
+    "@angular/language-service": "^11.0.0",
+    "@angular/material": "^11.0.0",
+    "@angular/platform-browser": "^11.0.0",
+    "@angular/platform-browser-dynamic": "^11.0.0",
+    "@angular/router": "^11.0.0",
     "@biesbjerg/ngx-translate-extract": "^6.0.3",
     "@fortawesome/fontawesome-free": "^5.13.0",
     "@ionic/angular": "^5.0.0",
@@ -70,7 +71,7 @@
     "stylus": "^0.54.7",
     "stylus-loader": "^3.0.2",
     "tslint": "~6.1.0",
-    "typescript": "3.8.3",
+    "typescript": "4.0.5",
     "typescript-tools": "^0.3.1"
   },
   "repository": {}
diff --git a/src/frontend/app/app-routing.module.ts b/src/frontend/app/app-routing.module.ts
index 81ad00e113d8c6008a59eaf08faa76edba9f4616..b1c63ead5ca77efc1626deb85fdf8c44d8452ee8 100755
--- a/src/frontend/app/app-routing.module.ts
+++ b/src/frontend/app/app-routing.module.ts
@@ -19,32 +19,34 @@ import { SecuritiesAdministrationComponent } from './administration/security/sec
 import { PasswordModificationComponent } from './login/passwordModification/password-modification.component';
 import { ProfileComponent } from './profile/profile.component';
 import { HomeComponent } from './home/home.component';
+import { IndexationComponent } from './indexation/indexation.component';
 
 @NgModule({
     imports: [
         RouterModule.forRoot([
-            { path: 'home', canActivate: [AuthGuard], component: HomeComponent },
-            { path: 'profile', canActivate: [AuthGuard], component: ProfileComponent },
-            { path: 'administration', canActivate: [AuthGuard], component: AdministrationComponent },
-            { path: 'administration/users', canActivate: [AuthGuard], component: UsersListComponent },
-            { path: 'administration/users/new', canActivate: [AuthGuard], component: UserComponent },
-            { path: 'administration/users/:id', canActivate: [AuthGuard], component: UserComponent },
-            { path: 'administration/groups', canActivate: [AuthGuard], component: GroupsListComponent },
-            { path: 'administration/groups/new', canActivate: [AuthGuard], component: GroupComponent },
-            { path: 'administration/groups/:id', canActivate: [AuthGuard], component: GroupComponent },
-            { path: 'administration/connections', canActivate: [AuthGuard], component: ConnectionComponent },
-            { path: 'administration/connections/ldaps', canActivate: [AuthGuard], component: LdapListComponent },
-            { path: 'administration/connections/ldaps/new', canActivate: [AuthGuard], component: LdapComponent },
-            { path: 'administration/connections/ldaps/:id', canActivate: [AuthGuard], component: LdapComponent },
-            { path: 'administration/emailConfiguration', canActivate: [AuthGuard], component: SendmailComponent },
-            { path: 'administration/passwordRules', canActivate: [AuthGuard], component: SecuritiesAdministrationComponent },
-            { path: 'documents/:id', canActivate: [AuthGuard], component: DocumentComponent },
-            { path: 'login', canActivate: [AuthGuard], component: LoginComponent },
-            { path: 'forgot-password', component: ForgotPasswordComponent },
-            { path: 'update-password', component: UpdatePasswordComponent },
-            { path: 'password-modification', component: PasswordModificationComponent },
-            { path: '**', redirectTo: 'login', pathMatch: 'full' },
-        ]),
+    { path: 'home', canActivate: [AuthGuard], component: HomeComponent },
+    { path: 'indexation', canActivate: [AuthGuard], component: IndexationComponent },
+    { path: 'profile', canActivate: [AuthGuard], component: ProfileComponent },
+    { path: 'administration', canActivate: [AuthGuard], component: AdministrationComponent },
+    { path: 'administration/users', canActivate: [AuthGuard], component: UsersListComponent },
+    { path: 'administration/users/new', canActivate: [AuthGuard], component: UserComponent },
+    { path: 'administration/users/:id', canActivate: [AuthGuard], component: UserComponent },
+    { path: 'administration/groups', canActivate: [AuthGuard], component: GroupsListComponent },
+    { path: 'administration/groups/new', canActivate: [AuthGuard], component: GroupComponent },
+    { path: 'administration/groups/:id', canActivate: [AuthGuard], component: GroupComponent },
+    { path: 'administration/connections', canActivate: [AuthGuard], component: ConnectionComponent },
+    { path: 'administration/connections/ldaps', canActivate: [AuthGuard], component: LdapListComponent },
+    { path: 'administration/connections/ldaps/new', canActivate: [AuthGuard], component: LdapComponent },
+    { path: 'administration/connections/ldaps/:id', canActivate: [AuthGuard], component: LdapComponent },
+    { path: 'administration/emailConfiguration', canActivate: [AuthGuard], component: SendmailComponent },
+    { path: 'administration/passwordRules', canActivate: [AuthGuard], component: SecuritiesAdministrationComponent },
+    { path: 'documents/:id', canActivate: [AuthGuard], component: DocumentComponent },
+    { path: 'login', canActivate: [AuthGuard], component: LoginComponent },
+    { path: 'forgot-password', component: ForgotPasswordComponent },
+    { path: 'update-password', component: UpdatePasswordComponent },
+    { path: 'password-modification', component: PasswordModificationComponent },
+    { path: '**', redirectTo: 'login', pathMatch: 'full' },
+], { relativeLinkResolution: 'legacy' }),
     ],
     exports: [
         RouterModule
diff --git a/src/frontend/app/app.component.html b/src/frontend/app/app.component.html
index 568897df5db0a31eebfb3b7a481a81179b085967..43e6de3f2489f565e662549efed2bbc4127fda3b 100755
--- a/src/frontend/app/app.component.html
+++ b/src/frontend/app/app.component.html
@@ -3,6 +3,7 @@
       <ion-menu class="left-menu" #leftMenu menuId="left-menu" contentId="main-content" type="overlay" disabled (ionDidOpen)="showLeftContent=true"
       (ionDidClose)="showLeftContent=false">
         <app-sidebar *ngIf="allowedRoute()" style="display: contents;"></app-sidebar>
+        <div id="leftContent" style="display: contents;"></div>
       </ion-menu>
       <ion-router-outlet id="main-content"></ion-router-outlet>
       <ion-menu class="right-menu" #rightMenu menuId="right-menu" contentId="main-content" side="end" type="overlay" disabled (ionDidOpen)="showRightContent=true"
diff --git a/src/frontend/app/app.module.ts b/src/frontend/app/app.module.ts
index 82398d9145bf23805d1cc72a0b81c7c653305bf1..78f3133ea6c85c219de225b26557fed2a16c7395 100755
--- a/src/frontend/app/app.module.ts
+++ b/src/frontend/app/app.module.ts
@@ -1,4 +1,4 @@
-import { BrowserModule } from '@angular/platform-browser';
+import { BrowserModule, HammerModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { HttpClientModule, HttpClient, HTTP_INTERCEPTORS } from '@angular/common/http';
@@ -17,6 +17,7 @@ import { NgxExtendedPdfViewerModule } from 'ngx-extended-pdf-viewer';
 import { DragScrollModule } from 'ngx-drag-scroll';
 import { ScrollEventModule } from 'ngx-scroll-event';
 import { AngularDraggableModule } from 'angular2-draggable';
+import { DndModule } from 'ng2-dnd';
 import { CookieService } from 'ngx-cookie-service';
 import { NgPipesModule } from 'ngx-pipes';
 import { LatinisePipe } from 'ngx-pipes';
@@ -28,6 +29,7 @@ import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
 import { LoginComponent } from './login/login.component';
 import { HomeComponent } from './home/home.component';
+import { IndexationComponent } from './indexation/indexation.component';
 import { ForgotPasswordComponent } from './login/forgotPassword/forgotPassword.component';
 import { SignaturesComponent } from './signatures/signatures.component';
 import { SignaturePadPageComponent } from './pad/pad.component';
@@ -122,7 +124,8 @@ import { SortPipe } from './plugins/sorting.pipe';
     PasswordModificationComponent,
     UsersComponent,
     CheckConnectionComponent,
-    CheckEmailConnectionComponent
+    CheckEmailConnectionComponent,
+    IndexationComponent
   ],
   imports: [
     FormsModule,
@@ -130,7 +133,7 @@ import { SortPipe } from './plugins/sorting.pipe';
     BrowserModule,
     BrowserAnimationsModule,
     HttpClientModule,
-    IonicModule.forRoot({mode: 'md'}),
+    IonicModule.forRoot({ mode: 'md' }),
     TranslateModule.forRoot({
       loader: {
         provide: TranslateLoader,
@@ -142,10 +145,12 @@ import { SortPipe } from './plugins/sorting.pipe';
     NgxExtendedPdfViewerModule,
     ScrollEventModule,
     DragScrollModule,
+    DndModule.forRoot(),
     NgPipesModule,
     AngularDraggableModule,
     AppMaterialModule,
     AppRoutingModule,
+    HammerModule,
   ],
   entryComponents: [
     WarnModalComponent,
diff --git a/src/frontend/app/document/document.component.ts b/src/frontend/app/document/document.component.ts
index 16865959be618ec60b0d84378c2cc0041863862a..1407dad9b630a1c3fa259caadc890aedd949689e 100755
--- a/src/frontend/app/document/document.component.ts
+++ b/src/frontend/app/document/document.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit, ViewChild, ElementRef, TemplateRef, ViewContainerRef } from '@angular/core';
+import { Component, OnInit, ViewChild, ElementRef, TemplateRef, ViewContainerRef, OnDestroy } from '@angular/core';
 import { SignaturesContentService } from '../service/signatures.service';
 import { DomSanitizer } from '@angular/platform-browser';
 import { MatBottomSheet, MatBottomSheetConfig } from '@angular/material/bottom-sheet';
@@ -284,11 +284,14 @@ export class DocumentComponent implements OnInit {
         document.getElementsByClassName('drag-scroll-content')[0].scrollTo(1000, 1000);
     }
 
+    ionViewWillEnter() {
+        this.signaturesService.initTemplate(this.rightContent, this.viewContainerRef, 'rightContent');
+    }
+
     ngOnInit(): void {
         // console.log('oninit!');
         this.menu.enable(false, 'right-menu');
         this.menu.enable(true, 'left-menu');
-        this.signaturesService.initTemplate(this.rightContent, this.viewContainerRef, 'rightContent');
 
         this.route.params.subscribe(params => {
             if (typeof params['id'] !== 'undefined') {
@@ -756,4 +759,8 @@ export class DocumentComponent implements OnInit {
             locked: false,
         };
     }
+
+    ionViewWillLeave() {
+        this.signaturesService.detachTemplate('rightContent');
+    }
 }
diff --git a/src/frontend/app/service/signatures.service.ts b/src/frontend/app/service/signatures.service.ts
index bdadca5f6d96c701cd6f01b0aa8faba34b523b11..60bfbd7749eda9fba813a2c91650829dd1e1d2ef 100755
--- a/src/frontend/app/service/signatures.service.ts
+++ b/src/frontend/app/service/signatures.service.ts
@@ -1,4 +1,4 @@
-import { DomPortalHost, TemplatePortal } from '@angular/cdk/portal';
+import { DomPortalHost, DomPortalOutlet, TemplatePortal } from '@angular/cdk/portal';
 import { ApplicationRef, ComponentFactoryResolver, Injectable, Injector, TemplateRef, ViewContainerRef } from '@angular/core';
 
 @Injectable()
@@ -42,7 +42,7 @@ export class SignaturesContentService {
 
     appSession: any;
 
-    private portalHost: DomPortalHost;
+    private portalHost: DomPortalOutlet;
 
     constructor(
         private componentFactoryResolver: ComponentFactoryResolver,
@@ -120,9 +120,8 @@ export class SignaturesContentService {
     }
 
     initTemplate(template: TemplateRef<any>, viewContainerRef: ViewContainerRef, id: string = 'adminMenu', mode: string = '') {
-
         // Create a portalHost from a DOM element
-        this.portalHost = new DomPortalHost(
+        this.portalHost = new DomPortalOutlet(
             document.querySelector(`#${id}`),
             this.componentFactoryResolver,
             this.appRef,
@@ -154,4 +153,8 @@ export class SignaturesContentService {
             return true;
         }
     }
+
+    detachTemplate(id: string = 'adminMenu') {
+        this.portalHost.detach();
+    }
 }
diff --git a/src/frontend/core/browserslist b/src/frontend/core/.browserslistrc
similarity index 100%
rename from src/frontend/core/browserslist
rename to src/frontend/core/.browserslistrc
diff --git a/tsconfig.json b/tsconfig.json
index 575aabd99f9d38e33b2495d373ebed60120fa8fd..21920252a6726a253dc4dd244c443b080e7b2e9e 100755
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,7 +6,7 @@
     "outDir": "./dist/out-tsc",
     "sourceMap": true,
     "declaration": false,
-    "module": "esnext",
+    "module": "es2020",
     "moduleResolution": "node",
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
diff --git a/tslint.json b/tslint.json
index 309b50fa80d1829013acbb9e668637c0404bd9eb..025ceff18057f216926f9242971aab72d5e39122 100755
--- a/tslint.json
+++ b/tslint.json
@@ -72,7 +72,6 @@
     "no-trailing-whitespace": true,
     "no-unnecessary-initializer": true,
     "no-unused-expression": true,
-    "no-use-before-declare": true,
     "no-var-keyword": true,
     "object-literal-sort-keys": false,
     "one-line": [