HAI-1526 Add mjml template

City-of-Helsinki · Sep 5, 2023 · 7f15911 · 7f15911
1 parent eac3ea3
commit 7f15911
Show file tree

Hide file tree

Showing 12 changed files with 836 additions and 147 deletions.
diff --git a/README.md b/README.md
@@ -151,6 +151,11 @@ cd haitaton-backend
 When running locally, the system emails are sent to smtp4dev, which is started as part of the Docker
 Compose setup. You can access the sent emails by opening http://localhost:3003.
 
+Creation of new emails is done with [mjml.io](https://mjml.io/). Either IntelliJ or Visual Studio Code plugin MJML is
+needed. Once the Mjml template is done, it is converted to html. For example in Visual Studio, type >MJML:Copy HTML.
+
+The html output is the actual email content.
+
 ## File scan
 
 Haitaton supports uploading of attachment files. Files are validated with ClamAV anti-malware tool.

diff --git a/...service/src/integrationTest/kotlin/fi/hel/haitaton/hanke/email/EmailSenderServiceITest.kt b/...service/src/integrationTest/kotlin/fi/hel/haitaton/hanke/email/EmailSenderServiceITest.kt
@@ -153,12 +153,12 @@ class EmailSenderServiceITest : DatabaseTest() {
             val email = greenMail.firstReceivedMessage()
             val (textBody, htmlBody) = getBodiesFromHybridEmail(email)
             assertThat(textBody).all {
-                startsWith("${data.inviterName} (${data.inviterEmail}) lisäsi sinut")
+                contains("${data.inviterName} (${data.inviterEmail}) lisäsi sinut")
                 contains("hankkeelle ${data.hankeNimi} (${data.hankeTunnus}).")
                 contains("http://localhost:3001/${data.invitationToken}")
             }
             assertThat(htmlBody).all {
-                contains("<p>${data.inviterName} (${data.inviterEmail}) lisäsi sinut")
+                contains("${data.inviterName} (${data.inviterEmail})")
                 contains("hankkeelle <b>${data.hankeNimi} (${data.hankeTunnus})</b>.")
                 contains("""<a href="http://localhost:3001/${data.invitationToken}">""")
             }
@@ -172,8 +172,8 @@ class EmailSenderServiceITest : DatabaseTest() {
 
             val email = greenMail.firstReceivedMessage()
             val (textBody, htmlBody) = getBodiesFromHybridEmail(email)
-            assertThat(textBody).startsWith("Asioija ${data.inviterEmail} lisäsi sinut")
-            assertThat(htmlBody).contains("<p>Asioija ${data.inviterEmail} lisäsi sinut")
+            assertThat(textBody).contains("Asioija ${data.inviterEmail}")
+            assertThat(htmlBody).contains("Asioija ${data.inviterEmail}")
         }
     }
 
@@ -216,7 +216,7 @@ class EmailSenderServiceITest : DatabaseTest() {
             val email = greenMail.firstReceivedMessage()
             val (textBody, htmlBody) = getBodiesFromHybridEmail(email)
             assertThat(textBody).all {
-                startsWith("${data.inviterName} (${data.inviterEmail}) on")
+                contains("${data.inviterName} (${data.inviterEmail}) on")
                 contains("tehnyt johtoselvityshakemuksen (${data.applicationIdentifier})")
                 contains("hankkeella ${data.hankeTunnus}")
                 contains("rooliin ${data.roleType.text()}.")
@@ -226,7 +226,7 @@ class EmailSenderServiceITest : DatabaseTest() {
                 contains("${data.inviterName} (${data.inviterEmail})")
                 contains("johtoselvityshakemuksen (${data.applicationIdentifier})")
                 contains("rooliin ${data.roleType.text()}")
-                contains("""Tarkastele hakemusta Haitattomassa: <a href="http://localhost:3001">""")
+                contains("""<a href="http://localhost:3001">""")
             }
         }
 
@@ -238,8 +238,8 @@ class EmailSenderServiceITest : DatabaseTest() {
 
             val email = greenMail.firstReceivedMessage()
             val (textBody, htmlBody) = getBodiesFromHybridEmail(email)
-            assertThat(textBody).startsWith("Asioija ${data.inviterEmail} on tehnyt")
-            assertThat(htmlBody).contains("<p>Asioija ${data.inviterEmail} on tehnyt")
+            assertThat(textBody).contains("Asioija ${data.inviterEmail} on tehnyt")
+            assertThat(htmlBody).contains("Asioija ${data.inviterEmail} on tehnyt")
         }
     }
 

diff --git a/services/hanke-service/src/main/kotlin/fi/hel/haitaton/hanke/email/EmailSenderService.kt b/services/hanke-service/src/main/kotlin/fi/hel/haitaton/hanke/email/EmailSenderService.kt
@@ -56,12 +56,14 @@ class EmailSenderService(
     private val mailSender: JavaMailSender,
     private val emailConfig: EmailProperties,
 ) {
+
     fun sendJohtoselvitysCompleteEmail(
         to: String,
         applicationId: Long?,
         applicationIdentifier: String,
     ) {
         logger.info { "Sending email for completed johtoselvitys $applicationIdentifier" }
+
         val templateData =
             mapOf(
                 "baseUrl" to emailConfig.baseUrl,

diff --git a/services/hanke-service/src/main/resources/email/template/johtoselvitys-valmis.html.mustache b/services/hanke-service/src/main/resources/email/template/johtoselvitys-valmis.html.mustache
diff --git a/services/hanke-service/src/main/resources/email/template/johtoselvitys-valmis.mjml b/services/hanke-service/src/main/resources/email/template/johtoselvitys-valmis.mjml
@@ -0,0 +1,138 @@
+<mjml>
+    <mj-body>
+        <mj-section>
+            <mj-column>
+                <mj-text padding="16px 24px 0px 24px">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="131" height="60" viewBox="0 0 131 60" fill="none">
+                        <path fill-rule="evenodd" clip-rule="evenodd"
+                              d="M126.726 3.75164V38.251C126.726 44.836 121.268 50.2143 114.544 50.2143H77.4422C72.9858 50.2143 68.7667 51.8146 65.4706 54.7792C62.1744 51.8408 57.9554 50.2143 53.499 50.2143H16.3185C9.64705 50.2143 4.24137 44.8623 4.24137 38.251V3.75164H126.726ZM67.4483 58.0586C70.1115 55.4088 73.6714 53.9397 77.4686 53.9397H114.544C123.325 53.9397 130.471 46.9086 130.471 38.251V0H0.470581V38.2247C0.470581 46.8824 7.56389 53.9134 16.3185 53.9134H53.499C57.2698 53.9134 60.8296 55.3826 63.5193 58.0324L65.4969 60L67.4483 58.0586Z"
+                              fill="black"/>
+                        <path fill-rule="evenodd" clip-rule="evenodd"
+                              d="M113.008 19.4591C113.008 20.5954 112.081 21.4218 110.915 21.4218C109.75 21.4218 108.823 20.5954 108.823 19.4591C108.823 18.3228 109.75 17.4964 110.915 17.4964C112.081 17.4448 113.008 18.2712 113.008 19.4591ZM109.088 35.4961H112.717V22.9196H109.088V35.4961ZM102.572 27.9037L107.313 35.4961H103.367L100.189 30.4604L98.4671 32.578V35.4961H94.865V17.4189H98.4671V25.7603C98.4671 27.3098 98.2817 28.8592 98.2817 28.8592H98.3612C98.3612 28.8592 99.2087 27.4905 99.9238 26.5092L102.678 22.9196H106.916L102.572 27.9037ZM91.21 27.4389C91.21 24.3141 89.6473 22.6097 87.1576 22.6097C85.0388 22.6097 83.9263 23.8234 83.2907 24.9855H83.2112L83.3966 22.9196H79.7945V35.4961H83.3966V28.0328C83.3966 26.5867 84.2707 25.5795 85.6214 25.5795C86.9722 25.5795 87.5549 26.4575 87.5549 28.1361V35.4961H91.1835L91.21 27.4389ZM76.3249 19.4591C76.3249 20.5954 75.3979 21.4218 74.2325 21.4218C73.0671 21.4218 72.1401 20.5954 72.1401 19.4591C72.1401 18.3228 73.0671 17.4964 74.2325 17.4964C75.4244 17.4448 76.3249 18.2712 76.3249 19.4591ZM72.405 35.4961H76.0335V22.9196H72.405V35.4961ZM66.1543 31.984C66.1543 30.9768 64.7241 30.7703 63.0554 30.3054C61.122 29.8147 58.6853 28.8592 58.6853 26.4575C58.6853 24.0817 61.016 22.5839 63.7706 22.5839C66.3397 22.5839 68.6969 23.7718 69.6769 25.4504L66.5781 27.1548C66.2602 26.0444 65.3067 25.1663 63.8765 25.1663C62.9495 25.1663 62.1814 25.5537 62.1814 26.3026C62.1814 27.2581 63.8765 27.3614 65.7835 27.9554C67.7964 28.5752 69.6504 29.479 69.6504 31.7774C69.6504 34.3082 67.2402 35.806 64.4592 35.806C61.4398 35.806 59.0561 34.5665 57.9966 32.5521L61.1485 30.8219C61.5457 32.1906 62.6846 33.2236 64.4062 33.2236C65.4392 33.2236 66.1543 32.8104 66.1543 31.984ZM54.6859 17.5222H51.0573V32.0098C51.0573 33.3011 51.3487 34.2566 51.9049 34.8505C52.4876 35.4445 53.3881 35.7286 54.6329 35.7286C55.0567 35.7286 55.507 35.6769 55.9307 35.5994C56.381 35.4961 56.7253 35.367 57.0167 35.2121L57.3345 32.8362C57.0431 32.9395 56.8048 33.017 56.5664 33.0428C56.3545 33.0945 56.0896 33.0945 55.7983 33.0945C55.3216 33.0945 55.1097 32.9653 54.9507 32.7329C54.7654 32.5005 54.6859 32.0873 54.6859 31.4933V17.5222ZM42.6083 25.1405C41.284 25.1405 40.1981 26.0702 39.9067 27.7746H44.992C45.0185 26.2768 44.0121 25.1405 42.6083 25.1405ZM48.1968 30.1505H39.8538C40.0127 32.1906 41.1781 33.1978 42.6878 33.1978C44.0386 33.1978 44.9656 32.3197 45.1774 31.1318L48.2233 32.8104C47.3228 34.4115 45.3893 35.806 42.6878 35.806C39.0857 35.806 36.4371 33.3527 36.4371 29.2208C36.4371 25.1147 39.1387 22.6355 42.6083 22.6355C46.078 22.6355 48.3822 25.0372 48.3822 28.446C48.3558 29.4532 48.1968 30.1505 48.1968 30.1505ZM29.7362 35.4961H33.4972V18.1937H29.7362V25.0372H22.6644V18.2195H18.9034V35.4961H22.6644V28.3427H29.7362V35.4961Z"
+                              fill="black"/>
+                    </svg>
+                </mj-text>
+            </mj-column>
+        </mj-section>
+        <mj-section>
+            <mj-column>
+                <mj-text padding="0px 24px 16px 24px" font-family="Arial" font-size="36px">Haitaton: Johtoselvitys
+                    {{applicationIdentifier}}
+                </mj-text>
+                <mj-text padding="0px 24px 16px 24px" font-family="Arial" font-size="16px">
+                    Hakemanne johtoselvitys {{applicationIdentifier}} on käsitelty. Lataa selvitys Haitattomasta <a
+                        href="{{baseUrl}}/fi/hakemus/{{applicationId}}">{{baseUrl}}/fi/hakemus/{{applicationId}}
+                </a> ja
+                    tutustu sen
+                    sisältöön huolellisesti.
+                </mj-text>
+                <mj-text padding="16px 24px 16px 24px" font-family="Arial" font-size="16px">
+                    Miten onnistuimme? Kerro mielipiteesi <a
+                        href="https://response.questback.com/isa/qbv.dll/bylink?p=x6TIpQ4sCcJt9Dv1T-AuuKa-DssX27rx6er2ohTVVipooPTA8H0u-weNFWY9GsVI0">
+                    täällä</a>.
+                </mj-text>
+                <mj-text padding="16px 24px 16px 24px" font-family="Arial" font-size="16px">
+                    Ystävällisin terveisin,
+                    <br/>
+                    <br/>
+                    Helsingin kaupunkiympäristön asukas- ja yrityspalvelut
+                    <br/>
+                    Alueidenkäyttö ja -valvonta
+                    <br/>
+                    Johtotietopalvelu
+                    <br/>
+                    Puh. 09 310 31940
+                    <br/>
+                    [email protected]
+                </mj-text>
+            </mj-column>
+        </mj-section>
+        <mj-section>
+            <mj-column>
+                <mj-text padding="0px 24px 16px 24px" font-family="Arial" font-size="36px">
+                    Haitaton: Ledningsutredning {{applicationIdentifier}}
+                </mj-text>
+                <mj-text padding="0px 24px 16px 24px" font-family="Arial" font-size="16px">
+                    Ledningsutredningen {{applicationIdentifier}} ni ansökt om har behandlats. Ladda ned utredningen
+                    från Haitaton
+                    <a href="{{baseUrl}}/sv/ansokan/{{applicationId}}">
+                        {{baseUrl}}/sv/ansokan/{{applicationId}}
+                    </a>
+                    och läs
+                    innehållet i den noggrannt.
+                </mj-text>
+                <mj-text padding="16px 24px 16px 24px" font-family="Arial" font-size="16px">
+                    Hur lyckades vi? Ge din åsikt <a
+                        href="https://response.questback.com/isa/qbv.dll/bylink?p=x6TIpQ4sCcJt9Dv1T-AuuKa-DssX27rx6er2ohTVVipooPTA8H0u-weNFWY9GsVI0">
+                    här</a>.
+                </mj-text>
+                <mj-text padding="16px 24px 16px 24px" font-family="Arial" font-size="16px">
+                    Med vänlig hälsning,
+                    <br/>
+                    <br/>
+                    Helsingfors stadsmiljös boende- och företagstjänster
+                    <br/>
+                    Användning och tillsyn av områden
+                    <br/>
+                    Ledningstjänsten
+                    <br/>
+                    Tfn 09 310 31940
+                    <br/>
+                    [email protected]
+                </mj-text>
+            </mj-column>
+        </mj-section>
+        <mj-section>
+            <mj-column>
+                <mj-text padding="0px 24px 16px 24px" font-family="Arial" font-size="36px">
+                    Haitaton: Cable report {{applicationIdentifier}}
+                </mj-text>
+                <mj-text padding="0px 24px 16px 24px" font-family="Arial" font-size="16px">
+                    Cable report {{applicationIdentifier}} that you requested has been processed. Download the
+                    report
+                    via Haitaton <a href="{{baseUrl}}/en/application/{{applicationId}}">
+                    {{baseUrl}}/en/application/{{applicationId}}
+                </a> and read it carefully.
+                </mj-text>
+                <mj-text padding="16px 24px 16px 24px" font-family="Arial" font-size="16px">
+                    How did we do? Please share your opinion <a
+                        href="https://response.questback.com/isa/qbv.dll/bylink?p=x6TIpQ4sCcJt9Dv1T-AuuKa-DssX27rx6er2ohTVVipooPTA8H0u-weNFWY9GsVI0">
+                    here</a>.
+                </mj-text>
+                <mj-text padding="16px 24px 16px 24px" font-family="Arial" font-size="16px">
+                    Kind regards,
+                    <br/>
+                    <br/>
+                    Helsinki Urban Environment Resident and Business Services
+                    <br/>
+                    Land Use and Monitoring
+                    <br/>
+                    Cable Location Service
+                    <br/>
+                    Tel. +358 9 310 31940
+                    <br/>
+                    [email protected]
+                    <br/>
+                </mj-text>
+            </mj-column>
+        </mj-section>
+        <mj-section background-color="#FFC61E">
+            <mj-column>
+                <mj-text padding="5px 0px 16px 24px">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="87" height="40" viewBox="0 0 87 40" fill="none">
+                        <path fill-rule="evenodd" clip-rule="evenodd"
+                              d="M84.4941 2.50109V25.5007C84.4941 29.8907 80.8412 33.4762 76.3412 33.4762H51.5118C48.5294 33.4762 45.7059 34.5431 43.5 36.5195C41.2941 34.5606 38.4706 33.4762 35.4882 33.4762H10.6059C6.14118 33.4762 2.52353 29.9082 2.52353 25.5007V2.50109H84.4941ZM44.8235 38.7057C46.6059 36.9392 48.9882 35.9598 51.5294 35.9598H76.3412C82.2177 35.9598 87 31.2724 87 25.5007V0H0V25.4832C0 31.2549 4.74706 35.9423 10.6059 35.9423H35.4882C38.0118 35.9423 40.3941 36.9217 42.1941 38.6882L43.5176 40L44.8235 38.7057Z"
+                              fill="black"/>
+                        <path fill-rule="evenodd" clip-rule="evenodd"
+                              d="M75.3134 12.9734C75.3134 13.7309 74.693 14.2818 73.9131 14.2818C73.1332 14.2818 72.5128 13.7309 72.5128 12.9734C72.5128 12.2159 73.1332 11.6649 73.9131 11.6649C74.693 11.6305 75.3134 12.1814 75.3134 12.9734ZM72.6901 23.6647H75.1185V15.2804H72.6901V23.6647ZM68.3297 18.6031L71.5025 23.6647H68.8615L66.7344 20.3076L65.5823 21.7193V23.6647H63.1717V11.6133H65.5823V17.1742C65.5823 18.2072 65.4582 19.2401 65.4582 19.2401H65.5114C65.5114 19.2401 66.0786 18.3277 66.5572 17.6734L68.4006 15.2804H71.2366L68.3297 18.6031ZM60.7256 18.2932C60.7256 16.2101 59.6798 15.0738 58.0136 15.0738C56.5956 15.0738 55.8512 15.8829 55.4258 16.6577H55.3726L55.4967 15.2804H53.086V23.6647H55.4967V18.6892C55.4967 17.7251 56.0816 17.0537 56.9856 17.0537C57.8896 17.0537 58.2795 17.639 58.2795 18.7581V23.6647H60.7079L60.7256 18.2932ZM50.764 12.9734C50.764 13.7309 50.1437 14.2818 49.3637 14.2818C48.5838 14.2818 47.9635 13.7309 47.9635 12.9734C47.9635 12.2159 48.5838 11.6649 49.3637 11.6649C50.1614 11.6305 50.764 12.1814 50.764 12.9734ZM48.1407 23.6647H50.5691V15.2804H48.1407V23.6647ZM43.9576 21.3233C43.9576 20.6519 43.0004 20.5142 41.8837 20.2043C40.5898 19.8771 38.9591 19.2401 38.9591 17.639C38.9591 16.0551 40.5189 15.0566 42.3623 15.0566C44.0816 15.0566 45.6592 15.8485 46.315 16.9676L44.2412 18.1039C44.0285 17.3636 43.3904 16.7782 42.4332 16.7782C41.8128 16.7782 41.2988 17.0364 41.2988 17.5357C41.2988 18.1727 42.4332 18.2416 43.7094 18.6376C45.0565 19.0508 46.2973 19.6533 46.2973 21.1856C46.2973 22.8728 44.6843 23.8713 42.8231 23.8713C40.8025 23.8713 39.2072 23.045 38.4982 21.7021L40.6075 20.5486C40.8734 21.4611 41.6356 22.1497 42.7877 22.1497C43.479 22.1497 43.9576 21.8742 43.9576 21.3233ZM36.2826 11.6821H33.8542V21.3405C33.8542 22.2014 34.0492 22.8384 34.4214 23.2343C34.8114 23.6303 35.414 23.8197 36.2471 23.8197C36.5307 23.8197 36.832 23.7853 37.1156 23.7336C37.417 23.6647 37.6474 23.5787 37.8424 23.4754L38.0551 21.8915C37.8601 21.9603 37.7006 22.012 37.541 22.0292C37.3992 22.0636 37.222 22.0636 37.027 22.0636C36.708 22.0636 36.5662 21.9775 36.4598 21.8226C36.3357 21.6676 36.2826 21.3922 36.2826 20.9962V11.6821ZM28.1999 16.761C27.3136 16.761 26.5869 17.3808 26.3919 18.5171H29.7951C29.8129 17.5185 29.1393 16.761 28.1999 16.761ZM31.9399 20.101H26.3564C26.4628 21.4611 27.2427 22.1325 28.253 22.1325C29.157 22.1325 29.7774 21.5471 29.9192 20.7552L31.9576 21.8742C31.3549 22.9417 30.061 23.8713 28.253 23.8713C25.8424 23.8713 24.0699 22.2358 24.0699 19.4812C24.0699 16.7438 25.8779 15.091 28.1999 15.091C30.5219 15.091 32.064 16.6921 32.064 18.9647C32.0462 19.6361 31.9399 20.101 31.9399 20.101ZM19.5854 23.6647H22.1024V12.1298H19.5854V16.6921H14.8528V12.147H12.3358V23.6647H14.8528V18.8958H19.5854V23.6647Z"
+                              fill="black"/>
+                    </svg>
+                </mj-text>
+                <mj-divider border-color="#999898" border-width="1px" padding="0px 24px 16px 24px"/>
+                <mj-text padding="0px 24px 0px 24px" color="#000000" font-family="Arial" font-size="16px">© Helsingin
+                    kaupunki 2023
+                </mj-text>
+            </mj-column>
+        </mj-section>
+    </mj-body>
+</mjml>
diff --git a/services/hanke-service/src/main/resources/email/template/johtoselvitys-valmis.text.mustache b/services/hanke-service/src/main/resources/email/template/johtoselvitys-valmis.text.mustache
@@ -1,3 +1,5 @@
+Haitaton: Johtoselvitys {{applicationIdentifier}}
+
 Hakemanne johtoselvitys {{applicationIdentifier}} on käsitelty. Lataa selvitys Haitattomasta ({{baseUrl}}/fi/hakemus/{{applicationId}}) ja tutustu sen sisältöön huolellisesti.
 
 Miten onnistuimme? Kerro mielipiteesi täällä: https://response.questback.com/isa/qbv.dll/bylink?p=x6TIpQ4sCcJt9Dv1T-AuuKa-DssX27rx6er2ohTVVipooPTA8H0u-weNFWY9GsVI0.
@@ -10,6 +12,8 @@ Puh. 09 310 31940
 [email protected]
 
 
+Haitaton: Ledningsutredning {{applicationIdentifier}}
+
 Ledningsutredningen {{applicationIdentifier}} ni ansökt om har behandlats. Ladda ned utredningen från Haitaton ({{baseUrl}}/sv/ansokan/{{applicationId}}) och läs innehållet i den noggrannt.
 
 Hur lyckades vi? Ge din åsikt här: https://response.questback.com/isa/qbv.dll/bylink?p=x6TIpQ4sCcJt9Dv1T-AuuKa-DssX27rx6er2ohTVVipooPTA8H0u-weNFWY9GsVI0.
@@ -22,6 +26,8 @@ Tfn 09 310 31940
 [email protected]
 
 
+Haitaton: Cable report {{applicationIdentifier}}
+
 Cable report {{applicationIdentifier}} that you requested has been processed. Download the report via Haitaton ({{baseUrl}}/en/application/{{applicationId}}) and read it carefully.
 
 How did we do? Please share your opinion here: https://response.questback.com/isa/qbv.dll/bylink?p=x6TIpQ4sCcJt9Dv1T-AuuKa-DssX27rx6er2ohTVVipooPTA8H0u-weNFWY9GsVI0.