Fix Popular chain missing icons on dashboard (#4562)

## Problem solved

Short description of the bug fixed or feature added

<!-- start pr-codex -->

---

## PR-Codex overview
This PR updates the `connect-wallet` component to include support for popular chains with metadata.

### Detailed summary
- Added `useSupportedChainsRecord` import
- Added `chainsRecord` state
- Added `popularChainsWithMeta` state
- Updated `chainSections` to use `popularChainsWithMeta`
- Updated dependencies for `useMemo` in `chainSections`

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

<!-- end pr-codex -->

Author: MananTank

apps/dashboard/src/@3rdweb-sdk/react/components/connect-wallet/index.tsx

@@ -7,7 +7,10 @@ import { getSDKTheme } from "app/components/sdk-component-theme";
 import { CustomChainRenderer } from "components/selects/CustomChainRenderer";
 import { mapV4ChainToV5Chain } from "contexts/map-chains";
 import { useTrack } from "hooks/analytics/useTrack";
-import { useSupportedChains } from "hooks/chains/configureChains";
+import {
+  useSupportedChains,
+  useSupportedChainsRecord,
+} from "hooks/chains/configureChains";
 import {
   useAddRecentlyUsedChainId,
   useRecentlyUsedChains,
@@ -37,12 +40,17 @@ export const CustomConnectWallet = (props: {
   // const setIsNetworkConfigModalOpen = useSetIsNetworkConfigModalOpen();
   const t = theme === "light" ? "light" : "dark";
   const allv4Chains = useSupportedChains();
+  const chainsRecord = useSupportedChainsRecord();
   const favChainsQuery = useFavoriteChains();
   const setIsNetworkConfigModalOpen = useSetIsNetworkConfigModalOpen();
   const allChains = useMemo(() => {
     return allv4Chains.map(mapV4ChainToV5Chain);
   }, [allv4Chains]);
 
+  const popularChainsWithMeta = useMemo(() => {
+    return popularChains.map((x) => chainsRecord[x.id] || x);
+  }, [chainsRecord]);
+
   const chainSections = useMemo(() => {
     return [
       {
@@ -51,14 +59,14 @@ export const CustomConnectWallet = (props: {
       },
       {
         label: "Popular",
-        chains: popularChains,
+        chains: popularChainsWithMeta.map(mapV4ChainToV5Chain),
       },
       {
         label: "Recent",
         chains: recentChainsv4.map(mapV4ChainToV5Chain),
       },
     ];
-  }, [recentChainsv4, favChainsQuery.data]);
+  }, [recentChainsv4, favChainsQuery.data, popularChainsWithMeta]);
 
   // ensures login status on pages that need it
   const { isLoading, isLoggedIn } = useLoggedInUser();