TFD
ThoughtSpot For Developers•4mo ago
baran

Un-hide parameter chip when `runtimeParameters` is passed

Background: The React/JavaScript/TypeScript app runs a liveboard embed using the @thoughtspot/visual-embed-sdk library. The code passes a few actions. 
import { Action, LiveboardEmbed as LiveboardEmbedRef } from '@thoughtspot/visual-embed-sdk';

const LiveboardVisuals: React.FC<LiveboardProps> = ({
  liveboardId,
  visualId,
  filterByOptions,
  filterByParameters,
}) => {
  const embedRef = useEmbedRef() as React.MutableRefObject<LiveboardEmbedRef>;

  return (
    <LiveboardEmbed
      frameParams={{
        height: '580px',
      }}
      fullHeight
      ref={embedRef}
      liveboardId={liveboardId}
      runtimeFilters={filterByOptions}
      runtimeParameters={filterByParameters} // <--
      vizId={visualId}
    />
  );
};
import { Action, LiveboardEmbed as LiveboardEmbedRef } from '@thoughtspot/visual-embed-sdk';

const LiveboardVisuals: React.FC<LiveboardProps> = ({
  liveboardId,
  visualId,
  filterByOptions,
  filterByParameters,
}) => {
  const embedRef = useEmbedRef() as React.MutableRefObject<LiveboardEmbedRef>;

  return (
    <LiveboardEmbed
      frameParams={{
        height: '580px',
      }}
      fullHeight
      ref={embedRef}
      liveboardId={liveboardId}
      runtimeFilters={filterByOptions}
      runtimeParameters={filterByParameters} // <--
      vizId={visualId}
    />
  );
};
Aim: When the developer passes filterByParameters, and the user views the liveboard, then the passed parameter's chip is hidden. Issue: From our understanding, hiding the chip is the default behaviour (mentioned here in the NOTE section https://developers.thoughtspot.com/docs/runtime-params). However, we would like to unhide the parameter chip since the default value should be passed but then the user should be able to change the value. So, how can we unhide the parameter chip when passing a runtime parameter?
2 Replies
shikharTS
shikharTS•4mo ago
RuntimeFilters and runtimeParameters do act this way as we have provided in the documentation. One workaround I can think of, to update the parameters in the chip is using the updateFilters and updateParameters events. https://developers.thoughtspot.com/docs/Enumeration_HostEvent#_updateparameters
HostEvent
Event types that can be triggered by the host application to the embedded ThoughtSpot app.
baran
baranOP•4mo ago
@shikharTS how should I call the updateFilters in the React library (i.e., @thoughtspot/visual-embed-sdk on v1.33.3 (latest version as of today)? My attempt: 
    <LiveboardEmbed
      onLiveboardRendered={() =>
        embedRef.current.trigger(HostEvent.UpdateParameters, [{ name: 'Timezones', value: 'Australia/Sydney' }])
      } // when the liveboard is loaded, the parameter is not changed
      ref={embedRef}
      liveboardId={liveboardId}
      // runtimeParameters={[{ name: 'Timezones', value: 'Australia/Sydney' }]} // when the liveboard is loaded, the parameter is changed, but the parameter chip is hidden; so I can't use this prop
      vizId={visualId}
    />
    <LiveboardEmbed
      onLiveboardRendered={() =>
        embedRef.current.trigger(HostEvent.UpdateParameters, [{ name: 'Timezones', value: 'Australia/Sydney' }])
      } // when the liveboard is loaded, the parameter is not changed
      ref={embedRef}
      liveboardId={liveboardId}
      // runtimeParameters={[{ name: 'Timezones', value: 'Australia/Sydney' }]} // when the liveboard is loaded, the parameter is changed, but the parameter chip is hidden; so I can't use this prop
      vizId={visualId}
    />

Did you find this page helpful?