Description of icon
Flex UI
API Reference

Notifications

Predefined Flex UI notifications

OutboundCallCanceledGeneric#

Warning notification shown when outbound call fails. It renders with an action to redial the outbound call. It uses Strings.OutboundCallFailedNotificationTitle.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.OutboundCallCanceledGeneric);

OutboundCallCanceledBusy#

Warning notification shown when outbound call fails due to other party being busy. It renders with an action to redial the outbound call. It uses Strings.OutboundCallFailedNotificationTitleBus.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.OutboundCallCanceledBusy);

OutboundCallCanceledNoAnswer#

Warning notification shown when outbound call fails due to other party not answering. It renders with an action to redial the outbound call. It uses Strings.OutboundCallFailedNotificationTitleNoAnswer

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.OutboundCallCanceledNoAnswer);

OutboundCallCanceledInvalidNumber#

Warning notification shown when outbound call fails due to invalid number being called. It uses Strings.OutboundCallFailedNotificationTitleInvalidNumber.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.OutboundCallCanceledInvalidNumber);

OutboundCallCanceledDisabledCountry#

Warning notification shown when outbound call fails due to calls to that country not being enabled. It uses Strings.OutboundCallFailedNotificationTitleDisabledCountry.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.OutboundCallCanceledDisabledCountry);

OutboundCallCanceledFromNumberUnverified#

Warning notification shown when outbound call fails due to the 'from' number not being verfied for the account. It uses Strings.OutboundCallFailedNotificationTitleFromNumberUnverified.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.OutboundCallCanceledFromNumberUnverified);

OutboundCallCanceledToNumberBlocked#

Warning notification shown when outbound call fails due to the 'to' number blocked by twilio. It uses Strings.OutboundCallFailedNotificationTitleToNumberBlocked.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.OutboundCallCanceledToNumberBlocked);

noInputDevice#

Error Notification shown when there are no audio input devices It renders Strings.InputDeviceErrorNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.NoInputDevice);

BrowserVoiceDisabled#

Error notification shown when an agent receives a phone call but Twilio Voice SDK has been disabled. It renders Strings.BrowserVoiceDisabledNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.browserVoiceDisabled);

MicTaken#

Error notification shown when the microphone is not available in a call. It renders Strings.MicNotAvailableNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.MicTaken);

AudioPlayerDeniedErrorNotificationId#

Error Notification shown when an audio cannot be played because of missing permissions. It renders Strings.AudioPlayerDeniedError.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.AudioPlayerDeniedErrorNotificationId);

AudioPlayerInvalidMediaErrorNotificationId#

Error notification shown when an audio cannot be played because of an invalid media is provided. It renders Strings.AudioPlayerInvalidMediaError.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.AudioPlayerInvalidMediaErrorNotificationId);

AudioPlayerGenericErrorNotificationId#

Error notification shown when an audio cannot played for non specified reasons. It renders Strings.AudioPlayerGenericError.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.AudioPlayerGenericErrorNotificationId);

DeviceManagerSelectionSuccess#

Success notification shown when a user selects an audio device as the default device for voice calls. It renders Strings.DeviceManagerSetDeviceSuccess.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.DeviceManagerSelectionSuccess);

DeviceManagerSelectionFailed#

Error notification shown when an audio device cannot be made the default voice call device for non specified reasons. It renders Strings.DeviceManagerSetDeviceError.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.DeviceManagerSelectionFailed);

MessageSizeExceeded#

Error notification shown when trying to submit a chat message that exceeds its characters limit. It renders Strings.MessageSizeExceeded.

Properties:

  • payload: object

    Payload object.

    • currentCharCount: number - Number of characters currently in MessageInput.
    • maxCharCount: number - Max number of characters allowed in the MessageInput for this specific channel.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.messageSizeExceeded, {
currentCharCount: bodyTextLength,
maxCharCount: charLimit
});

