move permissions input components

src-ui/src/app/components/common/input/permissions/permissions-form/permissions-form.component.html

@@ -0,0 +1,68 @@
+<ng-container *ngIf="!accordion">
+  <h5 i18n>Permissions</h5>
+  <ng-container [ngTemplateOutlet]="permissionsForm"></ng-container>
+</ng-container>
+<ng-container *ngIf="accordion">
+  <ngb-accordion #acc="ngbAccordion" activeIds="">
+    <ngb-panel i18n-title title="Edit Permissions">
+      <ng-template ngbPanelContent>
+        <ng-container [ngTemplateOutlet]="permissionsForm"></ng-container>
+      </ng-template>
+    </ngb-panel>
+  </ngb-accordion>
+</ng-container>
+
+<ng-template #permissionsForm>
+<div [formGroup]="form">
+  <div class="row">
+    <div class="col-lg-3">
+      <label class="form-label d-block my-2" i18n>Owner:</label>
+    </div>
+    <div class="col-lg-9">
+      <app-input-select [items]="users" bindLabel="username" formControlName="owner" [allowNull]="true"></app-input-select>
+    </div>
+  </div>
+  <small class="form-text text-muted text-end d-block mt-n2" i18n>Objects without an owner can be viewed and edited by all users</small>
+  <div formGroupName="set_permissions">
+    <h6 class="mt-3" i18n>View</h6>
+    <div formGroupName="view" class="mb-2">
+      <div class="row mb-1">
+        <div class="col-lg-3">
+          <label class="form-label d-block my-2" i18n>Users:</label>
+        </div>
+        <div class="col-lg-9">
+          <app-permissions-user type="view" formControlName="users"></app-permissions-user>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col-lg-3">
+          <label class="form-label d-block my-2" i18n>Groups:</label>
+        </div>
+        <div class="col-lg-9">
+          <app-permissions-group type="view" formControlName="groups"></app-permissions-group>
+        </div>
+      </div>
+    </div>
+    <h6 class="mt-4" i18n>Edit</h6>
+    <div formGroupName="change">
+      <div class="row mb-1">
+        <div class="col-lg-3">
+          <label class="form-label d-block my-2" i18n>Users:</label>
+        </div>
+        <div class="col-lg-9">
+          <app-permissions-user type="change" formControlName="users"></app-permissions-user>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col-lg-3">
+          <label class="form-label d-block my-2" i18n>Groups:</label>
+        </div>
+        <div class="col-lg-9">
+          <app-permissions-group type="change" formControlName="groups"></app-permissions-group>
+        </div>
+      </div>
+      <small class="form-text text-muted text-end d-block" i18n>Edit permissions also grant viewing permissions</small>
+    </div>
+  </div>
+</div>
+</ng-template>

src-ui/src/app/components/common/input/permissions/permissions-form/permissions-form.component.ts

@@ -0,0 +1,69 @@
+import { Component, forwardRef, Input, OnInit } from '@angular/core'
+import { FormControl, FormGroup, NG_VALUE_ACCESSOR } from '@angular/forms'
+import { PaperlessUser } from 'src/app/data/paperless-user'
+import { AbstractInputComponent } from '../../abstract-input'
+
+export interface PermissionsFormObject {
+  owner?: number
+  set_permissions?: {
+    view?: {
+      users?: number[]
+      groups?: number[]
+    }
+    change?: {
+      users?: number[]
+      groups?: number[]
+    }
+  }
+}
+
+@Component({
+  providers: [
+    {
+      provide: NG_VALUE_ACCESSOR,
+      useExisting: forwardRef(() => PermissionsFormComponent),
+      multi: true,
+    },
+  ],
+  selector: 'app-permissions-form',
+  templateUrl: './permissions-form.component.html',
+  styleUrls: ['./permissions-form.component.scss'],
+})
+export class PermissionsFormComponent
+  extends AbstractInputComponent<PermissionsFormObject>
+  implements OnInit
+{
+  @Input()
+  users: PaperlessUser[]
+
+  @Input()
+  accordion: boolean = false
+
+  form = new FormGroup({
+    owner: new FormControl(null),
+    set_permissions: new FormGroup({
+      view: new FormGroup({
+        users: new FormControl([]),
+        groups: new FormControl([]),
+      }),
+      change: new FormGroup({
+        users: new FormControl([]),
+        groups: new FormControl([]),
+      }),
+    }),
+  })
+
+  constructor() {
+    super()
+  }
+
+  ngOnInit(): void {
+    this.form.valueChanges.subscribe((value) => {
+      this.onChange(value)
+    })
+  }
+
+  writeValue(newValue: any): void {
+    this.form.patchValue(newValue, { emitEvent: false })
+  }
+}