Skip to main content

Flow Submission Page

Flow Submission Page

for integrators.

You can also encode a flow directly into the page using a flowInput object. This is useful for static flows—just include the flowInput in your frontend code or page build, and the system will handle it when the page is loaded. It’s a clean way to preload flows without runtime API calls.

let users sign up for alerts, return flow, redirect back to your site. all possible. Supports custom theme via logo and colors.

https://portal.intento.zone/submit?

What the /submit page expects in the URL:

  • flowInput: your flow data as JSON, but URL-encoded (like replacing spaces and special chars with % codes).

  • Other params:

    • imageUrl — a link to an image
    • chain — the blockchain ID
    • bgColor — background color in hex (like #123abc)
    • theme — either light or nothing

What you do:

  1. Turn your flow input (the object) into JSON.
  2. URL-encode that JSON.
  3. Add it as flowInput=... in the URL.
  4. Add other params normally.
  5. The page will decode everything and use it.

No need to worry about decoding — just send URL-encoded JSON for flowInput and plain strings for the rest. The page handles the rest.

The FlowInput Structure

FlowInput defines the parameters required for setting up and executing an Intento Flow. This object gets encoded to proto before being sent to the Intento blockchain. Here's the breakdown of each field and what it controls:

Core Fields:

  • label?: string Optional. A human-readable label for identifying the flow. Think of this as metadata for users or systems.

  • msgs: string[] Required. An array of encoded Cosmos SDK messages (likely base64-encoded Any messages). These are the core actions your flow will execute.

    In the messages you can use the Your Address placeholder for dynamic address insertion. And with the ICA_ADDR placeholder the chain will insert the address of the Interchain account for the flow execution.

Time Control:

  • duration: number Required. Total duration of the flow in seconds. Defines how long the flow will remain active or how long the streaming (DCA) will take.

  • interval?: number Optional. Interval in seconds for repeating the flow. If set, the system will trigger execution every interval seconds until the duration is over. If unset, flow executes once.

  • startTime?: number Optional. Unix timestamp (in seconds) for when the flow should start. If unset, the flow starts immediately.

Execution Control:

  • feeFunds?: Coin Optional. A Coin object specifying extra funds to cover fees, e.g. { denom: 'uatom', amount: '10000' }.

  • configuration?: ExecutionConfiguration Optional. Configs like gas limits, memo, or execution flags. Imported from intentojs.

  • conditions?: ExecutionConditions Optional. Conditions that must be met before the flow executes. For example, chain state conditions like a minimum block height or price threshold.

  • hostedIcaConfig?: HostedICAConfig Optional. Configurations for Hosted Interchain Accounts, like the target chain, controller address, or permissions. Imported from intentojs.

  • icaAddressForAuthZ?: string Optional. If using Authz-based flows, this specifies the address holding authorization rights (likely an ICA address).

  • connectionId?: string Optional. The IBC connection ID for flows involving IBC transfers. If not set, defaults may be used.

  • hostConnectionId?: string Optional. Similar to connectionId, but specifically for hosted flows.

Alerting & Notifications:

  • email?: string Optional. Email address to send flow status notifications to (e.g., flow started, completed, or errored).

  • alertType?: string Optional. Type of alert (e.g., all, error).


Example Use Case: A Streaming Flow

Say you want to stream tokens to Osmosis over 24 hours, with actions executed every 30 minutes. You'd configure your FlowInput like this:

const flow: FlowInput = {
label: 'Stream ATOM to OSMO',
msgs: [ /* encoded IBC transfer messages here */ ],
duration: 86400, // 24 hours in seconds
interval: 1800, // Every 30 minutes
feeFunds: { denom: 'uatom', amount: '5000' },
configuration: { /* custom gas/memo settings */ },
email: '[email protected]',
}

Handling Responses

After submission, the page will handle the flow creation process and display appropriate success/error messages to the user. The page will automatically handle:

  • Wallet connection (if not already connected)
  • Transaction signing
  • Error handling and user feedback
  • Loading states

Best Practices

  1. Always URL-encode parameters: Use encodeURIComponent() for any dynamic values
  2. Keep URLs short: For complex flows, use the flow parameter with base64-encoded JSON
  3. Handle errors gracefully: The page will show appropriate error messages, but your integration should also handle navigation failures
  4. Test thoroughly: Test all URL parameters in both development and production environments
  5. Respect user preferences: Allow users to override any default theme settings

Troubleshooting

  • For theme-related issues, check the browser's console for any errors from the theme controller
  • If pre-filled data isn't loading, verify that the JSON structure matches the expected FlowInput type

Examples

Autocompounding Cosmos ATOM Flow

CosmWasm DCA Flow