Merge pull request #306 from CTemplar/dev

v1.1.6
CTemplar · Nov 12, 2018 · a7f24c7 · a7f24c7
2 parents 623591c + d6113c6
commit a7f24c7
Show file tree

Hide file tree

Showing 88 changed files with 1,677 additions and 360 deletions.
diff --git a/.angular-cli.json b/.angular-cli.json
@@ -21,7 +21,8 @@
       "prefix": "app",
       "styles": [
         "styles.scss",
-        "../node_modules/quill/dist/quill.snow.css"
+        "../node_modules/quill/dist/quill.snow.css",
+        "styles/material-theme.scss"
       ],
       "scripts": [
         "../node_modules/openpgp/dist/openpgp.min.js",

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -5,7 +5,7 @@
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
-    "build": "ng build --prod",
+    "build": "ng build --prod --subresource-integrity",
     "dev": "ng build --env=dev --output-hashing all",
     "test": "ng test",
     "lint": "ng lint",
@@ -35,6 +35,7 @@
     "bcryptjs": "^2.4.3",
     "bootstrap": "^4.1.0",
     "core-js": "^2.4.1",
+    "cssfilter": "0.0.10",
     "moment": "^2.22.2",
     "moment-timezone": "^0.5.21",
     "ng-recaptcha": "^3.0.5",
@@ -45,6 +46,7 @@
     "openpgp": "^3.0.7",
     "quill": "^1.3.6",
     "rxjs": "^5.5.7",
+    "xss": "^1.0.3",
     "zone.js": "^0.8.20"
   },
   "devDependencies": {

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -42,6 +42,7 @@ import { TranslateHttpLoader } from '@ngx-translate/http-loader';
 import { TimezoneService } from './store/services/timezone.service';
 import { ComposeMailService } from './store/services/compose-mail.service';
 import { ZendeskWebWidgetService } from './shared/services/zendesk-web-widget.service';
+import { DonationService } from './store/services/donation.service';
 
 // AoT requires an exported function for factories
 export function HttpLoaderFactory(http: HttpClient) {
@@ -90,6 +91,7 @@ export function HttpLoaderFactory(http: HttpClient) {
     MailService,
     ComposeMailService,
     DateTimeUtilService,
+    DonationService,
     {
       provide: HTTP_INTERCEPTORS,
       useClass: TokenInterceptor,

diff --git a/src/app/mail/dialogs/create-folder/create-folder.component.ts b/src/app/mail/dialogs/create-folder/create-folder.component.ts
@@ -58,7 +58,6 @@ export class CreateFolderComponent implements OnInit, OnDestroy {
       });
     this.customFolderForm.get('folderName').valueChanges.takeUntil(this.destroyed$)
       .subscribe((value) => {
-        console.log(value);
         this.checkFolderExist(value);
       });
   }

diff --git a/src/app/mail/mail-detail/mail-detail.component.html b/src/app/mail/mail-detail/mail-detail.component.html
diff --git a/src/app/mail/mail-detail/mail-detail.component.scss b/src/app/mail/mail-detail/mail-detail.component.scss
@@ -1,5 +1,5 @@
 
-.conversation-list {
+.mail-content {
   position: relative;
 
   .msg-reply-dropdown {
@@ -8,6 +8,20 @@
   }
 }
 
+.mail-header { 
+  border: solid 1px #e5e5e5;
+  margin: 5px;
+}
+
+
+.clipped-content {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 300px;
+  height: 1.1rem;
+}
+
 .download-attachment-wrapper {
   display: inline-block;
   border-radius: 2px;

diff --git a/src/app/mail/mail-detail/mail-detail.component.ts b/src/app/mail/mail-detail/mail-detail.component.ts
@@ -4,11 +4,11 @@ import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
 import { Store } from '@ngrx/store';
 import { OnDestroy, TakeUntilDestroy } from 'ngx-take-until-destroy';
 import { Observable } from 'rxjs/Observable';
-import {DeleteMail, MoveMail, StarMail} from '../../store/actions';
+import { DeleteMail, GetUnreadMailsCount, MoveMail, StarMail } from '../../store/actions';
 import { ClearMailDetail, GetMailDetail, ReadMail } from '../../store/actions/mail.actions';
-import { AppState, MailBoxesState, MailState } from '../../store/datatypes';
-import { Mail, Mailbox, MailFolderType } from '../../store/models/mail.model';
-import { OpenPgpService } from '../../store/services';
+import { AppState, MailBoxesState, MailState, UserState } from '../../store/datatypes';
+import { Folder, Mail, Mailbox, MailFolderType } from '../../store/models/mail.model';
+import { OpenPgpService, SharedService } from '../../store/services';
 import { DateTimeUtilService } from '../../store/services/datetime-util.service';
 
 @TakeUntilDestroy()
@@ -24,19 +24,24 @@ export class MailDetailComponent implements OnInit, OnDestroy {
 
   mail: Mail;
   composeMailData: any = {};
-  mailFolderType = MailFolderType;
+  mailFolderTypes = MailFolderType;
   decryptedContents: any = {};
   mailOptions: any = {};
   selectedMailToForward: Mail;
+
+  parentMailCollapsed: boolean = true;
   childMailCollapsed: boolean[] = [];
+  mailFolder: MailFolderType;
+  customFolders: Folder[] = [];
 
-  private mailFolder: MailFolderType;
   private currentMailbox: Mailbox;
   private forwardAttachmentsModalRef: NgbModalRef;
+  private userState: UserState;
 
   constructor(private route: ActivatedRoute,
               private store: Store<AppState>,
               private pgpService: OpenPgpService,
+              private shareService: SharedService,
               private router: Router,
               private dateTimeUtilService: DateTimeUtilService,
               private modalService: NgbModal) {
@@ -46,7 +51,7 @@ export class MailDetailComponent implements OnInit, OnDestroy {
 
     this.store.select(state => state.mail).takeUntil(this.destroyed$)
       .subscribe((mailState: MailState) => {
-        if (mailState.mailDetail) {
+        if (mailState.mailDetail && mailState.noUnreadCountChange) {
           this.mail = mailState.mailDetail;
           if (this.mail.folder === MailFolderType.OUTBOX && !this.mail.is_encrypted) {
             this.decryptedContents[this.mail.id] = this.mail.content;
@@ -58,6 +63,12 @@ export class MailDetailComponent implements OnInit, OnDestroy {
             if (decryptedContent && !decryptedContent.inProgress && decryptedContent.content) {
               this.decryptedContents[this.mail.id] = decryptedContent.content;
 
+              // Automatically scrolls to last element in the list
+              // Class name .last-child is set inside the template
+              if (this.mail.children && this.mail.children.length > 0) {
+                this.scrollTo(document.querySelector('.last-child'));
+              }
+
               // Mark mail as read
               if (!this.mail.read) {
                 this.markAsRead(this.mail.id);
@@ -68,10 +79,8 @@ export class MailDetailComponent implements OnInit, OnDestroy {
             this.mailOptions[this.mail.id] = {};
           }
           if (this.mail.children) {
-
-            /**
-             * Collapse all emails by default
-             */
+            this.parentMailCollapsed = true;
+            // Collapse all emails by default
             this.childMailCollapsed.fill(true, 0, this.mail.children.length);
             // Do not collapse the last email in the list
             this.childMailCollapsed[this.mail.children.length - 1] = false;
@@ -92,6 +101,8 @@ export class MailDetailComponent implements OnInit, OnDestroy {
                 this.mailOptions[child.id] = {};
               }
             });
+          } else {
+            this.parentMailCollapsed = false;
           }
         }
       });
@@ -111,6 +122,12 @@ export class MailDetailComponent implements OnInit, OnDestroy {
 
       this.mailFolder = params['folder'] as MailFolderType;
 
+      this.store.select(state => state.user).takeUntil(this.destroyed$)
+        .subscribe((user: UserState) => {
+          this.customFolders = user.customFolders;
+          this.userState = user;
+        });
+
     });
   }
 
@@ -124,8 +141,19 @@ export class MailDetailComponent implements OnInit, OnDestroy {
   //   return  filePathTokens[filePathTokens.length - 1];
   // }
 
-  private markAsRead(mailID: number) {
-    this.store.dispatch(new ReadMail({ ids: mailID.toString(), read: true }));
+  markAsStarred() {
+    this.store.dispatch(new StarMail({ ids: `${this.mail.id}`, starred: true }));
+  }
+
+  markAsRead(mailID: number, read: boolean = true) {
+    this.store.dispatch(new ReadMail({ ids: mailID.toString(), read }));
+    if (!read) {
+      this.router.navigateByUrl(`/mail/${this.mailFolder}`);
+    } else {
+      setTimeout(() => {
+        this.store.dispatch(new GetUnreadMailsCount());
+      }, 1000);
+    }
   }
 
   ngOnDestroy(): void {
@@ -231,21 +259,30 @@ export class MailDetailComponent implements OnInit, OnDestroy {
       this.router.navigateByUrl(`/mail/${this.mailFolder}`);
     }
   }
-    ontoggleStarred(mail: Mail) {
-        if (mail.starred) {
-            this.store.dispatch(
-                new StarMail({ ids: mail.id.toString(), starred: false })
-            );
-        } else {
-            this.store.dispatch(
-                new StarMail({ ids: mail.id.toString(), starred: true })
-            );
-        }
-        mail.starred = !mail.starred;
+
+  ontoggleStarred(mail: Mail) {
+    if (mail.starred) {
+      this.store.dispatch(
+        new StarMail({ ids: mail.id.toString(), starred: false })
+      );
+    } else {
+      this.store.dispatch(
+        new StarMail({ ids: mail.id.toString(), starred: true })
+      );
     }
+    mail.starred = !mail.starred;
+  }
 
-  toggleGmailExtra(mail: Mail) {
-    this.mailOptions[mail.id].showGmailExtraContent = !this.mailOptions[mail.id].showGmailExtraContent;
+  moveToFolder(folder: MailFolderType) {
+    this.store.dispatch(new MoveMail({ ids: this.mail.id, folder }));
+  }
+
+  goBack() {
+    this.router.navigateByUrl(`/mail/${this.mailFolder}`);
+  }
+
+  openCreateFolderDialog() {
+    this.shareService.openCreateFolderDialog(this.userState.isPrime, this.customFolders);
   }
 
   onPrint(mail: Mail) {
@@ -346,12 +383,14 @@ export class MailDetailComponent implements OnInit, OnDestroy {
   }
 
   scrollTo(elementRef: any) {
-    setTimeout(() => {
-      window.scrollTo({
-        top: elementRef.offsetTop,
-        behavior: 'smooth'
-      });
-    }, 100);
+    if (elementRef) {
+      setTimeout(() => {
+        window.scrollTo({
+          top: elementRef.offsetTop,
+          behavior: 'smooth'
+        });
+      }, 100);
+    }
   }
 
   private getPreviousMails(index: number, isChildMail: boolean) {
@@ -378,7 +417,7 @@ export class MailDetailComponent implements OnInit, OnDestroy {
   private getMessageSummary(content: string, mail: Mail): string {
     const formattedDateTime = mail.sent_at ? this.dateTimeUtilService.formatDateTimeStr(mail.sent_at, 'ddd, MMMM D, YYYY [at] h:mm:ss A') :
       this.dateTimeUtilService.formatDateTimeStr(mail.created_at, 'ddd, MMMM D, YYYY [at] h:mm:ss A');
-    content +=  `</br>On ${formattedDateTime} &lt;${mail.sender}&gt; wrote:</br>${this.decryptedContents[mail.id]}</br>`;
+    content += `</br>On ${formattedDateTime} &lt;${mail.sender}&gt; wrote:</br>${this.decryptedContents[mail.id]}</br>`;
 
     return content;
   }

diff --git a/src/app/mail/mail-list/mail-folder/generic-folder/generic-folder.component.html b/src/app/mail/mail-list/mail-folder/generic-folder/generic-folder.component.html
@@ -184,8 +184,7 @@
         <!-- Check box -->
         <td class="mail-checkbox">
           <div class="fancy-field-group">
-            <input class="d-none fancy-field-control" id={{mail.id}} type="checkbox" [ngModel]="mail.marked" (ngModelChange)="toggleEmailSelection(mail, $event)"/>
-            <label for={{mail.id}} class="fancy-field-empty"></label>
+            <mat-checkbox [checked]="mail.marked" (change)="toggleEmailSelection(mail, $event.checked)"></mat-checkbox>
           </div>
         </td>
 
@@ -231,8 +230,8 @@
                       *ngIf="mail.dead_man_duration">Dead mans timer {{mail.dead_man_duration | remainingTime:true}}
                 </span>
               </ng-container>
-              <div class="mail-content" [innerHTML]="mail.subject">
-                  <!-- Subject Goes Here -->
+              <div class="mail-content">
+                  {{mail.subject}}
               </div>
             </span>
           </a>