@bizdoc/core 1.13.11 → 1.13.12

package/src/lib/browse/expanded-item/expanded-item.component.ts

@@ -0,0 +1,333 @@
+import { Component, Input, Output, EventEmitter, OnInit, OnDestroy } from '@angular/core';
+import { HttpErrorResponse } from '@angular/common/http';
+import { MatDialog } from '@angular/material/dialog';
+import { Directionality } from '@angular/cdk/bidi';
+import { Subject, filter } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { RecipientModel, HeaderModel, Action, UserInfo, Gender } from '../../core/models';
+import { MailboxService } from '../../core/mailbox.service';
+import { SessionService } from '../../core/session.service';
+import { PromptService } from '../../core/prompt.service';
+import { TranslateService } from '../../core/translate.service';
+import { HubService } from '../../core/hub.service';
+import { AccountService } from '../../core/account.service';
+import { ActionDialog, ActionDialogData } from '../../compose/action/action.dialog';
+import { ChatInfo } from '../../chat/chat-info';
+import dayjs from 'dayjs';
+
+const REFRESH_TIME = 30000, TYPING_HINT_TIME = 1500;
+
+@Component({
+  selector: 'bizdoc-expanded-item',
+  templateUrl: './expanded-item.component.html',
+  styleUrls: ['./expanded-item.component.scss']
+})
+export class ExpandedItemComponent implements OnInit, OnDestroy {
+  @Input() model: RecipientModel<any>;
+  @Output() readonly sent = new EventEmitter<RecipientModel<any>>();
+  actions?: Action[];
+  newComments?: number;
+  typing?: boolean;
+  note: string;
+  sender?: string;
+  awaiting?: string;
+  mode: 'working' | 'done' | 'failed' | null;
+  private _typingTask: NodeJS.Timeout;
+  private _refreshTask: NodeJS.Timeout;
+  private readonly _destroy = new Subject<void>();
+  constructor(private _sb: PromptService,
+    private _chat: ChatInfo,
+    private _accounts: AccountService,
+    private _mailbox: MailboxService,
+    private _session: SessionService,
+    private _dir: Directionality,
+    private _dialog: MatDialog,
+    private _translate: TranslateService,
+    private _messaging: HubService) {
+  }
+  ngOnInit(): void {
+    this._messaging.comment$.pipe(takeUntil(this._destroy)).
+      subscribe(e => {
+        if (e.id === this.model.id && (e.model.byId || e.model.userId) !== this._session.userId) {
+          this._comments();
+          this._accounts.get(e.model.userId).subscribe(u =>
+            this._sb.toast('Commented', u.gender, u.name));
+        }
+      });
+    this._messaging.update$.pipe(takeUntil(this._destroy)).subscribe(e => {
+      if (e.model.id === this.model.id) {
+        this._refresh();
+        (e.userId !== this._session.userId) && this._accounts.get(e.userId).subscribe(u =>
+          this._sb.toast('MailVersionUpdate', this.model.number, u.name));
+      }
+    });
+    this._mailbox.changed.pipe(takeUntil(this._destroy)).subscribe(e => {
+      if (e.id === this.model.id)
+        this._refresh();
+    });
+    this._messaging.commentTyping$.pipe(takeUntil(this._destroy), filter(e => e.id === this.model.documentId)).subscribe(c => {
+      this.typing = true;
+      clearTimeout(this._typingTask);
+      this._typingTask = setTimeout(() => this.typing = false, TYPING_HINT_TIME);
+    });
+    this._refresh();
+    this._refreshTask = setInterval(() => this._refresh(), REFRESH_TIME);
+  }
+  private async _note() {
+    const { ownerId, issued, substituteId, received, replied, log, id, note, byId, action, escalated, originId } = this.model;
+    let target: string;
+    if (action) {
+      target = await this._target(id);
+    }
+    if (substituteId) {
+      const substituting = await this._accounts.get(substituteId).toPromise();
+      if (replied) {
+        const time = this._fromNow(replied),
+          action = this._session.profile.actions.find(a => a.name === action),
+          adjective = (action.adjective || action.title).toLowerCase();
+        if (target)
+          this.note = this._translate.personalize('YouSubstituteActionTakenTo', substituting.gender, adjective,
+            target,
+            this._formatUserElement(substituting), time);
+        else
+          this.note = this._translate.personalize('YouSubstituteActionTaken', substituting.gender, adjective, this._formatUserElement(substituting), time);
+      }
+      else if (escalated) {
+        const escalations = log.filter(l => l.time > issued &&
+          l.type === 'Escalation'
+          && l.recipientId === id);
+        this.note = this._translate.personalize('EscalatedFrom', substituting.gender, this._formatUserElement(substituting), this._duration(escalations[0].duration));
+      }
+      else {
+        const time = this._fromNow(received);
+        this.note = this._translate.personalize('SubstitutingNote', substituting.gender,
+          this._formatUserElement(substituting),
+          time,
+          note || '');
+      }
+    }
+    else if (replied) {
+      const time = this._fromNow(replied);
+      if (byId) {
+        if (byId === this._session.profile.byId) {
+          if (target)
+            this.note = this._translate.get('ActionTakenByYouTo', this._actionName(action, 'you'),
+              target,
+              this._session.profile.name, time);
+          else this.note = this._translate.get('ActionTakenByYou', this._actionName(action, 'you'),
+            this._session.profile.name, time);
+        }
+        else
+          this._accounts.get(byId).subscribe(u => {
+            if (target)
+              this.note = this._translate.get('YouTakenActionByTo', this._formatUserElement(u),
+                this._actionName(action, u.gender), target, time);
+            else
+              this.note = this._translate.get('YouTakenActionBy', this._formatUserElement(u),
+                this._actionName(action, u.gender), time);
+          });
+      }
+      else if (this._session.profile.byId) {
+        if (target)
+          this.note = this._translate.personalize('ActionTakenTo', this._session.profile.gender,
+            this._session.profile.name,
+            this._actionName(action, this._session.profile.gender), target, time);
+        else
+          this.note = this._translate.personalize('ActionTaken', this._session.profile.gender, this._session.profile.name,
+            this._actionName(action, this._session.profile.gender), time);
+      }
+      else {
+        if (target)
+          this.note = this._translate.get('YouTakenActionTo', this._actionName(action, 'you'), target, time);
+        else
+          this.note = this._translate.get('YouTakenAction', this._actionName(action, 'you'), time);
+      }
+    }
+    else if (note)
+      this.note = note;
+    else if (originId) {
+      const origin = this.model.recipients.find(r => r.id === originId);
+      const action = this._session.profile.actions.find(a => a.name === origin.action),
+        adjective = action.adjective || action.past || action.title;
+      if ((origin.byId || origin.userId) === this._session.userId)
+        this.note = this._translate.get('ActionByYou', adjective);
+      else if (origin.byId) {
+        const who = await this._accounts.get(origin.userId).toPromise();
+        const by = await this._accounts.get(origin.byId).toPromise();
+        this.note = this._translate.get('ActionByBy', adjective, by.name, who.name);
+      }
+      else {
+        const who = await this._accounts.get(origin.userId).toPromise();
+        this.note = this._translate.get('ActionBy', adjective, who.name);
+      }
+    }
+    else if (ownerId === this._session.profile.userId && issued) {
+      const time = this._fromNow(issued);
+      if (byId) {
+        if (byId === this._session.profile.byId)
+          this.note = this._translate.get('SubmittedNoteByYou', this._session.profile.name, time);
+        else
+          this._accounts.get(byId).subscribe(u =>
+            this.note = this._translate.personalize('SubmittedNoteBy', u.gender, this._formatUserElement(u), time));
+      }
+      else {
+        if (this._session.profile.byId)
+          this.note = this._translate.personalize('SubmittedNote', this._session.profile.gender, this._session.profile.name, time);
+        else
+          this.note = this._translate.get('YouSubmittedNote', time);
+      }
+    }
+  }
+  private async _target(id: number) {
+    const origin = this.model.recipients.filter(r => r.originId === id);
+    if (origin.length) {
+      const users = await this._accounts.getAll(origin.map(r => r.userId)).
+        toPromise();
+      return this._translate.join(
+        users.map(u => this._formatUserElement(u))
+      );
+    }
+  }
+
+  private _actionName(name: string, gender: Gender | 'you') {
+    const action = this._session.profile.actions.find(a => a.name === name);
+    if (!action) return name;
+    if (gender === 'you') {
+      const gender = this._session.gender;
+      return (
+        (gender === 'Male' ? (action.youMale || action.you) :
+          gender === 'Female' ? (action.youFemale || action.you) :
+            action.you) || action.past ||
+        action.title).toLowerCase();
+    }
+    return ((gender === 'Male' ? (action.pastMale || action.past) :
+      gender === 'Female' ? (action.pastFemale || action.past) :
+        action.past) ||
+      action.title).toLowerCase();
+  }
+  private _fromNow(date: Date) {
+    return dayjs(date).fromNow();
+  }
+
+  private _duration(time: number) {
+    return dayjs.duration(time, 's').humanize();
+  }
+  /** */
+  private async _refresh() {
+    const { actions } = this.model;
+    this.actions = actions && actions.length ? this._session.profile.actions.filter(a => actions.indexOf(a.name) > -1) : null;
+    const { senderId } = this.model;
+    // sender
+    if (senderId && (senderId !== this._session.userId)) {
+      const who = await this._accounts.get(senderId).toPromise();
+      this.sender = this._formatUserElement(who);
+    }
+    this._comments();
+    this._note();
+    this._awaiting();
+  }
+  private _comments() {
+    const { viewed, comments } = this.model;
+    this.newComments = viewed ?
+      comments.filter(c => c.time > viewed && (c.byId || c.userId) !== this._session.userId).length || null : null;
+  }
+
+  private async _awaiting() {
+    //awaiting
+    let recipients = this.model.recipients.filter(r => r.pending && !r.estimate).
+      sort((r0, r1) => r0.received > r1.received ? 1 : -1).
+      map(r => r.userId);
+    recipients = recipients.filter((r, i) => recipients.indexOf(r) === i); /* unique */
+    if (recipients.length > 0) {
+      if (recipients.indexOf(this._session.userId) < 0 || recipients.length > 1) {
+        const users = await this._accounts.getAll(recipients.filter(r => r !== this._session.userId)).toPromise();
+        const names = users.map(p => this._formatUserElement(p));
+        recipients.indexOf(this._session.userId) > -1 &&
+          names.push(this._translate.get('Yourself'));
+        this.awaiting = this._translate.get('Awaiting', this._translate.join(names));
+      }
+    }
+  }
+
+  /**
+     * Chat
+     * @param e
+     */
+  chat(e: MouseEvent) {
+    const userId = (e.srcElement as HTMLElement).getAttribute('data-info');
+    userId &&
+      this._chat.open(userId);
+  }
+  private _formatUserElement(person: UserInfo) {
+    return this._chat.format(person);
+  }
+  /**
+   * 
+   * @param action
+   */
+  send(action: string) {
+    const { id, number, version, formId } = this.model;
+    const data: ActionDialogData = {
+      action,
+      item: this.model
+    };
+    this._dialog.open(ActionDialog, {
+      data,
+      direction: this._dir.value
+    }).afterClosed().subscribe(args => {
+      if (args) {
+        this.mode = 'working';
+        this._mailbox.send(id, version, formId, null, action, args).subscribe(async r => {
+          const caction = this._session.profile.actions.find(a => a.name === action),
+            adjective = caction.adjective || caction.title;
+          const target = await this._target(id);
+          if (target)
+            this._sb.toast('SentTo', number, adjective.toLowerCase(), target);
+          else
+            this._sb.toast('Sent', number, adjective.toLowerCase());
+          this.sent.emit(this.model);
+          this.mode = 'done';
+        }, e => {
+          this._handleResponse(e, this.model, 'SendErr');
+          this.mode = 'failed';
+        });
+      }
+    });
+  }
+  /**
+   * 
+   * @param response
+   * @param item
+   * @param message resource
+   */
+  private _handleResponse(response: HttpErrorResponse | any, item: HeaderModel, message: string) {
+    if (response.constructor.name === 'PositionError')
+      switch (response.code) {
+        case 1:
+          this._sb.error('UserDeniedGeoErr');
+          break;
+        default:
+          this._sb.error('GeoErr');
+      }
+    else switch (response.status) {
+      case 409:
+        {
+          this._sb.error('VersionErr', item.number);
+          const obj = response.error /* serialized model */ as RecipientModel<any>;
+          Object.assign(item, obj);
+          break;
+        }
+      case 406:
+        this._sb.errorString(response.error);
+        break;
+      default:
+        this._sb.error(message);
+    }
+  }
+  ngOnDestroy(): void {
+    clearInterval(this._refreshTask);
+    this._destroy.next();
+    this._destroy.complete();
+    this._typingTask && clearTimeout(this._typingTask);
+  }
+}

