Warn on closing edited doc due to max open docs

2025-04-02 13:45:10 -05:00 · 2022-05-15 22:55:25 -07:00 · 2022-05-15 22:55:25 -07:00 · f5e740f2ec
commit f5e740f2ec
parent c7412deb77
9 changed files with 79 additions and 20 deletions
--- 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>
--- 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() },
--- 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>
--- 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])
+      })
+  }
 }
--- 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>
--- 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])
+      })
+  }
 }
--- 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">
--- 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(() => {
--- 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`