objectcomputing · mkimberlin · Oct 10, 2024 · Oct 2, 2024 · Oct 2, 2024 · Oct 3, 2024
diff --git a/server/build.gradle b/server/build.gradle
@@ -115,6 +115,8 @@ dependencies {
     implementation("io.micronaut.reactor:micronaut-reactor")
     implementation("io.micrometer:context-propagation")
 
+    implementation 'ch.digitalfondue.mjml4j:mjml4j:1.0.3'
+
     testRuntimeOnly "org.seleniumhq.selenium:selenium-chrome-driver:$seleniumVersion"
     testRuntimeOnly "org.seleniumhq.selenium:selenium-firefox-driver:$seleniumVersion"
 
@@ -213,3 +215,5 @@ java {
 }
 
 run.jvmArgs('-Dcom.sun.management.jmxremote', '-agentlib:jdwp=transport=dt_socket,server=y,suspend=n,address=8000')
+
+
diff --git a/server/src/main/java/com/objectcomputing/checkins/notifications/email/MailJetFactory.java b/server/src/main/java/com/objectcomputing/checkins/notifications/email/MailJetFactory.java
@@ -14,6 +14,7 @@
 public class MailJetFactory {
 
     public static final String HTML_FORMAT = "html";
+    public static final String MJML_FORMAT = "mjml";
     public static final String TEXT_FORMAT = "text";
 
     @Bean
@@ -34,6 +35,13 @@ EmailSender getHtmlSender(MailJetSender sender) {
         return sender;
     }
 
+    @Singleton
+    @Named(MJML_FORMAT)
+    EmailSender getMjmlSender(MailJetSender sender) {
+        sender.setEmailFormat(MailJetSender.MJMLPART);
+        return sender;
+    }
+
     @Singleton
     @Named(TEXT_FORMAT)
     EmailSender getTextSender(MailJetSender sender) {

diff --git a/server/src/main/java/com/objectcomputing/checkins/notifications/email/MailJetSender.java b/server/src/main/java/com/objectcomputing/checkins/notifications/email/MailJetSender.java
@@ -5,6 +5,7 @@
 import com.mailjet.client.MailjetResponse;
 import com.mailjet.client.errors.MailjetException;
 import com.mailjet.client.resource.Emailv31;
+import ch.digitalfondue.mjml4j.Mjml4j;
 import com.objectcomputing.checkins.exceptions.BadArgException;
 import io.micronaut.context.annotation.Prototype;
 import io.micronaut.context.annotation.Requires;
@@ -20,6 +21,7 @@
 @Prototype
 @Requires(bean = MailJetConfiguration.class)
 public class MailJetSender implements EmailSender {
+    public static final String MJMLPART = "MJMLPART";
 
     private static final Logger LOG = LoggerFactory.getLogger(MailJetSender.class);
     private final MailjetClient client;
@@ -94,6 +96,16 @@ public void sendEmail(String fromName, String fromAddress, String subject, Strin
                 .put("Email", fromAddress)
                 .put("Name", fromName);
 
+        String modifiedEmailFormat = emailFormat;
+        if (modifiedEmailFormat.equals(MJMLPART)) {
+            // Convert the MJML to HTML and update the local email format.
+            var configuration = new Mjml4j.Configuration("en");
+            content = Mjml4j.render(content, configuration);
+            modifiedEmailFormat = Emailv31.Message.HTMLPART;
+        }
+        final String localEmailFormat = modifiedEmailFormat;
+        final String localContent = content;
+
         emailBatches.forEach((recipientList) -> {
             MailjetRequest request = new MailjetRequest(Emailv31.resource)
                     .property(Emailv31.MESSAGES, new JSONArray()
@@ -102,7 +114,7 @@ public void sendEmail(String fromName, String fromAddress, String subject, Strin
                                     .put(Emailv31.Message.TO, new JSONArray().put(sender))
                                     .put(Emailv31.Message.BCC, recipientList)
                                     .put(Emailv31.Message.SUBJECT, subject)
-                                    .put(emailFormat, content)));
+                                    .put(localEmailFormat, localContent)));
             try {
                 MailjetResponse response = client.post(request);
                 LOG.info("Mailjet response status: {}", response.getStatus());
@@ -134,10 +146,12 @@ public boolean sendEmailReceivesStatus(String fromName, String fromAddress, Stri
 
     @Override
     public void setEmailFormat(String format) {
-        if (format.equals(Emailv31.Message.HTMLPART) || format.equals(Emailv31.Message.TEXTPART)) {
+        if (format.equals(MJMLPART) ||
+            format.equals(Emailv31.Message.HTMLPART) ||
+            format.equals(Emailv31.Message.TEXTPART)) {
             this.emailFormat = format;
         } else {
-            throw new BadArgException(String.format("Email format must be either HTMLPART or TEXTPART, got %s", format));
+            throw new BadArgException(String.format("Email format must be either HTMLPART, MJMLPART or TEXTPART, got %s", format));
         }
     }
 }
diff --git a/...a/com/objectcomputing/checkins/services/feedback_request/FeedbackRequestServicesImpl.java b/...a/com/objectcomputing/checkins/services/feedback_request/FeedbackRequestServicesImpl.java
diff --git a/server/src/main/java/com/objectcomputing/checkins/services/pulse/PulseEmail.java b/server/src/main/java/com/objectcomputing/checkins/services/pulse/PulseEmail.java
@@ -5,18 +5,32 @@
 import com.objectcomputing.checkins.notifications.email.MailJetFactory;
 import com.objectcomputing.checkins.services.memberprofile.MemberProfileServices;
 
+import jakarta.inject.Singleton;
 import jakarta.inject.Named;
 
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+
+import io.micronaut.context.annotation.Value;
+import io.micronaut.core.io.Readable;
+import io.micronaut.core.io.IOUtils;
+
+import java.io.BufferedReader;
 import java.util.List;
 
+@Singleton
 class PulseEmail {
+  private static final Logger LOG = LoggerFactory.getLogger(PulseEmail.class);
   private final EmailSender emailSender;
   private final CheckInsConfiguration checkInsConfiguration;
   private final MemberProfileServices memberProfileServices;
 
   private final String SUBJECT = "Check Out the Pulse Survey!";
+
+  @Value("classpath:mjml/pulse_email.mjml")
+  private Readable pulseEmailTemplate;
 
-  public PulseEmail(@Named(MailJetFactory.HTML_FORMAT) EmailSender emailSender,
+  public PulseEmail(@Named(MailJetFactory.MJML_FORMAT) EmailSender emailSender,
                     CheckInsConfiguration checkInsConfiguration,
                     MemberProfileServices memberProfileServices) {
     this.emailSender = emailSender;
@@ -25,43 +39,22 @@ public PulseEmail(@Named(MailJetFactory.HTML_FORMAT) EmailSender emailSender,
   }
 
   private List<String> getActiveTeamMembers() {
-    List<String> profiles = memberProfileServices.findAll().stream()
+    List<String> addresses = memberProfileServices.findAll().stream()
                                 .filter(p -> p.getTerminationDate() == null)
                                 .map(p -> p.getWorkEmail())
                                 .toList();
-    return profiles;
+    return addresses;
   }
 
   private String getEmailContent() {
-/*
-<mjml>
-  <mj-body>
-    <mj-section>
-      <mj-column>
-        <mj-divider border-color="#2559a7"></mj-divider>
-        <mj-text font-size="16px" font-family="'Helvetica Neue', Helvetica, Arial, sans-serif" color="#4d4c4f">Please fill out your Pulse survey, if you haven't already done so. We want to know how you're doing!</mj-text>
-        <mj-text font-size="16px" font-family="'Helvetica Neue', Helvetica, Arial, sans-serif" color="#4d4c4f">Click <a href="%s/pulse" target="_blank">here</a> to begin.</mj-text>
-      </mj-column>
-    </mj-section>
-  </mj-body>
-</mjml>
-*/
-    return String.format("""
-<html>
-  <body>
-    <div style="margin:0px auto;float: left; max-width:600px;">
-      <p style="border-top:solid 4px #2559a7;font-size:1px;margin:0px auto;width:100%%;"></p>
-      <p></p>
-      <div style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;line-height:1;text-align:left;color:#4d4c4f;">
-      Please fill out your Pulse survey, if you haven't already done so. We want to know how you're doing!</div>
-      <p></p>
-      <div style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;line-height:1;text-align:left;color:#4d4c4f;">
-      Click <a href="%s/pulse" target="_blank">here</a> to begin.</div>
-      </div>
-    </div>
-  </body>
-</html>
-""", checkInsConfiguration.getWebAddress());
+    try {
+      return String.format(IOUtils.readText(
+                             new BufferedReader(pulseEmailTemplate.asReader())),
+                           checkInsConfiguration.getWebAddress());
+    } catch(Exception ex) {
+      LOG.error(ex.toString());
+      return "";
+    }
   }
 
   public void send() {

diff --git a/server/src/main/java/com/objectcomputing/checkins/services/pulse/PulseServicesImpl.java b/server/src/main/java/com/objectcomputing/checkins/services/pulse/PulseServicesImpl.java
@@ -11,6 +11,7 @@
 import lombok.Getter;
 import lombok.AllArgsConstructor;
 
+import jakarta.inject.Inject;
 import jakarta.inject.Named;
 import jakarta.inject.Singleton;
 
@@ -40,6 +41,9 @@ private class Frequency {
   private final SettingsServices settingsServices;
   private final Map<String, Boolean> sent = new HashMap<String, Boolean>();
 
+  @Inject
+  private PulseEmail email;
+
   private final DayOfWeek emailDay = DayOfWeek.MONDAY;
 
   private String setting = "bi-weekly";
@@ -50,7 +54,7 @@ private class Frequency {
   );
 
   public PulseServicesImpl(
-                    @Named(MailJetFactory.HTML_FORMAT) EmailSender emailSender,
+                    @Named(MailJetFactory.MJML_FORMAT) EmailSender emailSender,
                     CheckInsConfiguration checkInsConfiguration,
                     MemberProfileServices memberProfileServices,
                     SettingsServices settingsServices) {
@@ -93,7 +97,7 @@ public void sendPendingEmail(LocalDate check) {
             LOG.info("The Pulse Email has already been sent today");
           } else {
             LOG.info("Sending Pulse Email");
-            send();
+            email.send();
             sent.put(key, true);
           }
           break;
@@ -110,10 +114,4 @@ public void sendPendingEmail(LocalDate check) {
       } while(start.isBefore(check) || start.isEqual(check));
     }
   }
-
-  private void send() {
-    PulseEmail email = new PulseEmail(emailSender, checkInsConfiguration,
-                                      memberProfileServices);
-    email.send();
-  }
 }
diff --git a/server/src/main/resources/mjml/README.md b/server/src/main/resources/mjml/README.md
@@ -0,0 +1,10 @@
+# Templates
+
+Place MJML templates here.  If they are going to be used within a call to `String.format()`, be sure to double up on any percent signs (i.e.,  `width="100%%"`).
+
+### Micronaut Usage
+
+```java
+@Value("classpath:mjml/feedback_request.mjml")
+private Readable feedbackRequestTemplate;
+```
diff --git a/server/src/main/resources/mjml/feedback_request.mjml b/server/src/main/resources/mjml/feedback_request.mjml
@@ -0,0 +1,36 @@
+<mjml>
+  <mj-head>
+    <mj-title>Feedback Request</mj-title>
+    <mj-preview>Feedback Request</mj-preview>
+    <mj-attributes>
+      <mj-class name="preheader" color="#000000" font-size="11px" font-family="Ubuntu, Helvetica, Arial, sans-serif" padding="0px"></mj-class>
+    </mj-attributes>
+  </mj-head>
+  <mj-body background-color="#e0f2ff">
+    <mj-section background-color="#2559a7">
+      <mj-column>
+        <mj-image src="https://objectcomputing.com/files/6416/4277/8012/ObjectComputingLogo_version2_white.png" alt="logo" width="150px"></mj-image>
+      </mj-column>
+    </mj-section>
+    <mj-hero mode="fluid-height" background-url="https://lh3.googleusercontent.com/pw/AL9nZEXvzBSrNroLHtqfW8W5_oM296XY7FPJqz15RNP3RBcf_XEkyZ0gn5JVkDCSTWA-loYTeVL5c-ycoAEOh_3dFBpPju1UmfGt7tLPCMFQdf5IVeHipmhyOV4fZnCWSl0n-b3tsHB4THfub4Mtknvz8R4t=w900-h600-no" background-color="#FFF" padding="100px 0px">
+      <mj-text padding="20px" font-family="Helvetica" align="center" font-size="45px" line-height="45px" font-weight="900"> Give Your Feedback! </mj-text>
+
+    </mj-hero>
+    <mj-section background-color="#ffffff">
+      <mj-column>
+        <mj-text>
+          <h2>You have received a feedback request.</h2>
+        </mj-text>
+          <mj-text font-size="16px">Hello, %s!</mj-text>
+        <mj-text font-size="16px"><strong>%s</strong> is requesting feedback %sfrom you.</mj-text>
+        <mj-text font-size="16px">%s</mj-text>
+        <mj-text font-size="16px">Please go to <a href="%s">your unique link</a> to complete this request.</mj-text>
+      </mj-column>
+    </mj-section>
+    <mj-section background-color="#feb672" padding="10px">
+      <mj-column vertical-align="top" width="100%%">
+        <mj-text align="center" color="#FFF" font-size="16px">Thank you for everything you do!</mj-text>
+      </mj-column>
+    </mj-section>
+  </mj-body>
+</mjml>
diff --git a/server/src/main/resources/mjml/pulse_email.mjml b/server/src/main/resources/mjml/pulse_email.mjml
@@ -0,0 +1,11 @@
+<mjml>
+  <mj-body>
+    <mj-section>
+      <mj-column>
+        <mj-divider border-color="#2559a7"></mj-divider>
+        <mj-text font-size="16px" font-family="'Helvetica Neue', Helvetica, Arial, sans-serif" color="#4d4c4f">Please fill out your Pulse survey, if you haven't already done so. We want to know how you're doing!</mj-text>
+        <mj-text font-size="16px" font-family="'Helvetica Neue', Helvetica, Arial, sans-serif" color="#4d4c4f">Click <a href="%s/pulse" target="_blank">here</a> to begin.</mj-text>
+      </mj-column>
+    </mj-section>
+  </mj-body>
+</mjml>
diff --git a/server/src/main/resources/mjml/reviewer_email.mjml b/server/src/main/resources/mjml/reviewer_email.mjml
@@ -0,0 +1,35 @@
+<mjml>
+  <mj-head>
+    <mj-title>Self-Review Completion</mj-title>
+    <mj-preview>Self-Reviews Completion for Reviewer</mj-preview>
+    <mj-attributes>
+      <mj-class name="preheader" color="#000000" font-size="11px" font-family="Ubuntu, Helvetica, Arial, sans-serif" padding="0px"></mj-class>
+    </mj-attributes>
+  </mj-head>
+  <mj-body background-color="#e0f2ff">
+    <mj-section background-color="#2559a7">
+      <mj-column>
+        <mj-image src="https://objectcomputing.com/files/6416/4277/8012/ObjectComputingLogo_version2_white.png" alt="logo" width="150px"></mj-image>
+      </mj-column>
+    </mj-section>
+    <mj-hero mode="fluid-height" background-url="https://lh3.googleusercontent.com/pw/AL9nZEXvzBSrNroLHtqfW8W5_oM296XY7FPJqz15RNP3RBcf_XEkyZ0gn5JVkDCSTWA-loYTeVL5c-ycoAEOh_3dFBpPju1UmfGt7tLPCMFQdf5IVeHipmhyOV4fZnCWSl0n-b3tsHB4THfub4Mtknvz8R4t=w900-h600-no" background-color="#FFF" padding="100px 0px">
+      <mj-text padding="20px" font-family="Helvetica" align="center" font-size="45px" line-height="45px" font-weight="900"> It's Your Turn! </mj-text>
+
+    </mj-hero>
+    <mj-section background-color="#ffffff">
+      <mj-column>
+        <mj-text>
+          <h2>It's time to begin your review of %s</h2>
+        </mj-text>
+          <mj-text font-size="16px">Hello, %s!</mj-text>
+        <mj-text font-size="16px">%s has completed their self-review and it can be viewed <a href="%s">here</a>.</mj-text>   <mj-text font-size="16px">It's your turn to share your thoughts and complete your review. Please complete your review before %s. </strong></mj-text>
+
+      </mj-column>
+    </mj-section>
+    <mj-section background-color="#feb672" padding="10px">
+      <mj-column vertical-align="top" width="100%%">
+        <mj-text align="center" color="#FFF" font-size="16px">Thank you for everything you do!</mj-text>
+      </mj-column>
+    </mj-section>
+  </mj-body>
+</mjml>
diff --git a/server/src/main/resources/mjml/supervisor_email.mjml b/server/src/main/resources/mjml/supervisor_email.mjml
@@ -0,0 +1,35 @@
+<mjml>
+  <mj-head>
+    <mj-title>Self-Review Completion</mj-title>
+    <mj-preview>Self-Reviews Completion for Supervisor</mj-preview>
+    <mj-attributes>
+      <mj-class name="preheader" color="#000000" font-size="11px" font-family="Ubuntu, Helvetica, Arial, sans-serif" padding="0px"></mj-class>
+    </mj-attributes>
+  </mj-head>
+  <mj-body background-color="#e0f2ff">
+    <mj-section background-color="#2559a7">
+      <mj-column>
+        <mj-image src="https://objectcomputing.com/files/6416/4277/8012/ObjectComputingLogo_version2_white.png" alt="logo" width="150px"></mj-image>
+      </mj-column>
+    </mj-section>
+    <mj-hero mode="fluid-height" background-url="https://lh3.googleusercontent.com/pw/AL9nZEXvzBSrNroLHtqfW8W5_oM296XY7FPJqz15RNP3RBcf_XEkyZ0gn5JVkDCSTWA-loYTeVL5c-ycoAEOh_3dFBpPju1UmfGt7tLPCMFQdf5IVeHipmhyOV4fZnCWSl0n-b3tsHB4THfub4Mtknvz8R4t=w900-h600-no" background-color="#FFF" padding="100px 0px">
+      <mj-text padding="20px" font-family="Helvetica" align="center" font-size="45px" line-height="45px" font-weight="900"> Self-Review Completion </mj-text>
+
+    </mj-hero>
+    <mj-section background-color="#ffffff">
+      <mj-column>
+        <mj-text>
+          <h2>Your team member has completed their self-review!</h2>
+        </mj-text>
+          <mj-text font-size="16px">Hello, %s!</mj-text>
+        <mj-text font-size="16px">%s has completed their self-review. You can view it <a href="%s">here</a>.</mj-text>
+
+      </mj-column>
+    </mj-section>
+    <mj-section background-color="#feb672" padding="10px">
+      <mj-column vertical-align="top" width="100%%">
+        <mj-text align="center" color="#FFF" font-size="16px">Thank you for everything you do!</mj-text>
+      </mj-column>
+    </mj-section>
+  </mj-body>
+</mjml>
diff --git a/server/src/main/resources/mjml/update_request.mjml b/server/src/main/resources/mjml/update_request.mjml
@@ -0,0 +1,36 @@
+<mjml>
+  <mj-head>
+    <mj-title>Feedback Request Reopened</mj-title>
+    <mj-preview>Feedback Request Reopened</mj-preview>
+    <mj-attributes>
+      <mj-class name="preheader" color="#000000" font-size="11px" font-family="Ubuntu, Helvetica, Arial, sans-serif" padding="0px"></mj-class>
+    </mj-attributes>
+  </mj-head>
+  <mj-body background-color="#e0f2ff">
+    <mj-section background-color="#2559a7">
+      <mj-column>
+        <mj-image src="https://objectcomputing.com/files/6416/4277/8012/ObjectComputingLogo_version2_white.png" alt="logo" width="150px"></mj-image>
+      </mj-column>
+    </mj-section>
+    <mj-hero mode="fluid-height" background-url="https://lh3.googleusercontent.com/pw/AL9nZEXvzBSrNroLHtqfW8W5_oM296XY7FPJqz15RNP3RBcf_XEkyZ0gn5JVkDCSTWA-loYTeVL5c-ycoAEOh_3dFBpPju1UmfGt7tLPCMFQdf5IVeHipmhyOV4fZnCWSl0n-b3tsHB4THfub4Mtknvz8R4t=w900-h600-no" background-color="#FFF" padding="100px 0px">
+      <mj-text padding="20px" font-family="Helvetica" align="center" font-size="45px" line-height="45px" font-weight="900"> Edit Your Feedback! </mj-text>
+
+    </mj-hero>
+    <mj-section background-color="#ffffff">
+      <mj-column>
+        <mj-text>
+          <h2>You have received edit access to a feedback request.</h2>
+        </mj-text>
+          <mj-text font-size="16px">Hello, %s!</mj-text>
+        <mj-text font-size="16px"><strong>%s has reopened the feedback request on %s from you.</strong></mj-text>
+        <mj-text font-size="16px">You may make changes to your answers, but you will need to submit the form again when finished.</mj-text>
+        <mj-text font-size="16px">Please go to <a href="%s">your unique link</a> to complete this request.</mj-text>
+      </mj-column>
+    </mj-section>
+    <mj-section background-color="#feb672" padding="10px">
+      <mj-column vertical-align="top" width="100%%">
+        <mj-text align="center" color="#FFF" font-size="16px">Thank you for everything you do!</mj-text>
+      </mj-column>
+    </mj-section>
+  </mj-body>
+</mjml>