add email theme (#214)

* add email theme

* add changelog entry

CHANGELOG.md

@@ -7,6 +7,9 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 
 ## [Unreleased]
 
+### Added
+- Incore-theme for emails sent through KeyCloak. [#212](https://github.com/IN-CORE/incore-ui/issues/212)
+
 ### Changed
 - Restrict unapproved user from performing any action or accessing any resources. [#206](https://github.com/IN-CORE/incore-ui/issues/206)
 - Convert DataViewer and DFR3Viewer into Functional based components. [#183](https://github.com/IN-CORE/incore-ui/issues/183)

keycloakSetup/keycloakThemes/incore-theme/email/html/email-test.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("emailTestBodyHtml",realmName))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/email-update-confirmation.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("emailUpdateConfirmationBodyHtml",link, newEmail, realmName, linkExpirationFormatter(linkExpiration)))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/email-verification-with-code.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("emailVerificationBodyCodeHtml",code))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/email-verification.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("emailVerificationBodyHtml",link, linkExpiration, realmName, linkExpirationFormatter(linkExpiration)))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/event-login_error.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("eventLoginErrorBodyHtml",event.date,event.ipAddress))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/event-remove_totp.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("eventRemoveTotpBodyHtml",event.date, event.ipAddress))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/event-update_password.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("eventUpdatePasswordBodyHtml",event.date, event.ipAddress))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/event-update_totp.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("eventUpdateTotpBodyHtml",event.date, event.ipAddress))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/executeActions.ftl

@@ -0,0 +1,8 @@
+<#outputformat "plainText">
+<#assign requiredActionsText><#if requiredActions??><#list requiredActions><#items as reqActionItem>${msg("requiredAction.${reqActionItem}")}<#sep>, </#sep></#items></#list></#if></#assign>
+</#outputformat>
+
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("executeActionsBodyHtml",link, linkExpiration, realmName, requiredActionsText, linkExpirationFormatter(linkExpiration)))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/identity-provider-link.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("identityProviderLinkBodyHtml", identityProviderDisplayName, realmName, identityProviderContext.username, link, linkExpiration, linkExpirationFormatter(linkExpiration)))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/org-invite.ftl

@@ -0,0 +1,8 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+<#if firstName?? && lastName??>
+    ${kcSanitize(msg("orgInviteBodyPersonalizedHtml", link, linkExpiration, realmName, organization.name, linkExpirationFormatter(linkExpiration), firstName, lastName))?no_esc}
+<#else>
+    ${kcSanitize(msg("orgInviteBodyHtml", link, linkExpiration, realmName, organization.name, linkExpirationFormatter(linkExpiration)))?no_esc}
+</#if>
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/password-reset.ftl

@@ -0,0 +1,4 @@
+<#import "template.ftl" as layout>
+<@layout.emailLayout>
+${kcSanitize(msg("passwordResetBodyHtml",link, linkExpiration, realmName, linkExpirationFormatter(linkExpiration)))?no_esc}
+</@layout.emailLayout>

keycloakSetup/keycloakThemes/incore-theme/email/html/template.ftl

