@rango-dev/widget-embedded 0.20.1-next.19 → 0.20.1-next.20

package/dist/types/notification.d.ts

@@ -1,4 +1,4 @@
-import { type Route, type RouteEvent, type Step, type StepEvent, StepExecutionBlockedEventStatus } from '@rango-dev/queue-manager-rango-preset';
+import { type Route, type RouteEvent, type Step, type StepEvent } from '@rango-dev/queue-manager-rango-preset';
 type NotificationRoute = {
     from: {
         blockchain: Step['fromBlockchain'];
@@ -17,6 +17,5 @@ export type Notification = Pick<Route, 'requestId'> & {
     read: boolean;
     route: NotificationRoute;
 };
-export declare const validBlockedStatuses: StepExecutionBlockedEventStatus[];
 export {};
 //# sourceMappingURL=notification.d.ts.map

package/dist/types/notification.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../src/types/notification.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,KAAK,EACV,KAAK,UAAU,EACf,KAAK,IAAI,EACT,KAAK,SAAS,EACd,+BAA+B,EAChC,MAAM,uCAAuC,CAAC;AAE/C,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE;QACJ,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACnC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QAChC,YAAY,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;KACzC,CAAC;IACF,EAAE,EAAE;QACF,UAAU,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QACjC,WAAW,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;QAC9B,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;KACvC,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,CAAC,GAAG;IACpD,KAAK,EAAE,UAAU,GAAG,SAAS,CAAC;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,iBAAiB,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,+BAA+B,EAIjE,CAAC"}
+{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../src/types/notification.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,KAAK,EACV,KAAK,UAAU,EACf,KAAK,IAAI,EACT,KAAK,SAAS,EACf,MAAM,uCAAuC,CAAC;AAE/C,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE;QACJ,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACnC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QAChC,YAAY,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;KACzC,CAAC;IACF,EAAE,EAAE;QACF,UAAU,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QACjC,WAAW,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;QAC9B,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;KACvC,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,CAAC,GAAG;IACpD,KAAK,EAAE,UAAU,GAAG,SAAS,CAAC;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,iBAAiB,CAAC;CAC1B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/widget-embedded",
-  "version": "0.20.1-next.19",
+  "version": "0.20.1-next.20",
   "license": "MIT",
   "type": "module",
   "source": "./src/index.ts",
@@ -23,9 +23,9 @@
     "@lingui/react": "4.2.1",
     "@rango-dev/provider-all": "^0.25.1-next.3",
     "@rango-dev/queue-manager-core": "^0.25.0",
-    "@rango-dev/queue-manager-rango-preset": "^0.25.1-next.1",
+    "@rango-dev/queue-manager-rango-preset": "^0.25.1-next.2",
     "@rango-dev/queue-manager-react": "^0.24.0",
-    "@rango-dev/ui": "^0.26.1-next.10",
+    "@rango-dev/ui": "^0.26.1-next.11",
     "@rango-dev/wallets-react": "^0.11.1-next.1",
     "@rango-dev/wallets-shared": "^0.25.1-next.1",
     "bignumber.js": "^9.1.1",

package/src/components/NotificationContent/NotificationContent.tsx

@@ -1,6 +1,7 @@
 import type { Notification } from '../../types/notification';
 
 import { i18n } from '@lingui/core';
+import { EventSeverity } from '@rango-dev/queue-manager-rango-preset';
 import {
   ChainToken,
   ChevronRightIcon,
@@ -74,7 +75,15 @@ export function NotificationContent() {
                 key={notificationItem.requestId}
                 onClick={() => handleOnClick(notificationItem.requestId)}
                 title={
-                  <Typography variant="body" size="small" color="$neutral700">
+                  <Typography
+                    variant="body"
+                    size="small"
+                    color={
+                      notificationItem.event.messageSeverity ===
+                      EventSeverity.WARNING
+                        ? '$foreground'
+                        : '$neutral700'
+                    }>
                     {i18n.t(notificationItem.event.message)}
                   </Typography>
                 }

package/src/components/WidgetEvents.tsx

@@ -11,14 +11,12 @@ import { useEffect } from 'react';
 import { useAppStore } from '../store/AppStore';
 import { useNotificationStore } from '../store/notification';
 import { useWalletsStore } from '../store/wallets';
-import { validBlockedStatuses } from '../types/notification';
 
 export function WidgetEvents() {
   const tokens = useAppStore().tokens();
   const connectedWallets = useWalletsStore.use.connectedWallets();
   const getWalletsDetails = useWalletsStore.use.getWalletsDetails();
   const setNotification = useNotificationStore.use.setNotification();
-  const setAsRead = useNotificationStore.use.setAsRead();
   const widgetEvents = useEvents();
 
   useEffect(() => {
@@ -43,18 +41,8 @@ export function WidgetEvents() {
         fromAccount && getWalletsDetails([fromAccount], tokens);
         toAccount && getWalletsDetails([toAccount], tokens);
       }
-      if (
-        (event.type === StepEventType.TX_EXECUTION_BLOCKED &&
-          validBlockedStatuses.includes(event.status)) ||
-        event.type === StepEventType.FAILED
-      ) {
-        setNotification(event, route);
-      } else if (
-        event.type === StepEventType.TX_EXECUTION ||
-        event.type === StepEventType.CHECK_STATUS
-      ) {
-        setAsRead(route.requestId);
-      }
+
+      setNotification(event, route);
     });
 
     return () => widgetEvents.all.clear();

package/src/containers/WidgetInfo/WidgetInfo.tsx

@@ -5,6 +5,7 @@ import React, { createContext, useContext } from 'react';
 
 import { useLanguage } from '../../hooks/useLanguage';
 import { useAppStore } from '../../store/AppStore';
+import { useNotificationStore } from '../../store/notification';
 import { useQuoteStore } from '../../store/quote';
 import { useWalletsStore } from '../../store/wallets';
 import { calculateWalletUsdValue } from '../../utils/wallets';
@@ -28,6 +29,7 @@ export function WidgetInfo(props: React.PropsWithChildren) {
   const swappers = useAppStore().swappers();
   const loadingStatus = useAppStore().fetchStatus;
   const resetLanguage = useLanguage().resetLanguage;
+  const notifications = useNotificationStore().getUnreadNotifications();
 
   // eslint-disable-next-line react/jsx-no-constructed-context-values
   const value = {
@@ -45,6 +47,9 @@ export function WidgetInfo(props: React.PropsWithChildren) {
       loadingStatus,
     },
     resetLanguage,
+    notifications: {
+      list: notifications,
+    },
   };
 
   return (

package/src/containers/WidgetInfo/WidgetInfo.types.ts

@@ -2,6 +2,7 @@ import type { WidgetHistory } from './WidgetInfo.helpers';
 import type { FetchStatus } from '../../store/slices/data';
 import type { ConnectedWallet } from '../../store/wallets';
 import type { Wallet } from '../../types';
+import type { Notification } from '../../types/notification';
 import type { BlockchainMeta, SwapperMeta, Token } from 'rango-sdk';
 
 export interface WidgetInfoContextInterface {
@@ -19,4 +20,7 @@ export interface WidgetInfoContextInterface {
     loadingStatus: FetchStatus;
   };
   resetLanguage: () => void;
+  notifications: {
+    list: Notification[];
+  };
 }

package/src/index.ts

@@ -9,7 +9,6 @@ import type {
   WidgetTheme,
 } from './types';
 import type {
-  EventSeverity,
   PendingSwapWithQueueID,
   Route,
   RouteEvent,
@@ -40,6 +39,7 @@ import type {
 import type { PendingSwap, PendingSwapStep } from 'rango-types';
 
 import {
+  EventSeverity,
   MainEvents,
   RouteEventType,
   StepEventType,
@@ -115,7 +115,6 @@ export type {
   PendingSwapWithQueueID,
   PendingSwapStep,
   RouteExecutionEvents,
-  EventSeverity,
 };
 
 // Internal function and enum exports for Rango
@@ -125,4 +124,5 @@ export {
   WalletEvents,
   WalletTypes,
   PendingSwapNetworkStatus,
+  EventSeverity,
 };

package/src/types/notification.ts

@@ -3,7 +3,6 @@ import {
   type RouteEvent,
   type Step,
   type StepEvent,
-  StepExecutionBlockedEventStatus,
 } from '@rango-dev/queue-manager-rango-preset';
 
 type NotificationRoute = {
@@ -25,9 +24,3 @@ export type Notification = Pick<Route, 'requestId'> & {
   read: boolean;
   route: NotificationRoute;
 };
-
-export const validBlockedStatuses: StepExecutionBlockedEventStatus[] = [
-  StepExecutionBlockedEventStatus.WAITING_FOR_CHANGE_WALLET_ACCOUNT,
-  StepExecutionBlockedEventStatus.WAITING_FOR_NETWORK_CHANGE,
-  StepExecutionBlockedEventStatus.WAITING_FOR_WALLET_CONNECT,
-];