diff --git a/tools/obscuroscan_v3/frontend/pages/personal/index.tsx b/tools/obscuroscan_v3/frontend/pages/personal/index.tsx
index ba87befdfd..4662608164 100644
--- a/tools/obscuroscan_v3/frontend/pages/personal/index.tsx
+++ b/tools/obscuroscan_v3/frontend/pages/personal/index.tsx
@@ -5,6 +5,7 @@ import PersonalTransactions from "@/src/components/modules/personal";
import { useWalletConnection } from "@/src/components/providers/wallet-provider";
import ConnectWalletButton from "@/src/components/modules/common/connect-wallet";
import EmptyState from "@/src/components/modules/common/empty-state";
+import { ethereum } from "@/src/lib/utils";
export const metadata: Metadata = {
title: "Personal Transactions",
@@ -20,9 +21,17 @@ export default function PersonalPage() {
) : (
}
+ action={
+
+ }
/>
)}
diff --git a/tools/obscuroscan_v3/frontend/src/components/modules/common/connect-wallet.tsx b/tools/obscuroscan_v3/frontend/src/components/modules/common/connect-wallet.tsx
index ce29123e27..e33e0d7c6c 100644
--- a/tools/obscuroscan_v3/frontend/src/components/modules/common/connect-wallet.tsx
+++ b/tools/obscuroscan_v3/frontend/src/components/modules/common/connect-wallet.tsx
@@ -3,7 +3,8 @@ import { Button } from "@/src/components/ui/button";
import { Link2Icon, LinkBreak2Icon } from "@radix-ui/react-icons";
import React from "react";
import TruncatedAddress from "./truncated-address";
-const ConnectWalletButton = () => {
+import { downloadMetaMask, ethereum } from "@/src/lib/utils";
+const ConnectWalletButton = ({ text }: { text?: string }) => {
const { walletConnected, walletAddress, connectWallet, disconnectWallet } =
useWalletConnection();
@@ -11,7 +12,14 @@ const ConnectWalletButton = () => {
diff --git a/tools/obscuroscan_v3/frontend/src/components/providers/wallet-provider.tsx b/tools/obscuroscan_v3/frontend/src/components/providers/wallet-provider.tsx
index f7772769b9..e9f89eb051 100644
--- a/tools/obscuroscan_v3/frontend/src/components/providers/wallet-provider.tsx
+++ b/tools/obscuroscan_v3/frontend/src/components/providers/wallet-provider.tsx
@@ -6,6 +6,7 @@ import {
} from "@/src/types/interfaces/WalletInterfaces";
import { showToast } from "../ui/use-toast";
import { ToastType } from "@/src/types/interfaces";
+import { ethereum } from "@/src/lib/utils";
const WalletConnectionContext =
createContext(null);
@@ -29,10 +30,8 @@ export const WalletConnectionProvider = ({
useState(null);
const connectWallet = async () => {
- if ((window as any).ethereum) {
- const ethProvider = new ethers.providers.Web3Provider(
- (window as any).ethereum
- );
+ if (ethereum) {
+ const ethProvider = new ethers.providers.Web3Provider(ethereum);
setProvider(ethProvider);
try {
@@ -65,7 +64,10 @@ export const WalletConnectionProvider = ({
};
useEffect(() => {
- const ethereum = (window as any).ethereum;
+ if (!ethereum) {
+ return;
+ }
+
const handleAccountsChanged = (accounts: string[]) => {
if (accounts.length === 0) {
showToast(ToastType.DESTRUCTIVE, "Please connect to MetaMask.");
@@ -73,8 +75,10 @@ export const WalletConnectionProvider = ({
setWalletAddress(accounts[0]);
}
};
+
ethereum.on("accountsChanged", handleAccountsChanged);
return () => {
+ if (!ethereum) return;
ethereum.removeListener("accountsChanged", handleAccountsChanged);
};
});
diff --git a/tools/obscuroscan_v3/frontend/src/lib/utils.ts b/tools/obscuroscan_v3/frontend/src/lib/utils.ts
index 628a129218..563e2f9b52 100644
--- a/tools/obscuroscan_v3/frontend/src/lib/utils.ts
+++ b/tools/obscuroscan_v3/frontend/src/lib/utils.ts
@@ -10,3 +10,10 @@ export function formatTimeAgo(unixTimestampSeconds: string) {
const date = new Date(Number(unixTimestampSeconds) * 1000);
return formatDistanceToNow(date, { addSuffix: true });
}
+
+export const { ethereum } =
+ typeof window !== "undefined" ? window : ({} as any);
+
+export const downloadMetaMask = () => {
+ window ? window.open("https://metamask.io/download", "_blank") : null;
+};