diff --git a/apps/laboratory/package.json b/apps/laboratory/package.json
index 1c7ba9538b..0b809a2554 100644
--- a/apps/laboratory/package.json
+++ b/apps/laboratory/package.json
@@ -89,12 +89,14 @@
"@reown/appkit-solana": "workspace:*",
"@reown/appkit-wagmi": "workspace:*",
"@reown/appkit-wallet": "workspace:*",
+ "@reown/appkit-experimental": "workspace:*",
"@reown/appkit-adapter-solana": "workspace:*",
"@reown/appkit-adapter-ethers": "workspace:*",
"@reown/appkit-adapter-ethers5": "workspace:*",
"@reown/appkit-adapter-wagmi": "workspace:*",
"axios": "1.7.2",
"bs58": "6.0.0",
+ "date-fns": "4.1.0",
"ethers": "6.13.2",
"ethers5": "npm:ethers@5.7.2",
"framer-motion": "10.17.9",
diff --git a/apps/laboratory/src/components/SmartSessionGrantedPermissionsInfo.tsx b/apps/laboratory/src/components/SmartSessionGrantedPermissionsInfo.tsx
new file mode 100644
index 0000000000..9b87d2cb2b
--- /dev/null
+++ b/apps/laboratory/src/components/SmartSessionGrantedPermissionsInfo.tsx
@@ -0,0 +1,47 @@
+import * as React from 'react'
+import { StackDivider, Heading, Box, Stack, Text } from '@chakra-ui/react'
+import { getChain } from '../utils/NetworksUtil'
+import { formatDistanceToNow } from 'date-fns'
+import type { SmartSessionGrantPermissionsResponse } from '@reown/appkit-experimental/smart-session'
+
+export function SmartSessionGrantedPermissionsInfo({
+ grantedPermissions
+}: {
+ grantedPermissions: SmartSessionGrantPermissionsResponse | undefined
+}) {
+ if (!grantedPermissions?.context) {
+ return (
+
+ Dapp does not have any stored permissions
+
+ )
+ }
+
+ const { address, chainId, expiry } = grantedPermissions
+ const parsedExpiry = formatDistanceToNow(new Date(expiry * 1000), { addSuffix: true })
+ const parsedChainId = parseInt(chainId, 16)
+ const chain = getChain(parsedChainId)
+
+ return (
+ } spacing="4">
+
+
+ Account Address
+
+ {address}
+
+
+
+ Chain Id
+
+ {chain?.name || chainId}
+
+
+
+ Expiry
+
+ {parsedExpiry}
+
+
+ )
+}
diff --git a/apps/laboratory/src/components/Wagmi/WagmiPermissionsAsyncTest.tsx b/apps/laboratory/src/components/Wagmi/WagmiPermissionsAsyncTest.tsx
index 63102882cb..d927710089 100644
--- a/apps/laboratory/src/components/Wagmi/WagmiPermissionsAsyncTest.tsx
+++ b/apps/laboratory/src/components/Wagmi/WagmiPermissionsAsyncTest.tsx
@@ -1,8 +1,14 @@
import { Box, Card, CardBody, CardHeader, Heading, Stack, StackDivider } from '@chakra-ui/react'
import { WagmiRequestPermissionsAsyncTest } from './WagmiRequestPermissionsAsyncTest'
import { WagmiPurchaseDonutAsyncPermissionsTest } from './WagmiPurchaseDonutAsyncPermissionsTest'
+import { SmartSessionGrantedPermissionsInfo } from '../SmartSessionGrantedPermissionsInfo'
+import { useERC7715Permissions } from '../../hooks/useERC7715Permissions'
export function WagmiPermissionsAsyncTest() {
+ const { smartSession } = useERC7715Permissions()
+ const grantedPermissions =
+ smartSession?.type === 'async' ? smartSession.grantedPermissions : undefined
+
return (
@@ -10,6 +16,12 @@ export function WagmiPermissionsAsyncTest() {
} spacing="4">
+
+
+ Existing Session Information
+
+
+
Request Permissions
diff --git a/apps/laboratory/src/components/Wagmi/WagmiPermissionsSyncTest.tsx b/apps/laboratory/src/components/Wagmi/WagmiPermissionsSyncTest.tsx
index 852c1252bb..8fa4e17fd4 100644
--- a/apps/laboratory/src/components/Wagmi/WagmiPermissionsSyncTest.tsx
+++ b/apps/laboratory/src/components/Wagmi/WagmiPermissionsSyncTest.tsx
@@ -2,8 +2,14 @@ import { Box, Card, CardBody, CardHeader, Heading, Stack, StackDivider } from '@
import { WagmiRequestPermissionsSyncTest } from './WagmiRequestPermissionsSyncTest'
import { WagmiPurchaseDonutSyncPermissionsTest } from './WagmiPurchaseDonutSyncPermissionsTest'
import { WagmiCreatePasskeySignerTest } from './WagmiCreatePasskeySignerTest'
+import { SmartSessionGrantedPermissionsInfo } from '../SmartSessionGrantedPermissionsInfo'
+import { useERC7715Permissions } from '../../hooks/useERC7715Permissions'
export function WagmiPermissionsSyncTest() {
+ const { smartSession } = useERC7715Permissions()
+ const grantedPermissions =
+ smartSession?.type === 'sync' ? smartSession.grantedPermissions : undefined
+
return (
@@ -11,6 +17,12 @@ export function WagmiPermissionsSyncTest() {
} spacing="4">
+
+
+ Existing Session Information
+
+
+
New Passkey
diff --git a/apps/laboratory/src/components/Wagmi/WagmiPurchaseDonutAsyncPermissionsTest.tsx b/apps/laboratory/src/components/Wagmi/WagmiPurchaseDonutAsyncPermissionsTest.tsx
index fb26dc97f0..bc88a2066f 100644
--- a/apps/laboratory/src/components/Wagmi/WagmiPurchaseDonutAsyncPermissionsTest.tsx
+++ b/apps/laboratory/src/components/Wagmi/WagmiPurchaseDonutAsyncPermissionsTest.tsx
@@ -4,15 +4,34 @@ import { useState } from 'react'
import { useChakraToast } from '../Toast'
import { encodeFunctionData, parseEther } from 'viem'
import { abi as donutContractAbi, address as donutContractaddress } from '../../utils/DonutContract'
-import { sepolia } from 'viem/chains'
import { useLocalEcdsaKey } from '../../context/LocalEcdsaKeyContext'
import { useERC7715Permissions } from '../../hooks/useERC7715Permissions'
-import { executeActionsWithECDSAAndCosignerPermissions } from '../../utils/ERC7715Utils'
+import { executeActionsWithECDSAKey } from '../../utils/ERC7715Utils'
+import { getChain } from '../../utils/NetworksUtil'
+import type { SmartSessionGrantPermissionsResponse } from '@reown/appkit-experimental/smart-session'
export function WagmiPurchaseDonutAsyncPermissionsTest() {
- const { privateKey } = useLocalEcdsaKey()
+ const { smartSession } = useERC7715Permissions()
+
+ if (smartSession?.type !== 'async' || !smartSession.grantedPermissions?.context) {
+ return (
+
+ Dapp does not have the permissions
+
+ )
+ }
- const { grantedPermissions, pci } = useERC7715Permissions()
+ return
+}
+
+function ConnectedTestContent({
+ grantedPermissions
+}: {
+ grantedPermissions: SmartSessionGrantPermissionsResponse
+}) {
+ const { privateKey } = useLocalEcdsaKey()
+ const toast = useChakraToast()
+ const [isTransactionPending, setTransactionPending] = useState(false)
const {
data: donutsOwned,
@@ -23,24 +42,24 @@ export function WagmiPurchaseDonutAsyncPermissionsTest() {
abi: donutContractAbi,
address: donutContractaddress,
functionName: 'getBalance',
- args: [grantedPermissions?.signerData?.submitToAddress || '0x']
+ args: [grantedPermissions.address]
})
- const [isTransactionPending, setTransactionPending] = useState(false)
- const toast = useChakraToast()
-
async function onPurchaseDonutWithPermissions() {
setTransactionPending(true)
try {
- if (!privateKey) {
- throw new Error(`Unable to get dApp private key`)
+ const chainId = parseInt(grantedPermissions.chainId, 16)
+ if (!chainId) {
+ throw new Error('Chain ID not available in granted permissions')
}
- if (!grantedPermissions) {
- throw Error('No permissions available')
+ const chain = getChain(chainId)
+ if (!chain) {
+ throw new Error('Unknown chainId')
}
- if (!pci) {
- throw Error('No WC cosigner data(PCI) available')
+ if (!privateKey) {
+ throw new Error(`Unable to get dApp private key`)
}
+
const purchaseDonutCallData = encodeFunctionData({
abi: donutContractAbi,
functionName: 'purchase',
@@ -53,12 +72,12 @@ export function WagmiPurchaseDonutAsyncPermissionsTest() {
data: purchaseDonutCallData
}
]
- const txHash = await executeActionsWithECDSAAndCosignerPermissions({
+ const txHash = await executeActionsWithECDSAKey({
actions: purchaseDonutCallDataExecution,
- chain: sepolia,
+ chain,
ecdsaPrivateKey: privateKey as `0x${string}`,
- permissions: grantedPermissions,
- pci
+ accountAddress: grantedPermissions.address,
+ permissionsContext: grantedPermissions.context
})
if (txHash) {
toast({
@@ -77,16 +96,9 @@ export function WagmiPurchaseDonutAsyncPermissionsTest() {
}
setTransactionPending(false)
}
- if (!grantedPermissions) {
- return (
-
- Dapp does not have the permissions
-
- )
- }
return (
-
+