Nuvion IQ

Frontend Integration Guide

AI-PoweredFrontend Integration

Nuvion IQVisual Guide

An interactive visualization of the Nuvion IQ conversational AI interface. Understand the architecture, session lifecycle, and implementation patterns before diving into the full documentation.

3

Endpoints

2

Contexts

240chars

Max Message

01

Architecture Flow

Click on each component to explore its role in the Nuvion IQ system. Data flows through these components and back to deliver a seamless conversational experience.

Data flows back through the same path
02

Session Lifecycle

Watch the complete lifecycle of an IQ session from user message to API execution. Use the controls to step through or auto-play the flow.

Step 1 of 8

User sends message

active

Creates or updates IQ session

2

Session marked 'processing'

Prevents duplicate messages

3

Message sent to LLM

With context (actions, fields)

4

LLM responds

Asks for missing information

5

Session marked 'active'

Ready for next user message

6

When complete โ†’ 'ready'

Session has API payload

7

Frontend calls target API

Using the generated payload

8

Result displayed

To user in friendly format

03

Conversation Simulator

Experience a realistic IQ conversation flow. Click "Send Next Message" to step through a send-money conversation and see how the AI collects required information.

Nuvion IQ

active

Click "Send Next Message" to start the conversation

Session Status

active

Ready for user input

Collected Data

No data collected yet

04

API Endpoints

Explore the three main endpoints for interacting with Nuvion IQ sessions. All endpoints require JWT authentication.

Create IQ Session

Creates a new conversational session or continues an existing one

POST/iq-sessions

Request

{
  "session_reference": "01JEF8XYZ123456789ABCDEF_1733750400000",
  "message": "I want to send money to John",
  "context_code": "send-money"
}

Response

200 OK
{
  "status": 200,
  "message": "IQ session created successfully",
  "data": {
    "id": "01JEF8XYZ123456789ABCDEF",
    "session_reference": "01JEF8XYZ123456789ABCDEF_1733750400000",
    "messages": [
      {
        "sender": "user",
        "text": "I want to send money to John"
      },
      {
        "sender": "system",
        "text": "I'd be happy to help you send money!..."
      }
    ],
    "status": "active"
  }
}

Auth Required: Authorization: Bearer <jwt_token>

05

Session Status States

Understanding session states is crucial for building a responsive UI. Each state requires different handling in your frontend implementation.

active
processing
ready

active

Green dot

Ready for next user message

Action: Allow user to type/send messages

processing

Animated dots

AI is thinking/responding

Action: Show loading indicator, disable input

ready

Action button

Payload ready for API call

Action: Extract payload, call target API

closed

Gray badge

Session ended by user

Action: Show session ended message

Status Check Implementation

// Check session status and handle accordingly
if (session.status === 'processing') {
  showLoadingIndicator();
  disableInput();
} else if (session.status === 'ready' && session.context.data.ready) {
  const { endpoint, method, payload } = session.context.data;
  await executeAPICall(endpoint, method, payload);
} else if (session.status === 'active') {
  enableInput();
  hideLoadingIndicator();
}
06

Available Contexts

Nuvion IQ currently supports two action contexts. Each context defines what information the AI will collect and which API endpoint to call when complete.

Help users initiate bank transfers or mobile money payments

Required Fields

amountTransfer amount (number)
currencyUSD, EUR, GHS
narrationPurpose/description
account_idSource account ID
unique_referenceUnique payment reference
counterparty_id OR nuvion_banRecipient identifier

Optional Fields

metadataAdditional information
supporting_documentsDocument attachments

Example Conversation Flow

Send money to John
How much would you like to send and in what currency?
500 USD
Who is the recipient? Counterparty ID or Nuvion BAN?
Counterparty ID 01JEF8ABC...
What's this payment for?
Consulting services
Which account to send from?
01JEF8XYZ...
Ready to initiate! Should I proceed?