Merge pull request #369 from MuhammadKhalilzadeh/email-templates

Email templates
This commit is contained in:
Alexander Holliday
2024-07-18 07:39:41 -07:00
committed by GitHub
10 changed files with 4303 additions and 11 deletions

1883
Client/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -25,6 +25,7 @@
"dayjs": "1.11.11",
"joi": "17.13.1",
"jwt-decode": "^4.0.0",
"mjml-react": "^2.0.8",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-redux": "9.1.2",

2107
Server/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -22,6 +22,7 @@
"joi": "^17.13.1",
"jsonwebtoken": "9.0.2",
"mailersend": "^2.2.0",
"mjml": "^1.3.4",
"mongoose": "^8.3.3",
"multer": "1.4.5-lts.1",
"ping": "0.4.4",

View File

@@ -0,0 +1,34 @@
<mjml>
<mj-head>
<mj-font name="Roboto" href="https://fonts.googleapis.com/css?family=Roboto:300,500"></mj-font>
<mj-attributes>
<mj-all font-family="Roboto, Helvetica, sans-serif"></mj-all>
<mj-text font-weight="300" font-size="16px" color="#616161" line-height="24px"></mj-text>
<mj-section padding="0px"></mj-section>
</mj-attributes>
</mj-head>
<mj-body>
<mj-section padding="20px 0">
<mj-column width="100%">
<mj-text align="left" font-size="10px">Message from BlueWave Uptime Service</mj-text>
</mj-column>
</mj-section>
<mj-section>
<mj-column width="100%">
<mj-text>
<p>Hello Alex!</p>
<p>One of the admins created an account for you on the BlueWave Uptime server.</p>
<p>You can go ahead and create your account using this link.</p>
<p><a href="https://example.com">https://example.com</a></p>
<p>Thank you.</p>
</mj-text>
</mj-column>
<mj-column width="100%">
<mj-divider border-width="1px" border-color="#E0E0E0"></mj-divider>
<mj-text font-size="12px">
<p>This email was sent by BlueWave Uptime.</p>
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>

View File

@@ -0,0 +1,38 @@
<mjml>
<mj-head>
<mj-font name="Roboto" href="https://fonts.googleapis.com/css?family=Roboto:300,500"></mj-font>
<mj-attributes>
<mj-all font-family="Roboto, Helvetica, sans-serif"></mj-all>
<mj-text font-weight="300" font-size="16px" color="#616161" line-height="24px"></mj-text>
<mj-section padding="0px"></mj-section>
</mj-attributes>
</mj-head>
<mj-body>
<mj-section padding="20px 0">
<mj-column width="100%">
<mj-text align="left" font-size="10px">Message from BlueWave Uptime Service</mj-text>
</mj-column>
<mj-column width="45%" padding-top="20px">
<mj-text align="center" font-weight="500" padding="0px" font-size="18px" color="green">No incidents this week!</mj-text>
<mj-divider border-width="2px" border-color="#616161"></mj-divider>
</mj-column>
</mj-section>
<mj-section>
<mj-column width="100%">
<mj-text>
<p>Hello Alex!</p>
<p>There were no incidents this week. Good job!</p>
<p><b>Current monitors:</b></p>
<p><b>Google:</b> 100% availability</p>
<p><b>Canada.ca:</b>100% availability</p>
</mj-text>
</mj-column>
<mj-column width="100%">
<mj-divider border-width="1px" border-color="#E0E0E0"></mj-divider>
<mj-text font-size="12px">
<p>This email was sent by BlueWave Uptime.</p>
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>

View File

@@ -0,0 +1,51 @@
<mjml>
<mj-head>
<mj-font
name="Roboto"
href="https://fonts.googleapis.com/css?family=Roboto:300,500"
></mj-font>
<mj-attributes>
<mj-all font-family="Roboto, Helvetica, sans-serif"></mj-all>
<mj-text
font-weight="300"
font-size="16px"
color="#616161"
line-height="24px"
></mj-text>
<mj-section padding="0px"></mj-section>
</mj-attributes>
</mj-head>
<mj-body>
<mj-section padding="20px 0">
<mj-column width="100%">
<mj-text align="left" font-size="10px">
Message from BlueWave Uptime Service
</mj-text>
</mj-column>
</mj-section>
<mj-section>
<mj-column width="100%">
<mj-text>
<p>Hello Alex!</p>
<p>
You are receiving this email because a password reset request
has been made for gorkem.cetin@bluewavelabs.ca. Please use the
code below on the site to reset your password.
</p>
<p>
Verification Code: <b>4CCDFC45</b>
</p>
<p>If you didn't request this, please ignore this email.</p>
<p>Thank you.</p>
</mj-text>
</mj-column>
<mj-column width="100%">
<mj-divider border-width="1px" border-color="#E0E0E0"></mj-divider>
<mj-text font-size="12px">
<p>This email was sent by BlueWave Uptime.</p>
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>

View File

