From 863362dc37fdb3b7423b4247be1d47e5f1eff7f2 Mon Sep 17 00:00:00 2001
From: Brad Decker <bhdecker84@gmail.com>
Date: Tue, 29 Aug 2023 16:15:35 -0500
Subject: [PATCH] Add whats new popup for changes to advanced gas fee (#20632)

* Add whats new popup for changes to advanced gas fee

* Update shared/notifications/index.js

Co-authored-by: Mark Stacey <markjstacey@gmail.com>

* updated text

* verified working, changed order of init

* use first renderer for formatting issue

---------

Co-authored-by: Mark Stacey <markjstacey@gmail.com>
Co-authored-by: legobeat <109787230+legobeat@users.noreply.github.com>
---
 app/_locales/en/messages.json                     |  9 +++++++++
 app/scripts/controllers/app-state.js              |  6 +++---
 shared/notifications/index.js                     | 15 +++++++++++++++
 .../app/whats-new-popup/whats-new-popup.js        |  4 ++++
 ui/selectors/selectors.js                         |  1 +
 5 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index 3441e3e80..a749b4420 100644
--- a/app/_locales/en/messages.json
+++ b/app/_locales/en/messages.json
@@ -2792,6 +2792,15 @@
   "notifications23Title": {
     "message": "Stay safe with security alerts"
   },
+  "notifications24ActionText": {
+    "message": "Got it"
+  },
+  "notifications24Description": {
+    "message": "Advanced gas fee settings are now remembered based on the network you're using. This means you can set specific advanced gas fees for each network and avoid overpaying for gas or stuck transactions."
+  },
+  "notifications24Title": {
+    "message": "Advanced gas fees by network"
+  },
   "notifications3ActionText": {
     "message": "Read more",
     "description": "The 'call to action' on the button, or link, of the 'Stay secure' notification. Upon clicking, users will be taken to a page about security on the metamask support website."
diff --git a/app/scripts/controllers/app-state.js b/app/scripts/controllers/app-state.js
index e71dda50c..9603542da 100644
--- a/app/scripts/controllers/app-state.js
+++ b/app/scripts/controllers/app-state.js
@@ -49,13 +49,13 @@ export default class AppStateController extends EventEmitter {
       showProductTour: true,
       trezorModel: null,
       currentPopupId: undefined,
-      ...initState,
-      qrHardware: {},
-      nftsDropdownState: {},
       // This key is only used for checking if the user had set advancedGasFee
       // prior to Migration 92.3 where we split out the setting to support
       // multiple networks.
       hadAdvancedGasFeesSetPriorToMigration92_3: false,
+      ...initState,
+      qrHardware: {},
+      nftsDropdownState: {},
       usedNetworks: {
         '0x1': true,
         '0x5': true,
diff --git a/shared/notifications/index.js b/shared/notifications/index.js
index 44a555ba0..7c78a3961 100644
--- a/shared/notifications/index.js
+++ b/shared/notifications/index.js
@@ -131,6 +131,10 @@ export const UI_NOTIFICATIONS = {
     },
   },
   ///: END:ONLY_INCLUDE_IN
+  24: {
+    id: 24,
+    date: null,
+  },
 };
 
 export const getTranslatedUINotifications = (t, locale) => {
@@ -358,5 +362,16 @@ export const getTranslatedUINotifications = (t, locale) => {
         : '',
     },
     ///: END:ONLY_INCLUDE_IN
+    24: {
+      ...UI_NOTIFICATIONS[24],
+      title: t('notifications24Title'),
+      description: t('notifications24Description'),
+      actionText: t('notifications24ActionText'),
+      date: UI_NOTIFICATIONS[24].date
+        ? new Intl.DateTimeFormat(formattedLocale).format(
+            new Date(UI_NOTIFICATIONS[24].date),
+          )
+        : '',
+    },
   };
 };
diff --git a/ui/components/app/whats-new-popup/whats-new-popup.js b/ui/components/app/whats-new-popup/whats-new-popup.js
index ad9786a9c..fc0b387de 100644
--- a/ui/components/app/whats-new-popup/whats-new-popup.js
+++ b/ui/components/app/whats-new-popup/whats-new-popup.js
@@ -109,6 +109,9 @@ function getActionFunctionById(id, history) {
       history.push(`${EXPERIMENTAL_ROUTE}#transaction-security-check`);
     },
     ///: END:ONLY_INCLUDE_IN
+    24: () => {
+      updateViewedNotifications({ 24: true });
+    },
   };
 
   return actionFunctions[id];
@@ -391,6 +394,7 @@ export default function WhatsNewPopup({
     ///: BEGIN:ONLY_INCLUDE_IN(blockaid)
     23: renderFirstNotification,
     ///: END:ONLY_INCLUDE_IN
+    24: renderFirstNotification,
   };
 
   return (
diff --git a/ui/selectors/selectors.js b/ui/selectors/selectors.js
index 40a694180..7924f2c91 100644
--- a/ui/selectors/selectors.js
+++ b/ui/selectors/selectors.js
@@ -1042,6 +1042,7 @@ function getAllowedAnnouncementIds(state) {
     ///: BEGIN:ONLY_INCLUDE_IN(blockaid)
     23: true,
     ///: END:ONLY_INCLUDE_IN
+    24: state.metamask.hadAdvancedGasFeesSetPriorToMigration92_3 === true,
   };
 }