RocketChat / feature-requests

This repository is used to track Rocket.Chat feature requests and discussions. Click here to open a new feature request.
21 stars 9 forks source link

Header / Footer in plaintext emails #703

Open psy opened 2 years ago

psy commented 2 years ago

Description:

While the header and footer for emails can be customized via settings and is added to the html part of mails it is missing in the plaintext part. If header and footer are only used to style emails, this is mostly irrelevant. But as they may contain relevant information (e.g. a link to an imprint), they should also be added to the plaintext part of mails.

Steps to reproduce:

  1. Look into source of an email sent by rocketchat
  2. Find header / footer in html part
  3. Search for it in plaintext part.

Expected behavior:

Header and footer should also be added to the plaintext part.

Actual behavior:

Plaintext part misses header and footer.

Server Setup Information:

Additional context

Example mail:

Subject: SMTP Test Email
Date: Sat, 04 Dec 2021 14:09:41 +0000
MIME-Version: 1.0

----_NmP-fe5a5cf915038dbf-Part_1
Content-Type: text/plain
Content-Transfer-Encoding: 7bit

You have successfully sent an email
----_NmP-fe5a5cf915038dbf-Part_1
Content-Type: text/html; charset=utf-8
Content-Transfer-Encoding: quoted-printable

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.=
w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns=3D"http://www.w3.=
org/1999/xhtml" style=3D"font-family: -apple-system,BlinkMacSystemFont,=
'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Helvetica Neue','Apple Color =
Emoji','Segoe UI Emoji','Segoe UI Symbol','Meiryo UI',Arial,=
sans-serif;"><head><!-- If you delete this tag, the sky will fall on your =
head --><meta name=3D"viewport" content=3D"width=3Ddevice-width"><meta =
http-equiv=3D"Content-Type" content=3D"text/html; charset=3DUTF-8"><title>R=
ocket.Chat Cloud</title></head><body bgcolor=3D"#F7F8FA" =
style=3D"font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,=
Oxygen,Ubuntu,Cantarell,'Helvetica Neue','Apple Color Emoji','Segoe UI =
Emoji','Segoe UI Symbol','Meiryo UI',Arial,sans-serif; width: 100%; height:=
 100%;"><table class=3D"body" bgcolor=3D"#F7F8FA" width=3D"100%" =
style=3D"font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,=
Oxygen,Ubuntu,Cantarell,'Helvetica Neue','Apple Color Emoji','Segoe UI =
Emoji','Segoe UI Symbol','Meiryo UI',Arial,sans-serif; width: 100%; height:=
 100%;"><tr><td><!-- HEADER --><table class=3D"wrap" bgcolor=3D"#F7F8FA" =
style=3D"width: 100%; clear: both;"><tr><td class=3D"header container" =
style=3D"display: block; max-width: 640px; margin: 0 auto; clear: both; =
border-radius: 2px;"><div class=3D"header-content" style=3D"list-style-posi=
tion: inside; padding: 16px 0; padding-top: 36px; padding-bottom: 36px; =
padding-left: 36px; padding-right: 36px; max-width: 640px; margin: 0 auto; =
display: block;"><table bgcolor=3D"#F7F8FA" width=3D"100%"><tr><td><img =
src=3D"https://redacted/assets/logo.png" alt=3D"Rocket.chat" =
width=3D"150px"></td></tr></table></div></td></tr></table><!-- /HEADER =
--></td></tr><tr><td><!-- BODY --><table class=3D"wrap" style=3D"width: =
100%; clear: both;"><tr><td class=3D"container" bgcolor=3D"#FFFFFF" =
style=3D"display: block; max-width: 640px; margin: 0 auto; clear: both; =
border-radius: 2px;"><div class=3D"content" style=3D"list-style-position: =
inside; padding: 36px;"><table><tr><td> <p>You have successfully sent an =
email</p> </td></tr></table></div></td></tr></table><!-- /BODY =
--></td></tr><tr style=3D"margin: 0; padding: 0;"><td style=3D"margin: 0; =
padding: 0;"><!-- FOOTER --><table class=3D"wrap" style=3D"width: 100%; =
clear: both;"><tr><td class=3D"container" style=3D"display: block; =
max-width: 640px; margin: 0 auto; clear: both; border-radius: 2px;"><!-- =
content --><div class=3D"content" style=3D"list-style-position: inside; =
padding: 36px;"><table width=3D"100%"><tr><td align=3D"center" =
class=3D"social" style=3D"font-size: 12px;"><a href=3D"https://rocket.=
chat/blog" style=3D"color: #1D74F5; font-weight: bold; text-decoration: =
none; line-height: 1.8; padding-left: 2px; padding-right: 2px;">Blog</a> | =
<a href=3D"https://github.com/RocketChat" style=3D"color: #1D74F5; =
font-weight: bold; text-decoration: none; line-height: 1.8; padding-left: =
2px; padding-right: 2px;">Github</a> </td></tr><tr><td align=3D"center"><h6=
 style=3D"margin: 0 0 16px 0; font-weight: 500; font-size: 10px; color: =
