feat: wallet features

.changeset/old-beers-agree.md

@@ -0,0 +1,18 @@
+---
+'@reown/appkit-coinbase-ethers-react-native': minor
+'@reown/appkit-coinbase-wagmi-react-native': minor
+'@reown/appkit-scaffold-utils-react-native': minor
+'@reown/appkit-auth-ethers-react-native': minor
+'@reown/appkit-auth-wagmi-react-native': minor
+'@reown/appkit-scaffold-react-native': minor
+'@reown/appkit-ethers5-react-native': minor
+'@reown/appkit-common-react-native': minor
+'@reown/appkit-ethers-react-native': minor
+'@reown/appkit-wallet-react-native': minor
+'@reown/appkit-wagmi-react-native': minor
+'@reown/appkit-core-react-native': minor
+'@reown/appkit-siwe-react-native': minor
+'@reown/appkit-ui-react-native': minor
+---
+
+feat: added wallet features for universal wallets

.github/workflows/snapshot.yml

@@ -20,7 +20,7 @@ jobs:
         uses: ./.github/actions/setup
 
       - name: Publish Snapshots
-        continue-on-error: true
+        continue-on-error: false
         env:
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

apps/gallery/stories/composites/AccountButton.stories.tsx

@@ -12,8 +12,8 @@ const meta: Meta<typeof AccountButton> = {
     address: {
       control: { type: 'text' }
     },
-    isProfileName: {
-      control: { type: 'boolean' }
+    profileName: {
+      control: { type: 'text' }
     },
     networkSrc: {
       control: { type: 'text' }
@@ -26,8 +26,7 @@ const meta: Meta<typeof AccountButton> = {
     avatarSrc: avatarImageSrc,
     address: '0xDBbD65026a07cFbFa1aa92744E4D69951686077d',
     networkSrc: networkImageSrc,
-    balance: '0.527 ETH',
-    isProfileName: false
+    balance: '0.527 ETH'
   }
 };
 
@@ -41,7 +40,7 @@ export const Default: Story = {
       address={args.address}
       networkSrc={args.networkSrc}
       balance={args.balance}
-      isProfileName={args.isProfileName}
+      profileName={args.profileName}
     />
   )
 };

apps/gallery/stories/composites/Chip.stories.tsx

@@ -1,13 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
 import { Chip } from '@reown/appkit-ui-react-native';
-import {
-  chipOptions,
-  externalLabel,
-  externalLink,
-  iconOptions,
-  walletImageSrc
-} from '../../utils/PresetUtils';
+import { chipOptions, externalLabel, iconOptions, walletImageSrc } from '../../utils/PresetUtils';
 
 const meta: Meta<typeof Chip> = {
   component: Chip,
@@ -23,9 +17,6 @@ const meta: Meta<typeof Chip> = {
     disabled: {
       control: { type: 'boolean' }
     },
-    link: {
-      control: { type: 'text' }
-    },
     label: {
       control: { type: 'text' }
     },
@@ -42,7 +33,6 @@ const meta: Meta<typeof Chip> = {
     size: 'md',
     disabled: false,
     icon: 'disconnect',
-    link: externalLink,
     label: externalLabel,
     imageSrc: walletImageSrc
   }
@@ -57,7 +47,7 @@ export const Default: Story = {
       variant={args.variant}
       size={args.size}
       disabled={args.disabled}
-      link={args.link}
+      onPress={() => {}}
       label={args.label}
       imageSrc={args.imageSrc}
       icon={args.icon}

apps/gallery/stories/composites/ListItem.stories.tsx

@@ -10,18 +10,10 @@ const meta: Meta<typeof ListItem> = {
     imageSrc: {
       control: { type: 'text' }
     },
-    variant: {
-      options: ['image', 'icon'],
-      control: { type: 'select' }
-    },
     icon: {
       options: iconOptions,
       control: { type: 'select' }
     },
-    iconVariant: {
-      options: ['blue', 'overlay'],
-      control: { type: 'select' }
-    },
     disabled: {
       control: { type: 'boolean' }
     },
@@ -33,10 +25,8 @@ const meta: Meta<typeof ListItem> = {
     }
   },
   args: {
-    variant: 'image',
     imageSrc: networkImageSrc,
     icon: 'swapHorizontal',
-    iconVariant: 'blue',
     disabled: false,
     chevron: true,
     loading: false
@@ -50,10 +40,8 @@ export const Default: Story = {
   render: (args: any) => (
     <GalleryContainer width={300}>
       <ListItem
-        variant={args.variant}
         imageSrc={args.imageSrc}
         icon={args.icon}
-        iconVariant={args.iconVariant}
         disabled={args.disabled}
         chevron={args.chevron}
         loading={args.loading}

apps/gallery/stories/composites/NetworkButton.stories.tsx

@@ -6,10 +6,6 @@ import { networkImageSrc } from '../../utils/PresetUtils';
 const meta: Meta<typeof NetworkButton> = {
   component: NetworkButton,
   argTypes: {
-    variant: {
-      options: ['fill', 'shade'],
-      control: { type: 'select' }
-    },
     disabled: {
       control: { type: 'boolean' }
     },
@@ -21,7 +17,6 @@ const meta: Meta<typeof NetworkButton> = {
     }
   },
   args: {
-    variant: 'fill',
     disabled: false,
     children: 'Ethereum',
     imageSrc: networkImageSrc
@@ -33,12 +28,7 @@ type Story = StoryObj<typeof NetworkButton>;
 
 export const Default: Story = {
   render: args => (
-    <NetworkButton
-      variant={args.variant}
-      disabled={args.disabled}
-      imageSrc={args.imageSrc}
-      onPress={() => {}}
-    >
+    <NetworkButton disabled={args.disabled} imageSrc={args.imageSrc} onPress={() => {}}>
       {args.children}
     </NetworkButton>
   )

apps/gallery/utils/PresetUtils.ts

@@ -32,8 +32,6 @@ export const avatarImageSrc =
 export const wcUri =
   'wc:139520827546986d057472f8bbd7ef0484409458034b61cca59d908563773c7a@2?relay-protocol=irn&symKey=43b5fad11bf07bc8a0aa12231435a4ad3e72e2d1fa257cf191a90ec5b62cb0a';
 
-export const externalLink = 'https://www.fireblocks.com';
-
 export const externalLabel = 'www.fireblocks.com';
 
 export const colorOptions: ColorType[] = [

packages/common/package.json

@@ -11,6 +11,10 @@
     "test": "jest  --passWithNoTests",
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx"
   },
+  "dependencies": {
+    "bignumber.js": "9.1.2",
+    "dayjs": "1.11.10"
+  },
   "files": [
     "src",
     "lib"

packages/common/src/contracts/erc20.ts

@@ -0,0 +1,48 @@
+export const erc20ABI = [
+  {
+    type: 'function',
+    name: 'transfer',
+    stateMutability: 'nonpayable',
+    inputs: [
+      {
+        name: '_to',
+        type: 'address'
+      },
+      {
+        name: '_value',
+        type: 'uint256'
+      }
+    ],
+    outputs: [
+      {
+        name: '',
+        type: 'bool'
+      }
+    ]
+  },
+  {
+    type: 'function',
+    name: 'transferFrom',
+    stateMutability: 'nonpayable',
+    inputs: [
+      {
+        name: '_from',
+        type: 'address'
+      },
+      {
+        name: '_to',
+        type: 'address'
+      },
+      {
+        name: '_value',
+        type: 'uint256'
+      }
+    ],
+    outputs: [
+      {
+        name: '',
+        type: 'bool'
+      }
+    ]
+  }
+];

packages/common/src/contracts/usdt.ts

@@ -0,0 +1,43 @@
+export const usdtABI = [
+  {
+    type: 'function',
+    name: 'transfer',
+    stateMutability: 'nonpayable',
+    inputs: [
+      {
+        name: 'recipient',
+        type: 'address'
+      },
+      {
+        name: 'amount',
+        type: 'uint256'
+      }
+    ],
+    outputs: []
+  },
+  {
+    type: 'function',
+    name: 'transferFrom',
+    stateMutability: 'nonpayable',
+    inputs: [
+      {
+        name: 'sender',
+        type: 'address'
+      },
+      {
+        name: 'recipient',
+        type: 'address'
+      },
+      {
+        name: 'amount',
+        type: 'uint256'
+      }
+    ],
+    outputs: [
+      {
+        name: '',
+        type: 'bool'
+      }
+    ]
+  }
+];

packages/common/src/index.ts

@@ -1,2 +1,8 @@
 export { ConstantsUtil } from './utils/ConstantsUtil';
+export { ContractUtil } from './utils/ContractUtil';
+export { DateUtil } from './utils/DateUtil';
+export { NamesUtil } from './utils/NamesUtil';
 export { NetworkUtil } from './utils/NetworkUtil';
+export { NumberUtil } from './utils/NumberUtil';
+export { erc20ABI } from './contracts/erc20';
+export * from './utils/TypeUtil';

packages/common/src/utils/ConstantsUtil.ts

@@ -1,7 +1,25 @@
 export const ConstantsUtil = {
+  WC_NAME_SUFFIX: '.reown.id',
+  WC_NAME_SUFFIX_LEGACY: '.wcn.id',
   BLOCKCHAIN_API_RPC_URL: 'https://rpc.walletconnect.org',
   PULSE_API_URL: 'https://pulse.walletconnect.org',
   API_URL: 'https://api.web3modal.org',
   COINBASE_CONNECTOR_ID: 'coinbaseWallet',
-  COINBASE_EXPLORER_ID: 'fd20dc426fb37566d803205b19bbc1d4096b248ac04548e3cfb6b3a38bd033aa'
+  COINBASE_EXPLORER_ID: 'fd20dc426fb37566d803205b19bbc1d4096b248ac04548e3cfb6b3a38bd033aa',
+  USDT_CONTRACT_ADDRESSES: [
+    // Mainnet
+    '0xdac17f958d2ee523a2206206994597c13d831ec7',
+    // Polygon
+    '0xc2132d05d31c914a87c6611c10748aeb04b58e8f',
+    // Avalanche
+    '0x9702230a8ea53601f5cd2dc00fdbc13d4df4a8c7',
+    // Cosmos
+    '0x919C1c267BC06a7039e03fcc2eF738525769109c',
+    // Celo
+    '0x48065fbBE25f71C9282ddf5e1cD6D6A887483D5e',
+    // Binance
+    '0x55d398326f99059fF775485246999027B3197955',
+    // Arbitrum
+    '0xfd086bc7cd5c481dcc9c85ebe478a1c0b69fcbb9'
+  ]
 };

packages/common/src/utils/ContractUtil.ts

@@ -0,0 +1,13 @@
+import { erc20ABI } from '../contracts/erc20';
+import { usdtABI } from '../contracts/usdt';
+import { ConstantsUtil } from './ConstantsUtil';
+
+export const ContractUtil = {
+  getERC20Abi: (tokenAddress: string) => {
+    if (ConstantsUtil.USDT_CONTRACT_ADDRESSES.includes(tokenAddress)) {
+      return usdtABI;
+    }
+
+    return erc20ABI;
+  }
+};

packages/common/src/utils/DateUtil.ts

@@ -0,0 +1,47 @@
+import dayjs from 'dayjs';
+import englishLocale from 'dayjs/locale/en.js';
+import relativeTime from 'dayjs/plugin/relativeTime.js';
+import updateLocale from 'dayjs/plugin/updateLocale.js';
+
+dayjs.extend(relativeTime);
+dayjs.extend(updateLocale);
+
+const localeObject = {
+  ...englishLocale,
+  name: 'en-web3-modal',
+  relativeTime: {
+    future: 'in %s',
+    past: '%s ago',
+    s: '%d sec',
+    m: '1 min',
+    mm: '%d min',
+    h: '1 hr',
+    hh: '%d hrs',
+    d: '1 d',
+    dd: '%d d',
+    M: '1 mo',
+    MM: '%d mo',
+    y: '1 yr',
+    yy: '%d yr'
+  }
+};
+
+dayjs.locale('en-appkit', localeObject);
+
+export const DateUtil = {
+  getYear(date: string = new Date().toISOString()) {
+    return dayjs(date).year();
+  },
+
+  getRelativeDateFromNow(date: string | number) {
+    return dayjs(date).locale('en-appkit').fromNow(true);
+  },
+
+  formatDate(date: string | number, format = 'DD MMM') {
+    return dayjs(date).format(format);
+  },
+
+  getMonth(month: number) {
+    return dayjs().month(month).format('MMMM');
+  }
+};

packages/common/src/utils/NamesUtil.ts

@@ -0,0 +1,10 @@
+import { ConstantsUtil } from './ConstantsUtil';
+
+export const NamesUtil = {
+  isReownName(value: string) {
+    return (
+      value?.endsWith(ConstantsUtil.WC_NAME_SUFFIX_LEGACY) ||
+      value?.endsWith(ConstantsUtil.WC_NAME_SUFFIX)
+    );
+  }
+};