Merge pull request #145 from nation3/feat/rm_unsupported_testnet

feat: rm unsupported tesnets & fix hardcode chainid

packages/ui-components/src/components/Molecules/YourAccountHandler.tsx

@@ -2,20 +2,25 @@ import { WalletIcon } from "@heroicons/react/24/solid";
 import { AddressDisplay, IconLoader } from "@nation3/ui-components";
 import Image from "next/image";
 import React from "react";
-import { useEnsAvatar, useEnsName } from "wagmi";
+import { useEnsAvatar, useEnsName, useNetwork } from "wagmi";
 
 export const AccountDisplay = ({ address }: { address: string }) => {
-	const { data: ensName } = useEnsName({ address, chainId: 1 });
+	const { chain } = useNetwork();
+
+	if (chain?.id == null) {
+		throw new Error("chain.id is null or undefined");
+	}
+	const { data: ensName } = useEnsName({ address, chainId: chain.id });
 	const {
 		data: ensAvatar,
 		isError,
 		isLoading,
 	} = useEnsAvatar({
 		/*
-		onSuccess(data) {
-			console.log("Success AVATAR", data);
-		},
-		*/
+    onSuccess(data) {
+      console.log("Success AVATAR", data);
+    },
+    */
 		addressOrName: address,
 	});
 

packages/web-app/components/agreement/context/AgreementDataProvider.tsx

@@ -31,7 +31,11 @@ export const useAgreement = ({ id }: { id: string }) => {
 		async function fetchAgreement() {
 			try {
 				setIsLoading(true);
-				const chainId = chain?.id || 1;
+
+				if (chain?.id == null) {
+					throw new Error("chain.id is null or undefined");
+				}
+				const chainId = chain.id;
 				const response = await fetch(`/api/${chainId}/agreement/${id}`);
 				if (!response.ok) {
 					setAgreement(undefined);
@@ -125,11 +129,11 @@ export const AgreementDataProvider = ({ id, children }: { id: string; children:
 
 	/* GET AGREEMENT DATA FROM CONTRACT */
 	/*
-	const { data: agreementData, positions: agreementPositions } = useAgreementData({
-		id: id,
-		enabled: id != "undefined",
-	});
-	*/
+  const { data: agreementData, positions: agreementPositions } = useAgreementData({
+    id: id,
+    enabled: id != "undefined",
+  });
+  */
 
 	/* Update params when agreement changes */
 	useEffect(() => {

packages/web-app/components/agreementCreate/AgreementCreation.tsx

@@ -1,6 +1,6 @@
 import { Breadcrumbs, Card, Headline3 } from "@nation3/ui-components";
 import { useMemo, useState } from "react";
-import { useProvider } from "wagmi";
+import { useNetwork, useProvider } from "wagmi";
 import { AgreementCreationPreview } from "./AgreementCreationPreview";
 
 import { useAgreementCreation } from "./context/AgreementCreationContext";
@@ -21,7 +21,6 @@ export const AgreementCreation = () => {
 	const [activeStep, setActiveStep] = useState<number>(0);
 
 	const { t } = useTranslation("common");
-	const provider = useProvider({ chainId: 1 });
 	const tokens = useTokenList();
 
 	const { title, terms, positions, id, token, setToken, termsHash, fileName } =

packages/web-app/components/agreementCreate/AgreementCreationForm.tsx

@@ -11,7 +11,7 @@ import {
 	Card,
 } from "@nation3/ui-components";
 import { utils } from "ethers";
-import { useProvider } from "wagmi";
+import { useNetwork, useProvider } from "wagmi";
 
 import { useAgreementCreation } from "./context/AgreementCreationContext";
 import { ParticipantRow } from "../ParticipantRow";
@@ -29,7 +29,12 @@ import React from "react";
 
 export const AgreementCreationForm = () => {
 	const { t } = useTranslation("common");
-	const provider = useProvider({ chainId: 1 });
+	const { chain } = useNetwork();
+
+	if (chain?.id == null) {
+		throw new Error("chain.id is null or undefined");
+	}
+	const provider = useProvider({ chainId: chain.id });
 	const tokens = useTokenList();
 	const [isTokenModalOpen, setIsTokenModalOpen] = useState<boolean>(false);
 	const {

packages/web-app/components/agreementCreate/AgreementCreationParties.tsx

@@ -13,7 +13,7 @@ import { utils } from "ethers";
 import { useTranslation } from "next-i18next";
 import Image from "next/image";
 import { useEffect, useMemo, useState } from "react";
-import { useProvider } from "wagmi";
+import { useNetwork, useProvider } from "wagmi";
 import { useTokenList } from "../../hooks/useTokenList";
 import { validateCriteria } from "../../utils";
 import { ParticipantRow } from "../ParticipantRow";
@@ -28,7 +28,13 @@ interface PartiesCardProps {
 export const AgreementParties: React.FC<PartiesCardProps> = ({ setActiveStep }) => {
 	const { t } = useTranslation("common");
 	const { positions, token, setPositions, setToken, terms } = useAgreementCreation();
-	const provider = useProvider({ chainId: 1 });
+
+	const { chain } = useNetwork();
+
+	if (chain?.id == null) {
+		throw new Error("chain.id is null or undefined");
+	}
+	const provider = useProvider({ chainId: chain.id });
 	const tokens = useTokenList();
 	const [selectedToken, setSelectedToken] = useState<Token>();
 	const [localPositions, setlocalPositions] = useState<InputPositionList>(positions);

packages/web-app/components/agreements-list/context/AgreementListProvider.tsx

@@ -12,7 +12,11 @@ const useUserAgreements = () => {
 	useEffect(() => {
 		async function fetchAgreements() {
 			try {
-				const chainId = chain?.id || 1;
+				if (chain?.id == null) {
+					throw new Error("chain.id is null or undefined");
+				}
+
+				const chainId = chain.id;
 				const response = await fetch(`/api/${chainId}/agreements/${account}`);
 				if (!response.ok) {
 					setError(response.statusText);

packages/web-app/components/disputes-list/context/DisputeListProvider.tsx

@@ -10,7 +10,11 @@ const useDisputes = () => {
 	useEffect(() => {
 		async function fetchDisputes() {
 			try {
-				const chainId = chain?.id || 1;
+				if (chain?.id == null) {
+					throw new Error("chain.id is null or undefined");
+				}
+
+				const chainId = chain.id;
 				const response = await fetch(`/api/${chainId}/disputes`);
 				if (!response.ok) {
 					setError(response.statusText);

packages/web-app/hooks/usePermit2.tsx

@@ -91,10 +91,14 @@ export const usePermit2TransferSignature = ({
 		[tokenTransfer, nonce],
 	);
 
+	if (chain?.id == null) {
+		throw new Error("chain.id is null or undefined");
+	}
+
 	const domain = useMemo(
 		() => ({
 			name: "Permit2",
-			chainId: chain?.id || 5,
+			chainId: chain.id,
 			verifyingContract: permit2Address,
 		}),
 		[chain],
@@ -146,10 +150,14 @@ export const usePermit2BatchTransferSignature = ({
 		};
 	}, [tokenTransfers, nonce]);
 
+	if (chain?.id == null) {
+		throw new Error("chain.id is null or undefined");
+	}
+
 	const domain = useMemo(
 		() => ({
 			name: "Permit2",
-			chainId: chain?.id || 5,
+			chainId: chain.id,
 			verifyingContract: permit2Address,
 		}),
 		[chain],

packages/web-app/hooks/useTokenList.tsx

@@ -33,23 +33,6 @@ const mainnetTokens = [
 	},
 ];
 
-const goerliTokens = [
-	{
-		name: "Nation3",
-		symbol: "NATION",
-		address: "0x333A4823466879eeF910A04D473505da62142069",
-		decimals: 18,
-		icon: "/tokens/nation3.png",
-	},
-	{
-		name: "Wrapped Ether",
-		symbol: "WETH",
-		address: "0xB4FBF271143F4FBf7B91A5ded31805e42b2208d6",
-		decimals: 18,
-		icon: "/tokens/weth.png",
-	},
-];
-
 const empty = {
 	name: "?",
 	symbol: "?",
@@ -65,8 +48,6 @@ export const useTokenList = (): Token[] => {
 		switch (chain?.id) {
 			case 1:
 				return mainnetTokens;
-			case 5:
-				return goerliTokens;
 			default:
 				return mainnetTokens;
 		}
@@ -82,8 +63,6 @@ export const useFindToken = (tokenSymbol: string): Token => {
 		switch (chain?.id) {
 			case 1:
 				return mainnetTokens.find((token) => token.symbol === tokenSymbol);
-			case 5:
-				return goerliTokens.find((token) => token.symbol === tokenSymbol);
 			default:
 				return mainnetTokens.find((token) => token.symbol === tokenSymbol);
 		}

packages/web-app/lib/connectors.tsx

@@ -1,46 +1,14 @@
 import { getDefaultWallets } from "@rainbow-me/rainbowkit";
 import { providers } from "ethers";
 import { Chain, configureChains } from "wagmi";
-import { goerli, mainnet } from "wagmi/chains";
+import { mainnet } from "wagmi/chains";
 import { publicProvider } from "wagmi/providers/public";
 
 type FallbackProviderConfig = Omit<providers.FallbackProviderConfig, "provider">;
 
-// FIXME: Import from @wagmi/chains after wagmi core update
-const gnosis: Chain = {
-	id: 100,
-	name: "Gnosis",
-	network: "gnosis",
-	nativeCurrency: {
-		decimals: 18,
-		name: "Gnosis",
-		symbol: "xDAI",
-	},
-	rpcUrls: {
-		default: "https://rpc.gnosischain.com",
-		public: "https://rpc.gnosischain.com",
-	},
-	blockExplorers: {
-		etherscan: {
-			name: "Gnosisscan",
-			url: "https://gnosisscan.io/",
-		},
-		default: {
-			name: "Gnosis Chain Explorer",
-			url: "https://blockscout.com/xdai/mainnet/",
-		},
-	},
-};
-
-// Returns and alchemy provider based on the chain
-// if the chain is goerli, use the goerly alchemy api key from the env
-// else, use the mainnet alchemy api key from the env
 const customAlchemyProvider = ({ priority, stallTimeout, weight }: FallbackProviderConfig) => {
 	return (chain: Chain) => {
-		const apiKey =
-			chain.id === 5
-				? process.env.NEXT_PUBLIC_ALCHEMY_API_KEY_GOERLI
-				: process.env.NEXT_PUBLIC_ALCHEMY_API_KEY;
+		const apiKey = process.env.NEXT_PUBLIC_ALCHEMY_API_KEY; //mainnet
 		if (!apiKey || !chain.rpcUrls.alchemy) return null;
 
 		return {
@@ -81,7 +49,7 @@ export const providersToUse = () => {
 };
 
 export const chainsToUse = () => {
-	return [mainnet, gnosis, goerli];
+	return [mainnet];
 };
 
 export const { chains, provider, webSocketProvider } = configureChains(

packages/web-app/lib/constants/index.tsx

@@ -1,9 +1,7 @@
 import { BigNumber } from "ethers";
 import * as mainnet from "./mainnet";
-import * as goerli from "./goerli";
-import * as gnosis from "./gnosis";
 
-export { mainnet, goerli };
+export { mainnet };
 
 export interface Constants {
 	permit2Address: `0x${string}`;
@@ -20,10 +18,6 @@ const constants = (chainId: number) => {
 	switch (chainId) {
 		case 1:
 			return { ...mainnet };
-		case 5:
-			return { ...goerli };
-		case 100:
-			return { ...gnosis };
 		default:
 			return { ...mainnet };
 	}