#6c727A; line-height: 1.7;">=C2=A9 Rocket.Chat Technologies Corp.</h6><h6 =
style=3D"margin: 0 0 16px 0; font-weight: 500; font-size: 10px; color: =
#6c727A; line-height: 1.7;">Made with =E2=9D=A4=EF=B8=8F in =
=F0=9F=87=A7=F0=9F=87=B7 =F0=9F=87=A8=F0=9F=87=A6 =F0=9F=87=A9=F0=9F=87=AA =
=F0=9F=87=AE=F0=9F=87=B3 =F0=9F=87=AC=F0=9F=87=A7 =F0=9F=87=BA=F0=9F=87=B8 =
</h6></td></tr></table></div><!-- /content --></td></tr></table><!-- =
/FOOTER --></td></tr></table></body></html>
dudanogueira commented 2 years ago

marking as a good first issue.

Not sure if this is an issue or a feature request...

Maneet-k commented 2 years ago

I wanna work on this issue, Could you please assign this to me

Maneet-k commented 2 years ago

Hello! @dudanogueira I just tried to make the html email as according to the discussion above. could you please tell me, this is the result you were expecting or I need to modify something in this?

psy commented 2 years ago

I just tried to make the html email as according to the discussion above.

I think there's a missunderstanding. The issue is not about changing the html part of emails, it's about adding header and footer to the plaintext part.

Maneet-k commented 2 years ago

Rocket.chat

**Welcome to Rocket.Chat

Visit https://open.rocket.chat and try the best open source chat solution available today! Login (https://open.rocket.chat) Blog (https://rocket.chat/blog) | Github (https://github.com/RocketChat) | Facebook (https://www.facebook.com/RocketChatApp) | Instagram (https://www.instagram.com/rocket.chat)

© Rocket.Chat Technologies Corp.

Made with ❤️ in 🇧🇷 🇨🇦 🇩🇪 🇮🇳 🇬🇧 🇺🇸

Maneet-k commented 2 years ago

@psy What things I need to change in this ?

psy commented 2 years ago

It's not about changing the footer provided, it's about adding at least the footer to plaintext emails so that the information provided in there also shows up if only plaintext mails are sent or the user reads mails in plaintext view.

I don't feel experienced enough to guide a first-timer on how to change rocketchats sourcecode, maybe @dudanogueira is able to help you with this.

Zianor commented 2 years ago

https://github.com/RocketChat/Rocket.Chat/blob/develop/app/mailer/server/api.ts

A mail should always contain the content as html and plain text.

In this file, the text is generated from the html of the email here: text = html ? stripHtml(html).result : undefined;. But the header and footer are not contained there yet, they are added directly to the body. The plain text should contain header, html and footer, so that's what you need to change.

Please tell me if that was helpful!

Zianor commented 2 years ago

https://github.com/RocketChat/Rocket.Chat/blob/develop/app/mailer/server/api.ts A mail should always contain the content as html and plain text. In this file, the text is generated from the html of the email here: text = html ? stripHtml(html).result : undefined;. But the header and footer are not contained there yet, they are added directly to the body. The plain text should contain header, html and footer, so that's what you need to change. Please tell me if that was helpful!

I think this could be helpful. Thanks alot @Zianor <33 But could you pls check if this is the change you're looking for? 2021-12-10 (2)

