Demo App

Reference browser implementation of wallet-connected FlowVault flows, including user-state refresh and transaction feedback.

Purpose

The demo app proves production-like wallet behavior: users sign transactions in-wallet while SDK handles argument building, validation, and response normalization.

It also acts as an integration baseline to validate updates in wallet adapters, contract names, or SDK releases.

User Flow

  1. Connect wallet and resolve STX sender address.
  2. Set routing rules (lock and split).
  3. Deposit USDCx with wallet signature.
  4. Read vault state for balances and active rules.
  5. Withdraw unlocked funds.

UI Responsibilities

  • Display active network and contract principal pair.
  • Prevent submits while wallet request is in-flight.
  • Show transaction ids and links to explorer for every write.
  • Refresh vault state after each successful confirmation.
  • Render locked and unlocked balances with micro-unit precision.

SDK Integration

const flowVault = new FlowVault({
  network,
  contractAddress,
  contractName,
  tokenContractAddress,
  tokenContractName,
  senderAddress: walletAddress,
  contractCallExecutor: async (call) => request("stx_callContract", {
    contract: call.contractAddress + "." + call.contractName,
    functionName: call.functionName,
    functionArgs: call.functionArgs,
    network: call.network,
    postConditionMode: "allow",
    postConditions: call.postConditions,
  }),
});

Validation Rules

  • Wallet address must be STX format (not BTC tb1 format).
  • lockUntilBlock must resolve to a future chain block when lockAmount > 0.
  • splitAddress is required when splitAmount > 0.