chore: laboratory add siwx status (#3451)

apps/laboratory/src/components/DefaultSIWXStatus.tsx

@@ -0,0 +1,44 @@
+'use client'
+
+import { useEffect, useState } from 'react'
+
+import { Card, CardHeader, Code, Heading, Text } from '@chakra-ui/react'
+
+export interface DefaultSIWXStatusProps {
+  localStorageKey?: string
+}
+
+export function DefaultSIWXStatus({ localStorageKey = '@appkit/siwx' }: DefaultSIWXStatusProps) {
+  const [status, setStatus] = useState('')
+
+  useEffect(() => {
+    const interval = setInterval(() => {
+      const newStatus = localStorage.getItem(localStorageKey) || ''
+      if (newStatus !== status) {
+        setStatus(newStatus)
+      }
+    }, 1000)
+
+    return () => {
+      clearInterval(interval)
+    }
+  }, [])
+
+  if (!status) {
+    return null
+  }
+
+  return (
+    <Card marginTop={10} marginBottom={10}>
+      <CardHeader>
+        <Heading size="md">SIWX Status</Heading>
+      </CardHeader>
+
+      <Text mx="4">Below is shown the data stored for SIWX sessions:</Text>
+
+      <Code m="4" maxH="64" whiteSpace="pre" overflow="auto" variant="outline">
+        {JSON.stringify(JSON.parse(status), null, 2)}
+      </Code>
+    </Card>
+  )
+}

apps/laboratory/src/pages/library/siwx-default.tsx

@@ -5,9 +5,13 @@ import { EthersAdapter } from '@reown/appkit-adapter-ethers'
 import { SolanaAdapter } from '@reown/appkit-adapter-solana'
 import { DefaultSIWX } from '@reown/appkit-siwx'
 import { mainnet } from '@reown/appkit/networks'
-import { createAppKit } from '@reown/appkit/react'
+import { createAppKit, useAppKitNetwork } from '@reown/appkit/react'
 
 import { AppKitButtons } from '../../components/AppKitButtons'
+import { BitcoinTests } from '../../components/Bitcoin/BitcoinTests'
+import { DefaultSIWXStatus } from '../../components/DefaultSIWXStatus'
+import { EthersTests } from '../../components/Ethers/EthersTests'
+import { SolanaTests } from '../../components/Solana/SolanaTests'
 import { ConstantsUtil } from '../../utils/ConstantsUtil'
 import { ThemeStore } from '../../utils/StoreUtil'
 
@@ -38,9 +42,16 @@ const modal = createAppKit({
 ThemeStore.setModal(modal)
 
 export default function SIWXDefault() {
+  const { caipNetwork } = useAppKitNetwork()
+
   return (
     <>
       <AppKitButtons />
+      <DefaultSIWXStatus />
+
+      {caipNetwork?.chainNamespace === 'eip155' && <EthersTests />}
+      {caipNetwork?.chainNamespace === 'solana' && <SolanaTests />}
+      {caipNetwork?.chainNamespace === 'bip122' && <BitcoinTests />}
     </>
   )
 }