lgcosta/paperless-ngx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use confirm button for workflow list delete

Browse Source
This commit is contained in:
shamoon 2024-02-06 21:39:51 -08:00
parent f709d12f1c
commit 3f0f89498e
3 changed files with 33 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src-ui/src/app/components/manage/workflows/workflows.component.html
View File

@ -33,16 +33,21 @@
<div class="btn-group"> <div class="btn-group">
<button *pngxIfPermissions="{ action: PermissionAction.Change, type: PermissionType.Workflow }" class="btn btn-sm btn-outline-secondary" type="button" (click)="editWorkflow(workflow)"> <button *pngxIfPermissions="{ action: PermissionAction.Change, type: PermissionType.Workflow }" class="btn btn-sm btn-outline-secondary" type="button" (click)="editWorkflow(workflow)">
<i-bs width="1em" height="1em" name="pencil"></i-bs>&nbsp;<ng-container i18n>Edit</ng-container> <i-bs width="1em" height="1em" name="pencil"></i-bs>&nbsp;<ng-container i18n>Edit</ng-container>
</button> </button>
<button *pngxIfPermissions="{ action: PermissionAction.Delete, type: PermissionType.Workflow }" class="btn btn-sm btn-outline-danger" type="button" (click)="deleteWorkflow(workflow)"> <pngx-confirm-button
<i-bs width="1em" height="1em" name="trash"></i-bs>&nbsp;<ng-container i18n>Delete</ng-container> label="Delete"
</button> i18n-label
</div> (confirm)="deleteWorkflow(workflow)"
</div> *pngxIfPermissions="{ action: PermissionAction.Delete, type: PermissionType.Workflow }"
buttonClasses=" btn-sm btn-sm btn-outline-danger"
iconName="trash">
</pngx-confirm-button>
</div> </div>
</li> </div>
} </div>
@if (workflows.length === 0) { </li>
<li class="list-group-item" i18n>No workflows defined.</li> }
} @if (workflows.length === 0) {
</ul> <li class="list-group-item" i18n>No workflows defined.</li>
}
</ul>

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

@ -25,6 +25,7 @@ import {
} from 'src/app/data/workflow-trigger' } from 'src/app/data/workflow-trigger'
import { WorkflowActionType } from 'src/app/data/workflow-action' import { WorkflowActionType } from 'src/app/data/workflow-action'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons' import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { ConfirmButtonComponent } from '../../common/confirm-button/confirm-button.component'
const workflows: Workflow[] = [ const workflows: Workflow[] = [
{ {
@ -84,6 +85,7 @@ describe('WorkflowsComponent', () => {
IfPermissionsDirective, IfPermissionsDirective,
PageHeaderComponent, PageHeaderComponent,
ConfirmDialogComponent, ConfirmDialogComponent,
ConfirmButtonComponent,
], ],
providers: [ providers: [
{ {
@ -172,27 +174,23 @@ describe('WorkflowsComponent', () => {
}) })
it('should support delete, show notification on error / success', () => { 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 toastErrorSpy = jest.spyOn(toastService, 'showError')
const deleteSpy = jest.spyOn(workflowService, 'delete') const deleteSpy = jest.spyOn(workflowService, 'delete')
const reloadSpy = jest.spyOn(component, 'reload') const reloadSpy = jest.spyOn(component, 'reload')
const deleteButton = fixture.debugElement.queryAll(By.css('button'))[4] const deleteButton = fixture.debugElement.query(
deleteButton.triggerEventHandler('click') By.directive(ConfirmButtonComponent)
)
expect(modal).not.toBeUndefined()
const editDialog = modal.componentInstance as ConfirmDialogComponent
// fail first // fail first
deleteSpy.mockReturnValueOnce(throwError(() => new Error('error deleting'))) deleteSpy.mockReturnValueOnce(throwError(() => new Error('error deleting')))
editDialog.confirmClicked.emit() deleteButton.nativeElement.dispatchEvent(new Event('confirm'))
expect(toastErrorSpy).toHaveBeenCalled() expect(toastErrorSpy).toHaveBeenCalled()
expect(reloadSpy).not.toHaveBeenCalled() expect(reloadSpy).not.toHaveBeenCalled()
// succeed // succeed
deleteSpy.mockReturnValueOnce(of(true)) deleteSpy.mockReturnValueOnce(of(true))
editDialog.confirmClicked.emit() deleteButton.nativeElement.dispatchEvent(new Event('confirm'))
expect(reloadSpy).toHaveBeenCalled() expect(reloadSpy).toHaveBeenCalled()
}) })
}) })

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

@ -89,27 +89,15 @@ export class WorkflowsComponent
} }
deleteWorkflow(workflow: Workflow) { deleteWorkflow(workflow: Workflow) {
const modal = this.modalService.open(ConfirmDialogComponent, { this.workflowService.delete(workflow).subscribe({
backdrop: 'static', next: () => {
}) this.toastService.showInfo($localize`Deleted workflow`)
modal.componentInstance.title = $localize`Confirm delete workflow` this.workflowService.clearCache()
modal.componentInstance.messageBold = $localize`This operation will permanently delete this workflow.` this.reload()
modal.componentInstance.message = $localize`This operation cannot be undone.` },
modal.componentInstance.btnClass = 'btn-danger' error: (e) => {
modal.componentInstance.btnCaption = $localize`Proceed` this.toastService.showError($localize`Error deleting workflow.`, e)
modal.componentInstance.confirmClicked.subscribe(() => { },
modal.componentInstance.buttonsEnabled = false
this.workflowService.delete(workflow).subscribe({
next: () => {
modal.close()
this.toastService.showInfo($localize`Deleted workflow`)
this.workflowService.clearCache()
this.reload()
},
error: (e) => {
this.toastService.showError($localize`Error deleting workflow.`, e)
},
})
}) })
} }
} }