Rename comments --> notes

2025-07-28 18:24:38 -05:00 · 2023-03-17 16:36:08 -07:00
parent 78cb8cff69
commit 5108bbc192
45 changed files with 540 additions and 528 deletions
--- a/src-ui/src/app/components/document-comments/document-comments.component.ts
+++ b/src-ui/src/app/components/document-comments/document-comments.component.ts
@@ -1,99 +0,0 @@
-import { Component, Input, Output, EventEmitter } from '@angular/core'
-import { DocumentCommentsService } from 'src/app/services/rest/document-comments.service'
-import { PaperlessDocumentComment } from 'src/app/data/paperless-document-comment'
-import { FormControl, FormGroup } from '@angular/forms'
-import { first } from 'rxjs/operators'
-import { ToastService } from 'src/app/services/toast.service'
-import { ComponentWithPermissions } from '../with-permissions/with-permissions.component'
-
-@Component({
-  selector: 'app-document-comments',
-  templateUrl: './document-comments.component.html',
-  styleUrls: ['./document-comments.component.scss'],
-})
-export class DocumentCommentsComponent extends ComponentWithPermissions {
-  commentForm: FormGroup = new FormGroup({
-    newComment: new FormControl(''),
-  })
-
-  networkActive = false
-  newCommentError: boolean = false
-
-  @Input()
-  documentId: number
-
-  @Input()
-  comments: PaperlessDocumentComment[] = []
-
-  @Output()
-  updated: EventEmitter<PaperlessDocumentComment[]> = new EventEmitter()
-
-  constructor(
-    private commentsService: DocumentCommentsService,
-    private toastService: ToastService
-  ) {
-    super()
-  }
-
-  addComment() {
-    const comment: string = this.commentForm
-      .get('newComment')
-      .value.toString()
-      .trim()
-    if (comment.length == 0) {
-      this.newCommentError = true
-      return
-    }
-    this.newCommentError = false
-    this.networkActive = true
-    this.commentsService.addComment(this.documentId, comment).subscribe({
-      next: (result) => {
-        this.comments = result
-        this.commentForm.get('newComment').reset()
-        this.networkActive = false
-        this.updated.emit(this.comments)
-      },
-      error: (e) => {
-        this.networkActive = false
-        this.toastService.showError(
-          $localize`Error saving comment: ${e.toString()}`
-        )
-      },
-    })
-  }
-
-  deleteComment(commentId: number) {
-    this.commentsService.deleteComment(this.documentId, commentId).subscribe({
-      next: (result) => {
-        this.comments = result
-        this.networkActive = false
-        this.updated.emit(this.comments)
-      },
-      error: (e) => {
-        this.networkActive = false
-        this.toastService.showError(
-          $localize`Error deleting comment: ${e.toString()}`
-        )
-      },
-    })
-  }
-
-  displayName(comment: PaperlessDocumentComment): string {
-    if (!comment.user) return ''
-    let nameComponents = []
-    if (comment.user.first_name) nameComponents.unshift(comment.user.first_name)
-    if (comment.user.last_name) nameComponents.unshift(comment.user.last_name)
-    if (comment.user.username) {
-      if (nameComponents.length > 0)
-        nameComponents.push(`(${comment.user.username})`)
-      else nameComponents.push(comment.user.username)
-    }
-    return nameComponents.join(' ')
-  }
-
-  commentFormKeydown(event: KeyboardEvent) {
-    if ((event.metaKey || event.ctrlKey) && event.key === 'Enter') {
-      this.addComment()
-    }
-  }
-}
--- a/src-ui/src/app/components/document-detail/document-detail.component.html
+++ b/src-ui/src/app/components/document-detail/document-detail.component.html
@@ -171,10 +171,10 @@
                    </ng-template>
                </li>

