getAvailablePanels

Returns the panels the SDK can currently show, in tab order.

Overview

Use getAvailablePanels to discover which panels are available for the current event before deciding whether to show panel navigation controls. The returned list mirrors what the SDK's own tab bar renders and is already filtered by platform support, multi-event exclusion rules, and any panels hidden through user settings.

The list is available as soon as userDidStartWatchingEvent resolves; renderPanel does not need to have been called. Entries are copies, so you can keep or mutate them without affecting SDK state.

For a push-based alternative, implement onSDKEvent in your delegate to receive rendered:channels whenever the panel list changes.

Method Signature

getAvailablePanels(eventId?: string): PanelInfo[]

Parameters

Parameter	Type	Description
eventId	string	Optional. In a multi-event session, returns only the panels contributed by the page config for this event ID. Omit to get the full list across all loaded events.

Return Value

An array of PanelInfo objects in tab order. Returns an empty array when no panels are available.

Each PanelInfo entry has the following fields:

Field	Type	Description
type	MaestroPanelType	The panel type. Pass to setActivePanel to activate this panel.
title	string	The display name from the CMS.
iconName	string \| undefined	The backend icon name, when supplied.
panelId	string \| undefined	The config _id for panel types that can appear more than once on a page. Pass as the second argument to setActivePanel to target this specific instance.

Example

import SDK from "@maestro_io/maestro-web-sdk";

const maestroEvent = await SDK.userDidStartWatchingEvent({ eventId, delegate });

// Get all available panels.
const panels = maestroEvent.getAvailablePanels();
// [
//   { type: 'foxKeyPlays', title: 'KEY PLAYS', iconName: 'keyPlays' },
//   { type: 'foxStats',    title: 'STATS',     iconName: 'stats' },
// ]

// Build breakout buttons from the list.
panels.forEach(({ type, title, panelId }) => {
  renderBreakoutButton(title, () => {
    maestroEvent.setActivePanel(type, panelId);
  });
});

// In a multi-event session, get panels for a specific event only.
const eventPanels = maestroEvent.getAvailablePanels("event-id-123");

Notes

• In a multi-event session, calling without an argument returns the union across all loaded events — this matches what the tab bar shows.
• Passing an eventId matches on external_field_1 from the page config. Sessions started by pageId alone have no event ID to match and return []; use the no-argument form for those.
• An event whose page config failed to load returns [] when its event ID is passed.
• Panels hidden through updateUserSettings are excluded.
• See onSDKEvent for a push-based way to receive panel list updates as they occur.