From f5e740f2ecc6642c3c8b51e2258e672a19a7db80 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Sun, 15 May 2022 22:55:25 -0700
Subject: [PATCH 1/4] Warn on closing edited doc due to max open docs

---
 .../saved-view-widget.component.html          |  2 +-
 .../saved-view-widget.component.ts            | 15 +++++++++--
 .../document-card-large.component.html        |  2 +-
 .../document-card-large.component.ts          | 20 ++++++++++----
 .../document-card-small.component.html        |  2 +-
 .../document-card-small.component.ts          | 17 ++++++++++--
 .../document-list.component.html              |  2 +-
 .../document-list/document-list.component.ts  | 13 +++++++++-
 .../app/services/open-documents.service.ts    | 26 ++++++++++++++-----
 9 files changed, 79 insertions(+), 20 deletions(-)

diff --git a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html
index 8d5b9c43f..eb9a136ab 100644
--- a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html
+++ b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html
@@ -11,7 +11,7 @@
       </tr>
     </thead>
     <tbody>
-      <tr *ngFor="let doc of documents" [routerLink]="['/', 'documents', doc.id]">
+      <tr *ngFor="let doc of documents" (click)="clickDoc(doc)">
         <td>{{doc.created | customDate}}</td>
         <td>{{doc.title | documentTitle}}<app-tag [tag]="t" *ngFor="let t of doc.tags$ | async" class="ms-1" (click)="clickTag(t); $event.stopPropagation();"></app-tag></td>
       </tr>
diff --git a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.ts b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.ts
index 6e8b67900..89db3ef81 100644
--- a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.ts
+++ b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.ts
@@ -1,6 +1,6 @@
 import { Component, Input, OnDestroy, OnInit } from '@angular/core'
 import { Router } from '@angular/router'
-import { Subscription } from 'rxjs'
+import { first, Subscription } from 'rxjs'
 import { PaperlessDocument } from 'src/app/data/paperless-document'
 import { PaperlessSavedView } from 'src/app/data/paperless-saved-view'
 import { ConsumerStatusService } from 'src/app/services/consumer-status.service'
@@ -8,6 +8,7 @@ import { DocumentService } from 'src/app/services/rest/document.service'
 import { PaperlessTag } from 'src/app/data/paperless-tag'
 import { FILTER_HAS_TAGS_ALL } from 'src/app/data/filter-rule-type'
 import { QueryParamsService } from 'src/app/services/query-params.service'
