Add security & privacy "What's New" message (#16783)

app/_locales/en/messages.json

@@ -2438,6 +2438,15 @@
   "notifications16Title": {
     "message": "Improved token allowance experience"
   },
+  "notifications17ActionText": {
+    "message": "Show Security & Privacy settings"
+  },
+  "notifications17Description": {
+    "message": "This update provides more options so you can better control your own privacy. We've added more transparency about how data is collected and clearer options for sharing it. Change your preferences or delete extension usage data via Security & Privacy settings."
+  },
+  "notifications17Title": {
+    "message": "Security & Privacy Settings"
+  },
   "notifications1Description": {
     "message": "MetaMask Mobile users can now swap tokens inside their mobile wallet. Scan the QR code to get the mobile app and start swapping.",
     "description": "Description of a notification in the 'See What's New' popup. Describes the swapping on mobile feature."

shared/notifications/index.js

@@ -82,6 +82,10 @@ export const UI_NOTIFICATIONS = {
     id: 16,
     date: null,
   },
+  17: {
+    id: 17,
+    date: null,
+  },
 };
 
 export const getTranslatedUINotifications = (t, locale) => {
@@ -239,5 +243,16 @@ export const getTranslatedUINotifications = (t, locale) => {
           )
         : '',
     },
+    17: {
+      ...UI_NOTIFICATIONS[17],
+      title: t('notifications17Title'),
+      description: t('notifications17Description'),
+      actionText: t('notifications17ActionText'),
+      date: UI_NOTIFICATIONS[17].date
+        ? new Intl.DateTimeFormat(formattedLocale).format(
+            new Date(UI_NOTIFICATIONS[17].date),
+          )
+        : '',
+    },
   };
 };

test/e2e/fixture-builder.js

@@ -110,6 +110,11 @@ function defaultFixture() {
             id: 16,
             isShown: true,
           },
+          17: {
+            date: null,
+            id: 17,
+            isShown: true,
+          },
         },
       },
       AppStateController: {

ui/components/app/whats-new-popup/whats-new-popup.js

@@ -16,6 +16,7 @@ import {
   BUILD_QUOTE_ROUTE,
   ADVANCED_ROUTE,
   EXPERIMENTAL_ROUTE,
+  SECURITY_ROUTE,
 } from '../../../helpers/constants/routes';
 import { TYPOGRAPHY } from '../../../helpers/constants/design-system';
 import ZENDESK_URLS from '../../../helpers/constants/zendesk-url';
@@ -62,6 +63,10 @@ function getActionFunctionById(id, history) {
       updateViewedNotifications({ 16: true });
       history.push(EXPERIMENTAL_ROUTE);
     },
+    17: () => {
+      updateViewedNotifications({ 17: true });
+      history.push(SECURITY_ROUTE);
+    },
   };
 
   return actionFunctions[id];

ui/selectors/selectors.js

@@ -981,6 +981,7 @@ function getAllowedAnnouncementIds(state) {
     14: false,
     15: false,
     16: true,
+    17: true,
   };
 }