paperless-ngx/src-ui/src/app/components/manage/ocr-templates/ocr-templates.component.ts

import { Component, OnInit, inject, signal } from '@angular/core'
import { FormsModule } from '@angular/forms'
import { NgbDropdownModule, NgbModal } from '@ng-bootstrap/ng-bootstrap'
import { BootstrapIconComponent } from 'src/app/components/common/bootstrap-icon/bootstrap-icon.component'
import { firstValueFrom, takeUntil, tap } from 'rxjs'
import { MATCH_NONE, MATCHING_ALGORITHMS } from 'src/app/data/matching-model'
import { OcrTemplate } from 'src/app/data/ocr-template'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { DirtyFormGuard } from 'src/app/guards/dirty-form.guard'
import {
  PermissionAction,
  PermissionType,
  PermissionsService,
} from 'src/app/services/permissions.service'
import { OcrTemplateService } from 'src/app/services/rest/ocr-template.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { PageHeaderComponent } from '../../common/page-header/page-header.component'
import { LoadingComponentWithPermissions } from '../../loading-component/loading.component'
import { OcrTemplateEditorComponent } from './ocr-template-editor/ocr-template-editor.component'

@Component({
  selector: 'pngx-ocr-templates',
  templateUrl: './ocr-templates.component.html',
  imports: [
    PageHeaderComponent,
    IfPermissionsDirective,
    FormsModule,
    NgbDropdownModule,
    BootstrapIconComponent,
  ],
})
export class OcrTemplatesComponent
  extends LoadingComponentWithPermissions
  implements OnInit
{
  private readonly ocrTemplateService = inject(OcrTemplateService)
  public readonly permissionsService = inject(PermissionsService)
  private readonly modalService = inject(NgbModal)
  private readonly dirtyFormGuard = inject(DirtyFormGuard)
  private readonly toastService = inject(ToastService)

  public readonly templates = signal<OcrTemplate[]>([])

  ngOnInit() {
    this.reload()
  }

  reload() {
    this.loading.set(true)
    this.ocrTemplateService
      .listAll()
      .pipe(
        takeUntil(this.unsubscribeNotifier),
        tap((r) => this.templates.set(r.results))
      )
      .subscribe(() => {
        this.show.set(true)
        this.loading.set(false)
      })
  }

  getMatching(template: OcrTemplate): string {
    if (template.matching_algorithm === MATCH_NONE) {
      return $localize`None`
    }
    if (!template.match) {
      return '-'
    }
    const algorithm = MATCHING_ALGORITHMS.find(
      (a) => a.id === template.matching_algorithm
    )
    return `${algorithm?.shortName}: ${template.match}`
  }

  editTemplate(template?: OcrTemplate) {
    if (template && !this.userCanEdit(template)) return
    const modal = this.modalService.open(OcrTemplateEditorComponent, {
      backdrop: 'static',
      keyboard: false,
      size: 'xxl',
      fullscreen: 'lg',
      scrollable: true,
      ariaLabelledBy: 'ocr-template-editor-title',
      beforeDismiss: () => {
        const editor: OcrTemplateEditorComponent = modal.componentInstance
        if (editor.saving()) return false
        if (!editor.isDirty) return true
        return firstValueFrom(
          this.dirtyFormGuard.confirmChanges(undefined, $localize`Close`)
        )
      },
    })
    modal.componentInstance.object = template
    modal.componentInstance.succeeded
      .pipe(takeUntil(this.unsubscribeNotifier))
      .subscribe((saved: OcrTemplate) => {
        this.toastService.showSuccess(
          $localize`Saved OCR template "${saved.name}".`
        )
        this.ocrTemplateService.clearCache()
        this.reload()
      })
    modal.componentInstance.failed
      .pipe(takeUntil(this.unsubscribeNotifier))
      .subscribe((e) => {
        this.toastService.showError($localize`Error saving OCR template.`, e)
      })
  }

  toggleTemplateEnabled(template: OcrTemplate) {
    if (!this.userCanEdit(template)) return
    this.ocrTemplateService
      .patch({ id: template.id, enabled: template.enabled } as OcrTemplate)
      .subscribe({
        next: () => {
          this.toastService.showSuccess(
            template.enabled
              ? $localize`Enabled OCR template "${template.name}"`
              : $localize`Disabled OCR template "${template.name}"`
          )
          this.reload()
        },
        error: (e) => {
          this.toastService.showError(
            $localize`Error toggling OCR template "${template.name}".`,
            e
          )
          this.reload()
        },
      })
  }

  deleteTemplate(template: OcrTemplate) {
    if (
      !this.permissionsService.currentUserCan(
        PermissionAction.Delete,
        PermissionType.OcrTemplate
      ) ||
      !this.permissionsService.currentUserOwnsObject(template)
    )
      return
    const modal = this.modalService.open(ConfirmDialogComponent, {
      backdrop: 'static',
    })
    modal.componentInstance.title = $localize`Confirm delete OCR template`
    modal.componentInstance.messageBold = $localize`This operation will permanently delete this OCR template.`
    modal.componentInstance.message = $localize`This operation cannot be undone.`
    modal.componentInstance.btnClass = 'btn-danger'
    modal.componentInstance.btnCaption = $localize`Proceed`
    modal.componentInstance.confirmClicked.subscribe(() => {
      modal.componentInstance.buttonsEnabled.set(false)
      this.ocrTemplateService.delete(template).subscribe({
        next: () => {
          modal.close()
          this.toastService.showSuccess(
            $localize`Deleted OCR template "${template.name}".`
          )
          this.ocrTemplateService.clearCache()
          this.reload()
        },
        error: (e) => {
          modal.componentInstance.buttonsEnabled.set(true)
          this.toastService.showError(
            $localize`Error deleting OCR template "${template.name}".`,
            e
          )
        },
      })
    })
  }

  userCanEdit(template: OcrTemplate): boolean {
    return (
      this.permissionsService.currentUserCan(
        PermissionAction.Change,
        PermissionType.OcrTemplate
      ) &&
      this.permissionsService.currentUserHasObjectPermissions(
        PermissionAction.Change,
        template
      )
    )
  }
}