@@ -0,0 +1,68 @@
+<#macro emailLayout>
+<html  lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>IN-CORE</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            margin: 0;
+            padding: 0;
+            background-color: #f4f4f4;
+        }
+        .container {
+            max-width: 600px;
+            margin: 0 auto;
+            background-color: #ffffff;
+            padding: 20px;
+            border-radius: 8px;
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+        }
+        .header {
+            text-align: center;
+            padding: 10px 0;
+        }
+        .header img {
+            width: 150px;
+        }
+        .content {
+            margin: 20px 0;
+        }
+        .content h1 {
+            font-size: 24px;
+            color: #333333;
+        }
+        .content p {
+            font-size: 16px;
+            color: #666666;
+            line-height: 1.6;
+        }
+        .footer {
+            text-align: center;
+            padding: 20px 0;
+            font-size: 14px;
+            color: #999999;
+        }
+        .footer a {
+            color: #0066cc;
+            text-decoration: none;
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <div class="header">
+            <img src="https://incore.ncsa.illinois.edu/public/resilience-logo.png" alt="IN-CORE Logo">
+        </div>
+        <div class="content">
+            <#nested>
+        </div>
+        <div class="footer">
+            <p>Questions regarding your account? Contact us at <a href="mailto:[email protected]">[email protected]</a>.</p>
+        </div>
+    </div>
+
+</body>
+</html>
+</#macro>

keycloakSetup/keycloakThemes/incore-theme/email/messages/messages_en.properties

@@ -0,0 +1,55 @@
+emailVerificationSubject=Verify email
+emailVerificationBody=Someone has created a {2} account with this email address. If this was you, click the link below to verify your email address\n\n{0}\n\nThis link will expire within {3}.\n\nIf you didn''t create this account, just ignore this message.
+emailVerificationBodyHtml=<p>Someone has created a {2} account with this email address. If this was you, click the link below to verify your email address</p><p><a href="{0}">Link to e-mail address verification</a></p><p>This link will expire within {3}.</p><p>If you didn''t create this account, just ignore this message.</p>
+orgInviteSubject=Invitation to join the {0} organization
+orgInviteBody=You were invited to join the "{3}" organization. Click the link below to join.\n\n{0}\n\nThis link will expire within {4}.\n\nIf you don't want to join the organization, just ignore this message.
+orgInviteBodyHtml=<p>You were invited to join the {3} organization. Click the link below to join. </p><p><a href="{0}">Link to join the organization</a></p><p>This link will expire within {4}.</p><p>If you don't want to join the organization, just ignore this message.</p>
+orgInviteBodyPersonalized=Hi, "{5}" "{6}".\n\n You were invited to join the "{3}" organization. Click the link below to join.\n\n{0}\n\nThis link will expire within {4}.\n\nIf you don't want to join the organization, just ignore this message.
+orgInviteBodyPersonalizedHtml=<p>Hi, {5} {6}.</p><p>You were invited to join the {3} organization. Click the link below to join. </p><p><a href="{0}">Link to join the organization</a></p><p>This link will expire within {4}.</p><p>If you don't want to join the organization, just ignore this message.</p>
+emailUpdateConfirmationSubject=Verify new email
+emailUpdateConfirmationBody=To update your {2} account with email address {1}, click the link below\n\n{0}\n\nThis link will expire within {3}.\n\nIf you don''t want to proceed with this modification, just ignore this message.
+emailUpdateConfirmationBodyHtml=<p>To update your {2} account with email address {1}, click the link below</p><p><a href="{0}">{0}</a></p><p>This link will expire within {3}.</p><p>If you don''t want to proceed with this modification, just ignore this message.</p>
+emailTestSubject=[KEYCLOAK] - SMTP test message
+emailTestBody=This is a test message
+emailTestBodyHtml=<p>This is a test message</p>
+identityProviderLinkSubject=Link {0}
+identityProviderLinkBody=Someone wants to link your "{1}" account with "{0}" account of user {2} . If this was you, click the link below to link accounts\n\n{3}\n\nThis link will expire within {5}.\n\nIf you don''t want to link account, just ignore this message. If you link accounts, you will be able to login to {1} through {0}.
+identityProviderLinkBodyHtml=<p>Someone wants to link your <b>{1}</b> account with <b>{0}</b> account of user {2}. If this was you, click the link below to link accounts</p><p><a href="{3}">Link to confirm account linking</a></p><p>This link will expire within {5}.</p><p>If you don''t want to link account, just ignore this message. If you link accounts, you will be able to login to {1} through {0}.</p>
+passwordResetSubject=Reset password
+passwordResetBody=Someone just requested to change your {2} account''s credentials. If this was you, click on the link below to reset them.\n\n{0}\n\nThis link and code will expire within {3}.\n\nIf you don''t want to reset your credentials, just ignore this message and nothing will be changed.
+passwordResetBodyHtml=<p>Someone just requested to change your {2} account''s credentials. If this was you, click on the link below to reset them.</p><p><a href="{0}">Link to reset credentials</a></p><p>This link will expire within {3}.</p><p>If you don''t want to reset your credentials, just ignore this message and nothing will be changed.</p>
+executeActionsSubject=Update Your Account
+executeActionsBody=Your administrator has just requested that you update your {2} account by performing the following action(s): {3}. Click on the link below to start this process.\n\n{0}\n\nThis link will expire within {4}.\n\nIf you are unaware that your administrator has requested this, just ignore this message and nothing will be changed.
+executeActionsBodyHtml=<p>Your administrator has just requested that you update your {2} account by performing the following action(s): {3}. Click on the link below to start this process.</p><p><a href="{0}">Link to account update</a></p><p>This link will expire within {4}.</p><p>If you are unaware that your administrator has requested this, just ignore this message and nothing will be changed.</p>
+eventLoginErrorSubject=Login error
+eventLoginErrorBody=A failed login attempt was detected to your account on {0} from {1}. If this was not you, please contact an administrator.
+eventLoginErrorBodyHtml=<p>A failed login attempt was detected to your account on {0} from {1}. If this was not you, please contact an administrator.</p>
+eventRemoveTotpSubject=Remove OTP
+eventRemoveTotpBody=OTP was removed from your account on {0} from {1}. If this was not you, please contact an administrator.
+eventRemoveTotpBodyHtml=<p>OTP was removed from your account on {0} from {1}. If this was not you, please contact an administrator.</p>
+eventUpdatePasswordSubject=Update password
+eventUpdatePasswordBody=Your password was changed on {0} from {1}. If this was not you, please contact an administrator.
+eventUpdatePasswordBodyHtml=<p>Your password was changed on {0} from {1}. If this was not you, please contact an administrator.</p>
+eventUpdateTotpSubject=Update OTP
+eventUpdateTotpBody=OTP was updated for your account on {0} from {1}. If this was not you, please contact an administrator.
+eventUpdateTotpBodyHtml=<p>OTP was updated for your account on {0} from {1}. If this was not you, please contact an administrator.</p>
+
+requiredAction.CONFIGURE_TOTP=Configure OTP
+requiredAction.TERMS_AND_CONDITIONS=Terms and Conditions
+requiredAction.UPDATE_PASSWORD=Update Password
+requiredAction.UPDATE_PROFILE=Update Profile
+requiredAction.VERIFY_EMAIL=Verify Email
+requiredAction.CONFIGURE_RECOVERY_AUTHN_CODES=Generate Recovery Codes
+
+# units for link expiration timeout formatting
+# for languages which have more unit plural forms depending on the value (eg. Czech and other Slavic langs) you can override unit text for some other values like described in the Java choice format which is documented here. For Czech, it would be '{0,choice,0#minut|1#minuta|2#minuty|2<minut}'
+# https://docs.oracle.com/en/java/javase/17/docs/api/java.base/java/text/MessageFormat.html
+# https://docs.oracle.com/en/java/javase/17/docs/api/java.base/java/text/ChoiceFormat.html
+linkExpirationFormatter.timePeriodUnit.seconds={0,choice,0#seconds|1#second|1<seconds}
+linkExpirationFormatter.timePeriodUnit.minutes={0,choice,0#minutes|1#minute|1<minutes}
+linkExpirationFormatter.timePeriodUnit.hours={0,choice,0#hours|1#hour|1<hours}
+linkExpirationFormatter.timePeriodUnit.days={0,choice,0#days|1#day|1<days}
+
+emailVerificationBodyCode=Please verify your email address by entering in the following code.\n\n{0}\n\n.
+emailVerificationBodyCodeHtml=<p>Please verify your email address by entering in the following code.</p><p><b>{0}</b></p>
+

keycloakSetup/keycloakThemes/incore-theme/email/text/email-test.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("emailTestBody", realmName)}

keycloakSetup/keycloakThemes/incore-theme/email/text/email-update-confirmation.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("emailUpdateConfirmationBody",link, newEmail, realmName, linkExpirationFormatter(linkExpiration))}

keycloakSetup/keycloakThemes/incore-theme/email/text/email-verification-with-code.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("emailVerificationBodyCode",code)}

keycloakSetup/keycloakThemes/incore-theme/email/text/email-verification.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("emailVerificationBody",link, linkExpiration, realmName, linkExpirationFormatter(linkExpiration))}

keycloakSetup/keycloakThemes/incore-theme/email/text/event-login_error.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("eventLoginErrorBody",event.date,event.ipAddress)}

