]> git.immae.eu Git - github/wallabag/wallabag.git/commitdiff
Merge pull request #1565 from wallabag/v2-2fa-html
authorNicolas Lœuillet <nicolas@loeuillet.org>
Thu, 21 Jan 2016 11:27:47 +0000 (12:27 +0100)
committerNicolas Lœuillet <nicolas@loeuillet.org>
Thu, 21 Jan 2016 11:27:47 +0000 (12:27 +0100)
Use HTML email for 2FA

app/config/config_dev.yml
src/Wallabag/UserBundle/Mailer/AuthCodeMailer.php
src/Wallabag/UserBundle/Resources/config/services.yml
src/Wallabag/UserBundle/Resources/translations/wallabag_user.en.yml
src/Wallabag/UserBundle/Resources/translations/wallabag_user.fr.yml
src/Wallabag/UserBundle/Resources/views/TwoFactor/email_auth_code.html.twig [new file with mode: 0644]
src/Wallabag/UserBundle/Tests/Mailer/AuthCodeMailerTest.php

index 6b077fdbd2245f54885c118f8f28ceec4ad28cef..2813e369db685f2b132ed2279b7d243c5f168548 100644 (file)
@@ -42,6 +42,3 @@ swiftmailer:
     transport: smtp
     host: 'localhost'
     port: 1025
-    username: null
-    password: null
-
index be370e71d98677fbb0e48940b18f9bf3868c56b6..6b108dd3ef2a7605720b3cab8c451e45557c8f88 100644 (file)
@@ -4,7 +4,6 @@ namespace Wallabag\UserBundle\Mailer;
 
 use Scheb\TwoFactorBundle\Model\Email\TwoFactorInterface;
 use Scheb\TwoFactorBundle\Mailer\AuthCodeMailerInterface;
-use Symfony\Component\Translation\TranslatorInterface;
 
 /**
  * Custom mailer for TwoFactorBundle email.
@@ -20,11 +19,11 @@ class AuthCodeMailer implements AuthCodeMailerInterface
     private $mailer;
 
     /**
-     * Translator for email content.
+     * Twig to render the html's email.
      *
-     * @var TranslatorInterface
+     * @var \Twig_Environment
      */
-    private $translator;
+    private $twig;
 
     /**
      * Sender email address.
@@ -47,22 +46,31 @@ class AuthCodeMailer implements AuthCodeMailerInterface
      */
     private $supportUrl;
 
+    /**
+     * Url for the wallabag instance.
+     *
+     * @var string
+     */
+    private $wallabagUrl;
+
     /**
      * Initialize the auth code mailer with the SwiftMailer object.
      *
-     * @param \Swift_Mailer       $mailer
-     * @param TranslatorInterface $translator
-     * @param string              $senderEmail
-     * @param string              $senderName
-     * @param string              $supportUrl
+     * @param \Swift_Mailer     $mailer
+     * @param \Twig_Environment $twig
+     * @param string            $senderEmail
+     * @param string            $senderName
+     * @param string            $supportUrl
+     * @param string            $wallabagUrl
      */
