Display the notice only once

[MAILPOET-2724]

assets/js/src/newsletters/listings/standard.jsx

@@ -236,6 +236,8 @@ class NewsletterListStandard extends React.Component {
           mailpoetInstalledDaysAgo={window.mailpoet_installed_days_ago}
           sendTransactionalEmails={window.mailpoet_send_transactional_emails}
           mtaMethod={window.mailpoet_mta_method}
+          apiVersion={window.mailpoet_api_version}
+          noticeDismissed={window.mailpoet_transactional_emails_opt_in_notice_dismissed}
         />
 
         <ListingTabs tab="standard" />

assets/js/src/notices/transactional_emails_propose_opt_in_notice.tsx

@@ -5,21 +5,35 @@ import MailPoet from 'mailpoet';
 type Props = {
   mailpoetInstalledDaysAgo: number,
   sendTransactionalEmails: boolean,
+  noticeDismissed: string,
   mtaMethod: string,
+  apiVersion: string,
 }
 
 const TransactionalEmailsProposeOptInNotice = ({
   mailpoetInstalledDaysAgo,
   sendTransactionalEmails,
   mtaMethod,
+  noticeDismissed,
+  apiVersion,
 }: Props) => {
   const enable = () => {};
 
-  const onClose = () => {};
+  const onClose = () => {
+    MailPoet.Ajax.post({
+      api_version: apiVersion,
+      endpoint: 'UserFlags',
+      action: 'set',
+      data: {
+        transactional_emails_opt_in_notice_dismissed: '1',
+      },
+    });
+  };
 
   if (mailpoetInstalledDaysAgo < 30) return null;
   if (sendTransactionalEmails) return null;
   if (mtaMethod === 'PHPMail') return null;
+  if (noticeDismissed === '1') return null;
 
   return (
     <Notice type="success" timeout={false} onClose={onClose}>