feat(mail): Improve mail search (advanced search)

UI/WebServerResources/js/Mailer/Mailbox.service.js

@@ -45,6 +45,7 @@
       $refreshTimeout: null,
       $virtualMode: false,
       $virtualPath: false,
+      $searchMode: false,
       PRELOAD: PRELOAD,
       BATCH_DELETE_LIMIT: BATCH_DELETE_LIMIT
     });
@@ -169,6 +170,9 @@
       this.$visibleMessages = this.$messages;
       this.$selectedMessages = [];
     }
+    if (angular.isUndefined(this.$highlightWords)) {
+      this.$highlightWords = [];
+    }
     angular.extend(this, data);
     if (this.path) {
       this.id = this.$id();
@@ -242,6 +246,16 @@
       Mailbox.selectedFolder = this;
   };
 
+  /**
+   * @function setSearchMode
+   * @memberof Mailbox.prototype
+   * @desc Set search mode for controller
+   * @param {array} searchMode - a boolean
+   */
+  Mailbox.prototype.setSearchMode = function (searchMode) {
+    Mailbox.$searchMode = searchMode;
+  };
+
   /**
    * @function getLength
    * @memberof Mailbox.prototype
@@ -385,6 +399,27 @@
       // Sorting preferences are common to all mailboxes
       angular.extend(Mailbox.$query, sortingAttributes);
 
+    if (filters && filters.length > 0) {
+      // Remove highlight words
+      this.$highlightWords = [];
+      filters.forEach(filter => {
+        if ("subject_or_from" == filter.searchBy
+          || "contains" == filter.searchBy
+          || "body" == filter.searchBy
+          || "from" == filter.searchBy
+          || "to" == filter.searchBy
+          || "subject" == filter.searchBy) {
+          var words = filter.searchInput.split(" ");
+          words.forEach(word => {
+            var cleanedWord = word.trim().toLowerCase();
+            if (!this.$highlightWords.includes(cleanedWord)) {
+              this.$highlightWords.push(cleanedWord);
+            }
+          });
+        }
+      });
+    }
+
     angular.extend(options, { sortingAttributes: Mailbox.$query });
     if (angular.isDefined(filters)) {
       options.filters = _.reject(angular.copy(filters), function(filter) {
@@ -1249,4 +1284,23 @@
     Mailbox.$$resource.post(this.id, action);
   };
 
+  /**
+   * @function setHighlightWords
+   * @memberof Mailbox.prototype
+   * @desc Set highlight words when searching
+   * @param {array} highlightWords - a list of words
+   */
+  Mailbox.prototype.setHighlightWords = function (highlightWords) {
+    this.$highlightWords = highlightWords;
+  };
+
+  /**
+   * @function getHighlightWords
+   * @memberof Mailbox.prototype
+   * @desc Get highlight words when searching
+   * @returns a list of words
+   */
+  Mailbox.prototype.getHighlightWords = function () {
+    return this.$highlightWords;
+  };
 })();

UI/WebServerResources/js/Mailer/MailboxController.js

@@ -50,10 +50,10 @@
         _.forEach(hotkeys, function(key) {
           sgHotkeys.deregisterHotkey(key);
         });
-        if (vm.mode.search) {
-          vm.mode.search = false;
-          vm.selectedFolder.$reset({ filter: true });
-        }
+        // if (vm.mode.search) {
+        //   vm.mode.search = false;
+        //   vm.selectedFolder.$reset({ filter: true });
+        // }
       });
 
       // Update window's title with unseen messages count of selected mailbox
