Rate this page:

Flex Manager

The Flex Manager is the access point for controlling your Flex instance and all of the underlying Twilio products used for communications and assigning tasks. This means that within your Flex project, you can access the TaskRouter or Chat client directly through the Flex manager.

Aside from Flex itself, Manager also gives you access to the Programmable Chat, Sync, Client, and TaskRouter SDKs.

Members of Manager Class

Access to Twilio SDKs

These members give read-only access to the Twilio products used within Flex.

Member Description
chatClient Access the Twilio Chat SDK - equivalent to Twilio.Chat.Client
insightsClient Access the Twilio Sync SDK - equivalent to Twilio.Sync.Client. See more on how to access Flex data below.
voiceClient Access the Twilio Client (WebRTC) SDK - equivalent to Twilio.Device
workerClient Access the TaskRouter SDK - equivalent to Twilio.Taskrouter.Worker

Flex-specific members

These members give information about your specific flex instance.

Member Type Description
configuration Config Access the current Flex configuration
events FlexEventEmitter Subscribe to Flex events



Access the current Flex service configuration
store Store.<FlexState> Flex Redux store
strings Strings Access strings and templates for Flex. For more information on using Strings, see Localization and UI templating.
user UserInfo Access current user information

Supported methods

Method Description
create(config [, store]) Create an instance of Flex Manager
getInstance() Get the instance of Manager
fetchConfiguration() Fetch Flex configuration from the service
updateConfig(configs) Merge provided objects and update current configuration

How to obtain the Manager instance

You can access the manager as follows:

By calling the `getInstance` method


By calling the `create` method when initializing Flex

return Flex
  .provideLoginInfo(configuration, "#container")
  .then(() => Flex.Manager.create(configuration))
  .then(manager => {
    // use manager here
  .catch(error => handleError(error));

You can check out the sample project on how to initialize Flex.

In the init method of your plugin

init(flex, manager) {
  // use manager here

Common use cases and examples

This example logs connect in the browser’s console whenever the agent connects to a call:

Flex.Manager.getInstance().voiceClient.on('connect', () => {

By mixing calls to the Manager with the Actions Framework, you can perform more complex tasks like this example that automatically accepts all inbound chats for agents:

Flex.Manager.getInstance().workerClient.on("reservationCreated", reservation => {
  if (reservation.task.taskChannelUniqueName === 'chat' && reservation.task.direction === 'inbound') {
    Flex.Actions.invokeAction("AcceptTask", {sid: reservation.sid});
    Flex.Actions.invokeAction("SelectTask", {sid: reservation.sid});


The insightsClient provide access to the Twilio Sync SDK. For Flex accounts, this gives access to workers and tasks data through the use of two classes:

  • LiveQuery class: to query Flex data and receives pushed updates whenever new (or updated) records would match the given expression
  • InstantQuery class: to get a static snapshot of Flex data

Both classes needs two arguments:

  • Index name: data set the query is executed against. Currently supported index names for Flex are: tr-task, tr-worker, tr-reservation, tr-queue.
  • Query: this is the query used to filter the data from the index. The syntax for the query is documented here. The query can be an empty string: in this case the whole data set is returned (e.g. all workers.)

LiveQuery example

In this example, the insightsClient is used to query the workers with activity_name set to Available and subscribe to changes. That means that every time a worker change its status to Available, an event itemUpdated is fired. If a worker changes its status from Available to any other status, the itemRemoved event is fired.

  .liveQuery('tr-worker', 'data.activity_name == "Available"')
  .then(function (args) {
      'Subscribed to live data updates for worker in "Available" activity'
    args.on('itemRemoved', function (args) {
      console.log('Worker ' + args.key + ' is no longer "Available"');
    args.on('itemUpdated', function (args) {
      console.log('Worker ' + args.key + ' is now "Available"');
  .catch(function (err) {
    console.log('Error when subscribing to live updates', err);

InstantQuery example

In this example, the insightsClient is used to query the workers with specific skills inside its attributes. This returns an array of workers that can be used to provide static data.

manager.insightsClient.instantQuery('tr-worker').then((q) => {
  q.on('searchResult', (items) => {
    // Do something with the results
  });'data.attributes.languages contains "english"');
Rate this page:

Need some help?

We all do sometimes; code is hard. Get help now from our support team, or lean on the wisdom of the crowd by visiting Twilio's Stack Overflow Collective or browsing the Twilio tag on Stack Overflow.


        Thank you for your feedback!

        Please select the reason(s) for your feedback. The additional information you provide helps us improve our documentation:

        Sending your feedback...
        🎉 Thank you for your feedback!
        Something went wrong. Please try again.

        Thanks for your feedback!

        Refer us and get $10 in 3 simple steps!

        Step 1

        Get link

        Get a free personal referral link here

        Step 2

        Give $10

        Your user signs up and upgrade using link

        Step 3

        Get $10

        1,250 free SMSes
        OR 1,000 free voice mins
        OR 12,000 chats
        OR more