package/src/lib/browse/filter/filter.component.html

@@ -0,0 +1,50 @@
+<form [formGroup]="form" fxLayout="column">
+  <mat-form-field *ngIf="!exclude || exclude.indexOf('contains') < 0">
+    <input matInput formControlName="contains" autocomplete="off" placeholder="{{'Contains' | translate}}" #contains>
+    <button *ngIf="form.value.contains" matSuffix mat-icon-button aria-label="" (click)="form.get('contains').setValue(null)">
+      <mat-icon>close</mat-icon>
+    </button>
+  </mat-form-field>
+  <mat-form-field>
+    <input matInput [matAutocomplete]="senders" [placeholder]="'Sender' | translate" [formControl]="senderId" #sender/>
+    <mat-autocomplete #senders [displayWith]="displayFn" (optionSelected)="senderSelected($event)">
+      <!--<mat-option [value]="null">
+        {{ 'All' | translate }}
+      </mat-option>-->
+      <mat-option *ngFor="let u of senders$ | async" [value]="u">
+        <span>{{u.name}}</span>
+      </mat-option>
+    </mat-autocomplete>
+    <button matSuffix mat-icon-button *ngIf="senderId.value" (click)="clearSender()"><mat-icon>clear</mat-icon></button>
+  </mat-form-field>
+  <mat-form-field>
+    <mat-select [placeholder]="'Status'|translate" formControlName="state">
+      <mat-option>
+        {{ 'All' | translate }}
+      </mat-option>
+      <mat-option *ngFor="let s of states" [value]="s.name">
+        {{s.title}}
+      </mat-option>
+    </mat-select>
+  </mat-form-field>
+  <mat-form-field>
+    <mat-select [placeholder]="'Form' | translate" formControlName="form">
+      <mat-option>
+        {{ 'All' | translate }}
+      </mat-option>
+      <mat-option *ngFor="let f of forms" [value]="f.name">{{f.title}}</mat-option>
+    </mat-select>
+  </mat-form-field>
+  <div>
+    <mat-chip-list id="tags" [selectable]="true">
+      <mat-chip color="accent" *ngFor="let tag of tags" [selectable]="true" [selected]="form.value.tag === tag" (click)="toggleTag(tag)" style="cursor: pointer">
+        {{tag}}
+      </mat-chip>
+    </mat-chip-list>
+  </div>
+  <bizdoc-cube-filter *ngIf="filters" class="cube-filter"
+                      [cube]="filters.cube"
+                      [include]="filters.axes"
+                      [axes]="values"
+                      (axesChange)="axesChange($event)"></bizdoc-cube-filter>
+</form>

