Merge pull request #1782 from blockscout/watchlist-fix

add 404 tokens to watchlist

stubs/account.ts

@@ -48,6 +48,10 @@ export const WATCH_LIST_ITEM_WITH_TOKEN_INFO: WatchlistAddress = {
       incoming: true,
       outcoming: true,
     },
+    'ERC-404': {
+      incoming: true,
+      outcoming: true,
+    },
     'native': {
       incoming: true,
       outcoming: true,

types/api/account.ts

@@ -36,6 +36,7 @@ export interface NotificationSettings {
   'native': NotificationDirection;
   'ERC-20': NotificationDirection;
   'ERC-721': NotificationDirection;
+  'ERC-404': NotificationDirection;
 }
 
 export interface NotificationMethods {

ui/watchlist/AddressModal/AddressForm.tsx

@@ -22,7 +22,7 @@ import TagInput from 'ui/shared/TagInput';
 import AddressFormNotifications from './AddressFormNotifications';
 
 // does it depend on the network?
-const NOTIFICATIONS = [ 'native', 'ERC-20', 'ERC-721' ] as const;
+const NOTIFICATIONS = [ 'native', 'ERC-20', 'ERC-721', 'ERC-404' ] as const;
 
 const TAG_MAX_LENGTH = 35;
 
@@ -50,6 +50,10 @@ type Inputs = {
       outcoming: boolean;
       incoming: boolean;
     };
+    'ERC-404': {
+      outcoming: boolean;
+      incoming: boolean;
+    };
   };
 }
 
@@ -59,7 +63,9 @@ type Checkboxes = 'notification' |
 'notification_settings.ERC-20.outcoming' |
 'notification_settings.ERC-20.incoming' |
 'notification_settings.ERC-721.outcoming' |
-'notification_settings.ERC-721.incoming';
+'notification_settings.ERC-721.incoming' |
+'notification_settings.ERC-404.outcoming' |
+'notification_settings.ERC-404.incoming';
 
 const AddressForm: React.FC<Props> = ({ data, onSuccess, setAlertVisible, isAdd }) => {
   const [ pending, setPending ] = useState(false);

ui/watchlist/AddressModal/AddressFormNotifications.tsx

@@ -7,8 +7,8 @@ import config from 'configs/app';
 import CheckboxInput from 'ui/shared/CheckboxInput';
 
 // does it depend on the network?
-const NOTIFICATIONS = [ 'native', 'ERC-20', 'ERC-721' ] as const;
-const NOTIFICATIONS_NAMES = [ config.chain.currency.symbol, 'ERC-20', 'ERC-721, ERC-1155, ERC-404 (NFT)' ];
+const NOTIFICATIONS = [ 'native', 'ERC-20', 'ERC-721', 'ERC-404' ] as const;
+const NOTIFICATIONS_NAMES = [ config.chain.currency.symbol, 'ERC-20', 'ERC-721, ERC-1155 (NFT)', 'ERC-404' ];
 
 type Props<Inputs extends FieldValues> = {
   control: Control<Inputs>;