fixes #12

src-ui/src/app/components/app-frame/app-frame.component.html

@@ -69,6 +69,14 @@
               {{d.title}}
             </a>
           </li>
+          <li class="nav-item w-100" *ngIf="openDocuments.length > 1">
+            <a class="nav-link text-truncate" [routerLink]="" (click)="closeAll()">
+              <svg class="sidebaricon" fill="currentColor">
+                <use xlink:href="assets/bootstrap-icons.svg#x"/>
+              </svg>
+              Close all
+            </a>
+          </li>
         </ul>
 
         <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">

src-ui/src/app/components/app-frame/app-frame.component.ts

@@ -1,12 +1,13 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
 import { FormControl } from '@angular/forms';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { from, Observable, Subscription } from 'rxjs';
 import { debounceTime, distinctUntilChanged, map, switchMap } from 'rxjs/operators';
 import { PaperlessDocument } from 'src/app/data/paperless-document';
 import { OpenDocumentsService } from 'src/app/services/open-documents.service';
 import { SearchService } from 'src/app/services/rest/search.service';
 import { SavedViewConfigService } from 'src/app/services/saved-view-config.service';
+import { DocumentDetailComponent } from '../document-detail/document-detail.component';
   
 @Component({
   selector: 'app-app-frame',
@@ -17,6 +18,7 @@ export class AppFrameComponent implements OnInit, OnDestroy {
 
   constructor (
     public router: Router,
+    private activatedRoute: ActivatedRoute,
     private openDocumentsService: OpenDocumentsService,
     private searchService: SearchService,
     public viewConfigService: SavedViewConfigService
@@ -62,6 +64,19 @@ export class AppFrameComponent implements OnInit, OnDestroy {
     this.router.navigate(['search'], {queryParams: {query: this.searchField.value}})
   }
 
+  closeAll() {
+    this.openDocumentsService.closeAll()
+
+    // TODO: is there a better way to do this?
+    let route = this.activatedRoute
+    while (route.firstChild) {
+      route = route.firstChild
+    }
+    if (route.component == DocumentDetailComponent) {
+      this.router.navigate([""])
+    }
+  }
+
   ngOnInit() {
     this.openDocuments = this.openDocumentsService.getOpenDocuments()
   }

src-ui/src/app/services/open-documents.service.ts

@@ -1,5 +1,4 @@
 import { Injectable } from '@angular/core';
-import { Observable, Subject } from 'rxjs';
 import { PaperlessDocument } from '../data/paperless-document';
 import { OPEN_DOCUMENT_SERVICE } from '../data/storage-keys';
 
@@ -8,6 +7,8 @@ import { OPEN_DOCUMENT_SERVICE } from '../data/storage-keys';
 })
 export class OpenDocumentsService {
 
+  private MAX_OPEN_DOCUMENTS = 5
+
   constructor() { 
     if (sessionStorage.getItem(OPEN_DOCUMENT_SERVICE.DOCUMENTS)) {
       try {
@@ -31,7 +32,10 @@ export class OpenDocumentsService {
 
   openDocument(doc: PaperlessDocument) {
     if (this.openDocuments.find(d => d.id == doc.id) == null) {
-      this.openDocuments.push(doc)
+      this.openDocuments.unshift(doc)
+      if (this.openDocuments.length > this.MAX_OPEN_DOCUMENTS) {
+        this.openDocuments.pop()
+      }
       this.save()
     }
   }
@@ -44,6 +48,11 @@ export class OpenDocumentsService {
     }
   }
 
+  closeAll() {
+    this.openDocuments.splice(0, this.openDocuments.length)
+    this.save()
+  }
+
   save() {
     sessionStorage.setItem(OPEN_DOCUMENT_SERVICE.DOCUMENTS, JSON.stringify(this.openDocuments))
   }