Project Story: agentVooc-stark-zk-chipi

Inspiration

The agentVooc-stark-zk-chipi project was inspired by the need to democratize access to Web3 financial tools through a conversational AI interface. The scalability of Starknet, a Layer 2 solution for Ethereum, with its low-cost transactions and support for zero-knowledge proofs (zk), motivated us to create a seamless wallet creation experience. The Chipi Pay SDK's robust integration with Starknet inspired us to build a plugin that enables users to interact with blockchain technology using natural language commands like "create a chipi wallet." Our vision was to make cryptocurrency accessible to non-technical users while laying the groundwork for privacy-preserving features using zk proofs, such as ensuring transaction validity without revealing sensitive data, expressed as:

zkProof formula

What it does

The agentVooc-stark-zk-chipi project enables users to create and manage Chipi wallets on the Starknet blockchain via the agentVooc conversational platform. Key features include:

  • Wallet Creation: Users initiate wallet creation with commands like "create a chipi wallet," triggering a secure PIN entry dialog.
  • PIN Confirmation: A two-step process requires users to confirm their intent and enter a 4-digit PIN, ensuring security.
  • Chipi Pay SDK Integration: The plugin uses the Chipi SDK to create and retrieve wallets, interfacing with Starknet.
  • Sanity Storage: Wallets are stored in a Sanity database, linking publicKey and txHash to the user's character ID.
  • Browser-Only Rendering: The CreateWallet component is dynamically rendered in the browser, avoiding server-side issues.
  • zk Readiness: A placeholder for zero-knowledge proof generation prepares the plugin for future privacy features, such as making a transaction or a transfer without disclosing the chipi invisble wallet account.

zkProof formula

The agent guides users conversationally, e.g., "Please enter your 4-digit PIN in the dialog to create your Chipi wallet," and confirms success with transaction details.

How we built it

We developed the project as a plugin for the agentVooc platform using TypeScript, React, Node, Express and the Chipi Pay SDK. The technical implementation includes:

  • Plugin Structure (index.ts):

    • Defined the chipiPlugin with actions (createChipiWalletAction), a client (ChipiClientInterface), and the CreateWallet component.
    • Integrated with IAgentRuntime for message handling and state management.
  • Wallet Creation Action (createChipiWalletAction.ts):

    • Handles intents like "create a chipi wallet," "confirm chipi wallet creation," and "cancel chipi wallet creation."
    • Uses Sanity to check for existing wallets and store new ones with publicKey and txHash.
    • Triggers PIN entry with promptPin: true metadata when the user confirms wallet creation.
  • ChipiPayClient (chipiPayClient.ts):

    • Initializes the Chipi SDK in the browser (isClient check) using dynamic imports for @chipi-stack/chipi-react.
    • Provides createWallet and getWallet methods, integrating with Clerk for authentication tokens.
  • CreateWallet Component (createWallet.tsx):

    • A React component dynamically imported to render a PIN entry dialog in the browser.
    • Uses ChipiPayClient.createWallet to create wallets, validating a 4-digit PIN and displaying publicKey and txHash on success.
  • Frontend Integration (MainChatComponent.tsx):

    • Dynamically imports CreateWallet and renders it when the agent responds with promptPin: true.
    • Initializes ChipiPayClient via ChipiClientInterface.start and handles success/cancellation notifications to the agent.
  • Sanity Integration:

    • Stores wallets in Sanity using a Wallet document type, ensuring idempotency with createIfNotExists.

The system ensures type safety with TypeScript interfaces (e.g., WalletMetadata) and logs events with elizaLogger. Wallet creation can be modeled as a state transition:

state transition

Challenges we ran into

  • Browser-Only Execution: Ensuring CreateWallet and Chipi SDK operations ran only in the browser was challenging due to agentVooc's Node.js runtime. We used dynamic imports and isClient checks to resolve this.
  • Agent-Frontend Coordination: Synchronizing the agent’s conversational flow with the frontend dialog required precise message handling. We used promptPin: true metadata to trigger the dialog reliably.
  • Clerk Authentication: Asynchronous token retrieval with Clerk (getToken) introduced complexity. We implemented robust error handling for missing tokens.
  • Sanity Data Consistency: Ensuring wallets were stored in Sanity only after successful Chipi SDK operations required careful validation of txHash and publicKey.
  • Dynamic Import Performance: Dynamic imports caused slight rendering delays. We mitigated this by preloading the component, but further optimization is needed.
  • zk Proof Placeholder: Defining the generateProof interface without a concrete zk library was challenging, as we needed to anticipate future integration requirements.

Accomplishments that we're proud of

  • Conversational UX: Created a seamless experience where users can create wallets via natural language, lowering the barrier to Web3 adoption.
  • Browser-Safe Rendering: Achieved browser-only execution of CreateWallet and Chipi SDK operations using dynamic imports.
  • Chipi SDK Integration: Successfully integrated the Chipi Pay SDK with robust error handling and Clerk authentication.
  • Sanity Storage: Implemented reliable wallet storage in Sanity with idempotency, ensuring data integrity.
  • zk Readiness: Laid the foundation for zero-knowledge proofs, preparing for privacy-preserving features like:

zk verify

  • Type Safety: Used TypeScript to enforce strict interfaces, reducing runtime errors and improving maintainability.

What we learned

  • Dynamic Imports: Mastered dynamic imports in React to ensure browser-only component loading, critical for server-client separation.
  • Blockchain SDKs: Gained expertise in integrating the Chipi Pay SDK with Starknet, handling asynchronous authentication and wallet operations.
  • Conversational AI: Learned to design agent workflows that trigger UI components using metadata, ensuring smooth user interactions.
  • Sanity CMS: Deepened knowledge of Sanity for storing blockchain data, including reference-based documents and idempotent operations.
  • Error Handling: Improved skills in managing errors across client, server, and third-party SDKs, ensuring user-friendly feedback.
  • zk Proof Potential: Recognized the power of zero-knowledge proofs for privacy and scalability, motivating further study of Starknet’s zk capabilities.

What's next for agentVooc-stark-zk-chipi

  • zk Proof Implementation: Integrate a zk library (e.g., plugin-zKproof) to implement generateProof for private wallet creation and transactions:

zkProof

  • Expanded Wallet Actions: Enable commented-out actions like transferUSDCAction, stakeVesuUsdcAction, and withdrawVesuUsdcAction for full wallet functionality.
  • UI/UX Enhancements: Add modal backdrops, loading spinners, and toast notifications to CreateWallet, and optimize dynamic import performance.
  • Multi-Chain Support: Explore integrating other blockchains with Chipi Pay for broader compatibility.
  • Voice Mode: Leverage agentVooc’s voice capabilities (inspired by Grok 3’s voice mode) for voice-driven PIN entry and wallet creation.
  • Security: Implement client-side PIN encryption and audit Clerk token handling for enhanced security.
  • Analytics: Add telemetry to monitor wallet creation success rates and errors, improving debugging and UX.

The agentVooc-stark-zk-chipi plugin is a stepping stone toward a conversational, privacy-focused Web3 platform, and we’re excited to continue pushing the boundaries of accessibility and security!

Share this project:

Updates