refactor(deps): upgrade @vocdoni/davinci-sdk@0.0.3

refs #36

Author: elboletaire

src/components/create-vote-form.tsx

@@ -14,20 +14,16 @@ import {
   verticalListSortingStrategy,
 } from '@dnd-kit/sortable'
 import { CSS } from '@dnd-kit/utilities'
-import { sepolia } from '@reown/appkit/networks'
 import { useAppKitNetwork } from '@reown/appkit/react'
 import {
-  createProcessSignatureMessage,
+  CensusOrigin,
   ElectionResultsTypeNames,
-  ProcessRegistryService,
-  ProcessStatus,
-  SmartContractService,
+  TxStatus,
   type BallotMode,
   type ElectionMetadata,
   type ElectionResultsType,
   type ProtocolVersion,
 } from '@vocdoni/davinci-sdk'
-import { BrowserProvider, type Eip1193Provider } from 'ethers'
 import { CheckCircle, Clock, GripVertical, HelpCircle, Plus, Rocket, Users, X } from 'lucide-react'
 import { useEffect, useState } from 'react'
 import { Controller, useFieldArray, useForm, type Control } from 'react-hook-form'
@@ -43,9 +39,9 @@ import { Separator } from '~components/ui/separator'
 import { Textarea } from '~components/ui/textarea'
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '~components/ui/tooltip'
 import { useMiniApp } from '~contexts/MiniAppContext'
+import { useSequencerNetwork } from '~contexts/sequencer-network'
 import { useVocdoniApi } from '~contexts/vocdoni-api-context'
 import { useSnapshots, type Snapshot } from '~hooks/use-snapshots'
-import { useUnifiedProvider } from '~hooks/use-unified-provider'
 import { useUnifiedWallet } from '~hooks/use-unified-wallet'
 import { CustomAddressesManager } from './census-addresses'
 import { Snapshots } from './snapshots'
