inamiddleofthings
This commit is contained in:
rodič
40a152fbae
revize
0bdeaa1bc0
|
@ -1 +0,0 @@
|
||||||
VITE_ALCHEMY_API_KEY=
|
|
|
@ -3,3 +3,4 @@ node_modules
|
||||||
dist
|
dist
|
||||||
dist-ssr
|
dist-ssr
|
||||||
*.local
|
*.local
|
||||||
|
.env
|
27
src/App.tsx
27
src/App.tsx
|
@ -1,6 +1,7 @@
|
||||||
import { useAccount, useSignMessage } from "wagmi";
|
import { useAccount, useSignMessage } from "wagmi";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { Account, Connect } from "./components";
|
import { Balance, Connect } from "./components";
|
||||||
|
import { BalanceType } from "./components";
|
||||||
import { verifyMessage } from "ethers/lib/utils";
|
import { verifyMessage } from "ethers/lib/utils";
|
||||||
import { SignMessageArgs } from "@wagmi/core";
|
import { SignMessageArgs } from "@wagmi/core";
|
||||||
|
|
||||||
|
@ -10,6 +11,7 @@ export function App() {
|
||||||
const [isEligible, setIsEligible] = useState(false);
|
const [isEligible, setIsEligible] = useState(false);
|
||||||
const [isFetching, setIsFetching] = useState("none");
|
const [isFetching, setIsFetching] = useState("none");
|
||||||
const [network, setNetwork] = useState("goerli");
|
const [network, setNetwork] = useState("goerli");
|
||||||
|
const [balances, setBalances] = useState<BalanceType[]>([]);
|
||||||
const baseUrl = "https://faucet-api.ethbrno.cz";
|
const baseUrl = "https://faucet-api.ethbrno.cz";
|
||||||
|
|
||||||
const getEligibilityData = async () => {
|
const getEligibilityData = async () => {
|
||||||
|
@ -21,6 +23,8 @@ export function App() {
|
||||||
mode: "cors",
|
mode: "cors",
|
||||||
});
|
});
|
||||||
const res = await apiResponse.json();
|
const res = await apiResponse.json();
|
||||||
|
//console.log(res);
|
||||||
|
setBalances(res?.balances);
|
||||||
if (res?.tokenId) setIsEligible(true);
|
if (res?.tokenId) setIsEligible(true);
|
||||||
else setIsEligible(false);
|
else setIsEligible(false);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
|
@ -133,15 +137,18 @@ export function App() {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{}
|
{!isEligible
|
||||||
<p className="mb-8 leading-relaxed">
|
? (
|
||||||
If you own a Soulbound token you can ask for up to 200 ETH for
|
<p className="mb-8 leading-relaxed">
|
||||||
either Goerli and Sepolia testnets. This should be enough not only
|
If you own a Soulbound token you can ask for up to 200 ETH for
|
||||||
for a development purposes, but also for prepaid gas transactions
|
either Goerli and Sepolia testnets. This should be enough not
|
||||||
for your testing users. These tokens have no real monetary value.
|
only for a development purposes, but also for prepaid gas
|
||||||
Every request grants you 50 ETH and there is a request cooldown
|
transactions for your testing users. These tokens have no real
|
||||||
for 5 hours to avoid misuse.
|
monetary value. Every request grants you 50 ETH and there is a
|
||||||
</p>
|
request cooldown for 5 hours to avoid misuse.
|
||||||
|
</p>
|
||||||
|
)
|
||||||
|
: <Balance {...balances} />}
|
||||||
{!isConnecting || isConnected
|
{!isConnecting || isConnected
|
||||||
? (
|
? (
|
||||||
<div className="mb-4 text-sm font-medium">
|
<div className="mb-4 text-sm font-medium">
|
||||||
|
|
|
@ -1,13 +1,25 @@
|
||||||
import { useAccount, useEnsName } from 'wagmi'
|
import { useAccount, useBalance, useEnsName } from "wagmi";
|
||||||
|
|
||||||
export function Account() {
|
export function Account() {
|
||||||
const { address } = useAccount()
|
const { address } = useAccount();
|
||||||
const { data: ensNameData } = useEnsName({ address })
|
const { data: ensNameData } = useEnsName({ address });
|
||||||
|
|
||||||
|
const { data, isError, isLoading } = useBalance({
|
||||||
|
addressOrName: address,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (isLoading) return <div>Fetching balance…</div>;
|
||||||
|
if (isError) return <div>Error fetching balance</div>;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<>
|
||||||
{ensNameData ?? address}
|
<div>
|
||||||
{ensNameData ? ` (${address})` : null}
|
{ensNameData ?? address}
|
||||||
</div>
|
{ensNameData ? ` (${address})` : null}
|
||||||
)
|
</div>
|
||||||
|
<div>
|
||||||
|
Balance: {data?.formatted} {data?.symbol}
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,14 @@
|
||||||
|
export interface BalanceType {
|
||||||
|
balance: number;
|
||||||
|
network: string;
|
||||||
|
quota: Object;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function Balance(props: BalanceType[]) {
|
||||||
|
console.log(props);
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
Balance
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
|
@ -1,3 +1,5 @@
|
||||||
export { Account } from './Account'
|
export { Account } from './Account'
|
||||||
export { Connect } from './Connect'
|
export { Connect } from './Connect'
|
||||||
|
export { Balance } from './Balance'
|
||||||
|
export type { BalanceType } from './Balance'
|
||||||
export { NetworkSwitcher } from './NetworkSwitcher'
|
export { NetworkSwitcher } from './NetworkSwitcher'
|
||||||
|
|
|
@ -1,45 +0,0 @@
|
||||||
import { useState, useEffect } from 'react';
|
|
||||||
|
|
||||||
|
|
||||||
export type SoulApiResponse = {
|
|
||||||
status: Number;
|
|
||||||
statusText: String;
|
|
||||||
data: any;
|
|
||||||
error: any;
|
|
||||||
loading: Boolean;
|
|
||||||
isEligible: Boolean;
|
|
||||||
};
|
|
||||||
|
|
||||||
const baseUrl = "https://faucet-api.ethbrno.cz/lookup?addr="
|
|
||||||
|
|
||||||
export const useApiGet = (addr: string): SoulApiResponse => {
|
|
||||||
const [status, setStatus] = useState<Number>(0);
|
|
||||||
const [statusText, setStatusText] = useState<String>('');
|
|
||||||
const [data, setData] = useState<any>();
|
|
||||||
const [error, setError] = useState<any>();
|
|
||||||
const [loading, setLoading] = useState<boolean>(false);
|
|
||||||
const [isEligible, setIsEligible] = useState<boolean>(false);
|
|
||||||
|
|
||||||
const getAPIData = async () => {
|
|
||||||
setLoading(true);
|
|
||||||
try {
|
|
||||||
const apiResponse = await fetch(baseUrl + addr);
|
|
||||||
const json = await apiResponse.json();
|
|
||||||
setStatus(apiResponse.status);
|
|
||||||
setStatusText(apiResponse.statusText);
|
|
||||||
setData(json);
|
|
||||||
} catch (error) {
|
|
||||||
setError(error);
|
|
||||||
}
|
|
||||||
//console.log(data.tokenId)
|
|
||||||
if (data?.tokenId) setIsEligible(true);
|
|
||||||
setLoading(false);
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
getAPIData();
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return { status, statusText, data, error, loading, isEligible };
|
|
||||||
};
|
|
|
@ -10,7 +10,6 @@ import {
|
||||||
} from "wagmi";
|
} from "wagmi";
|
||||||
import { CoinbaseWalletConnector } from "wagmi/connectors/coinbaseWallet";
|
import { CoinbaseWalletConnector } from "wagmi/connectors/coinbaseWallet";
|
||||||
import { InjectedConnector } from "wagmi/connectors/injected";
|
import { InjectedConnector } from "wagmi/connectors/injected";
|
||||||
import { MetaMaskConnector } from "wagmi/connectors/metaMask";
|
|
||||||
import { WalletConnectConnector } from "wagmi/connectors/walletConnect";
|
import { WalletConnectConnector } from "wagmi/connectors/walletConnect";
|
||||||
import { alchemyProvider } from "wagmi/providers/alchemy";
|
import { alchemyProvider } from "wagmi/providers/alchemy";
|
||||||
|
|
||||||
|
|
Načítá se…
Odkázat v novém úkolu