Skip to content

Commit

Permalink
Merge pull request #966 from etherisc/hotfix/walletconnect-reenable
Browse files Browse the repository at this point in the history
Hotfix/walletconnect reenable
  • Loading branch information
doerfli authored Dec 15, 2023
2 parents de3d1fa + 4fc4a7f commit 72fa132
Show file tree
Hide file tree
Showing 11 changed files with 13,308 additions and 7,493 deletions.
20,621 changes: 13,217 additions & 7,404 deletions package-lock.json

Large diffs are not rendered by default.

6 changes: 5 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,8 @@
"@mui/x-data-grid": "^6.18.3",
"@mui/x-date-pickers": "^6.18.4",
"@reduxjs/toolkit": "^1.9.7",
"@web3modal/ethereum": "^2.7.1",
"@web3modal/react": "^2.7.1",
"abi-coder": "^4.1.1",
"canvas-confetti": "^1.9.2",
"chart.js": "^4.4.0",
Expand All @@ -53,7 +55,9 @@
"react-redux": "^8.1.3",
"redis": "^4.6.11",
"redis-om": "^0.4.3",
"request-ip": "^3.3.0"
"request-ip": "^3.3.0",
"viem": "^1.20.0",
"wagmi": "^1.4.12"
},
"devDependencies": {
"@chainlink/contracts": "^0.8.0",
Expand Down
51 changes: 25 additions & 26 deletions src/components/account/account.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import { reconnectWallets } from "../../utils/wallet";
import Login from "./login";
import { useDispatch, useSelector } from "react-redux";
import { RootState, store } from "../../redux/store";
// import { useWalletClient } from "wagmi";
import { useWalletClient } from "wagmi";
import { getEthersSigner } from "../../utils/walletconnect";
import { getAndUpdateBlock, getChainState, setAccountRedux } from "../../utils/chain";
import { connectChain, disconnectChain } from "../../redux/slices/chain";
Expand All @@ -24,8 +24,7 @@ export default function Account() {
const balanceUsd1 = useSelector((state: RootState) => state.account.balanceUsd1);
const balanceUsd2 = useSelector((state: RootState) => state.account.balanceUsd2);
const balances = [balance, balanceUsd1, balanceUsd2];
// const { data: walletClient } = useWalletClient();
const walletClient = undefined;
const { data: walletClient } = useWalletClient();

const [ activeBalance, setActiveBalance ] = useState(0);

Expand All @@ -47,31 +46,31 @@ export default function Account() {


// handle wallet connect connection state (login/logout)
// useEffect(() => {
// console.log("walletClient changed", walletClient);
// async function login() {
// console.log("wallet connect login");
// const signer = await getEthersSigner({ chainId: parseInt(CHAIN_ID || "1") });
// if (signer === undefined) {
// return;
// }
// const provider = signer.provider;
// dispatch(connectChain(await getChainState(provider, true)));
// setAccountRedux(signer, dispatch);
// store.dispatch(fetchBalances(signer));
useEffect(() => {
console.log("walletClient changed", walletClient);
async function login() {
console.log("wallet connect login");
const signer = await getEthersSigner({ chainId: parseInt(CHAIN_ID || "1") });
if (signer === undefined) {
return;
}
const provider = signer.provider;
dispatch(connectChain(await getChainState(provider, true)));
setAccountRedux(signer, dispatch);
store.dispatch(fetchBalances(signer));

// provider.on("block", (blockNumber: number) => {
// getAndUpdateBlock(dispatch, provider, blockNumber);
// });
// }
provider.on("block", (blockNumber: number) => {
getAndUpdateBlock(dispatch, provider, blockNumber);
});
}

// if (walletClient !== undefined && ! loggedIn) {
// login();
// } else if (walletClient === undefined && loggedIn && isWalletConnect) {
// console.log("wallet connect logout")
// dispatch(disconnectChain());
// }
// }, [walletClient, loggedIn, dispatch, isWalletConnect]);
if (walletClient !== undefined && ! loggedIn) {
login();
} else if (walletClient === undefined && loggedIn && isWalletConnect) {
console.log("wallet connect logout")
dispatch(disconnectChain());
}
}, [walletClient, loggedIn, dispatch]);


if (! loggedIn) {
Expand Down
4 changes: 2 additions & 2 deletions src/components/account/login.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -47,9 +47,9 @@ export default function Login() {
<Grid item xs={12} sx={{ p: 1 }}>
<LoginWithMetaMaskButton closeDialog={() => setShowLoginDialog(false)} />
</Grid>
{/* <Grid item xs={12} sx={{ p: 1 }}>
<Grid item xs={12} sx={{ p: 1 }}>
<LoginWithWalletConnectV2Button closeDialog={() => setShowLoginDialog(false)} />
</Grid> */}
</Grid>
</Grid>
</DialogContentText>
</DialogContent>
Expand Down
6 changes: 3 additions & 3 deletions src/components/account/login_walletconnectv2.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,13 @@ import { faRightToBracket } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { useMediaQuery, useTheme } from "@mui/material";
import Button from '@mui/material/Button';
// import { useWeb3Modal } from "@web3modal/react";
import { useWeb3Modal } from "@web3modal/react";
import { useTranslation } from "next-i18next";
import { useSelector } from "react-redux";

export default function LoginWithWalletConnectV2Button(props: any) {
const { closeDialog } = props;
// const { open } = useWeb3Modal();
const { open } = useWeb3Modal();

const { t } = useTranslation('common');
const theme = useTheme();
Expand All @@ -20,7 +20,7 @@ export default function LoginWithWalletConnectV2Button(props: any) {
console.log("wallet connect v2 login");
closeDialog();
// show walletconnect v2 modal
// open();
open();
}

let button = (<></>);
Expand Down
10 changes: 5 additions & 5 deletions src/components/account/logout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,19 +4,19 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faRightFromBracket } from "@fortawesome/free-solid-svg-icons";
import { useDispatch, useSelector } from "react-redux";
import { removeSigner } from '../../utils/chain';
// import { useDisconnect } from 'wagmi';
import { useDisconnect } from 'wagmi';

export default function Logout() {
const { t } = useTranslation('common');
const { isConnected, isWalletConnect } = useSelector((state: any) => state.chain);
const dispatch = useDispatch();
// const { disconnect: wagmiDisconnect } = useDisconnect();
const { disconnect: wagmiDisconnect } = useDisconnect();

const logout = async () => {
removeSigner(dispatch);
// if (isWalletConnect) {
// wagmiDisconnect();
// }
if (isWalletConnect) {
wagmiDisconnect();
}
}

let button = (<></>);
Expand Down
36 changes: 17 additions & 19 deletions src/config/walletconnect.ts
Original file line number Diff line number Diff line change
@@ -1,36 +1,34 @@
// import { EthereumClient, w3mConnectors } from "@web3modal/ethereum";
// import { configureChains, createConfig } from "wagmi";
// import { mainnet, polygonMumbai } from 'wagmi/chains';
// import { publicProvider } from 'wagmi/providers/public';
import { EthereumClient, w3mConnectors } from "@web3modal/ethereum";
import { configureChains, createConfig } from "wagmi";
import { mainnet, polygonMumbai } from 'wagmi/chains';
import { publicProvider } from 'wagmi/providers/public';

export const CHAIN_ID = process.env.NEXT_PUBLIC_CHAIN_ID;
console.log("wallet connect config", "chainid", CHAIN_ID);

export const WALLET_CONNECT_PROJECT_ID = process.env.NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID || "";

// configure walletconnect v2
// let chainsList = [];
let chainsList;
if (CHAIN_ID === "80001") {
// console.log("wallet connect config", "chainid", chainId, "polygonMumbai");
// chainsList = [polygonMumbai];
chainsList = [polygonMumbai];
} else if (CHAIN_ID === "1") {
// console.log("wallet connect config", "chainid", chainId, "mainnet");
// chainsList = [mainnet];
chainsList = [mainnet];
} else {
// console.log("wallet connect config", "chainid", chainId, "mainnet");
// chainsList = [mainnet];
chainsList = [mainnet];
}

// console.log("wallet connect config", "chainsList", chainsList);
// @ts-ignore testnet not set on mainnet chain - ignore complaint
// const { chains, publicClient } = configureChains(chainsList, [publicProvider()]);
// // console.log("wallet connect config", "chains", chains, "publicClient", publicClient);
// export const wagmiConfig = createConfig({
// autoConnect: true,
// connectors: w3mConnectors({ projectId: WALLET_CONNECT_PROJECT_ID, chains }),
// publicClient
// });
// // console.log("wallet connect config", "wagmiConfig", wagmiConfig);
// export const ethereumClient = new EthereumClient(wagmiConfig, chains);
export const wagmiConfig = undefined;
export const ethereumClient = undefined;
const { chains, publicClient } = configureChains(chainsList, [publicProvider()]);
// console.log("wallet connect config", "chains", chains, "publicClient", publicClient);
export const wagmiConfig = createConfig({
autoConnect: true,
connectors: w3mConnectors({ projectId: WALLET_CONNECT_PROJECT_ID, chains }),
publicClient
});
// console.log("wallet connect config", "wagmiConfig", wagmiConfig);
export const ethereumClient = new EthereumClient(wagmiConfig, chains);
10 changes: 5 additions & 5 deletions src/pages/_app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,9 +23,9 @@ import { getAndUpdateWalletAccount } from '../utils/wallet';
import '@fortawesome/fontawesome-svg-core/styles.css';
// Prevent fontawesome from adding its CSS since we did it manually above:
import { config } from '@fortawesome/fontawesome-svg-core';
// import { Web3Modal } from '@web3modal/react';
import { Web3Modal } from '@web3modal/react';
import { Provider, useDispatch, useSelector } from 'react-redux';
// import { WagmiConfig } from 'wagmi';
import { WagmiConfig } from 'wagmi';
import { WALLET_CONNECT_PROJECT_ID, ethereumClient, wagmiConfig } from '../config/walletconnect';
import { resetSelectedBundle } from '../redux/slices/bundles';
import { RootState, store } from '../redux/store';
Expand Down Expand Up @@ -110,10 +110,10 @@ export function AppWithBlockchainConnection(appProps: AppProps) {
return (
<SnackbarProvider maxSnack={3} anchorOrigin={{ horizontal: "center", vertical: "top" }}>
<LocalizationProvider dateAdapter={AdapterDayjs}>
{/* <WagmiConfig config={wagmiConfig}> */}
<WagmiConfig config={wagmiConfig}>
<Layout {...appProps} />
{/* </WagmiConfig> */}
{/* <Web3Modal projectId={WALLET_CONNECT_PROJECT_ID} ethereumClient={ethereumClient} /> */}
</WagmiConfig>
<Web3Modal projectId={WALLET_CONNECT_PROJECT_ID} ethereumClient={ethereumClient} />
</LocalizationProvider>
</SnackbarProvider>
);
Expand Down
26 changes: 14 additions & 12 deletions src/utils/wallet.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,24 +5,26 @@ import { getAndUpdateBlock, getChainState, setAccountRedux, updateSigner } from
import { AnyAction, Dispatch } from "@reduxjs/toolkit";
import { fetchBalances } from "../redux/thunks/account";
import { store } from "../redux/store";
import { getEthersSigner } from "./walletconnect";
import { CHAIN_ID } from "../config/walletconnect";


export async function reconnectWallets(dispatch: Dispatch<AnyAction>) {
// try to reconnect walletconnect connection first
// const wcSigner = await getEthersSigner({ chainId: parseInt(CHAIN_ID || "1") });
// if (wcSigner !== undefined) {
// console.log("reconnect walletconnect");
// const provider = wcSigner.provider;
// dispatch(connectChain(await getChainState(provider, true)));
// setAccountRedux(wcSigner, dispatch);
// store.dispatch(fetchBalances(wcSigner));
const wcSigner = await getEthersSigner({ chainId: parseInt(CHAIN_ID || "1") });
if (wcSigner !== undefined) {
console.log("reconnect walletconnect");
const provider = wcSigner.provider;
dispatch(connectChain(await getChainState(provider, true)));
setAccountRedux(wcSigner, dispatch);
store.dispatch(fetchBalances(wcSigner));

// provider.on("block", (blockNumber: number) => {
// getAndUpdateBlock(dispatch, provider, blockNumber);
// });
provider.on("block", (blockNumber: number) => {
getAndUpdateBlock(dispatch, provider, blockNumber);
});

// return;
// }
return;
}

// if that fails, try to reconnect browser injected wallet
// @ts-ignore
Expand Down
29 changes: 14 additions & 15 deletions src/utils/walletconnect.ts
Original file line number Diff line number Diff line change
@@ -1,22 +1,21 @@
// import { type WalletClient, getWalletClient } from '@wagmi/core';
import { type WalletClient, getWalletClient } from '@wagmi/core';
import { providers } from 'ethers';

export function walletClientToSigner(walletClient: unknown) {
// const { account, chain, transport } = walletClient
// const network = {
// chainId: chain.id,
// name: chain.name,
// ensAddress: chain.contracts?.ensRegistry?.address,
// }
// const provider = new providers.Web3Provider(transport, network)
// const signer = provider.getSigner(account.address)
return undefined;
export function walletClientToSigner(walletClient: WalletClient) {
const { account, chain, transport } = walletClient
const network = {
chainId: chain.id,
name: chain.name,
ensAddress: chain.contracts?.ensRegistry?.address,
}
const provider = new providers.Web3Provider(transport, network)
const signer = provider.getSigner(account.address)
return signer
}

/** Action to convert a viem Wallet Client to an ethers.js Signer. */
export async function getEthersSigner({ chainId }: { chainId?: number } = {}) {
// const walletClient = await getWalletClient({ chainId })
// if (!walletClient) return undefined
// return walletClientToSigner(walletClient)
return undefined;
const walletClient = await getWalletClient({ chainId })
if (!walletClient) return undefined
return walletClientToSigner(walletClient)
}
2 changes: 1 addition & 1 deletion src/version.json
Original file line number Diff line number Diff line change
@@ -1 +1 @@
{"name": "depeg-interface", "version": "1.2.5", "date": "2023-12-14" }
{ "name": "depeg-ui", "version": "dev", "date": "202T-0D-A1" }

0 comments on commit 72fa132

Please sign in to comment.