Merge pull request #395 from CTemplar/staging

Release v1.1.27

dist/README.md

@@ -2,9 +2,9 @@
 
 Official Angular cross-platform client for the CTemplar secure email service available at [https://ctemplar.com](https://ctemplar.com).
 
-RELEASE VERSION : **v1.1.26**    
+RELEASE VERSION : **v1.1.27**    
 
-SHA-256 checksum of `index.html` : **87ac27ea2d0e96d4a432b5ed9996b47f6ae638c3d46854f3cec42e2efdb4b556**  
+SHA-256 checksum of `index.html` : **fe98509ef0a4d0d438b4f1a859e0fe98d516ecb0734d9a3acae59fcc2ba54b96**  
 
 Find full release code and distribution at : [https://github.com/CTemplar/webclient/releases/latest](https://github.com/CTemplar/webclient/releases/latest)
 

dist/assets/static/pgp-worker.js

@@ -9,7 +9,18 @@ var decryptedSecureMsgPrivKeyObj;
 onmessage = function (event) {
     if (event.data.clear) {
         decryptedPrivKeys = {};
-    } else if (event.data.generateKeys) {
+    }
+    else if (event.data.encrypt) {
+        encryptContent(event.data.content, event.data.publicKeys).then(data => {
+            postMessage({encryptedContent: data, encrypted: true, callerId: event.data.callerId});
+        })
+    }
+    else if (event.data.encryptSecureMessageReply) {
+        encryptContent(event.data.content, event.data.publicKeys).then(data => {
+            postMessage({encryptedContent: data, encryptSecureMessageReply: true});
+        })
+    }
+    else if (event.data.generateKeys) {
         generateKeys(event.data.options).then((data) => {
             postMessage({
                 generateKeys: true,
@@ -131,4 +142,18 @@ async function changePassphrase(passphrase) {
         }
     }
     return {keys: privkeys, changePassphrase: true};
+}
+
+
+async function encryptContent(data, publicKeys) {
+    if (!data) {
+        return null;
+    }
+    const options = {
+        data: data,
+        publicKeys: publicKeys.map(item => openpgp.key.readArmored(item).keys[0])
+    };
+    return openpgp.encrypt(options).then(ciphertext => {
+        return ciphertext.data.replace(/(\r\n|\n|\r)((\r\n|\n|\r)\S+(\r\n|\n|\r)-+END PGP)/m, "$2");
+    })
 }

dist/index.html

@@ -85,6 +85,6 @@ <h1 class="page-title text-secondary">
         </div>
     </noscript>
     <app-root></app-root>
-<script type="text/javascript" src="runtime.342720d51562858f718f.js" integrity="sha384-sbe/lkBoZVeAemtE8Ap31YmZbjSQHhEWK4Tx6XJS1OmXZ4PhPm1atmlcVrGP/7wv" crossorigin="anonymous"></script><script type="text/javascript" src="polyfills.c6cdf1b91f8032c61d53.js" integrity="sha384-8XtHUNH2tfyVAzUAJGrQH+mA64AcRQdcAdn3rJ1SRQ7deHdCYaRDNxouJcZ3EwkE" crossorigin="anonymous"></script><script type="text/javascript" src="scripts.2b355891e0dd05f2cdd5.js" integrity="sha384-mYWPHV3OvTp4Rm5Bb9cerNTGt0LBYdnEEV5CtcuAX5cerXkjPYrVC7KstOfnun6O" crossorigin="anonymous"></script><script type="text/javascript" src="main.57d0b1c182bd53047ff0.js" integrity="sha384-DdFKnYe+SfCT95tKVnwI8YVFelmuFAJBgiUp2mvcLiQbt0Q0FxByBaAkJjhzEtSc" crossorigin="anonymous"></script></body>
+<script type="text/javascript" src="runtime.342720d51562858f718f.js" integrity="sha384-8xi89nuzatGqcjjOqHic/JW7PmB6o8PlTbJ8qum9GMr66yN95J38lo1kZgV967io" crossorigin="anonymous"></script><script type="text/javascript" src="polyfills.c6cdf1b91f8032c61d53.js" integrity="sha384-8XtHUNH2tfyVAzUAJGrQH+mA64AcRQdcAdn3rJ1SRQ7deHdCYaRDNxouJcZ3EwkE" crossorigin="anonymous"></script><script type="text/javascript" src="scripts.2b355891e0dd05f2cdd5.js" integrity="sha384-mYWPHV3OvTp4Rm5Bb9cerNTGt0LBYdnEEV5CtcuAX5cerXkjPYrVC7KstOfnun6O" crossorigin="anonymous"></script><script type="text/javascript" src="main.42743570a6def9d03cad.js" integrity="sha384-kvvI3+Kd/LdmRBzXm+2b8bMz0Zay3OerA+qFHbztxQ6JSwb8jYRB2YofaYjPVf7z" crossorigin="anonymous"></script></body>
 
 </html>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "CTemplar",
-  "version": "1.1.21",
+  "version": "1.1.27",
   "license": "MIT",
   "scripts": {
     "ng": "ng",

src/app/mail/mail-detail/mail-detail.component.html

@@ -146,7 +146,19 @@ <h5 class="ui-header-subtitle text-dark mb-0">
       </div>
     </div>
 
-    <div class="ui-body is-xs bg-faded cursor-pointer p-3 mail-header"  (click)="parentMailCollapsed = !parentMailCollapsed">
+    <div class="spam_reason" *ngIf="mail.folder === mailFolderTypes.SPAM && mail.spam_reason">
+      <span class="spam_why">Why is this message in spam? </span>
+      <span>{{mail.spam_reason}}</span>
+      <div>
+        <button class="mark_not_spam btn btn-outline-warning"
+                (click)="markNotSpam(mail)"
+                ngbTooltip="Mark email as not spam(whitelist) and move this email to inbox.">Mark not spam</button>
+      </div>
+    </div>
+
+    <div class="ui-body is-xs bg-faded cursor-pointer p-3 mail-header"
+         *ngIf="mailFolder !== mailFolderTypes.TRASH || (mailFolder === mailFolderTypes.TRASH && mail.folder === mailFolderTypes.TRASH)"
+         (click)="parentMailCollapsed = !parentMailCollapsed">
       <div class="row">
         <div class="col-8">
           <div class="mailbox-sender-content">
@@ -214,8 +226,9 @@ <h5 class="ui-header-subtitle text-dark mb-0">
   </section>
 
   <!--Mail Content-->
-  <section class="mailbox-section" id="ngb-collapse" [ngbCollapse]="parentMailCollapsed">
-
+  <section class="mailbox-section"
+           *ngIf="mailFolder !== mailFolderTypes.TRASH || (mailFolder === mailFolderTypes.TRASH && mail.folder === mailFolderTypes.TRASH)"
+           id="ngb-collapse" [ngbCollapse]="parentMailCollapsed">
     <div class="ui-body mail-content" *ngIf="decryptedContents[mail.id]">
       <div ngbDropdown placement="bottom-right" class="mailbox-dropdown msg-reply-dropdown dropdown-xs">
         <button ngbDropdownToggle class="actions-btn actions-btn-sm msg-reply-btn" role="button"
@@ -255,7 +268,7 @@ <h5 class="ui-header-subtitle text-dark mb-0">
   </section>
 
   <ng-container *ngFor="let childMail of mail.children; let childIndex = index">
-    <ng-container *ngIf="childMail.folder !== mailFolderTypes.TRASH">
+    <ng-container>
       <ng-container [ngSwitch]="childMail.folder">
         <ng-container *ngSwitchCase="mailFolderTypes.DRAFT">
           <div class="ui-body">

src/app/mail/mail-detail/mail-detail.component.scss

@@ -74,4 +74,29 @@
     width: 32px;
     z-index: 1;
   }
+}
+
+.spam_reason {
+  margin: 0 5px;
+  padding: 1rem;
+  background: #2e4960;
+  color: white;
+
+  .spam_why {
+    font-weight: bold;
+  }
+
+  .mark_not_spam {
+    padding: 10px;
+    margin-top: 5px;
+    text-transform: none;
+    color: white;
+    border-color: white;
+    background: transparent;
+
+    &:hover {
+      background: transparent;
+      opacity: 0.8;
+    }
+  }
 }

src/app/mail/mail-detail/mail-detail.component.ts

@@ -4,7 +4,7 @@ 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';
-import { DeleteMail, GetUnreadMailsCount, MoveMail, StarMail } from '../../store/actions';
+import { DeleteMail, GetUnreadMailsCount, MoveMail, StarMail, WhiteListAdd } from '../../store/actions';
 import { ClearMailDetail, GetMailDetail, ReadMail } from '../../store/actions/mail.actions';
 import { AppState, MailBoxesState, MailState, UserState } from '../../store/datatypes';
 import { Folder, Mail, Mailbox, MailFolderType } from '../../store/models/mail.model';
@@ -67,7 +67,7 @@ export class MailDetailComponent implements OnInit, OnDestroy {
           if (this.mail.folder === MailFolderType.OUTBOX && !this.mail.is_encrypted) {
             this.decryptedContents[this.mail.id] = this.mail.content;
           } else {
-            if (!this.mail.has_children && !this.isDecrypting[this.mail.id] &&
+            if (!this.mail.has_children && this.mail.content && !this.isDecrypting[this.mail.id] &&
               (!decryptedContent || (!decryptedContent.inProgress && !decryptedContent.content && this.mail.content))) {
               this.isDecrypting[this.mail.id] = true;
               this.pgpService.decrypt(this.mail.mailbox, this.mail.id, this.mail.content, this.mail.incoming_headers);
@@ -106,7 +106,7 @@ export class MailDetailComponent implements OnInit, OnDestroy {
 
             this.decryptChildEmails(this.mail.children[this.mail.children.length - 1], mailState);
             setTimeout(() => {
-              if (!this.isDecrypting[this.mail.id] &&
+              if (!this.isDecrypting[this.mail.id] && this.mail.content &&
                 (!decryptedContent || (!decryptedContent.inProgress && !decryptedContent.content && this.mail.content))) {
                 this.isDecrypting[this.mail.id] = true;
                 this.pgpService.decrypt(this.mail.mailbox, this.mail.id, this.mail.content, this.mail.incoming_headers);
@@ -129,24 +129,20 @@ export class MailDetailComponent implements OnInit, OnDestroy {
         this.mailboxes = mailBoxesState.mailboxes;
       });
 
-    this.route.params.subscribe(params => {
-      const id = +params['id'];
+    this.route.params.pipe(takeUntil(this.destroyed$))
+      .subscribe(params => {
+        const id = +params['id'];
 
-      // Check if email is already available in state
-      if (!this.mail || this.mail.has_children) {
+        this.mailFolder = params['folder'] as MailFolderType;
+        this.page = +params['page'];
         this.getMailDetail(id);
-      }
-
-      this.mailFolder = params['folder'] as MailFolderType;
-      this.page = +params['page'];
-
-      this.store.select(state => state.user).pipe(takeUntil(this.destroyed$))
-        .subscribe((user: UserState) => {
-          this.customFolders = user.customFolders;
-          this.userState = user;
-        });
+      });
 
-    });
+    this.store.select(state => state.user).pipe(takeUntil(this.destroyed$))
+      .subscribe((user: UserState) => {
+        this.customFolders = user.customFolders;
+        this.userState = user;
+      });
   }
 
   handleEmailLinks() {
@@ -213,7 +209,7 @@ export class MailDetailComponent implements OnInit, OnDestroy {
   }
 
   getMailDetail(messageId: number) {
-    this.store.dispatch(new GetMailDetail(messageId));
+    this.store.dispatch(new GetMailDetail({ messageId, folder: this.mailFolder }));
   }
 
   // getAttachementFileName(filepath: string) {
@@ -339,7 +335,7 @@ export class MailDetailComponent implements OnInit, OnDestroy {
       }));
     }
     if (mail.id === this.mail.id) {
-      this.router.navigateByUrl(`/mail/${this.mailFolder}`);
+      this.router.navigateByUrl(`/mail/${this.mailFolder}/page/${this.page}`);
     }
   }
 
@@ -355,6 +351,19 @@ export class MailDetailComponent implements OnInit, OnDestroy {
     }
   }
 
+  markNotSpam(mail: Mail) {
+    this.store.dispatch(new MoveMail({
+      ids: mail.id,
+      folder: MailFolderType.INBOX,
+      sourceFolder: mail.folder,
+      mail: mail
+    }));
+    setTimeout(() => {
+      this.store.dispatch(new WhiteListAdd({ name: mail.sender, email: mail.sender }));
+    }, 2000);
+    this.router.navigateByUrl(`/mail/${this.mailFolder}/page/${this.page}`);
+  }
+
   ontoggleStarred(mail: Mail) {
     if (mail.starred) {
       this.store.dispatch(
@@ -370,6 +379,7 @@ export class MailDetailComponent implements OnInit, OnDestroy {
 
   moveToFolder(folder: MailFolderType) {
     this.store.dispatch(new MoveMail({ ids: this.mail.id, folder }));
+    this.router.navigateByUrl(`/mail/${this.mailFolder}/page/${this.page}`);
   }
 
   goBack() {

src/app/mail/mail-list/mail-folder/generic-folder/generic-folder.component.html

@@ -27,7 +27,7 @@
           </div>
         </li>
         <li class="px-0">
-          <a (click)="refresh(true)" ngbTooltip="Refresh" placement="top" class="border-right-0 border-radius-0">
+          <a (click)="refresh(true, true)" ngbTooltip="Refresh" placement="top" class="border-right-0 border-radius-0">
             <i class="material-icons">refresh</i>
           </a>
         </li>
@@ -216,7 +216,10 @@
               <ng-container *ngSwitchDefault>
                 <span [ngbTooltip]="mail.sender_display.email">{{mail.sender_display.name}}</span>
               </ng-container>
-              <span *ngIf="mail?.children_count > 0" class="email-child-count">({{mail.children_count+1}})</span>
+              <ng-container *ngIf="mailFolder !== mailFolderTypes.TRASH || (mailFolder === mailFolderTypes.TRASH && mail.folder === mailFolderTypes.TRASH)">
+
+              </ng-container>
+              <span *ngIf="mail?.thread_count > 1" class="email-child-count">({{mail.thread_count}})</span>
             </ng-container>
           </a>
         </td>