feat(mail): Add punycode (RFC 3492) to encode domain with special characters

UI/Templates/MailerUI/UIxMailMainFrame.wox

@@ -8,7 +8,7 @@
     xmlns:label="OGo:label"
     className="UIxPageFrame"
     title="moduleName"
-    const:jsFiles="vendor/ckeditor/ckeditor.js, Common/sgCkeditor.component.js, Common.js, Preferences.services.js, Contacts.services.js, Scheduler.services.js, Mailer.js, Mailer.services.js, vendor/angular-file-upload.min.js, vendor/FileSaver.min.js">
+    const:jsFiles="vendor/ckeditor/ckeditor.js, Common/sgCkeditor.component.js, Common.js, Preferences.services.js, Contacts.services.js, Scheduler.services.js, Mailer.js, Mailer.services.js, vendor/angular-file-upload.min.js, vendor/FileSaver.min.js, vendor/punycode.js">
   <script type="text/javascript">
     var mailAccounts = <var:string value="mailAccounts" const:escapeHTML="NO" />;
     var userNames = <var:string value="userNames" const:escapeHTML="NO" />;

UI/Templates/MailerUI/UIxMailPopupView.wox

@@ -9,7 +9,7 @@
     className="UIxPageFrame"
     title="title"
     const:popup="YES"
-    const:jsFiles="Common.js, Preferences.services.js, Contacts.services.js, Scheduler.services.js, Mailer.app.popup.js, Mailer.services.js, vendor/ckeditor/ckeditor.js, Common/sgCkeditor.component.js, vendor/angular-file-upload.min.js, vendor/FileSaver.min.js">
+    const:jsFiles="Common.js, Preferences.services.js, Contacts.services.js, Scheduler.services.js, Mailer.app.popup.js, Mailer.services.js, vendor/ckeditor/ckeditor.js, Common/sgCkeditor.component.js, vendor/angular-file-upload.min.js, vendor/FileSaver.min.js, vendor/punycode.js">
 
   <main class="layout-fill" ng-controller="navController">
     <div id="detailView" class="view-detail md-default-theme md-background md-bg md-hue-2"

UI/WebServerResources/Gruntfile.js

@@ -140,7 +140,8 @@ module.exports = function(grunt) {
       //'<%= src %>/ng-file-upload/ng-file-upload{,.min}.js{,map}',
       '<%= src %>/ng-sortable/dist/ng-sortable.min.js{,map}',
       '<%= src %>/lodash/lodash{,.min}.js',
-      '<%= src %>/qrcodejs/qrcode{,.min}.js'
+      '<%= src %>/qrcodejs/qrcode{,.min}.js',
+      '<%= src %>/punycode/punycode.js'
     ];
     for (var j = 0; j < js.length; j++) {
       var files = grunt.file.expand(grunt.template.process(js[j], {data: options}));
@@ -150,6 +151,13 @@ module.exports = function(grunt) {
         var dest = options.js_dest + paths[paths.length - 1];
         grunt.file.copy(src, dest);
         grunt.log.ok("copy " + src + " => " + dest);
+        // Patch for module.exports for puny code
+        if (dest.indexOf('punycode') > 0) {
+          var fs = require('fs');
+          var fileContent = fs.readFileSync(dest, { encoding: 'utf8', flag: 'r' });
+          fileContent = fileContent.replace("module.exports", "//module.exports");
+          fs.writeFileSync(dest, fileContent);
+        }
       }
     }
     /*

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

@@ -293,7 +293,7 @@
       }
     }
 
-    return address;
+    return punycode.toUnicode(address);
   };
 
   /**
@@ -341,8 +341,19 @@
    * @returns the HTML representation of the body
    */
   Message.prototype.$content = function() {
+    // Punycode
+    this.to.forEach(function (element, i, arr) {
+      if (element.email && element.email.indexOf('@') > 0)
+        arr[i].email = punycode.toUnicode(element.email);
+    });
+    if (this.from && this.from.indexOf('@') > 0)
+      this.from = punycode.toUnicode(this.from);
+
     var _this = this,
         parts = [],
+        
+      
+
         _visit = function(part) {
           part.msgclass = 'msg-attachment-other';
           if (part.type == 'UIxMailPartAlternativeViewer') {
@@ -873,6 +884,22 @@
     });
   };
 
+  /**
+   * @function $punycode
+   * @memberof Message.prototype
+   * @desc Encode an email address string
+   * @returns an RFC 3492  email encoded
+   */
+  Message.prototype.punycode = function(element) {
+    var re = /<(.*)>|^([\w\-\.@]+)$/gm;
+    var r = re.exec(element);
+    var puny = element;
+    if (r && r.length > 0 && r[1]) {
+      puny = r[1];
+    }
+    return element.replace(puny, punycode.toASCII(puny));
+  };
+
   /**
    * @function $send
    * @memberof Message.prototype
@@ -885,6 +912,18 @@
 
     Message.$log.debug('send = ' + JSON.stringify(data, undefined, 2));
 
+    // Punycode
+    data.to.forEach(function (element, i, arr) {
+      arr[i] = _this.punycode(element);
+    });
+    data.bcc.forEach(function (element, i, arr) {
+      arr[i] = _this.punycode(element);
+    });
+    data.cc.forEach(function (element, i, arr) {
+      arr[i] = _this.punycode(element);
+    });
+    data.from = _this.punycode(data.from);
+
     return Message.$$resource.post(this.$absolutePath({asDraft: true}), 'send', data).then(function(response) {
       if (response.status == 'success') {
         if (angular.isDefined(_this.origin)) {

UI/WebServerResources/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sogo-web",
   "homepage": "https://sogo.nu",
-  "bugs": "https://sogo.nu/bugs",
+  "bugs": "https://bugs.sogo.nu",
   "dependencies": {
     "angular": "^1.8.0",
     "angular-animate": "^1.8.0",
@@ -15,7 +15,8 @@
     "file-saver": "^2.0.5",
     "lodash": "^4.17.21",
     "ng-sortable": "1.3.7",
-    "qrcodejs": "^1.0.0"
+    "qrcodejs": "^1.0.0",
+    "punycode": "^2.3.0"
   },
   "devDependencies": {
     "autoprefixer": "^9.8.5",