I'm afraid you still don't quite get it right. At this point it is easier to get a working solution myself. You'll see the working solution then linked in the issue and maybe it helps you in the future :)

GeneralChauhan commented 2 years ago

Hi there! Can anybody help me get started with this issue? I'm new to the whole community and wanted to start with Rocket Chat

Manik-Aggarwal commented 2 years ago

I want to work on this issue, please assigned it to me

Manan17 commented 2 years ago

Hi, can I work on this issue?

ankit-jha1210 commented 2 years ago

@psy can I work on this I am interested to work on this

solo-daemon commented 1 year ago

Hi @dudanogueira I want to work on this issue , Can you please assign this to me ?

dudanogueira commented 1 year ago

Hi @dudanogueira I want to work on this issue , Can you please assign this to me ?

Hi!

Please, go ahead :)

solo-daemon commented 1 year ago

I am not sure about this but I think the email engine generating html and plain text email are different because in the following I can see the BODY of the html email and plain text email are different

----_NmP-990c9e5a29038df3-Part_1
Content-Type: text/plain; charset=utf-8
Content-Transfer-Encoding: quoted-printable

Hello,

To start using the service, simply click the link below.

https://open.rocket.chat/#/enroll-account/m2_G4Lw1BihEEEI2A79ImDSrFrpx316FP=
XVgz0aJNXT

Thank you.

