Description of icon
Flex UI
API Reference

SideNav

This is a container for SideNav. Can be themed with Theme.SideNav in Theme.


Component children#

KeyComponentConditionAlignDescription
agent-desktopReact component
start
Agent desktop view side link. Displays a SideLink component with the Agent icon and AgentBold icon when active
supervisor-desktopReact component
start
Supervisor desktop view side link. Displays a SideLink component with the Data icon and DataBold icon when active
teamsReact component
Visible only if user is supervisor or admin
start
Teams view side link. Displays a SideLink component with the Agents icon and AgentsBold icon when active
queues-statsReact component
Visible only if user is supervisor or admin
start
Queues stats side link. Displays a SideLink component with the Queues icon and QueuesBold icon when active
dashboardsReact component
Visible only if user has insights enabled
start
Dashboards side link. Displays a SideLink component with the Dashboards icon and DashboardsBold icon when active
analyzeReact component
Visible only if user has insights enabled
start
Analyze side link. Displays a SideLink component with the Analyze icon and AnalyzeBold icon when active
quality-managementReact component
Visible only if user has insights enabled
start
Quality management/questionnaires side link. Displays a SideLink component with the Questionnaires icon and QuestionnairesBold icon when active
inspectionsReact component
Visible only if user has insights enabled
start
Inspections side link. Displays a SideLink component with the Inspections icon and InspectionsBold icon when active
agentsReact component
Visible only if user has insights enabled
start
Agents side link. Displays a SideLink component with the AgentsView icon and AgentsViewBold icon when active
speech-searchesReact component
Visible only if user has insights enabled
start
Speech searches side link. Displays a SideLink component with the SpeechSearches icon and SpeechSearchesBold icon when active

Static Properties#

NameTypeDescription
defaultPropsSideNavProps

Default properties

ContentDynamicContentStore<SideNav.SideNavChildrenProps, SideNavChildrenKeys>

Dynamic content store

AgentDesktopSideLinkAgentDesktop

Agent desktop view link component

TeamsSideLinkTeams

Teams view link component

QueuesStatsSideLinkQueuesStats

Queues stats view link component

QualityManagementSideLinkInsightsQualityManagement

Quality Management view link component

DashboardsSideLinkInsightsDashboards

Dashboards view link component

AnalyzeSideLinkInsightsAnalyze

Analyze view link component

Component Properties#

NameTypeDescriptionOptionalDefault
reserveSpaceboolean

Whether the SideNav is shown in compact mode.

Yes
childrenDynamicComponentChildren<SideNavChildrenProps>

children

Yes

Component Children Properties#

NameTypeDescriptionOptionalDefault
incomingTasksboolean

Whether there are incoming tasks or not. If there are, the SideNav shows an indicator in the agent-desktop icon.

Yes
isOpenboolean

Whether the Sidebar is open or not.

Yes
activeViewstring

Represents the current active view.

Yes
reserveSpaceboolean

Whether the SideNav is shown in compact mode.

Yes
childrenDynamicComponentChildren<SideNavChildrenProps>

children

Yes
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.