-    public function __construct(\Swift_Mailer $mailer, TranslatorInterface $translator, $senderEmail, $senderName, $supportUrl)
+    public function __construct(\Swift_Mailer $mailer, \Twig_Environment $twig, $senderEmail, $senderName, $supportUrl, $wallabagUrl)
     {
         $this->mailer = $mailer;
-        $this->translator = $translator;
+        $this->twig = $twig;
         $this->senderEmail = $senderEmail;
         $this->senderName = $senderName;
         $this->supportUrl = $supportUrl;
+        $this->wallabagUrl = $wallabagUrl;
     }
 
     /**
@@ -72,20 +80,28 @@ class AuthCodeMailer implements AuthCodeMailerInterface
      */
     public function sendAuthCode(TwoFactorInterface $user)
     {
+        $template = $this->twig->loadTemplate('@WallabagUserBundle/Resources/views/TwoFactor/email_auth_code.html.twig');
+
+        $subject = $template->renderBlock('subject', array());
+        $bodyHtml = $template->renderBlock('body_html', [
+            'user' => $user->getName(),
+            'code' => $user->getEmailAuthCode(),
+            'support_url' => $this->supportUrl,
+            'wallabag_url' => $this->wallabagUrl,
+        ]);
+        $bodyText = $template->renderBlock('body_text', [
+            'user' => $user->getName(),
+            'code' => $user->getEmailAuthCode(),
+            'support_url' => $this->supportUrl,
+        ]);
+
         $message = new \Swift_Message();
         $message
             ->setTo($user->getEmail())
             ->setFrom($this->senderEmail, $this->senderName)
-            ->setSubject($this->translator->trans('auth_code.mailer.subject', array(), 'wallabag_user'))
-            ->setBody($this->translator->trans(
-                'auth_code.mailer.body',
-                [
-                    '%user%' => $user->getName(),
-                    '%code%' => $user->getEmailAuthCode(),
-                    '%support%' => $this->supportUrl,
-                ],
-                'wallabag_user'
-            ))
+            ->setSubject($subject)
+            ->setBody($bodyText, 'text/plain')
+            ->addPart($bodyHtml, 'text/html')
         ;
 
         $this->mailer->send($message);
index 9109b6a378ab0c2dee6970f159055a38fda8f494..93e04d59253e23c6cc50c675a55ba06839f275b8 100644 (file)
@@ -3,7 +3,8 @@ services:
         class: Wallabag\UserBundle\Mailer\AuthCodeMailer
         arguments:
             - "@mailer"
-            - "@translator"
+            - "@twig"
             - "%scheb_two_factor.email.sender_email%"
             - "%scheb_two_factor.email.sender_name%"
             - "%wallabag_support_url%"
+            - "%wallabag_url%"
index f806d1d6f7ecfcde406a019c6362fb43bf53958b..4da6075f414c4cb7f62145ade18e386ea970a088 100644 (file)
@@ -1,10 +1,7 @@
 # Two factor mail
 auth_code.mailer.subject: 'Wallabag authentication Code'
-auth_code.mailer.body: |
-    Hi %user%,
-
-    Since you enable two factor authentication on your wallabag account and you just logged in from a new device (computer, phone, etc.), we send you a code to validate your connection.
-    Here is the code: %code%
-
-    Please don't hesitate to contact us if you have any problems: %support%
-    The wallabag team
+auth_code.mailer.body.hello: "Hi %user%,"
+auth_code.mailer.body.first_para: "Since you enable two factor authentication on your wallabag account and you just logged in from a new device (computer, phone, etc.), we send you a code to validate your connection."
+auth_code.mailer.body.second_para: "Here is the code:"
+auth_code.mailer.body.support: "Please don't hesitate to contact us if you have any problems:"
+auth_code.mailer.body.signature: "The wallabag team"
index 386b2d9eb24757157c6f5cabf0a394bec2241466..b4448d3a4eeba9658f2b9a43c87b5b50110f22bd 100644 (file)
@@ -1,10 +1,7 @@
 # Two factor mail
 auth_code.mailer.subject: "Code d'authentification wallabag"
-auth_code.mailer.body: |
-    Bonjour %user%,
-
-    Comme vous avez activé la double authentification sur votre compte wallabag et que vous venez de vous connecter depuis un nouvel appareil (ordinateur, téléphone, etc.), nous vous envoyons un code pour valider votre connexion.
-    Voici le code à renseigner: %code%
-
-    Si vous avez un problème de connexion, n'hésitez pas à contacter le support: %support%
-    L'équipe wallabag
+auth_code.mailer.body.hello: "Bonjour %user%,"
+auth_code.mailer.body.first_para: "Comme vous avez activé la double authentification sur votre compte wallabag et que vous venez de vous connecter depuis un nouvel appareil (ordinateur, téléphone, etc.), nous vous envoyons un code pour valider votre connexion."
+auth_code.mailer.body.second_para: "Voici le code à renseigner :"
+auth_code.mailer.body.support: "Si vous avez un problème de connexion, n'hésitez pas à contacter le support :"
+auth_code.mailer.body.signature: "L'équipe wallabag"
diff --git a/src/Wallabag/UserBundle/Resources/views/TwoFactor/email_auth_code.html.twig b/src/Wallabag/UserBundle/Resources/views/TwoFactor/email_auth_code.html.twig
new file mode 100644 (file)
index 0000000..69d2316
--- /dev/null
@@ -0,0 +1,117 @@
+{% block subject %}
+{{ "auth_code.mailer.subject"|trans({}, 'wallabag_user') }}
+{% endblock %}
+
+{% block body_text %}
+{{ "auth_code.mailer.body.hello"|trans({'%user%': user}, 'wallabag_user') }}
+
+{{ "auth_code.mailer.body.first_para"|trans({}, 'wallabag_user') }}
+{{ "auth_code.mailer.body.second_para"|trans({}, 'wallabag_user') }} {{ code }}
+
+{{ "auth_code.mailer.body.support"|trans({}, 'wallabag_user') }} {{ support_url }}
+
+{{ "auth_code.mailer.body.signature"|trans({}, 'wallabag_user') }}
+{% endblock %}
+
+{% block body_html %}
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <title>{{ "auth_code.mailer.subject"|trans({}, 'wallabag_user') }}</title>
+    <style type="text/css">
+        #outlook a {padding:0;}
+        body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0; font-family: Helvetica, Arial, sans-serif; background: #c6d4e0;}
+        .ExternalClass {width:100%;}
+        .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;}
+        #backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important; background: #c6d4e0;}
+        img {outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;}
+        a img {border:none;}
+        .image_fix {display:block;}
+        p {margin: 1em 0;}
+        h1, h2, h3, h4, h5, h6 {color: black !important;}
+        h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: blue !important;}
+        h1 a:active, h2 a:active,  h3 a:active, h4 a:active, h5 a:active, h6 a:active {
+            color: red !important;
+        }
+        h1 a:visited, h2 a:visited,  h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited {
+            color: purple !important;
+        }
+        table td {border-collapse: collapse;}
+        table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
+        a {color: #373737;}
+
+        #card {
+            background: #ffffff;
+            border: 1px solid #c5c5c5;
+            width: 89%;
+            margin: 5%;
+        }
+        #cell_desc h1, h5 {
+            display: block;
+            margin: 0;
+        }
+        #cell_desc h1 {
+            line-height: 35px;
+            margin-bottom: 10px;
+        }
+        #bg {background: #f2f2f2}
+
+    </style>
+</head>
+<body>
+
+    <!-- hidden text for preview -->
+    <div style="display:none;font-size:1px;color:#333333;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;">
+        {{ "auth_code.mailer.body.hello"|trans({'%user%': user}, 'wallabag_user') }}
+    </div>
+
+    <table cellpadding="0" cellspacing="0" border="0" id="backgroundTable">
+        <tr>
+            <td>
+
+                <table cellpadding="0" cellspacing="0" border="0" align="center" id="card">
+                    <tr>
+                        <td style="padding: 20px;" width="96px" valign="top"><img class="image_fix" src="{{ wallabag_url }}/themes/material/img/logo-other_themes.png" alt="logo" title="{{ wallabag_url }}" style="width: 96px; height: 96px;" /></td>
+                        <td style="padding: 20px; padding-left: 0;" valign="top" id="cell_desc">
+                            <h1>wallabag</h1>
+                            <h5>{% trans %}on{% endtrans %} {{ wallabag_url }}</h5>
+                        </td>
+                    </tr>
+                    <tr><td colspan="2" style="padding: 0;"><div style="height: 0; border-top: 1px solid #c5c5c5;">&nbsp;</div></td></tr>
+                    <tr id="bg">
+                        <td style="padding: 20px;" colspan="2" valign="top">
+
+                            <p><b>{{ "auth_code.mailer.body.hello"|trans({'%user%': user}, 'wallabag_user') }}</b></p>
+
+                            <p>{{ "auth_code.mailer.body.first_para"|trans({}, 'wallabag_user') }}</p>
+                            <p>{{ "auth_code.mailer.body.second_para"|trans({}, 'wallabag_user') }} <b>{{ code }}</b></p>
+
+                            <p>{{ "auth_code.mailer.body.support"|trans({}, 'wallabag_user') }} <a href="{{ support_url }}">{{ support_url }}</a></p>
+                            <p>{{ "auth_code.mailer.body.signature"|trans({}, 'wallabag_user') }}</p>
+                        </td>
+                    </tr>
+                    <tr><td colspan="2" style="padding: 0;"><div style="height: 0; border-top: 1px solid #c5c5c5;">&nbsp;</div></td></tr>
+                    <tr>
+                        <td colspan="2">
+
+                            <table cellpadding="0" cellspacing="0" border="0" width="100%">
+                                <tr>
+                                    <td valign="top" style="padding: 20px; text-align: center"><a href="{{ wallabag_url }}">{{ wallabag_url }}</a></td>
+                                    <td valign="top" style="padding: 20px; text-align: center">Powered by <a href="https://www.wallabag.org/">wallabag</a></td>
+                                </tr>
+                            </table>
+
+                        </td>
+                    </tr>
+                </table>
+
+            </td>
+        </tr>
+    </table>
+
+</body>
+</html>
+{% endblock %}
index 61e960f9cdefe4b179b0635ea2b35974c4b22172..e3f43a7e76caf1573dc331cc5724dee3c3608535 100644 (file)
@@ -4,8 +4,6 @@ namespace Wallabag\UserBundle\Tests\Mailer;
 
 use Wallabag\UserBundle\Entity\User;
 use Wallabag\UserBundle\Mailer\AuthCodeMailer;
