Show ReviewRequest modal when NPS poll submitted with score 9 or 10

[MAILPOET-1647]

assets/js/src/nps_poll.jsx

@@ -1,3 +1,24 @@
+import MailPoet from 'mailpoet';
+import ReactDOMServer from 'react-dom/server';
+import ReviewRequest from 'review_request.jsx';
+
+const showReviewRequestModal = () => MailPoet.Modal.popup({
+  width: 800,
+  template: ReactDOMServer.renderToString(
+    ReviewRequest({
+      username: window.mailpoet_current_wp_user_firstname
+        || window.mailpoet_current_wp_user.user_login,
+      reviewRequestIllustrationUrl: window.mailpoet_review_request_illustration_url,
+      installedDaysAgo: window.mailpoet_installed_days_ago,
+    })
+  ),
+  onInit: () => {
+    document
+      .getElementById('mailpoet_review_request_not_now')
+      .addEventListener('click', () => MailPoet.Modal.close());
+  },
+});
+
 function displayPoll() {
   if (
     window.mailpoet_display_nps_poll
@@ -13,6 +34,13 @@ function displayPoll() {
         email: window.mailpoet_current_wp_user.user_email,
         createdAt: window.mailpoet_installed_at_isoFormat,
       },
+      events: {
+        submit: (response) => {
+          if (response.rating >= 9 && response.completed) {
+            showReviewRequestModal();
+          }
+        },
+      },
     });
     // Old users poll
     window.satismeter({
@@ -23,6 +51,13 @@ function displayPoll() {
         email: window.mailpoet_current_wp_user.user_email,
         createdAt: window.mailpoet_installed_at_isoFormat,
       },
+      events: {
+        submit: (response) => {
+          if (response.rating >= 9 && response.completed) {
+            showReviewRequestModal();
+          }
+        },
+      },
     });
   }
 }