Skip to content

Commit 651fa78

Browse files
TrofimovAnton85TrofimovAnton85
committed
fix(faucet): updated logic
1 parent c8f4b45 commit 651fa78

File tree

4 files changed

+94
-135
lines changed

4 files changed

+94
-135
lines changed

‎package-lock.json‎

Lines changed: 0 additions & 40 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,6 @@
6161
"prism-react-renderer": "^2.1.0",
6262
"react": "^18.0.0",
6363
"react-alert": "^7.0.3",
64-
"react-device-detect": "^2.2.3",
6564
"react-dom": "^18.0.0",
6665
"react-dropdown-select": "^4.11.2",
6766
"react-modal": "^3.16.1",

‎src/components/Faucet/Hero.tsx‎

Lines changed: 92 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React, { useContext, useEffect, useState } from "react";
2-
import { BrowserView, MobileView } from "react-device-detect";
32
import Text from "@site/src/components/Text";
43
import Button from "@site/src/components/Button";
54
import Input from "@site/src/components/Input";
@@ -104,103 +103,104 @@ export default function Hero({
104103
wallet.
105104
</span>
106105
</Text>
107-
<BrowserView>
108-
<Text as="p">
109-
{!isExtensionActive
110-
? "Install MetaMask for your browser to get started and request ETH."
111-
: !Object.keys(projects).length
112-
? walletLinked === undefined
113-
? "Connect your MetaMask wallet to get started and request ETH."
114-
: walletLinked === WALLET_LINK_TYPE.NO
115-
? "Link your Infura account to get started and request ETH."
116-
: "Select your Infura account to get started and request ETH."
117-
: "Enter your MetaMask wallet address and request ETH."}
118-
</Text>
119-
<div className={styles.actions}>
120-
{!!Object.keys(projects).length && (
121-
<div className={styles.inputCont}>
122-
<Input
123-
label="Wallet address"
124-
disabled={isLoading}
125-
value={inputValue}
126-
placeholder="ex. 0x or ENS"
127-
onChange={handleOnInputChange}
128-
/>
129-
{isLimitedUserPlan && (
130-
<p className={styles.caption}>
131-
The amount of {network === "linea" && "Linea Sepolia"}
132-
{network === "sepolia" && "Sepolia"} ETH you'll get is
133-
determined by your address's Ethereum Mainnet activity to ensure
134-
fair and bot-free distribution.
135-
</p>
136-
)}
137-
</div>
138-
)}
139-
<div
140-
className={clsx(
141-
!!Object.keys(projects).length && styles.alignedButtons,
142-
)}
143-
>
144-
{!isExtensionActive ? (
145-
<Button
146-
testId="hero-cta-install-metamask"
147-
className={styles.button}
148-
onClick={handleConnectWallet}
149-
>
150-
Install MetaMask
151-
</Button>
152-
) : !Object.keys(projects).length ? (
153-
<>
154-
{walletLinked === undefined && (
155-
<Button
156-
testId="hero-cta-connect-metamask"
157-
className={styles.button}
158-
onClick={handleConnectWallet}
159-
isLoading={isWalletLinking}
160-
>
161-
Connect MetaMask
162-
</Button>
163-
)}
164-
{walletLinked === WALLET_LINK_TYPE.NO && (
165-
<Button
166-
testId="hero-cta-link-infura-account"
167-
className={styles.button}
168-
onClick={handleLinkWallet}
169-
isLoading={isWalletLinking}
170-
>
171-
Link Infura Account
172-
</Button>
106+
{isExtensionActive ? (
107+
<>
108+
<Text as="p">
109+
{!isExtensionActive
110+
? "Install MetaMask for your browser to get started and request ETH."
111+
: !Object.keys(projects).length
112+
? walletLinked === undefined
113+
? "Connect your MetaMask wallet to get started and request ETH."
114+
: walletLinked === WALLET_LINK_TYPE.NO
115+
? "Link your Infura account to get started and request ETH."
116+
: "Select your Infura account to get started and request ETH."
117+
: "Enter your MetaMask wallet address and request ETH."}
118+
</Text>
119+
<div className={styles.actions}>
120+
{!!Object.keys(projects).length && (
121+
<div className={styles.inputCont}>
122+
<Input
123+
label="Wallet address"
124+
disabled={isLoading}
125+
value={inputValue}
126+
placeholder="ex. 0x or ENS"
127+
onChange={handleOnInputChange}
128+
/>
129+
{isLimitedUserPlan && (
130+
<p className={styles.caption}>
131+
The amount of {network === "linea" && "Linea Sepolia"}
132+
{network === "sepolia" && "Sepolia"} ETH you'll get is
133+
determined by your address's Ethereum Mainnet activity to ensure
134+
fair and bot-free distribution.
135+
</p>
173136
)}
174-
{walletLinked === WALLET_LINK_TYPE.MULTIPLE && (
175-
<Button
176-
testId="hero-cta-select-infura-account"
177-
className={styles.button}
178-
onClick={handleLinkWallet}
179-
isLoading={isWalletLinking}
180-
>
181-
Select Infura Account
182-
</Button>
183-
)}
184-
</>
185-
) : (
186-
<Button
187-
testId="hero-cta-request-eth"
188-
isLoading={isLoading}
189-
disabled={!inputValue}
190-
className={styles.button}
191-
onClick={handleRequestEth}
192-
>
193-
Request ETH
194-
</Button>
137+
</div>
195138
)}
139+
<div
140+
className={clsx(
141+
!!Object.keys(projects).length && styles.alignedButtons,
142+
)}
143+
>
144+
{!isExtensionActive ? (
145+
<Button
146+
testId="hero-cta-install-metamask"
147+
className={styles.button}
148+
onClick={handleConnectWallet}
149+
>
150+
Install MetaMask
151+
</Button>
152+
) : !Object.keys(projects).length ? (
153+
<>
154+
{walletLinked === undefined && (
155+
<Button
156+
testId="hero-cta-connect-metamask"
157+
className={styles.button}
158+
onClick={handleConnectWallet}
159+
isLoading={isWalletLinking}
160+
>
161+
Connect MetaMask
162+
</Button>
163+
)}
164+
{walletLinked === WALLET_LINK_TYPE.NO && (
165+
<Button
166+
testId="hero-cta-link-infura-account"
167+
className={styles.button}
168+
onClick={handleLinkWallet}
169+
isLoading={isWalletLinking}
170+
>
171+
Link Infura Account
172+
</Button>
173+
)}
174+
{walletLinked === WALLET_LINK_TYPE.MULTIPLE && (
175+
<Button
176+
testId="hero-cta-select-infura-account"
177+
className={styles.button}
178+
onClick={handleLinkWallet}
179+
isLoading={isWalletLinking}
180+
>
181+
Select Infura Account
182+
</Button>
183+
)}
184+
</>
185+
) : (
186+
<Button
187+
testId="hero-cta-request-eth"
188+
isLoading={isLoading}
189+
disabled={!inputValue}
190+
className={styles.button}
191+
onClick={handleRequestEth}
192+
>
193+
Request ETH
194+
</Button>
195+
)}
196+
</div>
196197
</div>
197-
</div>
198-
</BrowserView>
199-
<MobileView>
198+
</>
199+
) : (
200200
<Text as="p">
201201
Please open the application on desktop to get started and request ETH
202202
</Text>
203-
</MobileView>
203+
)}
204204
</div>
205205
);
206206
}

‎src/components/NavbarWallet/index.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React, { useEffect, useState, useRef, FC, useContext } from "react";
2-
import { isBrowser } from "react-device-detect";
32
import ldClient from "launchdarkly";
43
import clsx from "clsx";
54
import Button from "@site/src/components/Button";
@@ -232,6 +231,7 @@ const NavbarWalletComponent: FC = ({
232231
const NavbarWallet = (props) => {
233232
const [ldReady, setLdReady] = useState(false);
234233
const [loginEnabled, setLoginEnabled] = useState(false);
234+
const { sdk } = useContext(MetamaskProviderContext);
235235

236236
useEffect(() => {
237237
ldClient.waitUntilReady().then(() => {
@@ -249,7 +249,7 @@ const NavbarWallet = (props) => {
249249

250250
return (
251251
ldReady &&
252-
isBrowser &&
252+
sdk.isExtensionActive() &&
253253
loginEnabled && (
254254
<BrowserOnly>{() => <NavbarWalletComponent {...props} />}</BrowserOnly>
255255
)

0 commit comments

Comments
 (0)