feat: add support for external links in feature announcements

ui/pages/notification-details/notification-details-footer/notification-details-footer.tsx

@@ -35,9 +35,15 @@ export const NotificationDetailsFooter = ({
         </>
       )}
       {footer.type === 'footer_feature_announcement' && (
-        <>
+        <Box
+          display={Display.Flex}
+          gap={4}
+          flexDirection={FlexDirection.Row}
+          width={BlockSize.Full}
+        >
+          <footer.ExternalLink notification={notification} />
           <footer.ExtensionLink notification={notification} />
-        </>
+        </Box>
       )}
     </Box>
   );

ui/pages/notifications/notification-components/feature-announcement/feature-announcement.tsx

@@ -114,6 +114,20 @@ export const components: NotificationComponent<FeatureAnnouncementNotification>
             href={`/${notification.data.extensionLink.extensionLinkRoute}`}
             id={notification.id}
             endIconName={false}
+            // Even if the link is not external, it will open in a new tab
+            // to avoid breaking the popup
+            isExternal={true}
+          />
+        ) : null,
+      ExternalLink: ({ notification }) =>
+        notification.data.externalLink ? (
+          <NotificationDetailButton
+            notification={notification}
+            variant={ButtonVariant.Secondary}
+            text={notification.data.externalLink.externalLinkText}
+            href={`${notification.data.externalLink.externalLinkUrl}`}
+            id={notification.id}
+            endIconName={false}
             isExternal={true}
           />
         ) : null,

ui/pages/notifications/notification-components/types/notifications/notifications.ts

@@ -40,6 +40,7 @@ type FooterOnChainNotification<N = Notification> = {
 type FooterFeatureAnnouncement<N = Notification> = {
   type: 'footer_feature_announcement';
   ExtensionLink: NotificationFC<N>;
+  ExternalLink: NotificationFC<N>;
 };
 
 /**