Suggestions or Help Needed with Embedding Superset Dashboards on Custom URLs/Views in LMS

[Yagnesh (Yagnesh Nayi (TitanEd))]

Hello Open edX Team,

I have a question about integrating Superset dashboards into a custom location within my LMS.

Currently, this dashboard is embedded inside the ‘Reports’ tab within the instructor’s side.

As you know, the Open edX platform uses a plugin (platform-plugin-aspects) to render Superset dashboards. I am trying to replicate this behavior on my own custom URL/view, but I am running into some issues.

I’ve explored the Open edX plugin repository and found that the dashboards are embedded using the following:

1. Filters (Python) - AddSupersetTab class:
   I found the AddSupersetTab class in the platform_plugin_aspects/extensions/filters.py file, which adds a tab to the dashboard.
   File: platform_plugin_aspects/extensions/filters.py
2. Embedding Logic (JavaScript):
   There’s also a JavaScript file (embed_dashboard.js) that embeds the dashboard into the platform. This uses the Superset API and generates a guest token for accessing the dashboards.
   File: platform_plugin_aspects/static/js/embed_dashboard.js
3. Superset Dashboard HTML:
   In the HTML (superset.html), the actual embedding takes place, which renders the dashboard view.
   File: platform_plugin_aspects/static/html/superset.html
4. Guest Token Generation (Python):
   I noticed that the plugin uses platform_plugin_aspects/utils.py to generate the guest token for embedding the dashboards.
   File: platform_plugin_aspects/utils.py - line 91
5. UUID for Dashboards:
   The UUIDs for the dashboards (e.g., course-dashboard, learner-groups, individual-learner) are already predefined in the plugin.py file under the constant

"SUPERSET_EMBEDDABLE_DASHBOARDS",
            {
                "course-dashboard": "c0e64194-33d1-4d5a-8c10-4f51530c5ee9",
                "learner-groups": "8661d20c-cee6-4245-9fcc-610daea5fd24",
                "individual-learner": "abae8a25-1ba4-4653-81bd-d3937a162a11",
            },

With all of this, I am trying to replicate the behavior of embedding the dashboards on my custom URL or view. However, it’s not working as expected.

What I’m Trying to Do:

• I want to render the dashboards in a similar manner as they appear in the “Reports” tab, but on different pages (e.g., the homepage).

• I have created a custom URL, Django view, and HTML template where I want the dashboards to render, but it’s not working as expected.

Issue:

• I am having trouble generating the guest token correctly. It seems that when trying to generate the token on my custom URL/view, it doesn’t work, and the dashboard isn’t embedded properly.

Can anyone provide guidance on:

• How I can replicate the behavior of embedding dashboards in a specific location like the homepage or a custom page, using the same logic but with a custom URL and view?
• How I can correctly generate the guest token in my custom environment so the dashboards can be embedded without issues?

Any suggestions or advice would be greatly appreciated!

Thank you!

[TyHob]

Hi Yagnesh,

Generating the guest tokens can be tricky, you may need to make some configuration changes to get it to work locally. They are currently captured in the last comment of this issue: Aspects Reports (embedded Superset dashboards): internal authentication error for staff and superusers · Issue #925 · openedx/tutor-contrib-aspects · GitHub

Here are a couple of other questions that might help narrow it down:

• Are you seeing any errors in the LMS or Superset logs?
• What behavior are you seeing in the web page? Sometimes it shows “Something went wrong with embedded authentication…” Other times it seems to load but just has the loading gif, that can help pin down the issue.
• Is there anything in the web developer tools / network tab that is showing errors?
• Are you using Tutor? Dev / local / k8s?

[Yagnesh (Yagnesh Nayi (TitanEd))]

@TyHob
Thank you so much for the response! I will also follow your guidance as discussed on Slack. As of now, I am using Tutor Dev in my local environment.

[TyHob]

If folks find this post later, it’s possible to do this but you have to have a very thorough understanding of the way the Superset Embedded SDK does authentication and authorization: superset/superset-embedded-sdk/README.md at master · apache/superset · GitHub

It’s also worth noting that the embedded SDK only works via iframe.

platform-plugin-aspects, which is the LMS plugin portion of Aspects, handles this in a reusable way but it does make some assumptions about how dashboard configuration and security work. Specifically it expects the LMS to handle the authentication and authorization in the embedding page and to pass in a specific course that will be granted access to.