@@ -0,0 +1,71 @@
<mjml>
<mj-head>
<mj-font
name="Roboto"
href="https://fonts.googleapis.com/css?family=Roboto:300,500"
></mj-font>
<mj-attributes>
<mj-all font-family="Roboto, Helvetica, sans-serif"></mj-all>
<mj-text
font-weight="300"
font-size="16px"
color="#616161"
line-height="24px"
></mj-text>
<mj-section padding="0px"></mj-section>
</mj-attributes>
</mj-head>
<mj-body>
<mj-section padding="20px 0">
<mj-column width="100%">
<mj-text align="left" font-size="10px">
Message from BlueWave Uptime Service
</mj-text>
</mj-column>
<mj-column width="45%" padding-top="20px">
<mj-text
align="center"
font-weight="500"
padding="0px"
font-size="18px"
color="red"
>
Google.com is down
</mj-text>
<mj-divider border-width="2px" border-color="#616161"></mj-divider>
</mj-column>
</mj-section>
<mj-section>
<mj-column width="100%">
<mj-text>
<p>Hello Alex!</p>
<p>
We detected an incident on one of your monitors. Your service is
currently down. We'll send a message to you once it is up again.
</p>
<p>
<b>Monitor name:</b> Google.com
</p>
<p>
<b>URL:</b> https://google.com
</p>
<p>
<b>Problem:</b> Connection timeout
</p>
<p>
<b>Start date:</b> Jun 8, 2024 8:15pm
</p>
</mj-text>
</mj-column>
<mj-column width="100%">
<mj-divider border-width="1px" border-color="#E0E0E0"></mj-divider>
<mj-button background-color="#1570EF">
View incident details
</mj-button>
<mj-text font-size="12px">
<p>This email was sent by BlueWave Uptime.</p>
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>

View File

@@ -0,0 +1,77 @@
<mjml>
<mj-head>
<mj-font
name="Roboto"
href="https://fonts.googleapis.com/css?family=Roboto:300,500"
></mj-font>
<mj-attributes>
<mj-all font-family="Roboto, Helvetica, sans-serif"></mj-all>
<mj-text
font-weight="300"
font-size="16px"
color="#616161"
line-height="24px"
></mj-text>
<mj-section padding="0px"></mj-section>
</mj-attributes>
</mj-head>
<mj-body>
<mj-section padding="20px 0">
<mj-column width="100%">
<mj-text align="left" font-size="10px">
Message from BlueWave Uptime Service
</mj-text>
</mj-column>
<mj-column width="45%" padding-top="20px">
<mj-text
align="center"
font-weight="500"
padding="0px"
font-size="18px"
color="green"
>
Google.com is up
</mj-text>
<mj-divider border-width="2px" border-color="#616161"></mj-divider>
</mj-column>
</mj-section>
<mj-section>
<mj-column width="100%">
<mj-text>
<p>Hello Alex!</p>
<p>
Your latest incident is resolved and your monitored service is
up again.
</p>
<p>
<b>Monitor name:</b> Google.com
</p>
<p>
<b>URL:</b> https://google.com
</p>
<p>
<b>Problem:</b> Connection timeout
</p>
<p>
<b>Start date:</b> Jun 8, 2024 8:15pm
</p>
<p>
<b>Resolved date:</b> Jun 8, 2024 8:15pm
</p>
<p>
<b>Duration:</b>3 minutes and 15 seconds
</p>
</mj-text>
</mj-column>
<mj-column width="100%">
<mj-divider border-width="1px" border-color="#E0E0E0"></mj-divider>
<mj-button background-color="#1570EF">
View incident details
</mj-button>
<mj-text font-size="12px">
<p>This email was sent by BlueWave Uptime.</p>
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>

View File

@@ -0,0 +1,51 @@
<mjml>
<mj-head>
<mj-font
name="Roboto"
href="https://fonts.googleapis.com/css?family=Roboto:300,500"
></mj-font>
<mj-attributes>
<mj-all font-family="Roboto, Helvetica, sans-serif"></mj-all>
<mj-text
font-weight="300"
font-size="16px"
color="#616161"
line-height="24px"
></mj-text>
<mj-section padding="0px"></mj-section>
</mj-attributes>
</mj-head>
<mj-body>
<mj-section padding="20px 0">
<mj-column width="100%">
<mj-text align="left" font-size="10px">
Message from BlueWave Uptime Service
</mj-text>
</mj-column>
</mj-section>
<mj-section>
<mj-column width="100%">
<mj-text>
<p>Hello Alex!</p>
<p>
Thank you for trying out BlueWave Uptime! We developed it with
great care to meet our own needs, and we're excited to share it
with you.
</p>
<p>
BlueWave Uptime is an automated way of checking whether a
service such as a website or an application is available or not.
</p>
<p>We hope you find our service as valuable as we do.</p>
<p>Thank you.</p>
</mj-text>
</mj-column>
<mj-column width="100%">
<mj-divider border-width="1px" border-color="#E0E0E0"></mj-divider>
<mj-text font-size="12px">
<p>This email was sent by BlueWave Uptime.</p>
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>