build: bump

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yearn-finance/web-lib",
-  "version": "3.0.176",
+  "version": "3.0.178",
   "main": "./dist/index.js",
   "types": "./dist/index.d.js",
   "files": [
@@ -25,72 +25,72 @@
     "export": "tsc && next build && next export -o ipfs"
   },
   "dependencies": {
-    "@builtbymom/web3": "^0.0.37",
+    "@builtbymom/web3": "^0.0.43",
     "@headlessui/react": "^1.7.18",
-    "@rainbow-me/rainbowkit": "^1.3.3",
-    "@react-hookz/web": "^24.0.2",
+    "@rainbow-me/rainbowkit": "^2.0.1",
+    "@react-hookz/web": "^24.0.4",
     "@tailwindcss/forms": "^0.5.7",
     "@total-typescript/ts-reset": "^0.5.1",
     "@wagmi/chains": "1.8.0",
-    "@wagmi/core": "^1.4.7",
-    "bun-types": "^1.0.25",
+    "@wagmi/core": "^2.6.5",
+    "bun-types": "^1.0.30",
     "dayjs": "^1.11.10",
     "ethers": "5.7.2",
     "eventemitter3": "^5.0.1",
-    "framer-motion": "^11.0.3",
+    "framer-motion": "^11.0.8",
     "graphql": "^16.8.1",
-    "lint-staged": "^15.2.0",
+    "lint-staged": "^15.2.2",
     "next": "^14.0.4",
-    "next-seo": "^6.4.0",
-    "prettier": "^3.2.4",
+    "next-seo": "^6.5.0",
+    "prettier": "^3.2.5",
     "react-hot-toast": "2.4.1",
     "react-paginate": "^8.2.0",
-    "sass": "^1.70.0",
-    "stylelint": "^16.2.0",
-    "swr": "^2.2.4",
+    "sass": "^1.71.1",
+    "stylelint": "^16.2.1",
+    "swr": "^2.2.5",
     "tailwindcss": "^3.4.1",
-    "viem": "^1.19.9",
-    "wagmi": "^1.4.7",
+    "viem": "^2.7.22",
+    "wagmi": "^2.5.7",
     "zod": "^3.22.4"
   },
   "devDependencies": {
-    "@babel/core": "^7.23.9",
-    "@commitlint/cli": "^18.6.0",
-    "@commitlint/config-conventional": "^18.6.0",
+    "@babel/core": "^7.24.0",
+    "@commitlint/cli": "^19.0.3",
+    "@commitlint/config-conventional": "^19.0.3",
     "@tailwindcss/typography": "^0.5.10",
-    "@types/jest": "^29.5.11",
-    "@types/node": "^20.11.7",
+    "@types/jest": "^29.5.12",
+    "@types/node": "^20.11.25",
     "@types/nprogress": "^0.2.3",
-    "@types/react": "^18.2.48",
-    "@types/react-dom": "^18.2.18",
-    "@typescript-eslint/eslint-plugin": "^6.19.1",
-    "@typescript-eslint/parser": "^6.19.1",
-    "autoprefixer": "^10.4.17",
+    "@types/react": "^18.2.64",
+    "@types/react-dom": "^18.2.21",
+    "@typescript-eslint/eslint-plugin": "^7.1.1",
+    "@typescript-eslint/parser": "^7.1.1",
+    "autoprefixer": "^10.4.18",
     "axios": "^1.6.7",
     "bump": "^0.2.5",
-    "eslint": "^8.56.0",
-    "eslint-config-next": "^14.1.0",
+    "eslint": "^8.57.0",
+    "eslint-config-next": "^14.1.3",
     "eslint-config-prettier": "^9.1.0",
     "eslint-import-resolver-typescript": "^3.6.1",
     "eslint-plugin-brackets": ">= 0.1.3",
     "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-react": "^7.34.0",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-simple-import-sort": "^10.0.0",
-    "eslint-plugin-tailwindcss": "^3.14.0",
-    "eslint-plugin-unused-imports": "^3.0.0",
+    "eslint-plugin-simple-import-sort": "^12.0.0",
+    "eslint-plugin-tailwindcss": "^3.14.3",
+    "eslint-plugin-unused-imports": "^3.1.0",
     "graphql-request": "^6.1.0",
-    "husky": "^9.0.6",
+    "husky": "^9.0.11",
     "jest": "^29.7.0",
     "nprogress": "^0.2.0",
-    "postcss-nesting": "^12.0.2",
+    "postcss-nesting": "^12.1.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "sharp": "^0.33.2",
     "stylelint-config-standard": "^36.0.0",
     "ts-jest": "^29.1.2",
-    "tsup": "^8.0.1",
-    "typescript": "^5.3.3"
+    "tsup": "^8.0.2",
+    "typescript": "^5.4.2"
   },
   "peerDependencies": {
     "@rainbow-me/rainbowkit": "1.3.0",

src/components/Header.tsx

@@ -2,9 +2,9 @@ import {cloneElement, Fragment, useEffect, useMemo, useState} from 'react';
 import {useConnect, usePublicClient} from 'wagmi';
 import {useWeb3} from '@builtbymom/web3/contexts/useWeb3';
 import {toSafeChainID} from '@builtbymom/web3/hooks/useChainID';
-import {assert} from '@builtbymom/web3/utils';
 import {cl} from '@builtbymom/web3/utils/cl';
 import {truncateHex} from '@builtbymom/web3/utils/tools.address';
+import {retrieveConfig} from '@builtbymom/web3/utils/wagmi';
 import {Listbox, Transition} from '@headlessui/react';
 import {useAccountModal, useChainModal, useConnectModal} from '@rainbow-me/rainbowkit';
 import {useIsMounted} from '@react-hookz/web';
@@ -14,7 +14,7 @@ import {IconWallet} from '../icons/IconWallet';
 import {Button} from './Button';
 
 import type {AnchorHTMLAttributes, DetailedHTMLProps, ReactElement} from 'react';
-import type {Chain} from 'wagmi';
+import type {Chain} from 'viem';
 
 const Link = (
 	props: DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> & {tag: ReactElement}
@@ -81,23 +81,22 @@ function NetworkSelector({networks}: {networks: number[]}): ReactElement {
 	const {onSwitchChain, isActive} = useWeb3();
 	const publicClient = usePublicClient();
 	const {connectors} = useConnect();
-	const safeChainID = toSafeChainID(publicClient?.chain.id, Number(process.env.BASE_CHAINID));
+	const safeChainID = toSafeChainID(Number(publicClient?.chain.id), Number(process.env.BASE_CHAINID));
 	const [selectedChainID, set_selectedChainID] = useState(1);
 
 	const supportedNetworks = useMemo((): TNetwork[] => {
-		const injectedConnector = connectors.find((e): boolean => e.id.toLocaleLowerCase() === 'injected');
-		assert(injectedConnector, 'No injected connector found');
-		const chainsForInjected = injectedConnector.chains;
-
-		return chainsForInjected
+		connectors; //Hard trigger re-render when connectors change
+		const config = retrieveConfig();
+		const noFork = config.chains.filter(({id}): boolean => id !== 1337);
+		return noFork
 			.filter(({id}): boolean => id !== 1337 && ((networks.length > 0 && networks.includes(id)) || true))
 			.map((network: Chain): TNetwork => ({value: network.id, label: network.name}));
 	}, [connectors, networks]);
 
 	const currentNetwork = useMemo((): TNetwork | undefined => {
 		const currentChainID = isActive ? safeChainID : selectedChainID;
 		return supportedNetworks.find((network): boolean => network.value === currentChainID);
-	}, [safeChainID, selectedChainID, supportedNetworks]);
+	}, [isActive, safeChainID, selectedChainID, supportedNetworks]);
 
 	if (supportedNetworks.length === 1) {
 		if (publicClient?.chain.id === 1337) {
@@ -149,7 +148,7 @@ function NetworkSelector({networks}: {networks: number[]}): ReactElement {
 							</div>
 							<div className={'ml-1 md:ml-2'}>
 								<IconChevronBottom
-									className={`h-3 w-3 transition-transform md:h-5 md:w-4 ${
+									className={`size-3 transition-transform md:h-5 md:w-4${
 										open ? '-rotate-180' : 'rotate-0'
 									}`}
 								/>
@@ -257,7 +256,7 @@ function WalletSelector(): ReactElement {
 						walletIdentity
 					) : (
 						<span>
-							<IconWallet className={'yearn--header-nav-item mt-0.5 block h-4 w-4 md:hidden'} />
+							<IconWallet className={'yearn--header-nav-item mt-0.5 block size-4 md:hidden'} />
 							<span
 								className={
 									'relative hidden h-8 cursor-pointer items-center justify-center border border-transparent bg-neutral-900 px-2 text-xs font-normal text-neutral-0 transition-all hover:bg-neutral-800 md:flex'
@@ -285,7 +284,7 @@ function WalletSelector(): ReactElement {
 				<div className={'flex flex-col items-center justify-center pb-6 pt-4 text-center'}>
 					{'You are not connected. Please connect to a wallet to continue.'}
 					<Button className={'mt-3 space-x-2'}>
-						<IconWallet className={'h-4 w-4'} />
+						<IconWallet className={'size-4'} />
 						<p>{'Connect wallet'}</p>
 					</Button>
 				</div>
@@ -360,7 +359,7 @@ export function Header({
 				</button>
 			</div>
 			<div className={'flex w-1/3 justify-center'}>
-				<div className={'relative h-8 w-8'}>{logo}</div>
+				<div className={'relative size-8'}>{logo}</div>
 			</div>
 			<div className={'flex w-1/3 items-center justify-end'}>
 				{showNetworkSelector ? <NetworkSelector networks={supportedNetworks || []} /> : null}

src/components/ModalMobileMenu.tsx

@@ -1,14 +1,14 @@
 import React, {cloneElement, Fragment, useEffect, useMemo, useRef, useState} from 'react';
-import {useConnect, useNetwork} from 'wagmi';
+import {useAccount, useConnect} from 'wagmi';
 import {useWeb3} from '@builtbymom/web3/contexts/useWeb3';
-import {assert} from '@builtbymom/web3/utils';
 import {truncateHex} from '@builtbymom/web3/utils/tools.address';
+import {retrieveConfig} from '@builtbymom/web3/utils/wagmi';
 import {Dialog, Transition} from '@headlessui/react';
 
 import {useInjectedWallet} from '../hooks/useInjectedWallet';
 
 import type {ReactElement, ReactNode} from 'react';
-import type {Chain} from 'wagmi';
+import type {Chain} from 'viem';
 import type {TNetwork} from './Header';
 import type {TModal} from './Modal';
 
@@ -75,17 +75,16 @@ function Modal(props: TModal): ReactElement {
 export function ModalMobileMenu(props: TModalMobileMenu): ReactElement {
 	const {isOpen, onClose, shouldUseWallets = true, shouldUseNetworks = true, children} = props;
 	const {onSwitchChain, isActive, address, ens, lensProtocolHandle, onDesactivate, onConnect} = useWeb3();
-	const {chain} = useNetwork();
+	const {chain} = useAccount();
 	const [walletIdentity, set_walletIdentity] = useState('Connect a wallet');
 	const detectedWalletProvider = useInjectedWallet();
 	const {connectors} = useConnect();
 
 	const supportedNetworks = useMemo((): TNetwork[] => {
-		const injectedConnector = connectors.find((e): boolean => e.id.toLocaleLowerCase() === 'injected');
-		assert(injectedConnector, 'No injected connector found');
-		const chainsForInjected = injectedConnector.chains;
-		const noTestnet = chainsForInjected.filter(({id}): boolean => id !== 1337);
-		return noTestnet.map((network: Chain): TNetwork => ({value: network.id, label: network.name}));
+		connectors; //Hard trigger re-render when connectors change
+		const config = retrieveConfig();
+		const noFork = config.chains.filter(({id}): boolean => id !== 1337);
+		return noFork.map((network: Chain): TNetwork => ({value: network.id, label: network.name}));
 	}, [connectors]);
 
 	useEffect((): void => {

src/contexts/useYearn.tsx

@@ -72,7 +72,7 @@ export const YearnContextApp = memo(function YearnContextApp({children}: {childr
 	const {onRefresh} = useYearnWallet();
 	const {value: maxLoss, set: set_maxLoss} = useLocalStorageValue<bigint>('yearn.fi/max-loss', {
 		defaultValue: DEFAULT_MAX_LOSS,
-		parse: (str: string, fallback: bigint): bigint => (str ? deserialize(str) : fallback),
+		parse: (str, fallback): bigint => (str ? deserialize(str) : fallback ?? DEFAULT_MAX_LOSS),
 		stringify: (data: bigint): string => serialize(data)
 	});
 	const {value: zapSlippage, set: set_zapSlippage} = useLocalStorageValue<number>('yearn.fi/zap-slippage', {

src/hooks/useAutoConnect.ts

@@ -8,8 +8,7 @@ function useAutoConnect(): void {
 
 	useEffect((): void => {
 		AUTOCONNECTED_CONNECTOR_IDS.forEach((connector): void => {
-			const connectorInstance = connectors.find((c): boolean => c.id === connector && c.ready);
-
+			const connectorInstance = connectors.find((c): boolean => c.id === connector);
 			if (connectorInstance) {
 				connect({connector: connectorInstance, chainId: 1});
 			}