Bulk edit permissions

src-ui/src/app/app.module.ts

@@ -108,6 +108,7 @@ import localeSr from '@angular/common/locales/sr'
 import localeSv from '@angular/common/locales/sv'
 import localeTr from '@angular/common/locales/tr'
 import localeZh from '@angular/common/locales/zh'
+import { PermissionsDialogComponent } from './components/common/permissions-dialog/permissions-dialog.component'
 
 registerLocaleData(localeBe)
 registerLocaleData(localeCs)
@@ -203,6 +204,7 @@ function initializeApp(settings: SettingsService) {
     PermissionsGroupComponent,
     IfOwnerDirective,
     IfObjectPermissionsDirective,
+    PermissionsDialogComponent,
   ],
   imports: [
     BrowserModule,

src-ui/src/app/components/common/confirm-dialog/confirm-dialog.component.ts

@@ -1,6 +1,6 @@
 import { Component, EventEmitter, Input, Output } from '@angular/core'
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
-import { interval, Subject, switchMap, take } from 'rxjs'
+import { interval, Subject, take } from 'rxjs'
 
 @Component({
   selector: 'app-confirm-dialog',

src-ui/src/app/components/common/permissions-dialog/permissions-dialog.component.html

@@ -0,0 +1,29 @@
+<div class="modal-header">
+    <h4 class="modal-title" id="modal-basic-title">{{title}}</h4>
+    <button type="button" class="btn-close" aria-label="Close" (click)="cancelClicked()">
+    </button>
+  </div>
+  <div class="modal-body">
+
+    <p class="mb-0" *ngIf="message" [innerHTML]="message | safeHtml"></p>
+
+    <form [formGroup]="form">
+      <div formGroupName="set_permissions">
+        <h6 i18n>View</h6>
+        <div formGroupName="view">
+          <app-permissions-user type="view" formControlName="users"></app-permissions-user>
+          <app-permissions-group type="view" formControlName="groups"></app-permissions-group>
+        </div>
+        <h6 i18n>Edit</h6>
+        <div formGroupName="change">
+          <app-permissions-user type="change" formControlName="users"></app-permissions-user>
+          <app-permissions-group type="change" formControlName="groups"></app-permissions-group>
+        </div>
+      </div>
+    </form>
+
+  </div>
+  <div class="modal-footer">
+    <button type="button" class="btn btn-outline-primary" (click)="cancelClicked()" i18n>Cancel</button>
+    <button type="button" class="btn btn-primary" (click)="confirmClicked.emit(permissions)" i18n>Confirm</button>
+  </div>

src-ui/src/app/components/common/permissions-dialog/permissions-dialog.component.ts

@@ -0,0 +1,46 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
+import { FormControl, FormGroup } from '@angular/forms'
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
+import { PaperlessGroup } from 'src/app/data/paperless-group'
+import { PaperlessUser } from 'src/app/data/paperless-user'
+
+@Component({
+  selector: 'app-permissions-dialog',
+  templateUrl: './permissions-dialog.component.html',
+  styleUrls: ['./permissions-dialog.component.scss'],
+})
+export class PermissionsDialogComponent implements OnInit {
+  constructor(public activeModal: NgbActiveModal) {}
+
+  @Output()
+  public confirmClicked = new EventEmitter()
+
+  @Input()
+  title = $localize`Set Permissions`
+
+  form = new FormGroup({
+    set_permissions: new FormGroup({
+      view: new FormGroup({
+        users: new FormControl([]),
+        groups: new FormControl([]),
+      }),
+      change: new FormGroup({
+        users: new FormControl([]),
+        groups: new FormControl([]),
+      }),
+    }),
+  })
+
+  get permissions() {
+    return this.form.value['set_permissions']
+  }
+
+  @Input()
+  message = $localize`Note that permissions set here will override any existing permissions`
+
+  ngOnInit(): void {}
+
+  cancelClicked() {
+    this.activeModal.close()
+  }
+}

src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.html

@@ -65,7 +65,13 @@
     </div>
   </div>
   <div class="col-auto ms-auto mb-2 mb-xl-0 d-flex">
-    <div class="btn-group btn-group-sm me-2">
+    <div class="btn-toolbar me-2">
+
+      <button type="button" class="btn btn-sm btn-outline-primary me-2" (click)="setPermissions()">
+        <svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor">
+          <use xlink:href="assets/bootstrap-icons.svg#person-fill-lock" />
+        </svg>&nbsp;<ng-container i18n>Permissions</ng-container>
+      </button>
 
       <div ngbDropdown class="me-2 d-flex">
         <button class="btn btn-sm btn-outline-primary" id="dropdownSelect" ngbDropdownToggle>

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

@@ -26,6 +26,7 @@ import { StoragePathService } from 'src/app/services/rest/storage-path.service'
 import { PaperlessStoragePath } from 'src/app/data/paperless-storage-path'
 import { SETTINGS_KEYS } from 'src/app/data/paperless-uisettings'
 import { ComponentWithPermissions } from '../../with-permissions/with-permissions.component'
+import { PermissionsDialogComponent } from '../../common/permissions-dialog/permissions-dialog.component'
 
 @Component({
   selector: 'app-bulk-editor',
@@ -397,4 +398,16 @@ export class BulkEditorComponent extends ComponentWithPermissions {
       this.executeBulkOperation(modal, 'redo_ocr', {})
     })
   }
+
+  setPermissions() {
+    let modal = this.modalService.open(PermissionsDialogComponent, {
+      backdrop: 'static',
+    })
+    modal.componentInstance.confirmClicked.subscribe((permissions) => {
+      modal.componentInstance.buttonsEnabled = false
+      this.executeBulkOperation(modal, 'set_permissions', {
+        permissions,
+      })
+    })
+  }
 }