----_NmP-990c9e5a29038df3-Part_1
Content-Type: text/html; charset=utf-8
Content-Transfer-Encoding: quoted-printable

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.=
w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns=3D"http://www.w3.=
org/1999/xhtml" style=3D"font-family: -apple-system,BlinkMacSystemFont,'Seg=
oe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Helvetica Neue','Apple Color Emoji',=
'Segoe UI Emoji','Segoe UI Symbol','Meiryo UI',Arial,sans-serif;"><head><me=
ta name=3D"viewport" content=3D"width=3Ddevice-width"><meta http-equiv=3D"C=
ontent-Type" content=3D"text/html; charset=3DUTF-8"><title>Rocket.Chat Clou=
d</title></head><body bgcolor=3D"#F7F8FA" style=3D"font-family: -apple-syst=
em,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Helvetica =
Neue','Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol','Meiryo UI',Ar=
ial,sans-serif; width: 100%; height: 100%;"><table class=3D"body" bgcolor=
=3D"#F7F8FA" width=3D"100%" style=3D"font-family: -apple-system,BlinkMacSys=
temFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Helvetica Neue','Apple C=
olor Emoji','Segoe UI Emoji','Segoe UI Symbol','Meiryo UI',Arial,sans-serif=
; width: 100%; height: 100%;"><tr><td><!-- HEADER --><table class=3D"wrap" =
bgcolor=3D"#F7F8FA" style=3D"width: 100%; clear: both;"><tr><td class=3D"he=
ader container" style=3D"display: block; max-width: 640px; margin: 0 auto; =
clear: both; border-radius: 2px;"><div class=3D"header-content" style=3D"li=
st-style-position: inside; padding: 16px 0; padding-top: 36px; padding-bott=
om: 36px; padding-left: 36px; padding-right: 36px; max-width: 640px; margin=
: 0 auto; display: block;"><table bgcolor=3D"#F7F8FA" width=3D"100%"><tr><t=
d><img src=3D"https://raw.githubusercontent.com/RocketChat/Rocket.Chat.Artw=
ork/master/Logos/redlogod.png" alt=3D"Rocket.chat" width=3D"150px"></td></t=
r></table></div></td></tr></table><!-- /HEADER --></td></tr><tr><td><!-- BO=
DY --><table class=3D"wrap" style=3D"width: 100%; clear: both;"><tr><td cla=
ss=3D"container" bgcolor=3D"#FFFFFF" style=3D"display: block; max-width: 64=
0px; margin: 0 auto; clear: both; border-radius: 2px;"><div class=3D"conten=
t" style=3D"list-style-position: inside; padding: 36px;"><table><tr><td> <h=
2 style=3D"line-height: 1.1; margin: 0 0 16px 0; font-weight: 600; font-siz=
e: 30px; color: #2F343D;">Welcome to Rocket.Chat</h2><p style=3D"margin: 1r=
em 0;">Visit https://open.rocket.chat and try the best open source chat sol=
ution available today!</p><a class=3D"btn" target=3D"_blank" href=3D"https:=
//open.rocket.chat" style=3D"line-height: 1.8; padding-left: 2px; padding-r=
ight: 2px; text-decoration: none; color: #FFF; background-color: #1D74F5; p=
adding: 12px 18px; font-weight: 500; font-size: 14px; margin-top: 8px; text=
-align: center; cursor: pointer; display: inline-block; border-radius: 2px;=
">Login</a> </td></tr></table></div></td></tr></table><!-- /BODY --></td></=
tr><tr style=3D"margin: 0; padding: 0;"><td style=3D"margin: 0; padding: 0;=
"><!-- FOOTER --><table class=3D"wrap" style=3D"width: 100%; clear: both;">=
<tr><td class=3D"container" style=3D"display: block; max-width: 640px; marg=
in: 0 auto; clear: both; border-radius: 2px;"><!-- content --><div class=3D=
"content" style=3D"list-style-position: inside; padding: 36px;"><table widt=
h=3D"100%"><tr><td align=3D"center" class=3D"social" style=3D"font-size: 12=
px;"><a title=3D"blog" href=3D"https://rocket.chat/blog" style=3D"color: RocketChat/Rocket.Chat#1=
D74F5; font-weight: bold; text-decoration: none; line-height: 1.8; padding-=
left: 2px; padding-right: 2px;"> Blog </a><span> | </span><a href=3D"https:=
//github.com/RocketChat" style=3D"color: #1D74F5; font-weight: bold; text-d=
ecoration: none; line-height: 1.8; padding-left: 2px; padding-right: 2px;">=
Github</a><span> | </span><a href=3D"https://www.facebook.com/RocketChatApp=
" style=3D"color: #1D74F5; font-weight: bold; text-decoration: none; line-h=
eight: 1.8; padding-left: 2px; padding-right: 2px;">Facebook</a><span> | </=
span><a href=3D"https://www.instagram.com/rocket.chat" style=3D"color: #1D7=
4F5; font-weight: bold; text-decoration: none; line-height: 1.8; padding-le=
ft: 2px; padding-right: 2px;">Instagram</a></td></tr><tr><td align=3D"cente=
r"><h6 style=3D"margin: 0 0 16px 0; font-weight: 500; font-size: 10px; colo=
r: #6c727A; line-height: 1.7;">=C2=A9 Rocket.Chat Technologies Corp.</h6><h=
6 style=3D"margin: 0 0 16px 0; font-weight: 500; font-size: 10px; color: RocketChat/Rocket.Chat#6=
c727A; line-height: 1.7;">Made with =E2=9D=A4=EF=B8=8F in =F0=9F=87=A7=F0=
=9F=87=B7 =F0=9F=87=A8=F0=9F=87=A6 =F0=9F=87=A9=F0=9F=87=AA =F0=9F=87=AE=F0=
=9F=87=B3 =F0=9F=87=AC=F0=9F=87=A7 =F0=9F=87=BA=F0=9F=87=B8 </h6></td></tr>=
</table></div><!-- /content --></td></tr></table><!-- /FOOTER --></td></tr>=
</table></body></html>
----_NmP-990c9e5a29038df3-Part_1--
solo-daemon commented 1 year ago

@zianor can you please look at this comment and share some lead i am new to this repository https://github.com/RocketChat/feature-requests/issues/703

Zianor commented 1 year ago

@Zianor can you please look at this comment and share some lead i am new to this repository #23866 (comment)

I never worked with this code as well, but what's happening is that the html is converted to plain text. For header and footer this is not done. There was a PR on this that never got merged but contained the proposed change: https://github.com/RocketChat/Rocket.Chat/pull/23928/files

Rishabhg71 commented 1 year ago

Hi, I would like to work on this if this is still open

abhishekbisht-1 commented 1 year ago

hi!! please assign me this issue

Gua00va commented 1 year ago

Hey!! I want to work on this issue. I'm new here so I'm really excited to start contributing.