diff --git a/assets/js/src/newsletter_editor/background_image_announcement.jsx b/assets/js/src/newsletter_editor/background_image_announcement.jsx
index 61bc1c348c..a5fcc76138 100644
--- a/assets/js/src/newsletter_editor/background_image_announcement.jsx
+++ b/assets/js/src/newsletter_editor/background_image_announcement.jsx
@@ -2,22 +2,25 @@ import React from 'react';
 import MailPoet from 'mailpoet';
 import InAppAnnouncement from 'in_app_announcements/in_app_announcement.jsx';
 
-const BackgroundImageAnnouncement = () => {
-  const heading = MailPoet.I18n.t('announcementBackgroundImagesHeading')
-    .replace('%username%', window.config.currentUserFirstName || window.config.currentUserUsername);
-  return (
-    <InAppAnnouncement
-      validUntil={new Date('2018-10-06')}
-      height="700px"
-      showOnlyOnceSlug="background_image"
-    >
-      <div className="mailpoet_in_app_announcement_background_videos">
-        <h2>{heading}</h2>
-        <p>{MailPoet.I18n.t('announcementBackgroundImagesMessage')}</p>
-        <video src={window.config.backgroundImageDemoUrl} controls autoPlay><track kind="captions" /></video>
-      </div>
-    </InAppAnnouncement>
-  );
+const BackgroundImageAnnouncement = props => (
+  <InAppAnnouncement
+    validUntil={new Date('2018-10-06')}
+    height="700px"
+    showOnlyOnceSlug="background_image"
+  >
+    <div className="mailpoet_in_app_announcement_background_videos">
+      <h2>
+        {MailPoet.I18n.t('announcementBackgroundImagesHeading').replace('%username%', props.username)}
+      </h2>
+      <p>{MailPoet.I18n.t('announcementBackgroundImagesMessage')}</p>
+      <video src={props.videoUrl} controls autoPlay><track kind="captions" /></video>
+    </div>
+  </InAppAnnouncement>
+);
+
+BackgroundImageAnnouncement.propTypes = {
+  username: React.PropTypes.string.isRequired,
+  videoUrl: React.PropTypes.string.isRequired,
 };
 
 module.exports = BackgroundImageAnnouncement;
diff --git a/assets/js/src/newsletter_editor/initializer.jsx b/assets/js/src/newsletter_editor/initializer.jsx
index 33f22f8309..79cda278ec 100644
--- a/assets/js/src/newsletter_editor/initializer.jsx
+++ b/assets/js/src/newsletter_editor/initializer.jsx
@@ -20,7 +20,12 @@ const renderBreadcrumb = (newsletterType) => {
 
 const renderAnnouncement = () => {
   const container = document.getElementById('mailpoet_editor_announcement');
-  ReactDOM.render(<BackgroundImageAnnouncement />, container);
+  ReactDOM.render(
+    <BackgroundImageAnnouncement
+      username={window.config.currentUserFirstName || window.config.currentUserUsername}
+      videoUrl={window.config.backgroundImageDemoUrl}
+    />, container
+  );
 };
 
 const initializeEditor = (config) => {