Skip to content

Commit

Permalink
Fix: remove deprecated mobile pairing (#2794)
Browse files Browse the repository at this point in the history
* Fix: remove deprecated mobile pairing

* Fix accounts[0] and Delete Account

* Update onboard package

* Update env vars
  • Loading branch information
katspaugh authored Nov 20, 2023
1 parent 4a78e00 commit d019012
Show file tree
Hide file tree
Showing 26 changed files with 551 additions and 1,212 deletions.
3 changes: 1 addition & 2 deletions .env.example
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
## Infura token (required)
## Infura token
NEXT_PUBLIC_INFURA_TOKEN=
NEXT_PUBLIC_SAFE_APPS_INFURA_TOKEN=

Expand All @@ -22,7 +22,6 @@ NEXT_PUBLIC_SENTRY_DSN=
NEXT_PUBLIC_BEAMER_ID=

# Wallet-specific variables
NEXT_PUBLIC_WC_BRIDGE=
NEXT_PUBLIC_WC_PROJECT_ID=

# E2E tests
Expand Down
63 changes: 32 additions & 31 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,37 +17,38 @@ Contributions, be it a bug report or a pull request, are very welcome. Please ch

Create a `.env` file with environment variables. You can use the `.env.example` file as a reference.

Here's the list of all the required and optional variables:

| Env variable | | Description
| ------------------------------------------------------ | ------------ | -----------
| `NEXT_PUBLIC_INFURA_TOKEN` | optional | [Infura](https://docs.infura.io/infura/networks/ethereum/how-to/secure-a-project/project-id) RPC API token
| `NEXT_PUBLIC_SAFE_APPS_INFURA_TOKEN` | optional | Infura token for Safe Apps, falls back to `NEXT_PUBLIC_INFURA_TOKEN`
| `NEXT_PUBLIC_IS_PRODUCTION` | optional | Set to `true` to build a minified production app
| `NEXT_PUBLIC_GATEWAY_URL_PRODUCTION` | optional | The base URL for the [Safe Client Gateway](https://github.com/safe-global/safe-client-gateway)
| `NEXT_PUBLIC_GATEWAY_URL_STAGING` | optional | The base CGW URL on staging
| `NEXT_PUBLIC_SAFE_VERSION` | optional | The latest version of the Safe contract, defaults to 1.3.0
| `NEXT_PUBLIC_WC_BRIDGE` | optional | [WalletConnect v1](https://docs.walletconnect.com/1.0/bridge-server) bridge URL, falls back to the public WC bridge
| `NEXT_PUBLIC_WC_PROJECT_ID` | optional | [WalletConnect v2](https://docs.walletconnect.com/2.0/cloud/relay) project ID
| `NEXT_PUBLIC_TENDERLY_ORG_NAME` | optional | [Tenderly](https://tenderly.co) org name for Transaction Simulation
| `NEXT_PUBLIC_TENDERLY_PROJECT_NAME` | optional | Tenderly project name
| `NEXT_PUBLIC_TENDERLY_SIMULATE_ENDPOINT_URL` | optional | Tenderly simulation URL
| `NEXT_PUBLIC_BEAMER_ID` | optional | [Beamer](https://www.getbeamer.com) is a news feed for in-app announcements
| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_ID` | optional | [GTM](https://tagmanager.google.com) project id
| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_DEVELOPMENT_AUTH` | optional | Dev GTM key
| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_LATEST_AUTH` | optional | Preview GTM key
| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_LIVE_AUTH` | optional | Production GTM key
| `NEXT_PUBLIC_SENTRY_DSN` | optional | [Sentry](https://sentry.io) id for tracking runtime errors
| `NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_PRODUCTION` | optional | [Safe Gelato Relay Service](https://github.com/safe-global/safe-gelato-relay-service) URL to allow relaying transactions via Gelato
| `NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_STAGING` | optional | Relay URL on staging
| `NEXT_PUBLIC_IS_OFFICIAL_HOST` | optional | Whether it's the official distribution of the app, or a fork; has legal implications. Set to true only if you also update the legal pages like Imprint and Terms of use
| `NEXT_PUBLIC_REDEFINE_API` | optional | Redefine API base URL
| `NEXT_PUBLIC_FIREBASE_OPTIONS_PRODUCTION` | optional | Firebase Cloud Messaging (FCM) `initializeApp` options on production
| `NEXT_PUBLIC_FIREBASE_VAPID_KEY_PRODUCTION` | optional | FCM vapid key on production
| `NEXT_PUBLIC_FIREBASE_OPTIONS_STAGING` | optional | FCM `initializeApp` options on staging
| `NEXT_PUBLIC_FIREBASE_VAPID_KEY_STAGING` | optional | FCM vapid key on staging

If you don't provide some of the optional vars, the corresponding features will be disabled in the UI.
Here's the list of all the environment variables:

| Env variable | Description
| ------------------------------------------------------ | -----------
| `NEXT_PUBLIC_INFURA_TOKEN` | [Infura](https://docs.infura.io/infura/networks/ethereum/how-to/secure-a-project/project-id) RPC API token
| `NEXT_PUBLIC_SAFE_APPS_INFURA_TOKEN` | Infura token for Safe Apps, falls back to `NEXT_PUBLIC_INFURA_TOKEN`
| `NEXT_PUBLIC_IS_PRODUCTION` | Set to `true` to build a minified production app
| `NEXT_PUBLIC_GATEWAY_URL_PRODUCTION` | The base URL for the [Safe Client Gateway](https://github.com/safe-global/safe-client-gateway)
| `NEXT_PUBLIC_GATEWAY_URL_STAGING` | The base CGW URL on staging
| `NEXT_PUBLIC_SAFE_VERSION` | The latest version of the Safe contract, defaults to 1.3.0
| `NEXT_PUBLIC_WC_PROJECT_ID` | [WalletConnect v2](https://docs.walletconnect.com/2.0/cloud/relay) project ID
| `NEXT_PUBLIC_TENDERLY_ORG_NAME` | [Tenderly](https://tenderly.co) org name for Transaction Simulation
| `NEXT_PUBLIC_TENDERLY_PROJECT_NAME` | Tenderly project name
| `NEXT_PUBLIC_TENDERLY_SIMULATE_ENDPOINT_URL` | Tenderly simulation URL
| `NEXT_PUBLIC_BEAMER_ID` | [Beamer](https://www.getbeamer.com) is a news feed for in-app announcements
| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_ID` | [GTM](https://tagmanager.google.com) project id
| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_DEVELOPMENT_AUTH` | Dev GTM key
| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_LATEST_AUTH` | Preview GTM key
| `NEXT_PUBLIC_GOOGLE_TAG_MANAGER_LIVE_AUTH` | Production GTM key
| `NEXT_PUBLIC_SENTRY_DSN` | [Sentry](https://sentry.io) id for tracking runtime errors
| `NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_PRODUCTION` | [Safe Gelato Relay Service](https://github.com/safe-global/safe-gelato-relay-service) URL to allow relaying transactions via Gelato
| `NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_STAGING` | Relay URL on staging
| `NEXT_PUBLIC_IS_OFFICIAL_HOST` | Whether it's the official distribution of the app, or a fork; has legal implications. Set to true only if you also update the legal pages like Imprint and Terms of use
| `NEXT_PUBLIC_REDEFINE_API` | Redefine API base URL
| `NEXT_PUBLIC_FIREBASE_OPTIONS_PRODUCTION` | Firebase Cloud Messaging (FCM) `initializeApp` options on production
| `NEXT_PUBLIC_FIREBASE_VAPID_KEY_PRODUCTION` | FCM vapid key on production
| `NEXT_PUBLIC_FIREBASE_OPTIONS_STAGING` | FCM `initializeApp` options on staging
| `NEXT_PUBLIC_FIREBASE_VAPID_KEY_STAGING` | FCM vapid key on staging
| `NEXT_PUBLIC_SOCIAL_WALLET_OPTIONS_PRODUCTION` | Web3Auth and Google credentials (production)
| `NEXT_PUBLIC_SOCIAL_WALLET_OPTIONS_STAGING` | Web3Auth and Google credentials (staging)

If you don't provide some of the variables, the corresponding features will be disabled in the UI.

### Running the app locally

Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@
"@web3-onboard/keystone": "^2.3.7",
"@web3-onboard/ledger": "2.3.2",
"@web3-onboard/trezor": "^2.4.2",
"@web3-onboard/walletconnect": "^2.4.7",
"@web3-onboard/walletconnect": "^2.5.0",
"@web3auth/mpc-core-kit": "^1.1.3",
"blo": "^1.1.1",
"bn.js": "^5.2.1",
Expand Down
1 change: 0 additions & 1 deletion src/components/common/AppStoreButton/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import { MOBILE_APP_EVENTS, trackEvent } from '@/services/analytics'

// App Store campaigns track the user interaction
enum LINKS {
pairing = 'https://apps.apple.com/app/apple-store/id1515759131?pt=119497694&ct=Web%20App%20Connect&mt=8',
footer = 'https://apps.apple.com/app/apple-store/id1515759131?pt=119497694&ct=Web%20App%20Footer&mt=8',
}

Expand Down
7 changes: 0 additions & 7 deletions src/components/common/ConnectWallet/styles.module.css
Original file line number Diff line number Diff line change
Expand Up @@ -64,13 +64,6 @@
border-bottom: 1px solid var(--color-border-light);
}

.pairingDetails {
display: flex;
flex-direction: column;
align-items: center;
gap: var(--space-2);
}

.loginButton {
min-height: 42px;
}
Expand Down
12 changes: 0 additions & 12 deletions src/components/common/PairingDetails/PairingDeprecationWarning.tsx

This file was deleted.

24 changes: 0 additions & 24 deletions src/components/common/PairingDetails/PairingDescription.tsx

This file was deleted.

53 changes: 0 additions & 53 deletions src/components/common/PairingDetails/PairingQRCode.tsx

This file was deleted.

6 changes: 3 additions & 3 deletions src/components/common/WalletInfo/index.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ describe('WalletInfo', () => {
/>,
)

expect(getByText('Delete Account')).toBeInTheDocument()
expect(getByText('Delete account')).toBeInTheDocument()
})

it('should not display a Delete Account on prod', () => {
Expand All @@ -122,7 +122,7 @@ describe('WalletInfo', () => {
/>,
)

expect(queryByText('Delete Account')).not.toBeInTheDocument()
expect(queryByText('Delete account')).not.toBeInTheDocument()
})

it('should not display a Delete Account if not social login', () => {
Expand All @@ -140,7 +140,7 @@ describe('WalletInfo', () => {
/>,
)

expect(queryByText('Delete Account')).not.toBeInTheDocument()
expect(queryByText('Delete account')).not.toBeInTheDocument()
})

it('should display an enable mfa button if mfa is not enabled', () => {
Expand Down
7 changes: 4 additions & 3 deletions src/components/common/WalletInfo/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -59,9 +59,10 @@ export const WalletInfo = ({
const isSocialLogin = isSocialLoginWallet(wallet.label)

return (
<>
<Box className={css.container}>
<Box className={css.accountContainer}>
<ChainIndicator />

<Box className={css.addressContainer}>
{isSocialLogin ? (
<>
Expand Down Expand Up @@ -108,10 +109,10 @@ export const WalletInfo = ({

{!IS_PRODUCTION && isSocialLogin && (
<Button onClick={resetAccount} variant="danger" size="small" fullWidth disableElevation>
Delete Account
Delete account
</Button>
)}
</>
</Box>
)
}

Expand Down
7 changes: 7 additions & 0 deletions src/components/common/WalletInfo/styles.module.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,10 @@
.container {
width: 100%;
display: flex;
flex-direction: column;
gap: var(--space-2);
}

.accountContainer {
width: 100%;
margin-bottom: var(--space-1);
Expand Down
4 changes: 2 additions & 2 deletions src/components/walletconnect/WcSessionList/WcNoSessions.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,9 @@ const WcSampleDapps = ({ onUnload }: { onUnload: () => void }) => {
return (
<Typography variant="body2" display="flex" justifyContent="space-between" alignItems="center" mt={3}>
{SAMPLE_DAPPS.map((item) => (
<Typography variant="body2" ml={1} key={item.url}>
<Typography variant="body2" key={item.url}>
<ExternalLink href={item.url} noIcon px={1}>
<img src={item.icon} alt={item.name} width={32} height={32} />
<img src={item.icon} alt={item.name} width={32} height={32} style={{ marginRight: '0.5em' }} />
{item.name}
</ExternalLink>
</Typography>
Expand Down
1 change: 0 additions & 1 deletion src/config/constants.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ export const SENTRY_DSN = process.env.NEXT_PUBLIC_SENTRY_DSN || ''
export const BEAMER_ID = process.env.NEXT_PUBLIC_BEAMER_ID || ''

// Wallets
export const WC_BRIDGE = process.env.NEXT_PUBLIC_WC_BRIDGE || 'https://bridge.walletconnect.org'
export const WC_PROJECT_ID = process.env.NEXT_PUBLIC_WC_PROJECT_ID || ''
export const TREZOR_APP_URL = 'app.safe.global'
export const TREZOR_EMAIL = '[email protected]'
Expand Down
2 changes: 0 additions & 2 deletions src/hooks/wallets/consts.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ export const enum WALLET_KEYS {
WALLETCONNECT_V2 = 'WALLETCONNECT_V2',
SOCIAL = 'SOCIAL_LOGIN',
COINBASE = 'COINBASE',
PAIRING = 'PAIRING',
LEDGER = 'LEDGER',
TREZOR = 'TREZOR',
KEYSTONE = 'KEYSTONE',
Expand All @@ -14,7 +13,6 @@ export const CGW_NAMES: { [key in WALLET_KEYS]: string | undefined } = {
[WALLET_KEYS.INJECTED]: 'detectedwallet',
[WALLET_KEYS.WALLETCONNECT_V2]: 'walletConnect_v2',
[WALLET_KEYS.COINBASE]: 'coinbase',
[WALLET_KEYS.PAIRING]: 'safeMobile',
[WALLET_KEYS.SOCIAL]: 'socialSigner',
[WALLET_KEYS.LEDGER]: 'ledger',
[WALLET_KEYS.TREZOR]: 'trezor',
Expand Down
17 changes: 0 additions & 17 deletions src/hooks/wallets/useOnboard.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import useChains, { useCurrentChain } from '@/hooks/useChains'
import ExternalStore from '@/services/ExternalStore'
import { logError, Errors } from '@/services/exceptions'
import { trackEvent, WALLET_EVENTS } from '@/services/analytics'
import { useInitPairing } from '@/services/pairing/hooks'
import { useAppSelector } from '@/store'
import { type EnvState, selectRpc } from '@/store/settingsSlice'
import { E2E_WALLET_NAME } from '@/tests/e2e-wallet'
Expand Down Expand Up @@ -93,21 +92,11 @@ const isMobile = () => /iPhone|iPad|iPod|Android/i.test(navigator.userAgent)
// Detect injected wallet
const hasInjectedWallet = () => typeof window !== 'undefined' && !!window?.ethereum

// `connectWallet` is called when connecting/switching wallets and on pairing `connect` event (when prev. session connects)
// This re-entrant lock prevents multiple `connectWallet`/tracking calls that would otherwise occur for pairing module
let isConnecting = false

// Wrapper that tracks/sets the last used wallet
export const connectWallet = async (
onboard: OnboardAPI,
options?: Parameters<OnboardAPI['connectWallet']>[0],
): Promise<WalletState[] | undefined> => {
if (isConnecting) {
return
}

isConnecting = true

// On mobile, automatically choose WalletConnect if there is no injected wallet
if (!options && isMobile() && !hasInjectedWallet()) {
options = {
Expand All @@ -121,13 +110,9 @@ export const connectWallet = async (
wallets = await onboard.connectWallet(options)
} catch (e) {
logError(Errors._302, e)

isConnecting = false
return
}

isConnecting = false

return wallets
}

Expand All @@ -153,8 +138,6 @@ export const useInitOnboard = () => {
const onboard = useStore()
const customRpc = useAppSelector(selectRpc)

useInitPairing()

useEffect(() => {
if (configs.length > 0 && chain) {
void initOnboard(configs, chain, customRpc)
Expand Down
2 changes: 0 additions & 2 deletions src/hooks/wallets/wallets.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import ledgerModule from '@web3-onboard/ledger/dist/index'
import trezorModule from '@web3-onboard/trezor'
import walletConnect from '@web3-onboard/walletconnect'

import pairingModule from '@/services/pairing/module'
import e2eWalletModule from '@/tests/e2e-wallet'
import { CGW_NAMES, WALLET_KEYS } from './consts'
import MpcModule from '@/services/mpc/SocialLoginModule'
Expand Down Expand Up @@ -42,7 +41,6 @@ const WALLET_MODULES: { [key in WALLET_KEYS]: (chain: ChainInfo) => WalletInit }
[WALLET_KEYS.INJECTED]: () => injectedWalletModule(),
[WALLET_KEYS.WALLETCONNECT_V2]: (chain) => walletConnectV2(chain),
[WALLET_KEYS.COINBASE]: () => coinbaseModule({ darkMode: prefersDarkMode() }),
[WALLET_KEYS.PAIRING]: () => pairingModule(),
[WALLET_KEYS.SOCIAL]: (chain) => MpcModule(chain),
[WALLET_KEYS.LEDGER]: () => ledgerModule(),
[WALLET_KEYS.TREZOR]: () => trezorModule({ appUrl: TREZOR_APP_URL, email: TREZOR_EMAIL }),
Expand Down
3 changes: 0 additions & 3 deletions src/pages/_app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,6 @@ import { WalletConnectProvider } from '@/services/walletconnect/WalletConnectCon
import useABTesting from '@/services/tracking/useAbTesting'
import { AbTest } from '@/services/tracking/abTesting'
import { useNotificationTracking } from '@/components/settings/PushNotifications/hooks/useNotificationTracking'
import MobilePairingModal from '@/services/pairing/QRModal'

const GATEWAY_URL = IS_PRODUCTION || cgwDebugStorage.get() ? GATEWAY_URL_PRODUCTION : GATEWAY_URL_STAGING

Expand Down Expand Up @@ -126,8 +125,6 @@ const WebCoreApp = ({

<Notifications />

<MobilePairingModal />

<PasswordRecoveryModal />
</AppProviders>
</CacheProvider>
Expand Down
1 change: 0 additions & 1 deletion src/services/exceptions/ErrorCodes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,6 @@ enum ErrorCodes {
_106 = '106: Failed to get connected wallet',

_302 = '302: Error connecting to the wallet',
_303 = '303: Error creating pairing session',
_304 = '304: Error enabling MFA',
_305 = '305: Error exporting account key',
_306 = '306: Error logging in',
Expand Down
Loading

0 comments on commit d019012

Please sign in to comment.