From 02dafebe383df729862ca52eb7ec868364c8e695 Mon Sep 17 00:00:00 2001
From: mike12345567 <me@michaeldrury.co.uk>
Date: Mon, 26 Apr 2021 14:39:18 +0100
Subject: [PATCH] Moving header/footer and presentational tables to the base
 hbs email template.

---
 .../worker/src/constants/templates/base.hbs   |  25 +++-
 .../src/constants/templates/invitation.hbs    | 107 ++++++++----------
 .../constants/templates/passwordRecovery.hbs  |  97 +++++++---------
 .../src/constants/templates/welcome.hbs       |  91 ++++++---------
 4 files changed, 143 insertions(+), 177 deletions(-)
diff --git a/packages/worker/src/constants/templates/base.hbs b/packages/worker/src/constants/templates/base.hbs
index ba0571db0b..38ceff023a 100644
--- a/packages/worker/src/constants/templates/base.hbs
+++ b/packages/worker/src/constants/templates/base.hbs
@@ -20,11 +20,28 @@
   <![endif]-->
 </head>
 <body>
-{{ body }}
-<table class="email-footer" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
+<table class="email-wrapper" width="100%" cellpadding="0" cellspacing="0" role="presentation">
   <tr>
-    <td class="content-cell" align="center">
-      <p class="f-fallback sub align-center">&copy; {{ currentYear }} {{ company }}. All rights reserved.</p>
+    <td align="center">
+      <table class="email-content" width="100%" cellpadding="0" cellspacing="0" role="presentation">
+        <tr>
+          <td class="email-masthead">
+            <a href="{{ platformUrl }}" class="f-fallback email-masthead_name">
+              {{ company }}
+            </a>
+          </td>
+        </tr>
+        {{ body }}
+        <tr>
+          <table class="email-footer" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
+            <tr>
+              <td class="content-cell" align="center">
+                <p class="f-fallback sub align-center">&copy; {{ currentYear }} {{ company }}. All rights reserved.</p>
+              </td>
+            </tr>
+          </table>
+        </tr>
+      </table>
     </td>
   </tr>
 </table>
diff --git a/packages/worker/src/constants/templates/invitation.hbs b/packages/worker/src/constants/templates/invitation.hbs
index 16b011a17f..fcaf7e7ca1 100644
--- a/packages/worker/src/constants/templates/invitation.hbs
+++ b/packages/worker/src/constants/templates/invitation.hbs
@@ -1,67 +1,50 @@
 <!-- Based on template: https://github.com/wildbit/postmark-templates/blob/master/templates/plain/user-invitation/content.html -->
