Feat/wagmi focus in weblib (#308)

* chore: Reduce Sentry's tracesSampleRate to 10%

* feat: move stuff in weblib

* feat: upgrade weblib

* chores: bump weblib

---------

Co-authored-by: Karelian Pie <devkarelianpie@gmail.com>
Co-authored-by: Majorfi <major-tom.eth@pm.me>

apps/common/components/AppHeader.tsx

@@ -6,6 +6,7 @@ import {Popover, Transition} from '@headlessui/react';
 import {useIsMounted} from '@react-hookz/web';
 import {VaultsHeader} from '@vaults/components/header/VaultsHeader';
 import {VeYfiHeader} from '@veYFI/components/header/VeYfiHeader';
+import Header from '@yearn-finance/web-lib/components/Header';
 import Renderable from '@yearn-finance/web-lib/components/Renderable';
 import {useWeb3} from '@yearn-finance/web-lib/contexts/useWeb3';
 import BalanceReminderPopover from '@common/components/BalanceReminderPopover';
@@ -17,7 +18,6 @@ import {YBribeHeader} from '@yBribe/components/header/YBribeHeader';
 import {YCrvHeader} from '@yCRV/components/header/YCrvHeader';
 
 import {AppName, APPS} from './Apps';
-import Header from './Header';
 import {MotionDiv} from './MotionDiv';
 
 import type {ReactElement} from 'react';

apps/common/components/Apps.tsx

@@ -6,13 +6,12 @@ import ycrvManifest from 'public/apps/ycrv-manifest.json';
 import {VAULTS_MENU} from '@vaults/constants/menu';
 import {VEYFI_MENU} from '@veYFI/constants/menu';
 import {YBAL_TOKEN_ADDRESS, YCRV_TOKEN_ADDRESS} from '@yearn-finance/web-lib/utils/constants';
+import {ImageWithFallback} from '@common/components/ImageWithFallback';
 import LogoYearn from '@common/icons/LogoYearn';
 import {YBAL_MENU} from '@yBal/constants/menu';
 import {YBRIBE_MENU} from '@yBribe/constants/menu';
 import {YCRV_MENU} from '@yCRV/constants/menu';
 
-import {ImageWithFallback} from './ImageWithFallback';
-
 import type {ReactElement} from 'react';
 import type {TMenu} from '@yearn-finance/web-lib/components/Header';
 import type {TMetaFile} from './Meta';

apps/common/components/BalanceReminderPopover.tsx

@@ -10,12 +10,11 @@ import IconWallet from '@yearn-finance/web-lib/icons/IconWallet';
 import {toAddress, truncateHex} from '@yearn-finance/web-lib/utils/address';
 import {toBigInt} from '@yearn-finance/web-lib/utils/format.bigNumber';
 import {formatAmount} from '@yearn-finance/web-lib/utils/format.number';
+import {ImageWithFallback} from '@common/components/ImageWithFallback';
 import {useWallet} from '@common/contexts/useWallet';
 import {useYearn} from '@common/contexts/useYearn';
 import {useBalance} from '@common/hooks/useBalance';
 
-import {ImageWithFallback} from './ImageWithFallback';
-
 import type {ReactElement} from 'react';
 import type {TAddress, TDict} from '@yearn-finance/web-lib/types';
 import type {TBalanceData} from '@yearn-finance/web-lib/types/hooks';

apps/common/components/ImageWithFallback.tsx

@@ -1,12 +1,12 @@
-import {useState} from 'react';
+import React, {useState} from 'react';
 import Image from 'next/image';
 import performBatchedUpdates from '@yearn-finance/web-lib/utils/performBatchedUpdates';
 
 import type {ImageProps} from 'next/image';
 import type {CSSProperties, ReactElement} from 'react';
 
-function ImageWithFallback(props: ImageProps & {onCatchError?: VoidFunction}): ReactElement {
-	const {alt, src, onCatchError, ...rest} = props;
+function ImageWithFallback(props: ImageProps): ReactElement {
+	const {alt, src, ...rest} = props;
 	const [imageSrc, set_imageSrc] = useState(`${src}?fallback=true`);
 	const [imageStyle, set_imageStyle] = useState<CSSProperties>({});
 
@@ -19,7 +19,6 @@ function ImageWithFallback(props: ImageProps & {onCatchError?: VoidFunction}): R
 				performBatchedUpdates((): void => {
 					set_imageSrc('/placeholder.png');
 					set_imageStyle({filter: 'opacity(0.2)'});
-					onCatchError?.();
 				});
 			}}
 			{...rest} />