@@ -175,6 +175,12 @@
     };
 
     this.cancelSearch = function() {
+      // Clean highlights
+      if (vm.account) {
+        vm.account.$getMailboxes().$$state.value.forEach((mailbox) => {
+          mailbox.setHighlightWords([]);
+        });
+      }
       vm.mode.search = false;
       vm.selectedFolder.$filter(vm.service.$query).then(function() {
         if (vm.selectedFolder.$selectedMessage) {

UI/WebServerResources/js/Mailer/MailboxesController.js

@@ -2,35 +2,36 @@
 
 (function() {
   'use strict';
-
+  
   /**
    * @ngInject
    */
-  MailboxesController.$inject = ['$scope', '$state', '$transitions', '$timeout', '$window', '$mdUtil', '$mdMedia', '$mdSidenav', '$mdDialog', '$mdToast', 'sgConstant', 'sgFocus', 'encodeUriFilter', 'Dialog', 'sgSettings', 'sgHotkeys', 'Account', 'Mailbox', 'VirtualMailbox', 'User', 'Preferences', 'stateAccounts'];
-  function MailboxesController($scope, $state, $transitions, $timeout, $window, $mdUtil, $mdMedia, $mdSidenav, $mdDialog, $mdToast, sgConstant, focus, encodeUriFilter, Dialog, Settings, sgHotkeys, Account, Mailbox, VirtualMailbox, User, Preferences, stateAccounts) {
+  MailboxesController.$inject = ['$scope', '$rootScope', '$state', '$transitions', '$timeout', '$window', '$mdUtil', '$mdMedia', '$mdSidenav', '$mdDialog', '$mdToast', 'sgConstant', 'sgFocus', 'encodeUriFilter', 'Dialog', 'sgSettings', 'sgHotkeys', 'Account', 'Mailbox', 'VirtualMailbox', 'User', 'Preferences', 'stateAccounts', 'Message'];
+  function MailboxesController($scope, $rootScope, $state, $transitions, $timeout, $window, $mdUtil, $mdMedia, $mdSidenav, $mdDialog, $mdToast, sgConstant, focus, encodeUriFilter, Dialog, Settings, sgHotkeys, Account, Mailbox, VirtualMailbox, User, Preferences, stateAccounts, Message) {
     var vm = this,
         account,
         mailbox,
         hotkeys = [];
 
+    $scope.closeDialog = function () {
+      $mdDialog.hide();
+    };
+
     this.$onInit = function () {
       this.service = Mailbox;
       this.accounts = stateAccounts;
+      this.message = Message;
+      this.advancedSearchPanelVisible = false;
 
       // Advanced search options
-      this.currentSearchParam = '';
+      this.reset();
+
       this.search = {
-        options: {'': '',  // no placeholder when no criteria is active
-                  subject: l('Enter Subject'),
-                  from:    l('Enter From'),
-                  to:      l('Enter To'),
-                  cc:      l('Enter Cc'),
-                  body:    l('Enter Body')
-                 },
         subfolders: 1,
         match: 'AND',
         params: []
       };
+      this.highlightWords = [];
 
       this.showSubscribedOnly = Preferences.defaults.SOGoMailShowSubscribedFoldersOnly;
 
@@ -44,6 +45,16 @@
           sgHotkeys.deregisterHotkey(key);
         });
       });
+
+      $rootScope.$on('showMailAdvancedSearchPanel', function () {
+        vm.showAdvancedSearch();
+      });
+
+      $rootScope.$on('resetMailAdvancedSearchPanel', function () {
+        vm.service.$virtualPath = false;
+        vm.service.$virtualMode = false;
+        vm.reset();
+      });
     };
 
 
@@ -61,6 +72,13 @@
               Mailbox.selectedFolderController.confirmDelete(Mailbox.selectedFolder);
           }
         }));
+        keys.push(sgHotkeys.createHotkey({
+          key: 'shift+s',
+          description: l('Advanced search'),
+          callback: function () {
+           vm.showAdvancedSearch();
+          }
+        }));
       });
 
       // Register the hotkeys
@@ -68,14 +86,168 @@
         sgHotkeys.registerHotkey(key);
       });
     }