keycloakSetup/keycloakThemes/incore-theme/email/text/event-remove_totp.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("eventRemoveTotpBody",event.date, event.ipAddress)}

keycloakSetup/keycloakThemes/incore-theme/email/text/event-update_password.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("eventUpdatePasswordBody",event.date, event.ipAddress)}

keycloakSetup/keycloakThemes/incore-theme/email/text/event-update_totp.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("eventUpdateTotpBody",event.date, event.ipAddress)}

keycloakSetup/keycloakThemes/incore-theme/email/text/executeActions.ftl

@@ -0,0 +1,4 @@
+<#ftl output_format="plainText">
+<#assign requiredActionsText><#if requiredActions??><#list requiredActions><#items as reqActionItem>${msg("requiredAction.${reqActionItem}")}<#sep>, </#items></#list><#else></#if></#assign>
+
+${msg("executeActionsBody",link, linkExpiration, realmName, requiredActionsText, linkExpirationFormatter(linkExpiration))}

keycloakSetup/keycloakThemes/incore-theme/email/text/identity-provider-link.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("identityProviderLinkBody", identityProviderDisplayName, realmName, identityProviderContext.username, link, linkExpiration, linkExpirationFormatter(linkExpiration))}

keycloakSetup/keycloakThemes/incore-theme/email/text/org-invite.ftl

@@ -0,0 +1,8 @@
+<#ftl output_format="plainText">
+
+<#if firstName?? && lastName??>
+    ${kcSanitize(msg("orgInviteBodyPersonalized", link, linkExpiration, realmName, organization.name, linkExpirationFormatter(linkExpiration), firstName, lastName))}
+<#else>
+    ${kcSanitize(msg("orgInviteBody", link, linkExpiration, realmName, organization.name, linkExpirationFormatter(linkExpiration)))}
+</#if>
+

keycloakSetup/keycloakThemes/incore-theme/email/text/password-reset.ftl

@@ -0,0 +1,2 @@
+<#ftl output_format="plainText">
+${msg("passwordResetBody",link, linkExpiration, realmName, linkExpirationFormatter(linkExpiration))}