|
|
|
@ -1,12 +1,11 @@
|
|
|
|
|
import React, {useState} from 'react';
|
|
|
|
|
import logo from './logo.svg';
|
|
|
|
|
import './App.css';
|
|
|
|
|
import React, {useState} from "react";
|
|
|
|
|
import "./App.css";
|
|
|
|
|
|
|
|
|
|
import Web3 from 'web3';
|
|
|
|
|
import { WagmiConfig, createClient, configureChains, mainnet, useConnect, useAccount, useDisconnect } from 'wagmi'
|
|
|
|
|
import Web3 from "web3";
|
|
|
|
|
import { WagmiConfig, createClient, configureChains, mainnet, useConnect, useAccount, useDisconnect } from "wagmi"
|
|
|
|
|
|
|
|
|
|
import { MetaMaskConnector } from 'wagmi/connectors/metaMask'
|
|
|
|
|
import { publicProvider } from 'wagmi/providers/public'
|
|
|
|
|
import { MetaMaskConnector } from "wagmi/connectors/metaMask"
|
|
|
|
|
import { publicProvider } from "wagmi/providers/public"
|
|
|
|
|
|
|
|
|
|
const web3 = new Web3(Web3.givenProvider);
|
|
|
|
|
|
|
|
|
@ -23,17 +22,17 @@ const airdropContract = new web3.eth.Contract(Airdrop.abi as any, airdropAddress
|
|
|
|
|
const { chains, provider, webSocketProvider } = configureChains([mainnet], [publicProvider()]);
|
|
|
|
|
|
|
|
|
|
const wagmiClient = createClient({
|
|
|
|
|
autoConnect: true,
|
|
|
|
|
connectors: [
|
|
|
|
|
new MetaMaskConnector({ chains }),
|
|
|
|
|
],
|
|
|
|
|
provider,
|
|
|
|
|
webSocketProvider,
|
|
|
|
|
autoConnect: true,
|
|
|
|
|
connectors: [
|
|
|
|
|
new MetaMaskConnector({ chains }),
|
|
|
|
|
],
|
|
|
|
|
provider,
|
|
|
|
|
webSocketProvider,
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function Profile() {
|
|
|
|
|
const { connect, connectors, error, isLoading, pendingConnector } =
|
|
|
|
|
const { connect, connectors, error, isLoading, pendingConnector } =
|
|
|
|
|
useConnect()
|
|
|
|
|
|
|
|
|
|
const { address, connector, isConnected } = useAccount()
|
|
|
|
@ -41,34 +40,34 @@ function Profile() {
|
|
|
|
|
|
|
|
|
|
if (isConnected) {
|
|
|
|
|
const connectorName = connector?.name || "unknown connector";
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<div>Connected to {connectorName} address: {address}</div>
|
|
|
|
|
<button onClick={(_evt) => disconnect() }>Disconnect</button>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<div>Connected to {connectorName} address: {address}</div>
|
|
|
|
|
<button onClick={(_evt) => disconnect() }>Disconnect</button>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<div>Connect to Airdrop App</div>
|
|
|
|
|
{connectors.map((connector) => (
|
|
|
|
|
<button
|
|
|
|
|
disabled={!connector.ready}
|
|
|
|
|
key={connector.id}
|
|
|
|
|
onClick={() => connect({ connector })}
|
|
|
|
|
>
|
|
|
|
|
{connector.name}
|
|
|
|
|
{!connector.ready && ' (unsupported)'}
|
|
|
|
|
{isLoading &&
|
|
|
|
|
<div>
|
|
|
|
|
<div>Connect to Airdrop App</div>
|
|
|
|
|
{connectors.map((connector) => (
|
|
|
|
|
<button
|
|
|
|
|
disabled={!connector.ready}
|
|
|
|
|
key={connector.id}
|
|
|
|
|
onClick={() => connect({ connector })}
|
|
|
|
|
>
|
|
|
|
|
{connector.name}
|
|
|
|
|
{!connector.ready && " (unsupported)"}
|
|
|
|
|
{isLoading &&
|
|
|
|
|
connector.id === pendingConnector?.id &&
|
|
|
|
|
' (connecting)'}
|
|
|
|
|
</button>
|
|
|
|
|
))}
|
|
|
|
|
" (connecting)"}
|
|
|
|
|
</button>
|
|
|
|
|
))}
|
|
|
|
|
|
|
|
|
|
{error && <div>{error.message}</div>}
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
{error && <div>{error.message}</div>}
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -110,17 +109,17 @@ function Addresses(props: AddressesProps) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<div>
|
|
|
|
|
<input id="address" value={inputState} onChange={ (evt) => setInputState(evt.target.value) } ></input>
|
|
|
|
|
<div className="addressError">{errorText}</div>
|
|
|
|
|
<button onClick={save}>Add address</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div>
|
|
|
|
|
<input id="address" value={inputState} onChange={ (evt) => setInputState(evt.target.value) } ></input>
|
|
|
|
|
<div className="addressError">{errorText}</div>
|
|
|
|
|
<button onClick={save}>Add address</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
Number of tokens:
|
|
|
|
|
<input type="numeric" value={num} onChange={ (evt) => setNumTokens(parseInt(evt.target.value)) }></input>
|
|
|
|
|
<input type="numeric" value={num} onChange={ (evt) => setNumTokens(parseInt(evt.target.value)) }></input>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -131,8 +130,8 @@ interface AddressListProps {
|
|
|
|
|
function AddressList({addressList}: AddressListProps) {
|
|
|
|
|
|
|
|
|
|
const addresses = addressList.length == 0 ?
|
|
|
|
|
<p>No addresses specified yet</p> :
|
|
|
|
|
addressList.map((addr: string) => <div key={addr} className="addressItem">{addr}</div>);
|
|
|
|
|
<p>No addresses specified yet</p> :
|
|
|
|
|
addressList.map((addr: string) => <div key={addr} className="addressItem">{addr}</div>);
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<h2>Addresses to airdrop to: </h2>
|
|
|
|
@ -175,21 +174,21 @@ function App() {
|
|
|
|
|
|
|
|
|
|
const airdropButtonDisabled = addressList.length == 0 || !isConnected;
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<WagmiConfig client={wagmiClient}>
|
|
|
|
|
<div className="App">
|
|
|
|
|
<Profile/>
|
|
|
|
|
return (
|
|
|
|
|
<WagmiConfig client={wagmiClient}>
|
|
|
|
|
<div className="App">
|
|
|
|
|
<Profile/>
|
|
|
|
|
|
|
|
|
|
<h1>Airdrop App</h1>
|
|
|
|
|
<h1>Airdrop App</h1>
|
|
|
|
|
|
|
|
|
|
<p>Add an address to airdrop to:</p>
|
|
|
|
|
<Addresses addressList={addressList} setAddressListFn={setAddressList} numTokens={numTokens} setNumTokens={setNumTokens}/>
|
|
|
|
|
<button disabled={airdropButtonDisabled} onClick={performAirdrop} >Perform Airdrop!</button>
|
|
|
|
|
<AddressList addressList={addressList} />
|
|
|
|
|
<p>Add an address to airdrop to:</p>
|
|
|
|
|
<Addresses addressList={addressList} setAddressListFn={setAddressList} numTokens={numTokens} setNumTokens={setNumTokens}/>
|
|
|
|
|
<button disabled={airdropButtonDisabled} onClick={performAirdrop} >Perform Airdrop!</button>
|
|
|
|
|
<AddressList addressList={addressList} />
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</WagmiConfig>
|
|
|
|
|
);
|
|
|
|
|
</div>
|
|
|
|
|
</WagmiConfig>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export default App;
|
|
|
|
|