ChatOrchestrationAddToConversationFailed#

Error notification shown when worker fails to join a new conversation (chat orchestration) It renders Strings.ChatOrchestrationAddToConversationFailed.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.ChatOrchestrationAddToConversationFailed);

ChatOrchestrationDeactivateConversationFailed#

Error notification shown when an error occurs while deactivating a conversation (chat orchestration) It renders Strings.ChatOrchestrationDeactivateConversationFailed.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.ChatOrchestrationDeactivateConversationFailed);

ChatOrchestrationLeaveConversationFailed#

Error notification shown when an error occurs while leaving a conversation (chat orchestration) It renders Strings.ChatOrchestrationLeaveConversationFailed.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.ChatOrchestrationLeaveConversationFailed);

FlexUiVersionDeprecated#

Warning notification shown when the current version of Flex is deprecated. It renders Strings.UiVersionDeprecated.

Properties:

  • payload: object

    Payload object.

    • message: string - Actual error message.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.AudioPlayerGenericErrorNotificationId, {
message: "error message"
});

FlexSessionExpired#

Warning notification shown when a worker's token expires. It renders Strings.SessionExpired.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.FlexSessionExpired);

RequestBrowserNotificationPermissions#

Warning Notification for asking for browser notification rights. It renders Strings.RequestBrowserNotificationPermissions.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.RequestBrowserNotificationPermissions);

NoNetworkConnection#

Warning Notification shown when there is no network connection. It renders Strings.ReconnectingConnection.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.NoNetworkConnection);

DegradedModeActive#

Warning Notification shown when flex is degraded. It renders Strings.DegradedWarning.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.DegradedModeActive);

BackupServiceActive#

Warning Notification shown when Flex is running on a backup server. It renders Strings.BackupServiceText.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.BackupServiceActive);

ShortcutUsedTooRecentlyNotificationTitle#

Warning notification shown when a shortcut is fired too quickly in succession. It renders Strings.ShortcutUsedTooRecentlyNotificationTitle.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.ShortcutUsedTooRecentlyNotificationTitle);

TooManyParticipantsForShortcutNotificationTitle#

Warning notification shown when a user tries to use the hold shortcut if there are more than two participants in a call. It renders Strings.TooManyParticipantsForShortcutNotificationTitle.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.TooManyParticipantsForShortcutNotificationTitle);

SelectATaskNotificationTitle#

Warning notification shown when End Selected Task shortcut is used with no task selected. It renders Strings.SelectATaskNotificationTitle.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.SelectATaskNotificationTitle);

LocaleSelectorSuccess#

Success notification shown when a user selects a locale. It renders Strings.LocaleSelectorSetLocaleSuccess.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.LocaleSelectorSuccess);

LocaleSelectorFailure#

Failure notification shown when changing locale fails It renders Strings.LocaleSelectorSetLocaleFailure.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.LocaleSelectorFailure);

CdpDegradation#

Warning notification shown when CDP is degraded. It renders Strings.CdpDegradationNotificationBanner.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.CdpDegradation);

AddingCommentFailed#

Error notification shown when adding a comment in the conversation screen fails. It renders Strings.AddingCommentFailed.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.AddingCommentFailed);

AddingAssessmentFailed#

Error notification shown when adding an assessment in the conversation screen fails. It renders Strings.AddingAssessmentFailed.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.AddingAssessmentFailed);

GlobalSLSaveSuccess#

Notification shown when SL global metrics have been saved successfully. It renders Strings.GlobalSLSuccessNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.GlobalSLSaveSuccess);

SLAPreferencesCustomLevelsSuccess#

Notification shown when custom service levels for a queue have been saved successfully. It renders Strings.SLAPreferencesCustomLevelsSuccessNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.SLAPreferencesCustomLevelsSuccess);

SLAPreferencesCustomLevelsError#

Notification shown when SL global metrics have failed to be saved successfully It renders Strings.SLAPreferencesCustomLevelsError.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.SLAPreferencesCustomLevelsError);

