Implementing a Grid UI with Interactive Buttons in Amazon Connect Agent Workspace



I'm currently working on customizing the Agent Workspace in Amazon Connect and need some guidance on creating a grid-like user interface. My goal is to display data in a tabular format similar to the one below, where each row ends with a button. When this button is clicked, I want to capture the action and trigger a transfer to another flow block.

Here is the layout I am aiming for:

First NameLast NameAction
JohnDoeClick Button
JaneDoeClick Button

I understand that the List component in Amazon Connect Views can be used for similar purposes but it doesn't seem suitable for representing tabular data. I tried to use HTML Box component but the problem with that component is that I cannot capture Button Click; clicking button does not do anything. Is there a way to create a grid with buttons that can capture user interactions and connect to different parts of a flow? Any suggestions or examples would be greatly appreciated!

Thank you in advance for your help!

asked 2 months ago360 views
1 Answer

This sounds like you want to (effectively) create a custom page that still has access to the data from the incoming events. Probably the easiest way to accomplish this today would be to build a standard HTML page and use normal JS to trigger your actions, call APIs, etc. Then integrate the page into Agent Workspace using the Third-Party apps feature. There is also a section in the Agent Empowerment Suite workshop that can help you get started. This will giver you the most control over the UI.

profile pictureAWS
answered 20 days ago

You are not logged in. Log in to post an answer.

A good answer clearly answers the question and provides constructive feedback and encourages professional growth in the question asker.

Guidelines for Answering Questions