Add campaign name to the sending page

[MAILPOET-5646]

mailpoet/assets/css/src/components-plugin/_newsletter.scss

@@ -16,6 +16,16 @@
 }
 
 .mailpoet-form-send-email {
+  .mailpoet-send-campaign-name {
+    margin-bottom: -$grid-gap-large;
+    margin-top: $grid-gap-xl;
+
+    h1 {
+      font-size: $heading-font-size-h0;
+      font-weight: 600;
+    }
+  }
+
   .mailpoet-form-grid {
     grid-template-columns: $grid-column $grid-column;
     max-width: 976px;

mailpoet/assets/js/src/common/newsletter.ts

@@ -25,6 +25,7 @@ export enum NewsletterOptionGroup {
 }
 
 export type NewsLetter = {
+  campaign_name: string | null;
   body: {
     blockDefaults: unknown;
     content: unknown;

mailpoet/assets/js/src/newsletters/send.tsx

@@ -811,6 +811,11 @@ class NewsletterSendComponent extends Component<
           automationId="newsletter_send_heading"
         />
         <ErrorBoundary>
+          {this.state.item.campaign_name ? (
+            <div className="mailpoet-form-grid mailpoet-send-campaign-name">
+              <h1>{this.state.item.campaign_name}</h1>
+            </div>
+          ) : null}
           <SendContext.Provider value={this.state.sendContextValue}>
             <Form
               id="mailpoet_newsletter"