Mail rule edit dialog

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

@@ -78,6 +78,7 @@ import { SettingsService } from './services/settings.service'
 import { TasksComponent } from './components/manage/tasks/tasks.component'
 import { TourNgBootstrapModule } from 'ngx-ui-tour-ng-bootstrap'
 import { MailAccountEditDialogComponent } from './components/common/edit-dialog/mail-account-edit-dialog/mail-account-edit-dialog.component'
+import { MailRuleEditDialogComponent } from './components/common/edit-dialog/mail-rule-edit-dialog/mail-rule-edit-dialog.component'
 
 import localeBe from '@angular/common/locales/be'
 import localeCs from '@angular/common/locales/cs'
@@ -144,7 +145,6 @@ function initializeApp(settings: SettingsService) {
     TagEditDialogComponent,
     DocumentTypeEditDialogComponent,
     StoragePathEditDialogComponent,
-    MailAccountEditDialogComponent,
     TagComponent,
     ClearableBadge,
     PageHeaderComponent,
@@ -184,6 +184,8 @@ function initializeApp(settings: SettingsService) {
     DocumentAsnComponent,
     DocumentCommentsComponent,
     TasksComponent,
+    MailAccountEditDialogComponent,
+    MailRuleEditDialogComponent,
   ],
   imports: [
     BrowserModule,

src-ui/src/app/components/common/edit-dialog/mail-rule-edit-dialog/mail-rule-edit-dialog.component.html

@@ -0,0 +1,37 @@
+<form [formGroup]="objectForm" (ngSubmit)="save()">
+  <div class="modal-header">
+    <h4 class="modal-title" id="modal-basic-title">{{getTitle()}}</h4>
+    <button type="button" [disabled]="!closeEnabled" class="btn-close" aria-label="Close" (click)="cancel()">
+    </button>
+  </div>
+  <div class="modal-body">
+    <div class="row">
+      <div class="col">
+        <app-input-text i18n-title title="Name" formControlName="name" [error]="error?.name"></app-input-text>
+        <app-input-text i18n-title title="Order" formControlName="order" [error]="error?.order"></app-input-text>
+        <app-input-text i18n-title title="Account" formControlName="account" [error]="error?.account"></app-input-text>
+        <app-input-text i18n-title title="Folder" formControlName="folder" [error]="error?.folder"></app-input-text>
+        <app-input-text i18n-title title="Filter from" formControlName="filter_from" [error]="error?.filter_from"></app-input-text>
+        <app-input-text i18n-title title="Filter body" formControlName="filter_body" [error]="error?.filter_body"></app-input-text>
+        <app-input-text i18n-title title="Filter attachment filename" formControlName="filter_attachment_filename" [error]="error?.filter_attachment_filename"></app-input-text>
+      </div>
+      <div class="col">
+        <app-input-number i18n-title title="Maximum age" formControlName="maximum_age" [error]="error?.maximum_age"></app-input-number>
+        <app-input-select i18n-title title="Attachment type" [items]="attachmentTypeOptions" formControlName="attachment_type"></app-input-select>
+        <app-input-select i18n-title title="Action" [items]="actionOptions" formControlName="attachment_type"></app-input-select>
+        <app-input-text i18n-title title="Action parameter" formControlName="action_parameter" [error]="error?.action_parameter"></app-input-text>
+      </div>
+      <div class="col">
+        <app-input-select i18n-title title="Assign title from" [items]="metadataTitleOptions" formControlName="assign_title_from"></app-input-select>
+        <app-input-tags [allowCreate]="false" formControlName="assign_tags"></app-input-tags>
+        <app-input-select i18n-title title="Assign document type" [items]="documentTypes" formControlName="assign_document_type"></app-input-select>
+        <app-input-select i18n-title title="Assign correspondent from" [items]="metadataCorrespondentOptions" formControlName="assign_correspondent_from"></app-input-select>
+        <app-input-select i18n-title title="Assign correspondent" [items]="correspondents" formControlName="assign_correspondent"></app-input-select>
+      </div>
+    </div>
+  </div>
+  <div class="modal-footer">
+    <button type="button" class="btn btn-outline-secondary" (click)="cancel()" i18n [disabled]="networkActive">Cancel</button>
+    <button type="submit" class="btn btn-primary" i18n [disabled]="networkActive">Save</button>
+  </div>
+</form>

src-ui/src/app/components/common/edit-dialog/mail-rule-edit-dialog/mail-rule-edit-dialog.component.ts

@@ -0,0 +1,98 @@
+import { Component } from '@angular/core'
+import { FormControl, FormGroup } from '@angular/forms'
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
+import { first } from 'rxjs'
+import { EditDialogComponent } from 'src/app/components/common/edit-dialog/edit-dialog.component'
+import { PaperlessCorrespondent } from 'src/app/data/paperless-correspondent'
+import { PaperlessDocumentType } from 'src/app/data/paperless-document-type'
+import {
+  MailAction,
+  MailActionOptions,
+  MailFilterAttachmentType,
+  MailFilterAttachmentTypeOptions,
+  MailMetadataCorrespondentOption,
+  MailMetadataCorrespondentOptionOptions,
+  MailMetadataTitleOption,
+  MailMetadataTitleOptionOptions,
+  PaperlessMailRule,
+} from 'src/app/data/paperless-mail-rule'
+import { CorrespondentService } from 'src/app/services/rest/correspondent.service'
+import { DocumentTypeService } from 'src/app/services/rest/document-type.service'
+import { MailRuleService } from 'src/app/services/rest/mail-rule.service'
+
+@Component({
+  selector: 'app-mail-rule-edit-dialog',
+  templateUrl: './mail-rule-edit-dialog.component.html',
+  styleUrls: ['./mail-rule-edit-dialog.component.scss'],
+})
+export class MailRuleEditDialogComponent extends EditDialogComponent<PaperlessMailRule> {
+  correspondents: PaperlessCorrespondent[]
+  documentTypes: PaperlessDocumentType[]
+
+  constructor(
+    service: MailRuleService,
+    activeModal: NgbActiveModal,
+    correspondentService: CorrespondentService,
+    documentTypeService: DocumentTypeService
+  ) {
+    super(service, activeModal)
+
+    correspondentService
+      .listAll()
+      .pipe(first())
+      .subscribe((result) => (this.correspondents = result.results))
+
+    documentTypeService
+      .listAll()
+      .pipe(first())
+      .subscribe((result) => (this.documentTypes = result.results))
+  }
+
+  getCreateTitle() {
+    return $localize`Create new mail rule`
+  }
+
+  getEditTitle() {
+    return $localize`Edit mail rule`
+  }
+
+  getForm(): FormGroup {
+    return new FormGroup({
+      name: new FormControl(null),
+      order: new FormControl(null),
+      account: new FormControl(null),
+      folder: new FormControl('INBOX'),
+      filter_from: new FormControl(null),
+      filter_subject: new FormControl(null),
+      filter_body: new FormControl(null),
+      filter_attachment_filename: new FormControl(null),
+      maximum_age: new FormControl(null),
+      attachment_type: new FormControl(MailFilterAttachmentType.Attachments),
+      action: new FormControl(MailAction.MarkRead),
+      action_parameter: new FormControl(null),
+      assign_title_from: new FormControl(MailMetadataTitleOption.FromSubject),
+      assign_tags: new FormControl(null),
+      assign_document_type: new FormControl(null),
+      assign_correspondent_from: new FormControl(
+        MailMetadataCorrespondentOption.FromNothing
+      ),
+      assign_correspondent: new FormControl(null),
+    })
+  }
+
+  get attachmentTypeOptions() {
+    return MailFilterAttachmentTypeOptions
+  }
+
+  get actionOptions() {
+    return MailActionOptions
+  }
+
+  get metadataTitleOptions() {
+    return MailMetadataTitleOptionOptions
+  }
+
+  get metadataCorrespondentOptions() {
+    return MailMetadataCorrespondentOptionOptions
+  }
+}

src-ui/src/app/components/common/input/tags/tags.component.html

@@ -7,7 +7,7 @@
       [closeOnSelect]="false"
       [clearSearchOnAdd]="true"
       [hideSelected]="true"
-      [addTag]="createTagRef"
+      [addTag]="allowCreate ? createTagRef : false"
       addTagText="Add tag"
       i18n-addTagText
       (change)="onChange(value)"
@@ -31,7 +31,7 @@
       </ng-template>
     </ng-select>
 
-    <button class="btn btn-outline-secondary" type="button" (click)="createTag()">
+    <button *ngIf="allowCreate" class="btn btn-outline-secondary" type="button" (click)="createTag()">
       <svg class="buttonicon" fill="currentColor">
         <use xlink:href="assets/bootstrap-icons.svg#plus" />
       </svg>

src-ui/src/app/components/common/input/tags/tags.component.ts

@@ -54,6 +54,9 @@ export class TagsComponent implements OnInit, ControlValueAccessor {
   @Input()
   suggestions: number[]
 
+  @Input()
+  allowCreate: boolean = true
+
   value: number[]
 
   tags: PaperlessTag[]

src-ui/src/app/components/manage/settings/settings.component.ts

@@ -35,6 +35,7 @@ import { MailAccountService as MailAccountService } from 'src/app/services/rest/
 import { MailRuleService } from 'src/app/services/rest/mail-rule.service'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { MailAccountEditDialogComponent } from '../../common/edit-dialog/mail-account-edit-dialog/mail-account-edit-dialog.component'
+import { MailRuleEditDialogComponent } from '../../common/edit-dialog/mail-rule-edit-dialog/mail-rule-edit-dialog.component'
 
 @Component({
   selector: 'app-settings',
@@ -483,6 +484,7 @@ export class SettingsComponent
     })
     modal.componentInstance.dialogMode = 'edit'
     modal.componentInstance.object = account
+    // TODO: saving
     // modal.componentInstance.success
     //   .pipe(
     //     switchMap((newStoragePath) => {
@@ -500,5 +502,26 @@ export class SettingsComponent
 
   editMailRule(rule: PaperlessMailRule) {
     console.log(rule)
+
+    var modal = this.modalService.open(MailRuleEditDialogComponent, {
+      backdrop: 'static',
+      size: 'xl',
+    })
+    modal.componentInstance.dialogMode = 'edit'
+    modal.componentInstance.object = rule
+    // TODO: saving
+    // modal.componentInstance.success
+    //   .pipe(
+    //     switchMap((newStoragePath) => {
+    //       return this.storagePathService
+    //         .listAll()
+    //         .pipe(map((storagePaths) => ({ newStoragePath, storagePaths })))
+    //     })
+    //   )
+    //   .pipe(takeUntil(this.unsubscribeNotifier))
+    //   .subscribe(({ newStoragePath, storagePaths }) => {
+    //     this.storagePaths = storagePaths.results
+    //     this.documentForm.get('storage_path').setValue(newStoragePath.id)
+    //   })
   }
 }

src-ui/src/app/data/paperless-mail-rule.ts

@@ -9,6 +9,20 @@ export enum MailFilterAttachmentType {
   Everything = 2,
 }
 
+export const MailFilterAttachmentTypeOptions: Array<{
+  id: number
+  name: string
+}> = [
+  {
+    id: MailFilterAttachmentType.Attachments,
+    name: $localize`Only process attachments.`,
+  },
+  {
+    id: MailFilterAttachmentType.Everything,
+    name: $localize`Process all files, including 'inline' attachments.`,
+  },
+]
+
 export enum MailAction {
   Delete = 1,
   Move = 2,
@@ -17,11 +31,42 @@ export enum MailAction {
   Tag = 5,
 }
 
+export const MailActionOptions: Array<{ id: number; name: string }> = [
+  { id: MailAction.Delete, name: $localize`Delete` },
+  { id: MailAction.Move, name: $localize`Move to specified folder` },
+  {
+    id: MailAction.MarkRead,
+    name: $localize`Mark as read, don't process read mails`,
+  },
+  {
+    id: MailAction.Flag,
+    name: $localize`Flag the mail, don't process flagged mails`,
+  },
+  {
+    id: MailAction.Tag,
+    name: $localize`Tag the mail with specified tag, don't process tagged mails`,
+  },
+]
+
 export enum MailMetadataTitleOption {
   FromSubject = 1,
   FromFilename = 2,
 }
 
+export const MailMetadataTitleOptionOptions: Array<{
+  id: number
+  name: string
+}> = [
+  {
+    id: MailMetadataTitleOption.FromSubject,
+    name: $localize`Use subject as title`,
+  },
+  {
+    id: MailMetadataTitleOption.FromFilename,
+    name: $localize`Use attachment filename as title`,
+  },
+]
+
 export enum MailMetadataCorrespondentOption {
   FromNothing = 1,
   FromEmail = 2,
@@ -29,6 +74,28 @@ export enum MailMetadataCorrespondentOption {
   FromCustom = 4,
 }
 
+export const MailMetadataCorrespondentOptionOptions: Array<{
+  id: number
+  name: string
+}> = [
+  {
+    id: MailMetadataCorrespondentOption.FromNothing,
+    name: $localize`Do not assign a correspondent`,
+  },
+  {
+    id: MailMetadataCorrespondentOption.FromEmail,
+    name: $localize`Use mail address`,
+  },
+  {
+    id: MailMetadataCorrespondentOption.FromName,
+    name: $localize`Use name (or mail address if not available)`,
+  },
+  {
+    id: MailMetadataCorrespondentOption.FromCustom,
+    name: $localize`Use correspondent selected below`,
+  },
+]
+
 export interface PaperlessMailRule extends ObjectWithId {
   name: string
 

src-ui/src/styles.scss

@@ -242,10 +242,12 @@ a, a:hover,
   }
 
   .input-group {
-    .ng-select-container {
+    ng-select:not(:last-child) {
-      height: 100%;
+      .ng-select-container {
-      border-top-right-radius: 0;
+        height: 100%;
-      border-bottom-right-radius: 0;
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+      }
     }
   }
 }