-
Notifications
You must be signed in to change notification settings - Fork 2.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
19 changed files
with
1,029 additions
and
241 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -22,4 +22,7 @@ dist-ssr | |
*.njsproj | ||
*.sln | ||
*.sw? | ||
.env | ||
.env | ||
|
||
# vite | ||
vite.config.ts.timestamp-*.mjs |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
139 changes: 91 additions & 48 deletions
139
packages/bridge-ui/src/components/buttons/Connect.svelte
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,62 +1,105 @@ | ||
<script lang="ts"> | ||
import { onDestroy } from "svelte"; | ||
import { BigNumber, ethers } from "ethers"; | ||
import { signer } from "../../store/signer"; | ||
import { _ } from "svelte-i18n"; | ||
import { CHAIN_MAINNET, CHAIN_TKO } from "../..//domain/chain"; | ||
import { | ||
connect as wagmiConnect, | ||
Connector, | ||
fetchSigner, | ||
watchAccount, | ||
watchNetwork, | ||
} from "@wagmi/core"; | ||
import { CHAIN_MAINNET, CHAIN_TKO } from "../../domain/chain"; | ||
import { fromChain, toChain } from "../../store/chain"; | ||
import { ethereum } from "../../store/ethereum"; | ||
import { isSwitchEthereumChainModalOpen } from "../../store/modal"; | ||
import { | ||
isSwitchEthereumChainModalOpen, | ||
isConnectWalletModalOpen, | ||
} from "../../store/modal"; | ||
import { errorToast, successToast } from "../../utils/toast"; | ||
import Modal from "../modals/Modal.svelte"; | ||
import { wagmiClient } from "../../store/wagmi"; | ||
import MetaMask from "../icons/MetaMask.svelte"; | ||
import WalletConnect from "../icons/WalletConnect.svelte"; | ||
import CoinbaseWallet from "../icons/CoinbaseWallet.svelte"; | ||
import { transactioner, transactions } from "../../store/transactions"; | ||
async function connect() { | ||
try { | ||
const getAccounts = async () => { | ||
ethereum.set(window.ethereum); | ||
const provider = new ethers.providers.Web3Provider(window.ethereum); | ||
await provider.send("eth_requestAccounts", []); | ||
const s = provider.getSigner(); | ||
signer.set(s); | ||
transactions.set( | ||
await $transactioner.GetAllByAddress(await s.getAddress()) | ||
); | ||
}; | ||
const changeChain = async (chainId: number) => { | ||
if (chainId === CHAIN_TKO.id) { | ||
fromChain.set(CHAIN_TKO); | ||
toChain.set(CHAIN_MAINNET); | ||
} else if (chainId === CHAIN_MAINNET.id) { | ||
fromChain.set(CHAIN_MAINNET); | ||
toChain.set(CHAIN_TKO); | ||
} else { | ||
isSwitchEthereumChainModalOpen.set(true); | ||
} | ||
}; | ||
await getAccounts(); | ||
const { chainId } = await $signer.provider.getNetwork(); | ||
await changeChain(chainId); | ||
window.ethereum.on("chainChanged", async (chainId) => { | ||
await changeChain(BigNumber.from(chainId).toNumber()); | ||
}); | ||
window.ethereum.on("accountsChanged", async (accounts) => { | ||
await getAccounts(); | ||
}); | ||
successToast("Connected"); | ||
} catch (e) { | ||
console.log(e); | ||
errorToast("Error connecting to wallet"); | ||
const changeChain = async (chainId: number) => { | ||
if (chainId === CHAIN_TKO.id) { | ||
fromChain.set(CHAIN_TKO); | ||
toChain.set(CHAIN_MAINNET); | ||
} else if (chainId === CHAIN_MAINNET.id) { | ||
fromChain.set(CHAIN_MAINNET); | ||
toChain.set(CHAIN_TKO); | ||
} else { | ||
isSwitchEthereumChainModalOpen.set(true); | ||
} | ||
}; | ||
let unwatchNetwork; | ||
let unwatchAccount; | ||
async function setSigner() { | ||
const wagmiSigner = await fetchSigner(); | ||
signer.set(wagmiSigner); | ||
return wagmiSigner; | ||
} | ||
async function connectWithConnector(connector: Connector) { | ||
const { chain } = await wagmiConnect({ connector }); | ||
await setSigner(); | ||
await changeChain(chain.id); | ||
unwatchNetwork = watchNetwork( | ||
async (network) => await changeChain(network.chain.id) | ||
); | ||
unwatchAccount = watchAccount(async () => { | ||
const s = await setSigner(); | ||
transactions.set( | ||
await $transactioner.GetAllByAddress(await s.getAddress()) | ||
); | ||
}); | ||
successToast("Connected"); | ||
} | ||
const iconMap = { | ||
metamask: MetaMask, | ||
walletconnect: WalletConnect, | ||
"coinbase wallet": CoinbaseWallet, | ||
}; | ||
onDestroy(() => { | ||
if (unwatchNetwork) { | ||
unwatchNetwork(); | ||
} | ||
if (unwatchAccount) { | ||
unwatchAccount(); | ||
} | ||
}); | ||
</script> | ||
|
||
<button class="btn btn-md md:btn-wide" on:click={async () => await connect()} | ||
<button | ||
class="btn btn-md md:btn-wide" | ||
on:click={() => ($isConnectWalletModalOpen = true)} | ||
>{$_("nav.connect")}</button | ||
> | ||
|
||
<Modal | ||
title={$_("connectModal.title")} | ||
isOpen={$isConnectWalletModalOpen} | ||
onClose={() => ($isConnectWalletModalOpen = false)} | ||
> | ||
<div class="flex flex-col items-center space-y-4 space-x-0 p-8"> | ||
{#each $wagmiClient.connectors as connector} | ||
<button | ||
class="btn flex items-center justify-start md:pl-32 space-x-4 w-full" | ||
on:click={() => connectWithConnector(connector)} | ||
> | ||
<div class="h-7 w-7 flex items-center justify-center"> | ||
<svelte:component this={iconMap[connector.name.toLowerCase()]} /> | ||
</div> | ||
<span>{connector.name}</span> | ||
</button> | ||
{/each} | ||
</div> | ||
</Modal> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
<img style="height: 28px" src="https://avatars.githubusercontent.com/u/1885080?s=200&v=4" alt="Coinbase Wallet"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
<img width={40} height={40} src="https://github.com/WalletConnect/walletconnect-assets/raw/master/Logo/Blue%20(Default)/Logo.svg" alt=""> |
Oops, something went wrong.