Description of icon
Flex UI
API Reference

Configuration

Flex UI's configuration allows you to control the way the overall app loads, as well as the behavior of individual Flex Components. In the configuration object, you can define the default properties of your Flex Components. You can also configure properties that are not tied to specific Components.


Properties:

  • language?: string

    language code, not used

  • logLevel?: "silent" | "error" | "warning" | "info" | "debug" | "trace"

    level for logger

    Default Value:

    "error"

  • theme?: ThemeConfigProps

    theme configuration

    • isLight?: boolean - Represents whether light or dark theme should be used
    • tokens?: DeepPartial<Tokens> - Paste tokens. For more on each token information, please refer to Twilio Paste
    • componentThemeOverrides?: Theme - Object containing styles of the component which is to be overridden. See Theme Interface
  • sdkOptions?: SDKOptions

    SDK options

    • worker?: WorkerOptions - options to pass to TaskRouter Worker SDK. See
    • chat?: ConversationsOptions - options to pass to Chat SDK. See
    • voice?: VoiceOptions - options to pass to Voice SDK. See
      • acceptOptions?: Call.AcceptOptions - options to be passed in call.accept(). See
      • audioConstraints?: MediaTrackConstraints - options to be passed in device.audio.setAudioConstraints(). See
      • codecPreferences?: Array<string> - codec names to be passed in device.options.codecPreferences. These can optionally use the Device.Codec type values from @twilio/voice-sdk.
      • sounds?: Record<string, string> - sounds names to be passed in device.options.sounds. These can optionally use the Call.Sounds type values from @twilio/voice-sdk for the object keys.
    • insights?: object - options to pass to Sync SDK. See
    • flex?: DeepPartial<ClientOptions> - to pass to Flex SDK.
  • sso?: SSOConfiguration

    SSO configuration

    • accountSid?: string - account SID
    • idpUrl?: string - idpUrl
    • loginPopup?: boolean - whether to launch IdP login in a new window

      Default Value:

      false

    • loginPopupFeatures?: string - standard window.open() features param to be applied to popup window
    • products?: Array<string> - array of products
    • redirectUrl?: string - redirect url where to return back from identity provider to log in to Flex

      Default Value:

      window.location.href

    • tokenRefreshThresholdMs?: number - token refresh threshold in ms
  • oauth?: OAuthConfiguration

    OAuth2.0 configuration. Will only be available if account flag is on

  • pluginService?: PluginService

    PluginService configuration

    • enabled?: boolean - Whether the plugin service is enabled or not
  • componentProps?: object

    Props to be set for React components. Key of the object is component name. e.g. { AgentDesktopView: { showPanel2: false } }

  • router?: object

    Router configuration

    • type?: "browser" | "memory" - type of the router
    • history?: object - history object to use for routing
    • isolate?: boolean - whether to isolate Flex routing from other routing. Makes Flex to use memory router.
  • disableBrowserVoice?: boolean

    whether to disable Twilio Voice SDK instantiation

  • initialDeviceCheck?: boolean

    Whether to conduct an initial audio device check

  • rejectPendingReservations?: boolean

    whether to reject all pending reservations if user goes to an offline activity

  • insights?: object

    insights configuration object

  • enableClientCalling?: boolean

    Whether to enable client calling

  • fileAttachment?: FileAttachmentConfig

    File attachment configuration

    • enabled?: boolean - Represents if file attachments are supported.

      Default Value:

      true

    • numberOfAttachments?: number - Maximum number of file attachments supported per message.

      Default Value:

      1

    • maxFileSize?: number - Maximum file size that can be uploaded. Enter a value in bytes. Default is 10mb

      Default Value:

      10485760

    • maxFileSizeTotal?: number - Maximum total file attachments size that can be uploaded per message. Enter a value in bytes.
    • acceptedExtensions?: Array<string> - Allowed file extensions to be uploaded.

      Default Value:

      ["jpg", "jpeg", "png", "gif", "txt", "pdf"]

    • readOnly?: boolean - Represents if file attachment is read only

      Default Value:

      false

  • holdMusicUrl?: string

    url for audio file to play when call is on hold

  • holdMusicMethod?: string

    holdMusicMethod

  • locations?: Array<LocationConfig>

    array of LocationConfig objects

    • name: string - region name
    • edge: Array<string> | string - array of edge names or edge name
  • disableTelemetry?: boolean

    whether to disable telemetry

  • enableReduxLogging?: boolean

    whether to enable redux logging

  • markdown?: object

    markdown configuration

  • notifications?: object

    Notification configuration

  • outboundSettings?: OutboundConfig

    Outbound configuration

    • email: object - Configuration object for outbound email
      • defaultAddress.address_metadata.from_name: string - The sender name
      • defaultAddress.coordinates.address: string - The senders email address
      • defaultSettings.workflow_sid: string - Sid of the workflow to use for task assignment
      • defaultAddress.queue_sid: string - Sid of the queue to use for task assignment
  • channelConfig?: Array<ChannelConfig>

    array of channel configurations

    • addressType: string - Channel type
    • cbmAttachments: object - Configuration object for cbm attachment settings
      • enabled: boolean - Whether attachments are enabled
      • numberOfAttachments: number - Maximum number of attachments allowed
      • maxFileSize: number - Maximum allowed file size in bytes
      • maxTotalFileSize: number - Limit in bytes for the cumulative size of all attachments
      • acceptedExtensions: Array<string> - Array of allowed file extensions
  • flexUiStatusReport?: FlexUiStatusReport

    configuration of UI display of status report

  • debuggerIntegration?: DebuggerIntegration

    configuration of debugger integration

  • isEmailChannelEnabled?: boolean

    whether email channel is enabled

  • citrixVoiceVdi?: citrixVoiceVdi

    configuration of Enable Voice on Citrix VDI

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.