awslabs / amazon-quicksight-embedding-sdk

A SDK to help users embed QuickSight dashboards on other pages.
Apache License 2.0
169 stars 40 forks source link

addVisualActions fails to add visual actions to all visuals in a sheet #219

Open tysiew2000 opened 2 months ago

tysiew2000 commented 2 months ago

Hi! I have some embedded dashboards in an Angular application, my implementation is such that when I navigate to a dashboard, for a given sheet id, I iterate through all visuals in the sheet and add the exact same visual action to each of them.

I am using version 2.7.0.

I'm able to see the dashboard in the UI and events are logging in the console but addVisualActions is failing for some visuals. This is not a consistent failure as well, eg. tabular visuals in one dashboard have the visual actions added, but on another dashboard the tabular visuals do not have the visual actions added.

The message I receive when the visual action has failed to be added is "Input failed to validate against model" or "Error in action translation".

This is the code:

async registerVisualEmbeddedSingleDatapoint(frame: DashboardExperience, sheet: { name: string; id: string }): Promise<void> {
    try {
      this.visualIdNameMap = {};
      const sheetVisuals = await this.getSheetVisualsWithRetry(frame, sheet.id);
      this.logger.debug('List of visuals for selected sheet', sheetVisuals);
        for (const visual of sheetVisuals) {
          try {
            if (!visual.VisualId) {
              this.logger.warn(`Unable to add custom action for unknown visual`);
              continue;
            }
            const response = await this.addVisualActionsWithRetry(frame, sheet.id, visual.VisualId, [
              {
                Name: `Get Single Datapoint ${visual.Name}`,
                CustomActionId: `get_single_datapoint_${visual.Name}`,
                Status: 'ENABLED',
                Trigger: 'DATA_POINT_CLICK',
                ActionOperations: [
                  {
                    CallbackOperation: {
                      EmbeddingMessage: {},
                    },
                  },
                ],
              },
            ]);
            if (response && response.success) {
              this.logger.debug(`Successfully added get_single_point visual action to ${visual.Name} (ID: ${visual.VisualId})`);
            } else {
              this.logger.debug(`Failed to add visual action to ${visual.Name} (ID: ${visual.VisualId}): ${response?.message}`);
            }
          } catch (error) {
            this.logger.debug(`Adding get_single_point visual action to ${visual.Name} (ID: ${visual.VisualId}) failed: `, error);
          }
        }
      }
  }

The retry functions are as defined below:

async withRetry<T>(operation: () => Promise<T>, maxRetries: number = 3, delayMs: number = 1000): Promise<T | undefined> {
    let attempts = 0;
    while (attempts < maxRetries) {
      try {
        return await operation();
      } catch (error) {
        attempts++;
        this.logger.debug(`Attempt ${attempts} failed: ${error}`);

        if (attempts < maxRetries) {
          this.logger.debug(`Retrying in ${delayMs}ms...`);
          await new Promise((resolve) => setTimeout(resolve, delayMs));
        } else {
          this.logger.debug(`Max retries reached. Operation failed.`);
          throw Error(`${error}`);
        }
      }
    }
    return undefined;
  }

  async addVisualActionsWithRetry(frame: DashboardExperience, sheetId: string, visualId: string, actions: any[]): Promise<any> {
    return this.withRetry(() => frame.addVisualActions(sheetId, visualId, actions));
  }

  async getSheetVisualsWithRetry(frame: DashboardExperience, sheetId: string): Promise<any> {
    return this.withRetry(() => frame.getSheetVisuals(sheetId));
  }
kuehnmic commented 2 months ago

Hey @tysiew2000, these errors, where are they coming from? Are you seeing them in the console log or are they coming in network requests?

I think for debugging this specific issue, the best path forward may be to get help in our developer community here: https://community.amazonquicksight.com/c/learning-center/developer/36/none

tysiew2000 commented 2 months ago

The errors are from the response.message, I log them in console using this line this.logger.debug(`Failed to add visual action to ${visual.Name} (ID: ${visual.VisualId}): ${response?.message}`);

Will take a look at the dev community, thank you!