@thoughtspot/visual-embed-sdk 1.42.1-alpha.7 → 1.42.2

package/src/react/index.tsx

@@ -10,125 +10,101 @@ import { SearchEmbed as _SearchEmbed, SearchViewConfig } from '../embed/search';
 import { AppEmbed as _AppEmbed, AppViewConfig } from '../embed/app';
 import { LiveboardEmbed as _LiveboardEmbed, LiveboardViewConfig } from '../embed/liveboard';
 import { TsEmbed } from '../embed/ts-embed';
-import {
-    SpotterAgentEmbed as _SpotterAgentEmbed,
-    SpotterAgentEmbedViewConfig,
-    ConversationMessage as _ConversationMessage,
-    SpotterAgentMessageViewConfig,
-} from '../embed/bodyless-conversation';
+import { SpotterAgentEmbed as _SpotterAgentEmbed, SpotterAgentEmbedViewConfig, ConversationMessage as _ConversationMessage, SpotterAgentMessageViewConfig } from '../embed/bodyless-conversation';
 
 import { EmbedConfig, EmbedEvent, AllEmbedViewConfig } from '../types';
 import { EmbedProps, getViewPropsAndListeners } from './util';
-import {
-    SpotterEmbed as _SpotterEmbed,
-    SpotterEmbedViewConfig,
-    ConversationEmbed as _ConversationEmbed,
-    ConversationViewConfig,
-} from '../embed/conversation';
+import { SpotterEmbed as _SpotterEmbed, SpotterEmbedViewConfig, ConversationEmbed as _ConversationEmbed, ConversationViewConfig } from '../embed/conversation';
 import { init } from '../embed/base';
 import { ERROR_MESSAGE } from '../errors';
 
