Added "What's New" Notification for Improved token allowance experience (#16465)

app/_locales/en/messages.json

@@ -2401,6 +2401,15 @@
   "notifications15Title": {
     "message": "The Ethereum Merge is here!"
   },
+  "notifications16ActionText": {
+    "message": "Try it out here"
+  },
+  "notifications16Description": {
+    "message": "We redesigned our token allowance confirmation to help you make more informed decisions."
+  },
+  "notifications16Title": {
+    "message": "Improved token allowance experience"
+  },
   "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

@@ -78,6 +78,10 @@ export const UI_NOTIFICATIONS = {
     id: 15,
     date: '2022-09-15',
   },
+  16: {
+    id: 16,
+    date: null,
+  },
 };
 
 export const getTranslatedUINotifications = (t, locale) => {
@@ -224,5 +228,16 @@ export const getTranslatedUINotifications = (t, locale) => {
           )
         : '',
     },
+    16: {
+      ...UI_NOTIFICATIONS[16],
+      title: t('notifications16Title'),
+      description: t('notifications16Description'),
+      actionText: t('notifications16ActionText'),
+      date: UI_NOTIFICATIONS[16].date
+        ? new Intl.DateTimeFormat(formattedLocale).format(
+            new Date(UI_NOTIFICATIONS[16].date),
+          )
+        : '',
+    },
   };
 };

test/e2e/fixture-builder.js

@@ -74,12 +74,12 @@ function defaultFixture() {
               src: 'images/token-detection.svg',
               width: '100%',
             },
-            isShown: true,
+            isShown: false,
           },
           11: {
             date: '2022-09-15',
             id: 11,
-            isShown: true,
+            isShown: false,
           },
           12: {
             date: '2022-05-18',
@@ -98,11 +98,16 @@ function defaultFixture() {
           14: {
             date: '2022-09-15',
             id: 14,
-            isShown: true,
+            isShown: false,
           },
           15: {
             date: '2022-09-15',
             id: 15,
+            isShown: false,
+          },
+          16: {
+            date: null,
+            id: 16,
             isShown: true,
           },
         },

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

@@ -58,6 +58,10 @@ function getActionFunctionById(id, history) {
       updateViewedNotifications({ 14: true });
       history.push(`${ADVANCED_ROUTE}#backup-userdata`);
     },
+    16: () => {
+      updateViewedNotifications({ 16: true });
+      history.push(EXPERIMENTAL_ROUTE);
+    },
   };
 
   return actionFunctions[id];

ui/selectors/selectors.js

@@ -956,12 +956,13 @@ function getAllowedAnnouncementIds(state) {
     7: false,
     8: supportsWebHid && currentKeyringIsLedger && currentlyUsingLedgerLive,
     9: false,
-    10: true,
+    10: false,
-    11: true,
+    11: false,
     12: false,
     13: false,
     14: false,
-    15: true,
+    15: false,
+    16: true,
   };
 }