FailedToSubscribeToQueueError#

Notification shown when failed to subscribe to a selected queue It renders Strings.FailedToSubscribeToQueueError.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.SLAPreferencesCustomLevelsError);

MonitoringFailed#

Error notification shown when an error occurs while starting monitoring a task. It renders Strings.MonitoringFailedNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.MonitoringFailed);

ExternalWarmTransferFailed#

Notification shown when External Warm Transfer fails. It renders Strings.ExternalWarmTransferFailed.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.ExternalWarmTransferFailed);

FailedToFetchParticipants#

Notification shown when failing to fetch interaction participants. It renders Strings.FailedToFetchParticipants.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.FailedToFetchParticipants);

PendingReservationsOnLogout#

Error Notification shown when agents try to logout while having a pending reservation. It renders Strings.PendingReservationsOnLogoutNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.PendingReservationsOnLogout);

PendingReservationsOnActivityStateChange#

Error notification shown when agents try to change activity state while having a pending reservation. It renders Strings.PendingReservationsOnActivityStateChangeNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.activityCannotBeChangedWhenPendingTasks);

WorkerActivityUpdateFailed#

Error notification shown when agents fails to change activity state due to a service error. It renders Strings.WorkerActivityUpdateFailedNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.WorkerActivityUpdateFailed);

SupervisorNotAuthorizedFailure#

Error notification shown when supervisor fails to change agent activity state because supervisor is not authorized to do so. It renders Strings.SupervisorNotAuthorizedFailedNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.SupervisorNotAuthorizedFailure);

TransferFailed#

Error notification shown when a call transfer fails. It renders Strings.TransferFailedNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.TransferFailed, { reason: "failed reason"});

taskCannotBeTransferred#

Error notification shown when a task cannot be transferred. It renders Strings.TaskCannotBeTransferredNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.TaskCannotBeTransferred);

IncomingTask#

Notification for incoming task, with most properties dependent on task channel in question.

Properties:

  • payload: object

    Payload object.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.IncomingTask, { task: taskObject });

CannotChangeOtherWorkerActivity#

Error notification shown when supervisor tries to change activity state of an agent with a pending reservation. It renders Strings.CannotChangeOtherWorkerActivity.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.CannotChangeOtherWorkerActivity);

StartOutboundEmailTaskFailed#

Error notification shown when an outbound email task fails. It renders Strings.StartOutboundEmailTaskFailedNotification.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.StartOutboundEmailTaskFailed, { reason: "failed reason"});

LeaveEmailConversationFailed#

Error notification shown when there is an error while leaving email conversation. It renders Strings.LeaveEmailConversationFailed.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.LeaveEmailConversationFailed);

PauseEmailConversationFailed#

Error notification shown when there is an error while pausing an email conversation. It renders Strings.PauseEmailConversationFailed.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.PauseEmailConversationFailed);

ResumeEmailConversationFailed#

Error notification shown when there is an error while resuming a paused email conversation. It renders Strings.ResumeEmailConversationFailed.

Example:

import { Notifications, NotificationIds } from "@twilio/flex-ui";
Notifications.showNotification(NotificationIds.ResumeEmailConversationFailed);

NewChatMessage#

Notification shown when new chat message is received It renders title as Strings.NewChatMessageNotificationTitle and body as Strings.NewChatMessageNotificationBody.

Properties:

  • payload: object

    payload object

    • lastMessage: ChatChannelState.MessageState - last message object

Example:

import { Notifications, NotificationIds, StateHelper, ChatChannelHelper } from "@twilio/flex-ui";
const channelState = StateHelper.getChatChannelStateForTask(task);
const chatChannelHelper = new ChatChannelHelper(channelState);
Notifications.showNotification(NotificationIds.NewChatMessage, {
lastMessage: chatChannelHelper.lastMessage
});

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.