Skip to content

Commit 72fb6a9

Browse files
Seluj78Seluj78
authored
Merge pull request #89 from Seluj78/html_mails
2 parents 6339f1f + 85e202b commit 72fb6a9

File tree

7 files changed

+279
-28
lines changed

7 files changed

+279
-28
lines changed

‎.flake8‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
[flake8]
22
max-line-length = 120
33
exclude = venv/* frontend/*
4-
ignore = E402, W291
4+
ignore = E402, W291, W503

‎backend/PyMatcha/routes/api/auth.py‎

Lines changed: 11 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
from flask import Blueprint
2323
from flask import current_app
2424
from flask import redirect
25+
from flask import render_template
2526
from flask import request
2627
from flask_jwt_extended import create_access_token
2728
from flask_jwt_extended import create_refresh_token
@@ -45,7 +46,7 @@
4546
from PyMatcha.utils.errors import ConflictError
4647
from PyMatcha.utils.errors import NotFoundError
4748
from PyMatcha.utils.errors import UnauthorizedError
48-
from PyMatcha.utils.mail import send_mail_text
49+
from PyMatcha.utils.mail import send_mail_html
4950
from PyMatcha.utils.success import Success
5051
from PyMatcha.utils.success import SuccessOutput
5152
from PyMatcha.utils.success import SuccessOutputMessage
@@ -80,12 +81,9 @@ def api_create_user():
8081
raise e
8182
else:
8283
token = generate_confirmation_token(email=data["email"], token_type="confirm")
83-
send_mail_text.delay(
84-
dest=data["email"],
85-
subject="Confirm your email for PyMatcha",
86-
body=os.getenv("APP_URL") + "/auth/confirm/" + token,
87-
)
88-
current_app.logger.debug("New user {} successfully created".format(new_user.email))
84+
link = os.getenv("APP_URL") + "/auth/confirm/" + token
85+
rendered_html = render_template("confirm_email.html", link=link)
86+
send_mail_html.delay(dest=data["email"], subject="Confirm your email on PyMatcha", html=rendered_html)
8987
return SuccessOutputMessage("email", new_user.email, "New user successfully created.")
9088

9189

@@ -133,12 +131,10 @@ def forgot_password():
133131
pass
134132
else:
135133
token = generate_confirmation_token(email=data["email"], token_type="reset")
134+
link = os.getenv("APP_URL") + "/auth/password/forgot/" + token
135+
rendered_html = render_template("password_reset.html", link=link)
136136
current_app.logger.debug("/auth/password/forgot -> Sending worker request to send email")
137-
send_mail_text.delay(
138-
dest=data["email"],
139-
subject="Password reset for PyMatcha",
140-
body=os.getenv("APP_URL") + "/reset_password?token=" + token,
141-
)
137+
send_mail_html.delay(dest=data["email"], subject="Reset your password on PyMatcha", html=rendered_html)
142138
current_app.logger.debug(
143139
"/auth/password/forgot -> Password reset mail sent successfully for user {}".format(data["email"])
144140
)
@@ -255,10 +251,8 @@ def request_new_email_conf():
255251
else:
256252
current_app.logger.debug("/auth/confirm/new -> User found, sending new confirmation email")
257253
token = generate_confirmation_token(email=email, token_type="confirm")
258-
send_mail_text.delay(
259-
dest=data["email"],
260-
subject="Confirm your email for PyMatcha",
261-
body=os.getenv("APP_URL") + "/auth/confirm/" + token,
262-
)
254+
link = os.getenv("APP_URL") + "/auth/confirm/" + token
255+
rendered_html = render_template("confirm_email.html", link=link)
256+
send_mail_html.delay(dest=data["email"], subject="Confirm your email on PyMatcha", html=rendered_html)
263257
current_app.logger.debug("/auth/confirm/new -> New confirmation email sent if user exists in database")
264258
return Success("New confirmation email sent if user exists in database")

‎backend/PyMatcha/routes/api/profile.py‎

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121

2222
import Geohash
2323
from flask import Blueprint
24+
from flask import render_template
2425
from flask import request
2526
from flask_jwt_extended import current_user
2627
from flask_jwt_extended import jwt_required
@@ -35,11 +36,11 @@
3536
from PyMatcha.utils.errors import BadRequestError
3637
from PyMatcha.utils.errors import NotFoundError
3738
from PyMatcha.utils.errors import UnauthorizedError
39+
from PyMatcha.utils.mail import send_mail_html
3840
from PyMatcha.utils.mail import send_mail_text
3941
from PyMatcha.utils.success import Success
4042
from PyMatcha.utils.success import SuccessOutput
4143

42-
4344
profile_bp = Blueprint("profile", __name__)
4445

4546
REQUIRED_PARAMS_COMPLETE_PROFILE = {"gender": str, "birthdate": int, "orientation": str, "bio": str, "tags": list}
@@ -135,11 +136,9 @@ def edit_email():
135136
current_user.is_confirmed = False
136137
current_user.save()
137138
token = generate_confirmation_token(email=new_email, token_type="confirm")
138-
send_mail_text.delay(
139-
dest=data["email"],
140-
subject="Confirm your new email for PyMatcha",
141-
body=os.getenv("APP_URL") + "/auth/confirm/" + token,
142-
)
139+
link = os.getenv("APP_URL") + "/auth/confirm/" + token
140+
rendered_html = render_template("confirm_email.html", link=link)
141+
send_mail_html.delay(dest=data["email"], subject="Confirm your email on PyMatcha", html=rendered_html)
143142
return Success("Email sent for new email")
144143

145144

‎backend/PyMatcha/templates/confirm_email.html‎

Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2+
<html style="width:100%;font-family:arial, 'helvetica neue', helvetica, sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;padding:0;Margin:0;">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta content="width=device-width, initial-scale=1" name="viewport">
6+
<meta name="x-apple-disable-message-reformatting">
7+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
8+
<meta content="telephone=no" name="format-detection">
9+
<title>PyMatcha-confirm-email</title>
10+
<!--[if (mso 16)]>
11+
<style type="text/css">
12+
a {text-decoration: none;}
13+
</style>
14+
<![endif]-->
15+
<!--[if gte mso 9]><style>sup { font-size: 100% !important; }</style><![endif]-->
16+
<style type="text/css">
17+
@media only screen and (max-width:600px) {p, ul li, ol li, a { font-size:16px!important; line-height:150%!important } h1 { font-size:30px!important; text-align:center; line-height:120%!important } h2 { font-size:26px!important; text-align:center; line-height:120%!important } h3 { font-size:20px!important; text-align:center; line-height:120%!important } h1 a { font-size:30px!important } h2 a { font-size:26px!important } h3 a { font-size:20px!important } .es-menu td a { font-size:16px!important } .es-header-body p, .es-header-body ul li, .es-header-body ol li, .es-header-body a { font-size:16px!important } .es-footer-body p, .es-footer-body ul li, .es-footer-body ol li, .es-footer-body a { font-size:16px!important } .es-infoblock p, .es-infoblock ul li, .es-infoblock ol li, .es-infoblock a { font-size:12px!important } *[class="gmail-fix"] { display:none!important } .es-m-txt-c, .es-m-txt-c h1, .es-m-txt-c h2, .es-m-txt-c h3 { text-align:center!important } .es-m-txt-r, .es-m-txt-r h1, .es-m-txt-r h2, .es-m-txt-r h3 { text-align:right!important } .es-m-txt-l, .es-m-txt-l h1, .es-m-txt-l h2, .es-m-txt-l h3 { text-align:left!important } .es-m-txt-r img, .es-m-txt-c img, .es-m-txt-l img { display:inline!important } .es-button-border { display:block!important } a.es-button { font-size:20px!important; display:block!important; border-width:10px 0px 10px 0px!important } .es-btn-fw { border-width:10px 0px!important; text-align:center!important } .es-adaptive table, .es-btn-fw, .es-btn-fw-brdr, .es-left, .es-right { width:100%!important } .es-content table, .es-header table, .es-footer table, .es-content, .es-footer, .es-header { width:100%!important; max-width:600px!important } .es-adapt-td { display:block!important; width:100%!important } .adapt-img { width:100%!important; height:auto!important } .es-m-p0 { padding:0px!important } .es-m-p0r { padding-right:0px!important } .es-m-p0l { padding-left:0px!important } .es-m-p0t { padding-top:0px!important } .es-m-p0b { padding-bottom:0!important } .es-m-p20b { padding-bottom:20px!important } .es-mobile-hidden, .es-hidden { display:none!important } .es-desk-hidden { display:table-row!important; width:auto!important; overflow:visible!important; float:none!important; max-height:inherit!important; line-height:inherit!important } .es-desk-menu-hidden { display:table-cell!important } table.es-table-not-adapt, .esd-block-html table { width:auto!important } table.es-social { display:inline-block!important } table.es-social td { display:inline-block!important } }
18+
#outlook a {
19+
padding:0;
20+
}
21+
.ExternalClass {
22+
width:100%;
23+
}
24+
.ExternalClass,
25+
.ExternalClass p,
26+
.ExternalClass span,
27+
.ExternalClass font,
28+
.ExternalClass td,
29+
.ExternalClass div {
30+
line-height:100%;
31+
}
32+
.es-button {
33+
mso-style-priority:100!important;
34+
text-decoration:none!important;
35+
}
36+
a[x-apple-data-detectors] {
37+
color:inherit!important;
38+
text-decoration:none!important;
39+
font-size:inherit!important;
40+
font-family:inherit!important;
41+
font-weight:inherit!important;
42+
line-height:inherit!important;
43+
}
44+
.es-desk-hidden {
45+
display:none;
46+
float:left;
47+
overflow:hidden;
48+
width:0;
49+
max-height:0;
50+
line-height:0;
51+
mso-hide:all;
52+
}
53+
</style>
54+
</head>
55+
<body style="width:100%;font-family:arial, 'helvetica neue', helvetica, sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;padding:0;Margin:0;">
56+
<div class="es-wrapper-color" style="background-color:#F6F6F6;">
57+
<!--[if gte mso 9]>
58+
<v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
59+
<v:fill type="tile" color="#f6f6f6"></v:fill>
60+
</v:background>
61+
<![endif]-->
62+
<table class="es-wrapper" width="100%" cellspacing="0" cellpadding="0" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;padding:0;Margin:0;width:100%;height:100%;background-repeat:repeat;background-position:center top;">
63+
<tr style="border-collapse:collapse;">
64+
<td valign="top" style="padding:0;Margin:0;">
65+
<table class="es-content" cellspacing="0" cellpadding="0" align="center" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;">
66+
<tr style="border-collapse:collapse;">
67+
<td align="center" style="padding:0;Margin:0;">
68+
<table class="es-content-body" width="600" cellspacing="0" cellpadding="0" bgcolor="#ffffff" align="center" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:#FFFFFF;">
69+
<tr style="border-collapse:collapse;">
70+
<td align="left" style="Margin:0;padding-top:20px;padding-bottom:20px;padding-left:20px;padding-right:20px;">
71+
<table width="100%" cellspacing="0" cellpadding="0" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
72+
<tr style="border-collapse:collapse;">
73+
<td width="560" valign="top" align="center" style="padding:0;Margin:0;">
74+
<table width="100%" cellspacing="0" cellpadding="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
75+
<tr style="border-collapse:collapse;">
76+
<td align="left" style="padding:0;Margin:0;padding-bottom:15px;"><h2 style="Margin:0;line-height:29px;mso-line-height-rule:exactly;font-family:arial, 'helvetica neue', helvetica, sans-serif;font-size:24px;font-style:normal;font-weight:normal;color:#333333;text-align:center;">Welcome to PyMatcha !<br></h2></td>
77+
</tr>
78+
<tr style="border-collapse:collapse;">
79+
<td align="center" style="padding:0;Margin:0;"><img class="adapt-img" src="https://eziuhk.stripocdn.email/content/guids/CABINET_e354f7736d59c71049f64a7c0364ce24/images/49341582655349409.png" alt style="display:block;border:0;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;" width="300"></td>
80+
</tr>
81+
<tr style="border-collapse:collapse;">
82+
<td align="center" style="padding:0;Margin:0;padding-top:20px;"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-size:20px;font-family:arial, 'helvetica neue', helvetica, sans-serif;line-height:30px;color:#333333;">It is now time for you to confirm your email and fill up your profile !</p></td>
83+
</tr>
84+
<tr style="border-collapse:collapse;">
85+
<td align="center" style="padding:10px;Margin:0;"><span class="es-button-border" style="border-style:solid;border-color:#2CB543;background:#2CB543;border-width:0px 0px 2px 0px;display:inline-block;border-radius:30px;width:auto;"><a href="{{ link }}" class="es-button" target="_blank" style="mso-style-priority:100 !important;text-decoration:none;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:arial, 'helvetica neue', helvetica, sans-serif;font-size:18px;color:#FFFFFF;border-style:solid;border-color:#31CB4B;border-width:10px 20px 10px 20px;display:inline-block;background:#31CB4B;border-radius:30px;font-weight:normal;font-style:normal;line-height:22px;width:auto;text-align:center;">Confirm my email</a></span></td>
86+
</tr>
87+
<tr style="border-collapse:collapse;">
88+
<td align="center" style="padding:0;Margin:0;padding-top:20px;"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-size:11px;font-family:arial, 'helvetica neue', helvetica, sans-serif;line-height:17px;color:#333333;">If the link didn't work, copy and paste this url in your web browser {{ link }}</p></td>
89+
</tr>
90+
</table></td>
91+
</tr>
92+
</table></td>
93+
</tr>
94+
</table></td>
95+
</tr>
96+
</table>
97+
<table class="es-footer" cellspacing="0" cellpadding="0" align="center" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;background-color:transparent;background-repeat:repeat;background-position:center top;">
98+
<tr style="border-collapse:collapse;">
99+
<td align="center" style="padding:0;Margin:0;">
100+
<table class="es-footer-body" width="600" cellspacing="0" cellpadding="0" align="center" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:transparent;">
101+
<tr style="border-collapse:collapse;">
102+
<td align="left" style="Margin:0;padding-top:20px;padding-bottom:20px;padding-left:20px;padding-right:20px;">
103+
<table width="100%" cellspacing="0" cellpadding="0" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
104+
<tr style="border-collapse:collapse;">
105+
<td width="560" valign="top" align="center" style="padding:0;Margin:0;">
106+
<table width="100%" cellspacing="0" cellpadding="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
107+
<tr style="border-collapse:collapse;">
108+
<td align="center" style="padding:20px;Margin:0;">
109+
<table width="75%" height="100%" cellspacing="0" cellpadding="0" border="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
110+
<tr style="border-collapse:collapse;">
111+
<td style="padding:0;Margin:0px 0px 0px 0px;border-bottom:1px solid #CCCCCC;background:none;height:1px;width:100%;margin:0px;"></td>
112+
</tr>
113+
</table></td>
114+
</tr>
115+
<tr style="border-collapse:collapse;">
116+
<td align="center" style="padding:0;Margin:0;padding-top:10px;padding-bottom:10px;"><p style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-size:11px;font-family:arial, 'helvetica neue', helvetica, sans-serif;line-height:17px;color:#333333;">©&nbsp;2020 PyMatcha - by <a target="_blank" href="https://github.com/seluj78/" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:arial, 'helvetica neue', helvetica, sans-serif;font-size:11px;text-decoration:underline;color:#1376C8;">jlasne</a> & <a target="_blank" href="https://github.com/gmorer" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:arial, 'helvetica neue', helvetica, sans-serif;font-size:11px;text-decoration:underline;color:#1376C8;">gmorer</a><br></p></td>
117+
</tr>
118+
</table></td>
119+
</tr>
120+
</table></td>
121+
</tr>
122+
</table></td>
123+
</tr>
124+
</table></td>
125+
</tr>
126+
</table>
127+
</div>
128+
</body>
129+
</html>

0 commit comments

Comments
 (0)