# Embed ThoughtSpot in a mobile app

> For the complete documentation index, see [llms.txt](https://developers.thoughtspot.com/docs/llms.txt)

Source: https://developers.thoughtspot.com/docs/mobile-embed

# Embed ThoughtSpot in a mobile app

ThoughtSpot provides the following SDK libraries to help developers embed ThoughtSpot in their mobile apps:

-   [React Native Mobile Embed SDK]({{navprefix}}/{{mobilesdk-quick-start}})  
    Allows developers to embed ThoughtSpot content in **iOS** and **Android** mobile apps using React Native resources and a single codebase.
    
-   [Flutter Embed SDK]({{navprefix}}/{{mobile-embed-qs-flutter}})  
    Allows embedding ThoughtSpot components in Flutter apps.
    
-   [Swift Embed SDK]({{navprefix}}/{{mobile-embed-qs-swift}})  
    Allows developers to embed ThoughtSpot content in an iOS native app.
    
-   [Android Embed SDK]({{navprefix}}/{{mobile-embed-android}})  
    Allows developers to embed ThoughtSpot content in an Android native app.
    

## Authentication and security settings

Currently, Mobile Embed SDKs support only cookieless authentication (`AuthType.TrustedAuthCookieless`) method to authenticate embed users. To handle authentication, you may have to token provider function or use your backend app to fetch a token for trusted authentication. For more information, see the respective Mobile Embed SDK quickstart guides.

## Mobile embed customization

-   Liveboard and visualization menu customization
    
-   Style customization
    
-   Text string and icon customization
    

## Menu customization

By default, the mobile embed views show the following actions.

Default menu actions

-   **Add filter** ([`Action.AddFilter`]({{navprefix}}/{{Action}}#_addfilter))  
    Allows adding filters to the embedded Liveboard
    
-   **Filter** ([`Action.CrossFilter`]({{navprefix}}/{{Action}}#_crossfilter))  
    Allows applying filters across all visualizations in a Liveboard.
    
-   **Drill down** ([`Action.DrillDown`]({{navprefix}}/{{Action}}#_drilldown))  
    Allows drilling down on a data point in the visualization to get granular details.
    
-   **Personalized view** ([`Action.PersonalisedViewsDropdown`]({{navprefix}}/{{Action}}#_personalisedviewsdropdown))  
    The Liveboard personalized views drop-down.
    
-   **Filter** action ([`Action.AxisMenuFilter`]({{navprefix}}/{{Action}}#_axismenufilter)) in the chart axis or table column customization menu  
    Allows adding, editing, or removing filters on a visualization.
    
-   **Edit** action ([`Action.AxisMenuEdit`]({{navprefix}}/{{Action}}#_axismenuedit)) in the axis customization menu.  
    Allows editing the axis name, position, minimum and maximum values of a column.
    
-   **Position** action ([`Action.AxisMenuPosition`]({{navprefix}}/{{Action}}#_axismenuposition)) in the axis customization menu.  
    Allows changing the position of the axis to the left or right side of the chart.
    
-   **Sort** action ([`Action.AxisMenuSort`]({{navprefix}}/{{Action}}#_axismenusort)) - Sorts the data in ascending or descending order on a chart or table.
    
-   **Aggregate** ([`Action.AxisMenuAggregate`]({{navprefix}}/{{Action}}#_axismenuaggregate)) option in the chart axis or the table column customization menu.  
    Provides aggregation options to analyze the data on a chart or table.
    
-   **Conditional formatting** menu option ([`Action.AxisMenuConditionalFormat`]({{navprefix}}/{{Action}}#_axismenuconditionalformat))  
    Allows adding rules for conditional formatting of data points on a chart or table.
    
-   The **Group** option ([`Action.AxisMenuGroup`]({{navprefix}}/{{Action}}#_axismenugroup)) in the chart axis or table column customization menu.  
    Allows grouping data points if the axes use the same unit of measurement and a similar scale.
    
-   The **Remove** option ([`Action.AxisMenuRemove`]({{navprefix}}/{{Action}}#_axismenuremove)) in the chart axis or table column customization menu.  
    Removes the data labels from a chart or the column of a table visualization.
    
-   The **Rename** option ([`Action.AxisMenuRename`]({{navprefix}}/{{Action}}#_axismenurename)) in the chart axis or table column customization menu.  
    Renames the axis label on a chart or the column header on a table
    
-   **Time bucket** option ([`Action.AxisMenuTimeBucket`]({{navprefix}}/{{Action}}#_axismenutimebucket)) in the chart axis or table column customization menu.  
    Allows defining time metric for date comparison.
    

To disable, show, or hide specific menu actions, specify the action IDs with the `disabledActions` `visibleActions` or `hiddenActions` array in your code. For additional information and code samples, refer to the mobile embed Quickstart guides.

## Style customization

To customize styles and rebrand your embedded view, use the CSS variables available with the customzation framework. For additional information and code samples, refer to the mobile embed Quickstart guides.

## Text string and icon customization

To customize text strings, use the `stringIDs` and `strings` objects in the customization interface to override text strings. For more information, see [Customize text strings]({{navprefix}}/{{customize-text-strings}}).

For icon customization, you need to [find the ID of the icon that you want to replace and then replace it with your SVG]({{navprefix}}/{{customize-icons}}#_create_an_icon_override). You must also add the domain URL of your icon hosting site to the following CSP allowlists on the **Develop** > **Security Settings** page in your ThoughtSpot instance:

-   [CSP connect-src domains allowlist]({{navprefix}}/{{security-settings}}#csp-connect-src)
    
-   [CSP img-src domains allowlist]({{navprefix}}/{{security-settings}}#csp-trusted-domain)
    

## Filters and Parameters for embedded Liveboards

For Liveboard embeds in mobile apps, the SDKs allow adding, updating runtime filters and Parameters, and applying individual filters at the visualization level. For more information about filter types, see [Filter overview]({{navprefix}}/{{filters_overview}}) and [Runtime overrides](<#Runtime overrides>).

## Events and app interactions

The embedded ThoughtSpot components emit events when they initialize, load, and when users interact with the embedded interface. The mobile embed SDKs provides a set of event handlers to listen to the events emitted from the embedded interface and trigger actions.

For more information about the events framework, see [Events and app interactions]({{navprefix}}/{{embed-events}}), [Embed Events]({{navprefix}}/{{EmbedEvent}}), and [Host Events]({{navprefix}}/{{HostEvent}}).

## Known limitations

The mobile embed SDKs currently support embedding only Liveboards in mobile apps. The following features will not be available on the embedded Liveboard page in a mobile apps:

-   Personalized views
    
-   SpotIQ Analysis
    
-   AI Highlights
    
-   Renaming and making a copy of a Liveboard
    
-   Scheduling Liveboard alerts and notifications
    
-   Exporting or importing Liveboard TML
    
-   Request Verification
    
-   ThoughtSpot Sync features
    

The following Liveboard view configuration parameters are not supported in mobile embeds:

-   [insertAsSibling]({{navprefix}}/{{LiveboardViewConfig}}#_insertassibling)
    
-   [preRenderId]({{navprefix}}/{{LiveboardViewConfig}}#_prerenderid)
    
-   [fullHeight]({{navprefix}}/{{LiveboardViewConfig}}#_fullheight)
    
-   [doNotTrackPreRenderSize]({{navprefix}}/{{LiveboardViewConfig}}#_donottrackprerendersize)