Embedding SDK -- issue when adding an action

Q&A
,
3

Hi, okay.

Let me switch gears slightly, in the interest of possibly finding at least one working path, and then let’s circle back to the cases I have documented above, if we need to.

You’re probably right that there may be some TypeScript/NextJS difficulty here. What I have done is to put the invocation of addActions in a useEffect hook, and then check that the variable is defined before proceeding.

WIth this, I get errors very similar to what are described in here and here.

Here’s the code:

  useEffect(() => {
    if (embeddedVisual) {
    console.log('running effect for embedded visual')
    console.log(embeddedVisual)
    embeddedVisual.setActions([
      {
        Name: "test click action",
        CustomActionId: `test-click-action`,
        Status: "ENABLED",
        Trigger: "DATA_POINT_CLICK", // or 'DATA_POINT_MENU'
        ActionOperations: [
          {
            CallbackOperation: {
              EmbeddingMessage: {},
            },
          },
        ],
      },
    ]);
  }}, [embeddedVisual]);

embeddedVisual is set like this:

  useEffect(() => {
    if (embeddingContext) {
      embed();
    }
  }, [embeddingContext]);

  const embed = async () => {
    const frame_options = {
      url: dashboardUrl,
      container: "#mytest",
      height: "300px",
      width: "900px",
    };

    const content_options = {
      // onMessage: onMessage,
    };

    const newEmbeddedVisual = await embeddingContext!.embedVisual(
      frame_options,
      content_options,
    );

    // console.log("embedded");

    console.log(newEmbeddedVisual)
    await setEmbeddedVisual(newEmbeddedVisual);
    
    console.log(newEmbeddedVisual)
    // console.log(embeddedVisual)
  };

image

2 Likes