paradizelost/paperless-ngx
1
0
Fork 0
mirror of https://github.com/paperless-ngx/paperless-ngx.git synced 2025-10-30 03:56:23 -05:00
Code Issues Packages Projects Releases Wiki Activity

Very annoying refactor

Browse Source
This commit is contained in:
shamoon
2025-03-04 08:53:11 -08:00
parent 4488da6d3d
commit f28accb28f
81 changed files with 1315 additions and 1151 deletions
Download Patch File Download Diff File Expand all files Collapse all files

324
src-ui/messages.xlf
View File

File diff suppressed because it is too large Load Diff

2
src-ui/src/app/app.component.html
View File

@@ -1,4 +1,4 @@
<pngx-toasts></pngx-toasts>
<pngx-notification-list></pngx-notification-list>
<pngx-file-drop>
<ng-container content>

59
src-ui/src/app/app.component.spec.ts
View File

@@ -14,14 +14,17 @@ import { TourNgBootstrapModule, TourService } from 'ngx-ui-tour-ng-bootstrap'
import { Subject } from 'rxjs'
import { routes } from './app-routing.module'
import { AppComponent } from './app.component'
import { ToastsComponent } from './components/common/toasts/toasts.component'
import { NotificationListComponent } from './components/common/notification-list/notification-list.component'
import { FileDropComponent } from './components/file-drop/file-drop.component'
import { DirtySavedViewGuard } from './guards/dirty-saved-view.guard'
import { PermissionsGuard } from './guards/permissions.guard'
import { HotKeyService } from './services/hot-key.service'
import {
Notification,
NotificationService,
} from './services/notification.service'
import { PermissionsService } from './services/permissions.service'
import { SettingsService } from './services/settings.service'
import { Toast, ToastService } from './services/toast.service'
import {
FileStatus,
WebsocketStatusService,
@@ -33,7 +36,7 @@ describe('AppComponent', () => {
let tourService: TourService
let websocketStatusService: WebsocketStatusService
let permissionsService: PermissionsService
let toastService: ToastService
let notificationService: NotificationService
let router: Router
let settingsService: SettingsService
let hotKeyService: HotKeyService
@@ -46,7 +49,7 @@ describe('AppComponent', () => {
NgxFileDropModule,
NgbModalModule,
AppComponent,
ToastsComponent,
NotificationListComponent,
FileDropComponent,
NgxBootstrapIconsModule.pick(allIcons),
],
@@ -62,7 +65,7 @@ describe('AppComponent', () => {
websocketStatusService = TestBed.inject(WebsocketStatusService)
permissionsService = TestBed.inject(PermissionsService)
settingsService = TestBed.inject(SettingsService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
router = TestBed.inject(Router)
hotKeyService = TestBed.inject(HotKeyService)
fixture = TestBed.createComponent(AppComponent)
@@ -82,12 +85,14 @@ describe('AppComponent', () => {
expect(document.body.classList).not.toContain('tour-active')
}))
it('should display toast on document consumed with link if user has access', () => {
it('should display notification on document consumed with link if user has access', () => {
const navigateSpy = jest.spyOn(router, 'navigate')
jest.spyOn(permissionsService, 'currentUserCan').mockReturnValue(true)
let toast: Toast
toastService.getToasts().subscribe((toasts) => (toast = toasts[0]))
const toastSpy = jest.spyOn(toastService, 'show')
let notification: Notification
notificationService
.getNotifications()
.subscribe((notifications) => (notification = notifications[0]))
const notificationSpy = jest.spyOn(notificationService, 'show')
const fileStatusSubject = new Subject<FileStatus>()
jest
.spyOn(websocketStatusService, 'onDocumentConsumptionFinished')
@@ -96,63 +101,65 @@ describe('AppComponent', () => {
const status = new FileStatus()
status.documentId = 1
fileStatusSubject.next(status)
expect(toastSpy).toHaveBeenCalled()
expect(toast.action).not.toBeUndefined()
toast.action()
expect(notificationSpy).toHaveBeenCalled()
expect(notification.action).not.toBeUndefined()
notification.action()
expect(navigateSpy).toHaveBeenCalledWith(['documents', status.documentId])
})
it('should display toast on document consumed without link if user does not have access', () => {
it('should display notification on document consumed without link if user does not have access', () => {
jest.spyOn(permissionsService, 'currentUserCan').mockReturnValue(false)
let toast: Toast
toastService.getToasts().subscribe((toasts) => (toast = toasts[0]))
const toastSpy = jest.spyOn(toastService, 'show')
let notification: Notification
notificationService
.getNotifications()
.subscribe((notifications) => (notification = notifications[0]))
const notificationSpy = jest.spyOn(notificationService, 'show')
const fileStatusSubject = new Subject<FileStatus>()
jest
.spyOn(websocketStatusService, 'onDocumentConsumptionFinished')
.mockReturnValue(fileStatusSubject)
component.ngOnInit()
fileStatusSubject.next(new FileStatus())
expect(toastSpy).toHaveBeenCalled()
expect(toast.action).toBeUndefined()
expect(notificationSpy).toHaveBeenCalled()
expect(notification.action).toBeUndefined()
})
it('should display toast on document added', () => {
it('should display notification on document added', () => {
jest.spyOn(permissionsService, 'currentUserCan').mockReturnValue(true)
const toastSpy = jest.spyOn(toastService, 'show')
const notificationSpy = jest.spyOn(notificationService, 'show')
const fileStatusSubject = new Subject<FileStatus>()
jest
.spyOn(websocketStatusService, 'onDocumentDetected')
.mockReturnValue(fileStatusSubject)
component.ngOnInit()
fileStatusSubject.next(new FileStatus())
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should suppress dashboard notifications if set', () => {
jest.spyOn(permissionsService, 'currentUserCan').mockReturnValue(true)
jest.spyOn(settingsService, 'get').mockReturnValue(true)
jest.spyOn(router, 'url', 'get').mockReturnValue('/dashboard')
const toastSpy = jest.spyOn(toastService, 'show')
const notificationSpy = jest.spyOn(notificationService, 'show')
const fileStatusSubject = new Subject<FileStatus>()
jest
.spyOn(websocketStatusService, 'onDocumentDetected')
.mockReturnValue(fileStatusSubject)
component.ngOnInit()
fileStatusSubject.next(new FileStatus())
expect(toastSpy).not.toHaveBeenCalled()
expect(notificationSpy).not.toHaveBeenCalled()
})
it('should display toast on document failed', () => {
it('should display notification on document failed', () => {
jest.spyOn(permissionsService, 'currentUserCan').mockReturnValue(true)
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
const fileStatusSubject = new Subject<FileStatus>()
jest
.spyOn(websocketStatusService, 'onDocumentConsumptionFailed')
.mockReturnValue(fileStatusSubject)
component.ngOnInit()
fileStatusSubject.next(new FileStatus())
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should support hotkeys', () => {

16
src-ui/src/app/app.component.ts
View File

@@ -2,11 +2,12 @@ import { Component, OnDestroy, OnInit, Renderer2 } from '@angular/core'
import { Router, RouterOutlet } from '@angular/router'
import { TourNgBootstrapModule, TourService } from 'ngx-ui-tour-ng-bootstrap'
import { first, Subscription } from 'rxjs'
import { ToastsComponent } from './components/common/toasts/toasts.component'
import { NotificationListComponent } from './components/common/notification-list/notification-list.component'
import { FileDropComponent } from './components/file-drop/file-drop.component'
import { SETTINGS_KEYS } from './data/ui-settings'
import { ComponentRouterService } from './services/component-router.service'
import { HotKeyService } from './services/hot-key.service'
import { NotificationService } from './services/notification.service'
import {
PermissionAction,
PermissionsService,
@@ -14,7 +15,6 @@ import {
} from './services/permissions.service'
import { SettingsService } from './services/settings.service'
import { TasksService } from './services/tasks.service'
import { ToastService } from './services/toast.service'
import { WebsocketStatusService } from './services/websocket-status.service'
@Component({
@@ -23,7 +23,7 @@ import { WebsocketStatusService } from './services/websocket-status.service'
styleUrls: ['./app.component.scss'],
imports: [
FileDropComponent,
ToastsComponent,
NotificationListComponent,
TourNgBootstrapModule,
RouterOutlet,
],
@@ -36,7 +36,7 @@ export class AppComponent implements OnInit, OnDestroy {
constructor(
private settings: SettingsService,
private websocketStatusService: WebsocketStatusService,
private toastService: ToastService,
private notificationService: NotificationService,
private router: Router,
private tasksService: TasksService,
public tourService: TourService,
@@ -91,7 +91,7 @@ export class AppComponent implements OnInit, OnDestroy {
PermissionType.Document
)
) {
this.toastService.show({
this.notificationService.show({
content: $localize`Document ${status.filename} was added to Paperless-ngx.`,
delay: 10000,
actionName: $localize`Open document`,
@@ -100,7 +100,7 @@ export class AppComponent implements OnInit, OnDestroy {
},
})
} else {
this.toastService.show({
this.notificationService.show({
content: $localize`Document ${status.filename} was added to Paperless-ngx.`,
delay: 10000,
})
@@ -115,7 +115,7 @@ export class AppComponent implements OnInit, OnDestroy {
if (
this.showNotification(SETTINGS_KEYS.NOTIFICATIONS_CONSUMER_FAILED)
) {
this.toastService.showError(
this.notificationService.showError(
$localize`Could not add ${status.filename}\: ${status.message}`
)
}
@@ -130,7 +130,7 @@ export class AppComponent implements OnInit, OnDestroy {
SETTINGS_KEYS.NOTIFICATIONS_CONSUMER_NEW_DOCUMENT
)
) {
this.toastService.show({
this.notificationService.show({
content: $localize`Document ${status.filename} is being processed by Paperless-ngx.`,
delay: 5000,
})

12
src-ui/src/app/components/admin/config/config.component.spec.ts
View File

@@ -10,8 +10,8 @@ import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { of, throwError } from 'rxjs'
import { OutputTypeConfig } from 'src/app/data/paperless-config'
import { ConfigService } from 'src/app/services/config.service'
import { NotificationService } from 'src/app/services/notification.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { FileComponent } from '../../common/input/file/file.component'
import { NumberComponent } from '../../common/input/number/number.component'
import { SelectComponent } from '../../common/input/select/select.component'
@@ -24,7 +24,7 @@ describe('ConfigComponent', () => {
let component: ConfigComponent
let fixture: ComponentFixture<ConfigComponent>
let configService: ConfigService
let toastService: ToastService
let notificationService: NotificationService
let settingService: SettingsService
beforeEach(async () => {
@@ -51,7 +51,7 @@ describe('ConfigComponent', () => {
}).compileComponents()
configService = TestBed.inject(ConfigService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
settingService = TestBed.inject(SettingsService)
fixture = TestBed.createComponent(ConfigComponent)
component = fixture.componentInstance
@@ -60,7 +60,7 @@ describe('ConfigComponent', () => {
it('should load config on init, show error if necessary', () => {
const getSpy = jest.spyOn(configService, 'getConfig')
const errorSpy = jest.spyOn(toastService, 'showError')
const errorSpy = jest.spyOn(notificationService, 'showError')
getSpy.mockReturnValueOnce(
throwError(() => new Error('Error getting config'))
)
@@ -78,7 +78,7 @@ describe('ConfigComponent', () => {
it('should save config, show error if necessary', () => {
const saveSpy = jest.spyOn(configService, 'saveConfig')
const errorSpy = jest.spyOn(toastService, 'showError')
const errorSpy = jest.spyOn(notificationService, 'showError')
saveSpy.mockReturnValueOnce(
throwError(() => new Error('Error saving config'))
)
@@ -112,7 +112,7 @@ describe('ConfigComponent', () => {
it('should upload file, show error if necessary', () => {
const uploadSpy = jest.spyOn(configService, 'uploadFile')
const errorSpy = jest.spyOn(toastService, 'showError')
const errorSpy = jest.spyOn(notificationService, 'showError')
uploadSpy.mockReturnValueOnce(
throwError(() => new Error('Error uploading file'))
)

19
src-ui/src/app/components/admin/config/config.component.ts
View File

@@ -25,8 +25,8 @@ import {
PaperlessConfigOptions,
} from 'src/app/data/paperless-config'
import { ConfigService } from 'src/app/services/config.service'
import { NotificationService } from 'src/app/services/notification.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { FileComponent } from '../../common/input/file/file.component'
import { NumberComponent } from '../../common/input/number/number.component'
import { SelectComponent } from '../../common/input/select/select.component'
@@ -79,7 +79,7 @@ export class ConfigComponent
constructor(
private configService: ConfigService,
private toastService: ToastService,
private notificationService: NotificationService,
private settingsService: SettingsService
) {
super()
@@ -100,7 +100,10 @@ export class ConfigComponent
},
error: (e) => {
this.loading = false
this.toastService.showError($localize`Error retrieving config`, e)
this.notificationService.showError(
$localize`Error retrieving config`,
e
)
},
})
@@ -170,11 +173,11 @@ export class ConfigComponent
this.initialize(config)
this.store.next(config)
this.settingsService.initializeSettings().subscribe()
this.toastService.showInfo($localize`Configuration updated`)
this.notificationService.showInfo($localize`Configuration updated`)
},
error: (e) => {
this.loading = false
this.toastService.showError(
this.notificationService.showError(
$localize`An error occurred updating configuration`,
e
)
@@ -197,11 +200,13 @@ export class ConfigComponent
this.initialize(config)
this.store.next(config)
this.settingsService.initializeSettings().subscribe()
this.toastService.showInfo($localize`File successfully updated`)
this.notificationService.showInfo(
$localize`File successfully updated`
)
},
error: (e) => {
this.loading = false
this.toastService.showError(
this.notificationService.showError(
$localize`An error occurred uploading file`,
e
)

29
src-ui/src/app/components/admin/settings/settings.component.spec.ts
View File

@@ -29,12 +29,15 @@ import { IfPermissionsDirective } from 'src/app/directives/if-permissions.direct
import { PermissionsGuard } from 'src/app/guards/permissions.guard'
import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { SafeHtmlPipe } from 'src/app/pipes/safehtml.pipe'
import {
Notification,
NotificationService,
} from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { GroupService } from 'src/app/services/rest/group.service'
import { UserService } from 'src/app/services/rest/user.service'
import { SettingsService } from 'src/app/services/settings.service'
import { SystemStatusService } from 'src/app/services/system-status.service'
import { Toast, ToastService } from 'src/app/services/toast.service'
import { ConfirmButtonComponent } from '../../common/confirm-button/confirm-button.component'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { CheckComponent } from '../../common/input/check/check.component'
@@ -66,7 +69,7 @@ describe('SettingsComponent', () => {
let settingsService: SettingsService
let activatedRoute: ActivatedRoute
let viewportScroller: ViewportScroller
let toastService: ToastService
let notificationService: NotificationService
let userService: UserService
let permissionsService: PermissionsService
let groupService: GroupService
@@ -115,7 +118,7 @@ describe('SettingsComponent', () => {
router = TestBed.inject(Router)
activatedRoute = TestBed.inject(ActivatedRoute)
viewportScroller = TestBed.inject(ViewportScroller)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
settingsService = TestBed.inject(SettingsService)
settingsService.currentUser = users[0]
userService = TestBed.inject(UserService)
@@ -194,8 +197,8 @@ describe('SettingsComponent', () => {
it('should support save local settings updating appearance settings and calling API, show error', () => {
completeSetup()
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastSpy = jest.spyOn(toastService, 'show')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'show')
const storeSpy = jest.spyOn(settingsService, 'storeSettings')
const appearanceSettingsSpy = jest.spyOn(
settingsService,
@@ -209,7 +212,7 @@ describe('SettingsComponent', () => {
)
component.saveSettings()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(storeSpy).toHaveBeenCalled()
expect(appearanceSettingsSpy).not.toHaveBeenCalled()
expect(setSpy).toHaveBeenCalledTimes(29)
@@ -217,14 +220,14 @@ describe('SettingsComponent', () => {
// succeed
storeSpy.mockReturnValueOnce(of(true))
component.saveSettings()
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
expect(appearanceSettingsSpy).toHaveBeenCalled()
})
it('should offer reload if settings changes require', () => {
completeSetup()
let toast: Toast
toastService.getToasts().subscribe((t) => (toast = t[0]))
let toast: Notification
notificationService.getNotifications().subscribe((t) => (toast = t[0]))
component.initialize(true) // reset
component.store.getValue()['displayLanguage'] = 'en-US'
component.store.getValue()['updateCheckingEnabled'] = false
@@ -258,7 +261,7 @@ describe('SettingsComponent', () => {
})
it('should show errors on load if load users failure', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(userService, 'listAll')
.mockImplementation(() =>
@@ -266,11 +269,11 @@ describe('SettingsComponent', () => {
)
completeSetup(userService)
fixture.detectChanges()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
})
it('should show errors on load if load groups failure', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(groupService, 'listAll')
.mockImplementation(() =>
@@ -278,7 +281,7 @@ describe('SettingsComponent', () => {
)
completeSetup(groupService)
fixture.detectChanges()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
})
it('should load system status on initialize, show errors if needed', () => {

23
src-ui/src/app/components/admin/settings/settings.component.ts
View File

@@ -43,6 +43,10 @@ import { User } from 'src/app/data/user'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import {
Notification,
NotificationService,
} from 'src/app/services/notification.service'
import {
PermissionAction,
PermissionType,
@@ -55,7 +59,6 @@ import {
SettingsService,
} from 'src/app/services/settings.service'
import { SystemStatusService } from 'src/app/services/system-status.service'
import { Toast, ToastService } from 'src/app/services/toast.service'
import { CheckComponent } from '../../common/input/check/check.component'
import { ColorComponent } from '../../common/input/color/color.component'
import { PermissionsGroupComponent } from '../../common/input/permissions/permissions-group/permissions-group.component'
@@ -181,7 +184,7 @@ export class SettingsComponent
constructor(
private documentListViewService: DocumentListViewService,
private toastService: ToastService,
private notificationService: NotificationService,
private settings: SettingsService,
@Inject(LOCALE_ID) public currentLocale: string,
private viewportScroller: ViewportScroller,
@@ -217,7 +220,10 @@ export class SettingsComponent
this.users = r.results
},
error: (e) => {
this.toastService.showError($localize`Error retrieving users`, e)
this.notificationService.showError(
$localize`Error retrieving users`,
e
)
},
})
}
@@ -236,7 +242,10 @@ export class SettingsComponent
this.groups = r.results
},
error: (e) => {
this.toastService.showError($localize`Error retrieving groups`, e)
this.notificationService.showError(
$localize`Error retrieving groups`,
e
)
},
})
}
@@ -531,7 +540,7 @@ export class SettingsComponent
this.store.next(this.settingsForm.value)
this.settings.updateAppearanceSettings()
this.settings.initializeDisplayFields()
let savedToast: Toast = {
let savedToast: Notification = {
content: $localize`Settings were saved successfully.`,
delay: 5000,
}
@@ -543,10 +552,10 @@ export class SettingsComponent
}
}
this.toastService.show(savedToast)
this.notificationService.show(savedToast)
},
error: (error) => {
this.toastService.showError(
this.notificationService.showError(
$localize`An error occurred while saving settings.`,
error
)

24
src-ui/src/app/components/admin/trash/trash.component.spec.ts
View File

@@ -12,7 +12,7 @@ import {
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { of, throwError } from 'rxjs'
import { SafeHtmlPipe } from 'src/app/pipes/safehtml.pipe'
import { ToastService } from 'src/app/services/toast.service'
import { NotificationService } from 'src/app/services/notification.service'
import { TrashService } from 'src/app/services/trash.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { PageHeaderComponent } from '../../common/page-header/page-header.component'
@@ -38,7 +38,7 @@ describe('TrashComponent', () => {
let fixture: ComponentFixture<TrashComponent>
let trashService: TrashService
let modalService: NgbModal
let toastService: ToastService
let notificationService: NotificationService
let router: Router
beforeEach(async () => {
@@ -60,7 +60,7 @@ describe('TrashComponent', () => {
fixture = TestBed.createComponent(TrashComponent)
trashService = TestBed.inject(TrashService)
modalService = TestBed.inject(NgbModal)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
router = TestBed.inject(Router)
component = fixture.componentInstance
fixture.detectChanges()
@@ -88,13 +88,13 @@ describe('TrashComponent', () => {
modalService.activeInstances.subscribe((instances) => {
modal = instances[0]
})
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
// fail first
trashSpy.mockReturnValue(throwError(() => 'Error'))
component.delete(documentsInTrash[0])
modal.componentInstance.confirmClicked.next()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
trashSpy.mockReturnValue(of('OK'))
component.delete(documentsInTrash[0])
@@ -109,13 +109,13 @@ describe('TrashComponent', () => {
modalService.activeInstances.subscribe((instances) => {
modal = instances[instances.length - 1]
})
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
// fail first
trashSpy.mockReturnValue(throwError(() => 'Error'))
component.emptyTrash()
modal.componentInstance.confirmClicked.next()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
trashSpy.mockReturnValue(of('OK'))
component.emptyTrash()
@@ -131,12 +131,12 @@ describe('TrashComponent', () => {
it('should support restore document, show error if needed', () => {
const restoreSpy = jest.spyOn(trashService, 'restoreDocuments')
const reloadSpy = jest.spyOn(component, 'reload')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
// fail first
restoreSpy.mockReturnValue(throwError(() => 'Error'))
component.restore(documentsInTrash[0])
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
restoreSpy.mockReturnValue(of('OK'))
@@ -148,12 +148,12 @@ describe('TrashComponent', () => {
it('should support restore all documents, show error if needed', () => {
const restoreSpy = jest.spyOn(trashService, 'restoreDocuments')
const reloadSpy = jest.spyOn(component, 'reload')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
// fail first
restoreSpy.mockReturnValue(throwError(() => 'Error'))
component.restoreAll()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
restoreSpy.mockReturnValue(of('OK'))
@@ -167,7 +167,7 @@ describe('TrashComponent', () => {
it('should offer link to restored document', () => {
let toasts
const navigateSpy = jest.spyOn(router, 'navigate')
toastService.getToasts().subscribe((allToasts) => {
notificationService.getNotifications().subscribe((allToasts) => {
toasts = [...allToasts]
})
jest.spyOn(trashService, 'restoreDocuments').mockReturnValue(of('OK'))

20
src-ui/src/app/components/admin/trash/trash.component.ts
View File

@@ -10,8 +10,8 @@ import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { delay, takeUntil, tap } from 'rxjs'
import { Document } from 'src/app/data/document'
import { SETTINGS_KEYS } from 'src/app/data/ui-settings'
import { NotificationService } from 'src/app/services/notification.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { TrashService } from 'src/app/services/trash.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { PageHeaderComponent } from '../../common/page-header/page-header.component'
@@ -44,7 +44,7 @@ export class TrashComponent
constructor(
private trashService: TrashService,
private toastService: ToastService,
private notificationService: NotificationService,
private modalService: NgbModal,
private settingsService: SettingsService,
private router: Router
@@ -86,14 +86,14 @@ export class TrashComponent
modal.componentInstance.buttonsEnabled = false
this.trashService.emptyTrash([document.id]).subscribe({
next: () => {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Document "${document.title}" deleted`
)
modal.close()
this.reload()
},
error: (err) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error deleting document "${document.title}"`,
err
)
@@ -121,13 +121,13 @@ export class TrashComponent
.emptyTrash(documents ? Array.from(documents) : null)
.subscribe({
next: () => {
this.toastService.showInfo($localize`Document(s) deleted`)
this.notificationService.showInfo($localize`Document(s) deleted`)
this.allToggled = false
modal.close()
this.reload()
},
error: (err) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error deleting document(s)`,
err
)
@@ -140,7 +140,7 @@ export class TrashComponent
restore(document: Document) {
this.trashService.restoreDocuments([document.id]).subscribe({
next: () => {
this.toastService.show({
this.notificationService.show({
content: $localize`Document "${document.title}" restored`,
delay: 5000,
actionName: $localize`Open document`,
@@ -151,7 +151,7 @@ export class TrashComponent
this.reload()
},
error: (err) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error restoring document "${document.title}"`,
err
)
@@ -164,12 +164,12 @@ export class TrashComponent
.restoreDocuments(documents ? Array.from(documents) : null)
.subscribe({
next: () => {
this.toastService.showInfo($localize`Document(s) restored`)
this.notificationService.showInfo($localize`Document(s) restored`)
this.allToggled = false
this.reload()
},
error: (err) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error restoring document(s)`,
err
)

46
src-ui/src/app/components/admin/users-groups/users-groups.component.spec.ts
View File

@@ -14,11 +14,11 @@ import { Group } from 'src/app/data/group'
import { User } from 'src/app/data/user'
import { PermissionsGuard } from 'src/app/guards/permissions.guard'
import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { GroupService } from 'src/app/services/rest/group.service'
import { UserService } from 'src/app/services/rest/user.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { GroupEditDialogComponent } from '../../common/edit-dialog/group-edit-dialog/group-edit-dialog.component'
import { UserEditDialogComponent } from '../../common/edit-dialog/user-edit-dialog/user-edit-dialog.component'
@@ -38,7 +38,7 @@ describe('UsersAndGroupsComponent', () => {
let fixture: ComponentFixture<UsersAndGroupsComponent>
let settingsService: SettingsService
let modalService: NgbModal
let toastService: ToastService
let notificationService: NotificationService
let userService: UserService
let permissionsService: PermissionsService
let groupService: GroupService
@@ -59,7 +59,7 @@ describe('UsersAndGroupsComponent', () => {
settingsService.currentUser = users[0]
userService = TestBed.inject(UserService)
modalService = TestBed.inject(NgbModal)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
permissionsService = TestBed.inject(PermissionsService)
jest.spyOn(permissionsService, 'currentUserCan').mockReturnValue(true)
jest
@@ -104,13 +104,13 @@ describe('UsersAndGroupsComponent', () => {
modalService.activeInstances.subscribe((refs) => (modal = refs[0]))
component.editUser(users[0])
const editDialog = modal.componentInstance as UserEditDialogComponent
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
editDialog.failed.emit()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
settingsService.currentUser = users[1] // simulate logged in as different user
editDialog.succeeded.emit(users[0])
expect(toastInfoSpy).toHaveBeenCalledWith(
expect(notificationInfoSpy).toHaveBeenCalledWith(
`Saved user "${users[0].username}".`
)
component.editUser()
@@ -123,18 +123,18 @@ describe('UsersAndGroupsComponent', () => {
component.deleteUser(users[0])
const deleteDialog = modal.componentInstance as ConfirmDialogComponent
const deleteSpy = jest.spyOn(userService, 'delete')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const listAllSpy = jest.spyOn(userService, 'listAll')
deleteSpy.mockReturnValueOnce(
throwError(() => new Error('error deleting user'))
)
deleteDialog.confirm()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
deleteSpy.mockReturnValueOnce(of(true))
deleteDialog.confirm()
expect(listAllSpy).toHaveBeenCalled()
expect(toastInfoSpy).toHaveBeenCalledWith('Deleted user "user1"')
expect(notificationInfoSpy).toHaveBeenCalledWith('Deleted user "user1"')
})
it('should logout current user if password changed, after delay', fakeAsync(() => {
@@ -163,12 +163,12 @@ describe('UsersAndGroupsComponent', () => {
modalService.activeInstances.subscribe((refs) => (modal = refs[0]))
component.editGroup(groups[0])
const editDialog = modal.componentInstance as GroupEditDialogComponent
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
editDialog.failed.emit()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
editDialog.succeeded.emit(groups[0])
expect(toastInfoSpy).toHaveBeenCalledWith(
expect(notificationInfoSpy).toHaveBeenCalledWith(
`Saved group "${groups[0].name}".`
)
component.editGroup()
@@ -181,18 +181,18 @@ describe('UsersAndGroupsComponent', () => {
component.deleteGroup(groups[0])
const deleteDialog = modal.componentInstance as ConfirmDialogComponent
const deleteSpy = jest.spyOn(groupService, 'delete')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const listAllSpy = jest.spyOn(groupService, 'listAll')
deleteSpy.mockReturnValueOnce(
throwError(() => new Error('error deleting group'))
)
deleteDialog.confirm()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
deleteSpy.mockReturnValueOnce(of(true))
deleteDialog.confirm()
expect(listAllSpy).toHaveBeenCalled()
expect(toastInfoSpy).toHaveBeenCalledWith('Deleted group "group1"')
expect(notificationInfoSpy).toHaveBeenCalledWith('Deleted group "group1"')
})
it('should get group name', () => {
@@ -202,7 +202,7 @@ describe('UsersAndGroupsComponent', () => {
})
it('should show errors on load if load users failure', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(userService, 'listAll')
.mockImplementation(() =>
@@ -210,11 +210,11 @@ describe('UsersAndGroupsComponent', () => {
)
completeSetup(userService)
fixture.detectChanges()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
})
it('should show errors on load if load groups failure', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(groupService, 'listAll')
.mockImplementation(() =>
@@ -222,6 +222,6 @@ describe('UsersAndGroupsComponent', () => {
)
completeSetup(groupService)
fixture.detectChanges()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
})
})

38
src-ui/src/app/components/admin/users-groups/users-groups.component.ts
View File

@@ -5,11 +5,11 @@ import { Subject, first, takeUntil } from 'rxjs'
import { Group } from 'src/app/data/group'
import { User } from 'src/app/data/user'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { GroupService } from 'src/app/services/rest/group.service'
import { UserService } from 'src/app/services/rest/user.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { EditDialogMode } from '../../common/edit-dialog/edit-dialog.component'
import { GroupEditDialogComponent } from '../../common/edit-dialog/group-edit-dialog/group-edit-dialog.component'
@@ -39,7 +39,7 @@ export class UsersAndGroupsComponent
constructor(
private usersService: UserService,
private groupsService: GroupService,
private toastService: ToastService,
private notificationService: NotificationService,
private modalService: NgbModal,
public permissionsService: PermissionsService,
private settings: SettingsService
@@ -56,7 +56,10 @@ export class UsersAndGroupsComponent
this.users = r.results
},
error: (e) => {
this.toastService.showError($localize`Error retrieving users`, e)
this.notificationService.showError(
$localize`Error retrieving users`,
e
)
},
})
@@ -68,7 +71,10 @@ export class UsersAndGroupsComponent
this.groups = r.results
},
error: (e) => {
this.toastService.showError($localize`Error retrieving groups`, e)
this.notificationService.showError(
$localize`Error retrieving groups`,
e
)
},
})
}
@@ -93,14 +99,14 @@ export class UsersAndGroupsComponent
newUser.id === this.settings.currentUser.id &&
(modal.componentInstance as UserEditDialogComponent).passwordIsSet
) {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Password has been changed, you will be logged out momentarily.`
)
setTimeout(() => {
window.location.href = `${window.location.origin}/accounts/logout/?next=/accounts/login/?next=/`
}, 2500)
} else {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Saved user "${newUser.username}".`
)
this.usersService.listAll().subscribe((r) => {
@@ -111,7 +117,7 @@ export class UsersAndGroupsComponent
modal.componentInstance.failed
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((e) => {
this.toastService.showError($localize`Error saving user.`, e)
this.notificationService.showError($localize`Error saving user.`, e)
})
}
@@ -129,13 +135,15 @@ export class UsersAndGroupsComponent
this.usersService.delete(user).subscribe({
next: () => {
modal.close()
this.toastService.showInfo($localize`Deleted user "${user.username}"`)
this.notificationService.showInfo(
$localize`Deleted user "${user.username}"`
)
this.usersService.listAll().subscribe((r) => {
this.users = r.results
})
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error deleting user "${user.username}".`,
e
)
@@ -156,7 +164,9 @@ export class UsersAndGroupsComponent
modal.componentInstance.succeeded
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((newGroup) => {
this.toastService.showInfo($localize`Saved group "${newGroup.name}".`)
this.notificationService.showInfo(
$localize`Saved group "${newGroup.name}".`
)
this.groupsService.listAll().subscribe((r) => {
this.groups = r.results
})
@@ -164,7 +174,7 @@ export class UsersAndGroupsComponent
modal.componentInstance.failed
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((e) => {
this.toastService.showError($localize`Error saving group.`, e)
this.notificationService.showError($localize`Error saving group.`, e)
})
}
@@ -182,13 +192,15 @@ export class UsersAndGroupsComponent
this.groupsService.delete(group).subscribe({
next: () => {
modal.close()
this.toastService.showInfo($localize`Deleted group "${group.name}"`)
this.notificationService.showInfo(
$localize`Deleted group "${group.name}"`
)
this.groupsService.listAll().subscribe((r) => {
this.groups = r.results
})
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error deleting group "${group.name}".`,
e
)

2
src-ui/src/app/components/app-frame/app-frame.component.html
View File

@@ -30,7 +30,7 @@
</div>
</div>
<ul ngbNav class="order-sm-3">
<pngx-toasts-dropdown></pngx-toasts-dropdown>
<pngx-notifications-dropdown></pngx-notifications-dropdown>
<li ngbDropdown class="nav-item dropdown">
<button class="btn ps-1 border-0" id="userDropdown" ngbDropdownToggle>
<i-bs width="1.3em" height="1.3em" name="person-circle"></i-bs>

34
src-ui/src/app/components/app-frame/app-frame.component.spec.ts
View File

@@ -26,13 +26,13 @@ import {
DjangoMessageLevel,
DjangoMessagesService,
} from 'src/app/services/django-messages.service'
import { NotificationService } from 'src/app/services/notification.service'
import { OpenDocumentsService } from 'src/app/services/open-documents.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { RemoteVersionService } from 'src/app/services/rest/remote-version.service'
import { SavedViewService } from 'src/app/services/rest/saved-view.service'
import { SearchService } from 'src/app/services/rest/search.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { environment } from 'src/environments/environment'
import { ProfileEditDialogComponent } from '../common/profile-edit-dialog/profile-edit-dialog.component'
import { DocumentDetailComponent } from '../document-detail/document-detail.component'
@@ -86,7 +86,7 @@ describe('AppFrameComponent', () => {
let settingsService: SettingsService
let permissionsService: PermissionsService
let remoteVersionService: RemoteVersionService
let toastService: ToastService
let notificationService: NotificationService
let messagesService: DjangoMessagesService
let openDocumentsService: OpenDocumentsService
let router: Router
@@ -126,7 +126,7 @@ describe('AppFrameComponent', () => {
PermissionsService,
RemoteVersionService,
IfPermissionsDirective,
ToastService,
NotificationService,
DjangoMessagesService,
OpenDocumentsService,
SearchService,
@@ -157,7 +157,7 @@ describe('AppFrameComponent', () => {
const savedViewService = TestBed.inject(SavedViewService)
permissionsService = TestBed.inject(PermissionsService)
remoteVersionService = TestBed.inject(RemoteVersionService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
messagesService = TestBed.inject(DjangoMessagesService)
openDocumentsService = TestBed.inject(OpenDocumentsService)
modalService = TestBed.inject(NgbModal)
@@ -216,7 +216,7 @@ describe('AppFrameComponent', () => {
it('should show error on toggle update checking if store settings fails', () => {
jest.spyOn(console, 'warn').mockImplementation(() => {})
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
settingsService.set(SETTINGS_KEYS.UPDATE_CHECKING_ENABLED, false)
component.setUpdateChecking(true)
httpTestingController
@@ -225,7 +225,7 @@ describe('AppFrameComponent', () => {
status: 500,
statusText: 'error',
})
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should support toggling slim sidebar and saving', fakeAsync(() => {
@@ -245,7 +245,7 @@ describe('AppFrameComponent', () => {
it('should show error on toggle slim sidebar if store settings fails', () => {
jest.spyOn(console, 'warn').mockImplementation(() => {})
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
component.toggleSlimSidebar()
httpTestingController
.expectOne(`${environment.apiBaseUrl}ui_settings/`)
@@ -253,7 +253,7 @@ describe('AppFrameComponent', () => {
status: 500,
statusText: 'error',
})
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should support collapsible menu', () => {
@@ -305,7 +305,7 @@ describe('AppFrameComponent', () => {
it('should update saved view sorting on drag + drop, show info', () => {
const settingsSpy = jest.spyOn(settingsService, 'updateSidebarViewsSort')
const toastSpy = jest.spyOn(toastService, 'showInfo')
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
jest.spyOn(settingsService, 'storeSettings').mockReturnValue(of(true))
component.onDrop({ previousIndex: 0, currentIndex: 1 } as CdkDragDrop<
SavedView[]
@@ -315,7 +315,7 @@ describe('AppFrameComponent', () => {
saved_views[0],
saved_views[3],
])
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should update saved view sorting on drag + drop, show error', () => {
@@ -326,14 +326,14 @@ describe('AppFrameComponent', () => {
fixture = TestBed.createComponent(AppFrameComponent)
component = fixture.componentInstance
fixture.detectChanges()
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(settingsService, 'storeSettings')
.mockReturnValue(throwError(() => new Error('unable to save')))
component.onDrop({ previousIndex: 0, currentIndex: 2 } as CdkDragDrop<
SavedView[]
>)
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should support edit profile', () => {
@@ -345,9 +345,9 @@ describe('AppFrameComponent', () => {
})
})
it('should show toasts for django messages', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
it('should show notifications for django messages', () => {
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
jest.spyOn(messagesService, 'get').mockReturnValue([
{ level: DjangoMessageLevel.WARNING, message: 'Test warning' },
{ level: DjangoMessageLevel.ERROR, message: 'Test error' },
@@ -356,7 +356,7 @@ describe('AppFrameComponent', () => {
{ level: DjangoMessageLevel.DEBUG, message: 'Test debug' },
])
component.ngOnInit()
expect(toastErrorSpy).toHaveBeenCalledTimes(2)
expect(toastInfoSpy).toHaveBeenCalledTimes(3)
expect(notificationErrorSpy).toHaveBeenCalledTimes(2)
expect(notificationInfoSpy).toHaveBeenCalledTimes(3)
})
})

23
src-ui/src/app/components/app-frame/app-frame.component.ts
View File

@@ -29,6 +29,7 @@ import {
DjangoMessageLevel,
DjangoMessagesService,
} from 'src/app/services/django-messages.service'
import { NotificationService } from 'src/app/services/notification.service'
import { OpenDocumentsService } from 'src/app/services/open-documents.service'
import {
PermissionAction,
@@ -42,13 +43,12 @@ import {
import { SavedViewService } from 'src/app/services/rest/saved-view.service'
import { SettingsService } from 'src/app/services/settings.service'
import { TasksService } from 'src/app/services/tasks.service'
import { ToastService } from 'src/app/services/toast.service'
import { environment } from 'src/environments/environment'
import { ProfileEditDialogComponent } from '../common/profile-edit-dialog/profile-edit-dialog.component'
import { DocumentDetailComponent } from '../document-detail/document-detail.component'
import { ComponentWithPermissions } from '../with-permissions/with-permissions.component'
import { GlobalSearchComponent } from './global-search/global-search.component'
import { ToastsDropdownComponent } from './toasts-dropdown/toasts-dropdown.component'
import { NotificationsDropdownComponent } from './notifications-dropdown/notifications-dropdown.component'
@Component({
selector: 'pngx-app-frame',
@@ -58,7 +58,7 @@ import { ToastsDropdownComponent } from './toasts-dropdown/toasts-dropdown.compo
GlobalSearchComponent,
DocumentTitlePipe,
IfPermissionsDirective,
ToastsDropdownComponent,
NotificationsDropdownComponent,
RouterModule,
NgClass,
NgbDropdownModule,
@@ -89,7 +89,7 @@ export class AppFrameComponent
private remoteVersionService: RemoteVersionService,
public settingsService: SettingsService,
public tasksService: TasksService,
private readonly toastService: ToastService,
private readonly notificationService: NotificationService,
private modalService: NgbModal,
public permissionsService: PermissionsService,
private djangoMessagesService: DjangoMessagesService
@@ -123,12 +123,12 @@ export class AppFrameComponent
switch (message.level) {
case DjangoMessageLevel.ERROR:
case DjangoMessageLevel.WARNING:
this.toastService.showError(message.message)
this.notificationService.showError(message.message)
break
case DjangoMessageLevel.SUCCESS:
case DjangoMessageLevel.INFO:
case DjangoMessageLevel.DEBUG:
this.toastService.showInfo(message.message)
this.notificationService.showInfo(message.message)
break
}
})
@@ -157,7 +157,7 @@ export class AppFrameComponent
.pipe(first())
.subscribe({
error: (error) => {
this.toastService.showError(
this.notificationService.showError(
$localize`An error occurred while saving settings.`
)
console.warn(error)
@@ -242,10 +242,13 @@ export class AppFrameComponent
this.settingsService.updateSidebarViewsSort(sidebarViews).subscribe({
next: () => {
this.toastService.showInfo($localize`Sidebar views updated`)
this.notificationService.showInfo($localize`Sidebar views updated`)
},
error: (e) => {
this.toastService.showError($localize`Error updating sidebar views`, e)
this.notificationService.showError(
$localize`Error updating sidebar views`,
e
)
},
})
}
@@ -265,7 +268,7 @@ export class AppFrameComponent
.pipe(first())
.subscribe({
error: (error) => {
this.toastService.showError(
this.notificationService.showError(
$localize`An error occurred while saving update checking settings.`
)
console.warn(error)

22
src-ui/src/app/components/app-frame/global-search/global-search.component.spec.ts
View File

@@ -28,10 +28,10 @@ import {
} from 'src/app/data/filter-rule-type'
import { GlobalSearchType, SETTINGS_KEYS } from 'src/app/data/ui-settings'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import { DocumentService } from 'src/app/services/rest/document.service'
import { SearchService } from 'src/app/services/rest/search.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { queryParamsFromFilterRules } from 'src/app/utils/query-params'
import { CorrespondentEditDialogComponent } from '../../common/edit-dialog/correspondent-edit-dialog/correspondent-edit-dialog.component'
import { CustomFieldEditDialogComponent } from '../../common/edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
@@ -133,7 +133,7 @@ describe('GlobalSearchComponent', () => {
let modalService: NgbModal
let documentService: DocumentService
let documentListViewService: DocumentListViewService
let toastService: ToastService
let notificationService: NotificationService
let settingsService: SettingsService
beforeEach(async () => {
@@ -157,7 +157,7 @@ describe('GlobalSearchComponent', () => {
modalService = TestBed.inject(NgbModal)
documentService = TestBed.inject(DocumentService)
documentListViewService = TestBed.inject(DocumentListViewService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
settingsService = TestBed.inject(SettingsService)
fixture = TestBed.createComponent(GlobalSearchComponent)
@@ -397,16 +397,16 @@ describe('GlobalSearchComponent', () => {
})
const editDialog = modal.componentInstance as CustomFieldEditDialogComponent
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
// fail first
editDialog.failed.emit({ error: 'error creating item' })
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
// succeed
editDialog.succeeded.emit(true)
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
})
it('should support secondary action', () => {
@@ -448,16 +448,16 @@ describe('GlobalSearchComponent', () => {
})
const editDialog = modal.componentInstance as CustomFieldEditDialogComponent
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
// fail first
editDialog.failed.emit({ error: 'error creating item' })
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
// succeed
editDialog.succeeded.emit(true)
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
})
it('should support reset', () => {

22
src-ui/src/app/components/app-frame/global-search/global-search.component.ts
View File

@@ -31,6 +31,7 @@ import { GlobalSearchType, SETTINGS_KEYS } from 'src/app/data/ui-settings'
import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { HotKeyService } from 'src/app/services/hot-key.service'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionAction,
PermissionsService,
@@ -41,7 +42,6 @@ import {
SearchService,
} from 'src/app/services/rest/search.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { paramsFromViewState } from 'src/app/utils/query-params'
import { CorrespondentEditDialogComponent } from '../../common/edit-dialog/correspondent-edit-dialog/correspondent-edit-dialog.component'
import { CustomFieldEditDialogComponent } from '../../common/edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
@@ -97,7 +97,7 @@ export class GlobalSearchComponent implements OnInit {
private documentService: DocumentService,
private documentListViewService: DocumentListViewService,
private permissionsService: PermissionsService,
private toastService: ToastService,
private notificationService: NotificationService,
private hotkeyService: HotKeyService,
private settingsService: SettingsService
) {
@@ -206,10 +206,15 @@ export class GlobalSearchComponent implements OnInit {
modalRef.componentInstance.dialogMode = EditDialogMode.EDIT
modalRef.componentInstance.object = object
modalRef.componentInstance.succeeded.subscribe(() => {
this.toastService.showInfo($localize`Successfully updated object.`)
this.notificationService.showInfo(
$localize`Successfully updated object.`
)
})
modalRef.componentInstance.failed.subscribe((e) => {
this.toastService.showError($localize`Error occurred saving object.`, e)
this.notificationService.showError(
$localize`Error occurred saving object.`,
e
)
})
}
}
@@ -244,10 +249,15 @@ export class GlobalSearchComponent implements OnInit {
modalRef.componentInstance.dialogMode = EditDialogMode.EDIT
modalRef.componentInstance.object = object
modalRef.componentInstance.succeeded.subscribe(() => {
this.toastService.showInfo($localize`Successfully updated object.`)
this.notificationService.showInfo(
$localize`Successfully updated object.`
)
})
modalRef.componentInstance.failed.subscribe((e) => {
this.toastService.showError($localize`Error occurred saving object.`, e)
this.notificationService.showError(
$localize`Error occurred saving object.`,
e
)
})
}
}

14
src-ui/src/app/components/app-frame/toasts-dropdown/toasts-dropdown.component.html → src-ui/src/app/components/app-frame/notifications-dropdown/notifications-dropdown.component.html
View File

@@ -1,7 +1,7 @@
<li ngbDropdown class="nav-item" (openChange)="onOpenChange($event)">
@if (toasts.length) {
<span class="badge rounded-pill z-3 pe-none bg-secondary me-2 position-absolute top-0 left-0">{{ toasts.length }}</span>
@if (notifications.length) {
<span class="badge rounded-pill z-3 pe-none bg-secondary me-2 position-absolute top-0 left-0">{{ notifications.length }}</span>
}
<button class="btn border-0" id="notificationsDropdown" ngbDropdownToggle>
<i-bs width="1.3em" height="1.3em" name="bell"></i-bs>
@@ -11,17 +11,17 @@
<h6 i18n>Notifications</h6>
<div class="btn-group ms-auto">
<button class="btn btn-sm btn-outline-secondary mb-2 ms-auto"
(click)="toastService.clearToasts()"
[disabled]="toasts.length === 0"
(click)="notificationService.clearNotifications()"
[disabled]="notifications.length === 0"
i18n>Clear All</button>
</div>
</div>
@if (toasts.length === 0) {
@if (notifications.length === 0) {
<p class="text-center mb-0 small text-muted"><em i18n>No notifications</em></p>
}
<div class="scroll-list">
@for (toast of toasts; track toast.id) {
<pngx-toast [autohide]="false" [toast]="toast" (hidden)="onHidden(toast)" (close)="toastService.closeToast(toast)"></pngx-toast>
@for (notification of notifications; track notification.id) {
<pngx-notification [autohide]="false" [notification]="notification" (hidden)="onHidden(notification)" (close)="notificationService.closeNotification(notification)"></pngx-notification>
}
</div>
</div>

2
src-ui/src/app/components/app-frame/toasts-dropdown/toasts-dropdown.component.scss → src-ui/src/app/components/app-frame/notifications-dropdown/notifications-dropdown.component.scss
View File

@@ -1,5 +1,5 @@
.dropdown-menu {
width: var(--pngx-toast-max-width);
width: var(--pngx-notification-max-width);
}
.dropdown-menu .scroll-list {

51
src-ui/src/app/components/app-frame/toasts-dropdown/toasts-dropdown.component.spec.ts → src-ui/src/app/components/app-frame/notifications-dropdown/notifications-dropdown.component.spec.ts
View File

@@ -9,10 +9,13 @@ import {
} from '@angular/core/testing'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { Subject } from 'rxjs'
import { Toast, ToastService } from 'src/app/services/toast.service'
import { ToastsDropdownComponent } from './toasts-dropdown.component'
import {
Notification,
NotificationService,
} from 'src/app/services/notification.service'
import { NotificationsDropdownComponent } from './notifications-dropdown.component'
const toasts = [
const notifications = [
{
id: 'abc-123',
content: 'foo bar',
@@ -38,16 +41,16 @@ const toasts = [
},
]
describe('ToastsDropdownComponent', () => {
let component: ToastsDropdownComponent
let fixture: ComponentFixture<ToastsDropdownComponent>
let toastService: ToastService
let toastsSubject: Subject<Toast[]> = new Subject()
describe('NotificationsDropdownComponent', () => {
let component: NotificationsDropdownComponent
let fixture: ComponentFixture<NotificationsDropdownComponent>
let notificationService: NotificationService
let notificationsSubject: Subject<Notification[]> = new Subject()
beforeEach(async () => {
TestBed.configureTestingModule({
imports: [
ToastsDropdownComponent,
NotificationsDropdownComponent,
NgxBootstrapIconsModule.pick(allIcons),
],
providers: [
@@ -56,24 +59,26 @@ describe('ToastsDropdownComponent', () => {
],
}).compileComponents()
fixture = TestBed.createComponent(ToastsDropdownComponent)
toastService = TestBed.inject(ToastService)
jest.spyOn(toastService, 'getToasts').mockReturnValue(toastsSubject)
fixture = TestBed.createComponent(NotificationsDropdownComponent)
notificationService = TestBed.inject(NotificationService)
jest
.spyOn(notificationService, 'getNotifications')
.mockReturnValue(notificationsSubject)
component = fixture.componentInstance
fixture.detectChanges()
})
it('should call getToasts and return toasts', fakeAsync(() => {
const spy = jest.spyOn(toastService, 'getToasts')
it('should call getNotifications and return notifications', fakeAsync(() => {
const spy = jest.spyOn(notificationService, 'getNotifications')
component.ngOnInit()
toastsSubject.next(toasts)
notificationsSubject.next(notifications)
fixture.detectChanges()
expect(spy).toHaveBeenCalled()
expect(component.toasts).toContainEqual({
expect(component.notifications).toContainEqual({
id: 'abc-123',
content: 'foo bar',
delay: 5000,
@@ -84,9 +89,9 @@ describe('ToastsDropdownComponent', () => {
discardPeriodicTasks()
}))
it('should show a toast', fakeAsync(() => {
it('should show a notification', fakeAsync(() => {
component.ngOnInit()
toastsSubject.next(toasts)
notificationsSubject.next(notifications)
fixture.detectChanges()
expect(fixture.nativeElement.textContent).toContain('foo bar')
@@ -96,12 +101,16 @@ describe('ToastsDropdownComponent', () => {
discardPeriodicTasks()
}))
it('should toggle suppressPopupToasts', fakeAsync((finish) => {
it('should toggle suppressPopupNotifications', fakeAsync((finish) => {
component.ngOnInit()
fixture.detectChanges()
toastsSubject.next(toasts)
notificationsSubject.next(notifications)
const spy = jest.spyOn(toastService, 'suppressPopupToasts', 'set')
const spy = jest.spyOn(
notificationService,
'suppressPopupNotifications',
'set'
)
component.onOpenChange(true)
expect(spy).toHaveBeenCalledWith(true)

47
src-ui/src/app/components/app-frame/notifications-dropdown/notifications-dropdown.component.ts Normal file
View File

@@ -0,0 +1,47 @@
import { Component, OnDestroy, OnInit } from '@angular/core'
import {
NgbDropdownModule,
NgbProgressbarModule,
} from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { Subscription } from 'rxjs'
import {
Notification,
NotificationService,
} from 'src/app/services/notification.service'
import { NotificationComponent } from '../../common/notification/notification.component'
@Component({
selector: 'pngx-notifications-dropdown',
templateUrl: './notifications-dropdown.component.html',
styleUrls: ['./notifications-dropdown.component.scss'],
imports: [
NotificationComponent,
NgbDropdownModule,
NgbProgressbarModule,
NgxBootstrapIconsModule,
],
})
export class NotificationsDropdownComponent implements OnInit, OnDestroy {
constructor(public notificationService: NotificationService) {}
private subscription: Subscription
public notifications: Notification[] = []
ngOnDestroy(): void {
this.subscription?.unsubscribe()
}
ngOnInit(): void {
this.subscription = this.notificationService
.getNotifications()
.subscribe((notifications) => {
this.notifications = [...notifications]
})
}
onOpenChange(open: boolean): void {
this.notificationService.suppressPopupNotifications = open
}
}

42
src-ui/src/app/components/app-frame/toasts-dropdown/toasts-dropdown.component.ts
View File

@@ -1,42 +0,0 @@
import { Component, OnDestroy, OnInit } from '@angular/core'
import {
NgbDropdownModule,
NgbProgressbarModule,
} from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { Subscription } from 'rxjs'
import { Toast, ToastService } from 'src/app/services/toast.service'
import { ToastComponent } from '../../common/toast/toast.component'
@Component({
selector: 'pngx-toasts-dropdown',
templateUrl: './toasts-dropdown.component.html',
styleUrls: ['./toasts-dropdown.component.scss'],
imports: [
ToastComponent,
NgbDropdownModule,
NgbProgressbarModule,
NgxBootstrapIconsModule,
],
})
export class ToastsDropdownComponent implements OnInit, OnDestroy {
constructor(public toastService: ToastService) {}
private subscription: Subscription
public toasts: Toast[] = []
ngOnDestroy(): void {
this.subscription?.unsubscribe()
}
ngOnInit(): void {
this.subscription = this.toastService.getToasts().subscribe((toasts) => {
this.toasts = [...toasts]
})
}
onOpenChange(open: boolean): void {
this.toastService.suppressPopupToasts = open
}
}

14
src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.spec.ts
View File

@@ -18,9 +18,9 @@ import { NgSelectModule } from '@ng-select/ng-select'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { of } from 'rxjs'
import { CustomField, CustomFieldDataType } from 'src/app/data/custom-field'
import { NotificationService } from 'src/app/services/notification.service'
import { CustomFieldsService } from 'src/app/services/rest/custom-fields.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { CustomFieldEditDialogComponent } from '../edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
import { SelectComponent } from '../input/select/select.component'
import { CustomFieldsDropdownComponent } from './custom-fields-dropdown.component'
@@ -42,7 +42,7 @@ describe('CustomFieldsDropdownComponent', () => {
let component: CustomFieldsDropdownComponent
let fixture: ComponentFixture<CustomFieldsDropdownComponent>
let customFieldService: CustomFieldsService
let toastService: ToastService
let notificationService: NotificationService
let modalService: NgbModal
let settingsService: SettingsService
@@ -64,7 +64,7 @@ describe('CustomFieldsDropdownComponent', () => {
],
})
customFieldService = TestBed.inject(CustomFieldsService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
modalService = TestBed.inject(NgbModal)
jest.spyOn(customFieldService, 'listAll').mockReturnValue(
of({
@@ -113,8 +113,8 @@ describe('CustomFieldsDropdownComponent', () => {
it('should support creating field, show error if necessary, then add', fakeAsync(() => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const getFieldsSpy = jest.spyOn(
CustomFieldsDropdownComponent.prototype as any,
'getFields'
@@ -129,13 +129,13 @@ describe('CustomFieldsDropdownComponent', () => {
// fail first
editDialog.failed.emit({ error: 'error creating field' })
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(getFieldsSpy).not.toHaveBeenCalled()
// succeed
editDialog.succeeded.emit(fields[0])
tick(100)
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
expect(getFieldsSpy).toHaveBeenCalled()
expect(addFieldSpy).toHaveBeenCalled()
}))

10
src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.ts
View File

@@ -14,13 +14,13 @@ import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { first, takeUntil } from 'rxjs'
import { CustomField, DATA_TYPE_LABELS } from 'src/app/data/custom-field'
import { CustomFieldInstance } from 'src/app/data/custom-field-instance'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionAction,
PermissionType,
PermissionsService,
} from 'src/app/services/permissions.service'
import { CustomFieldsService } from 'src/app/services/rest/custom-fields.service'
import { ToastService } from 'src/app/services/toast.service'
import { LoadingComponentWithPermissions } from '../../loading-component/loading.component'
import { CustomFieldEditDialogComponent } from '../edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
@@ -78,7 +78,7 @@ export class CustomFieldsDropdownComponent extends LoadingComponentWithPermissio
constructor(
private customFieldsService: CustomFieldsService,
private modalService: NgbModal,
private toastService: ToastService,
private notificationService: NotificationService,
private permissionsService: PermissionsService
) {
super()
@@ -123,7 +123,9 @@ export class CustomFieldsDropdownComponent extends LoadingComponentWithPermissio
modal.componentInstance.succeeded
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((newField) => {
this.toastService.showInfo($localize`Saved field "${newField.name}".`)
this.notificationService.showInfo(
$localize`Saved field "${newField.name}".`
)
this.customFieldsService.clearCache()
this.getFields()
this.created.emit(newField)
@@ -132,7 +134,7 @@ export class CustomFieldsDropdownComponent extends LoadingComponentWithPermissio
modal.componentInstance.failed
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((e) => {
this.toastService.showError($localize`Error saving field.`, e)
this.notificationService.showError($localize`Error saving field.`, e)
})
}

16
src-ui/src/app/components/common/edit-dialog/user-edit-dialog/user-edit-dialog.component.spec.ts
View File

@@ -12,11 +12,11 @@ import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { of, throwError } from 'rxjs'
import { IfOwnerDirective } from 'src/app/directives/if-owner.directive'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { GroupService } from 'src/app/services/rest/group.service'
import { UserService } from 'src/app/services/rest/user.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { PasswordComponent } from '../../input/password/password.component'
import { PermissionsFormComponent } from '../../input/permissions/permissions-form/permissions-form.component'
import { SelectComponent } from '../../input/select/select.component'
@@ -29,7 +29,7 @@ describe('UserEditDialogComponent', () => {
let component: UserEditDialogComponent
let settingsService: SettingsService
let permissionsService: PermissionsService
let toastService: ToastService
let notificationService: NotificationService
let fixture: ComponentFixture<UserEditDialogComponent>
beforeEach(async () => {
@@ -75,7 +75,7 @@ describe('UserEditDialogComponent', () => {
settingsService = TestBed.inject(SettingsService)
settingsService.currentUser = { id: 99, username: 'user99' }
permissionsService = TestBed.inject(PermissionsService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
component = fixture.componentInstance
fixture.detectChanges()
@@ -133,22 +133,22 @@ describe('UserEditDialogComponent', () => {
component['service'] as UserService,
'deactivateTotp'
)
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
deactivateSpy.mockReturnValueOnce(throwError(() => new Error('error')))
component.deactivateTotp()
expect(deactivateSpy).toHaveBeenCalled()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
deactivateSpy.mockReturnValueOnce(of(false))
component.deactivateTotp()
expect(deactivateSpy).toHaveBeenCalled()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
deactivateSpy.mockReturnValueOnce(of(true))
component.deactivateTotp()
expect(deactivateSpy).toHaveBeenCalled()
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
})
it('should check superuser status of current user', () => {

15
src-ui/src/app/components/common/edit-dialog/user-edit-dialog/user-edit-dialog.component.ts
View File

@@ -10,11 +10,11 @@ import { first } from 'rxjs'
import { EditDialogComponent } from 'src/app/components/common/edit-dialog/edit-dialog.component'
import { Group } from 'src/app/data/group'
import { User } from 'src/app/data/user'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { GroupService } from 'src/app/services/rest/group.service'
import { UserService } from 'src/app/services/rest/user.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { PasswordComponent } from '../../input/password/password.component'
import { SelectComponent } from '../../input/select/select.component'
import { TextComponent } from '../../input/text/text.component'
@@ -46,7 +46,7 @@ export class UserEditDialogComponent
activeModal: NgbActiveModal,
groupsService: GroupService,
settingsService: SettingsService,
private toastService: ToastService,
private notificationService: NotificationService,
private permissionsService: PermissionsService
) {
super(service, activeModal, service, settingsService)
@@ -128,15 +128,20 @@ export class UserEditDialogComponent
next: (result) => {
this.totpLoading = false
if (result) {
this.toastService.showInfo($localize`Totp deactivated`)
this.notificationService.showInfo($localize`Totp deactivated`)
this.object.is_mfa_enabled = false
} else {
this.toastService.showError($localize`Totp deactivation failed`)
this.notificationService.showError(
$localize`Totp deactivation failed`
)
}
},
error: (e) => {
this.totpLoading = false
this.toastService.showError($localize`Totp deactivation failed`, e)
this.notificationService.showError(
$localize`Totp deactivation failed`,
e
)
},
})
}

14
src-ui/src/app/components/common/email-document-dialog/email-document-dialog.component.spec.ts
View File

@@ -6,9 +6,9 @@ import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { of, throwError } from 'rxjs'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { DocumentService } from 'src/app/services/rest/document.service'
import { ToastService } from 'src/app/services/toast.service'
import { EmailDocumentDialogComponent } from './email-document-dialog.component'
describe('EmailDocumentDialogComponent', () => {
@@ -16,7 +16,7 @@ describe('EmailDocumentDialogComponent', () => {
let fixture: ComponentFixture<EmailDocumentDialogComponent>
let documentService: DocumentService
let permissionsService: PermissionsService
let toastService: ToastService
let notificationService: NotificationService
beforeEach(async () => {
await TestBed.configureTestingModule({
@@ -34,7 +34,7 @@ describe('EmailDocumentDialogComponent', () => {
fixture = TestBed.createComponent(EmailDocumentDialogComponent)
documentService = TestBed.inject(DocumentService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
component = fixture.componentInstance
fixture.detectChanges()
})
@@ -47,8 +47,8 @@ describe('EmailDocumentDialogComponent', () => {
})
it('should support sending document via email, showing error if needed', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastSuccessSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationSuccessSpy = jest.spyOn(notificationService, 'showInfo')
component.emailAddress = 'hello@paperless-ngx.com'
component.emailSubject = 'Hello'
component.emailMessage = 'World'
@@ -56,11 +56,11 @@ describe('EmailDocumentDialogComponent', () => {
.spyOn(documentService, 'emailDocument')
.mockReturnValue(throwError(() => new Error('Unable to email document')))
component.emailDocument()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
jest.spyOn(documentService, 'emailDocument').mockReturnValue(of(true))
component.emailDocument()
expect(toastSuccessSpy).toHaveBeenCalled()
expect(notificationSuccessSpy).toHaveBeenCalled()
})
it('should close the dialog', () => {

11
src-ui/src/app/components/common/email-document-dialog/email-document-dialog.component.ts
View File

@@ -2,8 +2,8 @@ import { Component, Input } from '@angular/core'
import { FormsModule } from '@angular/forms'
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { NotificationService } from 'src/app/services/notification.service'
import { DocumentService } from 'src/app/services/rest/document.service'
import { ToastService } from 'src/app/services/toast.service'
import { LoadingComponentWithPermissions } from '../../loading-component/loading.component'
@Component({
@@ -40,7 +40,7 @@ export class EmailDocumentDialogComponent extends LoadingComponentWithPermission
constructor(
private activeModal: NgbActiveModal,
private documentService: DocumentService,
private toastService: ToastService
private notificationService: NotificationService
) {
super()
this.loading = false
@@ -62,11 +62,14 @@ export class EmailDocumentDialogComponent extends LoadingComponentWithPermission
this.emailAddress = ''
this.emailSubject = ''
this.emailMessage = ''
this.toastService.showInfo($localize`Email sent`)
this.notificationService.showInfo($localize`Email sent`)
},
error: (e) => {
this.loading = false
this.toastService.showError($localize`Error emailing document`, e)
this.notificationService.showError(
$localize`Error emailing document`,
e
)
},
})
}

3
src-ui/src/app/components/common/notification-list/notification-list.component.html Normal file
View File

@@ -0,0 +1,3 @@
@for (notification of notifications; track notification.id) {
<pngx-notification [notification]="notification" [autohide]="true" (close)="closeNotification()"></pngx-notification>
}

2
src-ui/src/app/components/common/toasts/toasts.component.scss → src-ui/src/app/components/common/notification-list/notification-list.component.scss
View File

@@ -1,7 +1,7 @@
:host {
position: fixed;
top: 0;
right: calc(50% - (var(--pngx-toast-max-width) / 2));
right: calc(50% - (var(--pngx-notification-max-width) / 2));
margin: 0.3em;
z-index: 1200;
}

84
src-ui/src/app/components/common/notification-list/notification-list.component.spec.ts Normal file
View File

@@ -0,0 +1,84 @@
import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'
import { provideHttpClientTesting } from '@angular/common/http/testing'
import { ComponentFixture, TestBed } from '@angular/core/testing'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { Subject } from 'rxjs'
import {
Notification,
NotificationService,
} from 'src/app/services/notification.service'
import { NotificationListComponent } from './notification-list.component'
const notification = {
content: 'Error 2 content',
delay: 5000,
error: {
url: 'https://example.com',
status: 500,
statusText: 'Internal Server Error',
message: 'Internal server error 500 message',
error: { detail: 'Error 2 message details' },
},
}
describe('NotificationListComponent', () => {
let component: NotificationListComponent
let fixture: ComponentFixture<NotificationListComponent>
let notificationService: NotificationService
let notificationSubject: Subject<Notification> = new Subject()
beforeEach(async () => {
TestBed.configureTestingModule({
imports: [
NotificationListComponent,
NgxBootstrapIconsModule.pick(allIcons),
],
providers: [
provideHttpClient(withInterceptorsFromDi()),
provideHttpClientTesting(),
],
}).compileComponents()
fixture = TestBed.createComponent(NotificationListComponent)
notificationService = TestBed.inject(NotificationService)
jest.replaceProperty(
notificationService,
'showNotification',
notificationSubject
)
component = fixture.componentInstance
fixture.detectChanges()
})
it('should create', () => {
expect(component).toBeTruthy()
})
it('should close notification', () => {
component.notifications = [notification]
const closenotificationSpy = jest.spyOn(
notificationService,
'closeNotification'
)
component.closeNotification()
expect(component.notifications).toEqual([])
expect(closenotificationSpy).toHaveBeenCalledWith(notification)
})
it('should unsubscribe', () => {
const unsubscribeSpy = jest.spyOn(
(component as any).subscription,
'unsubscribe'
)
component.ngOnDestroy()
expect(unsubscribeSpy).toHaveBeenCalled()
})
it('should subscribe to notificationService', () => {
component.ngOnInit()
notificationSubject.next(notification)
expect(component.notifications).toEqual([notification])
})
})

48
src-ui/src/app/components/common/notification-list/notification-list.component.ts Normal file
View File

@@ -0,0 +1,48 @@
import { Component, OnDestroy, OnInit } from '@angular/core'
import {
NgbAccordionModule,
NgbProgressbarModule,
} from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { Subscription } from 'rxjs'
import {
Notification,
NotificationService,
} from 'src/app/services/notification.service'
import { NotificationComponent } from '../notification/notification.component'
@Component({
selector: 'pngx-notification-list',
templateUrl: './notification-list.component.html',
styleUrls: ['./notification-list.component.scss'],
imports: [
NotificationComponent,
NgbAccordionModule,
NgbProgressbarModule,
NgxBootstrapIconsModule,
],
})
export class NotificationListComponent implements OnInit, OnDestroy {
constructor(public notificationService: NotificationService) {}
private subscription: Subscription
public notifications: Notification[] = [] // array to force change detection
ngOnDestroy(): void {
this.subscription?.unsubscribe()
}
ngOnInit(): void {
this.subscription = this.notificationService.showNotification.subscribe(
(notification) => {
this.notifications = notification ? [notification] : []
}
)
}
closeNotification() {
this.notificationService.closeNotification(this.notifications[0])
this.notifications = []
}
}

36
src-ui/src/app/components/common/toast/toast.component.html → src-ui/src/app/components/common/notification/notification.component.html
View File

@@ -1,39 +1,39 @@
<ngb-toast
[autohide]="autohide"
[delay]="toast.delay"
[class]="toast.classname"
[delay]="notification.delay"
[class]="notification.classname"
[class.mb-2]="true"
(shown)="onShown(toast)"
(hidden)="hidden.emit(toast)">
(shown)="onShown(notification)"
(hidden)="hidden.emit(notification)">
@if (autohide) {
<ngb-progressbar class="position-absolute h-100 w-100 top-90 start-0 bottom-0 end-0 pe-none" type="dark" [max]="toast.delay" [value]="toast.delayRemaining"></ngb-progressbar>
<span class="visually-hidden">{{ toast.delayRemaining / 1000 | number: '1.0-0' }} seconds</span>
<ngb-progressbar class="position-absolute h-100 w-100 top-90 start-0 bottom-0 end-0 pe-none" type="dark" [max]="notification.delay" [value]="notification.delayRemaining"></ngb-progressbar>
<span class="visually-hidden">{{ notification.delayRemaining / 1000 | number: '1.0-0' }} seconds</span>
}
<div class="d-flex align-items-top">
@if (!toast.error) {
@if (!notification.error) {
<i-bs width="0.9em" height="0.9em" name="info-circle"></i-bs>
}
@if (toast.error) {
@if (notification.error) {
<i-bs width="0.9em" height="0.9em" name="exclamation-triangle"></i-bs>
}
<div>
<p class="ms-2 mb-0">{{toast.content}}</p>
@if (toast.error) {
<p class="ms-2 mb-0">{{notification.content}}</p>
@if (notification.error) {
<details class="ms-2">
<div class="mt-2 ms-n4 me-n2 small">
@if (isDetailedError(toast.error)) {
@if (isDetailedError(notification.error)) {
<dl class="row mb-0">
<dt class="col-sm-3 fw-normal text-end">URL</dt>
<dd class="col-sm-9">{{ toast.error.url }}</dd>
<dd class="col-sm-9">{{ notification.error.url }}</dd>
<dt class="col-sm-3 fw-normal text-end" i18n>Status</dt>
<dd class="col-sm-9">{{ toast.error.status }} <em>{{ toast.error.statusText }}</em></dd>
<dd class="col-sm-9">{{ notification.error.status }} <em>{{ notification.error.statusText }}</em></dd>
<dt class="col-sm-3 fw-normal text-end" i18n>Error</dt>
<dd class="col-sm-9">{{ getErrorText(toast.error) }}</dd>
<dd class="col-sm-9">{{ getErrorText(notification.error) }}</dd>
</dl>
}
<div class="row">
<div class="col offset-sm-3">
<button class="btn btn-sm btn-outline-secondary" (click)="copyError(toast.error)">
<button class="btn btn-sm btn-outline-secondary" (click)="copyError(notification.error)">
@if (!copied) {
<i-bs name="clipboard"></i-bs>&nbsp;
}
@@ -47,10 +47,10 @@
</div>
</details>
}
@if (toast.action) {
<p class="mb-0 mt-2"><button class="btn btn-sm btn-outline-secondary" (click)="close.emit(toast); toast.action()">{{toast.actionName}}</button></p>
@if (notification.action) {
<p class="mb-0 mt-2"><button class="btn btn-sm btn-outline-secondary" (click)="close.emit(notification); notification.action()">{{notification.actionName}}</button></p>
}
</div>
<button type="button" class="btn-close ms-auto flex-shrink-0" data-bs-dismiss="toast" aria-label="Close" (click)="close.emit(toast);"></button>
<button type="button" class="btn-close ms-auto flex-shrink-0" data-bs-dismiss="notification" aria-label="Close" (click)="close.emit(notification);"></button>
</div>
</ngb-toast>

0
src-ui/src/app/components/common/toast/toast.component.scss → src-ui/src/app/components/common/notification/notification.component.scss
View File

34
src-ui/src/app/components/common/toast/toast.component.spec.ts → src-ui/src/app/components/common/notification/notification.component.spec.ts
View File

@@ -9,15 +9,15 @@ import {
import { Clipboard } from '@angular/cdk/clipboard'
import { allIcons, NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { ToastComponent } from './toast.component'
import { NotificationComponent } from './notification.component'
const toast1 = {
const notification1 = {
content: 'Error 1 content',
delay: 5000,
error: 'Error 1 string',
}
const toast2 = {
const notification2 = {
content: 'Error 2 content',
delay: 5000,
error: {
@@ -29,17 +29,17 @@ const toast2 = {
},
}
describe('ToastComponent', () => {
let component: ToastComponent
let fixture: ComponentFixture<ToastComponent>
describe('NotificationComponent', () => {
let component: NotificationComponent
let fixture: ComponentFixture<NotificationComponent>
let clipboard: Clipboard
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [ToastComponent, NgxBootstrapIconsModule.pick(allIcons)],
imports: [NotificationComponent, NgxBootstrapIconsModule.pick(allIcons)],
}).compileComponents()
fixture = TestBed.createComponent(ToastComponent)
fixture = TestBed.createComponent(NotificationComponent)
clipboard = TestBed.inject(Clipboard)
component = fixture.componentInstance
})
@@ -48,18 +48,18 @@ describe('ToastComponent', () => {
expect(component).toBeTruthy()
})
it('should countdown toast', fakeAsync(() => {
component.toast = toast2
it('should countdown notification', fakeAsync(() => {
component.notification = notification2
fixture.detectChanges()
component.onShown(toast2)
component.onShown(notification2)
tick(5000)
expect(component.toast.delayRemaining).toEqual(0)
expect(component.notification.delayRemaining).toEqual(0)
flush()
discardPeriodicTasks()
}))
it('should show an error if given with toast', fakeAsync(() => {
component.toast = toast1
it('should show an error if given with notification', fakeAsync(() => {
component.notification = notification1
fixture.detectChanges()
expect(fixture.nativeElement.querySelector('details')).not.toBeNull()
@@ -70,7 +70,7 @@ describe('ToastComponent', () => {
}))
it('should show error details, support copy', fakeAsync(() => {
component.toast = toast2
component.notification = notification2
fixture.detectChanges()
expect(fixture.nativeElement.querySelector('details')).not.toBeNull()
@@ -79,7 +79,7 @@ describe('ToastComponent', () => {
)
const copySpy = jest.spyOn(clipboard, 'copy')
component.copyError(toast2.error)
component.copyError(notification2.error)
expect(copySpy).toHaveBeenCalled()
flush()
@@ -87,7 +87,7 @@ describe('ToastComponent', () => {
}))
it('should parse error text, add ellipsis', () => {
expect(component.getErrorText(toast2.error)).toEqual(
expect(component.getErrorText(notification2.error)).toEqual(
'Error 2 message details'
)
expect(component.getErrorText({ error: 'Error string no detail' })).toEqual(

23
src-ui/src/app/components/common/toast/toast.component.ts → src-ui/src/app/components/common/notification/notification.component.ts
View File

@@ -7,42 +7,43 @@ import {
} from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { interval, take } from 'rxjs'
import { Toast } from 'src/app/services/toast.service'
import { Notification } from 'src/app/services/notification.service'
@Component({
selector: 'pngx-toast',
selector: 'pngx-notification',
imports: [
DecimalPipe,
NgbToastModule,
NgbProgressbarModule,
NgxBootstrapIconsModule,
],
templateUrl: './toast.component.html',
styleUrl: './toast.component.scss',
templateUrl: './notification.component.html',
styleUrl: './notification.component.scss',
})
export class ToastComponent {
@Input() toast: Toast
export class NotificationComponent {
@Input() notification: Notification
@Input() autohide: boolean = true
@Output() hidden: EventEmitter<Toast> = new EventEmitter<Toast>()
@Output() hidden: EventEmitter<Notification> =
new EventEmitter<Notification>()
@Output() close: EventEmitter<Toast> = new EventEmitter<Toast>()
@Output() close: EventEmitter<Notification> = new EventEmitter<Notification>()
public copied: boolean = false
constructor(private clipboard: Clipboard) {}
onShown(toast: Toast) {
onShown(notification: Notification) {
if (!this.autohide) return
const refreshInterval = 150
const delay = toast.delay - 500 // for fade animation
const delay = notification.delay - 500 // for fade animation
interval(refreshInterval)
.pipe(take(Math.round(delay / refreshInterval)))
.subscribe((count) => {
toast.delayRemaining = Math.max(
notification.delayRemaining = Math.max(
0,
delay - refreshInterval * (count + 1)
)

44
src-ui/src/app/components/common/profile-edit-dialog/profile-edit-dialog.component.spec.ts
View File

@@ -16,8 +16,8 @@ import {
} from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { of, throwError } from 'rxjs'
import { NotificationService } from 'src/app/services/notification.service'
import { ProfileService } from 'src/app/services/profile.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmButtonComponent } from '../confirm-button/confirm-button.component'
import { PasswordComponent } from '../input/password/password.component'
import { TextComponent } from '../input/text/text.component'
@@ -44,7 +44,7 @@ describe('ProfileEditDialogComponent', () => {
let component: ProfileEditDialogComponent
let fixture: ComponentFixture<ProfileEditDialogComponent>
let profileService: ProfileService
let toastService: ToastService
let notificationService: NotificationService
let clipboard: Clipboard
beforeEach(() => {
@@ -64,7 +64,7 @@ describe('ProfileEditDialogComponent', () => {
providers: [NgbActiveModal, provideHttpClient(withInterceptorsFromDi())],
})
profileService = TestBed.inject(ProfileService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
clipboard = TestBed.inject(Clipboard)
fixture = TestBed.createComponent(ProfileEditDialogComponent)
component = fixture.componentInstance
@@ -94,13 +94,13 @@ describe('ProfileEditDialogComponent', () => {
auth_token: profile.auth_token,
}
const updateSpy = jest.spyOn(profileService, 'update')
const errorSpy = jest.spyOn(toastService, 'showError')
const errorSpy = jest.spyOn(notificationService, 'showError')
updateSpy.mockReturnValueOnce(throwError(() => new Error('failed to save')))
component.save()
expect(errorSpy).toHaveBeenCalled()
updateSpy.mockClear()
const infoSpy = jest.spyOn(toastService, 'showInfo')
const infoSpy = jest.spyOn(notificationService, 'showInfo')
component.form.patchValue(newProfile)
updateSpy.mockReturnValueOnce(of(newProfile))
component.save()
@@ -239,7 +239,7 @@ describe('ProfileEditDialogComponent', () => {
getSpy.mockReturnValue(of(profile))
const generateSpy = jest.spyOn(profileService, 'generateAuthToken')
const errorSpy = jest.spyOn(toastService, 'showError')
const errorSpy = jest.spyOn(notificationService, 'showError')
generateSpy.mockReturnValueOnce(
throwError(() => new Error('failed to generate'))
)
@@ -275,7 +275,7 @@ describe('ProfileEditDialogComponent', () => {
getSpy.mockImplementation(() => of(profile))
component.ngOnInit()
const errorSpy = jest.spyOn(toastService, 'showError')
const errorSpy = jest.spyOn(notificationService, 'showError')
expect(component.socialAccounts).toContainEqual(socialAccount)
@@ -300,13 +300,13 @@ describe('ProfileEditDialogComponent', () => {
secret: 'secret',
}
const getSpy = jest.spyOn(profileService, 'getTotpSettings')
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
getSpy.mockReturnValueOnce(
throwError(() => new Error('failed to get settings'))
)
component.gettotpSettings()
expect(getSpy).toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
getSpy.mockReturnValue(of(settings))
component.gettotpSettings()
@@ -316,8 +316,8 @@ describe('ProfileEditDialogComponent', () => {
it('should activate totp', () => {
const activateSpy = jest.spyOn(profileService, 'activateTotp')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const error = new Error('failed to activate totp')
activateSpy.mockReturnValueOnce(throwError(() => error))
component.totpSettings = {
@@ -331,38 +331,44 @@ describe('ProfileEditDialogComponent', () => {
component.totpSettings.secret,
component.form.get('totp_code').value
)
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
activateSpy.mockReturnValueOnce(of({ success: false, recovery_codes: [] }))
component.activateTotp()
expect(toastErrorSpy).toHaveBeenCalledWith('Error activating TOTP', error)
expect(notificationErrorSpy).toHaveBeenCalledWith(
'Error activating TOTP',
error
)
activateSpy.mockReturnValueOnce(
of({ success: true, recovery_codes: ['1', '2', '3'] })
)
component.activateTotp()
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
expect(component.isTotpEnabled).toBeTruthy()
expect(component.recoveryCodes).toEqual(['1', '2', '3'])
})
it('should deactivate totp', () => {
const deactivateSpy = jest.spyOn(profileService, 'deactivateTotp')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const error = new Error('failed to deactivate totp')
deactivateSpy.mockReturnValueOnce(throwError(() => error))
component.deactivateTotp()
expect(deactivateSpy).toHaveBeenCalled()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
deactivateSpy.mockReturnValueOnce(of(false))
component.deactivateTotp()
expect(toastErrorSpy).toHaveBeenCalledWith('Error deactivating TOTP', error)
expect(notificationErrorSpy).toHaveBeenCalledWith(
'Error deactivating TOTP',
error
)
deactivateSpy.mockReturnValueOnce(of(true))
component.deactivateTotp()
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
expect(component.isTotpEnabled).toBeFalsy()
})

45
src-ui/src/app/components/common/profile-edit-dialog/profile-edit-dialog.component.ts
View File

@@ -19,8 +19,8 @@ import {
TotpSettings,
} from 'src/app/data/user-profile'
import { SafeHtmlPipe } from 'src/app/pipes/safehtml.pipe'
import { NotificationService } from 'src/app/services/notification.service'
import { ProfileService } from 'src/app/services/profile.service'
import { ToastService } from 'src/app/services/toast.service'
import { LoadingComponentWithPermissions } from '../../loading-component/loading.component'
import { ConfirmButtonComponent } from '../confirm-button/confirm-button.component'
import { PasswordComponent } from '../input/password/password.component'
@@ -86,7 +86,7 @@ export class ProfileEditDialogComponent
constructor(
private profileService: ProfileService,
public activeModal: NgbActiveModal,
private toastService: ToastService,
private notificationService: NotificationService,
private clipboard: Clipboard
) {
super()
@@ -192,9 +192,11 @@ export class ProfileEditDialogComponent
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe({
next: () => {
this.toastService.showInfo($localize`Profile updated successfully`)
this.notificationService.showInfo(
$localize`Profile updated successfully`
)
if (passwordChanged) {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Password has been changed, you will be logged out momentarily.`
)
setTimeout(() => {
@@ -204,7 +206,10 @@ export class ProfileEditDialogComponent
this.activeModal.close()
},
error: (error) => {
this.toastService.showError($localize`Error saving profile`, error)
this.notificationService.showError(
$localize`Error saving profile`,
error
)
this.networkActive = false
},
})
@@ -220,7 +225,7 @@ export class ProfileEditDialogComponent
this.form.patchValue({ auth_token: token })
},
error: (error) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error generating auth token`,
error
)
@@ -245,7 +250,7 @@ export class ProfileEditDialogComponent
this.socialAccounts = this.socialAccounts.filter((a) => a.id != id)
},
error: (error) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error disconnecting social account`,
error
)
@@ -264,7 +269,7 @@ export class ProfileEditDialogComponent
this.totpSettings = totpSettings
},
error: (error) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error fetching TOTP settings`,
error
)
@@ -286,15 +291,20 @@ export class ProfileEditDialogComponent
this.recoveryCodes = activationResponse.recovery_codes
this.form.get('totp_code').enable()
if (activationResponse.success) {
this.toastService.showInfo($localize`TOTP activated successfully`)
this.notificationService.showInfo(
$localize`TOTP activated successfully`
)
} else {
this.toastService.showError($localize`Error activating TOTP`)
this.notificationService.showError($localize`Error activating TOTP`)
}
},
error: (error) => {
this.totpLoading = false
this.form.get('totp_code').enable()
this.toastService.showError($localize`Error activating TOTP`, error)
this.notificationService.showError(
$localize`Error activating TOTP`,
error
)
},
})
}
@@ -310,14 +320,21 @@ export class ProfileEditDialogComponent
this.isTotpEnabled = !success
this.recoveryCodes = null
if (success) {
this.toastService.showInfo($localize`TOTP deactivated successfully`)
this.notificationService.showInfo(
$localize`TOTP deactivated successfully`
)
} else {
this.toastService.showError($localize`Error deactivating TOTP`)
this.notificationService.showError(
$localize`Error deactivating TOTP`
)
}
},
error: (error) => {
this.totpLoading = false
this.toastService.showError($localize`Error deactivating TOTP`, error)
this.notificationService.showError(
$localize`Error deactivating TOTP`,
error
)
},
})
}

18
src-ui/src/app/components/common/share-links-dialog/share-links-dialog.component.spec.ts
View File

@@ -15,8 +15,8 @@ import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { of, throwError } from 'rxjs'
import { FileVersion, ShareLink } from 'src/app/data/share-link'
import { NotificationService } from 'src/app/services/notification.service'
import { ShareLinkService } from 'src/app/services/rest/share-link.service'
import { ToastService } from 'src/app/services/toast.service'
import { environment } from 'src/environments/environment'
import { ShareLinksDialogComponent } from './share-links-dialog.component'
@@ -24,7 +24,7 @@ describe('ShareLinksDialogComponent', () => {
let component: ShareLinksDialogComponent
let fixture: ComponentFixture<ShareLinksDialogComponent>
let shareLinkService: ShareLinkService
let toastService: ToastService
let notificationService: NotificationService
let httpController: HttpTestingController
let clipboard: Clipboard
@@ -43,7 +43,7 @@ describe('ShareLinksDialogComponent', () => {
fixture = TestBed.createComponent(ShareLinksDialogComponent)
shareLinkService = TestBed.inject(ShareLinkService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
httpController = TestBed.inject(HttpTestingController)
clipboard = TestBed.inject(Clipboard)
@@ -89,7 +89,7 @@ describe('ShareLinksDialogComponent', () => {
})
it('should show error on refresh if needed', () => {
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(shareLinkService, 'getLinksForDocument')
.mockReturnValueOnce(throwError(() => new Error('Unable to get links')))
@@ -97,7 +97,7 @@ describe('ShareLinksDialogComponent', () => {
component.ngOnInit()
fixture.detectChanges()
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should support link creation then refresh & copy url', fakeAsync(() => {
@@ -138,7 +138,7 @@ describe('ShareLinksDialogComponent', () => {
const expiration = new Date()
expiration.setDate(expiration.getDate() + 7)
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
component.createLink()
@@ -150,7 +150,7 @@ describe('ShareLinksDialogComponent', () => {
)
fixture.detectChanges()
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should support delete links & refresh', () => {
@@ -165,13 +165,13 @@ describe('ShareLinksDialogComponent', () => {
})
it('should show error on delete if needed', () => {
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(shareLinkService, 'delete')
.mockReturnValueOnce(throwError(() => new Error('Unable to delete link')))
component.delete(null)
fixture.detectChanges()
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should format days remaining', () => {

18
src-ui/src/app/components/common/share-links-dialog/share-links-dialog.component.ts
View File

@@ -5,8 +5,8 @@ import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { first } from 'rxjs'
import { FileVersion, ShareLink } from 'src/app/data/share-link'
import { NotificationService } from 'src/app/services/notification.service'
import { ShareLinkService } from 'src/app/services/rest/share-link.service'
import { ToastService } from 'src/app/services/toast.service'
import { environment } from 'src/environments/environment'
@Component({
@@ -61,7 +61,7 @@ export class ShareLinksDialogComponent implements OnInit {
constructor(
private activeModal: NgbActiveModal,
private shareLinkService: ShareLinkService,
private toastService: ToastService,
private notificationService: NotificationService,
private clipboard: Clipboard
) {}
@@ -81,7 +81,7 @@ export class ShareLinksDialogComponent implements OnInit {
this.shareLinks = results
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error retrieving links`,
10000,
e
@@ -130,7 +130,11 @@ export class ShareLinksDialogComponent implements OnInit {
this.refresh()
},
error: (e) => {
this.toastService.showError($localize`Error deleting link`, 10000, e)
this.notificationService.showError(
$localize`Error deleting link`,
10000,
e
)
},
})
}
@@ -158,7 +162,11 @@ export class ShareLinksDialogComponent implements OnInit {
},
error: (e) => {
this.loading = false
this.toastService.showError($localize`Error creating link`, 10000, e)
this.notificationService.showError(
$localize`Error creating link`,
10000,
e
)
},
})
}

16
src-ui/src/app/components/common/system-status-dialog/system-status-dialog.component.spec.ts
View File

@@ -16,9 +16,9 @@ import {
SystemStatus,
SystemStatusItemStatus,
} from 'src/app/data/system-status'
import { NotificationService } from 'src/app/services/notification.service'
import { SystemStatusService } from 'src/app/services/system-status.service'
import { TasksService } from 'src/app/services/tasks.service'
import { ToastService } from 'src/app/services/toast.service'
import { SystemStatusDialogComponent } from './system-status-dialog.component'
const status: SystemStatus = {
@@ -61,7 +61,7 @@ describe('SystemStatusDialogComponent', () => {
let clipboard: Clipboard
let tasksService: TasksService
let systemStatusService: SystemStatusService
let toastService: ToastService
let notificationService: NotificationService
beforeEach(async () => {
await TestBed.configureTestingModule({
@@ -82,7 +82,7 @@ describe('SystemStatusDialogComponent', () => {
clipboard = TestBed.inject(Clipboard)
tasksService = TestBed.inject(TasksService)
systemStatusService = TestBed.inject(SystemStatusService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
fixture.detectChanges()
})
@@ -116,9 +116,9 @@ describe('SystemStatusDialogComponent', () => {
expect(component.isRunning(PaperlessTaskName.SanityCheck)).toBeFalsy()
})
it('should support running tasks, refresh status and show toasts', () => {
const toastSpy = jest.spyOn(toastService, 'showInfo')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
it('should support running tasks, refresh status and show notifications', () => {
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const getStatusSpy = jest.spyOn(systemStatusService, 'get')
const runSpy = jest.spyOn(tasksService, 'run')
@@ -126,7 +126,7 @@ describe('SystemStatusDialogComponent', () => {
runSpy.mockReturnValue(throwError(() => new Error('error')))
component.runTask(PaperlessTaskName.IndexOptimize)
expect(runSpy).toHaveBeenCalledWith(PaperlessTaskName.IndexOptimize)
expect(toastErrorSpy).toHaveBeenCalledWith(
expect(notificationErrorSpy).toHaveBeenCalledWith(
`Failed to start task ${PaperlessTaskName.IndexOptimize}, see the logs for more details`,
expect.any(Error)
)
@@ -138,7 +138,7 @@ describe('SystemStatusDialogComponent', () => {
expect(runSpy).toHaveBeenCalledWith(PaperlessTaskName.IndexOptimize)
expect(getStatusSpy).toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalledWith(
expect(notificationSpy).toHaveBeenCalledWith(
`Task ${PaperlessTaskName.IndexOptimize} started`
)
})

8
src-ui/src/app/components/common/system-status-dialog/system-status-dialog.component.ts
View File

@@ -14,10 +14,10 @@ import {
} from 'src/app/data/system-status'
import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { FileSizePipe } from 'src/app/pipes/file-size.pipe'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { SystemStatusService } from 'src/app/services/system-status.service'
import { TasksService } from 'src/app/services/tasks.service'
import { ToastService } from 'src/app/services/toast.service'
@Component({
selector: 'pngx-system-status-dialog',
@@ -51,7 +51,7 @@ export class SystemStatusDialogComponent {
private clipboard: Clipboard,
private systemStatusService: SystemStatusService,
private tasksService: TasksService,
private toastService: ToastService,
private notificationService: NotificationService,
private permissionsService: PermissionsService
) {}
@@ -79,7 +79,7 @@ export class SystemStatusDialogComponent {
public runTask(taskName: PaperlessTaskName) {
this.runningTasks.add(taskName)
this.toastService.showInfo(`Task ${taskName} started`)
this.notificationService.showInfo(`Task ${taskName} started`)
this.tasksService.run(taskName).subscribe({
next: () => {
this.runningTasks.delete(taskName)
@@ -91,7 +91,7 @@ export class SystemStatusDialogComponent {
},
error: (err) => {
this.runningTasks.delete(taskName)
this.toastService.showError(
this.notificationService.showError(
`Failed to start task ${taskName}, see the logs for more details`,
err
)

3
src-ui/src/app/components/common/toasts/toasts.component.html
View File

@@ -1,3 +0,0 @@
@for (toast of toasts; track toast.id) {
<pngx-toast [toast]="toast" [autohide]="true" (close)="closeToast()"></pngx-toast>
}

71
src-ui/src/app/components/common/toasts/toasts.component.spec.ts
View File

@@ -1,71 +0,0 @@
import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'
import { provideHttpClientTesting } from '@angular/common/http/testing'
import { ComponentFixture, TestBed } from '@angular/core/testing'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { Subject } from 'rxjs'
import { Toast, ToastService } from 'src/app/services/toast.service'
import { ToastsComponent } from './toasts.component'
const toast = {
content: 'Error 2 content',
delay: 5000,
error: {
url: 'https://example.com',
status: 500,
statusText: 'Internal Server Error',
message: 'Internal server error 500 message',
error: { detail: 'Error 2 message details' },
},
}
describe('ToastsComponent', () => {
let component: ToastsComponent
let fixture: ComponentFixture<ToastsComponent>
let toastService: ToastService
let toastSubject: Subject<Toast> = new Subject()
beforeEach(async () => {
TestBed.configureTestingModule({
imports: [ToastsComponent, NgxBootstrapIconsModule.pick(allIcons)],
providers: [
provideHttpClient(withInterceptorsFromDi()),
provideHttpClientTesting(),
],
}).compileComponents()
fixture = TestBed.createComponent(ToastsComponent)
toastService = TestBed.inject(ToastService)
jest.replaceProperty(toastService, 'showToast', toastSubject)
component = fixture.componentInstance
fixture.detectChanges()
})
it('should create', () => {
expect(component).toBeTruthy()
})
it('should close toast', () => {
component.toasts = [toast]
const closeToastSpy = jest.spyOn(toastService, 'closeToast')
component.closeToast()
expect(component.toasts).toEqual([])
expect(closeToastSpy).toHaveBeenCalledWith(toast)
})
it('should unsubscribe', () => {
const unsubscribeSpy = jest.spyOn(
(component as any).subscription,
'unsubscribe'
)
component.ngOnDestroy()
expect(unsubscribeSpy).toHaveBeenCalled()
})
it('should subscribe to toastService', () => {
component.ngOnInit()
toastSubject.next(toast)
expect(component.toasts).toEqual([toast])
})
})

43
src-ui/src/app/components/common/toasts/toasts.component.ts
View File

@@ -1,43 +0,0 @@
import { Component, OnDestroy, OnInit } from '@angular/core'
import {
NgbAccordionModule,
NgbProgressbarModule,
} from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { Subscription } from 'rxjs'
import { Toast, ToastService } from 'src/app/services/toast.service'
import { ToastComponent } from '../toast/toast.component'
@Component({
selector: 'pngx-toasts',
templateUrl: './toasts.component.html',
styleUrls: ['./toasts.component.scss'],
imports: [
ToastComponent,
NgbAccordionModule,
NgbProgressbarModule,
NgxBootstrapIconsModule,
],
})
export class ToastsComponent implements OnInit, OnDestroy {
constructor(public toastService: ToastService) {}
private subscription: Subscription
public toasts: Toast[] = [] // array to force change detection
ngOnDestroy(): void {
this.subscription?.unsubscribe()
}
ngOnInit(): void {
this.subscription = this.toastService.showToast.subscribe((toast) => {
this.toasts = toast ? [toast] : []
})
}
closeToast() {
this.toastService.closeToast(this.toasts[0])
this.toasts = []
}
}

14
src-ui/src/app/components/dashboard/dashboard.component.spec.ts
View File

@@ -12,10 +12,10 @@ import { SavedView } from 'src/app/data/saved-view'
import { SETTINGS_KEYS } from 'src/app/data/ui-settings'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { PermissionsGuard } from 'src/app/guards/permissions.guard'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.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 { LogoComponent } from '../common/logo/logo.component'
import { PageHeaderComponent } from '../common/page-header/page-header.component'
import { DashboardComponent } from './dashboard.component'
@@ -68,7 +68,7 @@ describe('DashboardComponent', () => {
let fixture: ComponentFixture<DashboardComponent>
let settingsService: SettingsService
let tourService: TourService
let toastService: ToastService
let notificationService: NotificationService
beforeEach(async () => {
TestBed.configureTestingModule({
@@ -121,7 +121,7 @@ describe('DashboardComponent', () => {
if (key === SETTINGS_KEYS.DASHBOARD_VIEWS_SORT_ORDER) return [0, 2, 3]
})
tourService = TestBed.inject(TourService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
fixture = TestBed.createComponent(DashboardComponent)
component = fixture.componentInstance
@@ -166,7 +166,7 @@ describe('DashboardComponent', () => {
it('should update saved view sorting on drag + drop, show info', () => {
const settingsSpy = jest.spyOn(settingsService, 'updateDashboardViewsSort')
const toastSpy = jest.spyOn(toastService, 'showInfo')
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
jest.spyOn(settingsService, 'storeSettings').mockReturnValue(of(true))
component.onDrop({ previousIndex: 0, currentIndex: 1 } as CdkDragDrop<
SavedView[]
@@ -176,7 +176,7 @@ describe('DashboardComponent', () => {
saved_views[0],
saved_views[3],
])
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should update saved view sorting on drag + drop, show error', () => {
@@ -187,13 +187,13 @@ describe('DashboardComponent', () => {
fixture = TestBed.createComponent(DashboardComponent)
component = fixture.componentInstance
fixture.detectChanges()
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(settingsService, 'storeSettings')
.mockReturnValue(throwError(() => new Error('unable to save')))
component.onDrop({ previousIndex: 0, currentIndex: 2 } as CdkDragDrop<
SavedView[]
>)
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
})

11
src-ui/src/app/components/dashboard/dashboard.component.ts
View File

@@ -9,9 +9,9 @@ import { Component } from '@angular/core'
import { TourNgBootstrapModule, TourService } from 'ngx-ui-tour-ng-bootstrap'
import { SavedView } from 'src/app/data/saved-view'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { NotificationService } from 'src/app/services/notification.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 { environment } from 'src/environments/environment'
import { LogoComponent } from '../common/logo/logo.component'
import { PageHeaderComponent } from '../common/page-header/page-header.component'
@@ -43,7 +43,7 @@ export class DashboardComponent extends ComponentWithPermissions {
public settingsService: SettingsService,
public savedViewService: SavedViewService,
private tourService: TourService,
private toastService: ToastService
private notificationService: NotificationService
) {
super()
@@ -87,10 +87,13 @@ export class DashboardComponent extends ComponentWithPermissions {
.updateDashboardViewsSort(this.dashboardViews)
.subscribe({
next: () => {
this.toastService.showInfo($localize`Dashboard updated`)
this.notificationService.showInfo($localize`Dashboard updated`)
},
error: (e) => {
this.toastService.showError($localize`Error updating dashboard`, e)
this.notificationService.showError(
$localize`Error updating dashboard`,
e
)
},
})
}

53
src-ui/src/app/components/document-detail/document-detail.component.spec.ts
View File

@@ -48,6 +48,7 @@ import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { DocumentTitlePipe } from 'src/app/pipes/document-title.pipe'
import { ComponentRouterService } from 'src/app/services/component-router.service'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import { OpenDocumentsService } from 'src/app/services/open-documents.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { CorrespondentService } from 'src/app/services/rest/correspondent.service'
@@ -58,7 +59,6 @@ import { StoragePathService } from 'src/app/services/rest/storage-path.service'
import { TagService } from 'src/app/services/rest/tag.service'
import { UserService } from 'src/app/services/rest/user.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { environment } from 'src/environments/environment'
import { ConfirmDialogComponent } from '../common/confirm-dialog/confirm-dialog.component'
import { CustomFieldsDropdownComponent } from '../common/custom-fields-dropdown/custom-fields-dropdown.component'
@@ -127,7 +127,7 @@ describe('DocumentDetailComponent', () => {
let documentService: DocumentService
let openDocumentsService: OpenDocumentsService
let modalService: NgbModal
let toastService: ToastService
let notificationService: NotificationService
let documentListViewService: DocumentListViewService
let settingsService: SettingsService
let customFieldsService: CustomFieldsService
@@ -264,7 +264,7 @@ describe('DocumentDetailComponent', () => {
openDocumentsService = TestBed.inject(OpenDocumentsService)
documentService = TestBed.inject(DocumentService)
modalService = TestBed.inject(NgbModal)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
documentListViewService = TestBed.inject(DocumentListViewService)
settingsService = TestBed.inject(SettingsService)
settingsService.currentUser = { id: 1 }
@@ -447,68 +447,68 @@ describe('DocumentDetailComponent', () => {
expect(navigateSpy).toHaveBeenCalledWith(['404'], { replaceUrl: true })
})
it('should support save, close and show success toast', () => {
it('should support save, close and show success notification', () => {
initNormally()
component.title = 'Foo Bar'
const closeSpy = jest.spyOn(component, 'close')
const updateSpy = jest.spyOn(documentService, 'update')
const toastSpy = jest.spyOn(toastService, 'showInfo')
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
updateSpy.mockImplementation((o) => of(doc))
component.save(true)
expect(updateSpy).toHaveBeenCalled()
expect(closeSpy).toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalledWith(
expect(notificationSpy).toHaveBeenCalledWith(
'Document "Doc 3" saved successfully.'
)
})
it('should support save without close and show success toast', () => {
it('should support save without close and show success notification', () => {
initNormally()
component.title = 'Foo Bar'
const closeSpy = jest.spyOn(component, 'close')
const updateSpy = jest.spyOn(documentService, 'update')
const toastSpy = jest.spyOn(toastService, 'showInfo')
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
updateSpy.mockImplementation((o) => of(doc))
component.save()
expect(updateSpy).toHaveBeenCalled()
expect(closeSpy).not.toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalledWith(
expect(notificationSpy).toHaveBeenCalledWith(
'Document "Doc 3" saved successfully.'
)
})
it('should show toast error on save if error occurs', () => {
it('should show notification error on save if error occurs', () => {
currentUserHasObjectPermissions = true
initNormally()
component.title = 'Foo Bar'
const closeSpy = jest.spyOn(component, 'close')
const updateSpy = jest.spyOn(documentService, 'update')
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
const error = new Error('failed to save')
updateSpy.mockImplementation(() => throwError(() => error))
component.save()
expect(updateSpy).toHaveBeenCalled()
expect(closeSpy).not.toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalledWith(
expect(notificationSpy).toHaveBeenCalledWith(
'Error saving document "Doc 3"',
error
)
})
it('should show error toast on save but close if user can no longer edit', () => {
it('should show error notification on save but close if user can no longer edit', () => {
currentUserHasObjectPermissions = false
initNormally()
component.title = 'Foo Bar'
const closeSpy = jest.spyOn(component, 'close')
const updateSpy = jest.spyOn(documentService, 'update')
const toastSpy = jest.spyOn(toastService, 'showInfo')
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
updateSpy.mockImplementation(() =>
throwError(() => new Error('failed to save'))
)
component.save(true)
expect(updateSpy).toHaveBeenCalled()
expect(closeSpy).toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalledWith(
expect(notificationSpy).toHaveBeenCalledWith(
'Document "Doc 3" saved successfully.'
)
})
@@ -531,19 +531,19 @@ describe('DocumentDetailComponent', () => {
expect
})
it('should show toast error on save & next if error occurs', () => {
it('should show notification error on save & next if error occurs', () => {
currentUserHasObjectPermissions = true
initNormally()
component.title = 'Foo Bar'
const closeSpy = jest.spyOn(component, 'close')
const updateSpy = jest.spyOn(documentService, 'update')
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
const error = new Error('failed to save')
updateSpy.mockImplementation(() => throwError(() => error))
component.saveEditNext()
expect(updateSpy).toHaveBeenCalled()
expect(closeSpy).not.toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalledWith('Error saving document', error)
expect(notificationSpy).toHaveBeenCalledWith('Error saving document', error)
})
it('should show save button and save & close or save & next', () => {
@@ -668,13 +668,13 @@ describe('DocumentDetailComponent', () => {
let openModal: NgbModalRef
modalService.activeInstances.subscribe((modal) => (openModal = modal[0]))
const modalSpy = jest.spyOn(modalService, 'open')
const toastSpy = jest.spyOn(toastService, 'showInfo')
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
component.reprocess()
const modalCloseSpy = jest.spyOn(openModal, 'close')
openModal.componentInstance.confirmClicked.next()
expect(bulkEditSpy).toHaveBeenCalledWith([doc.id], 'reprocess', {})
expect(modalSpy).toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
expect(modalCloseSpy).toHaveBeenCalled()
})
@@ -683,12 +683,12 @@ describe('DocumentDetailComponent', () => {
const bulkEditSpy = jest.spyOn(documentService, 'bulkEdit')
let openModal: NgbModalRef
modalService.activeInstances.subscribe((modal) => (openModal = modal[0]))
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
component.reprocess()
const modalCloseSpy = jest.spyOn(openModal, 'close')
bulkEditSpy.mockReturnValue(throwError(() => new Error('error occurred')))
openModal.componentInstance.confirmClicked.next()
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
expect(modalCloseSpy).not.toHaveBeenCalled()
})
@@ -942,9 +942,12 @@ describe('DocumentDetailComponent', () => {
jest
.spyOn(documentService, 'getMetadata')
.mockReturnValue(throwError(() => error))
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
initNormally()
expect(toastSpy).toHaveBeenCalledWith('Error retrieving metadata', error)
expect(notificationSpy).toHaveBeenCalledWith(
'Error retrieving metadata',
error
)
})
it('should display custom fields', () => {
@@ -1028,7 +1031,7 @@ describe('DocumentDetailComponent', () => {
it('should show error if needed for get suggestions', () => {
const suggestionsSpy = jest.spyOn(documentService, 'getSuggestions')
const errorSpy = jest.spyOn(toastService, 'showError')
const errorSpy = jest.spyOn(notificationService, 'showError')
suggestionsSpy.mockImplementationOnce(() =>
throwError(() => new Error('failed to get suggestions'))
)

42
src-ui/src/app/components/document-detail/document-detail.component.ts
View File

@@ -63,6 +63,7 @@ import { SafeUrlPipe } from 'src/app/pipes/safeurl.pipe'
import { ComponentRouterService } from 'src/app/services/component-router.service'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { HotKeyService } from 'src/app/services/hot-key.service'
import { NotificationService } from 'src/app/services/notification.service'
import { OpenDocumentsService } from 'src/app/services/open-documents.service'
import {
PermissionAction,
@@ -76,7 +77,6 @@ import { DocumentService } from 'src/app/services/rest/document.service'
import { StoragePathService } from 'src/app/services/rest/storage-path.service'
import { UserService } from 'src/app/services/rest/user.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { ISODateAdapter } from 'src/app/utils/ngb-iso-date-adapter'
import * as UTIF from 'utif'
import { ConfirmDialogComponent } from '../common/confirm-dialog/confirm-dialog.component'
@@ -268,7 +268,7 @@ export class DocumentDetailComponent
private openDocumentService: OpenDocumentsService,
private documentListViewService: DocumentListViewService,
private documentTitlePipe: DocumentTitlePipe,
private toastService: ToastService,
private notificationService: NotificationService,
private settings: SettingsService,
private storagePathService: StoragePathService,
private permissionsService: PermissionsService,
@@ -628,7 +628,7 @@ export class DocumentDetailComponent
},
error: (error) => {
this.metadata = {} // allow display to fallback to <object> tag
this.toastService.showError(
this.notificationService.showError(
$localize`Error retrieving metadata`,
error
)
@@ -657,7 +657,7 @@ export class DocumentDetailComponent
},
error: (error) => {
this.suggestions = null
this.toastService.showError(
this.notificationService.showError(
$localize`Error retrieving suggestions.`,
error
)
@@ -809,7 +809,7 @@ export class DocumentDetailComponent
this.store.next(newValues)
this.openDocumentService.setDirty(this.document, false)
this.openDocumentService.save()
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Document "${newValues.title}" saved successfully.`
)
this.networkActive = false
@@ -825,13 +825,13 @@ export class DocumentDetailComponent
error: (error) => {
this.networkActive = false
if (!this.userCanEdit) {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Document "${this.document.title}" saved successfully.`
)
close && this.close()
} else {
this.error = error.error
this.toastService.showError(
this.notificationService.showError(
$localize`Error saving document "${this.document.title}"`,
error
)
@@ -877,7 +877,10 @@ export class DocumentDetailComponent
error: (error) => {
this.networkActive = false
this.error = error.error
this.toastService.showError($localize`Error saving document`, error)
this.notificationService.showError(
$localize`Error saving document`,
error
)
},
})
}
@@ -931,7 +934,10 @@ export class DocumentDetailComponent
this.close()
},
error: (error) => {
this.toastService.showError($localize`Error deleting document`, error)
this.notificationService.showError(
$localize`Error deleting document`,
error
)
modal.componentInstance.buttonsEnabled = true
this.subscribeModalDelete(modal)
},
@@ -962,7 +968,7 @@ export class DocumentDetailComponent
.bulkEdit([this.document.id], 'reprocess', {})
.subscribe({
next: () => {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Reprocess operation for "${this.document.title}" will begin in the background. Close and re-open or reload this document after the operation has completed to see new content.`
)
if (modal) {
@@ -973,7 +979,7 @@ export class DocumentDetailComponent
if (modal) {
modal.componentInstance.buttonsEnabled = true
}
this.toastService.showError(
this.notificationService.showError(
$localize`Error executing operation`,
error
)
@@ -1020,7 +1026,7 @@ export class DocumentDetailComponent
},
error: (error) => {
this.downloading = false
this.toastService.showError(
this.notificationService.showError(
$localize`Error downloading document`,
error
)
@@ -1329,7 +1335,7 @@ export class DocumentDetailComponent
.pipe(first(), takeUntil(this.unsubscribeNotifier))
.subscribe({
next: () => {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Split operation for "${this.document.title}" will begin in the background.`
)
modal.close()
@@ -1338,7 +1344,7 @@ export class DocumentDetailComponent
if (modal) {
modal.componentInstance.buttonsEnabled = true
}
this.toastService.showError(
this.notificationService.showError(
$localize`Error executing split operation`,
error
)
@@ -1368,7 +1374,7 @@ export class DocumentDetailComponent
.pipe(first(), takeUntil(this.unsubscribeNotifier))
.subscribe({
next: () => {
this.toastService.show({
this.notificationService.show({
content: $localize`Rotation of "${this.document.title}" will begin in the background. Close and re-open the document after the operation has completed to see the changes.`,
delay: 8000,
action: this.close.bind(this),
@@ -1380,7 +1386,7 @@ export class DocumentDetailComponent
if (modal) {
modal.componentInstance.buttonsEnabled = true
}
this.toastService.showError(
this.notificationService.showError(
$localize`Error executing rotate operation`,
error
)
@@ -1408,7 +1414,7 @@ export class DocumentDetailComponent
.pipe(first(), takeUntil(this.unsubscribeNotifier))
.subscribe({
next: () => {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Delete pages operation for "${this.document.title}" will begin in the background. Close and re-open or reload this document after the operation has completed to see the changes.`
)
modal.close()
@@ -1417,7 +1423,7 @@ export class DocumentDetailComponent
if (modal) {
modal.componentInstance.buttonsEnabled = true
}
this.toastService.showError(
this.notificationService.showError(
$localize`Error executing delete pages operation`,
error
)

26
src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.spec.ts
View File

@@ -16,6 +16,7 @@ import { StoragePath } from 'src/app/data/storage-path'
import { Tag } from 'src/app/data/tag'
import { FilterPipe } from 'src/app/pipes/filter.pipe'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { CorrespondentService } from 'src/app/services/rest/correspondent.service'
import { CustomFieldsService } from 'src/app/services/rest/custom-fields.service'
@@ -29,7 +30,6 @@ import { StoragePathService } from 'src/app/services/rest/storage-path.service'
import { TagService } from 'src/app/services/rest/tag.service'
import { UserService } from 'src/app/services/rest/user.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { environment } from 'src/environments/environment'
import { CorrespondentEditDialogComponent } from '../../common/edit-dialog/correspondent-edit-dialog/correspondent-edit-dialog.component'
import { CustomFieldEditDialogComponent } from '../../common/edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
@@ -64,7 +64,7 @@ describe('BulkEditorComponent', () => {
let permissionsService: PermissionsService
let documentListViewService: DocumentListViewService
let documentService: DocumentService
let toastService: ToastService
let notificationService: NotificationService
let modalService: NgbModal
let tagService: TagService
let correspondentsService: CorrespondentService
@@ -160,7 +160,7 @@ describe('BulkEditorComponent', () => {
permissionsService = TestBed.inject(PermissionsService)
documentListViewService = TestBed.inject(DocumentListViewService)
documentService = TestBed.inject(DocumentService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
modalService = TestBed.inject(NgbModal)
tagService = TestBed.inject(TagService)
correspondentsService = TestBed.inject(CorrespondentService)
@@ -884,7 +884,7 @@ describe('BulkEditorComponent', () => {
expect(button.nativeElement.disabled).toBeTruthy()
})
it('should show a warning toast on bulk edit error', () => {
it('should show a warning notification on bulk edit error', () => {
jest
.spyOn(documentService, 'bulkEdit')
.mockReturnValue(
@@ -902,12 +902,12 @@ describe('BulkEditorComponent', () => {
.mockReturnValue(true)
component.showConfirmationDialogs = false
fixture.detectChanges()
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
component.setTags({
itemsToAdd: [{ id: 0 }],
itemsToRemove: [],
})
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
it('should support redo ocr', () => {
@@ -1391,8 +1391,14 @@ describe('BulkEditorComponent', () => {
.spyOn(documentListViewService, 'selected', 'get')
.mockReturnValue(new Set([3, 4]))
fixture.detectChanges()
const toastServiceShowInfoSpy = jest.spyOn(toastService, 'showInfo')
const toastServiceShowErrorSpy = jest.spyOn(toastService, 'showError')
const notificationServiceShowInfoSpy = jest.spyOn(
notificationService,
'showInfo'
)
const notificationServiceShowErrorSpy = jest.spyOn(
notificationService,
'showError'
)
const listReloadSpy = jest.spyOn(documentListViewService, 'reload')
component.customFields = [
@@ -1410,11 +1416,11 @@ describe('BulkEditorComponent', () => {
expect(modal.componentInstance.documents).toEqual([3, 4])
modal.componentInstance.failed.emit()
expect(toastServiceShowErrorSpy).toHaveBeenCalled()
expect(notificationServiceShowErrorSpy).toHaveBeenCalled()
expect(listReloadSpy).not.toHaveBeenCalled()
modal.componentInstance.succeeded.emit()
expect(toastServiceShowInfoSpy).toHaveBeenCalled()
expect(notificationServiceShowInfoSpy).toHaveBeenCalled()
expect(listReloadSpy).toHaveBeenCalled()
httpTestingController.match(
`${environment.apiBaseUrl}documents/?page=1&page_size=50&ordering=-created&truncate_content=true`

12
src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.ts
View File

@@ -23,6 +23,7 @@ import { Tag } from 'src/app/data/tag'
import { SETTINGS_KEYS } from 'src/app/data/ui-settings'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import { OpenDocumentsService } from 'src/app/services/open-documents.service'
import {
PermissionAction,
@@ -39,7 +40,6 @@ import {
import { StoragePathService } from 'src/app/services/rest/storage-path.service'
import { TagService } from 'src/app/services/rest/tag.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { MergeConfirmDialogComponent } from '../../common/confirm-dialog/merge-confirm-dialog/merge-confirm-dialog.component'
import { RotateConfirmDialogComponent } from '../../common/confirm-dialog/rotate-confirm-dialog/rotate-confirm-dialog.component'
import { CorrespondentEditDialogComponent } from '../../common/edit-dialog/correspondent-edit-dialog/correspondent-edit-dialog.component'
@@ -113,7 +113,7 @@ export class BulkEditorComponent
private modalService: NgbModal,
private openDocumentService: OpenDocumentsService,
private settings: SettingsService,
private toastService: ToastService,
private notificationService: NotificationService,
private storagePathService: StoragePathService,
private customFieldService: CustomFieldsService,
private permissionService: PermissionsService
@@ -284,7 +284,7 @@ export class BulkEditorComponent
if (modal) {
modal.componentInstance.buttonsEnabled = true
}
this.toastService.showError(
this.notificationService.showError(
$localize`Error executing bulk operation`,
error
)
@@ -859,7 +859,7 @@ export class BulkEditorComponent
}
mergeDialog.buttonsEnabled = false
this.executeBulkOperation(modal, 'merge', args, mergeDialog.documentIDs)
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Merged document will be queued for consumption.`
)
})
@@ -882,7 +882,7 @@ export class BulkEditorComponent
dialog.documents = Array.from(this.list.selected)
dialog.succeeded.subscribe((result) => {
this.toastService.showInfo($localize`Custom fields updated.`)
this.notificationService.showInfo($localize`Custom fields updated.`)
this.list.reload()
this.list.reduceSelectionToFilter()
this.list.selected.forEach((id) => {
@@ -890,7 +890,7 @@ export class BulkEditorComponent
})
})
dialog.failed.subscribe((error) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error updating custom fields.`,
error
)

18
src-ui/src/app/components/document-list/document-list.component.spec.ts
View File

@@ -39,11 +39,11 @@ import { FilterPipe } from 'src/app/pipes/filter.pipe'
import { SafeHtmlPipe } from 'src/app/pipes/safehtml.pipe'
import { UsernamePipe } from 'src/app/pipes/username.pipe'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { DocumentService } 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 {
FileStatus,
WebsocketStatusService,
@@ -85,7 +85,7 @@ describe('DocumentListComponent', () => {
let savedViewService: SavedViewService
let router: Router
let activatedRoute: ActivatedRoute
let toastService: ToastService
let notificationService: NotificationService
let modalService: NgbModal
let settingsService: SettingsService
let permissionService: PermissionsService
@@ -116,7 +116,7 @@ describe('DocumentListComponent', () => {
savedViewService = TestBed.inject(SavedViewService)
router = TestBed.inject(Router)
activatedRoute = TestBed.inject(ActivatedRoute)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
modalService = TestBed.inject(NgbModal)
settingsService = TestBed.inject(SettingsService)
permissionService = TestBed.inject(PermissionsService)
@@ -405,11 +405,11 @@ describe('DocumentListComponent', () => {
delete modifiedView.name
const savedViewServicePatch = jest.spyOn(savedViewService, 'patch')
savedViewServicePatch.mockReturnValue(of(modifiedView))
const toastSpy = jest.spyOn(toastService, 'showInfo')
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
component.saveViewConfig()
expect(savedViewServicePatch).toHaveBeenCalledWith(modifiedView)
expect(toastSpy).toHaveBeenCalledWith(
expect(notificationSpy).toHaveBeenCalledWith(
`View "${view.name}" saved successfully.`
)
})
@@ -427,12 +427,12 @@ describe('DocumentListComponent', () => {
},
],
})
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(savedViewService, 'patch')
.mockReturnValueOnce(throwError(() => new Error('Error saving view')))
component.saveViewConfig()
expect(toastErrorSpy).toHaveBeenCalledWith(
expect(notificationErrorSpy).toHaveBeenCalledWith(
'Failed to save view "Saved View 10".',
expect.any(Error)
)
@@ -467,7 +467,7 @@ describe('DocumentListComponent', () => {
let openModal: NgbModalRef
modalService.activeInstances.subscribe((modal) => (openModal = modal[0]))
const modalSpy = jest.spyOn(modalService, 'open')
const toastSpy = jest.spyOn(toastService, 'showInfo')
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
const savedViewServiceCreate = jest.spyOn(savedViewService, 'create')
savedViewServiceCreate.mockReturnValueOnce(of(modifiedView))
component.saveViewConfigAs()
@@ -480,7 +480,7 @@ describe('DocumentListComponent', () => {
})
expect(savedViewServiceCreate).toHaveBeenCalled()
expect(modalSpy).toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
expect(modalCloseSpy).toHaveBeenCalled()
})

10
src-ui/src/app/components/document-list/document-list.component.ts
View File

@@ -45,11 +45,11 @@ import { StoragePathNamePipe } from 'src/app/pipes/storage-path-name.pipe'
import { UsernamePipe } from 'src/app/pipes/username.pipe'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { HotKeyService } from 'src/app/services/hot-key.service'
import { NotificationService } from 'src/app/services/notification.service'
import { OpenDocumentsService } from 'src/app/services/open-documents.service'
import { PermissionsService } from 'src/app/services/permissions.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 { WebsocketStatusService } from 'src/app/services/websocket-status.service'
import {
filterRulesDiffer,
@@ -111,7 +111,7 @@ export class DocumentListComponent
public savedViewService: SavedViewService,
public route: ActivatedRoute,
private router: Router,
private toastService: ToastService,
private notificationService: NotificationService,
private modalService: NgbModal,
private websocketStatusService: WebsocketStatusService,
public openDocumentsService: OpenDocumentsService,
@@ -380,13 +380,13 @@ export class DocumentListComponent
.subscribe({
next: (view) => {
this.unmodifiedSavedView = view
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`View "${this.list.activeSavedViewTitle}" saved successfully.`
)
this.unmodifiedFilterRules = this.list.filterRules
},
error: (err) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Failed to save view "${this.list.activeSavedViewTitle}".`,
err
)
@@ -430,7 +430,7 @@ export class DocumentListComponent
.subscribe({
next: () => {
modal.close()
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`View "${savedView.name}" created successfully.`
)
},

12
src-ui/src/app/components/document-notes/document-notes.component.spec.ts
View File

@@ -9,10 +9,10 @@ import { of, throwError } from 'rxjs'
import { DocumentNote } from 'src/app/data/document-note'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { DocumentNotesService } from 'src/app/services/rest/document-notes.service'
import { UserService } from 'src/app/services/rest/user.service'
import { ToastService } from 'src/app/services/toast.service'
import { DocumentNotesComponent } from './document-notes.component'
const notes: DocumentNote[] = [
@@ -52,7 +52,7 @@ describe('DocumentNotesComponent', () => {
let component: DocumentNotesComponent
let fixture: ComponentFixture<DocumentNotesComponent>
let notesService: DocumentNotesService
let toastService: ToastService
let notificationService: NotificationService
beforeEach(async () => {
TestBed.configureTestingModule({
@@ -103,7 +103,7 @@ describe('DocumentNotesComponent', () => {
}).compileComponents()
notesService = TestBed.inject(DocumentNotesService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
fixture = TestBed.createComponent(DocumentNotesComponent)
component = fixture.componentInstance
fixture.detectChanges()
@@ -162,11 +162,11 @@ describe('DocumentNotesComponent', () => {
fixture.detectChanges()
const addSpy = jest.spyOn(notesService, 'addNote')
addSpy.mockReturnValueOnce(throwError(() => new Error('error saving note')))
const toastsSpy = jest.spyOn(toastService, 'showError')
const notificationsSpy = jest.spyOn(notificationService, 'showError')
const addButton = fixture.debugElement.query(By.css('button'))
addButton.triggerEventHandler('click')
expect(addSpy).toHaveBeenCalledWith(12, note)
expect(toastsSpy).toHaveBeenCalled()
expect(notificationsSpy).toHaveBeenCalled()
addSpy.mockReturnValueOnce(
of([...notes, { id: 31, note, user: { id: 1 } }])
@@ -194,7 +194,7 @@ describe('DocumentNotesComponent', () => {
fixture.detectChanges()
const deleteButton = fixture.debugElement.queryAll(By.css('button'))[1] // 0 is add button
const deleteSpy = jest.spyOn(notesService, 'deleteNote')
const toastsSpy = jest.spyOn(toastService, 'showError')
const toastsSpy = jest.spyOn(notificationService, 'showError')
deleteSpy.mockReturnValueOnce(
throwError(() => new Error('error deleting note'))
)

8
src-ui/src/app/components/document-notes/document-notes.component.ts
View File

@@ -10,9 +10,9 @@ import { DocumentNote } from 'src/app/data/document-note'
import { User } from 'src/app/data/user'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { NotificationService } from 'src/app/services/notification.service'
import { DocumentNotesService } from 'src/app/services/rest/document-notes.service'
import { UserService } from 'src/app/services/rest/user.service'
import { ToastService } from 'src/app/services/toast.service'
import { ComponentWithPermissions } from '../with-permissions/with-permissions.component'
@Component({
@@ -50,7 +50,7 @@ export class DocumentNotesComponent extends ComponentWithPermissions {
constructor(
private notesService: DocumentNotesService,
private toastService: ToastService,
private notificationService: NotificationService,
private usersService: UserService
) {
super()
@@ -78,7 +78,7 @@ export class DocumentNotesComponent extends ComponentWithPermissions {
},
error: (e) => {
this.networkActive = false
this.toastService.showError($localize`Error saving note`, e)
this.notificationService.showError($localize`Error saving note`, e)
},
})
}
@@ -92,7 +92,7 @@ export class DocumentNotesComponent extends ComponentWithPermissions {
},
error: (e) => {
this.networkActive = false
this.toastService.showError($localize`Error deleting note`, e)
this.notificationService.showError($localize`Error deleting note`, e)
},
})
}

18
src-ui/src/app/components/file-drop/file-drop.component.spec.ts
View File

@@ -10,24 +10,28 @@ import {
} from '@angular/core/testing'
import { By } from '@angular/platform-browser'
import { NgxFileDropEntry, NgxFileDropModule } from 'ngx-file-drop'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { UploadDocumentsService } from 'src/app/services/upload-documents.service'
import { ToastsComponent } from '../common/toasts/toasts.component'
import { NotificationListComponent } from '../common/notification-list/notification-list.component'
import { FileDropComponent } from './file-drop.component'
describe('FileDropComponent', () => {
let component: FileDropComponent
let fixture: ComponentFixture<FileDropComponent>
let permissionsService: PermissionsService
let toastService: ToastService
let notificationService: NotificationService
let settingsService: SettingsService
let uploadDocumentsService: UploadDocumentsService
beforeEach(() => {
TestBed.configureTestingModule({
imports: [NgxFileDropModule, FileDropComponent, ToastsComponent],
imports: [
NgxFileDropModule,
FileDropComponent,
NotificationListComponent,
],
providers: [
provideHttpClient(withInterceptorsFromDi()),
provideHttpClientTesting(),
@@ -36,7 +40,7 @@ describe('FileDropComponent', () => {
permissionsService = TestBed.inject(PermissionsService)
settingsService = TestBed.inject(SettingsService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
uploadDocumentsService = TestBed.inject(UploadDocumentsService)
fixture = TestBed.createComponent(FileDropComponent)
@@ -101,7 +105,7 @@ describe('FileDropComponent', () => {
fixture.detectChanges()
expect(dropzone.classes['hide']).toBeTruthy()
// drop
const toastSpy = jest.spyOn(toastService, 'show')
const notificationSpy = jest.spyOn(notificationService, 'show')
const uploadSpy = jest.spyOn(
UploadDocumentsService.prototype as any,
'uploadFile'
@@ -135,7 +139,7 @@ describe('FileDropComponent', () => {
} as unknown as NgxFileDropEntry,
])
tick(3000)
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
expect(uploadSpy).toHaveBeenCalled()
discardPeriodicTasks()
}))

6
src-ui/src/app/components/file-drop/file-drop.component.ts
View File

@@ -4,13 +4,13 @@ import {
NgxFileDropEntry,
NgxFileDropModule,
} from 'ngx-file-drop'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionAction,
PermissionsService,
PermissionType,
} from 'src/app/services/permissions.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { UploadDocumentsService } from 'src/app/services/upload-documents.service'
@Component({
@@ -26,7 +26,7 @@ export class FileDropComponent {
constructor(
private settings: SettingsService,
private toastService: ToastService,
private notificationService: NotificationService,
private uploadDocumentsService: UploadDocumentsService,
private permissionsService: PermissionsService
) {}
@@ -90,7 +90,7 @@ export class FileDropComponent {
public dropped(files: NgxFileDropEntry[]) {
this.uploadDocumentsService.onNgxFileDrop(files)
if (files.length > 0)
this.toastService.showInfo($localize`Initiating upload...`, 3000)
this.notificationService.showInfo($localize`Initiating upload...`, 3000)
}
@HostListener('window:blur', ['$event']) public onWindowBlur() {

6
src-ui/src/app/components/manage/correspondent-list/correspondent-list.component.ts
View File

@@ -13,12 +13,12 @@ import { IfPermissionsDirective } from 'src/app/directives/if-permissions.direct
import { SortableDirective } from 'src/app/directives/sortable.directive'
import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionsService,
PermissionType,
} from 'src/app/services/permissions.service'
import { CorrespondentService } from 'src/app/services/rest/correspondent.service'
import { ToastService } from 'src/app/services/toast.service'
import { CorrespondentEditDialogComponent } from '../../common/edit-dialog/correspondent-edit-dialog/correspondent-edit-dialog.component'
import { PageHeaderComponent } from '../../common/page-header/page-header.component'
import { ManagementListComponent } from '../management-list/management-list.component'
@@ -45,7 +45,7 @@ export class CorrespondentListComponent extends ManagementListComponent<Correspo
constructor(
correspondentsService: CorrespondentService,
modalService: NgbModal,
toastService: ToastService,
notificationService: NotificationService,
documentListViewService: DocumentListViewService,
permissionsService: PermissionsService,
private datePipe: CustomDatePipe
@@ -54,7 +54,7 @@ export class CorrespondentListComponent extends ManagementListComponent<Correspo
correspondentsService,
modalService,
CorrespondentEditDialogComponent,
toastService,
notificationService,
documentListViewService,
permissionsService,
FILTER_HAS_CORRESPONDENT_ANY,

26
src-ui/src/app/components/manage/custom-fields/custom-fields.component.spec.ts
View File

@@ -21,10 +21,10 @@ import {
import { FILTER_CUSTOM_FIELDS_QUERY } from 'src/app/data/filter-rule-type'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { CustomFieldsService } from 'src/app/services/rest/custom-fields.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { CustomFieldEditDialogComponent } from '../../common/edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
import { PageHeaderComponent } from '../../common/page-header/page-header.component'
@@ -48,7 +48,7 @@ describe('CustomFieldsComponent', () => {
let fixture: ComponentFixture<CustomFieldsComponent>
let customFieldsService: CustomFieldsService
let modalService: NgbModal
let toastService: ToastService
let notificationService: NotificationService
let listViewService: DocumentListViewService
let settingsService: SettingsService
@@ -89,7 +89,7 @@ describe('CustomFieldsComponent', () => {
})
)
modalService = TestBed.inject(NgbModal)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
listViewService = TestBed.inject(DocumentListViewService)
settingsService = TestBed.inject(SettingsService)
settingsService.currentUser = { id: 0, username: 'test' }
@@ -104,8 +104,8 @@ describe('CustomFieldsComponent', () => {
it('should support create, show notification on error / success', () => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const reloadSpy = jest.spyOn(component, 'reload')
const createButton = fixture.debugElement.queryAll(By.css('button'))[1]
@@ -116,12 +116,12 @@ describe('CustomFieldsComponent', () => {
// fail first
editDialog.failed.emit({ error: 'error creating item' })
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
// succeed
editDialog.succeeded.emit(fields[0])
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
expect(reloadSpy).toHaveBeenCalled()
jest.advanceTimersByTime(100)
})
@@ -129,8 +129,8 @@ describe('CustomFieldsComponent', () => {
it('should support edit, show notification on error / success', () => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const reloadSpy = jest.spyOn(component, 'reload')
const editButton = fixture.debugElement.queryAll(By.css('button'))[2]
@@ -142,19 +142,19 @@ describe('CustomFieldsComponent', () => {
// fail first
editDialog.failed.emit({ error: 'error editing item' })
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
// succeed
editDialog.succeeded.emit(fields[0])
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
expect(reloadSpy).toHaveBeenCalled()
})
it('should support delete, show notification on error / success', () => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const deleteSpy = jest.spyOn(customFieldsService, 'delete')
const reloadSpy = jest.spyOn(component, 'reload')
@@ -167,7 +167,7 @@ describe('CustomFieldsComponent', () => {
// fail first
deleteSpy.mockReturnValueOnce(throwError(() => new Error('error deleting')))
editDialog.confirmClicked.emit()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
// succeed

16
src-ui/src/app/components/manage/custom-fields/custom-fields.component.ts
View File

@@ -14,12 +14,12 @@ import {
import { FILTER_CUSTOM_FIELDS_QUERY } from 'src/app/data/filter-rule-type'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { CustomFieldsService } from 'src/app/services/rest/custom-fields.service'
import { DocumentService } 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 { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { CustomFieldEditDialogComponent } from '../../common/edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
import { EditDialogMode } from '../../common/edit-dialog/edit-dialog.component'
@@ -48,7 +48,7 @@ export class CustomFieldsComponent
private customFieldsService: CustomFieldsService,
public permissionsService: PermissionsService,
private modalService: NgbModal,
private toastService: ToastService,
private notificationService: NotificationService,
private documentListViewService: DocumentListViewService,
private settingsService: SettingsService,
private documentService: DocumentService,
@@ -86,7 +86,9 @@ export class CustomFieldsComponent
modal.componentInstance.succeeded
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((newField) => {
this.toastService.showInfo($localize`Saved field "${newField.name}".`)
this.notificationService.showInfo(
$localize`Saved field "${newField.name}".`
)
this.customFieldsService.clearCache()
this.settingsService.initializeDisplayFields()
this.documentService.reload()
@@ -95,7 +97,7 @@ export class CustomFieldsComponent
modal.componentInstance.failed
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((e) => {
this.toastService.showError($localize`Error saving field.`, e)
this.notificationService.showError($localize`Error saving field.`, e)
})
}
@@ -113,7 +115,9 @@ export class CustomFieldsComponent
this.customFieldsService.delete(field).subscribe({
next: () => {
modal.close()
this.toastService.showInfo($localize`Deleted field "${field.name}"`)
this.notificationService.showInfo(
$localize`Deleted field "${field.name}"`
)
this.customFieldsService.clearCache()
this.settingsService.initializeDisplayFields()
this.documentService.reload()
@@ -121,7 +125,7 @@ export class CustomFieldsComponent
this.reload()
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error deleting field "${field.name}".`,
e
)

6
src-ui/src/app/components/manage/document-type-list/document-type-list.component.ts
View File

@@ -12,12 +12,12 @@ import { FILTER_HAS_DOCUMENT_TYPE_ANY } from 'src/app/data/filter-rule-type'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { SortableDirective } from 'src/app/directives/sortable.directive'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionsService,
PermissionType,
} from 'src/app/services/permissions.service'
import { DocumentTypeService } from 'src/app/services/rest/document-type.service'
import { ToastService } from 'src/app/services/toast.service'
import { DocumentTypeEditDialogComponent } from '../../common/edit-dialog/document-type-edit-dialog/document-type-edit-dialog.component'
import { PageHeaderComponent } from '../../common/page-header/page-header.component'
import { ManagementListComponent } from '../management-list/management-list.component'
@@ -43,7 +43,7 @@ export class DocumentTypeListComponent extends ManagementListComponent<DocumentT
constructor(
documentTypeService: DocumentTypeService,
modalService: NgbModal,
toastService: ToastService,
notificationService: NotificationService,
documentListViewService: DocumentListViewService,
permissionsService: PermissionsService
) {
@@ -51,7 +51,7 @@ export class DocumentTypeListComponent extends ManagementListComponent<DocumentT
documentTypeService,
modalService,
DocumentTypeEditDialogComponent,
toastService,
notificationService,
documentListViewService,
permissionsService,
FILTER_HAS_DOCUMENT_TYPE_ANY,

82
src-ui/src/app/components/manage/mail/mail.component.spec.ts
View File

@@ -24,11 +24,11 @@ import { IfPermissionsDirective } from 'src/app/directives/if-permissions.direct
import { PermissionsGuard } from 'src/app/guards/permissions.guard'
import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
import { SafeHtmlPipe } from 'src/app/pipes/safehtml.pipe'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { MailAccountService } from 'src/app/services/rest/mail-account.service'
import { MailRuleService } from 'src/app/services/rest/mail-rule.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { EditDialogMode } from '../../common/edit-dialog/edit-dialog.component'
import { MailAccountEditDialogComponent } from '../../common/edit-dialog/mail-account-edit-dialog/mail-account-edit-dialog.component'
@@ -63,7 +63,7 @@ describe('MailComponent', () => {
let mailAccountService: MailAccountService
let mailRuleService: MailRuleService
let modalService: NgbModal
let toastService: ToastService
let notificationService: NotificationService
let permissionsService: PermissionsService
let activatedRoute: ActivatedRoute
let settingsService: SettingsService
@@ -111,7 +111,7 @@ describe('MailComponent', () => {
mailAccountService = TestBed.inject(MailAccountService)
mailRuleService = TestBed.inject(MailRuleService)
modalService = TestBed.inject(NgbModal)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
permissionsService = TestBed.inject(PermissionsService)
activatedRoute = TestBed.inject(ActivatedRoute)
settingsService = TestBed.inject(SettingsService)
@@ -157,25 +157,25 @@ describe('MailComponent', () => {
}
it('should show errors on load if load mailAccounts failure', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(mailAccountService, 'listAll')
.mockImplementation(() =>
throwError(() => new Error('failed to load mail accounts'))
)
completeSetup(mailAccountService)
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
})
it('should show errors on load if load mailRules failure', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
jest
.spyOn(mailRuleService, 'listAll')
.mockImplementation(() =>
throwError(() => new Error('failed to load mail rules'))
)
completeSetup(mailRuleService)
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
})
it('should support edit / create mail account, show error if needed', () => {
@@ -184,12 +184,12 @@ describe('MailComponent', () => {
modalService.activeInstances.subscribe((refs) => (modal = refs[0]))
component.editMailAccount(mailAccounts[0] as MailAccount)
let editDialog = modal.componentInstance as MailAccountEditDialogComponent
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
editDialog.failed.emit()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
editDialog.succeeded.emit(mailAccounts[0])
expect(toastInfoSpy).toHaveBeenCalledWith(
expect(notificationInfoSpy).toHaveBeenCalledWith(
`Saved account "${mailAccounts[0].name}".`
)
editDialog.cancel()
@@ -203,35 +203,37 @@ describe('MailComponent', () => {
component.deleteMailAccount(mailAccounts[0] as MailAccount)
const deleteDialog = modal.componentInstance as ConfirmDialogComponent
const deleteSpy = jest.spyOn(mailAccountService, 'delete')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const listAllSpy = jest.spyOn(mailAccountService, 'listAll')
deleteSpy.mockReturnValueOnce(
throwError(() => new Error('error deleting mail account'))
)
deleteDialog.confirm()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
deleteSpy.mockReturnValueOnce(of(true))
deleteDialog.confirm()
expect(listAllSpy).toHaveBeenCalled()
expect(toastInfoSpy).toHaveBeenCalledWith('Deleted mail account "account1"')
expect(notificationInfoSpy).toHaveBeenCalledWith(
'Deleted mail account "account1"'
)
})
it('should support process mail account, show error if needed', () => {
completeSetup()
const processSpy = jest.spyOn(mailAccountService, 'processAccount')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
component.processAccount(mailAccounts[0] as MailAccount)
expect(processSpy).toHaveBeenCalled()
processSpy.mockReturnValueOnce(
throwError(() => new Error('error processing mail account'))
)
component.processAccount(mailAccounts[0] as MailAccount)
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
processSpy.mockReturnValueOnce(of(true))
component.processAccount(mailAccounts[0] as MailAccount)
expect(toastInfoSpy).toHaveBeenCalledWith(
expect(notificationInfoSpy).toHaveBeenCalledWith(
'Processing mail account "account1"'
)
})
@@ -242,12 +244,12 @@ describe('MailComponent', () => {
modalService.activeInstances.subscribe((refs) => (modal = refs[0]))
component.editMailRule(mailRules[0] as MailRule)
const editDialog = modal.componentInstance as MailRuleEditDialogComponent
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
editDialog.failed.emit()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
editDialog.succeeded.emit(mailRules[0])
expect(toastInfoSpy).toHaveBeenCalledWith(
expect(notificationInfoSpy).toHaveBeenCalledWith(
`Saved rule "${mailRules[0].name}".`
)
editDialog.cancel()
@@ -272,18 +274,20 @@ describe('MailComponent', () => {
component.deleteMailRule(mailRules[0] as MailRule)
const deleteDialog = modal.componentInstance as ConfirmDialogComponent
const deleteSpy = jest.spyOn(mailRuleService, 'delete')
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const listAllSpy = jest.spyOn(mailRuleService, 'listAll')
deleteSpy.mockReturnValueOnce(
throwError(() => new Error('error deleting mail rule "rule1"'))
)
deleteDialog.confirm()
expect(toastErrorSpy).toBeCalled()
expect(notificationErrorSpy).toBeCalled()
deleteSpy.mockReturnValueOnce(of(true))
deleteDialog.confirm()
expect(listAllSpy).toHaveBeenCalled()
expect(toastInfoSpy).toHaveBeenCalledWith('Deleted mail rule "rule1"')
expect(notificationInfoSpy).toHaveBeenCalledWith(
'Deleted mail rule "rule1"'
)
})
it('should support edit permissions on mail rule objects', () => {
@@ -303,8 +307,8 @@ describe('MailComponent', () => {
}
let modal: NgbModalRef
modalService.activeInstances.subscribe((refs) => (modal = refs[0]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const rulePatchSpy = jest.spyOn(mailRuleService, 'patch')
component.editPermissions(mailRules[0] as MailRule)
expect(modal).not.toBeUndefined()
@@ -316,10 +320,10 @@ describe('MailComponent', () => {
)
dialog.confirmClicked.emit({ permissions: perms, merge: true })
expect(rulePatchSpy).toHaveBeenCalled()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
rulePatchSpy.mockReturnValueOnce(of(mailRules[0] as MailRule))
dialog.confirmClicked.emit({ permissions: perms, merge: true })
expect(toastInfoSpy).toHaveBeenCalledWith('Permissions updated')
expect(notificationInfoSpy).toHaveBeenCalledWith('Permissions updated')
modalService.dismissAll()
})
@@ -356,15 +360,15 @@ describe('MailComponent', () => {
const toggleInput = fixture.debugElement.query(
By.css('input[type="checkbox"]')
)
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
// fail first
patchSpy.mockReturnValueOnce(
throwError(() => new Error('Error getting config'))
)
toggleInput.nativeElement.click()
expect(patchSpy).toHaveBeenCalled()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
// succeed second
patchSpy.mockReturnValueOnce(of(mailRules[0] as MailRule))
toggleInput.nativeElement.click()
@@ -373,7 +377,7 @@ describe('MailComponent', () => {
)
toggleInput.nativeElement.click()
expect(patchSpy).toHaveBeenCalled()
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
})
it('should show success message when oauth account is connected', () => {
@@ -381,9 +385,9 @@ describe('MailComponent', () => {
jest
.spyOn(activatedRoute, 'queryParamMap', 'get')
.mockReturnValue(of(convertToParamMap(queryParams)))
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
completeSetup()
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
})
it('should show error message when oauth account connect fails', () => {
@@ -391,9 +395,9 @@ describe('MailComponent', () => {
jest
.spyOn(activatedRoute, 'queryParamMap', 'get')
.mockReturnValue(of(convertToParamMap(queryParams)))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
completeSetup()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
})
it('should open account edit dialog if oauth account is connected', () => {

47
src-ui/src/app/components/manage/mail/mail.component.ts
View File

@@ -11,6 +11,7 @@ import { ObjectWithPermissions } from 'src/app/data/object-with-permissions'
import { SETTINGS_KEYS } from 'src/app/data/ui-settings'
import { IfOwnerDirective } from 'src/app/directives/if-owner.directive'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionAction,
PermissionsService,
@@ -19,7 +20,6 @@ import { AbstractPaperlessService } from 'src/app/services/rest/abstract-paperle
import { MailAccountService } from 'src/app/services/rest/mail-account.service'
import { MailRuleService } from 'src/app/services/rest/mail-rule.service'
import { SettingsService } from 'src/app/services/settings.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { EditDialogMode } from '../../common/edit-dialog/edit-dialog.component'
import { MailAccountEditDialogComponent } from '../../common/edit-dialog/mail-account-edit-dialog/mail-account-edit-dialog.component'
@@ -71,7 +71,7 @@ export class MailComponent
constructor(
public mailAccountService: MailAccountService,
public mailRuleService: MailRuleService,
private toastService: ToastService,
private notificationService: NotificationService,
private modalService: NgbModal,
public permissionsService: PermissionsService,
private settingsService: SettingsService,
@@ -104,7 +104,7 @@ export class MailComponent
this.showAccounts = true
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error retrieving mail accounts`,
e
)
@@ -127,7 +127,10 @@ export class MailComponent
this.showRules = true
},
error: (e) => {
this.toastService.showError($localize`Error retrieving mail rules`, e)
this.notificationService.showError(
$localize`Error retrieving mail rules`,
e
)
},
})
@@ -135,7 +138,9 @@ export class MailComponent
if (params.get('oauth_success')) {
const success = params.get('oauth_success') === '1'
if (success) {
this.toastService.showInfo($localize`OAuth2 authentication success`)
this.notificationService.showInfo(
$localize`OAuth2 authentication success`
)
this.oAuthAccountId = parseInt(params.get('account_id'))
if (this.mailAccounts.length > 0) {
this.editMailAccount(
@@ -145,7 +150,7 @@ export class MailComponent
)
}
} else {
this.toastService.showError(
this.notificationService.showError(
$localize`OAuth2 authentication failed, see logs for details`
)
}
@@ -169,7 +174,7 @@ export class MailComponent
modal.componentInstance.succeeded
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((newMailAccount) => {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Saved account "${newMailAccount.name}".`
)
this.mailAccountService.clearCache()
@@ -182,7 +187,7 @@ export class MailComponent
modal.componentInstance.failed
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((e) => {
this.toastService.showError($localize`Error saving account.`, e)
this.notificationService.showError($localize`Error saving account.`, e)
})
}
@@ -200,7 +205,7 @@ export class MailComponent
this.mailAccountService.delete(account).subscribe({
next: () => {
modal.close()
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Deleted mail account "${account.name}"`
)
this.mailAccountService.clearCache()
@@ -211,7 +216,7 @@ export class MailComponent
})
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error deleting mail account "${account.name}".`,
e
)
@@ -223,12 +228,12 @@ export class MailComponent
processAccount(account: MailAccount) {
this.mailAccountService.processAccount(account).subscribe({
next: () => {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Processing mail account "${account.name}"`
)
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error processing mail account "${account.name}"`,
e
)
@@ -247,7 +252,9 @@ export class MailComponent
modal.componentInstance.succeeded
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((newMailRule) => {
this.toastService.showInfo($localize`Saved rule "${newMailRule.name}".`)
this.notificationService.showInfo(
$localize`Saved rule "${newMailRule.name}".`
)
this.mailRuleService.clearCache()
this.mailRuleService
.listAll(null, null, { full_perms: true })
@@ -258,7 +265,7 @@ export class MailComponent
modal.componentInstance.failed
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((e) => {
this.toastService.showError($localize`Error saving rule.`, e)
this.notificationService.showError($localize`Error saving rule.`, e)
})
}
@@ -272,14 +279,14 @@ export class MailComponent
onMailRuleEnableToggled(rule: MailRule) {
this.mailRuleService.patch(rule).subscribe({
next: () => {
this.toastService.showInfo(
this.notificationService.showInfo(
rule.enabled
? $localize`Rule "${rule.name}" enabled.`
: $localize`Rule "${rule.name}" disabled.`
)
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error toggling rule "${rule.name}".`,
e
)
@@ -301,7 +308,7 @@ export class MailComponent
this.mailRuleService.delete(rule).subscribe({
next: () => {
modal.close()
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Deleted mail rule "${rule.name}"`
)
this.mailRuleService.clearCache()
@@ -312,7 +319,7 @@ export class MailComponent
})
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error deleting mail rule "${rule.name}".`,
e
)
@@ -337,11 +344,11 @@ export class MailComponent
object['set_permissions'] = permissions['set_permissions']
service.patch(object).subscribe({
next: () => {
this.toastService.showInfo($localize`Permissions updated`)
this.notificationService.showInfo($localize`Permissions updated`)
modal.close()
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error updating permissions`,
e
)

42
src-ui/src/app/components/manage/management-list/management-list.component.spec.ts
View File

@@ -35,13 +35,13 @@ import { SortableDirective } from 'src/app/directives/sortable.directive'
import { PermissionsGuard } from 'src/app/guards/permissions.guard'
import { SafeHtmlPipe } from 'src/app/pipes/safehtml.pipe'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionAction,
PermissionsService,
} from 'src/app/services/permissions.service'
import { BulkEditObjectOperation } from 'src/app/services/rest/abstract-name-filter-service'
import { TagService } from 'src/app/services/rest/tag.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { EditDialogComponent } from '../../common/edit-dialog/edit-dialog.component'
import { PageHeaderComponent } from '../../common/page-header/page-header.component'
@@ -76,7 +76,7 @@ describe('ManagementListComponent', () => {
let fixture: ComponentFixture<ManagementListComponent<Tag>>
let tagService: TagService
let modalService: NgbModal
let toastService: ToastService
let notificationService: NotificationService
let documentListViewService: DocumentListViewService
let permissionsService: PermissionsService
@@ -129,7 +129,7 @@ describe('ManagementListComponent', () => {
.spyOn(permissionsService, 'currentUserOwnsObject')
.mockReturnValue(true)
modalService = TestBed.inject(NgbModal)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
documentListViewService = TestBed.inject(DocumentListViewService)
fixture = TestBed.createComponent(TagListComponent)
component = fixture.componentInstance
@@ -160,8 +160,8 @@ describe('ManagementListComponent', () => {
it('should support create, show notification on error / success', () => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const reloadSpy = jest.spyOn(component, 'reloadData')
const createButton = fixture.debugElement.queryAll(By.css('button'))[3]
@@ -172,20 +172,20 @@ describe('ManagementListComponent', () => {
// fail first
editDialog.failed.emit({ error: 'error creating item' })
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
// succeed
editDialog.succeeded.emit()
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
expect(reloadSpy).toHaveBeenCalled()
})
it('should support edit, show notification on error / success', () => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const reloadSpy = jest.spyOn(component, 'reloadData')
const editButton = fixture.debugElement.queryAll(By.css('button'))[6]
@@ -197,19 +197,19 @@ describe('ManagementListComponent', () => {
// fail first
editDialog.failed.emit({ error: 'error editing item' })
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
// succeed
editDialog.succeeded.emit()
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
expect(reloadSpy).toHaveBeenCalled()
})
it('should support delete, show notification on error / success', () => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const deleteSpy = jest.spyOn(tagService, 'delete')
const reloadSpy = jest.spyOn(component, 'reloadData')
@@ -222,7 +222,7 @@ describe('ManagementListComponent', () => {
// fail first
deleteSpy.mockReturnValueOnce(throwError(() => new Error('error deleting')))
editDialog.confirmClicked.emit()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
// succeed
@@ -293,22 +293,22 @@ describe('ManagementListComponent', () => {
bulkEditPermsSpy.mockReturnValueOnce(
throwError(() => new Error('error setting permissions'))
)
const errorToastSpy = jest.spyOn(toastService, 'showError')
const errornotificationSpy = jest.spyOn(notificationService, 'showError')
modal.componentInstance.confirmClicked.emit({
permissions: {},
merge: true,
})
expect(bulkEditPermsSpy).toHaveBeenCalled()
expect(errorToastSpy).toHaveBeenCalled()
expect(errornotificationSpy).toHaveBeenCalled()
const successToastSpy = jest.spyOn(toastService, 'showInfo')
const successnotificationSpy = jest.spyOn(notificationService, 'showInfo')
bulkEditPermsSpy.mockReturnValueOnce(of('OK'))
modal.componentInstance.confirmClicked.emit({
permissions: {},
merge: true,
})
expect(bulkEditPermsSpy).toHaveBeenCalled()
expect(successToastSpy).toHaveBeenCalled()
expect(successnotificationSpy).toHaveBeenCalled()
})
it('should support bulk delete objects', () => {
@@ -327,19 +327,19 @@ describe('ManagementListComponent', () => {
bulkEditSpy.mockReturnValueOnce(
throwError(() => new Error('error setting permissions'))
)
const errorToastSpy = jest.spyOn(toastService, 'showError')
const errornotificationSpy = jest.spyOn(notificationService, 'showError')
modal.componentInstance.confirmClicked.emit(null)
expect(bulkEditSpy).toHaveBeenCalledWith(
Array.from(selected),
BulkEditObjectOperation.Delete
)
expect(errorToastSpy).toHaveBeenCalled()
expect(errornotificationSpy).toHaveBeenCalled()
const successToastSpy = jest.spyOn(toastService, 'showInfo')
const successnotificationSpy = jest.spyOn(notificationService, 'showInfo')
bulkEditSpy.mockReturnValueOnce(of('OK'))
modal.componentInstance.confirmClicked.emit(null)
expect(bulkEditSpy).toHaveBeenCalled()
expect(successToastSpy).toHaveBeenCalled()
expect(successnotificationSpy).toHaveBeenCalled()
})
it('should disallow bulk permissions or delete objects if no global perms', () => {

24
src-ui/src/app/components/manage/management-list/management-list.component.ts
View File

@@ -27,6 +27,7 @@ import {
SortEvent,
} from 'src/app/directives/sortable.directive'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionAction,
PermissionsService,
@@ -36,7 +37,6 @@ import {
AbstractNameFilterService,
BulkEditObjectOperation,
} from 'src/app/services/rest/abstract-name-filter-service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { EditDialogMode } from '../../common/edit-dialog/edit-dialog.component'
import { PermissionsDialogComponent } from '../../common/permissions-dialog/permissions-dialog.component'
@@ -63,7 +63,7 @@ export abstract class ManagementListComponent<T extends MatchingModel>
protected service: AbstractNameFilterService<T>,
private modalService: NgbModal,
private editDialogComponent: any,
private toastService: ToastService,
private notificationService: NotificationService,
private documentListViewService: DocumentListViewService,
private permissionsService: PermissionsService,
protected filterRuleType: number,
@@ -173,12 +173,12 @@ export abstract class ManagementListComponent<T extends MatchingModel>
activeModal.componentInstance.dialogMode = EditDialogMode.CREATE
activeModal.componentInstance.succeeded.subscribe(() => {
this.reloadData()
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Successfully created ${this.typeName}.`
)
})
activeModal.componentInstance.failed.subscribe((e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error occurred while creating ${this.typeName}.`,
e
)
@@ -193,12 +193,12 @@ export abstract class ManagementListComponent<T extends MatchingModel>
activeModal.componentInstance.dialogMode = EditDialogMode.EDIT
activeModal.componentInstance.succeeded.subscribe(() => {
this.reloadData()
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Successfully updated ${this.typeName} "${object.name}".`
)
})
activeModal.componentInstance.failed.subscribe((e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error occurred while saving ${this.typeName}.`,
e
)
@@ -234,7 +234,7 @@ export abstract class ManagementListComponent<T extends MatchingModel>
},
error: (error) => {
activeModal.componentInstance.buttonsEnabled = true
this.toastService.showError(
this.notificationService.showError(
$localize`Error while deleting element`,
error
)
@@ -313,14 +313,14 @@ export abstract class ManagementListComponent<T extends MatchingModel>
.subscribe({
next: () => {
modal.close()
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Permissions updated successfully`
)
this.reloadData()
},
error: (error) => {
modal.componentInstance.buttonsEnabled = true
this.toastService.showError(
this.notificationService.showError(
$localize`Error updating permissions`,
error
)
@@ -349,12 +349,14 @@ export abstract class ManagementListComponent<T extends MatchingModel>
.subscribe({
next: () => {
modal.close()
this.toastService.showInfo($localize`Objects deleted successfully`)
this.notificationService.showInfo(
$localize`Objects deleted successfully`
)
this.reloadData()
},
error: (error) => {
modal.componentInstance.buttonsEnabled = true
this.toastService.showError(
this.notificationService.showError(
$localize`Error deleting objects`,
error
)

22
src-ui/src/app/components/manage/saved-views/saved-views.component.spec.ts
View File

@@ -10,10 +10,10 @@ import { of, throwError } from 'rxjs'
import { SavedView } from 'src/app/data/saved-view'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { PermissionsGuard } from 'src/app/guards/permissions.guard'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { CustomFieldsService } from 'src/app/services/rest/custom-fields.service'
import { SavedViewService } from 'src/app/services/rest/saved-view.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmButtonComponent } from '../../common/confirm-button/confirm-button.component'
import { CheckComponent } from '../../common/input/check/check.component'
import { DragDropSelectComponent } from '../../common/input/drag-drop-select/drag-drop-select.component'
@@ -32,7 +32,7 @@ describe('SavedViewsComponent', () => {
let component: SavedViewsComponent
let fixture: ComponentFixture<SavedViewsComponent>
let savedViewService: SavedViewService
let toastService: ToastService
let notificationService: NotificationService
beforeEach(async () => {
TestBed.configureTestingModule({
@@ -77,7 +77,7 @@ describe('SavedViewsComponent', () => {
}).compileComponents()
savedViewService = TestBed.inject(SavedViewService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
fixture = TestBed.createComponent(SavedViewsComponent)
component = fixture.componentInstance
@@ -93,8 +93,8 @@ describe('SavedViewsComponent', () => {
})
it('should support save saved views, show error', () => {
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastSpy = jest.spyOn(toastService, 'show')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'show')
const savedViewPatchSpy = jest.spyOn(savedViewService, 'patchMany')
const toggle = fixture.debugElement.query(
@@ -108,16 +108,16 @@ describe('SavedViewsComponent', () => {
throwError(() => new Error('unable to save saved views'))
)
component.save()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(savedViewPatchSpy).toHaveBeenCalled()
toastSpy.mockClear()
toastErrorSpy.mockClear()
notificationSpy.mockClear()
notificationErrorSpy.mockClear()
savedViewPatchSpy.mockClear()
// succeed saved views
savedViewPatchSpy.mockReturnValueOnce(of(savedViews as SavedView[]))
component.save()
expect(toastErrorSpy).not.toHaveBeenCalled()
expect(notificationErrorSpy).not.toHaveBeenCalled()
expect(savedViewPatchSpy).toHaveBeenCalled()
})
@@ -150,12 +150,12 @@ describe('SavedViewsComponent', () => {
})
it('should support delete saved view', () => {
const toastSpy = jest.spyOn(toastService, 'showInfo')
const notificationSpy = jest.spyOn(notificationService, 'showInfo')
const deleteSpy = jest.spyOn(savedViewService, 'delete')
deleteSpy.mockReturnValue(of(true))
component.deleteSavedView(savedViews[0] as SavedView)
expect(deleteSpy).toHaveBeenCalled()
expect(toastSpy).toHaveBeenCalledWith(
expect(notificationSpy).toHaveBeenCalledWith(
`Saved view "${savedViews[0].name}" deleted.`
)
})

12
src-ui/src/app/components/manage/saved-views/saved-views.component.ts
View File

@@ -11,9 +11,9 @@ import { BehaviorSubject, Observable, takeUntil } from 'rxjs'
import { DisplayMode } from 'src/app/data/document'
import { SavedView } from 'src/app/data/saved-view'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { NotificationService } from 'src/app/services/notification.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 { ConfirmButtonComponent } from '../../common/confirm-button/confirm-button.component'
import { DragDropSelectComponent } from '../../common/input/drag-drop-select/drag-drop-select.component'
import { NumberComponent } from '../../common/input/number/number.component'
@@ -58,7 +58,7 @@ export class SavedViewsComponent
constructor(
private savedViewService: SavedViewService,
private settings: SettingsService,
private toastService: ToastService
private notificationService: NotificationService
) {
super()
this.settings.organizingSidebarSavedViews = true
@@ -129,7 +129,7 @@ export class SavedViewsComponent
this.savedViewService.delete(savedView).subscribe(() => {
this.savedViewsGroup.removeControl(savedView.id.toString())
this.savedViews.splice(this.savedViews.indexOf(savedView), 1)
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Saved view "${savedView.name}" deleted.`
)
this.savedViewService.clearCache()
@@ -155,11 +155,13 @@ export class SavedViewsComponent
if (changed.length) {
this.savedViewService.patchMany(changed).subscribe({
next: () => {
this.toastService.showInfo($localize`Views saved successfully.`)
this.notificationService.showInfo(
$localize`Views saved successfully.`
)
this.store.next(this.savedViewsForm.value)
},
error: (error) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error while saving views.`,
error
)

6
src-ui/src/app/components/manage/storage-path-list/storage-path-list.component.ts
View File

@@ -13,12 +13,12 @@ import { IfPermissionsDirective } from 'src/app/directives/if-permissions.direct
import { SortableDirective } from 'src/app/directives/sortable.directive'
import { SafeHtmlPipe } from 'src/app/pipes/safehtml.pipe'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionsService,
PermissionType,
} from 'src/app/services/permissions.service'
import { StoragePathService } from 'src/app/services/rest/storage-path.service'
import { ToastService } from 'src/app/services/toast.service'
import { StoragePathEditDialogComponent } from '../../common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component'
import { PageHeaderComponent } from '../../common/page-header/page-header.component'
import { ManagementListComponent } from '../management-list/management-list.component'
@@ -45,7 +45,7 @@ export class StoragePathListComponent extends ManagementListComponent<StoragePat
constructor(
directoryService: StoragePathService,
modalService: NgbModal,
toastService: ToastService,
notificationService: NotificationService,
documentListViewService: DocumentListViewService,
permissionsService: PermissionsService
) {
@@ -53,7 +53,7 @@ export class StoragePathListComponent extends ManagementListComponent<StoragePat
directoryService,
modalService,
StoragePathEditDialogComponent,
toastService,
notificationService,
documentListViewService,
permissionsService,
FILTER_HAS_STORAGE_PATH_ANY,

6
src-ui/src/app/components/manage/tag-list/tag-list.component.ts
View File

@@ -13,12 +13,12 @@ import { IfPermissionsDirective } from 'src/app/directives/if-permissions.direct
import { SortableDirective } from 'src/app/directives/sortable.directive'
import { SafeHtmlPipe } from 'src/app/pipes/safehtml.pipe'
import { DocumentListViewService } from 'src/app/services/document-list-view.service'
import { NotificationService } from 'src/app/services/notification.service'
import {
PermissionsService,
PermissionType,
} from 'src/app/services/permissions.service'
import { TagService } from 'src/app/services/rest/tag.service'
import { ToastService } from 'src/app/services/toast.service'
import { TagEditDialogComponent } from '../../common/edit-dialog/tag-edit-dialog/tag-edit-dialog.component'
import { PageHeaderComponent } from '../../common/page-header/page-header.component'
import { ManagementListComponent } from '../management-list/management-list.component'
@@ -45,7 +45,7 @@ export class TagListComponent extends ManagementListComponent<Tag> {
constructor(
tagService: TagService,
modalService: NgbModal,
toastService: ToastService,
notificationService: NotificationService,
documentListViewService: DocumentListViewService,
permissionsService: PermissionsService
) {
@@ -53,7 +53,7 @@ export class TagListComponent extends ManagementListComponent<Tag> {
tagService,
modalService,
TagEditDialogComponent,
toastService,
notificationService,
documentListViewService,
permissionsService,
FILTER_HAS_TAGS_ALL,

34
src-ui/src/app/components/manage/workflows/workflows.component.spec.ts
View File

@@ -19,9 +19,9 @@ import {
WorkflowTriggerType,
} from 'src/app/data/workflow-trigger'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { WorkflowService } from 'src/app/services/rest/workflow.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { EditDialogMode } from '../../common/edit-dialog/edit-dialog.component'
import { WorkflowEditDialogComponent } from '../../common/edit-dialog/workflow-edit-dialog/workflow-edit-dialog.component'
@@ -77,7 +77,7 @@ describe('WorkflowsComponent', () => {
let fixture: ComponentFixture<WorkflowsComponent>
let workflowService: WorkflowService
let modalService: NgbModal
let toastService: ToastService
let notificationService: NotificationService
beforeEach(() => {
TestBed.configureTestingModule({
@@ -116,7 +116,7 @@ describe('WorkflowsComponent', () => {
})
)
modalService = TestBed.inject(NgbModal)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
jest.useFakeTimers()
fixture = TestBed.createComponent(WorkflowsComponent)
component = fixture.componentInstance
@@ -127,8 +127,8 @@ describe('WorkflowsComponent', () => {
it('should support create, show notification on error / success', () => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const reloadSpy = jest.spyOn(component, 'reload')
const createButton = fixture.debugElement.queryAll(By.css('button'))[1]
@@ -139,20 +139,20 @@ describe('WorkflowsComponent', () => {
// fail first
editDialog.failed.emit({ error: 'error creating item' })
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
// succeed
editDialog.succeeded.emit(workflows[0])
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
expect(reloadSpy).toHaveBeenCalled()
})
it('should support edit, show notification on error / success', () => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
const reloadSpy = jest.spyOn(component, 'reload')
const editButton = fixture.debugElement.queryAll(By.css('button'))[2]
@@ -164,12 +164,12 @@ describe('WorkflowsComponent', () => {
// fail first
editDialog.failed.emit({ error: 'error editing item' })
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
// succeed
editDialog.succeeded.emit(workflows[0])
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
expect(reloadSpy).toHaveBeenCalled()
})
@@ -240,7 +240,7 @@ describe('WorkflowsComponent', () => {
it('should support delete, show notification on error / success', () => {
let modal: NgbModalRef
modalService.activeInstances.subscribe((m) => (modal = m[m.length - 1]))
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const deleteSpy = jest.spyOn(workflowService, 'delete')
const reloadSpy = jest.spyOn(component, 'reload')
@@ -253,7 +253,7 @@ describe('WorkflowsComponent', () => {
// fail first
deleteSpy.mockReturnValueOnce(throwError(() => new Error('error deleting')))
editDialog.confirmClicked.emit()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled()
// succeed
@@ -267,21 +267,21 @@ describe('WorkflowsComponent', () => {
const toggleInput = fixture.debugElement.query(
By.css('input[type="checkbox"]')
)
const toastErrorSpy = jest.spyOn(toastService, 'showError')
const toastInfoSpy = jest.spyOn(toastService, 'showInfo')
const notificationErrorSpy = jest.spyOn(notificationService, 'showError')
const notificationInfoSpy = jest.spyOn(notificationService, 'showInfo')
// fail first
patchSpy.mockReturnValueOnce(
throwError(() => new Error('Error getting config'))
)
toggleInput.nativeElement.click()
expect(patchSpy).toHaveBeenCalled()
expect(toastErrorSpy).toHaveBeenCalled()
expect(notificationErrorSpy).toHaveBeenCalled()
// succeed second
patchSpy.mockReturnValueOnce(of(workflows[0]))
toggleInput.nativeElement.click()
patchSpy.mockReturnValueOnce(of({ ...workflows[0], enabled: false }))
toggleInput.nativeElement.click()
expect(patchSpy).toHaveBeenCalled()
expect(toastInfoSpy).toHaveBeenCalled()
expect(notificationInfoSpy).toHaveBeenCalled()
})
})

16
src-ui/src/app/components/manage/workflows/workflows.component.ts
View File

@@ -5,9 +5,9 @@ import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
import { delay, takeUntil, tap } from 'rxjs'
import { Workflow } from 'src/app/data/workflow'
import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
import { NotificationService } from 'src/app/services/notification.service'
import { PermissionsService } from 'src/app/services/permissions.service'
import { WorkflowService } from 'src/app/services/rest/workflow.service'
import { ToastService } from 'src/app/services/toast.service'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { EditDialogMode } from '../../common/edit-dialog/edit-dialog.component'
import {
@@ -40,7 +40,7 @@ export class WorkflowsComponent
private workflowService: WorkflowService,
public permissionsService: PermissionsService,
private modalService: NgbModal,
private toastService: ToastService
private notificationService: NotificationService
) {
super()
}
@@ -90,7 +90,7 @@ export class WorkflowsComponent
modal.componentInstance.succeeded
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((newWorkflow) => {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Saved workflow "${newWorkflow.name}".`
)
this.workflowService.clearCache()
@@ -99,7 +99,7 @@ export class WorkflowsComponent
modal.componentInstance.failed
.pipe(takeUntil(this.unsubscribeNotifier))
.subscribe((e) => {
this.toastService.showError($localize`Error saving workflow.`, e)
this.notificationService.showError($localize`Error saving workflow.`, e)
})
}
@@ -142,14 +142,14 @@ export class WorkflowsComponent
this.workflowService.delete(workflow).subscribe({
next: () => {
modal.close()
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`Deleted workflow "${workflow.name}".`
)
this.workflowService.clearCache()
this.reload()
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error deleting workflow "${workflow.name}".`,
e
)
@@ -161,7 +161,7 @@ export class WorkflowsComponent
toggleWorkflowEnabled(workflow: Workflow) {
this.workflowService.patch(workflow).subscribe({
next: () => {
this.toastService.showInfo(
this.notificationService.showInfo(
workflow.enabled
? $localize`Enabled workflow "${workflow.name}"`
: $localize`Disabled workflow "${workflow.name}"`
@@ -170,7 +170,7 @@ export class WorkflowsComponent
this.reload()
},
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
$localize`Error toggling workflow "${workflow.name}".`,
e
)

12
src-ui/src/app/guards/permissions.guard.spec.ts
View File

@@ -1,12 +1,12 @@
import { TestBed } from '@angular/core/testing'
import { ActivatedRoute, RouterState } from '@angular/router'
import { TourService } from 'ngx-ui-tour-ng-bootstrap'
import { NotificationService } from '../services/notification.service'
import {
PermissionAction,
PermissionType,
PermissionsService,
} from '../services/permissions.service'
import { ToastService } from '../services/toast.service'
import { PermissionsGuard } from './permissions.guard'
describe('PermissionsGuard', () => {
@@ -15,7 +15,7 @@ describe('PermissionsGuard', () => {
let route: ActivatedRoute
let routerState: RouterState
let tourService: TourService
let toastService: ToastService
let notificationService: NotificationService
beforeEach(() => {
TestBed.configureTestingModule({
@@ -44,13 +44,13 @@ describe('PermissionsGuard', () => {
},
},
TourService,
ToastService,
NotificationService,
],
})
permissionsService = TestBed.inject(PermissionsService)
tourService = TestBed.inject(TourService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
guard = TestBed.inject(PermissionsGuard)
route = TestBed.inject(ActivatedRoute)
routerState = TestBed.inject(RouterState)
@@ -88,11 +88,11 @@ describe('PermissionsGuard', () => {
})
jest.spyOn(tourService, 'getStatus').mockImplementation(() => 2)
const toastSpy = jest.spyOn(toastService, 'showError')
const notificationSpy = jest.spyOn(notificationService, 'showError')
const canActivate = guard.canActivate(route.snapshot, routerState.snapshot)
expect(canActivate).toHaveProperty('root') // returns UrlTree
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
})
})

6
src-ui/src/app/guards/permissions.guard.ts
View File

@@ -6,15 +6,15 @@ import {
UrlTree,
} from '@angular/router'
import { TourService } from 'ngx-ui-tour-ng-bootstrap'
import { NotificationService } from '../services/notification.service'
import { PermissionsService } from '../services/permissions.service'
import { ToastService } from '../services/toast.service'
@Injectable()
export class PermissionsGuard {
constructor(
private permissionsService: PermissionsService,
private router: Router,
private toastService: ToastService,
private notificationService: NotificationService,
private tourService: TourService
) {}
@@ -32,7 +32,7 @@ export class PermissionsGuard {
) {
// Check if tour is running 1 = TourState.ON
if (this.tourService.getStatus() !== 1) {
this.toastService.showError(
this.notificationService.showError(
$localize`You don't have permissions to do that`
)
}

109
src-ui/src/app/services/notification.service.spec.ts Normal file
View File

@@ -0,0 +1,109 @@
import { TestBed } from '@angular/core/testing'
import { NotificationService } from './notification.service'
describe('NotificationService', () => {
let notificationService: NotificationService
beforeEach(() => {
TestBed.configureTestingModule({
providers: [NotificationService],
})
notificationService = TestBed.inject(NotificationService)
})
it('adds notification on show', () => {
const notification = {
title: 'Title',
content: 'content',
delay: 5000,
}
notificationService.show(notification)
notificationService.getNotifications().subscribe((notifications) => {
expect(notifications).toContainEqual(notification)
})
})
it('adds a unique id to notification on show', () => {
const notification = {
title: 'Title',
content: 'content',
delay: 5000,
}
notificationService.show(notification)
notificationService.getNotifications().subscribe((notifications) => {
expect(notifications[0].id).toBeDefined()
})
})
it('parses error string to object on show', () => {
const notification = {
title: 'Title',
content: 'content',
delay: 5000,
error: 'Error string',
}
notificationService.show(notification)
notificationService.getNotifications().subscribe((notifications) => {
expect(notifications[0].error).toEqual('Error string')
})
})
it('creates notifications with defaults on showInfo and showError', () => {
notificationService.showInfo('Info notification')
notificationService.showError('Error notification')
notificationService.getNotifications().subscribe((notifications) => {
expect(notifications).toContainEqual({
content: 'Info notification',
delay: 5000,
})
expect(notifications).toContainEqual({
content: 'Error notification',
delay: 10000,
})
})
})
it('removes notification on close', () => {
const notification = {
title: 'Title',
content: 'content',
delay: 5000,
}
notificationService.show(notification)
notificationService.closeNotification(notification)
notificationService.getNotifications().subscribe((notifications) => {
expect(notifications).toHaveLength(0)
})
})
it('clears all notifications on clear', () => {
notificationService.showInfo('Info notification')
notificationService.showError('Error notification')
notificationService.clearNotifications()
notificationService.getNotifications().subscribe((notifications) => {
expect(notifications).toHaveLength(0)
})
})
it('suppresses popup notifications if suppressPopupNotifications is true', (finish) => {
notificationService.showNotification.subscribe((notification) => {
expect(notification).not.toBeNull()
})
notificationService.showInfo('Info notification')
notificationService.showNotification.subscribe((notification) => {
expect(notification).toBeNull()
finish()
})
notificationService.suppressPopupNotifications = true
notificationService.showInfo('Info notification')
})
})

87
src-ui/src/app/services/notification.service.ts Normal file
View File

@@ -0,0 +1,87 @@
import { Injectable } from '@angular/core'
import { Subject } from 'rxjs'
import { v4 as uuidv4 } from 'uuid'
export interface Notification {
id?: string
content: string
delay: number
delayRemaining?: number
action?: any
actionName?: string
classname?: string
error?: any
}
@Injectable({
providedIn: 'root',
})
export class NotificationService {
constructor() {}
_suppressPopupNotifications: boolean
set suppressPopupNotifications(value: boolean) {
this._suppressPopupNotifications = value
this.showNotification.next(null)
}
private notifications: Notification[] = []
private notificationsSubject: Subject<Notification[]> = new Subject()
public showNotification: Subject<Notification> = new Subject()
show(notification: Notification) {
if (!notification.id) {
notification.id = uuidv4()
}
if (typeof notification.error === 'string') {
try {
notification.error = JSON.parse(notification.error)
} catch (e) {}
}
this.notifications.unshift(notification)
if (!this._suppressPopupNotifications) {
this.showNotification.next(notification)
}
this.notificationsSubject.next(this.notifications)
}
showError(content: string, error: any = null, delay: number = 10000) {
this.show({
content: content,
delay: delay,
classname: 'error',
error,
})
}
showInfo(content: string, delay: number = 5000) {
this.show({ content: content, delay: delay })
}
closeNotification(notification: Notification) {
let index = this.notifications.findIndex((t) => t.id == notification.id)
if (index > -1) {
this.notifications.splice(index, 1)
this.notificationsSubject.next(this.notifications)
}
}
getNotifications() {
return this.notificationsSubject
}
clearNotifications() {
this.notifications = []
this.notificationsSubject.next(this.notifications)
this.showNotification.next(null)
}
}

12
src-ui/src/app/services/settings.service.spec.ts
View File

@@ -14,10 +14,10 @@ import { CustomFieldDataType } from '../data/custom-field'
import { DEFAULT_DISPLAY_FIELDS, DisplayField } from '../data/document'
import { SavedView } from '../data/saved-view'
import { SETTINGS_KEYS, UiSettings } from '../data/ui-settings'
import { NotificationService } from './notification.service'
import { PermissionsService } from './permissions.service'
import { CustomFieldsService } from './rest/custom-fields.service'
import { SettingsService } from './settings.service'
import { ToastService } from './toast.service'
const customFields = [
{
@@ -41,7 +41,7 @@ describe('SettingsService', () => {
let customFieldsService: CustomFieldsService
let permissionService: PermissionsService
let subscription: Subscription
let toastService: ToastService
let notificationService: NotificationService
const ui_settings: UiSettings = {
user: {
@@ -105,7 +105,7 @@ describe('SettingsService', () => {
customFieldsService = TestBed.inject(CustomFieldsService)
permissionService = TestBed.inject(PermissionsService)
settingsService = TestBed.inject(SettingsService)
toastService = TestBed.inject(ToastService)
notificationService = TestBed.inject(NotificationService)
// Normally done in app initializer
settingsService.initializeSettings().subscribe()
})
@@ -122,8 +122,8 @@ describe('SettingsService', () => {
expect(req.request.method).toEqual('GET')
})
it('should catch error and show toast on retrieve ui_settings error', fakeAsync(() => {
const toastSpy = jest.spyOn(toastService, 'showError')
it('should catch error and show notification on retrieve ui_settings error', fakeAsync(() => {
const notificationSpy = jest.spyOn(notificationService, 'showError')
httpTestingController
.expectOne(`${environment.apiBaseUrl}ui_settings/`)
.flush(
@@ -131,7 +131,7 @@ describe('SettingsService', () => {
{ status: 403, statusText: 'Forbidden' }
)
tick(500)
expect(toastSpy).toHaveBeenCalled()
expect(notificationSpy).toHaveBeenCalled()
}))
it('calls ui_settings api endpoint with POST on store', () => {

16
src-ui/src/app/services/settings.service.ts
View File

@@ -26,13 +26,13 @@ import {
UiSettings,
} from '../data/ui-settings'
import { User } from '../data/user'
import { NotificationService } from './notification.service'
import {
PermissionAction,
PermissionsService,
PermissionType,
} from './permissions.service'
import { CustomFieldsService } from './rest/custom-fields.service'
import { ToastService } from './toast.service'
export interface LanguageOption {
code: string
@@ -294,7 +294,7 @@ export class SettingsService {
private meta: Meta,
@Inject(LOCALE_ID) private localeId: string,
protected http: HttpClient,
private toastService: ToastService,
private notificationService: NotificationService,
private permissionsService: PermissionsService,
private customFieldsService: CustomFieldsService
) {
@@ -307,7 +307,7 @@ export class SettingsService {
first(),
catchError((error) => {
setTimeout(() => {
this.toastService.showError('Error loading settings', error)
this.notificationService.showError('Error loading settings', error)
}, 500)
return of({
settings: {
@@ -601,7 +601,7 @@ export class SettingsService {
this.cookieService.get(this.getLanguageCookieName())
)
} catch (error) {
this.toastService.showError(errorMessage)
this.notificationService.showError(errorMessage)
console.log(error)
}
@@ -610,10 +610,10 @@ export class SettingsService {
.subscribe({
next: () => {
this.updateAppearanceSettings()
this.toastService.showInfo(successMessage)
this.notificationService.showInfo(successMessage)
},
error: (e) => {
this.toastService.showError(errorMessage)
this.notificationService.showError(errorMessage)
console.log(e)
},
})
@@ -633,7 +633,7 @@ export class SettingsService {
.pipe(first())
.subscribe({
error: (e) => {
this.toastService.showError(
this.notificationService.showError(
'Error migrating update checking setting'
)
console.log(e)
@@ -663,7 +663,7 @@ export class SettingsService {
this.storeSettings()
.pipe(first())
.subscribe(() => {
this.toastService.showInfo(
this.notificationService.showInfo(
$localize`You can restart the tour from the settings page.`
)
})

109
src-ui/src/app/services/toast.service.spec.ts
View File

@@ -1,109 +0,0 @@
import { TestBed } from '@angular/core/testing'
import { ToastService } from './toast.service'
describe('ToastService', () => {
let toastService: ToastService
beforeEach(() => {
TestBed.configureTestingModule({
providers: [ToastService],
})
toastService = TestBed.inject(ToastService)
})
it('adds toast on show', () => {
const toast = {
title: 'Title',
content: 'content',
delay: 5000,
}
toastService.show(toast)
toastService.getToasts().subscribe((toasts) => {
expect(toasts).toContainEqual(toast)
})
})
it('adds a unique id to toast on show', () => {
const toast = {
title: 'Title',
content: 'content',
delay: 5000,
}
toastService.show(toast)
toastService.getToasts().subscribe((toasts) => {
expect(toasts[0].id).toBeDefined()
})
})
it('parses error string to object on show', () => {
const toast = {
title: 'Title',
content: 'content',
delay: 5000,
error: 'Error string',
}
toastService.show(toast)
toastService.getToasts().subscribe((toasts) => {
expect(toasts[0].error).toEqual('Error string')
})
})
it('creates toasts with defaults on showInfo and showError', () => {
toastService.showInfo('Info toast')
toastService.showError('Error toast')
toastService.getToasts().subscribe((toasts) => {
expect(toasts).toContainEqual({
content: 'Info toast',
delay: 5000,
})
expect(toasts).toContainEqual({
content: 'Error toast',
delay: 10000,
})
})
})
it('removes toast on close', () => {
const toast = {
title: 'Title',
content: 'content',
delay: 5000,
}
toastService.show(toast)
toastService.closeToast(toast)
toastService.getToasts().subscribe((toasts) => {
expect(toasts).toHaveLength(0)
})
})
it('clears all toasts on clearToasts', () => {
toastService.showInfo('Info toast')
toastService.showError('Error toast')
toastService.clearToasts()
toastService.getToasts().subscribe((toasts) => {
expect(toasts).toHaveLength(0)
})
})
it('suppresses popup toasts if suppressPopupToasts is true', (finish) => {
toastService.showToast.subscribe((toast) => {
expect(toast).not.toBeNull()
})
toastService.showInfo('Info toast')
toastService.showToast.subscribe((toast) => {
expect(toast).toBeNull()
finish()
})
toastService.suppressPopupToasts = true
toastService.showInfo('Info toast')
})
})

87
src-ui/src/app/services/toast.service.ts
View File

@@ -1,87 +0,0 @@
import { Injectable } from '@angular/core'
import { Subject } from 'rxjs'
import { v4 as uuidv4 } from 'uuid'
export interface Toast {
id?: string
content: string
delay: number
delayRemaining?: number
action?: any
actionName?: string
classname?: string
error?: any
}
@Injectable({
providedIn: 'root',
})
export class ToastService {
constructor() {}
_suppressPopupToasts: boolean
set suppressPopupToasts(value: boolean) {
this._suppressPopupToasts = value
this.showToast.next(null)
}
private toasts: Toast[] = []
private toastsSubject: Subject<Toast[]> = new Subject()
public showToast: Subject<Toast> = new Subject()
show(toast: Toast) {
if (!toast.id) {
toast.id = uuidv4()
}
if (typeof toast.error === 'string') {
try {
toast.error = JSON.parse(toast.error)
} catch (e) {}
}
this.toasts.unshift(toast)
if (!this._suppressPopupToasts) {
this.showToast.next(toast)
}
this.toastsSubject.next(this.toasts)
}
showError(content: string, error: any = null, delay: number = 10000) {
this.show({
content: content,
delay: delay,
classname: 'error',
error,
})
}
showInfo(content: string, delay: number = 5000) {
this.show({ content: content, delay: delay })
}
closeToast(toast: Toast) {
let index = this.toasts.findIndex((t) => t.id == toast.id)
if (index > -1) {
this.toasts.splice(index, 1)
this.toastsSubject.next(this.toasts)
}
}
getToasts() {
return this.toastsSubject
}
clearToasts() {
this.toasts = []
this.toastsSubject.next(this.toasts)
this.showToast.next(null)
}
}

2
src-ui/src/styles.scss
View File

@@ -571,7 +571,7 @@ table.table {
}
.toast {
--bs-toast-max-width: var(--pngx-toast-max-width);
--bs-toast-max-width: var(--pngx-notification-max-width);
}
.alert-primary {

4
src-ui/src/theme.scss
View File

@@ -24,11 +24,11 @@
--pngx-bg-alt2: var(--bs-gray-200); // #e9ecef
--pngx-bg-disabled: #f7f7f7;
--pngx-focus-alpha: 0.3;
--pngx-toast-max-width: 360px;
--pngx-notification-max-width: 360px;
--bs-info: var(--pngx-bg-alt2);
--bs-info-rgb: 233, 236, 239;
@media screen and (min-width: 1024px) {
--pngx-toast-max-width: 450px;
--pngx-notification-max-width: 450px;
}
}