-<span class="preheader">You've been invited to use {{ company }}'s Budibase platform!</span>
-<table class="email-wrapper" width="100%" cellpadding="0" cellspacing="0" role="presentation">
-  <tr>
-    <td align="center">
-      <table class="email-content" width="100%" cellpadding="0" cellspacing="0" role="presentation">
-        <tr>
-          <td class="email-masthead">
-            <a href="{{ platformUrl }}" class="f-fallback email-masthead_name">
-              {{ company }}
-            </a>
-          </td>
-        </tr>
-        <!-- Email Body -->
-        <tr>
-          <td class="email-body" width="570" cellpadding="0" cellspacing="0">
-            <table class="email-body_inner" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
-              <!-- Body content -->
+<tr>
+  <td class="email-body" width="570" cellpadding="0" cellspacing="0">
+    <table class="email-body_inner" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
+      <!-- Body content -->
+      <tr>
+        <td class="content-cell">
+          <div class="f-fallback">
+            <h1>Hi, {{ email }}!</h1>
+            <p>
+              {{#if request}}
+                {{ request.inviter }} has invited you to use {{ company }}'s Budibase platform.<
+              {{else}}
+                You've been invited to use {{ company }}'s Budibase platform.
+              {{/if}}
+              Use the button below to set up your account and get started:
+            </p>
+            <!-- Action -->
+            <table class="body-action" align="center" width="100%" cellpadding="0" cellspacing="0" role="presentation">
               <tr>
-                <td class="content-cell">
-                  <div class="f-fallback">
-                    <h1>Hi, {{ email }}!</h1>
-                    <p>
-                      {{#if request}}
-                        {{ request.inviter }} has invited you to use {{ company }}'s Budibase platform.<
-                      {{else}}
-                        You've been invited to use {{ company }}'s Budibase platform.
-                      {{/if}}
-                      Use the button below to set up your account and get started:
-                    </p>
-                    <!-- Action -->
-                    <table class="body-action" align="center" width="100%" cellpadding="0" cellspacing="0" role="presentation">
-                      <tr>
-                        <td align="center">
-                          <table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation">
-                            <tr>
-                              <td align="center">
-                                <a href="{{ registrationUrl }}" class="f-fallback button" target="_blank">Set up account</a>
-                              </td>
-                            </tr>
-                          </table>
-                        </td>
-                      </tr>
-                    </table>
-                    <p>If you have any questions contact your Budibase platform administrator.</p>
-                    <p>Welcome aboard,
-                      <br>The {{ company }} Team</p>
-                    <p><strong>P.S.</strong> Need help getting started? Check out our <a href="{{ docsUrl }}">help documentation</a>.</p>
-                    <!-- Sub copy -->
-                    <table class="body-sub" role="presentation">
-                      <tr>
-                        <td>
-                          <p class="f-fallback sub">If you’re having trouble with the button above, copy and paste the URL below into your web browser.</p>
-                          <p class="f-fallback sub">{{ registrationUrl }}</p>
-                        </td>
-                      </tr>
-                    </table>
-                  </div>
+                <td align="center">
+                  <table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation">
+                    <tr>
+                      <td align="center">
+                        <a href="{{ registrationUrl }}" class="f-fallback button" target="_blank">Set up account</a>
+                      </td>
+                    </tr>
+                  </table>
                 </td>
               </tr>
             </table>
-          </td>
-        </tr>
-      </table>
-    </td>
-  </tr>
-</table>
\ No newline at end of file
+            <p>If you have any questions contact your Budibase platform administrator.</p>
+            <p>Welcome aboard,
+              <br>The {{ company }} Team</p>
+            <p><strong>P.S.</strong> Need help getting started? Check out our <a href="{{ docsUrl }}">help documentation</a>.</p>
+            <!-- Sub copy -->
+            <table class="body-sub" role="presentation">
+              <tr>
+                <td>
+                  <p class="f-fallback sub">If you’re having trouble with the button above, copy and paste the URL below into your web browser.</p>
+                  <p class="f-fallback sub">{{ registrationUrl }}</p>
+                </td>
+              </tr>
+            </table>
+          </div>
+        </td>
+      </tr>
+    </table>
+  </td>
+</tr>
\ No newline at end of file
diff --git a/packages/worker/src/constants/templates/passwordRecovery.hbs b/packages/worker/src/constants/templates/passwordRecovery.hbs
index 838e8f816c..6ebe606467 100644
--- a/packages/worker/src/constants/templates/passwordRecovery.hbs
+++ b/packages/worker/src/constants/templates/passwordRecovery.hbs
@@ -1,62 +1,45 @@
 <!-- Based on template: https://github.com/wildbit/postmark-templates/blob/master/templates/plain/password-reset/content.html -->
-<span class="preheader">Use this link to reset your password. The link is only valid for 24 hours.</span>
-<table class="email-wrapper" width="100%" cellpadding="0" cellspacing="0" role="presentation">
-  <tr>
-    <td align="center">
-      <table class="email-content" width="100%" cellpadding="0" cellspacing="0" role="presentation">
-        <tr>
-          <td class="email-masthead">
-            <a href="{{ platformUrl }}" class="f-fallback email-masthead_name">
-              {{ company }}
-            </a>
-          </td>
-        </tr>
-        <!-- Email Body -->
-        <tr>
-          <td class="email-body" width="570" cellpadding="0" cellspacing="0">
-            <table class="email-body_inner" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
-              <!-- Body content -->
+<tr>
+  <td class="email-body" width="570" cellpadding="0" cellspacing="0">
+    <table class="email-body_inner" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
+      <!-- Body content -->
+      <tr>
+        <td class="content-cell">
+          <div class="f-fallback">
+            <h1>Hi {{ email }},</h1>
+            <p>You recently requested to reset your password for your {{ company }} account in your Budibase platform. Use the button below to reset it. <strong>This password reset is only valid for the next 24 hours.</strong></p>
+            <!-- Action -->
+            <table class="body-action" align="center" width="100%" cellpadding="0" cellspacing="0" role="presentation">
               <tr>
-                <td class="content-cell">
-                  <div class="f-fallback">
-                    <h1>Hi {{ email }},</h1>
-                    <p>You recently requested to reset your password for your {{ company }} account in your Budibase platform. Use the button below to reset it. <strong>This password reset is only valid for the next 24 hours.</strong></p>
-                    <!-- Action -->
-                    <table class="body-action" align="center" width="100%" cellpadding="0" cellspacing="0" role="presentation">
-                      <tr>
-                        <td align="center">
-                          <table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation">
-                            <tr>
-                              <td align="center">
-                                <a href="{{ resetUrl }}" class="f-fallback button button--green" target="_blank">Reset your password</a>
-                              </td>
-                            </tr>
-                          </table>
-                        </td>
-                      </tr>
-                    </table>
-                    {{#if request}}
-                      <p>For security, this request was received from a {{ request.os }} device.</p>
-                    {{/if}}
-                    <p>If you did not request a password reset, please ignore this email or contact support if you have questions.</p>
-                    <p>Thanks,
-                      <br>The {{ company }} Team</p>
-                    <!-- Sub copy -->
-                    <table class="body-sub" role="presentation">
-                      <tr>
-                        <td>
-                          <p class="f-fallback sub">If you’re having trouble with the button above, copy and paste the URL below into your web browser.</p>
-                          <p class="f-fallback sub">{{ resetUrl }}</p>
-                        </td>
-                      </tr>
-                    </table>
-                  </div>
+                <td align="center">
+                  <table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation">
+                    <tr>
+                      <td align="center">
+                        <a href="{{ resetUrl }}" class="f-fallback button button--green" target="_blank">Reset your password</a>
+                      </td>
+                    </tr>
+                  </table>
                 </td>
               </tr>
             </table>
-          </td>
-        </tr>
-      </table>
-    </td>
-  </tr>
-</table>
\ No newline at end of file
+            {{#if request}}
+              <p>For security, this request was received from a {{ request.os }} device.</p>
+            {{/if}}
+            <p>If you did not request a password reset, please ignore this email or contact support if you have questions.</p>
+            <p>Thanks,
+              <br>The {{ company }} Team</p>
+            <!-- Sub copy -->
+            <table class="body-sub" role="presentation">
+              <tr>
+                <td>
+                  <p class="f-fallback sub">If you’re having trouble with the button above, copy and paste the URL below into your web browser.</p>
+                  <p class="f-fallback sub">{{ resetUrl }}</p>
+                </td>
+              </tr>
+            </table>
+          </div>
+        </td>
+      </tr>
+    </table>
+  </td>
+</tr>
\ No newline at end of file
diff --git a/packages/worker/src/constants/templates/welcome.hbs b/packages/worker/src/constants/templates/welcome.hbs
index 89d4136121..6d4dcbd5e8 100644
--- a/packages/worker/src/constants/templates/welcome.hbs
+++ b/packages/worker/src/constants/templates/welcome.hbs
@@ -1,62 +1,45 @@
 <!-- Based on template: https://github.com/wildbit/postmark-templates/blob/master/templates/plain/welcome/content.html -->
-<span class="preheader">Thanks for trying out [Product Name]. We’ve pulled together some information and resources to help you get started.</span>
-<table class="email-wrapper" width="100%" cellpadding="0" cellspacing="0" role="presentation">
-  <tr>
-    <td align="center">
-      <table class="email-content" width="100%" cellpadding="0" cellspacing="0" role="presentation">
-        <tr>
-          <td class="email-masthead">
-            <a href="https://example.com" class="f-fallback email-masthead_name">
-              {{ company }}
-            </a>
-          </td>
-        </tr>
-        <!-- Email Body -->
-        <tr>
-          <td class="email-body" width="570" cellpadding="0" cellspacing="0">
-            <table class="email-body_inner" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
-              <!-- Body content -->
+<tr>
+  <td class="email-body" width="570" cellpadding="0" cellspacing="0">
+    <table class="email-body_inner" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
+      <!-- Body content -->
+      <tr>
+        <td class="content-cell">
+          <div class="f-fallback">
+            <h1>Welcome, {{ email }}!</h1>
+            <p>Thanks for getting started with {{ company }}'s Budibase platform.</p>
+            <p>For reference, here's your login information:</p>
+            <table class="attributes" width="100%" cellpadding="0" cellspacing="0" role="presentation">
               <tr>
-                <td class="content-cell">
-                  <div class="f-fallback">
-                    <h1>Welcome, {{ email }}!</h1>
-                    <p>Thanks for getting started with {{ company }}'s Budibase platform.</p>
-                    <p>For reference, here's your login information:</p>
-                    <table class="attributes" width="100%" cellpadding="0" cellspacing="0" role="presentation">
+                <td class="attributes_content">
+                  <table width="100%" cellpadding="0" cellspacing="0" role="presentation">
+                    <tr>
+                      <td class="attributes_item">
+                        <span class="f-fallback">
+                          <strong>Login Page:</strong> <a href="{{ loginUrl }}">{{ loginUrl }}</a>
+                        </span>
+                      </td>
+                    </tr>
+                    {{#if request}}
                       <tr>
-                        <td class="attributes_content">
-                          <table width="100%" cellpadding="0" cellspacing="0" role="presentation">
-                            <tr>
-                              <td class="attributes_item">
-                                <span class="f-fallback">
-                                  <strong>Login Page:</strong> <a href="{{ loginUrl }}">{{ loginUrl }}</a>
-                                </span>
-                              </td>
-                            </tr>
-                            {{#if request}}
-                              <tr>
-                                <td class="attributes_item">
-                                  <span class="f-fallback">
-                                    <strong>Username:</strong> {{ request.loginUsername }}
-                                  </span>
-                                </td>
-                              </tr>
-                            {{/if}}
-                          </table>
+                        <td class="attributes_item">
+                          <span class="f-fallback">
+                            <strong>Username:</strong> {{ request.loginUsername }}
+                          </span>
                         </td>
                       </tr>
-                    </table>
-                    <p>If you have any questions get in contact with your {{ company }}'s Budibase platform administration team.</p>
-                    <p>Thanks,
-                      <br>The {{ company }} Team</p>
-                    <p><strong>P.S.</strong> Need immediate help getting started? Check out our <a href="{{ docsUrl }}">help documentation</a>.</p>
-                  </div>
+                    {{/if}}
+                  </table>
                 </td>
               </tr>
             </table>
-          </td>
-        </tr>
-      </table>
-    </td>
-  </tr>
-</table>
\ No newline at end of file
+            <p>If you have any questions get in contact with your {{ company }}'s Budibase platform administration team.</p>
+            <p>Thanks,
+              <br>The {{ company }} Team</p>
+            <p><strong>P.S.</strong> Need immediate help getting started? Check out our <a href="{{ docsUrl }}">help documentation</a>.</p>
+          </div>
+        </td>
+      </tr>
+    </table>
+  </td>
+</tr>
\ No newline at end of file
