chore: report nft shortcuts, nft context menu fixes and Cmd+K bug fix…

…es (#1425) Co-authored-by: Magomed Khamidov <[email protected]> Co-authored-by: MK <[email protected]> Co-authored-by: MK <[email protected]>
rainbow-me · May 14, 2024 · 5b4ecac · 5b4ecac
1 parent cd618ed
commit 5b4ecac
Show file tree

Hide file tree

Showing 25 changed files with 542 additions and 346 deletions.
diff --git a/e2e/parallel/watchWalletFlow.test.ts b/e2e/parallel/watchWalletFlow.test.ts
@@ -127,10 +127,8 @@ describe('Watch wallet then add more and switch between them', () => {
  });
  await delayTime('medium');
 
- it('should display seed account wallet name', async () => {
- const account = await getTextFromText({ id: 'account-name', driver });
- expect(account).toBe(shortenAddress(TEST_VARIABLES.EMPTY_WALLET.ADDRESS));
- });
+ const account = await getTextFromText({ id: 'account-name', driver });
+ expect(account).toBe(shortenAddress(TEST_VARIABLES.EMPTY_WALLET.ADDRESS));
  });
 
  it('should be able to add a new wallet via watch', async () => {
@@ -152,32 +150,24 @@ describe('Watch wallet then add more and switch between them', () => {
  text: TEST_VARIABLES.WATCHED_WALLET.SECONDARY_ADDRESS,
  });
 
- await waitUntilElementByTestIdIsPresent({
- id: 'watch-wallets-button-ready',
- driver,
- });
-
  await findElementByTestIdAndClick({
  id: 'watch-wallets-button-ready',
  driver,
  });
 
  await delayTime('medium');
+ await goToPopup(driver, rootURL);
+ const label = await querySelector(
+ driver,
+ '[data-testid="header"] [data-testid="account-name"]',
+ );
 
- it('should display watched account name', async () => {
- await goToPopup(driver, rootURL);
- const label = await querySelector(
- driver,
- '[data-testid="header"] [data-testid="account-name"]',
- );
-
- const actual = await label.getText();
- const expected = [
- '0x089b...be9E',
- TEST_VARIABLES.WATCHED_WALLET.SECONDARY_ADDRESS,
- ];
- expect(expected.includes(actual)).toEqual(true);
- });
+ const actual = await label.getText();
+ const expected = [
+ '0x089b...be9E',
+ TEST_VARIABLES.WATCHED_WALLET.SECONDARY_ADDRESS,
+ ];
+ expect(expected.includes(actual)).toEqual(true);
  });
 
  it('should be able to add a new wallet via pk', async () => {

diff --git a/src/core/references/shortcuts.ts b/src/core/references/shortcuts.ts
@@ -202,6 +202,10 @@ export const shortcuts = {
  display: 'H',
  key: 'h',
  },
+ REPORT_NFT: {
+ display: 'R',
+ key: 'r',
+ },
  },
  wallets: {
  CHOOSE_WALLET_GROUP_NEW: {

diff --git a/src/core/state/hiddenAssets/hiddenAssets.ts b/src/core/state/hiddenAssets/hiddenAssets.ts
@@ -1,3 +1,4 @@
+import { Address } from 'wagmi';
 import create from 'zustand';
 
 import { ParsedUserAsset } from '~/core/types/assets';
@@ -6,16 +7,12 @@ import { SearchAsset } from '~/core/types/search';
 import { createStore } from '../internal/createStore';
 import { withSelectors } from '../internal/withSelectors';
 
-type UpdateHiddenAssetArgs = {
- uniqueId: string;
-};
-
-type UpdateHiddenAssetFn = ({ uniqueId }: UpdateHiddenAssetArgs) => void;
+type HiddenAssetDict = Record<string, boolean>;
+type HiddenAssetsByAddress = Record<Address, HiddenAssetDict>;
 
 export interface HiddenAssetState {
- hiddenAssets: string[];
- addHiddenAsset: UpdateHiddenAssetFn;
- removeHiddenAsset: UpdateHiddenAssetFn;
+ hidden: HiddenAssetsByAddress;
+ toggleHideAsset: (address: Address, uniqueId: string) => void;
 }
 
 export const computeUniqueIdForHiddenAsset = (
@@ -26,26 +23,24 @@ export const computeUniqueIdForHiddenAsset = (
 
 export const hiddenAssetsStore = createStore<HiddenAssetState>(
  (set, get) => ({
- hiddenAssets: [],
- addHiddenAsset: ({ uniqueId }: UpdateHiddenAssetArgs) => {
- const { hiddenAssets } = get();
- set({
- hiddenAssets: [...hiddenAssets, uniqueId],
- });
- },
- removeHiddenAsset: ({ uniqueId }: UpdateHiddenAssetArgs) => {
- const { hiddenAssets } = get();
+ hidden: {},
+ toggleHideAsset: (address: Address, uniqueId: string) => {
+ const { hidden } = get();
  set({
- hiddenAssets: hiddenAssets.filter(
- (_uniqueId) => _uniqueId !== uniqueId,
- ),
+ hidden: {
+ ...hidden,
+ [address]: {
+ ...(hidden[address] ?? {}),
+ [uniqueId]: !hidden[address]?.[uniqueId],
+ },
+ },
  });
  },
  }),
  {
  persist: {
  name: 'hidden_assets',
- version: 1,
+ version: 2,
  },
  },
 );

diff --git a/src/core/state/pinnedAssets/index.ts b/src/core/state/pinnedAssets/index.ts
@@ -1,49 +1,47 @@
+import { Address } from 'wagmi';
 import create from 'zustand';
 
 import { createStore } from '../internal/createStore';
 
 type PinnedAsset = {
- uniqueId: string;
+ pinned: boolean;
  createdAt: number;
 };
 
-type UpdatePinnedAssetArgs = {
- uniqueId: string;
-};
-
-type UpdatePinnedAssetFn = ({ uniqueId }: UpdatePinnedAssetArgs) => void;
+type PinnedAssetDict = Record<string, PinnedAsset>;
+type PinnedAssetsByAddress = Record<Address, PinnedAssetDict>;
 
 export interface PinnedAssetState {
- pinnedAssets: PinnedAsset[];
- addPinnedAsset: UpdatePinnedAssetFn;
- removedPinnedAsset: UpdatePinnedAssetFn;
+ pinned: PinnedAssetsByAddress;
+ togglePinAsset: (address: Address, uniqueId: string) => void;
 }
 
 export const pinnedAssets = createStore<PinnedAssetState>(
  (set, get) => ({
- pinnedAssets: [],
- addPinnedAsset: ({ uniqueId }: UpdatePinnedAssetArgs) => {
- const { pinnedAssets } = get();
- set({
- pinnedAssets: [
- ...pinnedAssets,
- { uniqueId, createdAt: new Date().getTime() },
- ],
- });
- },
- removedPinnedAsset: ({ uniqueId }: UpdatePinnedAssetArgs) => {
- const { pinnedAssets } = get();
+ pinned: {},
+ togglePinAsset: (address: Address, uniqueId: string) => {
+ const { pinned } = get();
+ const isPinned = pinned[address]?.[uniqueId]?.pinned;
  set({
- pinnedAssets: pinnedAssets.filter(
- ({ uniqueId: _uniqueId }) => _uniqueId !== uniqueId,
- ),
+ pinned: {
+ ...pinned,
+ [address]: {
+ ...(pinned[address] ?? {}),
+ [uniqueId]: {
+ pinned: !isPinned,
+ createdAt: isPinned
+ ? pinned[address][uniqueId].createdAt
+ : Date.now(),
+ },
+ },
+ },
  });
  },
  }),
  {
  persist: {
  name: 'pinned_assets',
- version: 1,
+ version: 2,
  },
  },
 );

diff --git a/src/design-system/components/Alert/Alert.tsx b/src/design-system/components/Alert/Alert.tsx
@@ -16,6 +16,7 @@ interface AlertProps {
  callback?: () => void;
  text: string;
  description?: string;
+ dismissText?: string;
 }
 
 const eventEmitter = new EventEmitter();
@@ -33,10 +34,12 @@ export const triggerAlert = ({
  text,
  description,
  callback,
+ dismissText,
 }: AlertProps) => {
  eventEmitter.emit('rainbow_alert', {
  action,
  actionText,
+ dismissText,
  text,
  description,
  callback,
@@ -119,7 +122,7 @@ export const Alert = () => {
  tabIndex={0}
  >
  <Text color="label" size="16pt" weight="bold">
- {i18n.t('alert.ok')}
+ {alert?.dismissText || i18n.t('alert.ok')}
  </Text>
  </Button>
  </Inline>

diff --git a/src/entries/popup/components/AccountItem/AccountItem.tsx b/src/entries/popup/components/AccountItem/AccountItem.tsx
@@ -7,7 +7,7 @@ import {
  selectorFilterByUserChains,
 } from '~/core/resources/_selectors/assets';
 import { useUserAssets } from '~/core/resources/assets';
-import { useCurrentCurrencyStore } from '~/core/state';
+import { useCurrentAddressStore, useCurrentCurrencyStore } from '~/core/state';
 import { useHideAssetBalancesStore } from '~/core/state/currentSettings/hideAssetBalances';
 import {
  computeUniqueIdForHiddenAsset,
@@ -40,14 +40,14 @@ export enum LabelOption {
 }
 
 const TotalAssetsBalance = ({ account }: { account: Address }) => {
- const { hiddenAssets } = useHiddenAssetStore();
+ const { hidden } = useHiddenAssetStore();
  const { currentCurrency: currency } = useCurrentCurrencyStore();
+ const { currentAddress: address } = useCurrentAddressStore();
  const isHidden = useCallback(
- (asset: ParsedUserAsset) =>
- hiddenAssets.some(
- (uniqueId) => uniqueId === computeUniqueIdForHiddenAsset(asset),
- ),
- [hiddenAssets],
+ (asset: ParsedUserAsset) => {
+ return !!hidden[address]?.[computeUniqueIdForHiddenAsset(asset)];
+ },
+ [address, hidden],
  );
  const { data: totalAssetsBalance, isLoading } = useUserAssets(
  { address: account, currency },

diff --git a/...ntries/popup/components/AppConnection/AppConnectionWalletItem/AppConnectionWalletItem.tsx b/...ntries/popup/components/AppConnection/AppConnectionWalletItem/AppConnectionWalletItem.tsx
@@ -54,16 +54,14 @@ export const AppConnectionWalletItem = React.forwardRef(
  const [hovering, setHovering] = useState(false);
  const { displayName } = useWalletName({ address });
  const chainName = getChainName({ chainId });
- const { hiddenAssets } = useHiddenAssetStore();
+ const { hidden } = useHiddenAssetStore();
  const showChainBadge = !!chainId && chainId !== ChainId.mainnet;
  const isHidden = useCallback(
- (asset: ParsedUserAsset) =>
- hiddenAssets.some(
- (uniqueId) => uniqueId === computeUniqueIdForHiddenAsset(asset),
- ),
- [hiddenAssets],
+ (asset: ParsedUserAsset) => {
+ return !!hidden[address]?.[computeUniqueIdForHiddenAsset(asset)];
+ },
+ [address, hidden],
  );
-
  const { currentCurrency: currency } = useCurrentCurrencyStore();
  const { data: totalAssetsBalance } = useUserAssets(
  { address, currency },

diff --git a/src/entries/popup/hooks/useKeyboardAnalytics.ts b/src/entries/popup/hooks/useKeyboardAnalytics.ts
@@ -44,6 +44,7 @@ export type KeyboardEventDescription =
  | 'nfts.download'
  | 'nfts.hide'
  | 'nfts.send'
+ | 'nfts.report'
  | 'radix.switchMenu.dismiss'
  | 'send.cancel'
  | 'send.copyContactAddress'