From 8bed70b2a06cde35c0c0e60f6ce8c55dc8f97f5b Mon Sep 17 00:00:00 2001 From: aeolian <94939382+aeolianeth@users.noreply.github.com> Date: Tue, 31 Dec 2024 11:46:21 +1000 Subject: [PATCH] fix: change networks logic --- package.json | 2 +- src/hooks/ContractReader/useContractReader.ts | 2 +- .../util/useCallContractRead.ts | 2 +- src/hooks/Wallet/hooks/useChangeNetworks.ts | 4 +++ src/hooks/Wallet/hooks/useSigner.ts | 10 +++++-- src/hooks/Wallet/useWallet.ts | 5 ++-- src/hooks/useTransactor.ts | 9 ++++++- src/locales/messages.pot | 3 +++ .../usePayProjectModal/usePayProjectTx.ts | 5 +++- .../useProjectControllerAddress.ts | 7 ++--- .../V4ProjectDashboard/V4ProjectHeader.tsx | 4 +-- .../ProjectSettingsContent.tsx | 26 +++++++++---------- .../ProjectSettingsDashboard.tsx | 24 ++++++++--------- .../ProjectSettingsLayout.tsx | 15 ++++++----- .../hooks/useSettingsPagePath.ts | 3 +++ yarn.lock | 8 +++--- 16 files changed, 77 insertions(+), 52 deletions(-) diff --git a/package.json b/package.json index 05605b398b..8b7baa7495 100644 --- a/package.json +++ b/package.json @@ -107,7 +107,7 @@ "he": "^1.2.0", "jsonwebtoken": "^9.0.0", "juice-sdk-core": "^12.2.4-alpha", - "juice-sdk-react": "^12.2.4-alpha", + "juice-sdk-react": "^12.2.5-alpha", "juicebox-metadata-helper": "0.1.7", "less": "4.1.2", "lodash": "^4.17.21", diff --git a/src/hooks/ContractReader/useContractReader.ts b/src/hooks/ContractReader/useContractReader.ts index 668f20ce9b..4c2254e885 100644 --- a/src/hooks/ContractReader/useContractReader.ts +++ b/src/hooks/ContractReader/useContractReader.ts @@ -16,7 +16,7 @@ export interface ContractReaderProps { } export function useContractReader({ - contract, + contract, // name of the contract contracts, functionName, args, diff --git a/src/hooks/ContractReader/util/useCallContractRead.ts b/src/hooks/ContractReader/util/useCallContractRead.ts index a235b411aa..915ae8e908 100644 --- a/src/hooks/ContractReader/util/useCallContractRead.ts +++ b/src/hooks/ContractReader/util/useCallContractRead.ts @@ -17,7 +17,7 @@ export async function callContractRead({ contracts?: Record | undefined }) { try { - console.info(`📚 Read >`, functionName) + console.info(`📚 Read >`, functionName, { contract: readContract, args }) return await readContract[functionName](...(args ?? [])) } catch (error) { console.error(`📕 Read error >`, functionName, error, { diff --git a/src/hooks/Wallet/hooks/useChangeNetworks.ts b/src/hooks/Wallet/hooks/useChangeNetworks.ts index 7645f1b63e..ab24493136 100644 --- a/src/hooks/Wallet/hooks/useChangeNetworks.ts +++ b/src/hooks/Wallet/hooks/useChangeNetworks.ts @@ -3,6 +3,10 @@ import { useCallback } from 'react' import { readNetwork } from 'constants/networks' +/** + * Attempts to sync the user wallet's chain with the readNetwork (hard-coded per environment) + * @returns function to sync the user wallet's chain with the readNetwork + */ export function useChangeNetworks() { const [{ chains }, setChain] = useSetChain() diff --git a/src/hooks/Wallet/hooks/useSigner.ts b/src/hooks/Wallet/hooks/useSigner.ts index 7bed193d6b..2dac7f10a5 100644 --- a/src/hooks/Wallet/hooks/useSigner.ts +++ b/src/hooks/Wallet/hooks/useSigner.ts @@ -7,14 +7,20 @@ export function useSigner() { const [{ wallet }] = useConnectWallet() const chainUnsupported = useChainUnsupported() const signerProvider = useMemo(() => { - if (!wallet) return undefined + if (!wallet) { + return undefined + } + return new providers.Web3Provider(wallet.provider, 'any') }, [wallet]) const signer = useMemo(() => { // If the provider is not available or the chain is unsupported, we // shouldn't attempt to do anything - if (!signerProvider || chainUnsupported) return undefined + if (!signerProvider || chainUnsupported) { + return undefined + } + return signerProvider.getSigner() }, [chainUnsupported, signerProvider]) diff --git a/src/hooks/Wallet/useWallet.ts b/src/hooks/Wallet/useWallet.ts index e97d72250a..5ccbaaab09 100644 --- a/src/hooks/Wallet/useWallet.ts +++ b/src/hooks/Wallet/useWallet.ts @@ -1,11 +1,12 @@ import { useChain, + useChainUnsupported, useChangeNetworks, useDisconnect, useIsConnected, useSigner, useUserAddress, - useWalletBalance + useWalletBalance, } from './hooks' import { useConnectWallet } from '@web3-onboard/react' @@ -15,7 +16,7 @@ export function useWallet() { const userAddress = useUserAddress() const isConnected = useIsConnected() const chain = useChain() - const chainUnsupported = false //useChainUnsupported() + const chainUnsupported = useChainUnsupported() const balance = useWalletBalance() const [, connect] = useConnectWallet() diff --git a/src/hooks/useTransactor.ts b/src/hooks/useTransactor.ts index 1a39b6e095..65a1ac4860 100644 --- a/src/hooks/useTransactor.ts +++ b/src/hooks/useTransactor.ts @@ -1,5 +1,6 @@ import { t } from '@lingui/macro' import { FEATURE_FLAGS } from 'constants/featureFlags' +import { readNetwork } from 'constants/networks' import { TxHistoryContext } from 'contexts/Transaction/TxHistoryContext' import { Contract, providers } from 'ethers' import { simulateTransaction } from 'lib/tenderly' @@ -7,7 +8,10 @@ import { TransactionOptions } from 'models/transaction' import { CV2V3 } from 'packages/v2v3/models/cv' import { useCallback, useContext } from 'react' import { featureFlagEnabled } from 'utils/featureFlags' -import { emitErrorNotification } from 'utils/notifications' +import { + emitErrorNotification, + emitInfoNotification, +} from 'utils/notifications' import { useWallet } from './Wallet' type TxOpts = Omit @@ -91,6 +95,9 @@ export function useTransactor(): Transactor | undefined { ) => { if (chainUnsupported) { await changeNetworks() + emitInfoNotification( + t`Your wallet has been changed to ${readNetwork.name}. Try transaction again.`, + ) options?.onDone?.() return false } diff --git a/src/locales/messages.pot b/src/locales/messages.pot index 05f37ffa68..60a4e1b0f4 100644 --- a/src/locales/messages.pot +++ b/src/locales/messages.pot @@ -2228,6 +2228,9 @@ msgstr "" msgid "Redeem your {tokensLabel} to reclaim a portion of the ETH not needed for payouts. Any {tokensLabel} you redeem will be burned." msgstr "" +msgid "Your wallet has been changed to {0}. Try transaction again." +msgstr "" + msgid "<0>{tokenSymbol} ERC-20 address: <1/>" msgstr "" diff --git a/src/packages/v2v3/components/V2V3Project/ProjectDashboard/components/PayRedeemCard/PayProjectModal/hooks/usePayProjectModal/usePayProjectTx.ts b/src/packages/v2v3/components/V2V3Project/ProjectDashboard/components/PayRedeemCard/PayProjectModal/hooks/usePayProjectModal/usePayProjectTx.ts index b5d64a2cd7..c27c34400f 100644 --- a/src/packages/v2v3/components/V2V3Project/ProjectDashboard/components/PayRedeemCard/PayProjectModal/hooks/usePayProjectModal/usePayProjectTx.ts +++ b/src/packages/v2v3/components/V2V3Project/ProjectDashboard/components/PayRedeemCard/PayProjectModal/hooks/usePayProjectModal/usePayProjectTx.ts @@ -137,7 +137,10 @@ export const usePayProjectTx = ({ ) if (!success) { onTransactionErrorCallback( - onError ?? new Error('Transaction failed'), + onError ?? + new Error( + 'Payment failed. Make sure your wallet has funds, is set to the correct chain (e.g. mainnet) and try again. If problems persist, click "Reset Website".', + ), formikHelpers, ) } diff --git a/src/packages/v2v3/hooks/contractReader/useProjectControllerAddress.ts b/src/packages/v2v3/hooks/contractReader/useProjectControllerAddress.ts index d84955dd01..90eebff578 100644 --- a/src/packages/v2v3/hooks/contractReader/useProjectControllerAddress.ts +++ b/src/packages/v2v3/hooks/contractReader/useProjectControllerAddress.ts @@ -1,16 +1,13 @@ -import { ContractConfig } from 'hooks/ContractReader/types' import { V2V3ContractName } from 'packages/v2v3/models/contracts' import useV2ContractReader from './useV2ContractReader' export default function useProjectControllerAddress({ projectId, - contract, }: { - projectId?: number - contract?: ContractConfig | undefined + projectId: number | undefined }) { return useV2ContractReader({ - contract: contract ?? V2V3ContractName.JBDirectory, + contract: V2V3ContractName.JBDirectory, functionName: 'controllerOf', args: projectId ? [projectId] : null, }) diff --git a/src/packages/v4/views/V4ProjectDashboard/V4ProjectHeader.tsx b/src/packages/v4/views/V4ProjectDashboard/V4ProjectHeader.tsx index ce91676e82..12672d3a99 100644 --- a/src/packages/v4/views/V4ProjectDashboard/V4ProjectHeader.tsx +++ b/src/packages/v4/views/V4ProjectDashboard/V4ProjectHeader.tsx @@ -74,7 +74,7 @@ export const V4ProjectHeader = ({ className }: { className?: string }) => { ))} - {canQueueRuleSets && ( + {canQueueRuleSets && chainId && ( { Owned by: - {gnosisSafe && projectId && ( + {gnosisSafe && projectId && chainId && ( JSX.Element | null @@ -62,7 +62,7 @@ function Breadcrumbs({
  • Manage @@ -73,7 +73,7 @@ function Breadcrumbs({
  • {pageTitle} @@ -105,7 +105,7 @@ export function ProjectSettingsContent({ className="mb-7" settingsPageKey={settingsPageKey} /> - + diff --git a/src/packages/v4/views/V4ProjectSettings/ProjectSettingsDashboard.tsx b/src/packages/v4/views/V4ProjectSettings/ProjectSettingsDashboard.tsx index a87e42e946..548fcd903d 100644 --- a/src/packages/v4/views/V4ProjectSettings/ProjectSettingsDashboard.tsx +++ b/src/packages/v4/views/V4ProjectSettings/ProjectSettingsDashboard.tsx @@ -4,19 +4,19 @@ import { useJBProjectMetadataContext, } from 'juice-sdk-react' +import { Trans } from '@lingui/macro' import { Button } from 'antd' import EthereumAddress from 'components/EthereumAddress' -import Link from 'next/link' import Loading from 'components/Loading' -import { ProjectSettingsLayout } from './ProjectSettingsLayout' -import { Trans } from '@lingui/macro' -import { V4OperatorPermission } from 'packages/v4/models/v4Permissions' +import Link from 'next/link' import { useProjectHasErc20Token } from 'packages/v4/hooks/useProjectHasErc20Token' -import useProjectOwnerOf from 'packages/v4/hooks/useV4ProjectOwnerOf' -import { useSettingsPagePath } from './hooks/useSettingsPagePath' import { useV4BalanceOfNativeTerminal } from 'packages/v4/hooks/useV4BalanceOfNativeTerminal' -import { useV4DistributableAmount } from '../V4ProjectDashboard/V4ProjectTabs/V4CyclesPayoutsPanel/hooks/useV4DistributableAmount' +import useProjectOwnerOf from 'packages/v4/hooks/useV4ProjectOwnerOf' import { useV4WalletHasPermission } from 'packages/v4/hooks/useV4WalletHasPermission' +import { V4OperatorPermission } from 'packages/v4/models/v4Permissions' +import { useV4DistributableAmount } from '../V4ProjectDashboard/V4ProjectTabs/V4CyclesPayoutsPanel/hooks/useV4DistributableAmount' +import { useSettingsPagePath } from './hooks/useSettingsPagePath' +import { ProjectSettingsLayout } from './ProjectSettingsLayout' export type SettingsPageKey = | 'general' @@ -146,12 +146,12 @@ export function ProjectSettingsDashboard() { >
    • - + Basic details
    • - + Archive
      • @@ -169,7 +169,7 @@ export function ProjectSettingsDashboard() { Make changes to your ruleset settings and rules } > - + Edit next ruleset @@ -179,7 +179,7 @@ export function ProjectSettingsDashboard() { >
      • - + NFTs
        • @@ -192,7 +192,7 @@ export function ProjectSettingsDashboard() {
          {canCreateErc20Token && (
        • - + Create ERC-20 Token
          • diff --git a/src/packages/v4/views/V4ProjectSettings/ProjectSettingsLayout.tsx b/src/packages/v4/views/V4ProjectSettings/ProjectSettingsLayout.tsx index 44bfb2ca13..3de83d2ee1 100644 --- a/src/packages/v4/views/V4ProjectSettings/ProjectSettingsLayout.tsx +++ b/src/packages/v4/views/V4ProjectSettings/ProjectSettingsLayout.tsx @@ -18,13 +18,14 @@ export const ProjectSettingsLayout: React.FC = ({ Manage project - - - - + {chainId ? ( + + + + ) : null} diff --git a/src/packages/v4/views/V4ProjectSettings/hooks/useSettingsPagePath.ts b/src/packages/v4/views/V4ProjectSettings/hooks/useSettingsPagePath.ts index 908fce024a..7368b22ff1 100644 --- a/src/packages/v4/views/V4ProjectSettings/hooks/useSettingsPagePath.ts +++ b/src/packages/v4/views/V4ProjectSettings/hooks/useSettingsPagePath.ts @@ -5,6 +5,9 @@ import { SettingsPageKey } from '../ProjectSettingsDashboard' export function useSettingsPagePath(key?: SettingsPageKey) { const { projectId } = useJBContractContext() const chainId = useJBChainId() + if (!chainId || !projectId) { + return undefined + } return settingsPagePath({ projectId: Number(projectId), chainId }, key) } diff --git a/yarn.lock b/yarn.lock index c612fd90bb..f4cdb85e17 100644 --- a/yarn.lock +++ b/yarn.lock @@ -12186,10 +12186,10 @@ juice-sdk-core@^12.2.4-alpha: bs58 "^5.0.0" fpnum "^1.0.0" -juice-sdk-react@^12.2.4-alpha: - version "12.2.4-alpha" - resolved "https://registry.yarnpkg.com/juice-sdk-react/-/juice-sdk-react-12.2.4-alpha.tgz#2d53d1296d7d0817c3a7dda75b99570df12661f2" - integrity sha512-SX/WvlCANpgS568Ohdf7q+yC2jLY4vTUUGjgmZD2XUgCZTbfPorgUbZ4pxWwWgtfxydq6vyoPHcUUjWItMEPWw== +juice-sdk-react@^12.2.5-alpha: + version "12.2.5-alpha" + resolved "https://registry.yarnpkg.com/juice-sdk-react/-/juice-sdk-react-12.2.5-alpha.tgz#399a1a2d9a8c7142739bf5578dd2cf9d1b4b75b5" + integrity sha512-lZnWIBVvo8xwwCQwyhkmvETxIOFP1vwrmekUihwZaPsbzyvrWekvPk7YkgfEWk2W4wClt13g2i9so24vYz2DEQ== juice@^10.0.0: version "10.0.0"