feat: add manage collectibles feature (#25)

Signed-off-by: ryanml <[email protected]> Co-authored-by: vvava <[email protected]>
ava-labs · Aug 13, 2024 · 09373dc · 09373dc
1 parent ce79553
commit 09373dc
Show file tree

Hide file tree

Showing 20 changed files with 383 additions and 41 deletions.
diff --git a/src/background/connections/extensionConnection/models.ts b/src/background/connections/extensionConnection/models.ts
@@ -67,6 +67,7 @@ export enum ExtensionRequest {
   SEND_SUBMIT = 'send_submit',
 
   SETTINGS_GET = 'settings_get',
+  SETTINGS_UPDATE_COLLECTIBLES_VISIBILITY = 'settings_update_collectibles_visibility',
   SETTINGS_UPDATE_CURRENCY = 'settings_update_currency',
   SETTINGS_UPDATE_SHOW_NO_BALANCE = 'settings_update_show_no_balance',
   SETTINGS_UPDATE_THEME = 'settings_update_theme',

diff --git a/src/background/connections/extensionConnection/registry.ts b/src/background/connections/extensionConnection/registry.ts
@@ -61,6 +61,7 @@ import { GetWalletDetailsHandler } from '@src/background/services/wallet/handler
 import { registry } from 'tsyringe';
 import { UpdateCurrencyHandler } from '../../services/settings/handlers/updateCurrencySelection';
 import { UpdateTokensVisiblityHandler } from '../../services/settings/handlers/updateTokensVisibility';
+import { UpdateCollectiblesVisibilityHandler } from '../../services/settings/handlers/updateCollectiblesVisibility';
 import { NetworksUpdatedEvents } from '@src/background/services/network/events/networksUpdatedEvent';
 import { NetworkUpdatedEvents } from '@src/background/services/network/events/networkUpdatedEvent';
 import { UpdateBalancesForNetworkHandler } from '@src/background/services/balances/handlers/updateBalancesForNetwork';
@@ -235,6 +236,10 @@ import { UnifiedBridgeTrackTransfer } from '@src/background/services/unifiedBrid
   { token: 'ExtensionRequestHandler', useToken: UpdateCurrencyHandler },
   { token: 'ExtensionRequestHandler', useToken: UpdateThemeHandler },
   { token: 'ExtensionRequestHandler', useToken: UpdateTokensVisiblityHandler },
+  {
+    token: 'ExtensionRequestHandler',
+    useToken: UpdateCollectiblesVisibilityHandler,
+  },
   { token: 'ExtensionRequestHandler', useToken: ResetExtensionStateHandler },
   { token: 'ExtensionRequestHandler', useToken: GetTokenPriceHandler },
   { token: 'ExtensionRequestHandler', useToken: GetHistoryHandler },

diff --git a/src/background/services/balances/BalancesServiceAVM.test.ts b/src/background/services/balances/BalancesServiceAVM.test.ts
@@ -86,6 +86,7 @@ describe('src/background/services/balances/BalancesServiceAVM.ts', () => {
       showTokensWithoutBalances: false,
       theme: ThemeVariant.DARK,
       tokensVisibility: {},
+      collectiblesVisibility: {},
       analyticsConsent: AnalyticsConsent.Approved,
       language: Languages.EN,
     });

diff --git a/src/background/services/balances/BalancesServicePVM.test.ts b/src/background/services/balances/BalancesServicePVM.test.ts
@@ -87,6 +87,7 @@ describe('src/background/services/balances/BalancesServicePVM.ts', () => {
       showTokensWithoutBalances: false,
       theme: ThemeVariant.DARK,
       tokensVisibility: {},
+      collectiblesVisibility: {},
       analyticsConsent: AnalyticsConsent.Approved,
       language: Languages.EN,
     });

diff --git a/src/background/services/settings/SettingService.test.ts b/src/background/services/settings/SettingService.test.ts
@@ -14,6 +14,7 @@ import {
   SettingsState,
   ThemeVariant,
   TokensVisibility,
+  CollectiblesVisibility,
 } from './models';
 import { changeLanguage } from 'i18next';
 import { isTokenSupported } from '../tokens/utils/isTokenSupported';
@@ -67,6 +68,7 @@ describe('background/services/settings/SettingsService.ts', () => {
     showTokensWithoutBalances: true,
     theme: ThemeVariant.DARK,
     tokensVisibility: {},
+    collectiblesVisibility: {},
     analyticsConsent: AnalyticsConsent.Denied,
     language: Languages.DE,
   };
@@ -76,6 +78,7 @@ describe('background/services/settings/SettingsService.ts', () => {
     showTokensWithoutBalances: false,
     theme: ThemeVariant.DARK,
     tokensVisibility: {},
+    collectiblesVisibility: {},
     analyticsConsent: AnalyticsConsent.Approved,
     language: Languages.DE,
   };
@@ -342,6 +345,27 @@ describe('background/services/settings/SettingsService.ts', () => {
       });
     });
 
+    describe('setCollectiblesVisibility', () => {
+      const visibility: CollectiblesVisibility = {
+        '0x00000': false,
+      };
+      it('should save the new value for collectible visibility properly', async () => {
+        const eventListener = jest.fn();
+        service.addListener(SettingsEvents.SETTINGS_UPDATED, eventListener);
+        await service.setCollectiblesVisibility(visibility);
+        expect(eventListener).toHaveBeenCalledWith({
+          ...storedSettings,
+          collectiblesVisibility: visibility,
+        });
+      });
+
+      it('should emit only the language if it fails to save', async () => {
+        await expectToOnlyEmitLanguageAfterFailedOperation(async () => {
+          await service.setCollectiblesVisibility(visibility);
+        });
+      });
+    });
+
     describe('setLanguage', () => {
       it('should save the new value for language properly', async () => {
         const eventListener = jest.fn();

diff --git a/src/background/services/settings/SettingsService.ts b/src/background/services/settings/SettingsService.ts
@@ -13,6 +13,7 @@ import {
   SettingsEvents,
   SETTINGS_UNENCRYPTED_STORAGE_KEY,
   TokensVisibility,
+  CollectiblesVisibility,
   AnalyticsConsent,
 } from './models';
 import { SettingsState, SETTINGS_STORAGE_KEY, ThemeVariant } from './models';
@@ -25,6 +26,7 @@ const DEFAULT_SETTINGS_STATE: SettingsState = {
   showTokensWithoutBalances: false,
   theme: ThemeVariant.DARK,
   tokensVisibility: {},
+  collectiblesVisibility: {},
   analyticsConsent: AnalyticsConsent.Approved,
   language: Languages.EN,
 };
@@ -181,6 +183,14 @@ export class SettingsService implements OnStorageReady, OnLock {
     });
   }
 
+  async setCollectiblesVisibility(visibility: CollectiblesVisibility) {
+    const settings = await this.getSettings();
+    await this.saveSettings({
+      ...settings,
+      collectiblesVisibility: visibility,
+    });
+  }
+
   async setLanguage(language: Languages) {
     changeLanguage(language);
     const settings = await this.getSettings();

diff --git a/src/background/services/settings/handlers/updateCollectiblesVisibility.ts b/src/background/services/settings/handlers/updateCollectiblesVisibility.ts
@@ -0,0 +1,31 @@
+import { ExtensionRequest } from '@src/background/connections/extensionConnection/models';
+import { ExtensionRequestHandler } from '@src/background/connections/models';
+import { injectable } from 'tsyringe';
+import { CollectiblesVisibility } from '../models';
+import { SettingsService } from '../SettingsService';
+
+type HandlerType = ExtensionRequestHandler<
+  ExtensionRequest.SETTINGS_UPDATE_COLLECTIBLES_VISIBILITY,
+  true,
+  [collectiblesVisibility: CollectiblesVisibility]
+>;
+
+@injectable()
+export class UpdateCollectiblesVisibilityHandler implements HandlerType {
+  method = ExtensionRequest.SETTINGS_UPDATE_COLLECTIBLES_VISIBILITY as const;
+
+  constructor(private settingsService: SettingsService) {}
+
+  handle: HandlerType['handle'] = async ({ request }) => {
+    const [collectiblesVisibility] = request.params;
+
+    await this.settingsService.setCollectiblesVisibility(
+      collectiblesVisibility
+    );
+
+    return {
+      ...request,
+      result: true,
+    };
+  };
+}
diff --git a/src/background/services/settings/models.ts b/src/background/services/settings/models.ts
@@ -39,6 +39,10 @@ export type TokensVisibility = {
   [key: string]: boolean;
 };
 
+export type CollectiblesVisibility = {
+  [key: string]: boolean;
+};
+
 export type AddCustomTokenData = {
   token: EnsureDefined<NetworkContractToken, 'chainId'>;
 };
@@ -53,6 +57,7 @@ export interface SettingsState {
   showTokensWithoutBalances: boolean;
   theme: ThemeVariant;
   tokensVisibility: TokensVisibility;
+  collectiblesVisibility: CollectiblesVisibility;
   analyticsConsent: AnalyticsConsent;
   language: Languages;
 }

diff --git a/src/background/services/storage/schemaMigrations/migrations/settings_v2.test.ts b/src/background/services/storage/schemaMigrations/migrations/settings_v2.test.ts
@@ -25,6 +25,7 @@ describe('background/services/storage/schemaMigrations/migrations/settings_v2',
     showTokensWithoutBalances: false,
     theme: ThemeVariant.DARK,
     tokensVisibility: {},
+    collectiblesVisibility: {},
     analyticsConsent: true,
     language: Languages.EN,
   };

diff --git a/src/background/services/storage/schemaMigrations/migrations/settings_v2.ts b/src/background/services/storage/schemaMigrations/migrations/settings_v2.ts
@@ -5,6 +5,7 @@ import {
   Languages,
   ThemeVariant,
   TokensVisibility,
+  CollectiblesVisibility,
 } from '@src/background/services/settings/models';
 import { NetworkContractToken } from '@avalabs/core-chains-sdk';
 
@@ -16,6 +17,7 @@ type PreviousSchema = {
   showTokensWithoutBalances?: boolean;
   theme?: ThemeVariant;
   tokensVisibility?: TokensVisibility;
+  collectiblesVisibility?: CollectiblesVisibility;
   analyticsConsent?: boolean;
   language?: Languages;
 };

diff --git a/src/contexts/SettingsProvider.tsx b/src/contexts/SettingsProvider.tsx
@@ -2,6 +2,7 @@ import { ExtensionRequest } from '@src/background/connections/extensionConnectio
 import {
   TokenType,
   TokenWithBalance,
+  NftTokenWithBalance,
 } from '@src/background/services/balances/models';
 import { LockWalletHandler } from '@src/background/services/lock/handlers/lockWallet';
 import { settingsUpdatedEventListener } from '@src/background/services/settings/events/listeners';
@@ -12,6 +13,7 @@ import { UpdateCurrencyHandler } from '@src/background/services/settings/handler
 import { UpdateShowNoBalanceHandler } from '@src/background/services/settings/handlers/updateShowTokensNoBalance';
 import { UpdateThemeHandler } from '@src/background/services/settings/handlers/updateTheme';
 import { UpdateTokensVisiblityHandler } from '@src/background/services/settings/handlers/updateTokensVisibility';
+import { UpdateCollectiblesVisibilityHandler } from '@src/background/services/settings/handlers/updateCollectiblesVisibility';
 import {
   Languages,
   SettingsState,
@@ -40,6 +42,10 @@ type SettingsFromProvider = SettingsState & {
   toggleShowTokensWithoutBalanceSetting(): Promise<true>;
   toggleTokenVisibility(token: TokenWithBalance): Promise<true | undefined>;
   getTokenVisibility(token: TokenWithBalance): boolean;
+  toggleCollectibleVisibility(
+    token: NftTokenWithBalance
+  ): Promise<true | undefined>;
+  getCollectibleVisibility(token: NftTokenWithBalance): boolean;
   updateTheme(theme: ThemeVariant): Promise<boolean>;
   currencyFormatter(value: number): string;
   setAnalyticsConsent(consent: boolean): Promise<boolean>;
@@ -139,6 +145,34 @@ export function SettingsContextProvider({ children }: { children: any }) {
     [settings?.tokensVisibility]
   );
 
+  async function toggleCollectibleVisibility(nft: NftTokenWithBalance) {
+    const key = nft.address;
+    const collectiblesVisibility = settings?.collectiblesVisibility ?? {};
+    return request<UpdateCollectiblesVisibilityHandler>({
+      method: ExtensionRequest.SETTINGS_UPDATE_COLLECTIBLES_VISIBILITY,
+      params: [
+        {
+          ...collectiblesVisibility,
+          [key]:
+            collectiblesVisibility[key] !== undefined
+              ? !collectiblesVisibility[key]
+              : false,
+        },
+      ],
+    });
+  }
+
+  const getCollectibleVisibility = useCallback(
+    (nft: NftTokenWithBalance) => {
+      const key = nft.address;
+      const collectiblesVisibility = settings?.collectiblesVisibility ?? {};
+      return (
+        collectiblesVisibility[key] || collectiblesVisibility[key] === undefined
+      );
+    },
+    [settings?.collectiblesVisibility]
+  );
+
   function updateTheme(theme: ThemeVariant) {
     return request<UpdateThemeHandler>({
       method: ExtensionRequest.SETTINGS_UPDATE_THEME,
@@ -170,6 +204,8 @@ export function SettingsContextProvider({ children }: { children: any }) {
           toggleShowTokensWithoutBalanceSetting,
           getTokenVisibility,
           toggleTokenVisibility,
+          getCollectibleVisibility,
+          toggleCollectibleVisibility,
           updateTheme,
           currencyFormatter,
           setAnalyticsConsent,

diff --git a/src/hooks/useIsFunctionAvailable.ts b/src/hooks/useIsFunctionAvailable.ts
@@ -27,6 +27,7 @@ export enum FunctionNames {
   FEATURE = 'Feature', // Default when function name is unknown or not included
   KEYSTONE = 'Keystone',
   MANAGE_TOKEN = 'ManageTokens',
+  MANAGE_COLLECTIBLES = 'ManageCollectibles',
   RECEIVE = 'Receive',
   SEND = 'Send',
   SWAP = 'Swap',
@@ -114,6 +115,16 @@ const disabledFeatures: Record<string, BlacklistConfig> = {
     ],
     complexChecks: [],
   },
+  ManageCollectibles: {
+    networks: [
+      ChainId.BITCOIN,
+      ChainId.AVALANCHE_P,
+      ChainId.AVALANCHE_TEST_P,
+      ChainId.AVALANCHE_X,
+      ChainId.AVALANCHE_TEST_X,
+    ],
+    complexChecks: [],
+  },
   Receive: {
     networks: [],
     complexChecks: [

diff --git a/src/localization/locales/en/translation.json b/src/localization/locales/en/translation.json
@@ -468,6 +468,7 @@
   "Malicious Application": "Malicious Application",
   "Manage": "Manage",
   "Manage Accounts": "Manage Accounts",
+  "Manage Collectibles": "Manage Collectibles",
   "Manage Networks": "Manage Networks",
   "Manage Tokens": "Manage Tokens",
   "Manually Create New Wallet": "Manually Create New Wallet",