From 048527989cfe5cdb38e60fadfa3a8fca5a1fe04b Mon Sep 17 00:00:00 2001
From: Bill He <bill@dydx.exchange>
Date: Tue, 29 Aug 2023 11:21:37 -0700
Subject: [PATCH] polish

---
 src/constants/notifications.ts     |  2 --
 src/hooks/useNotificationTypes.tsx | 22 ++++++++++------------
 2 files changed, 10 insertions(+), 14 deletions(-)

diff --git a/src/constants/notifications.ts b/src/constants/notifications.ts
index 698158d..5695617 100644
--- a/src/constants/notifications.ts
+++ b/src/constants/notifications.ts
@@ -89,8 +89,6 @@ export type NotificationDisplayData = {
 
   customMenuContent?: React.ReactNode;
 
-  customMenuSlotAfter?: React.ReactNode;
-
   actionDescription?: string;
 
   /** Screen reader: instructions for performing toast action after its timer expires */
diff --git a/src/hooks/useNotificationTypes.tsx b/src/hooks/useNotificationTypes.tsx
index 200afd9..5cba887 100644
--- a/src/hooks/useNotificationTypes.tsx
+++ b/src/hooks/useNotificationTypes.tsx
@@ -5,23 +5,16 @@ import { groupBy } from 'lodash';
 import { AbacusOrderStatus, ORDER_SIDES, ORDER_STATUS_STRINGS } from '@/constants/abacus';
 import { DialogTypes } from '@/constants/dialogs';
 import { STRING_KEYS } from '@/constants/localization';
-import {
-  type NotificationTypeConfig,
-  type TransferNotifcation,
-  NotificationType,
-} from '@/constants/notifications';
+import { type NotificationTypeConfig, NotificationType } from '@/constants/notifications';
 import { ORDER_SIDE_STRINGS, TRADE_TYPE_STRINGS, TradeTypes } from '@/constants/trade';
 
 import { useLocalNotifications } from '@/hooks/useLocalNotifications';
 
 import { Icon, IconName } from '@/components/Icon';
+import { Output, OutputType } from '@/components/Output';
 import { TransferStatusToast } from '@/views/TransferStatus';
 
-import {
-  getSquidTransfers,
-  getSubaccountFills,
-  getSubaccountOrders,
-} from '@/state/accountSelectors';
+import { getSubaccountFills, getSubaccountOrders } from '@/state/accountSelectors';
 import { openDialog } from '@/state/dialogs';
 
 import { OrderStatusIcon } from '@/views/OrderStatusIcon';
@@ -132,8 +125,13 @@ export const notificationTypes = [
             {
               icon: <Icon iconName={finished ? IconName.Transfer : IconName.Clock} />,
               title: stringGetter({ key: getTitleStringKey(type, finished) }),
-              description:
-                type === 'deposit' ? `Deposit of $${toAmount}` : `Withdraw of ${toAmount}`,
+              // TODO: confirm with design what the description should be
+              description: (
+                <>
+                  <span>{type === 'deposit' ? 'Deposit of ' : 'Withdraw of'}</span>
+                  <Output type={OutputType.Fiat} value={toAmount} />
+                </>
+              ),
               customContent: (
                 <TransferStatusToast
                   toAmount={transfer.toAmount}