-                <li [ngbNavItem]="DocumentDetailNavIDs.Comments" *ngIf="commentsEnabled">
-                    <a ngbNavLink i18n>Comments <span *ngIf="document?.comments.length" class="badge text-bg-secondary ms-1">{{document.comments.length}}</span></a>
+                <li [ngbNavItem]="DocumentDetailNavIDs.Notes" *ngIf="notesEnabled">
+                    <a ngbNavLink i18n>Notes <span *ngIf="document?.notes.length" class="badge text-bg-secondary ms-1">{{document.notes.length}}</span></a>
                    <ng-template ngbNavContent>
-                        <app-document-comments [documentId]="documentId" [comments]="document?.comments" (updated)="commentsUpdated($event)"></app-document-comments>
+                        <app-document-notes [documentId]="documentId" [notes]="document?.notes" (updated)="notesUpdated($event)"></app-document-notes>
                    </ng-template>
                </li>

--- a/src-ui/src/app/components/document-detail/document-detail.component.ts
+++ b/src-ui/src/app/components/document-detail/document-detail.component.ts
@@ -42,14 +42,14 @@ import {
 } from 'src/app/services/permissions.service'
 import { PaperlessUser } from 'src/app/data/paperless-user'
 import { UserService } from 'src/app/services/rest/user.service'
-import { PaperlessDocumentComment } from 'src/app/data/paperless-document-comment'
+import { PaperlessDocumentNote } from 'src/app/data/paperless-document-note'

 enum DocumentDetailNavIDs {
  Details = 1,
  Content = 2,
  Metadata = 3,
  Preview = 4,
-  Comments = 5,
+  Notes = 5,
  Permissions = 6,
 }

@@ -658,9 +658,9 @@ export class DocumentDetailComponent
    }
  }