-
-    this.hideAdvancedSearch = function() {
+    this.hideAdvancedSearch = function(e) {
       vm.service.$virtualPath = false;
       vm.service.$virtualMode = false;
 
       account = vm.accounts[0];
       mailbox = vm.searchPreviousMailbox;
-      $state.go('mail.account.mailbox', { accountId: account.id, mailboxId: encodeUriFilter(mailbox.path) });
+      vm.search.params = [];
+      vm.highlightWords = [];
+      if (mailbox && mailbox.path) {
+        // Reset
+        mailbox.setHighlightWords([]);
+        mailbox.$filter({
+          "sort": "date",
+          "asc": false,
+          "match": "OR"
+        }).then(function () {
+          $state.go('mail.account.mailbox', { accountId: account.id, mailboxId: encodeUriFilter(mailbox.path) });
+          vm.$onInit(); // Reinit search fields
+        });
+      }
+      e.stopPropagation();
+    };
+
+    this.addHighlightWords = function(sentence) {
+      var words = sentence.split(" ");
+
+      words.forEach(word => {
+        var cleanedWord = word.trim().toLowerCase();
+        if (!this.highlightWords.includes(cleanedWord)) {
+          this.highlightWords.push(cleanedWord);
+        }
+      });
+    };
+
+    this.reset = function() {
+      this.highlightWords = [];
+      this.searchForm = {
+        from: '',
+        to: '',
+        contains: '',
+        notContains: '',
+        subject: '',
+        body: '',
+        date: 'anytime',
+        dateStart: new Date(),
+        dateEnd: new Date(),
+        bcc: '',
+        size: '',
+        sizeOperator: '>',
+        sizeUnit: 'mb',
+        attachements: 0,
+        favorite: 0,
+        unseen: 0,
+        tags: { searchText: '', selected: '' },
+        flags: [],
+      };
+    }
+
+    this.addSearchParameters = function() {
+      this.search.params = [];
+      this.highlightWords = [];
+      // From
+      if (this.searchForm.from && this.searchForm.from.length > 0) {
+        this.search.params.push(this.newSearchParam('from', this.searchForm.from));
+        this.addHighlightWords(this.searchForm.from);
+      }
+      // To
+      if (this.searchForm.to && this.searchForm.to.length > 0) {
+        this.search.params.push(this.newSearchParam('to', this.searchForm.to));
+      }
+      // Bcc
+      if (this.searchForm.bcc && this.searchForm.bcc.length > 0) {
+        this.search.params.push(this.newSearchParam('bcc', this.searchForm.bcc));
+      }
+      // Contains
+      if (this.searchForm.contains && this.searchForm.contains.length > 0) {
+        this.search.params.push(this.newSearchParam('contains', this.searchForm.contains));
+        this.addHighlightWords(this.searchForm.contains);
+      }
+      // Does not contains
+      if (this.searchForm.doesnotcontains && this.searchForm.doesnotcontains.length > 0) {
+        this.search.params.push(this.newSearchParam('not_contains', this.searchForm.doesnotcontains));
+      }
+      // Subject
+      if (this.searchForm.subject && this.searchForm.subject.length > 0) {
+        this.search.params.push(this.newSearchParam('subject', this.searchForm.subject));
+        this.addHighlightWords(this.searchForm.subject);
+      }
+      // Body
+      if (this.searchForm.body && this.searchForm.body.length > 0) {
+        this.search.params.push(this.newSearchParam('body', this.searchForm.body));
+        this.addHighlightWords(this.searchForm.body);
+      }
+      // Date
+      if (this.searchForm.date && this.searchForm.date.length > 0) {
+        var date = null;
+        var dateTo = null;
+        var today = new Date();
+        var tmp = new Date(today);
+        switch (this.searchForm.date) {
+          case 'anytime':
+            break;
+          case 'last7days':
+            tmp.setDate(tmp.getDate() - 7);
+            date = this.formatDate(tmp);
+            this.search.params.push(this.newSearchParam('date', date, '>='));
+            break;
+          case 'last30days':
+            tmp.setDate(tmp.getDate() - 30);
+            date = this.formatDate(tmp);
+            this.search.params.push(this.newSearchParam('date', date, '>='));
+            break;
+          case 'last6month':
+            tmp.setMonth(tmp.getMonth() - 6);
+            date = this.formatDate(tmp);
+            this.search.params.push(this.newSearchParam('date', date, '>='));
+            break;
+          case 'before':
+            date = this.formatDate(this.searchForm.dateStart);
+            this.search.params.push(this.newSearchParam('date', date, '<'));
+            break;
+          case 'after':
+            date = this.formatDate(this.searchForm.dateStart);
+            this.search.params.push(this.newSearchParam('date', date, '>='));
+            break;
+          case 'between':
+            date = this.formatDate(this.searchForm.dateStart);
+            dateTo = this.formatDate(this.searchForm.dateEnd);
+            this.search.params.push(this.newSearchDateBetweenParam(date, dateTo));
+            break;
+        }
+      }
+      // Size
+      if (this.searchForm.size && this.searchForm.size > 0) {
+        this.search.params.push(this.newSearchParam('size', this.searchForm.size.toString(), this.searchForm.sizeOperator));
+      }
+      // Attachment
+      if (this.searchForm.attachements) {
+        this.search.params.push(this.newSearchParam('attachment', '1', '='));
+      }
+      // Favorite
+      if (this.searchForm.favorite) {
+        this.search.params.push(this.newSearchParam('favorite', '1', '='));
+      }
+      // Unseen
+      if (this.searchForm.unseen) {
+        this.search.params.push(this.newSearchParam('unseen', '1', '='));
+      }
+      // Flags
+      if (this.searchForm.flags && this.searchForm.flags.length > 0) {
+        this.search.params.push(this.newSearchFlagsParam());
+      }
+
+      this.toggleAdvancedSearch();
+    }
+
+    this.searchFieldChange = function (event) {
+      if (13 == event.keyCode) {
+        this.addSearchParameters();
+        $mdDialog.hide();
+        vm.advancedSearchPanelVisible = false;
+      } 
     };
 
     this.toggleAdvancedSearch = function() {
@@ -109,6 +281,7 @@
 
         if (Mailbox.$virtualPath.length) {
           root = vm.accounts[0].$getMailboxByPath(Mailbox.$virtualPath);
+          root.setHighlightWords(vm.highlightWords);
           mailboxes.push(root);
           if (vm.search.subfolders && root.children.length)
             _visit(root.children);
@@ -119,6 +292,9 @@
           });
         }
 
