feat: update params structure

vechain · Dec 17, 2024 · 61d1dba · 61d1dba
1 parent 27d6e9f
commit 61d1dba
Show file tree

Hide file tree

Showing 10 changed files with 82 additions and 49 deletions.
diff --git a/examples/sample-privy-next-app/src/app/components/SocialLoginWrapper.tsx b/examples/sample-privy-next-app/src/app/components/SocialLoginWrapper.tsx
@@ -35,13 +35,9 @@ export function SocialLoginWrapper({ children }: Props) {
                     'clz41gcg00e4ay75dmq3uzzgr',
                 ],
             }}
-            smartAccountConfig={{
-                // TODO: rename to feeDelegationConfig
-                nodeUrl: 'https://node.vechain.energy', // TODO: remove
+            feeDelegationConfig={{
                 delegatorUrl: 'https://sponsor.vechain.energy/by/749',
-                // TODO: add parameter to select if to sponsor all transactions or only provy
-                accountFactoryAddress:
-                    '0xC06Ad8573022e2BE416CA89DA47E8c592971679A',
+                delegateAllTransactions: true,
             }}
             dappKitConfig={{
                 nodeUrl: 'https://node.vechain.energy',

diff --git a/examples/sample-privy-next-app/src/app/pages/homepage.tsx b/examples/sample-privy-next-app/src/app/pages/homepage.tsx
@@ -71,7 +71,6 @@ const HomePage = (): ReactElement => {
                             <p>Address: {connectedAccount}</p>
                             {<p>Connection Type: {connectionType}</p>}
                             <br />
-
                             {smartAccount.address && (
                                 <>
                                     <h1>

diff --git a/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/DAppKitPrivyProvider.tsx b/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/DAppKitPrivyProvider.tsx
@@ -36,17 +36,16 @@ type Props = {
         )[];
         ecosystemAppsID?: string[];
     };
-    smartAccountConfig?: {
-        nodeUrl: string;
+    feeDelegationConfig: {
         delegatorUrl: string;
-        accountFactoryAddress: string;
+        delegateAllTransactions: boolean;
     };
     dappKitConfig: DAppKitUIOptions;
 };
 
 type DAppKitPrivyConfig = {
     privyConfig: Props['privyConfig'];
-    smartAccountConfig?: Props['smartAccountConfig'];
+    feeDelegationConfig: Props['feeDelegationConfig'];
     dappKitConfig: Props['dappKitConfig'];
 };
 
@@ -76,7 +75,7 @@ export const useDAppKitPrivyConfig = () => {
 export const DAppKitPrivyProvider = ({
     children,
     privyConfig,
-    smartAccountConfig,
+    feeDelegationConfig,
     dappKitConfig,
 }: Props) => {
     // Join login methods and ecosystemAppsID, but ecosystemAppsID needs to be written as "privy:appID"
@@ -87,7 +86,7 @@ export const DAppKitPrivyProvider = ({
 
     return (
         <DAppKitPrivyContext.Provider
-            value={{ privyConfig, smartAccountConfig, dappKitConfig }}
+            value={{ privyConfig, feeDelegationConfig, dappKitConfig }}
         >
             <BasePrivyProvider
                 appId={privyConfig.appId}
@@ -97,7 +96,6 @@ export const DAppKitPrivyProvider = ({
                         // @ts-ignore
                         primary: loginMethods,
                     },
-                    // loginMethods: privyConfig.loginMethods,
                     appearance: privyConfig.appearance,
                     embeddedWallets: {
                         createOnLogin:
@@ -106,26 +104,24 @@ export const DAppKitPrivyProvider = ({
                     },
                 }}
             >
-                <SmartAccountProvider
-                    nodeUrl={smartAccountConfig?.nodeUrl ?? ''}
-                    delegatorUrl={smartAccountConfig?.delegatorUrl ?? ''}
-                    accountFactory={
-                        smartAccountConfig?.accountFactoryAddress ?? ''
-                    }
+                <DAppKitProvider
+                    nodeUrl={dappKitConfig.nodeUrl}
+                    genesis={dappKitConfig.genesis}
+                    usePersistence
+                    walletConnectOptions={dappKitConfig.walletConnectOptions}
+                    themeMode={dappKitConfig.themeMode}
+                    themeVariables={{}}
                 >
-                    <DAppKitProvider
+                    <SmartAccountProvider
                         nodeUrl={dappKitConfig.nodeUrl}
-                        genesis={dappKitConfig.genesis}
-                        usePersistence
-                        walletConnectOptions={
-                            dappKitConfig.walletConnectOptions
+                        delegatorUrl={feeDelegationConfig.delegatorUrl}
+                        delegateAllTransactions={
+                            feeDelegationConfig.delegateAllTransactions
                         }
-                        themeMode={dappKitConfig.themeMode}
-                        themeVariables={{}}
                     >
                         <ChakraProvider>{children}</ChakraProvider>
-                    </DAppKitProvider>
-                </SmartAccountProvider>
+                    </SmartAccountProvider>
+                </DAppKitProvider>
             </BasePrivyProvider>
         </DAppKitPrivyContext.Provider>
     );

diff --git a/...es/dapp-kit-react-privy/src/DAppKitPrivyProvider/components/ConnectModal/AccountModal.tsx b/...es/dapp-kit-react-privy/src/DAppKitPrivyProvider/components/ConnectModal/AccountModal.tsx
@@ -74,9 +74,11 @@ export const AccountModal = ({ isOpen, onClose }: Props) => {
                 </Text>
             </VStack>
         ) : (
-            <Text fontSize={'sm'}>
-                {humanAddress(connectedAccount ?? '', 4, 4)}
-            </Text>
+            <VStack w={'full'} justifyContent={'center'}>
+                <Text fontSize={'sm'}>
+                    {humanAddress(connectedAccount ?? '', 4, 4)}
+                </Text>
+            </VStack>
         );
     }, [vetDomain, connectedAccount, humanAddress]);
 

diff --git a/...s/dapp-kit-react-privy/src/DAppKitPrivyProvider/components/ConnectModal/ConnectButton.tsx b/...s/dapp-kit-react-privy/src/DAppKitPrivyProvider/components/ConnectModal/ConnectButton.tsx
@@ -37,16 +37,22 @@ export const ConnectButton = () => {
                 <>
                     {isConnected ? (
                         <Button onClick={accountModal.onOpen}>
-                            <Image
-                                className="address-icon mobile"
-                                src={walletImage}
-                                alt="wallet"
-                                width={23}
-                                height={23}
-                                borderRadius="50%"
-                                marginRight={2}
-                            />
-                            {addressOrDomain}
+                            {isLoadingConnection || !isConnected ? (
+                                'Loading...'
+                            ) : (
+                                <>
+                                    <Image
+                                        className="address-icon mobile"
+                                        src={walletImage}
+                                        alt="wallet"
+                                        width={23}
+                                        height={23}
+                                        borderRadius="50%"
+                                        marginRight={2}
+                                    />
+                                    {addressOrDomain}
+                                </>
+                            )}
                         </Button>
                     ) : (
                         <Button onClick={connectModal.onOpen}>Login</Button>

diff --git a/...es/dapp-kit-react-privy/src/DAppKitPrivyProvider/components/ConnectModal/ConnectModal.tsx b/...es/dapp-kit-react-privy/src/DAppKitPrivyProvider/components/ConnectModal/ConnectModal.tsx
@@ -229,7 +229,10 @@ export const ConnectModal = ({ isOpen, onClose, logo }: Props) => {
 
             <EcosystemAppsModal
                 isOpen={ecosystemModal.isOpen}
-                onClose={ecosystemModal.onClose}
+                onClose={() => {
+                    ecosystemModal.onClose();
+                    onClose();
+                }}
                 onBack={() => {
                     ecosystemModal.onClose();
                     // Instead of closing the connect modal, we just close the ecosystem modal

diff --git a/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/hooks/useSendTransaction.ts b/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/hooks/useSendTransaction.ts
@@ -126,7 +126,7 @@ export const useSendTransaction = ({
     privyUIOptions,
 }: UseSendTransactionProps): UseSendTransactionReturnValue => {
     const { vendor, thor } = useConnex();
-    const { dappKitConfig } = useDAppKitPrivyConfig();
+    const { dappKitConfig, feeDelegationConfig } = useDAppKitPrivyConfig();
     const nodeUrl = dappKitConfig.nodeUrl;
 
     const { isConnectedWithPrivy } = useWallet();
@@ -181,7 +181,14 @@ export const useSendTransaction = ({
                 });
             }
 
-            const transaction = vendor.sign('tx', clauses);
+            let transaction = vendor.sign('tx', clauses);
+
+            if (feeDelegationConfig.delegateAllTransactions) {
+                transaction = transaction.delegate(
+                    feeDelegationConfig.delegatorUrl,
+                );
+            }
+
             if (signerAccount) {
                 let gasLimitNext;
                 try {

diff --git a/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/hooks/useSmartAccount.tsx b/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/hooks/useSmartAccount.tsx
@@ -18,6 +18,7 @@ import {
 } from '@vechain/sdk-network';
 import { SimpleAccountABI, SimpleAccountFactoryABI } from '../assets/abi';
 import { ExecuteWithAuthorizationSignData } from '../utils';
+import { ACCOUNT_FACTORY_ADDRESSES } from '../utils';
 
 export interface SmartAccountContextType {
     address: string | undefined;
@@ -34,6 +35,7 @@ export interface SmartAccountContextType {
     nodeUrl: string;
     delegatorUrl: string;
     accountFactory: string;
+    delegateAllTransactions: boolean;
 }
 
 const VechainAccountContext = createContext<SmartAccountContextType | null>(
@@ -57,12 +59,12 @@ export const SmartAccountProvider = ({
     children,
     nodeUrl,
     delegatorUrl,
-    accountFactory,
+    delegateAllTransactions,
 }: {
     children: React.ReactNode;
     nodeUrl: string;
     delegatorUrl: string;
-    accountFactory: string;
+    delegateAllTransactions: boolean;
 }) => {
     const { signTypedData, exportWallet, user } = usePrivy();
     const { signTypedData: signTypedDataCrossApp } = useCrossAppAccounts();
@@ -76,6 +78,7 @@ export const SmartAccountProvider = ({
     const [chainId, setChainId] = useState('');
     const thor = ThorClient.fromUrl(nodeUrl);
     const [isDeployed, setIsDeployed] = useState(false);
+    const [accountFactory, setAccountFactory] = useState<string>();
 
     const isCrossAppPrivyAccount = Boolean(
         user?.linkedAccounts?.some((account) => account.type === 'cross_app'),
@@ -169,6 +172,19 @@ export const SmartAccountProvider = ({
             });
     }, [smartAccountAddress, thor]);
 
+    /**
+     * Set the account factory address based on the chain ID
+     */
+    useEffect(() => {
+        if (!chainId) return;
+
+        setAccountFactory(
+            ACCOUNT_FACTORY_ADDRESSES[
+                chainId as keyof typeof ACCOUNT_FACTORY_ADDRESSES
+            ],
+        );
+    }, [chainId]);
+
     /**
      * Send a transaction on vechain by asking the privy wallet to sign a typed data content
      * that will allow us the execute the action with his smart account trough the executeWithAuthorization
@@ -264,7 +280,7 @@ export const SmartAccountProvider = ({
         if (!isDeployed) {
             clauses.push(
                 Clause.callFunction(
-                    Address.of(accountFactory),
+                    Address.of(accountFactory ?? ''),
                     ABIContract.ofAbi(SimpleAccountFactoryABI).getFunction(
                         'createAccount',
                     ),
@@ -353,14 +369,15 @@ export const SmartAccountProvider = ({
         <VechainAccountContext.Provider
             value={{
                 address: smartAccountAddress,
-                accountFactory,
+                accountFactory: accountFactory ?? '',
                 nodeUrl,
                 delegatorUrl,
                 embeddedWallet,
                 sendTransaction,
                 exportWallet,
                 thor,
                 isDeployed,
+                delegateAllTransactions,
             }}
         >
             {children}

diff --git a/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/utils/Constants.tsx b/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/utils/Constants.tsx
@@ -0,0 +1,6 @@
+export const ACCOUNT_FACTORY_ADDRESSES = {
+    '14018334920824264832118464179726739019961432051877733167310318607178':
+        '0xC06Ad8573022e2BE416CA89DA47E8c592971679A',
+    '1176455790972829965191905223412607679856028701100105089447013101863':
+        '0x7EABA81B4F3741Ac381af7e025f3B6e0428F05Fb',
+} as const;
diff --git a/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/utils/index.ts b/packages/dapp-kit-react-privy/src/DAppKitPrivyProvider/utils/index.ts
@@ -1,3 +1,4 @@
 export * from './FormattingUtils';
 export * from './Types';
 export * from './SmartAccountTransactionForwarder';
+export * from './Constants';
-Original file line number
+Diff line change
@@ Expand Up / @@ -71,7 +71,6 @@ const HomePage = (): ReactElement => { @@
                                 <p>Address: {connectedAccount}</p>
                                 {<p>Connection Type: {connectionType}</p>}
                                 <br />
                                 {smartAccount.address && (
                                     <>
                                         <h1>
@@ Expand Down @@