@@ -159,7 +155,6 @@ export function CreateVoteForm() {
   const [isLaunching, setIsLaunching] = useState(false)
   const [launchSuccess, setLaunchSuccess] = useState(false)
   const { address, isConnected } = useUnifiedWallet()
-  const { getProvider } = useUnifiedProvider()
   const [error, setError] = useState<Error | null>(null)
 
   const form = useForm<FormData>({
@@ -190,7 +185,7 @@ export function CreateVoteForm() {
   })
 
   const formData = watch()
-  const api = useVocdoniApi()
+  const { api, sdk } = useVocdoniApi()
   const { data: snapshots, isLoading: isLoadingSnapshot, isError: isSnapshotError } = useSnapshots()
 
   // Reset weighted voting when switching to non-proportional snapshots
@@ -318,7 +313,12 @@ export function CreateVoteForm() {
 
       console.info('Census created:', census)
 
-      // Step 7: Create and push metadata
+      // Check if SDK is available
+      if (!sdk) {
+        throw new Error('SDK not initialized. Please ensure your wallet is connected.')
+      }
+
+      // Build metadata for ballot mode generation
       const metadata: ElectionMetadata = {
         title: { default: data.question },
         description: { default: '' },
@@ -355,79 +355,61 @@ export function CreateVoteForm() {
         }
       }
 
-      const metadataHash = await api.sequencer.pushMetadata(metadata)
-      const metadataUrl = api.sequencer.getMetadataUrl(metadataHash)
-      console.info('ℹ️ Metadata URL:', metadataUrl)
-
-      // Use provider for process creation (check wallet capabilities)
-      const walletProvider = await getProvider()
-      if (!walletProvider) {
-        throw new Error('Wallet provider not available.')
-      }
-      const provider = new BrowserProvider(walletProvider as Eip1193Provider)
-      console.info('ℹ️ Browser provider initialized:', provider)
-      const signer = await provider.getSigner()
-
-      // Get contract address from sequencer info
-      const info = await api.sequencer.getInfo()
-      const processRegistryAddress = info.contracts.process
-
-      const registry = new ProcessRegistryService(processRegistryAddress, signer)
-      const address = await signer.getAddress()
-      const pid = await registry.getNextProcessId(address)
-      console.info('ℹ️ Process ID:', pid)
-
-      const message = await createProcessSignatureMessage(pid)
-      const signature = await signer.signMessage(message)
-
       const ballotMode = generateBallotMode(metadata, data)
       console.info('ℹ️ Ballot mode:', ballotMode)
 
-      const { processId, encryptionPubKey, stateRoot } = await api.sequencer.createProcess({
-        processId: pid,
-        censusRoot: census.censusRoot,
-        ballotMode,
-        signature,
-        censusOrigin: data.censusType === 'custom-addresses' ? 1 : 1, // CensusOrigin.CensusOriginMerkleTree
-      })
-      console.info('✅ Process created with ID:', processId, stateRoot)
-
-      console.info('ℹ️ Creating new process with data:', [
-        ProcessStatus.READY,
-        Math.floor(Date.now() / 1000) + 60,
-        getDurationInSeconds(data.duration, data.durationUnit),
-        ballotMode,
-        {
-          censusOrigin: 1,
-          maxVotes: census.censusSize.toString(),
-          censusRoot: census.censusRoot,
-          censusURI: census.censusURI,
+      // Create process using SDK stream API
+      const stream = sdk.createProcessStream({
+        title: data.question,
+        description: '',
+        census: {
+          type: CensusOrigin.CensusOriginMerkleTree,
+          root: census.censusRoot,
+          size: census.censusSize,
+          uri: census.censusURI,
         },
-        metadataUrl,
-        { x: encryptionPubKey[0], y: encryptionPubKey[1] },
-        BigInt(stateRoot),
-      ])
-
-      // Step 10: Submit newProcess on-chain
-      await SmartContractService.executeTx(
-        registry.newProcess(
-          ProcessStatus.READY,
-          Math.floor(Date.now() / 1000) + 60,
-          getDurationInSeconds(data.duration, data.durationUnit),
-          ballotMode,
+        ballot: ballotMode,
+        timing: {
+          startDate: new Date(Date.now() + 60000), // +1 minute
+          duration: getDurationInSeconds(data.duration, data.durationUnit),
+        },
+        questions: [
           {
-            censusOrigin: 1,
-            maxVotes: census.censusSize.toString(),
-            censusRoot: census.censusRoot,
-            censusURI: census.censusURI,
+            title: data.question,
+            description: '',
+            choices: data.choices
+              .filter((choice) => choice.text.trim() !== '')
+              .map((choice, index) => ({
+                title: choice.text,
+                value: index,
+              })),
           },
-          metadataUrl,
-          { x: encryptionPubKey[0], y: encryptionPubKey[1] },
-          BigInt(stateRoot)
-        )
-      )
+        ],
+      })
+
+      // Handle transaction status events
+      let processId = ''
+      for await (const event of stream) {
+        console.info('📡 Transaction event:', event.status, event)
+
+        switch (event.status) {
+          case TxStatus.Pending:
+            console.info('⏳ Transaction pending:', event.hash)
+            break
+          case TxStatus.Completed:
+            processId = event.response.processId
+            console.info('✅ Process created with ID:', processId)
+            setLaunchSuccess(true)
+            break
+          case TxStatus.Failed:
+            console.error('❌ Transaction failed:', event.error)
+            throw new Error(event.error?.message || 'Transaction failed')
+          case TxStatus.Reverted:
+            console.error('↩️ Transaction reverted:', event.reason)
+            throw new Error(event.reason || 'Transaction reverted')
+        }
+      }
 
-      setLaunchSuccess(true)
       console.info('ℹ️ Vote launched successfully with process ID:', processId)
 
       // Wait to navigate
@@ -1058,6 +1040,7 @@ type LaunchVoteButtonProps = {
 const LaunchVoteButton = ({ handleLaunch, isLaunching, isFormValid }: LaunchVoteButtonProps) => {
   const { isConnected } = useUnifiedWallet()
   const { isMiniApp, isExternalWallet, supportedChains, getFarcasterEthereumProvider } = useMiniApp()
+  const { sequencerNetwork } = useSequencerNetwork()
   const { caipNetwork } = useAppKitNetwork()
 
   // All hooks must be at the top before any conditional returns
@@ -1084,7 +1067,6 @@ const LaunchVoteButton = ({ handleLaunch, isLaunching, isFormValid }: LaunchVote
   // PRIORITY 2: Check chain compatibility (only for external wallets)
   // Convert hex chain ID to decimal for comparison
   const actualChainIdDecimal = actualChainId ? parseInt(actualChainId, 16) : null
-  const isOnSepoliaActually = actualChainIdDecimal === sepolia.id
 
   useEffect(() => {
     console.info('🔍 Chain validation debug:', {
@@ -1096,15 +1078,7 @@ const LaunchVoteButton = ({ handleLaunch, isLaunching, isFormValid }: LaunchVote
       supportedChains,
       isExternalWallet,
     })
-  }, [
-    caipNetwork,
-    actualChainId,
-    isMiniApp,
-    supportedChains,
-    isExternalWallet,
-    actualChainIdDecimal,
-    isOnSepoliaActually,
-  ])
+  }, [caipNetwork, actualChainId, isMiniApp, supportedChains, isExternalWallet, actualChainIdDecimal])
 
   if (!isConnected) {
     return <ConnectWalletButtonMiniApp />
@@ -1164,9 +1138,9 @@ const LaunchVoteButton = ({ handleLaunch, isLaunching, isFormValid }: LaunchVote
         </div>
       )}
       <div className='ml-6 text-left text-davinci-black-alt/80 text-sm'>
-        Creating a vote requires a tx on the Sepolia testnet. If you need ETH to run a vote, you can get some from{' '}
-        <Link href='https://cloud.google.com/application/web3/faucet/ethereum/sepolia'>this faucet</Link>. The tx is
-        only needed to create the vote, <span className='font-medium'>casting votes is gasless.</span>
+        Creating a vote requires a tx on the {sequencerNetwork?.name} network. If you need ETH to run a vote, you can
+        get some from <Link href='https://cloud.google.com/application/web3/faucet/ethereum/sepolia'>this faucet</Link>.
+        The tx is only needed to create the vote, <span className='font-medium'>casting votes is gasless.</span>
       </div>
     </>
   )

src/contexts/MiniAppContext.tsx

@@ -1,6 +1,6 @@
 import { sdk } from '@farcaster/miniapp-sdk'
 import type { Provider } from 'ethers'
-import React, { createContext, useContext, useEffect, useState } from 'react'
+import React, { createContext, useCallback, useContext, useEffect, useState } from 'react'
 
 export interface FarcasterUser {
   fid: number
@@ -373,7 +373,7 @@ export const MiniAppProvider: React.FC<{ children: React.ReactNode }> = ({ child
   }
 
   // Get Farcaster Ethereum provider
-  const getFarcasterEthereumProvider = async () => {
+  const getFarcasterEthereumProvider = useCallback(async () => {
     if (!isMiniApp) {
       return null
     }
@@ -384,7 +384,7 @@ export const MiniAppProvider: React.FC<{ children: React.ReactNode }> = ({ child
       console.error('Error getting Farcaster Ethereum provider:', error)
       return null
     }
-  }
+  }, [isMiniApp])
 
   const contextValue: MiniAppContextType = {
     // State

src/contexts/process-context.tsx

@@ -33,7 +33,7 @@ type ProcessProviderProps = PropsWithChildren<{ process: Process }>
 const upfetch = up(fetch)
 
 export const ProcessProvider: FC<ProcessProviderProps> = ({ children, process }) => {
-  const api = useVocdoniApi()
+  const { api } = useVocdoniApi()
   const { address } = useUnifiedWallet()
   const censusRoot = process.process.census.censusRoot
 

src/contexts/vocdoni-api-context.tsx

@@ -1,30 +1,82 @@
-import { VocdoniApiService } from '@vocdoni/davinci-sdk'
-import { createContext, useContext, useMemo, type FC, type ReactNode } from 'react'
+import { DavinciSDK, VocdoniApiService } from '@vocdoni/davinci-sdk'
+import { BrowserProvider, type Eip1193Provider } from 'ethers'
+import { createContext, useContext, useEffect, useMemo, useState, type FC, type ReactNode } from 'react'
+import { useUnifiedProvider } from '~hooks/use-unified-provider'
+import { useUnifiedWallet } from '~hooks/use-unified-wallet'
 
 interface VocdoniApiContextValue {
   api: VocdoniApiService
+  sdk: DavinciSDK | null
 }
 
 // Creamos el contexto
 const VocdoniApiContext = createContext<VocdoniApiContextValue | undefined>(undefined)
 
 // Provider que inicializa la instancia de la API
 export const VocdoniApiProvider: FC<{ children: ReactNode }> = ({ children }) => {
+  const { address, isConnected } = useUnifiedWallet()
+  const { getProvider } = useUnifiedProvider()
+
+  // Old API instance (backwards compatible)
   const apiInstance = useMemo(() => {
     return new VocdoniApiService({
       sequencerURL: import.meta.env.SEQUENCER_URL,
       censusURL: import.meta.env.SEQUENCER_URL,
     })
   }, [])
 
-  return <VocdoniApiContext.Provider value={{ api: apiInstance }}>{children}</VocdoniApiContext.Provider>
+  // New SDK instance with dynamic signer
+  const [sdkInstance, setSdkInstance] = useState<DavinciSDK | null>(null)
+
+  // Re-initialize SDK when wallet connection changes
+  useEffect(() => {
+    const initializeSdk = async () => {
+      try {
+        if (isConnected && address) {
+          // Get wallet provider and create signer
+          const walletProvider = await getProvider()
+          if (walletProvider) {
+            const provider = new BrowserProvider(walletProvider as Eip1193Provider)
+            const signer = await provider.getSigner()
+
+            // Initialize SDK with signer
+            const sdk = new DavinciSDK({
+              signer,
+              sequencerUrl: import.meta.env.SEQUENCER_URL,
+              censusUrl: import.meta.env.SEQUENCER_URL,
+              useSequencerAddresses: true,
+            })
+
+            await sdk.init()
+            setSdkInstance(sdk)
+            console.info('✅ DavinciSDK initialized with signer:', address)
+          }
+        } else {
+          // Cannot initialize the sdk without a signer
+          const sdk = null
+
+          setSdkInstance(sdk)
+          console.info('ℹ️ No signer available to initialize DavinciSDK')
+        }
+      } catch (error) {
+        console.error('Failed to initialize DavinciSDK:', error)
+        setSdkInstance(null)
+      }
+    }
+
+    initializeSdk()
+  }, [address, isConnected, getProvider])
+
+  return (
+    <VocdoniApiContext.Provider value={{ api: apiInstance, sdk: sdkInstance }}>{children}</VocdoniApiContext.Provider>
+  )
 }
 
 // Hook para acceder al contexto
-export const useVocdoniApi = (): VocdoniApiService => {
+export const useVocdoniApi = () => {
   const context = useContext(VocdoniApiContext)
   if (!context) {
     throw new Error('useVocdoniApi must be used within a VocdoniApiProvider')
   }
-  return context.api
+  return context
 }

src/hooks/use-process-query.ts

@@ -1,13 +1,13 @@
 import { useQuery } from '@tanstack/react-query'
-import type { ElectionMetadata } from '@vocdoni/davinci-sdk'
+import type { ElectionMetadata, VocdoniApiService } from '@vocdoni/davinci-sdk'
 import { useEffect } from 'react'
 import { up } from 'up-fetch'
 import { useVocdoniApi } from '~contexts/vocdoni-api-context'
 import type { Process } from '~src/types'
 
 const upfetch = up(fetch)
 
-export const getProcessQuery = (id: string, api: ReturnType<typeof useVocdoniApi>) => ({
+export const getProcessQuery = (id: string, api: VocdoniApiService) => ({
   queryKey: ['process', id],
   queryFn: async (): Promise<Process> => {
     const process = await api.sequencer.getProcess(id)
@@ -27,7 +27,7 @@ export const getProcessQuery = (id: string, api: ReturnType<typeof useVocdoniApi
 })
 
 export const useProcessQuery = (id: string) => {
-  const api = useVocdoniApi()
+  const { api } = useVocdoniApi()
   const query = useQuery(getProcessQuery(id, api))
 
   const isAcceptingVotes = query.data?.process.isAcceptingVotes
@@ -58,7 +58,7 @@ export const useProcessQuery = (id: string) => {
  * This hook will directly return `string[]`, not the wrapped object.
  */
 export const useProcessList = () => {
-  const api = useVocdoniApi()
+  const { api } = useVocdoniApi()
 
   return useQuery<string[]>({
     queryKey: ['processList'],