+        mailboxes.forEach((mailbox) => {
+          mailbox
+        });
         vm.virtualMailbox.setMailboxes(mailboxes);
         vm.virtualMailbox.startSearch(vm.search.match, vm.search.params);
         if ($state.$current.name != 'mail.account.virtualMailbox')
@@ -126,24 +302,49 @@
       }
     };
 
-    this.addSearchParam = function(v) {
-      this.currentSearchParam = v;
-      focus('advancedSearch');
-      return false;
+  
+    this.formatDate = function(date) {
+      var year = date.getFullYear();
+      var month = (date.getMonth() + 1).toString().padStart(2, '0');
+      var day = date.getDate().toString().padStart(2, '0');
+      return year + '-' + month + '-' + day;
     };
 
-    this.newSearchParam = function(pattern) {
-      if (pattern.length && this.currentSearchParam.length) {
-        var n = 0, searchParam = this.currentSearchParam;
+    this.changeDate = function() {
+      if ('between' == this.searchForm.date) {
+        if (this.searchForm.dateStart > this.searchForm.dateEnd) {
+          this.searchForm.dateEnd = this.searchForm.dateStart;
+        }
+      }
+    };
+
+    this.newSearchParam = function (searchParam, pattern, operator = '>') {
+      if (pattern.length && searchParam.length) {
+        var n = 0;
         if (pattern.startsWith("!")) {
           n = 1;
           pattern = pattern.substring(1).trim();
         }
-        this.currentSearchParam = '';
-        return { searchBy: searchParam, searchInput: pattern, negative: n };
+
+        switch (searchParam) {
+          case 'size':
+            return { searchBy: searchParam, searchInput: pattern, negative: n, operator: operator, sizeUnit: this.searchForm.sizeUnit };
+          case 'date':
+            return { searchBy: searchParam, searchInput: pattern, negative: n, operator: operator };
+          default:
+            return { searchBy: searchParam, searchInput: pattern, negative: n };
+        }
       }
     };
 
+    this.newSearchDateBetweenParam = function (dateFrom, dateTo) {
+      return { searchBy: 'date_between', searchInput: "*", dateFrom: dateFrom, dateTo: dateTo, negative: 0 };
+    };
+
+    this.newSearchFlagsParam = function () {
+      return { searchBy: 'flags', searchInput: "*", flags: vm.searchForm.flags, negative: 0 };
+    };
+
     this.toggleAccountState = function (account) {
       account.$expanded = !account.$expanded;
       if (!this.debounceSaveState) {
@@ -192,12 +393,46 @@
         }
       }
     };
-
+    
     this.showAdvancedSearch = function() {
-      Mailbox.$virtualPath = '';
-      // Close sidenav on small devices
-      if (!$mdMedia(sgConstant['gt-md']))
-        $mdSidenav('left').close();
+      if (!vm.advancedSearchPanelVisible) {
+        vm.advancedSearchPanelVisible = true;
+        if (Mailbox.selectedFolder.path)
+          Mailbox.$virtualPath = Mailbox.selectedFolder.path;
+
+        // Close sidenav on small devices
+        if (!$mdMedia(sgConstant['gt-md']))
+          $mdSidenav('left').close();
+
+        $mdDialog.show({
+          template: document.getElementById('advancedSearch').innerHTML,
+          parent: angular.element(document.body),
+          controller: function () {
+            var dialogCtrl = this;
+
+            this.$onInit = function () {
+              // Pass main controller
+              this.mainController = vm;
+              this.mailbox = Mailbox;
+              this.message = Message;
+            };
+
+            dialogCtrl.closeDialog = function () {
+              $mdDialog.hide();
+              vm.advancedSearchPanelVisible = false;
+            };
+
+            dialogCtrl.search = function () {
+              this.mainController.addSearchParameters();
+              $mdDialog.hide();
+              vm.advancedSearchPanelVisible = false;
+            };
+          },
+          controllerAs: 'dialogCtrl',
+          clickOutsideToClose: false,
+          escapeToClose: false,
+        });
+      }
     };
 
     this.newFolder = function(parentFolder) {
@@ -309,5 +544,7 @@
   angular
     .module('SOGo.MailerUI')
     .controller('MailboxesController', MailboxesController);
+
+  
 })();
 

UI/WebServerResources/js/Mailer/Mailer.app.js

@@ -357,9 +357,11 @@
         // Don't report any state error
       });
     $transitions.onError({ to: 'mail.**' }, function(transition) {
-      if (transition.to().name != 'mail' &&
+      if ((transition.to().name != 'mail' &&
           !transition.ignored() &&
-          transition.error().message.indexOf('superseded') < 0) {
+          transition.error().message.indexOf('superseded') < 0)
+          || transition.to().name === "mail.account.virtualMailbox"
+          || transition.to().name === "mail.account.virtualMailbox.message") {
         $log.error('transition error to ' + transition.to().name + ': ' + transition.error().detail);
         // Unselect everything
         Mailbox.selectedFolder = false;

UI/WebServerResources/js/Mailer/Message.service.js

@@ -473,6 +473,8 @@
         }
       };
 
+    
+
     if (this.$parts)
       // Use the cache
       return this.$parts;
@@ -480,12 +482,80 @@
     else if (this.parts)
       _visit(this.parts);
 
+
+    // Highlight words
+    if (parts && this.$mailbox && this.$mailbox.getHighlightWords().length > 0) {
+      var i = 0, j = 0;
+      for (i = 0; i < parts.length; i++) {
+        if (parts[i]
+          && parts[i].type
+          && ("UIxMailPartHTMLViewer" == parts[i].type
+          || "UIxMailPartTextViewer" == parts[i].type)) {
+          // Content
+          parts[i].content = this.highlightSearchTerms(parts[i].content);
+          // Title
+          this.subject = this.getHighlightSubject();
+          // From
+          this.from = this.getHighlightFrom();
+        }
+      }
+    }
+
     // Cache result
     this.$parts = parts;
 
     return parts;
   };
 
+  /**
+   * @function highlightSearchTerms
+   * @memberof Message.prototype
+   * @desc Returns the data with highlight search
+   * @returns the data with highlighted search terms
+   */
+  Message.prototype.highlightSearchTerms = function (data) {
+    var i = 0;
+    if (this.$mailbox.getHighlightWords() 
+        && this.$mailbox.getHighlightWords().length > 0 
+        && data 
+        && -1 === data.indexOf("data-markjs")) {
+      var dom = document.createElement("DIV");
+      dom.innerHTML = data;
+      var markInstance = new Mark(dom);
+      markInstance.mark(this.$mailbox.getHighlightWords());
+      data = dom.innerHTML;
+      dom.remove();
+    }
+
+    return data;
+  };
+
+  /**
+   * @function getHighlightSubject
+   * @memberof Message.prototype
+   * @desc Returns the subject with highlight search
+   * @returns the subject with highlighted search terms
+   */
+  Message.prototype.getHighlightSubject = function () {   
+    return this.highlightSearchTerms(this.subject);
+  };
+
+  /**
+   * @function getHighlightFrom
+   * @memberof Message.prototype
+   * @desc Returns the from with highlight search
+   * @returns the from with highlighted search terms
+   */
+  Message.prototype.getHighlightFrom = function () {
+    var i = 0;
+    for (i = 0; i < this.from.length; i++) {
+      this.from[i].full = this.highlightSearchTerms(this.from[i].full);
+      this.from[i].name = this.highlightSearchTerms(this.from[i].name);
+    }
+
+    return this.from;
+  };
+
   /**
    * @function $editableContent
    * @memberof Message.prototype

UI/WebServerResources/js/Mailer/sgMailboxListItem.directive.js

@@ -53,8 +53,8 @@
   /**
    * @ngInject
    */
-  sgMailboxListItemController.$inject = ['$scope', '$element', '$state', '$timeout', '$mdToast', '$mdPanel', '$mdMedia', '$mdSidenav', 'sgConstant', 'Dialog', 'Mailbox', 'encodeUriFilter'];
-  function sgMailboxListItemController($scope, $element, $state, $timeout, $mdToast, $mdPanel, $mdMedia, $mdSidenav, sgConstant, Dialog, Mailbox, encodeUriFilter) {
+  sgMailboxListItemController.$inject = ['$scope', '$rootScope', '$element', '$state', '$timeout', '$mdToast', '$mdPanel', '$mdMedia', '$mdSidenav', 'sgConstant', 'Dialog', 'Mailbox', 'encodeUriFilter'];
+  function sgMailboxListItemController($scope, $rootScope, $element, $state, $timeout, $mdToast, $mdPanel, $mdMedia, $mdSidenav, sgConstant, Dialog, Mailbox, encodeUriFilter) {
     var $ctrl = this;
 
 
@@ -84,10 +84,12 @@
 
 
     this.selectFolder = function($event) {
+      $rootScope.$broadcast('resetMailAdvancedSearchPanel'); // Reset advanced search panel (broadcast event to MailboxesController)
       if (this.editMode || this.mailbox == Mailbox.selectedFolder || this.mailbox.isNoSelect())
         return;
-      Mailbox.$virtualPath = false;
-      if (Mailbox.$virtualMode) {
+      
+      this.mailbox.setHighlightWords([]);
+      if (Mailbox.selectedFolder) {
         Mailbox.$virtualMode = false;
         Mailbox.selectedFolder.$reset({ filter: true });
       }
@@ -283,6 +285,8 @@
           // Close sidenav on small devices
           if (!$mdMedia(sgConstant['gt-md']))
             $mdSidenav('left').close();
+
+          $rootScope.$broadcast('showMailAdvancedSearchPanel'); // Show advanced search panel (broadcast event to MailboxesController)
         };
 
         this.share = function() {

UI/WebServerResources/js/Mailer/sgMessageListItemMain.directive.js

@@ -141,11 +141,8 @@
           if ($ctrl.mailboxNameElement)
             $ctrl.mailboxNameElement.innerHTML = $ctrl.message.$mailbox.$displayName;
 
-          // Sender or recipient when in Sent or Draft mailbox
-          if ($ctrl.MailboxService.selectedFolder.isSentFolder || $ctrl.MailboxService.selectedFolder.isDraftsFolder)
-            $ctrl.senderElement.innerHTML = $ctrl.message.$shortAddress('to', Preferences.defaults.SOGoMailDisplayFullEmail).encodeEntities();
-          else
-            $ctrl.senderElement.innerHTML = $ctrl.message.$shortAddress('from', Preferences.defaults.SOGoMailDisplayFullEmail).encodeEntities();
+          // Subject and sender or recipient when in Sent or Draft mailbox
+          $ctrl.defineSubjectAndSenderElements();
 
           // Priority icon
           if ($ctrl.message.priority && $ctrl.message.priority.level < 3) {
@@ -169,9 +166,6 @@
             $ctrl.threadButton.classList.add('ng-hide');
           }
 
-          // Subject
-          $ctrl.subjectElement.innerHTML = $ctrl.message.subject.encodeEntities();
-
           // Message size
           $ctrl.sizeElement.innerHTML = $ctrl.message.size;
 
@@ -196,6 +190,23 @@
       this.MailboxService = Mailbox;
     };
 
+    this.defineSubjectAndSenderElements = function() {
+      if ($ctrl && $ctrl.message) {
+        // Subject
+        $ctrl.subjectElement.innerHTML = $ctrl.message.getHighlightSubject();
+
+        // Sender or recipient when in Sent or Draft mailbox
+        if ($ctrl.MailboxService.selectedFolder.isSentFolder || $ctrl.MailboxService.selectedFolder.isDraftsFolder)
+          $ctrl.senderElement.innerHTML = $ctrl.message.highlightSearchTerms($ctrl.message.$shortAddress('to', Preferences.defaults.SOGoMailDisplayFullEmail).encodeEntities());
+        else
+          $ctrl.senderElement.innerHTML = $ctrl.message.highlightSearchTerms($ctrl.message.$shortAddress('from', Preferences.defaults.SOGoMailDisplayFullEmail).encodeEntities());
+      }
+    };
+
+    this.$doCheck = function () {
+      $ctrl.defineSubjectAndSenderElements();
+    };
+
     this.toggleThread = function() {
       if (this.message.collapsed)
         this.threadIconElement.classList.add('md-rotate-180-ccw');