From 95dd35f7f57cfd3c21bff5b8911c4db74adac533 Mon Sep 17 00:00:00 2001 From: Nicolas Ochem Date: Thu, 7 Dec 2023 13:41:27 -0800 Subject: [PATCH] add getTez instructions on faucet page --- README.md | 3 +- src/components/Faucet/FaucetRequestButton.tsx | 5 ++- .../Faucet/FaucetToInputRequest.tsx | 12 +++++- .../Faucet/FaucetToWalletRequest.tsx | 10 +++++ src/components/Faucet/SplittedFaucet.tsx | 39 ++++++++++++------- 5 files changed, 50 insertions(+), 19 deletions(-) diff --git a/README.md b/README.md index b347d70..de9cb03 100644 --- a/README.md +++ b/README.md @@ -51,6 +51,7 @@ Currently supported networks include: - Mondaynet - Dailynet - Nairobinet +- Oxfordnet To add a new network, first check that `@airgap/beacon-sdk` handles it ([check their config on the latest release](https://github.com/airgap-it/beacon-sdk/blob/v4.0.6/packages/beacon-types/src/types/beacon/NetworkType.ts)), then update: @@ -58,8 +59,6 @@ To add a new network, first check that `@airgap/beacon-sdk` handles it ([check t npm i @airgap/beacon-sdk ``` -And in `Config.tsx`, add the `case` for the new network using `NetworkType`. - ### 2. Deploy backend See https://github.com/oxheadalpha/tezos-faucet-backend diff --git a/src/components/Faucet/FaucetRequestButton.tsx b/src/components/Faucet/FaucetRequestButton.tsx index 28e1cb4..68f1198 100644 --- a/src/components/Faucet/FaucetRequestButton.tsx +++ b/src/components/Faucet/FaucetRequestButton.tsx @@ -46,13 +46,16 @@ export default function FaucetRequestButton({ disabled, network, status, + amount, + setAmount }: { address: string disabled: boolean network: Network status: StatusContext + amount: number + setAmount: (amount: number) => void }) { - const [amount, setAmount] = useState(minTez) const formattedAmount = formatAmount(amount) const [isLocalLoading, setLocalLoading] = useState(false) diff --git a/src/components/Faucet/FaucetToInputRequest.tsx b/src/components/Faucet/FaucetToInputRequest.tsx index 46b963d..7137ac1 100644 --- a/src/components/Faucet/FaucetToInputRequest.tsx +++ b/src/components/Faucet/FaucetToInputRequest.tsx @@ -9,11 +9,19 @@ import { Network, StatusContext } from "../../lib/Types" export default function FaucetToInputRequest({ network, status, + amount, + setAmount, + inputToAddr, + setInputToAddr }: { network: Network status: StatusContext + amount: number + setAmount: (amount: number) => void + inputToAddr: any + setInputToAddr: any + }) { - const [inputToAddr, setInputToAddr] = useState("") const [inputClass, setInputClass] = useState("") const inputId: string = network.name + "-to" @@ -54,6 +62,8 @@ export default function FaucetToInputRequest({ disabled={disableButton} network={network} status={status} + amount={amount} + setAmount={setAmount} /> ) diff --git a/src/components/Faucet/FaucetToWalletRequest.tsx b/src/components/Faucet/FaucetToWalletRequest.tsx index a920771..c2daac7 100644 --- a/src/components/Faucet/FaucetToWalletRequest.tsx +++ b/src/components/Faucet/FaucetToWalletRequest.tsx @@ -7,10 +7,18 @@ function FaucetToWalletRequest({ user, network, status, + amount, + setAmount, + inputToAddr, + setInputToAddr }: { user: UserContext network: Network status: StatusContext + amount: number + setAmount: (amount: number) => void + inputToAddr: any + setInputToAddr: any }) { return ( <> @@ -21,6 +29,8 @@ function FaucetToWalletRequest({ disabled={!user.userAddress || status.isLoading} network={network} status={status} + amount={amount} + setAmount={setAmount} /> ) diff --git a/src/components/Faucet/SplittedFaucet.tsx b/src/components/Faucet/SplittedFaucet.tsx index 775e4d6..43baa24 100644 --- a/src/components/Faucet/SplittedFaucet.tsx +++ b/src/components/Faucet/SplittedFaucet.tsx @@ -8,6 +8,7 @@ import Config from "../../Config" import { Network, UserContext, StatusContext } from "../../lib/Types" +const { minTez, maxTez } = Config.application export default function SplittedFaucet({ network, user, @@ -27,6 +28,8 @@ export default function SplittedFaucet({ const [showInfo, setShowInfo] = useState( localStorage.getItem("showInfo") !== "false" ) + const [amount, setAmount] = useState(minTez) + const [inputToAddr, setInputToAddr] = useState("") const unsetStatus = () => (setStatus(""), setStatusType("")) @@ -79,13 +82,24 @@ export default function SplittedFaucet({ network={network} user={user} status={statusContext} + amount={amount} + setAmount={setAmount} + inputToAddr={inputToAddr} + setInputToAddr={setInputToAddr} /> Fund any address - + @@ -148,24 +162,19 @@ export default function SplittedFaucet({

- To ensure fair distribution of Tez, we've introduced proof of - work challenges. Before you receive your Tez, your browser will - need to solve these challenges. This is an automatic process - that helps us prevent abuse and ensure everyone gets their fair - share. + Tired of captchas? Need to fund a lot of addresses? +

+

+ 💡 Try the get-tez command! +

+

+ npx @oxheadalpha/get-tez {inputToAddr || ''} --amount {amount} --network {network.name.toLowerCase()}

- The number and difficulty of these challenges depends on the - amount of Tez you request. The more Tez you ask for, the higher - the difficulty and the more challenges your browser will need to - solve. This means it might take a bit longer to receive your Tez - if you request a larger amount. + You can also request tokens with the get-tez NodeJS library or directly through the API.

- Don't worry, your browser will automatically solve these - challenges. All you need to do is leave your window open and - wait a little while for the process to complete before you - receive your Tez. + Note: to prevent abuse, tokens are granted more slowly when using this method.