[MM-43399] Cloud Delinquency Email Sequence (#20814)

* Add DelinquentSince to Subscription fields

* Stashing, migrating

* Adding file

* Adding many email templates

* Fix templates pipeline

* Fix translations

* Fix mocks

* Many changes

* Adjust mocks

* Update i18n/en.json

Co-authored-by: Maria A Nunez <maria.nunez@mattermost.com>

* PR fixes

* Update string

* Update i18n/en.json

Co-authored-by: Maria A Nunez <maria.nunez@mattermost.com>

* Update URL's for buttons to open the delinquency modal

* Update emails from mjml

Co-authored-by: Mattermod <mattermod@users.noreply.github.com>
Co-authored-by: Maria A Nunez <maria.nunez@mattermost.com>

templates/partials/cloud_laptop_error.mjml

@@ -0,0 +1,5 @@
+<mj-section padding-top="0px" border-left="1px solid #E5E5E5" border-right="1px solid #E5E5E5">
+  <mj-column padding="0px">
+    <mj-image src="{{.Props.SiteURL}}/static/images/cloud-laptop-error.png" width="320px" padding="0px" />
+  </mj-column>
+</mj-section>

templates/partials/cloud_laptop_warning.mjml

@@ -0,0 +1,5 @@
+<mj-section padding-top="0px" border-left="1px solid #E5E5E5" border-right="1px solid #E5E5E5">
+  <mj-column padding="0px">
+    <mj-image src="{{.Props.SiteURL}}/static/images/cloud-laptop-warning.png" width="320px" padding="0px" />
+  </mj-column>
+</mj-section>

templates/partials/cloud_questions_hr_email_footer.mjml

@@ -0,0 +1,23 @@
+<mj-section padding-top="0px" border-left="1px solid #E5E5E5" border-right="1px solid #E5E5E5">
+  <mj-column padding="0">
+    <mj-text font-size="16px" font-family="Open Sans, sans-serif" font-weight="600" align="left" padding="0px" padding-bottom="0px" padding-left="48px" >
+      {{.Props.QuestionTitle}}
+    </mj-text>
+    <mj-text color="#3F4350" font-size="14px" align="left" padding-left="48px" padding-bottom="0px">
+      {{.Props.QuestionInfo}}
+      <a href="mailto:{{.Props.SupportEmail}}">
+        {{.Props.SupportEmail}}</a>
+    </mj-text>
+  </mj-column>
+  <mj-column padding-bottom="0px">
+    <mj-divider border-width="1px" border-color="#E5E5E5"></mj-divider>
+  </mj-column>
+</mj-section>
+<mj-section padding-top="0px" padding-bottom="24px" border-bottom="1px solid #E5E5E5" border-left="1px solid #E5E5E5" border-right="1px solid #E5E5E5">
+  <mj-column padding="0">
+    <mj-text font-size="12px" color="#AAAAAA" padding="0">
+      {{.Props.Organization}}
+      {{.Props.FooterV2}}
+    </mj-text>
+  </mj-column>
+</mj-section>

templates/partials/cloud_title_2subtitles_button.mjml

@@ -0,0 +1,16 @@
+<mj-section padding="0 60px" border-left="1px solid #E5E5E5" border-right="1px solid #E5E5E5">
+  <mj-column>
+    <mj-text css-class="title" font-family="Open Sans, sans-serif" padding="10px 0px">
+      {{.Props.Title}}
+    </mj-text>
+    <mj-text padding-bottom="16px" font-weight=400 color="#3F4350" font-size="16px" line-height="24px" color="#000000" font-family="Open Sans, sans-serif">
+      {{.Props.SubTitle1}}
+    </mj-text>
+    <mj-text padding-bottom="24px" padding-top="0px" font-weight=400 color="#3F4350" font-size="16px" line-height="24px" color="#000000" font-family="Open Sans, sans-serif">
+      {{.Props.SubTitle2}}
+    </mj-text>
+    <mj-button href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" padding="0px" padding-bottom="40px" border-top="16px" font-weight="400 !important" css-class="button-cloud" font-family="Open Sans, sans-serif">
+      {{.Props.Button}}
+    </mj-button>
+  </mj-column>
+</mj-section>

templates/partials/cloud_title_3subtitles_button.mjml

@@ -0,0 +1,24 @@
+<mj-section padding="0 60px" border-left="1px solid #E5E5E5" border-right="1px solid #E5E5E5">
+  <mj-column>
+    <mj-text padding-left="25px" align="left" css-class="title" font-family="Open Sans, sans-serif" padding="10px 0px">
+      {{.Props.Title}}
+    </mj-text>
+    <mj-text align="left" padding-bottom="16px" font-weight=400 color="#3F4350" font-size="16px" line-height="24px" font-family="Open Sans, sans-serif">
+      {{.Props.SubTitle1}}
+    </mj-text>
+    <mj-text align="left" padding-bottom="16px" padding-top="0px" font-weight=400 color="#3F4350" font-size="16px" line-height="24px" font-family="Open Sans, sans-serif">
+      {{.Props.SubTitle2}}
+    </mj-text>
+     <mj-text align="left" padding-bottom="24px" padding-top="0px" font-weight=400 color="#3F4350" font-size="16px" line-height="24px" font-family="Open Sans, sans-serif">
+      {{.Props.SubTitle3}}
+    </mj-text>
+    <mj-button href="{{.Props.SiteURL}}/admin_console/billing/payment_info" padding="0px" border-top="16px" font-weight="400 !important" css-class="button-cloud" font-family="Open Sans, sans-serif">
+      {{.Props.Button}}
+    </mj-button>
+    {{if .IncludeSecondaryActionButton}}
+    <mj-button color="#166DE0" align="center" padding-top="12px"  font-weight="600" href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal">
+        {{.Props.SecondaryActionButtonText}}
+    </mj-button>
+    {{end}}
+  </mj-column>
+</mj-section>

templates/partials/cloud_upgrade_person.mjml

@@ -0,0 +1,5 @@
+<mj-section padding-top="0px" border-left="1px solid #E5E5E5" border-right="1px solid #E5E5E5">
+  <mj-column padding="0px">
+    <mj-image src="{{.Props.SiteURL}}/static/images/cloud-upgrade-person-hand-to-face.png" width="320px" padding="0px" />
+  </mj-column>
+</mj-section>

templates/partials/style.css

@@ -6,7 +6,7 @@
 
 .emailBody a{
   text-decoration: none !important;
-  color: #1C58D9 !important;
+  color: #1C58D9;
 }
 
 .title div {