-  get commentsEnabled(): boolean {
+  get notesEnabled(): boolean {
    return (
-      this.settings.get(SETTINGS_KEYS.COMMENTS_ENABLED) &&
+      this.settings.get(SETTINGS_KEYS.NOTES_ENABLED) &&
      this.permissionsService.currentUserCan(
        PermissionAction.View,
        PermissionType.Document
@@ -668,8 +668,8 @@ export class DocumentDetailComponent
    )
  }

-  commentsUpdated(comments: PaperlessDocumentComment[]) {
-    this.document.comments = comments
+  notesUpdated(notes: PaperlessDocumentNote[]) {
+    this.document.notes = notes
    this.openDocumentService.refreshDocument(this.documentId)
  }

--- 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
@@ -26,7 +26,7 @@
        </div>
        <p class="card-text">
          <span *ngIf="document.__search_hit__ && document.__search_hit__.highlights" [innerHtml]="document.__search_hit__.highlights"></span>
-          <span *ngFor="let highlight of searchCommentHighlights" class="d-block">
+          <span *ngFor="let highlight of searchNoteHighlights" class="d-block">
            <svg width="1em" height="1em" fill="currentColor" class="me-2">
              <use xlink:href="assets/bootstrap-icons.svg#chat-left-text"/>
            </svg>
@@ -67,11 +67,11 @@


          <div class="list-group list-group-horizontal border-0 card-info ms-md-auto mt-2 mt-md-0">
-            <button routerLink="/documents/{{document.id}}/comments" *ngIf="document.comments.length" class="list-group-item btn btn-sm bg-light text-dark p-1 border-0 me-2" title="View comments" i18n-title>
+            <button *ngIf="notesEnabled && document.notes.length" routerLink="/documents/{{document.id}}/notes" class="list-group-item btn btn-sm bg-light text-dark p-1 border-0 me-2" title="View notes" i18n-title>
              <svg class="metadata-icon me-2 text-muted" fill="currentColor">
                <use xlink:href="assets/bootstrap-icons.svg#chat-left-text"/>
              </svg>
-              <small i18n>{{document.comments.length}} Comments</small>
+              <small i18n>{{document.notes.length}} Notes</small>
            </button>
            <button *ngIf="document.document_type" type="button" class="list-group-item btn btn-sm bg-light text-dark p-1 border-0 me-2" title="Filter by document type" i18n-title
             (click)="clickDocumentType.emit(document.document_type);$event.stopPropagation()">
--- 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
@@ -73,16 +73,14 @@ export class DocumentCardLargeComponent extends ComponentWithPermissions {
    }
  }

-  get searchCommentHighlights() {
+  get searchNoteHighlights() {
    let highlights = []
    if (
      this.document['__search_hit__'] &&
-      this.document['__search_hit__'].comment_highlights
+      this.document['__search_hit__'].note_highlights
    ) {
-      // only show comments with a match
-      highlights = (
-        this.document['__search_hit__'].comment_highlights as string
-      )
+      // only show notes with a match
+      highlights = (this.document['__search_hit__'].note_highlights as string)
        .split(',')
        .filter((higlight) => higlight.includes('<span'))
    }
@@ -136,4 +134,8 @@ export class DocumentCardLargeComponent extends ComponentWithPermissions {
      (this.document.content.length > 500 ? '...' : '')
    )
  }
+
+  get notesEnabled(): boolean {
+    return this.settingsService.get(SETTINGS_KEYS.NOTES_ENABLED)
+  }
 }
--- 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
@@ -13,20 +13,20 @@
      <div class="tags d-flex flex-column text-end position-absolute me-1 fs-6">
        <app-tag *ngFor="let t of getTagsLimited$() | async" [tag]="t" (click)="clickTag.emit(t.id);$event.stopPropagation()" [clickable]="true" linkTitle="Toggle tag filter" i18n-linkTitle></app-tag>
        <div *ngIf="moreTags">
-          <span class="badge badge-secondary">+ {{moreTags}}</span>
+          <span class="badge text-dark">+ {{moreTags}}</span>
        </div>
      </div>
    </div>

-    <a routerLink="/documents/{{document.id}}/comments" *ngIf="document.comments.length" class="document-card-comments py-2 px-1">
+    <a *ngIf="notesEnabled && document.notes.length" routerLink="/documents/{{document.id}}/notes" class="document-card-notes py-2 px-1">
      <span class="badge rounded-pill bg-light border text-primary">
      <svg class="metadata-icon ms-1 me-1" fill="currentColor">
        <use xlink:href="assets/bootstrap-icons.svg#chat-left-text"/>
      </svg>
-      {{document.comments.length}}</span>
+      {{document.notes.length}}</span>
    </a>

-    <div class="card-body p-2">
+    <div class="card-body bg-light p-2">
      <p class="card-text">
        <ng-container *ngIf="document.correspondent">
          <a title="Toggle correspondent filter" i18n-title (click)="clickCorrespondent.emit(document.correspondent);$event.stopPropagation()" class="fw-bold btn-link">{{(document.correspondent$ | async)?.name}}</a>:
--- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss
+++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss
@@ -34,10 +34,10 @@
  display: block;
 }

-.document-card-comments {
+.document-card-notes {
  position: absolute;
  right: 0;
-  bottom: 170px;
+  top: 142px;
 }

 .card-selected {
--- 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
@@ -74,7 +74,7 @@ export class DocumentCardSmallComponent extends ComponentWithPermissions {
  }

  getTagsLimited$() {
-    const limit = this.document.comments.length > 0 ? 6 : 7
+    const limit = this.document.notes.length > 0 ? 6 : 7
    return this.document.tags$.pipe(
      map((tags) => {
        if (tags.length > limit) {
@@ -111,4 +111,8 @@ export class DocumentCardSmallComponent extends ComponentWithPermissions {
  mouseLeaveCard() {
    this.popover.close()
  }
+
+  get notesEnabled(): boolean {
+    return this.settingsService.get(SETTINGS_KEYS.NOTES_ENABLED)
+  }
 }
--- a/src-ui/src/app/components/document-list/document-list.component.html
+++ b/src-ui/src/app/components/document-list/document-list.component.html
@@ -139,12 +139,12 @@
        [currentSortReverse]="list.sortReverse"
        (sort)="onSort($event)"
        i18n>Title</th>
-      <th class="d-none d-xl-table-cell"
-        appSortable="num_comments"
+      <th *ngIf="notesEnabled" class="d-none d-xl-table-cell"
+        appSortable="num_notes"
        [currentSortField]="list.sortField"
        [currentSortReverse]="list.sortReverse"
        (sort)="onSort($event)"
-        i18n>Comments</th>
+        i18n>Notes</th>
      <th class="d-none d-xl-table-cell"
        appSortable="document_type__name"
        [currentSortField]="list.sortField"
@@ -190,13 +190,13 @@
          <a routerLink="/documents/{{d.id}}" title="Edit document" i18n-title 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" i18n-linkTitle (click)="clickTag(t.id);$event.stopPropagation()"></app-tag>
        </td>
-        <td class="d-none d-xl-table-cell">
-          <a routerLink="/documents/{{d.id}}/comments" *ngIf="d.comments.length" class="btn btn-sm p-0">
+        <td *ngIf="notesEnabled" class="d-none d-xl-table-cell">
+          <a *ngIf="d.notes.length" routerLink="/documents/{{d.id}}/notes" class="btn btn-sm p-0">
            <span class="badge rounded-pill bg-light border text-primary">
            <svg class="metadata-icon ms-1 me-1" fill="currentColor">
              <use xlink:href="assets/bootstrap-icons.svg#chat-left-text"/>
            </svg>
-            {{d.comments.length}}</span>
+            {{d.notes.length}}</span>
          </a>
        </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
@@ -17,6 +17,7 @@ import {
 import { FILTER_FULLTEXT_MORELIKE } from 'src/app/data/filter-rule-type'
 import { PaperlessDocument } from 'src/app/data/paperless-document'
 import { PaperlessSavedView } from 'src/app/data/paperless-saved-view'
+import { SETTINGS_KEYS } from 'src/app/data/paperless-uisettings'
 import {
  SortableDirective,
  SortEvent,
@@ -29,6 +30,7 @@ import {
  DOCUMENT_SORT_FIELDS_FULLTEXT,
 } from 'src/app/services/rest/document.service'
 import { SavedViewService } from 'src/app/services/rest/saved-view.service'
+import { SettingsService } from 'src/app/services/settings.service'
 import { ToastService } from 'src/app/services/toast.service'
 import { ComponentWithPermissions } from '../with-permissions/with-permissions.component'
 import { FilterEditorComponent } from './filter-editor/filter-editor.component'
@@ -51,7 +53,8 @@ export class DocumentListComponent
    private toastService: ToastService,
    private modalService: NgbModal,
    private consumerStatusService: ConsumerStatusService,
-    public openDocumentsService: OpenDocumentsService
+    public openDocumentsService: OpenDocumentsService,
+    private settingsService: SettingsService
  ) {
    super()
  }
@@ -289,4 +292,8 @@ export class DocumentListComponent
  trackByDocumentId(index, item: PaperlessDocument) {
    return item.id
  }
+
+  get notesEnabled(): boolean {
+    return this.settingsService.get(SETTINGS_KEYS.NOTES_ENABLED)
+  }
 }
--- a/src-ui/src/app/components/document-comments/document-comments.component.html
+++ b/src-ui/src/app/components/document-comments/document-comments.component.html
@@ -1,28 +1,28 @@
-<div *ngIf="comments">
-    <form [formGroup]="commentForm" class="needs-validation mt-3" *appIfPermissions="{ action: PermissionAction.Add, type: PermissionType.Comment }" novalidate>
+<div *ngIf="notes">
+    <form [formGroup]="noteForm" class="needs-validation mt-3" *appIfPermissions="{ action: PermissionAction.Add, type: PermissionType.Note }" novalidate>
        <div class="form-group">
-            <textarea class="form-control form-control-sm" [class.is-invalid]="newCommentError" rows="3" formControlName="newComment" placeholder="Enter comment" i18n-placeholder (keydown)="commentFormKeydown($event)" required></textarea>
+            <textarea class="form-control form-control-sm" [class.is-invalid]="newNoteError" rows="3" formControlName="newNote" placeholder="Enter note" i18n-placeholder (keydown)="noteFormKeydown($event)" required></textarea>
            <div class="invalid-feedback" i18n>
-                Please enter a comment.
+                Please enter a note.
            </div>
        </div>
        <div class="form-group mt-2 d-flex justify-content-end align-items-center">
            <div *ngIf="networkActive" class="spinner-border spinner-border-sm fw-normal me-auto" role="status"></div>
-            <button type="button" class="btn btn-primary btn-sm" [disabled]="networkActive" (click)="addComment()" i18n>Add comment</button>
+            <button type="button" class="btn btn-primary btn-sm" [disabled]="networkActive" (click)="addNote()" i18n>Add note</button>
        </div>
    </form>
    <hr>
-    <div *ngFor="let comment of comments" class="card border mb-3">
+    <div *ngFor="let note of notes" class="card border mb-3">
        <div class="card-body text-dark">
-            <p class="card-text">{{comment.comment}}</p>
+            <p class="card-text">{{note.note}}</p>
        </div>
        <div class="d-flex card-footer small bg-light text-primary justify-content-between align-items-center">
-            <span>{{displayName(comment)}} - {{ comment.created | customDate}}</span>
-            <button type="button" class="btn btn-link btn-sm p-0 fade" title="Delete comment" i18n-title (click)="deleteComment(comment.id)" *appIfPermissions="{ action: PermissionAction.Delete, type: PermissionType.Comment }">
+            <span>{{displayName(note)}} - {{ note.created | customDate}}</span>
+            <button type="button" class="btn btn-link btn-sm p-0 fade" title="Delete note" i18n-title (click)="deleteNote(note.id)" *appIfPermissions="{ action: PermissionAction.Delete, type: PermissionType.Note }">
                <svg width="13" height="13" fill="currentColor">
                    <use xlink:href="assets/bootstrap-icons.svg#trash" />
                </svg>
-                <span class="visually-hidden" i18n>Delete comment</span>
+                <span class="visually-hidden" i18n>Delete note</span>
            </button>
        </div>
    </div>
--- a/src-ui/src/app/components/document-comments/document-comments.component.scss
+++ b/src-ui/src/app/components/document-comments/document-comments.component.scss
--- a/src-ui/src/app/components/document-notes/document-notes.component.ts
+++ b/src-ui/src/app/components/document-notes/document-notes.component.ts
@@ -0,0 +1,106 @@
+import { Component, Input, Output, EventEmitter } from '@angular/core'
+import { DocumentNotesService } from 'src/app/services/rest/document-notes.service'
+import { PaperlessDocumentNote } from 'src/app/data/paperless-document-note'
+import { FormControl, FormGroup } from '@angular/forms'
+import { first } from 'rxjs/operators'
+import { ToastService } from 'src/app/services/toast.service'
+import { ComponentWithPermissions } from '../with-permissions/with-permissions.component'
+import { UserService } from 'src/app/services/rest/user.service'
+import { PaperlessUser } from 'src/app/data/paperless-user'
+
+@Component({
+  selector: 'app-document-notes',
+  templateUrl: './document-notes.component.html',
+  styleUrls: ['./document-notes.component.scss'],
+})
+export class DocumentNotesComponent extends ComponentWithPermissions {
+  noteForm: FormGroup = new FormGroup({
+    newNote: new FormControl(''),
+  })
+
+  networkActive = false
+  newNoteError: boolean = false
+
+  @Input()
+  documentId: number
+
+  @Input()
+  notes: PaperlessDocumentNote[] = []
+
+  @Output()
+  updated: EventEmitter<PaperlessDocumentNote[]> = new EventEmitter()
+  users: PaperlessUser[]
+
+  constructor(
+    private notesService: DocumentNotesService,
+    private toastService: ToastService,
+    private usersService: UserService
+  ) {
+    super()
+    this.usersService.listAll().subscribe({
+      next: (users) => {
+        this.users = users.results
+      },
+    })
+  }
+
+  addNote() {
+    const note: string = this.noteForm.get('newNote').value.toString().trim()
+    if (note.length == 0) {
+      this.newNoteError = true
+      return
+    }
+    this.newNoteError = false
+    this.networkActive = true
+    this.notesService.addNote(this.documentId, note).subscribe({
+      next: (result) => {
+        this.notes = result
+        this.noteForm.get('newNote').reset()
+        this.networkActive = false
+        this.updated.emit(this.notes)
+      },
+      error: (e) => {
+        this.networkActive = false
+        this.toastService.showError(
+          $localize`Error saving note: ${e.toString()}`
+        )
+      },
+    })
+  }
+
+  deleteNote(noteId: number) {
+    this.notesService.deleteNote(this.documentId, noteId).subscribe({
+      next: (result) => {
+        this.notes = result
+        this.networkActive = false
+        this.updated.emit(this.notes)
+      },
+      error: (e) => {
+        this.networkActive = false
+        this.toastService.showError(
+          $localize`Error deleting note: ${e.toString()}`
+        )
+      },
+    })
+  }
+
+  displayName(note: PaperlessDocumentNote): string {
+    if (!note.user) return ''
+    const user = this.users.find((u) => u.id === note.user)
+    if (!user) return ''
+    const nameComponents = []
+    if (user.first_name) nameComponents.unshift(user.first_name)
+    if (user.last_name) nameComponents.unshift(user.last_name)
+    if (user.username) {
+      if (nameComponents.length > 0) nameComponents.push(`(${user.username})`)
+      else nameComponents.push(user.username)
+    }
+    return nameComponents.join(' ')
+  }
+
+  noteFormKeydown(event: KeyboardEvent) {
+    if ((event.metaKey || event.ctrlKey) && event.key === 'Enter') {
+      this.addNote()
+    }
+  }
+}
--- a/src-ui/src/app/components/manage/settings/settings.component.html
+++ b/src-ui/src/app/components/manage/settings/settings.component.html
@@ -156,11 +156,11 @@
          </div>
        </div>

-        <h4 class="mt-4" i18n>Comments</h4>
+        <h4 class="mt-4" i18n>Notes</h4>

        <div class="row mb-3">
          <div class="offset-md-3 col">
-            <app-input-check i18n-title title="Enable comments" formControlName="commentsEnabled"></app-input-check>
+            <app-input-check i18n-title title="Enable notes" formControlName="notesEnabled"></app-input-check>
          </div>
        </div>

--- a/src-ui/src/app/components/manage/settings/settings.component.ts
+++ b/src-ui/src/app/components/manage/settings/settings.component.ts
@@ -85,7 +85,7 @@ export class SettingsComponent
    displayLanguage: new FormControl(null),
    dateLocale: new FormControl(null),
    dateFormat: new FormControl(null),
-    commentsEnabled: new FormControl(null),
+    notesEnabled: new FormControl(null),
    updateCheckingEnabled: new FormControl(null),

    notificationsConsumerNewDocument: new FormControl(null),
@@ -196,7 +196,7 @@ export class SettingsComponent
      displayLanguage: this.settings.getLanguage(),
      dateLocale: this.settings.get(SETTINGS_KEYS.DATE_LOCALE),
      dateFormat: this.settings.get(SETTINGS_KEYS.DATE_FORMAT),
-      commentsEnabled: this.settings.get(SETTINGS_KEYS.COMMENTS_ENABLED),
+      notesEnabled: this.settings.get(SETTINGS_KEYS.NOTES_ENABLED),
      updateCheckingEnabled: this.settings.get(
        SETTINGS_KEYS.UPDATE_CHECKING_ENABLED
      ),
@@ -552,8 +552,8 @@ export class SettingsComponent
      this.settingsForm.value.notificationsConsumerSuppressOnDashboard
    )
    this.settings.set(
-      SETTINGS_KEYS.COMMENTS_ENABLED,
-      this.settingsForm.value.commentsEnabled
+      SETTINGS_KEYS.NOTES_ENABLED,
+      this.settingsForm.value.notesEnabled
    )
    this.settings.set(
      SETTINGS_KEYS.UPDATE_CHECKING_ENABLED,