Widget Deployment

The Agent Assist widget is a Vue single-page application that runs inside an iframe within the agent desktop. It connects to the assist-connector-service via Socket.IO to receive real-time suggestions.

How It Works

1. The agent desktop loads the widget in an iframe with an embed token
2. The widget calls the bootstrap API to validate the token and retrieve provider configuration
3. The appropriate CCaaS provider adapter loads (Genesys, Five9, 8x8, Salesforce, Google CCaaS, or standalone)
4. The provider adapter handles authentication (OAuth PKCE, token exchange, etc.)
5. Branding and theme colors are applied from the configuration
6. A Socket.IO connection is established for real-time suggestion delivery

Embedding via Iframe

The widget is always loaded as an iframe. The embed token (t parameter) identifies the tenant and configures the widget:

<iframe
  src="https://assist.yourdomain.com/?t=EMBED_TOKEN"
  width="400"
  height="100%"
  frameborder="0"
  allow="clipboard-write"
></iframe>

The embed token is generated in the Agent Assist Portal under Settings > Widget > Embed Token.

WARNING

The widget validates its embedding origin against the allowed_origins list in the provider configuration. If the iframe is loaded from an unauthorized domain, it will display an error and refuse to initialize.

Supported CCaaS Providers

Provider	Adapter	Authentication	Send Message	Save Summary
Genesys Cloud	genesys	OAuth 2.0 PKCE	Yes (Messages API)	Yes (wrap-up notes + attributes)
Five9	five9	OAuth token exchange	No	No
8x8	8x8	Token exchange	No	No
Salesforce	salesforce	Session token + token exchange	Yes (via LWC bridge)	Yes (via LWC bridge)
Google CCAI	google_ccaas	Google OAuth	No	No
Standalone	standalone	JWT token passthrough	No	No

Genesys Cloud Deployment

For Genesys Cloud, the widget is deployed as an Interaction Widget. The iframe URL includes additional Genesys parameters:

https://assist.yourdomain.com/?t=EMBED_TOKEN&conversationId=CONVERSATION_ID&gcHostOrigin=ORIGIN&gcTargetEnv=ENV

Genesys Cloud automatically passes conversationId, gcHostOrigin, and gcTargetEnv as query parameters when the interaction widget loads.

TIP

Configure the interaction widget in Genesys Cloud Admin > Integrations > Add Integration > Interaction Widget. Set the URL to your widget deployment URL with the embed token.

Salesforce Deployment

See the Salesforce Integration Guide for step-by-step instructions.

Standalone Deployment

For non-CCaaS environments or custom agent desktops, use the standalone provider. This accepts a JWT token directly without an OAuth flow.

Widget Branding

Customize the widget's appearance to match your organization's brand. All branding settings are configured in Settings > Widget > Branding in the Agent Assist Portal.

Logo

Upload a custom logo image (PNG, JPEG, SVG, WebP, or GIF up to 2MB) or paste a URL to an externally hosted logo. The logo appears in the widget header next to the brand name.

Brand Name and Tagline

Field	Default	Description
Brand Name	OmniAssist AI	The title displayed in the widget header
Tagline	Empowering Agents, Elevating Experiences	The subtitle below the brand name

Theme Colors

Customize the widget color scheme with two color settings:

Field	Default	Description
Primary Color	#667eea	Controls the header, buttons, tabs, accents, source badges, and interactive elements throughout the widget
Gradient End Color	#764ba2	Second color for the header gradient. Leave empty to use the primary color as a solid background.

When a primary color is set, the widget automatically derives a full color palette (light tint, dark shade, accent, medium) to maintain consistent contrast across all UI elements.

TIP

Use the live preview bar in the portal to see how your brand name and colors will look together before saving.

Transcript Icons

Choose the Material Icons displayed for agent and customer messages in the transcript panel:

Agent icon options: Headset, Support Agent, Voice, Badge, Shield, Specialist, AI Bot, Person

Customer icon options: Person, Circle, Face, Happy, Group, Voice, Chat, Contact

Feature Toggles

Features are controlled per-tenant in Settings > Widget > Features:

Feature	Default	Description
knowledge_search	On	Manual knowledge base search bar in the assist panel. When off, agents only see auto-triggered suggestions.
quick_replies	On	Suggested quick reply buttons for chat/messaging conversations
follow_up_questions	On	AI-generated follow-up questions shown after an answer (voice conversations)
coaching	Off	AI coaching tab with playbook-based or generative guidance during conversations
transcript_panel	On	Live voice transcript panel. When off, the transcript column and toggle button are hidden.
summary_panel	On	Conversation summary tab with auto-refresh
analysis_panel	Off	Conversation analysis tab (sentiment, quality scores, talk time, coaching tips, compliance)
send_message	Off	Send button on suggestion cards to push text directly into the customer conversation

Send Message

When enabled, a Send button appears on each suggestion card alongside the Copy button. The Send button is only visible for digital conversations (chat, web messaging, SMS) — not voice.

How it works per provider:

• Genesys Cloud: Calls the Genesys Messages API directly using the agent's OAuth token to send the suggestion text to the customer
• Salesforce: Posts a message to the LWC bridge which uses the Salesforce Conversation Toolkit API
• Other providers: Falls back to copying text to clipboard

WARNING

Enabling send_message allows agents to push AI-generated text directly into the customer conversation with one click. Test thoroughly before enabling in production.

Save Summary

The summary panel includes a Save button that stores the conversation summary in the CCaaS platform:

Genesys Cloud:

• Updates the conversation's wrap-up notes (provisional) with the situation and action
• Stores summary fields in participant attributes (Situation, Action)
• Uses the agent's existing OAuth token — no additional configuration needed

Salesforce:

• Dispatches a custom event to the parent LWC bridge
• The bridge fires a savesummary event that a parent component can handle to update case fields

Other providers: Falls back to copying the summary to clipboard.

Socket.IO Connection Lifecycle

1. Connect: After authentication, the widget opens a Socket.IO connection, sending the JWT token for validation
2. Session binding: When a conversation starts, the socket is bound to that conversation's event stream
3. Event delivery: The backend pushes suggestion events (rag-context-event, rag-content-event, rag-complete-event)
4. Feedback: The widget sends feedback events back via the same socket
5. Reconnection: If the connection drops, the widget automatically reconnects and re-binds

Next Steps

• Tenant Configuration — Configure AI settings, classifier, and caching
• CCaaS Integration — Set up the connection to your contact center platform
• Agent Getting Started — Learn how agents interact with the widget