Chorehancement: update to Angular v22, 'zoneless' / 'reactive' (#13114)

This commit is contained in:
shamoon
2026-07-10 00:42:16 -07:00
committed by GitHub
parent f244442c65
commit 106b41a15c
213 changed files with 5363 additions and 5842 deletions
@@ -1,8 +1,8 @@
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title" i18n>{
documentIds.length,
documentIds().length,
plural,
=1 {Email Document} other {Email {{documentIds.length}} Documents}
=1 {Email Document} other {Email {{documentIds().length}} Documents}
}</h4>
<button type="button" class="btn-close" aria-label="Close" (click)="close()"></button>
</div>
@@ -23,11 +23,11 @@
<div class="modal-footer">
<div class="input-group">
<div class="input-group-text flex-grow-1">
<input class="form-check-input mt-0 me-2" type="checkbox" role="switch" id="useArchiveVersion" [disabled]="!hasArchiveVersion" [(ngModel)]="useArchiveVersion">
<input class="form-check-input mt-0 me-2" type="checkbox" role="switch" id="useArchiveVersion" [disabled]="!hasArchiveVersion()" [ngModel]="useArchiveVersion()" (ngModelChange)="useArchiveVersion.set($event)">
<label class="form-check-label w-100 text-start" for="useArchiveVersion" i18n>Use archive version</label>
</div>
<button type="submit" class="btn btn-outline-primary" (click)="emailDocuments()" [disabled]="loading || emailAddress.length === 0 || emailMessage.length === 0 || emailSubject.length === 0">
@if (loading) {
<button type="submit" class="btn btn-outline-primary" (click)="emailDocuments()" [disabled]="loading() || emailAddress.length === 0 || emailMessage.length === 0 || emailSubject.length === 0">
@if (loading()) {
<div class="spinner-border spinner-border-sm me-2" role="status"></div>
}
<ng-container i18n>Send email</ng-container>
@@ -36,23 +36,24 @@ describe('EmailDocumentDialogComponent', () => {
documentService = TestBed.inject(DocumentService)
toastService = TestBed.inject(ToastService)
component = fixture.componentInstance
component.documentIds = [1]
component.documentIds.set([1])
fixture.detectChanges()
})
it('should set hasArchiveVersion and useArchiveVersion', () => {
expect(component.hasArchiveVersion).toBeTruthy()
expect(component.useArchiveVersion).toBeTruthy()
expect(component.hasArchiveVersion()).toBeTruthy()
expect(component.useArchiveVersion()).toBeTruthy()
component.hasArchiveVersion = false
expect(component.hasArchiveVersion).toBeFalsy()
expect(component.useArchiveVersion).toBeFalsy()
component.hasArchiveVersion.set(false)
fixture.detectChanges()
expect(component.hasArchiveVersion()).toBeFalsy()
expect(component.useArchiveVersion()).toBeFalsy()
})
it('should support sending single document via email, showing error if needed', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastSuccessSpy = jest.spyOn(toastService, 'showInfo')
component.documentIds = [1]
component.documentIds.set([1])
component.emailAddress = 'hello@paperless-ngx.com'
component.emailSubject = 'Hello'
component.emailMessage = 'World'
@@ -73,7 +74,7 @@ describe('EmailDocumentDialogComponent', () => {
it('should support sending multiple documents via email, showing appropriate messages', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastSuccessSpy = jest.spyOn(toastService, 'showInfo')
component.documentIds = [1, 2, 3]
component.documentIds.set([1, 2, 3])
component.emailAddress = 'hello@paperless-ngx.com'
component.emailSubject = 'Hello'
component.emailMessage = 'World'
@@ -1,4 +1,4 @@
import { Component, Input, inject } from '@angular/core'
import { Component, effect, inject, signal } from '@angular/core'
import { FormsModule } from '@angular/forms'
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
@@ -17,22 +17,9 @@ export class EmailDocumentDialogComponent extends LoadingComponentWithPermission
private documentService = inject(DocumentService)
private toastService = inject(ToastService)
@Input()
documentIds: number[]
private _hasArchiveVersion: boolean = true
@Input()
set hasArchiveVersion(value: boolean) {
this._hasArchiveVersion = value
this.useArchiveVersion = value
}
get hasArchiveVersion(): boolean {
return this._hasArchiveVersion
}
public useArchiveVersion: boolean = true
readonly documentIds = signal<number[]>(undefined)
readonly hasArchiveVersion = signal(true)
readonly useArchiveVersion = signal(true)
public emailAddress: string = ''
public emailSubject: string = ''
@@ -40,22 +27,25 @@ export class EmailDocumentDialogComponent extends LoadingComponentWithPermission
constructor() {
super()
this.loading = false
this.loading.set(false)
effect(() => {
this.useArchiveVersion.set(this.hasArchiveVersion())
})
}
public emailDocuments() {
this.loading = true
this.loading.set(true)
this.documentService
.emailDocuments(
this.documentIds,
this.documentIds(),
this.emailAddress,
this.emailSubject,
this.emailMessage,
this.useArchiveVersion
this.useArchiveVersion()
)
.subscribe({
next: () => {
this.loading = false
this.loading.set(false)
this.emailAddress = ''
this.emailSubject = ''
this.emailMessage = ''
@@ -63,9 +53,9 @@ export class EmailDocumentDialogComponent extends LoadingComponentWithPermission
this.toastService.showInfo($localize`Email sent`)
},
error: (e) => {
this.loading = false
this.loading.set(false)
const errorMessage =
this.documentIds.length > 1
this.documentIds().length > 1
? $localize`Error emailing documents`
: $localize`Error emailing document`
this.toastService.showError(errorMessage, e)