revert: fix: add scroll on overflow for walletconnect to dapps menu (#…

…5406)

This reverts commit 4fa4e57.

src/plugins/walletConnectToDapps/components/header/DappHeaderMenuSummaryV2.tsx

@@ -0,0 +1,71 @@
+import { Accordion, MenuDivider, MenuGroup } from '@chakra-ui/react'
+import type { SessionTypes } from '@walletconnect/types'
+import { useWalletConnectV2 } from 'plugins/walletConnectToDapps/WalletConnectV2Provider'
+import { useMemo } from 'react'
+import { useTranslate } from 'react-polyglot'
+
+import { WalletConnectButtons } from './ConnectDapp'
+import { Session } from './Session'
+
+export const DappHeaderMenuSummaryV2 = () => {
+  const translate = useTranslate()
+
+  const { sessionsByTopic, web3wallet } = useWalletConnectV2()
+
+  const sessions = useMemo(() => Object.values(sessionsByTopic), [sessionsByTopic])
+
+  const { connectedSessions, expiredSessions } = useMemo(() => {
+    const nowTtl = Date.now() / 1000
+    return sessions.reduce<{
+      connectedSessions: SessionTypes.Struct[]
+      expiredSessions: SessionTypes.Struct[]
+    }>(
+      (acc, session) => {
+        if (!session) return acc
+        if (session.expiry < nowTtl) {
+          acc.expiredSessions.push(session)
+        } else {
+          acc.connectedSessions.push(session)
+        }
+        return acc
+      },
+      { connectedSessions: [], expiredSessions: [] },
+    )
+  }, [sessions])
+
+  if (!sessions.length || !web3wallet) return null
+
+  return (
+    <>
+      {connectedSessions.length > 0 && (
+        <MenuGroup
+          title={translate('plugins.walletConnectToDapps.header.connectedDapp')}
+          ml={3}
+          color='text.subtle'
+        >
+          <Accordion allowToggle defaultIndex={0} variant='default'>
+            {connectedSessions.map(session => (
+              <Session key={session.topic} session={session} />
+            ))}
+          </Accordion>
+        </MenuGroup>
+      )}
+      {connectedSessions.length > 0 && expiredSessions.length > 0 && <MenuDivider />}
+      {expiredSessions.length > 0 && (
+        <MenuGroup
+          title={translate('plugins.walletConnectToDapps.header.staleDapp')}
+          ml={3}
+          color='text.subtle'
+        >
+          <Accordion allowToggle defaultIndex={0} variant='default'>
+            {expiredSessions.map(session => (
+              <Session key={session.topic} session={session} />
+            ))}
+          </Accordion>
+        </MenuGroup>
+      )}
+      <MenuDivider />
+      <WalletConnectButtons m={4} />
+    </>
+  )
+}

src/plugins/walletConnectToDapps/components/header/WalletConnectToDappsHeaderButton.tsx

@@ -1,7 +1,7 @@
 import { ChevronDownIcon } from '@chakra-ui/icons'
 import { AvatarGroup, Button, Menu, MenuButton, MenuList } from '@chakra-ui/react'
 import type { SessionTypes } from '@walletconnect/types'
-import { DappHeaderMenuSummary } from 'plugins/walletConnectToDapps/components/header/DappHeaderMenuSummary'
+import { DappHeaderMenuSummaryV2 } from 'plugins/walletConnectToDapps/components/header/DappHeaderMenuSummaryV2'
 import { useWalletConnectV2 } from 'plugins/walletConnectToDapps/WalletConnectV2Provider'
 import { type FC, useMemo } from 'react'
 import { useTranslate } from 'react-polyglot'
@@ -51,7 +51,7 @@ const WalletConnectV2ConnectedButton = () => {
     [sessions],
   )
   return (
-    <Menu autoSelect={false} isLazy>
+    <Menu autoSelect={false}>
       <MenuButton
         as={Button}
         leftIcon={
@@ -100,7 +100,7 @@ const WalletConnectV2ConnectedButton = () => {
         flexDir='column'
         pb={0}
       >
-        <DappHeaderMenuSummary />
+        <DappHeaderMenuSummaryV2 />
       </MenuList>
     </Menu>
   )