+import { OpenDocumentsService } from 'src/app/services/open-documents.service'
 
 @Component({
   selector: 'app-saved-view-widget',
@@ -21,7 +22,8 @@ export class SavedViewWidgetComponent implements OnInit, OnDestroy {
     private documentService: DocumentService,
     private router: Router,
     private queryParamsService: QueryParamsService,
-    private consumerStatusService: ConsumerStatusService
+    private consumerStatusService: ConsumerStatusService,
+    private openDocumentsService: OpenDocumentsService
   ) {}
 
   @Input()
@@ -70,6 +72,15 @@ export class SavedViewWidgetComponent implements OnInit, OnDestroy {
     }
   }
 
+  clickDoc(doc: PaperlessDocument) {
+    this.openDocumentsService
+      .openDocument(doc)
+      .pipe(first())
+      .subscribe((open) => {
+        if (open) this.router.navigate(['documents', doc.id])
+      })
+  }
+
   clickTag(tag: PaperlessTag) {
     this.queryParamsService.navigateWithFilterRules([
       { rule_type: FILTER_HAS_TAGS_ALL, value: tag.id.toString() },
diff --git a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html
index a5b238504..d0080f0ce 100644
--- a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html
+++ b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html
@@ -37,7 +37,7 @@
                 <use xlink:href="assets/bootstrap-icons.svg#diagram-3"/>
               </svg>&nbsp;<span class="d-none d-md-inline" i18n>More like this</span>
             </a>
-            <a routerLink="/documents/{{document.id}}" class="btn btn-sm btn-outline-secondary">
+            <a (click)="clickEdit()" class="btn btn-sm btn-outline-secondary">
               <svg class="sidebaricon" fill="currentColor" class="sidebaricon">
                 <use xlink:href="assets/bootstrap-icons.svg#pencil"/>
               </svg>&nbsp;<span class="d-none d-md-inline" i18n>Edit</span>
diff --git a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts
index 1c4e9a7aa..8eff2e491 100644
--- a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts
+++ b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts
@@ -6,7 +6,6 @@ import {
   Output,
   ViewChild,
 } from '@angular/core'
-import { DomSanitizer } from '@angular/platform-browser'
 import { PaperlessDocument } from 'src/app/data/paperless-document'
 import { DocumentService } from 'src/app/services/rest/document.service'
 import {
@@ -14,8 +13,9 @@ import {
   SETTINGS_KEYS,
 } from 'src/app/services/settings.service'
 import { NgbPopover } from '@ng-bootstrap/ng-bootstrap'
-import { DocumentListViewService } from 'src/app/services/document-list-view.service'
-import { FILTER_FULLTEXT_MORELIKE } from 'src/app/data/filter-rule-type'
+import { OpenDocumentsService } from 'src/app/services/open-documents.service'
+import { Router } from '@angular/router'
+import { first } from 'rxjs'
 
 @Component({
   selector: 'app-document-card-large',
@@ -28,8 +28,9 @@ import { FILTER_FULLTEXT_MORELIKE } from 'src/app/data/filter-rule-type'
 export class DocumentCardLargeComponent implements OnInit {
   constructor(
     private documentService: DocumentService,
-    private sanitizer: DomSanitizer,
-    private settingsService: SettingsService
+    private settingsService: SettingsService,
+    private openDocumentsService: OpenDocumentsService,
+    private router: Router
   ) {}
 
   @Input()
@@ -120,4 +121,13 @@ export class DocumentCardLargeComponent implements OnInit {
   get contentTrimmed() {
     return this.document.content.substr(0, 500)
   }
+
+  clickEdit() {
+    this.openDocumentsService
+      .openDocument(this.document)
+      .pipe(first())
+      .subscribe((open) => {
+        if (open) this.router.navigate(['documents', this.document.id])
+      })
+  }
 }
diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
index 2e8d29b7f..7844ce419 100644
--- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
+++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
@@ -63,7 +63,7 @@
       </div>
       <div class="d-flex justify-content-between align-items-center">
         <div class="btn-group w-100">
-          <a routerLink="/documents/{{document.id}}" class="btn btn-sm btn-outline-secondary" title="Edit" i18n-title>
+          <a (click)="clickEdit()" class="btn btn-sm btn-outline-secondary" title="Edit" i18n-title>
             <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-pencil" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
               <path fill-rule="evenodd" d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5L13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175l-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
             </svg>
diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts
index cbff950a2..c7fff39b5 100644
--- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts
+++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts
@@ -6,7 +6,7 @@ import {
   Output,
   ViewChild,
 } from '@angular/core'
-import { map } from 'rxjs/operators'
+import { first, map } from 'rxjs/operators'
 import { PaperlessDocument } from 'src/app/data/paperless-document'
 import { DocumentService } from 'src/app/services/rest/document.service'
 import {
@@ -14,6 +14,8 @@ import {
   SETTINGS_KEYS,
 } from 'src/app/services/settings.service'
 import { NgbPopover } from '@ng-bootstrap/ng-bootstrap'
+import { OpenDocumentsService } from 'src/app/services/open-documents.service'
+import { Router } from '@angular/router'
 
 @Component({
   selector: 'app-document-card-small',
@@ -26,7 +28,9 @@ import { NgbPopover } from '@ng-bootstrap/ng-bootstrap'
 export class DocumentCardSmallComponent implements OnInit {
   constructor(
     private documentService: DocumentService,
-    private settingsService: SettingsService
+    private settingsService: SettingsService,
+    private openDocumentsService: OpenDocumentsService,
+    private router: Router
   ) {}
 
   @Input()
@@ -109,4 +113,13 @@ export class DocumentCardSmallComponent implements OnInit {
   mouseLeaveCard() {
     this.popover.close()
   }
+
+  clickEdit() {
+    this.openDocumentsService
+      .openDocument(this.document)
+      .pipe(first())
+      .subscribe((open) => {
+        if (open) this.router.navigate(['documents', this.document.id])
+      })
+  }
 }
diff --git a/src-ui/src/app/components/document-list/document-list.component.html b/src-ui/src/app/components/document-list/document-list.component.html
index 4a15fe976..1b0eae525 100644
--- a/src-ui/src/app/components/document-list/document-list.component.html
+++ b/src-ui/src/app/components/document-list/document-list.component.html
@@ -168,7 +168,7 @@
           </ng-container>
         </td>
         <td>
-          <a routerLink="/documents/{{d.id}}" title="Edit document" style="overflow-wrap: anywhere;">{{d.title | documentTitle}}</a>
+          <a (click)="clickEdit(d.id)" title="Edit document" style="overflow-wrap: anywhere;">{{d.title | documentTitle}}</a>
           <app-tag [tag]="t" *ngFor="let t of d.tags$ | async" class="ms-1" clickable="true" linkTitle="Filter by tag" (click)="clickTag(t.id);$event.stopPropagation()"></app-tag>
         </td>
         <td class="d-none d-xl-table-cell">
diff --git a/src-ui/src/app/components/document-list/document-list.component.ts b/src-ui/src/app/components/document-list/document-list.component.ts
index 01c2bee34..3d6db5731 100644
--- a/src-ui/src/app/components/document-list/document-list.component.ts
+++ b/src-ui/src/app/components/document-list/document-list.component.ts
@@ -20,6 +20,7 @@ import {
 } from 'src/app/directives/sortable.directive'
 import { ConsumerStatusService } from 'src/app/services/consumer-status.service'
 import { DocumentListViewService } from 'src/app/services/document-list-view.service'
+import { OpenDocumentsService } from 'src/app/services/open-documents.service'
 import {
   filterRulesFromQueryParams,
   QueryParamsService,
@@ -47,7 +48,8 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
     private toastService: ToastService,
     private modalService: NgbModal,
     private consumerStatusService: ConsumerStatusService,
-    private queryParamsService: QueryParamsService
+    private queryParamsService: QueryParamsService,
+    private openDocumentsService: OpenDocumentsService
   ) {}
 
   @ViewChild('filterEditor')
@@ -245,6 +247,15 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
     else this.list.selectRangeTo(document)
   }
 
+  clickEdit(doc: PaperlessDocument) {
+    this.openDocumentsService
+      .openDocument(doc)
+      .pipe(first())
+      .subscribe((open) => {
+        if (open) this.router.navigate(['documents', doc.id])
+      })
+  }
+
   clickTag(tagID: number) {
     this.list.selectNone()
     setTimeout(() => {
diff --git a/src-ui/src/app/services/open-documents.service.ts b/src-ui/src/app/services/open-documents.service.ts
index 5297a38bf..37e29cd6e 100644
--- a/src-ui/src/app/services/open-documents.service.ts
+++ b/src-ui/src/app/services/open-documents.service.ts
@@ -55,14 +55,24 @@ export class OpenDocumentsService {
     return this.openDocuments.find((d) => d.id == id)
   }
 
-  openDocument(doc: PaperlessDocument) {
+  openDocument(doc: PaperlessDocument): Observable<boolean> {
     if (this.openDocuments.find((d) => d.id == doc.id) == null) {
-      this.openDocuments.unshift(doc)
-      if (this.openDocuments.length > this.MAX_OPEN_DOCUMENTS) {
-        this.openDocuments.pop()
+      if (this.openDocuments.length == this.MAX_OPEN_DOCUMENTS) {
+        const docToRemove = this.openDocuments[this.MAX_OPEN_DOCUMENTS - 1]
+        const closeObservable = this.closeDocument(docToRemove)
+        closeObservable.pipe(first()).subscribe((closed) => {
+          if (closed) {
+            this.openDocuments.unshift(doc)
+            this.save()
+          }
+        })
+        return closeObservable
+      } else {
+        this.openDocuments.unshift(doc)
+        this.save()
       }
-      this.save()
     }
+    return of(true)
   }
 
   setDirty(documentId: number, dirty: boolean) {
@@ -82,7 +92,11 @@ export class OpenDocumentsService {
         backdrop: 'static',
       })
       modal.componentInstance.title = $localize`Unsaved Changes`
-      modal.componentInstance.messageBold = $localize`You have unsaved changes.`
+      modal.componentInstance.messageBold =
+        $localize`You have unsaved changes to the document` +
+        ' "' +
+        doc.title +
+        '"'
       modal.componentInstance.message = $localize`Are you sure you want to close this document?`
       modal.componentInstance.btnClass = 'btn-warning'
       modal.componentInstance.btnCaption = $localize`Close document`

From ba1bb959353fa7bb18fec1632cb48dbb7569296e Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Sun, 15 May 2022 23:42:41 -0700
Subject: [PATCH 2/4] Update messages.xlf

---
 src-ui/messages.xlf | 31 +++++++++++++++++--------------
 1 file changed, 17 insertions(+), 14 deletions(-)

diff --git a/src-ui/messages.xlf b/src-ui/messages.xlf
index dd388c374..0c9ca23e0 100644
--- a/src-ui/messages.xlf
+++ b/src-ui/messages.xlf
@@ -368,7 +368,7 @@
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/components/document-list/document-list.component.ts</context>
-          <context context-type="linenumber">69</context>
+          <context context-type="linenumber">68</context>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/components/manage/management-list/management-list.component.html</context>
@@ -1913,14 +1913,14 @@
         <source>View &quot;<x id="PH" equiv-text="this.list.activeSavedViewTitle"/>&quot; saved successfully.</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/components/document-list/document-list.component.ts</context>
-          <context context-type="linenumber">198</context>
+          <context context-type="linenumber">197</context>
         </context-group>
       </trans-unit>
       <trans-unit id="6837554170707123455" datatype="html">
         <source>View &quot;<x id="PH" equiv-text="savedView.name"/>&quot; created successfully.</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/components/document-list/document-list.component.ts</context>
-          <context context-type="linenumber">228</context>
+          <context context-type="linenumber">227</context>
         </context-group>
       </trans-unit>
       <trans-unit id="6849725902312323996" datatype="html">
@@ -2651,11 +2651,11 @@
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/services/open-documents.service.ts</context>
-          <context context-type="linenumber">84</context>
+          <context context-type="linenumber">111</context>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/services/open-documents.service.ts</context>
-          <context context-type="linenumber">107</context>
+          <context context-type="linenumber">138</context>
         </context-group>
       </trans-unit>
       <trans-unit id="2573823578527613511" datatype="html">
@@ -2666,11 +2666,7 @@
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/services/open-documents.service.ts</context>
-          <context context-type="linenumber">85</context>
-        </context-group>
-        <context-group purpose="location">
-          <context context-type="sourcefile">src/app/services/open-documents.service.ts</context>
-          <context context-type="linenumber">108</context>
+          <context context-type="linenumber">139</context>
         </context-group>
       </trans-unit>
       <trans-unit id="3305084982600522070" datatype="html">
@@ -2803,32 +2799,39 @@
           <context context-type="linenumber">27</context>
         </context-group>
       </trans-unit>
+      <trans-unit id="5523607037798226031" datatype="html">
+        <source>You have unsaved changes to the document</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/app/services/open-documents.service.ts</context>
+          <context context-type="linenumber">113</context>
+        </context-group>
+      </trans-unit>
       <trans-unit id="2089045849587358256" datatype="html">
         <source>Are you sure you want to close this document?</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/services/open-documents.service.ts</context>
-          <context context-type="linenumber">86</context>
+          <context context-type="linenumber">117</context>
         </context-group>
       </trans-unit>
       <trans-unit id="2885986061416655600" datatype="html">
         <source>Close document</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/services/open-documents.service.ts</context>
-          <context context-type="linenumber">88</context>
+          <context context-type="linenumber">119</context>
         </context-group>
       </trans-unit>
       <trans-unit id="6755718693176327396" datatype="html">
         <source>Are you sure you want to close all documents?</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/services/open-documents.service.ts</context>
-          <context context-type="linenumber">109</context>
+          <context context-type="linenumber">140</context>
         </context-group>
       </trans-unit>
       <trans-unit id="4215561719980781894" datatype="html">
         <source>Close documents</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/services/open-documents.service.ts</context>
-          <context context-type="linenumber">111</context>
+          <context context-type="linenumber">142</context>
         </context-group>
       </trans-unit>
       <trans-unit id="3553216189604488439" datatype="html">

From 1efd226f75d090dc486311499290aa18ac0e0ead Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Sun, 15 May 2022 23:25:46 -0700
Subject: [PATCH 3/4] let OpenDocumentsService handle nav

---
 .../saved-view-widget.component.html          |  2 +-
 .../saved-view-widget.component.ts            | 13 ++-----
 .../document-detail.component.ts              |  2 +-
 .../document-card-large.component.html        |  2 +-
 .../document-card-large.component.ts          | 14 +-------
 .../document-card-small.component.html        |  2 +-
 .../document-card-small.component.ts          | 15 ++------
 .../document-list.component.html              |  2 +-
 .../document-list/document-list.component.ts  | 16 ++-------
 .../app/services/open-documents.service.ts    | 35 ++++++++++++++-----
 10 files changed, 38 insertions(+), 65 deletions(-)

diff --git a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html
index eb9a136ab..50d064c37 100644
--- a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html
+++ b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html
@@ -11,7 +11,7 @@
       </tr>
     </thead>
     <tbody>
-      <tr *ngFor="let doc of documents" (click)="clickDoc(doc)">
+      <tr *ngFor="let doc of documents" (click)="openDocumentsService.openDocument(doc)">
         <td>{{doc.created | customDate}}</td>
         <td>{{doc.title | documentTitle}}<app-tag [tag]="t" *ngFor="let t of doc.tags$ | async" class="ms-1" (click)="clickTag(t); $event.stopPropagation();"></app-tag></td>
       </tr>
diff --git a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.ts b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.ts
index 89db3ef81..94e0c4052 100644
--- a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.ts
+++ b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.ts
@@ -1,6 +1,6 @@
 import { Component, Input, OnDestroy, OnInit } from '@angular/core'
 import { Router } from '@angular/router'
-import { first, Subscription } from 'rxjs'
+import { Subscription } from 'rxjs'
 import { PaperlessDocument } from 'src/app/data/paperless-document'
 import { PaperlessSavedView } from 'src/app/data/paperless-saved-view'
 import { ConsumerStatusService } from 'src/app/services/consumer-status.service'
@@ -23,7 +23,7 @@ export class SavedViewWidgetComponent implements OnInit, OnDestroy {
     private router: Router,
     private queryParamsService: QueryParamsService,
     private consumerStatusService: ConsumerStatusService,
-    private openDocumentsService: OpenDocumentsService
+    public openDocumentsService: OpenDocumentsService
   ) {}
 
   @Input()
@@ -72,15 +72,6 @@ export class SavedViewWidgetComponent implements OnInit, OnDestroy {
     }
   }
 
-  clickDoc(doc: PaperlessDocument) {
-    this.openDocumentsService
-      .openDocument(doc)
-      .pipe(first())
-      .subscribe((open) => {
-        if (open) this.router.navigate(['documents', doc.id])
-      })
-  }
-
   clickTag(tag: PaperlessTag) {
     this.queryParamsService.navigateWithFilterRules([
       { rule_type: FILTER_HAS_TAGS_ALL, value: tag.id.toString() },
diff --git a/src-ui/src/app/components/document-detail/document-detail.component.ts b/src-ui/src/app/components/document-detail/document-detail.component.ts
index 4d66ea384..6f1614e5f 100644
--- a/src-ui/src/app/components/document-detail/document-detail.component.ts
+++ b/src-ui/src/app/components/document-detail/document-detail.component.ts
@@ -204,7 +204,7 @@ export class DocumentDetailComponent
               this.openDocumentService.getOpenDocument(this.documentId)
             )
           } else {
-            this.openDocumentService.openDocument(doc)
+            this.openDocumentService.openDocument(doc, false)
             this.updateComponent(doc)
           }
 
diff --git a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html
index d0080f0ce..5eb4a97dd 100644
--- a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html
+++ b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html
@@ -37,7 +37,7 @@
                 <use xlink:href="assets/bootstrap-icons.svg#diagram-3"/>
               </svg>&nbsp;<span class="d-none d-md-inline" i18n>More like this</span>
             </a>
-            <a (click)="clickEdit()" class="btn btn-sm btn-outline-secondary">
+            <a (click)="openDocumentsService.openDocument(document)" class="btn btn-sm btn-outline-secondary">
               <svg class="sidebaricon" fill="currentColor" class="sidebaricon">
                 <use xlink:href="assets/bootstrap-icons.svg#pencil"/>
               </svg>&nbsp;<span class="d-none d-md-inline" i18n>Edit</span>
diff --git a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts
index 8eff2e491..061a0e681 100644
--- a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts
+++ b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts
@@ -14,8 +14,6 @@ import {
 } from 'src/app/services/settings.service'
 import { NgbPopover } from '@ng-bootstrap/ng-bootstrap'
 import { OpenDocumentsService } from 'src/app/services/open-documents.service'
-import { Router } from '@angular/router'
-import { first } from 'rxjs'
 
 @Component({
   selector: 'app-document-card-large',
@@ -29,8 +27,7 @@ export class DocumentCardLargeComponent implements OnInit {
   constructor(
     private documentService: DocumentService,
     private settingsService: SettingsService,
-    private openDocumentsService: OpenDocumentsService,
-    private router: Router
+    public openDocumentsService: OpenDocumentsService
   ) {}
 
   @Input()
@@ -121,13 +118,4 @@ export class DocumentCardLargeComponent implements OnInit {
   get contentTrimmed() {
     return this.document.content.substr(0, 500)
   }
-
-  clickEdit() {
-    this.openDocumentsService
-      .openDocument(this.document)
-      .pipe(first())
-      .subscribe((open) => {
-        if (open) this.router.navigate(['documents', this.document.id])
-      })
-  }
 }
diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
index 7844ce419..6c68cc26f 100644
--- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
+++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
@@ -63,7 +63,7 @@
       </div>
       <div class="d-flex justify-content-between align-items-center">
         <div class="btn-group w-100">
-          <a (click)="clickEdit()" class="btn btn-sm btn-outline-secondary" title="Edit" i18n-title>
+          <a (click)="openDocumentsService.openDocument(document)" class="btn btn-sm btn-outline-secondary" title="Edit" i18n-title>
             <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-pencil" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
               <path fill-rule="evenodd" d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5L13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175l-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
             </svg>
diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts
index c7fff39b5..c166b42cb 100644
--- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts
+++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts
@@ -6,7 +6,7 @@ import {
   Output,
   ViewChild,
 } from '@angular/core'
-import { first, map } from 'rxjs/operators'
+import { map } from 'rxjs/operators'
 import { PaperlessDocument } from 'src/app/data/paperless-document'
 import { DocumentService } from 'src/app/services/rest/document.service'
 import {
@@ -15,7 +15,6 @@ import {
 } from 'src/app/services/settings.service'
 import { NgbPopover } from '@ng-bootstrap/ng-bootstrap'
 import { OpenDocumentsService } from 'src/app/services/open-documents.service'
-import { Router } from '@angular/router'
 
 @Component({
   selector: 'app-document-card-small',
@@ -29,8 +28,7 @@ export class DocumentCardSmallComponent implements OnInit {
   constructor(
     private documentService: DocumentService,
     private settingsService: SettingsService,
-    private openDocumentsService: OpenDocumentsService,
-    private router: Router
+    public openDocumentsService: OpenDocumentsService
   ) {}
 
   @Input()
@@ -113,13 +111,4 @@ export class DocumentCardSmallComponent implements OnInit {
   mouseLeaveCard() {
     this.popover.close()
   }
-
-  clickEdit() {
-    this.openDocumentsService
-      .openDocument(this.document)
-      .pipe(first())
-      .subscribe((open) => {
-        if (open) this.router.navigate(['documents', this.document.id])
-      })
-  }
 }
diff --git a/src-ui/src/app/components/document-list/document-list.component.html b/src-ui/src/app/components/document-list/document-list.component.html
index 1b0eae525..aa43243fc 100644
--- a/src-ui/src/app/components/document-list/document-list.component.html
+++ b/src-ui/src/app/components/document-list/document-list.component.html
@@ -168,7 +168,7 @@
           </ng-container>
         </td>
         <td>
-          <a (click)="clickEdit(d.id)" title="Edit document" style="overflow-wrap: anywhere;">{{d.title | documentTitle}}</a>
+          <a (click)="openDocumentsService.openDocument(d)" title="Edit document" style="overflow-wrap: anywhere;">{{d.title | documentTitle}}</a>
           <app-tag [tag]="t" *ngFor="let t of d.tags$ | async" class="ms-1" clickable="true" linkTitle="Filter by tag" (click)="clickTag(t.id);$event.stopPropagation()"></app-tag>
         </td>
         <td class="d-none d-xl-table-cell">
diff --git a/src-ui/src/app/components/document-list/document-list.component.ts b/src-ui/src/app/components/document-list/document-list.component.ts
index 3d6db5731..8cf6c3848 100644
--- a/src-ui/src/app/components/document-list/document-list.component.ts
+++ b/src-ui/src/app/components/document-list/document-list.component.ts
@@ -21,10 +21,7 @@ import {
 import { ConsumerStatusService } from 'src/app/services/consumer-status.service'
 import { DocumentListViewService } from 'src/app/services/document-list-view.service'
 import { OpenDocumentsService } from 'src/app/services/open-documents.service'
-import {
-  filterRulesFromQueryParams,
-  QueryParamsService,
-} from 'src/app/services/query-params.service'
+import { QueryParamsService } from 'src/app/services/query-params.service'
 import {
   DOCUMENT_SORT_FIELDS,
   DOCUMENT_SORT_FIELDS_FULLTEXT,
@@ -49,7 +46,7 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
     private modalService: NgbModal,
     private consumerStatusService: ConsumerStatusService,
     private queryParamsService: QueryParamsService,
-    private openDocumentsService: OpenDocumentsService
+    public openDocumentsService: OpenDocumentsService
   ) {}
 
   @ViewChild('filterEditor')
@@ -247,15 +244,6 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
     else this.list.selectRangeTo(document)
   }
 
-  clickEdit(doc: PaperlessDocument) {
-    this.openDocumentsService
-      .openDocument(doc)
-      .pipe(first())
-      .subscribe((open) => {
-        if (open) this.router.navigate(['documents', doc.id])
-      })
-  }
-
   clickTag(tagID: number) {
     this.list.selectNone()
     setTimeout(() => {
diff --git a/src-ui/src/app/services/open-documents.service.ts b/src-ui/src/app/services/open-documents.service.ts
index 37e29cd6e..d7746d261 100644
--- a/src-ui/src/app/services/open-documents.service.ts
+++ b/src-ui/src/app/services/open-documents.service.ts
@@ -6,6 +6,7 @@ import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { ConfirmDialogComponent } from 'src/app/components/common/confirm-dialog/confirm-dialog.component'
 import { Observable, Subject, of } from 'rxjs'
 import { first } from 'rxjs/operators'
+import { Router } from '@angular/router'
 
 @Injectable({
   providedIn: 'root',
@@ -15,7 +16,8 @@ export class OpenDocumentsService {
 
   constructor(
     private documentService: DocumentService,
-    private modalService: NgbModal
+    private modalService: NgbModal,
+    private router: Router
   ) {
     if (sessionStorage.getItem(OPEN_DOCUMENT_SERVICE.DOCUMENTS)) {
       try {
@@ -55,26 +57,41 @@ export class OpenDocumentsService {
     return this.openDocuments.find((d) => d.id == id)
   }
 
-  openDocument(doc: PaperlessDocument): Observable<boolean> {
+  openDocument(
+    doc: PaperlessDocument,
+    navigate: boolean = true
+  ): Observable<boolean> {
     if (this.openDocuments.find((d) => d.id == doc.id) == null) {
       if (this.openDocuments.length == this.MAX_OPEN_DOCUMENTS) {
+        // at max, ensure changes arent lost
         const docToRemove = this.openDocuments[this.MAX_OPEN_DOCUMENTS - 1]
         const closeObservable = this.closeDocument(docToRemove)
         closeObservable.pipe(first()).subscribe((closed) => {
-          if (closed) {
-            this.openDocuments.unshift(doc)
-            this.save()
-          }
+          if (closed) this.finishOpenDocument(doc, navigate)
         })
         return closeObservable
       } else {
-        this.openDocuments.unshift(doc)
-        this.save()
+        // not at max
+        this.finishOpenDocument(doc, navigate)
+      }
+    } else {
+      // doc is open, just maybe navigate
+      if (navigate) {
+        this.router.navigate(['documents', doc.id])
       }
     }
     return of(true)
   }
 
+  private finishOpenDocument(doc: PaperlessDocument, navigate: boolean) {
+    this.openDocuments.unshift(doc)
+    this.dirtyDocuments.delete(doc.id)
+    this.save()
+    if (navigate) {
+      this.router.navigate(['documents', doc.id])
+    }
+  }
+
   setDirty(documentId: number, dirty: boolean) {
     if (dirty) this.dirtyDocuments.add(documentId)
     else this.dirtyDocuments.delete(documentId)
@@ -96,7 +113,7 @@ export class OpenDocumentsService {
         $localize`You have unsaved changes to the document` +
         ' "' +
         doc.title +
-        '"'
+        '".'
       modal.componentInstance.message = $localize`Are you sure you want to close this document?`
       modal.componentInstance.btnClass = 'btn-warning'
       modal.componentInstance.btnCaption = $localize`Close document`

From 2f739ff0b392c072a358b18121206cc32e485b4f Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Tue, 17 May 2022 09:09:38 -0700
Subject: [PATCH 4/4] close button color with light primary only for toasts

---
 src-ui/src/theme.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src-ui/src/theme.scss b/src-ui/src/theme.scss
index a18ce1358..732ac47d9 100644
--- a/src-ui/src/theme.scss
+++ b/src-ui/src/theme.scss
@@ -39,7 +39,7 @@ $form-check-radio-checked-bg-image-dark: url("data:image/svg+xml,<svg xmlns='htt
     background-image: escape-svg($form-check-radio-checked-bg-image-dark);
   }
 
-  .btn-close {
+  .toast .btn-close {
     filter: none !important;
   }
 }