-const componentFactory = <
-    T extends typeof TsEmbed,
-    U extends EmbedProps,
-    V extends AllEmbedViewConfig
->(
+const componentFactory = <T extends typeof TsEmbed, U extends EmbedProps, V extends AllEmbedViewConfig>(
     EmbedConstructor: T,
     // isPreRenderedComponent: Specifies whether the component being returned is
     // intended for preRendering. If set to true, the component will call the
     // Embed.preRender() method instead of the usual render method, and it will
     // not be destroyed when the component is unmounted.
     isPreRenderedComponent = false,
-) =>
-    React.forwardRef<InstanceType<T>, U>(
-        (props: U, forwardedRef: React.MutableRefObject<InstanceType<T>>) => {
-            const ref = React.useRef<HTMLDivElement>(null);
-            const { className, style, ...embedProps } = props;
-            const { viewConfig, listeners } = getViewPropsAndListeners<
-                Omit<U, 'className' | 'style'>,
-                V
-            >(embedProps);
-
-            const handleDestroy = (tsEmbed: InstanceType<T>) => {
-                // do not destroy if it is a preRender component
-                if (isPreRenderedComponent) return;
-
-                // if component is connected to a preRendered component
-                if (props.preRenderId) {
-                    tsEmbed.hidePreRender();
-                    return;
-                }
-
-                tsEmbed.destroy();
-            };
+ ) => React.forwardRef<InstanceType<T>, U>(
+    (props: U, forwardedRef: React.MutableRefObject<InstanceType<T>>) => {
+        const ref = React.useRef<HTMLDivElement>(null);
+        const { className, style, ...embedProps } = props;
+        const { viewConfig, listeners } = getViewPropsAndListeners<Omit<U, 'className' | 'style'>, V>(
+            embedProps,
+        );
+
+        const handleDestroy = (tsEmbed: InstanceType<T>) => {
+            // do not destroy if it is a preRender component
+            if (isPreRenderedComponent) return;
+
+            // if component is connected to a preRendered component
+            if (props.preRenderId) {
+                tsEmbed.hidePreRender();
+                return;
+            }
 
-            const handlePreRenderRendering = (tsEmbed: InstanceType<T>) => {
-                tsEmbed.preRender();
-            };
+            tsEmbed.destroy();
+        };
 
-            const handleDefaultRendering = (tsEmbed: InstanceType<T>) => {
-                // if component is connected to a preRendered component
-                if (props.preRenderId) {
-                    tsEmbed.showPreRender();
-                    return;
-                }
+        const handlePreRenderRendering = (tsEmbed: InstanceType<T>) => {
+            tsEmbed.preRender();
+        };
 
-                tsEmbed.render();
-            };
+        const handleDefaultRendering = (tsEmbed: InstanceType<T>) => {
+            // if component is connected to a preRendered component
+            if (props.preRenderId) {
+                tsEmbed.showPreRender();
+                return;
+            }
 
-            const handleRendering = (tsEmbed: InstanceType<T>) => {
-                if (isPreRenderedComponent) {
-                    handlePreRenderRendering(tsEmbed);
-                    return;
-                }
-                handleDefaultRendering(tsEmbed);
-            };
+            tsEmbed.render();
+        };
+
+        const handleRendering = (tsEmbed: InstanceType<T>) => {
+            if (isPreRenderedComponent) {
+                handlePreRenderRendering(tsEmbed);
+                return;
+            }
+            handleDefaultRendering(tsEmbed);
+        };
 
-            useDeepCompareEffect(() => {
-                const tsEmbed = new EmbedConstructor(
-                    ref!.current,
-                    deepMerge(
-                        {
-                            insertAsSibling: viewConfig.insertAsSibling,
-                            frameParams: {
-                                class: viewConfig.insertAsSibling ? className || '' : '',
-                            },
+        useDeepCompareEffect(() => {
+            const tsEmbed = new EmbedConstructor(
+                ref!.current,
+                deepMerge(
+                    {
+                        insertAsSibling: viewConfig.insertAsSibling,
+                        frameParams: {
+                            class: viewConfig.insertAsSibling ? className || '' : '',
                         },
-                        viewConfig,
-                    ),
-                ) as InstanceType<T>;
-                Object.keys(listeners).forEach((eventName) => {
-                    tsEmbed.on(eventName as EmbedEvent, listeners[eventName as EmbedEvent]);
-                });
-                handleRendering(tsEmbed);
-                if (forwardedRef) {
-                    forwardedRef.current = tsEmbed;
-                }
-                return () => {
-                    handleDestroy(tsEmbed);
-                };
-            }, [viewConfig, listeners]);
-
-            const preRenderStyles = isPreRenderedComponent ? { display: 'none' } : {};
-
-            return viewConfig.insertAsSibling ? (
-                <span
-                    data-testid="tsEmbed"
-                    ref={ref}
-                    style={{ position: 'absolute', ...preRenderStyles }}
-                ></span>
-            ) : (
-                <div
-                    data-testid="tsEmbed"
-                    ref={ref}
-                    style={{ ...style, ...preRenderStyles }}
-                    className={`ts-embed-container ${className}`}
-                ></div>
-            );
-        },
-    );
+                    },
+                    viewConfig,
+                ),
+            ) as InstanceType<T>;
+            Object.keys(listeners).forEach((eventName) => {
+                tsEmbed.on(eventName as EmbedEvent, listeners[eventName as EmbedEvent]);
+            });
+            handleRendering(tsEmbed);
+            if (forwardedRef) {
+                // eslint-disable-next-line no-param-reassign
+                forwardedRef.current = tsEmbed;
+            }
+            return () => {
+                handleDestroy(tsEmbed);
+            };
+        }, [viewConfig, listeners]);
 
-interface SearchProps extends EmbedProps, SearchViewConfig {}
+        const preRenderStyles = isPreRenderedComponent ? { display: 'none' } : {};
+
+        return viewConfig.insertAsSibling ? (
+            <span data-testid="tsEmbed" ref={ref} style={{ position: 'absolute', ...preRenderStyles }}></span>
+        ) : (
+            <div data-testid="tsEmbed" ref={ref} style={{ ...style, ...preRenderStyles }} className={`ts-embed-container ${className}`}></div>
+        );
+    },
+);
+
+interface SearchProps extends EmbedProps, SearchViewConfig { }
 
 interface PreRenderProps {
     /**
@@ -182,7 +158,7 @@ export const PreRenderedSearchEmbed = componentFactory<
     SearchViewConfig
 >(_SearchEmbed, true);
 
-interface AppProps extends EmbedProps, AppViewConfig {}
+interface AppProps extends EmbedProps, AppViewConfig { }
 
 /**
  * React component for Full app Embed.
@@ -223,7 +199,7 @@ export const PreRenderedAppEmbed = componentFactory<
     AppViewConfig
 >(_AppEmbed, true);
 
-interface LiveboardProps extends EmbedProps, LiveboardViewConfig {}
+interface LiveboardProps extends EmbedProps, LiveboardViewConfig { }
 
 /**
  * React component for Liveboard embed.
@@ -276,7 +252,7 @@ export const PreRenderedLiveboardEmbed = componentFactory<
 
 export const PreRenderedPinboardEmbed = PreRenderedLiveboardEmbed;
 
-interface SearchBarEmbedProps extends EmbedProps, SearchBarViewConfig {}
+interface SearchBarEmbedProps extends EmbedProps, SearchBarViewConfig { }
 
 /**
  * React component for Search bar embed.
@@ -320,7 +296,7 @@ export const PreRenderedSearchBarEmbed = componentFactory<
     SearchBarViewConfig
 >(_SearchBarEmbed, true);
 
-interface SageEmbedProps extends EmbedProps, SageViewConfig {}
+interface SageEmbedProps extends EmbedProps, SageViewConfig { }
 
 /**
  * React component for LLM based search Sage embed.
@@ -362,8 +338,8 @@ export const PreRenderedSageEmbed = componentFactory<
     SageViewConfig
 >(_SageEmbed, true);
 
-interface SpotterEmbedProps extends EmbedProps, SpotterEmbedViewConfig {}
-interface ConversationEmbedProps extends EmbedProps, ConversationViewConfig {}
+interface SpotterEmbedProps extends EmbedProps, SpotterEmbedViewConfig { }
+interface ConversationEmbedProps extends EmbedProps, ConversationViewConfig { }
 
 /**
  * React component for LLM based conversation BI.
@@ -386,6 +362,7 @@ export const SpotterEmbed = componentFactory<
     SpotterEmbedViewConfig
 >(_SpotterEmbed);
 
+
 /**
  * React component for LLM based conversation BI.
  * @deprecated from SDK: 1.39.0 | ThoughtSpot: 10.10.0.cl
@@ -425,27 +402,27 @@ export const ConversationMessage = componentFactory<
 type SpotterMessageProps = {
     message: SpotterAgentMessageViewConfig;
     query?: string;
-} & Omit<EmbedProps, keyof SpotterAgentMessageViewConfig>;
+  } & Omit<EmbedProps, keyof SpotterAgentMessageViewConfig>;
 
 /**
  * React component for displaying individual conversation messages from SpotterAgent.
- *
+ * 
  * This component renders a single message response from your ThoughtSpot conversation,
  * showing charts, visualizations, or text responses based on the user's query.
- *
+ * 
  * @example
  * ```tsx
  * const { sendMessage } = useSpotterAgent({ worksheetId: 'worksheetId' });
  * const result = await sendMessage('show me sales by region');
- *
+ * 
  * if (!result.error) {
  *   // Simple usage - just pass the message data
  *   <SpotterMessage message={result.message} />
- *
+ *   
  *   // With optional query for context
- *   <SpotterMessage
- *     message={result.message}
- *     query={result.query}
+ *   <SpotterMessage 
+ *     message={result.message} 
+ *     query={result.query} 
  *   />
  * }
  * ```
@@ -456,8 +433,14 @@ export const SpotterMessage = React.forwardRef<
     SpotterMessageProps
 >((props, ref) => {
     const { message, query: _, ...otherProps } = props;
-
-    return <ConversationMessage ref={ref} {...message} {...otherProps} />;
+    
+    return (
+        <ConversationMessage
+            ref={ref}
+            {...message}
+            {...otherProps}
+        />
+    );
 });
 
 /**
@@ -484,8 +467,7 @@ export const PreRenderedConversationEmbed = componentFactory<
     SpotterEmbedViewConfig
 >(_SpotterEmbed, true);
 
-type EmbedComponent =
-    | typeof SearchEmbed
+type EmbedComponent = typeof SearchEmbed
     | typeof AppEmbed
     | typeof LiveboardEmbed
     | typeof SearchBarEmbed
@@ -511,9 +493,8 @@ type EmbedComponent =
  * ```
  * @returns {React.MutableRefObject<T extends TsEmbed>} ref
  */
-export function useEmbedRef<T extends EmbedComponent>(): React.MutableRefObject<
-    React.ComponentRef<T>
-> {
+export function useEmbedRef<T extends EmbedComponent>():
+    React.MutableRefObject<React.ComponentRef<T>> {
     return React.useRef<React.ComponentRef<T>>(null);
 }
 
@@ -542,19 +523,19 @@ export function useInit(config: EmbedConfig) {
 
 /**
  * React hook for interacting with SpotterAgent AI conversations.
- *
+ * 
  * This hook provides a sendMessage function that allows you to send natural language
  * queries to your data and get back AI-generated responses with visualizations.
- *
+ * 
  * @param config - Configuration object containing worksheetId and other options
  * @returns Object with sendMessage function that returns conversation results
  * @example
  * ```tsx
  * const { sendMessage } = useSpotterAgent({ worksheetId: 'worksheetId' });
- *
+ * 
  * const handleQuery = async () => {
  *   const result = await sendMessage('show me sales by region');
- *
+ *   
  *   if (!result.error) {
  *     // Display the message response
  *     <SpotterMessage message={result.message} />
@@ -567,41 +548,38 @@ export function useInit(config: EmbedConfig) {
  */
 export function useSpotterAgent(config: SpotterAgentEmbedViewConfig) {
     const serviceRef = useRef<_SpotterAgentEmbed | null>(null);
-
+    
     useDeepCompareEffect(() => {
         if (serviceRef.current) {
             serviceRef.current = null;
         }
-
+        
         serviceRef.current = new _SpotterAgentEmbed(config);
-
+        
         return () => {
             serviceRef.current = null;
         };
     }, [config]);
 
-    const sendMessage = useCallback(
-        async (query: string) => {
-            if (!serviceRef.current) {
-                return { error: new Error(ERROR_MESSAGE.SPOTTER_AGENT_NOT_INITIALIZED) };
-            }
+    const sendMessage = useCallback(async (query: string) => {
+        if (!serviceRef.current) {
+            return { error: new Error(ERROR_MESSAGE.SPOTTER_AGENT_NOT_INITIALIZED) };
+        }
 
-            const result = await serviceRef.current.sendMessageData(query);
+        const result = await serviceRef.current.sendMessageData(query);
 
-            if (result.error) {
-                return { error: result.error };
-            }
+        if (result.error) {
+            return { error: result.error };
+        }
 
-            return {
-                query: query,
-                message: {
-                    ...result.data,
-                    worksheetId: config.worksheetId,
-                },
-            };
-        },
-        [config.worksheetId],
-    );
+        return {
+            query: query,
+            message: {
+                ...result.data,
+                worksheetId: config.worksheetId,
+            },
+        };
+    }, [config.worksheetId]);
 
     return {
         sendMessage,
@@ -609,11 +587,16 @@ export function useSpotterAgent(config: SpotterAgentEmbedViewConfig) {
 }
 
 export {
+    LiveboardViewConfig,
+    SearchViewConfig,
+    AppViewConfig,
     Page,
+    RuntimeFilter,
     RuntimeFilterOp,
     EmbedEvent,
     HostEvent,
     Action,
+    FrameParams,
     HomeLeftNavItem,
     HomepageModule,
     LogLevel,
@@ -621,11 +604,3 @@ export {
     ListPageColumns,
     CustomActionsPosition,
 } from '../index';
-
-export type {
-    RuntimeFilter,
-    LiveboardViewConfig,
-    SearchViewConfig,
-    AppViewConfig,
-    FrameParams,
-} from '../index';