Improve types and aliases resolving

MetaMask · Jul 26, 2024 · 597b1ec · 597b1ec
1 parent fdfc42d
commit 597b1ec
Show file tree

Hide file tree

Showing 5 changed files with 46 additions and 39 deletions.
diff --git a/package.json b/package.json
@@ -72,13 +72,13 @@
     "@docusaurus/tsconfig": "^3.4.0",
     "@docusaurus/types": "^3.4.0",
     "@lavamoat/allow-scripts": "^3.0.4",
-    "@tsconfig/docusaurus": "^1.0.5",
+    "@types/react-alert": "^7.0.6",
     "@typescript-eslint/parser": "^7.12.0",
     "eslint-plugin-react": "^7.34.2",
     "stylelint": "^15.0.0 ",
     "stylelint-config-standard": "^34.0.0",
     "tsc-files": "^1.1.4",
-    "typescript": "^5.4.5"
+    "typescript": "^5.5.4"
   },
   "browserslist": {
     "production": [

diff --git a/src/components/Faucet/Hero.tsx b/src/components/Faucet/Hero.tsx
@@ -15,7 +15,7 @@ interface IHero {
   handleConnectWallet: VoidFunction;
   handleLogin: VoidFunction;
   handleRequest: VoidFunction;
-  handleOnInputChange: VoidFunction;
+  handleOnInputChange: (valiue: string) => void;
   inputValue?: string;
   isLoading?: boolean;
 }

diff --git a/src/pages/developer-tools/faucet.tsx b/src/pages/developer-tools/faucet.tsx
@@ -1,4 +1,4 @@
-import React, { useMemo, useState } from "react";
+import React, { useContext, useState } from "react";
 import Layout from "@theme/Layout";
 import Tabs from "@theme/Tabs";
 import TabItem from "@theme/TabItem";
@@ -12,7 +12,7 @@ import {
   Hero,
 } from "@site/src/components/Faucet";
 import { useAlert } from "react-alert";
-import { useSDK } from "@metamask/sdk-react";
+import { MetamaskProviderContext } from "@site/src/theme/Root";
 
 import styles from "./faucet.module.scss";
 
@@ -71,22 +71,20 @@ const SEPOLIA = [
 ];
 
 export default function Faucet() {
-  const { sdk, ready, connected, provider, account } = useSDK();
+  const { metaMaskConnectHandler, metaMaskAccount } = useContext(
+    MetamaskProviderContext,
+  );
   const alert = useAlert();
   const [isUserConnected, setIsUserConnected] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
-  const [isMMConnected, setIsMMConnected] = useState(false);
+  const [isWalletConnected, setIsWalletConnected] = useState(false);
   const [walletAddress, setWalletAddress] = useState("");
-
-  const isWalletConnected = useMemo(() => {
-    return ready && connected && !!account;
-  }, [ready, connected, account]);
+  const [alertType, setAlertType] = useState(1);
 
   const handleLogin = () => {
     setIsLoading(true);
     setTimeout(() => {
       setIsLoading(false);
-      alert.info(<AlertCooldown />);
       setIsUserConnected((value) => !value);
     }, 2000);
   };
@@ -96,10 +94,9 @@ export default function Faucet() {
       setIsLoading(true);
       setTimeout(() => {
         setIsLoading(false);
-        setIsMMConnected(true);
-        alert.error(<AlertCommonIssue />);
+        setIsWalletConnected(true);
       }, 2000);
-      const accounts = await sdk?.connect();
+      metaMaskConnectHandler();
     } catch (err) {
       console.warn("failed to connect..", err);
     }
@@ -109,7 +106,17 @@ export default function Faucet() {
     setIsLoading(true);
     setTimeout(() => {
       setIsLoading(false);
-      alert.success(<AlertSuccess url="https://www.infura.io" />);
+      switch (alertType) {
+        case 1:
+          alert.success(<AlertSuccess url="https://www.infura.io" />);
+          break;
+        case 2:
+          alert.error(<AlertCommonIssue />);
+          break;
+        default:
+          alert.info(<AlertCooldown />);
+      }
+      setAlertType((value) => value + 1);
       setWalletAddress("");
     }, 2000);
   };
@@ -127,8 +134,7 @@ export default function Faucet() {
             network={network}
             className={styles.hero}
             handleLogin={handleLogin}
-            handleC
-            isWalletConnected={isMMConnected || isWalletConnected}
+            isWalletConnected={isWalletConnected || metaMaskAccount}
             handleConnectWallet={connectSDKHandler}
             handleRequest={handleRequest}
             handleOnInputChange={handleOnInputChange}
@@ -161,7 +167,7 @@ export default function Faucet() {
           <Button isLoading={isLoading} onClick={handleLogin}>
             Sign in
           </Button>
-        ) : !(isMMConnected || isWalletConnected) ? (
+        ) : !(isWalletConnected || metaMaskAccount) ? (
           <Button isLoading={isLoading} onClick={connectSDKHandler}>
             Install MetaMask
           </Button>

diff --git a/tsconfig.json b/tsconfig.json
@@ -4,9 +4,8 @@
   "compilerOptions": {
     "baseUrl": ".",
     "paths": {
-      "launchdarkly": [
-        "./node_modules/launchdarkly-js-client-sdk/dist/ldclient.es.js"
-      ]
+      "@site/*": ["./*"],
+      "launchdarkly": ["./node_modules/launchdarkly-js-client-sdk/dist/ldclient.es.js"]
     },
     "types": [
       "docusaurus-plugin-sass"

diff --git a/yarn.lock b/yarn.lock
@@ -4162,13 +4162,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@tsconfig/docusaurus@npm:^1.0.5":
-  version: 1.0.7
-  resolution: "@tsconfig/docusaurus@npm:1.0.7"
-  checksum: 8f5b14005d90b2008f10daf03a5edec86d2a7603e5641c579ea936a5c2d165a8c3007a72254fc4c2adb0554d73062f52bb97b30ff818f01c9215957822f3c4db
-  languageName: node
-  linkType: hard
-
 "@types/acorn@npm:^4.0.0":
   version: 4.0.6
   resolution: "@types/acorn@npm:4.0.6"
@@ -4552,6 +4545,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/react-alert@npm:^7.0.6":
+  version: 7.0.6
+  resolution: "@types/react-alert@npm:7.0.6"
+  dependencies:
+    "@types/react": "*"
+  checksum: 6a97e37a9808daf76b25ef1d0d44e9d845d88ed72d74605c02ccb2b18122b9b16ae59fb505c12abc679bc20936ef047302da96ac7cac797d7e1aae5f657c3f53
+  languageName: node
+  linkType: hard
+
 "@types/react-dom@npm:^17.0.3":
   version: 17.0.25
   resolution: "@types/react-dom@npm:17.0.25"
@@ -13421,8 +13423,8 @@ __metadata:
     "@rjsf/core": ^5.18.4
     "@rjsf/utils": ^5.18.4
     "@rjsf/validator-ajv8": ^5.18.4
-    "@tsconfig/docusaurus": ^1.0.5
     "@types/react": ^18.3.3
+    "@types/react-alert": ^7.0.6
     "@typescript-eslint/parser": ^7.12.0
     clsx: ^1.2.1
     docusaurus-plugin-sass: ^0.2.5
@@ -13448,7 +13450,7 @@ __metadata:
     stylelint: "^15.0.0 "
     stylelint-config-standard: ^34.0.0
     tsc-files: ^1.1.4
-    typescript: ^5.4.5
+    typescript: ^5.5.4
   languageName: unknown
   linkType: soft
 
@@ -19649,23 +19651,23 @@ __metadata:
   languageName: node
   linkType: hard
 
-"typescript@npm:^5.4.5":
-  version: 5.4.5
-  resolution: "typescript@npm:5.4.5"
+"typescript@npm:^5.5.4":
+  version: 5.5.4
+  resolution: "typescript@npm:5.5.4"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: 53c879c6fa1e3bcb194b274d4501ba1985894b2c2692fa079db03c5a5a7140587a1e04e1ba03184605d35f439b40192d9e138eb3279ca8eee313c081c8bcd9b0
+  checksum: b309040f3a1cd91c68a5a58af6b9fdd4e849b8c42d837b2c2e73f9a4f96a98c4f1ed398a9aab576ee0a4748f5690cf594e6b99dbe61de7839da748c41e6d6ca8
   languageName: node
   linkType: hard
 
-"typescript@patch:typescript@^5.4.5#~builtin<compat/typescript>":
-  version: 5.4.5
-  resolution: "typescript@patch:typescript@npm%3A5.4.5#~builtin<compat/typescript>::version=5.4.5&hash=1f5320"
+"typescript@patch:typescript@^5.5.4#~builtin<compat/typescript>":
+  version: 5.5.4
+  resolution: "typescript@patch:typescript@npm%3A5.5.4#~builtin<compat/typescript>::version=5.5.4&hash=1f5320"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: 2373c693f3b328f3b2387c3efafe6d257b057a142f9a79291854b14ff4d5367d3d730810aee981726b677ae0fd8329b23309da3b6aaab8263dbdccf1da07a3ba
+  checksum: fc52962f31a5bcb716d4213bef516885e4f01f30cea797a831205fc9ef12b405a40561c40eae3127ab85ba1548e7df49df2bcdee6b84a94bfbe3a0d7eff16b14
   languageName: node
   linkType: hard