-use Symfony\Component\Translation\Translator;
-use Symfony\Component\Translation\Loader\ArrayLoader;
 
 /**
  * @see https://www.pmg.com/blog/integration-testing-swift-mailer/
@@ -27,7 +25,7 @@ class AuthCodeMailerTest extends \PHPUnit_Framework_TestCase
 {
     protected $mailer;
     protected $spool;
-    protected $translator;
+    protected $twig;
 
     protected function setUp()
     {
@@ -38,12 +36,13 @@ class AuthCodeMailerTest extends \PHPUnit_Framework_TestCase
         );
         $this->mailer = new \Swift_Mailer($transport);
 
-        $this->translator = new Translator('en');
-        $this->translator->addLoader('array', new ArrayLoader());
-        $this->translator->addResource('array', array(
-            'auth_code.mailer.subject' => 'auth_code subject',
-            'auth_code.mailer.body' => 'Hi %user%, here is the code: %code% and the support: %support%',
-        ), 'en', 'wallabag_user');
+        $twigTemplate = <<<TWIG
+{% block subject %}subject{% endblock %}
+{% block body_html %}html body {{ code }}{% endblock %}
+{% block body_text %}text body {{ support_url }}{% endblock %}
+TWIG;
+
+        $this->twig = new \Twig_Environment(new \Twig_Loader_Array(array('@WallabagUserBundle/Resources/views/TwoFactor/email_auth_code.html.twig' => $twigTemplate)));
     }
 
     public function testSendEmail()
@@ -56,9 +55,10 @@ class AuthCodeMailerTest extends \PHPUnit_Framework_TestCase
 
         $authCodeMailer = new AuthCodeMailer(
             $this->mailer,
-            $this->translator,
+            $this->twig,
             'nobody@test.io',
             'wallabag test',
+            'http://0.0.0.0/support',
             'http://0.0.0.0'
         );
 
@@ -69,7 +69,8 @@ class AuthCodeMailerTest extends \PHPUnit_Framework_TestCase
         $msg = $this->spool->getMessages()[0];
         $this->assertArrayHasKey('test@wallabag.io', $msg->getTo());
         $this->assertEquals(array('nobody@test.io' => 'wallabag test'), $msg->getFrom());
-        $this->assertEquals('auth_code subject', $msg->getSubject());
-        $this->assertContains('Hi Bob, here is the code: 666666 and the support: http://0.0.0.0', $msg->toString());
+        $this->assertEquals('subject', $msg->getSubject());
+        $this->assertContains('text body http://0.0.0.0/support', $msg->toString());
+        $this->assertContains('html body 666666', $msg->toString());
     }
 }