package/src/lib/browse/filter/filter.component.scss

@@ -0,0 +1,10 @@
+form {
+  /*max-width: 250px;*/
+  padding: 8px;
+}
+
+.cube-filter ::ng-deep {
+  form {
+    padding: 0;
+  }
+}

package/src/lib/browse/filter/filter.component.ts

@@ -0,0 +1,156 @@
+import { Component, Output, EventEmitter, OnInit, OnDestroy, ViewChild, OnChanges, SimpleChanges, Input, ElementRef, AfterViewInit, ChangeDetectorRef, Inject } from '@angular/core';
+import { FormBuilder } from '@angular/forms';
+import { CdkDragDrop } from '@angular/cdk/drag-drop';
+import { MatChipList } from '@angular/material/chips';
+import { MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
+import { Subject, Observable } from 'rxjs';
+import { debounceTime, takeUntil, switchMap, filter } from 'rxjs/operators';
+import { State, Form, UserInfo, AxesMap } from '../../core/models';
+import { cleanup, isString } from '../../core/functions';
+import { SessionService } from '../../core/session.service';
+import { MailboxService } from '../../core/mailbox.service';
+import { AccountService } from '../../core/account.service';
+import { AXIS_VALUE_PATTERN } from '../../cube/cube.service';
+import { BizDocConfig, BIZDOC_CONFIG } from '../../core/configuration';
+
+const FILTER_DEBOUNCE = 250;
+
+@Component({
+  selector: 'bizdoc-browse-filter',
+  templateUrl: './filter.component.html',
+  styleUrls: ['./filter.component.scss']
+})
+/** browse-filter component*/
+export class BrowseFilterComponent implements OnInit, OnChanges, AfterViewInit, OnDestroy {
+  readonly pattern = AXIS_VALUE_PATTERN;
+  @Input() values: BrowseFilterArgs;
+  @Input() folderId?: string;
+  @Input() exclude?: string[];
+  @Output() readonly valuesChange = new EventEmitter<BrowseFilterArgs>();
+  readonly senderId = this._fb.control(null);
+  readonly form = this._fb.group({
+    contains: null,
+    form: null,
+    state: null,
+    senderId: null,
+    tag: null
+  });
+  forms: Form[];
+  states: State[];
+  senders$: Observable<UserInfo[]>;
+  tags: string[];
+  filters: {
+    cube?: string;
+    axes: string[];
+  };
+  @ViewChild(MatChipList, { static: true }) chips: MatChipList;
+  @ViewChild('contains', { static: true, read: ElementRef }) contains: ElementRef<HTMLInputElement>;
+  @ViewChild('sender', { static: true, read: ElementRef }) sender: ElementRef<HTMLInputElement>;
+  readonly sources: { [datatype: string]: Observable<{ [name: string]: any }> } = {};
+  private readonly _destroy = new Subject<void>();
+  /** browse-filter ctor */
+  constructor(private _fb: FormBuilder,
+    private _session: SessionService,
+    private _cd: ChangeDetectorRef,
+    private _mailbox: MailboxService,
+    private _accounts: AccountService,
+    @Inject(BIZDOC_CONFIG) private _config: BizDocConfig) {
+    this.states = _session.profile.states;
+    this.forms = _session.profile.forms;
+    this.tags = _session.profile.options.tags;
+  }
+  ngOnInit(): void {
+    if (this.senderId) this.senders$ = this.senderId.valueChanges.
+      pipe(debounceTime(250),
+        filter(v => isString(v)),
+        takeUntil(this._destroy), switchMap(v => this._mailbox.senders(v)));
+    this.form.valueChanges.pipe(takeUntil(this._destroy), debounceTime(FILTER_DEBOUNCE)).subscribe(v => {
+      const value: BrowseFilterArgs = { ...v };
+      cleanup(value);
+      this.valuesChange.emit(value);
+    });
+    this._initialize();
+    this.setValue(this.values);
+  }
+  ngAfterViewInit(): void {
+    this.focus();
+  }
+  ngOnChanges(changes: SimpleChanges): void {
+    this._initialize();
+  }
+  private _initialize() {
+    if (this.folderId) {
+      const folder = this._session.profile.folders.find(f => f.name === this.folderId);
+      if (folder.filters)
+        this.filters = folder.filters;
+      return;
+    }
+    if (this._config.folders && this._config.folders.axes) {
+      const { axes, cube } = this._config.folders;
+      this.filters = { axes, cube };
+    }
+    else
+      this.filters = null;
+  }
+
+  display(keyValue) {
+    return keyValue ? keyValue.value : null;
+  }
+  change(axis: string, evt: MatAutocompleteSelectedEvent) {
+    this.form.controls[axis].setValue(evt.option.value.key);
+  }
+  public setValue(value: BrowseFilterArgs) {
+    this.form.patchValue(Object.assign({
+      contains: null,
+      form: null,
+      state: null,
+      senderId: null,
+      flag: null,
+      tag: null
+    }, value), { emitEvent: false });
+    if (value.senderId)
+      this._accounts.get(value.senderId).subscribe(u => this.senderId.setValue(u, { emitEvent: false }));
+    this.chips.value = value.tag;
+  }
+  clearSender() {
+    this.senderId.setValue(null);
+    this.form.patchValue({ senderId: null });
+  }
+  axesChange(axes: AxesMap) {
+    const value = { ...this.form.value, ...axes };
+    cleanup(value);
+    this.valuesChange.emit(value);
+  }
+  toggleTag(tag: string) {
+    const control = this.form.controls['tag'];
+    control.setValue(control.value !== tag ? tag : null);
+  }
+  displayFn(item: UserInfo): string | undefined {
+    return item ? item.name : undefined;
+  }
+  drop(evt: CdkDragDrop<string, any>) {
+    evt.item.data;
+  }
+  senderSelected(e: MatAutocompleteSelectedEvent) {
+    const info = e.option.value as UserInfo;
+    this.form.patchValue({ senderId: info ? info.id : null });
+  }
+  focus() {
+    if (this.contains) this.contains.nativeElement.focus();
+    else if (this.sender) this.sender.nativeElement.focus();
+    this._cd.detectChanges();
+  }
+
+  ngOnDestroy(): void {
+    this._destroy.next();
+    this._destroy.complete();
+  }
+}
+export interface BrowseFilterArgs {
+  form?: string;
+  flag?: boolean;
+  state?: string;
+  contains?: string;
+  senderId?: string;
+  tag?: string;
+}

package/src/lib/browse/folders-menu.component.html

@@ -0,0 +1,20 @@
+<mat-nav-list id="folders" cdkDropList cdkDropListSortingDisabled (cdkDropListDropped)="drop($event)"
+              cdkDropListConnectedTo="browse-table" [cdkDropListEnterPredicate]="canDrop">
+  <mat-list-item [slotRouterLink]="['mailbox/f/:type=flagged']" slotRouterLinkActive="active" (click)="change.emit()">
+    <mat-icon matListIcon [bizdocTooltip]="'Flagged'|translate" bizdocTooltipPosition="end" [bizdocTooltipDisabled]="!collapsed">star_border</mat-icon>
+    <span matLine>{{'Flagged'|translate}}</span>
+  </mat-list-item>
+  <mat-divider></mat-divider>
+  <mat-list-item *ngFor="let f of folders" [attr.data-help]="'folder-'+f.name" (click)="change.emit()"
+                 [attr.aria-label]="f.title" [slotRouterLink]="['mailbox/f', f.name]" slotRouterLinkActive="active">
+    <mat-icon matListIcon [bizdocTooltip]="f.title" bizdocTooltipPosition="end" [bizdocTooltipDisabled]="!collapsed">{{f.icon}}</mat-icon>
+    <span matLine class="folder-title">
+      <span>
+        {{f.title}}
+      </span>
+      <span *ngIf="f.count">
+        {{f.count}}
+      </span>
+    </span>
+  </mat-list-item>
+</mat-nav-list>

package/src/lib/browse/folders-menu.component.scss

@@ -0,0 +1,15 @@
+.folder-title {
+  display: flex !important;
+  -ms-flex-direction: row;
+  -webkit-flex-direction: row;
+  flex-direction: row;
+
+   :first-child {
+    -ms-flex: 1 auto;
+    -webkit-flex: 1 auto;
+    flex: 1 auto;
+  }
+
+  .folder-count {
+  }
+}

package/src/lib/browse/folders-menu.component.ts

@@ -0,0 +1,42 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { CdkDragDrop, CdkDrag } from '@angular/cdk/drag-drop';
+import { Folder, HeaderModel } from '../core/models';
+import { SessionService } from '../core/session.service';
+import { MailboxService } from '../core/mailbox.service';
+import { } from '../core/animations';
+
+@Component({
+  selector: 'bizdoc-folders-menu',
+  templateUrl: './folders-menu.component.html',
+  styleUrls: ['./folders-menu.component.scss'],
+  animations: [
+  ],
+})
+/** folders slot component*/
+export class FoldersMenuComponent {
+  @Input() collapsed: boolean;
+  @Output() readonly change = new EventEmitter();
+  readonly folders: Folder[];
+  constructor(private _session: SessionService,
+    private _mailbox: MailboxService) {
+    this.folders = this._session.profile.folders.filter(f=> f.name !== 'fav');
+  }
+  canDrop = (evt: CdkDrag<HeaderModel>) => {
+    const folder = this._session.profile.folders.find(f => f.name === (evt.data as HeaderModel).folderId);
+    //folder.group;
+    return true;
+  };
+  /**
+   * Mail drop 
+   * @param evt
+   */
+  drop(evt: CdkDragDrop<HeaderModel>) {
+    const folder = this._session.profile.folders[evt.currentIndex], item = evt.item.data as HeaderModel;
+    if (item.folderId !== folder.name) {
+      const originalFolder = this._session.profile.folders.find(f => f.name === evt.item.data.folderId);
+      if (originalFolder.group === folder.group)
+        // move and refresh
+        this._mailbox.move(item.id, folder.name).subscribe();
+    }
+  }
+}