feat(Embedding): Embeddable Charts as per SIP #33424

amaannawab923 · 2025-05-13T19:42:45Z

SUMMARY

This pr implements Embeddable Charts as per SIP #30075 (comment)
The only takeaway , the solution doesnt use charts in standalone mode , instead it takes the dashboard charts, hydrates them with all the required data & tells them to take full width & height of iframe , this avoids use of standalone mode & gives the same experience as dashboard charts

Chart embedding in action with nextjs app

screen-capture.23.webm

Embed uuid generation just like dashboard

Most of normal chart features of dashboard works

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

TESTING INSTRUCTIONS

ADDITIONAL INFORMATION

Has associated issue:
Required feature flags:
Changes UI
Includes DB Migration (follow approval process in SIP-59)
- Migration is atomic, supports rollback & is backwards-compatible
- Confirm DB migration upgrade and downgrade tested
- Runtime estimates and downtime expectations provided
Introduces new feature or API
Removes existing feature or API

korbit-ai · 2025-05-13T19:42:50Z

Based on your review schedule, I'll hold off on reviewing this PR until it's marked as ready for review. If you'd like me to take a look now, comment /korbit-review.

Your admin can change your review schedule in the Korbit Console

codecov · 2025-05-13T22:36:08Z

Codecov Report

❌ Patch coverage is 63.79310% with 42 lines in your changes missing coverage. Please review.
✅ Project coverage is 65.73%. Comparing base (76d897e) to head (e3a65ba).
⚠️ Report is 3040 commits behind head on master.

Files with missing lines	Patch %	Lines
superset/charts/api.py	58.33%	25 Missing ⚠️
superset/embedded/view.py	11.11%	8 Missing ⚠️
superset/commands/chart/delete.py	60.00%	4 Missing ⚠️
superset/daos/chart.py	55.55%	4 Missing ⚠️
superset/models/embedded_chart.py	93.33%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##           master   #33424      +/-   ##
==========================================
+ Coverage   60.48%   65.73%   +5.24%     
==========================================
  Files        1931      554    -1377     
  Lines       76236    40109   -36127     
  Branches     8568        0    -8568     
==========================================
- Hits        46114    26367   -19747     
+ Misses      28017    13742   -14275     
+ Partials     2105        0    -2105

Flag	Coverage Δ
hive	`48.28% <63.79%> (-0.87%)`	⬇️
javascript	`?`
presto	`52.74% <63.79%> (-1.06%)`	⬇️
python	`65.73% <63.79%> (+2.23%)`	⬆️
unit	`61.32% <63.79%> (+3.69%)`	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

korbit-ai

Review by Korbit AI

Korbit automatically attempts to detect when you fix issues in new commits.

Category	Issue	Status
	Missing embedded property context ▹ view	🧠 Not in scope
	Missing null check in HYDRATE_EMBEDDED reducer ▹ view	🧠 Incorrect
	Insecure Default Embedding Policy ▹ view
	Inconsistent and Unclear Column Naming ▹ view	🧠 Not in standard
	Unchecked External Data Injection ▹ view	🧠 Not in scope
	Unsafe Type Bypass and Inefficient Object Copy ▹ view	🧠 Incorrect
	Unsafe Type Bypass in Embedded Datasource Hydration ▹ view	🧠 Not in standard
	State overwrite in HYDRATE_EMBEDDED case ▹ view	🧠 Incorrect
	Duplicate Hydration Logic for Embedded Charts ▹ view
	Nullable Audit Timestamps ▹ view	🧠 Not in scope

Files scanned

File Path	Reviewed
superset-frontend/src/dashboard/reducers/datasources.ts	✅
superset-frontend/src/explore/reducers/datasourcesReducer.ts	✅
superset-frontend/src/dashboard/reducers/dashboardInfo.js	✅
superset-frontend/src/dashboard/actions/datasources.ts	✅
superset-frontend/src/dashboard/reducers/sliceEntities.js	✅
superset/models/embedded_chart.py	✅
superset/migrations/versions/2025-05-14_03-40_67dd9e3429b2_add_embedded_charts_table.py	✅
superset/daos/chart.py	✅
superset/commands/chart/delete.py	✅
superset-frontend/src/embedded/embeddedChart/useExploreData.ts	✅
superset-frontend/src/types/bootstrapTypes.ts	✅
superset/commands/chart/exceptions.py	✅
superset/embedded/view.py	✅
superset-frontend/src/dataMask/reducer.ts	✅
superset-frontend/packages/superset-ui-core/src/ui-overrides/types.ts	✅
superset-frontend/src/components/Chart/chartReducer.ts	✅
superset-frontend/src/dashboard/reducers/dashboardState.js	✅
superset-frontend/src/embedded/embeddedChart/hydrateEmbedded.ts	✅
superset-frontend/src/embedded/index.tsx	✅
superset-frontend/src/embedded/embeddedChart/index.tsx	✅
superset-frontend/src/dashboard/components/SliceHeader/index.tsx	✅
superset-frontend/src/dashboard/components/EmbeddedModal/index.tsx	✅
superset/models/slice.py	✅
superset-frontend/src/dashboard/components/SliceHeaderControls/index.tsx	✅
superset-frontend/src/dashboard/components/Header/index.jsx	✅
superset/charts/api.py	✅
superset/charts/schemas.py	✅

Explore our documentation to understand the languages and file types we support and the files we ignore.

Check out our docs on how you can make Korbit work best for you and your team.

Loving Korbit!? Share us on LinkedIn Reddit and X

superset-frontend/src/types/bootstrapTypes.ts

  embedded?: {
    dashboard_id: string;
+    chart_id: string;
+    resource_type: 'dashboard' | 'chart';
  };


superset-frontend/src/dashboard/reducers/sliceEntities.js

+    [HYDRATE_EMBEDDED]() {
+      return {
+        ...action.data.sliceEntities,
+      };
+    },


korbit-ai · 2025-05-14T19:10:49Z

superset/models/embedded_chart.py

+    @property
+    def allowed_domains(self) -> list[str]:
+        """
+        A list of domains which are allowed to embed the chart.
+        An empty list means any domain can embed.
+        """


Insecure Default Embedding Policy

Tell me more

What is the issue?

The allowed_domains property allows unrestricted embedding from any domain when allow_domain_list is empty, which is an insecure default that enables clickjacking attacks.

Why this matters

Without domain restrictions by default, malicious sites could embed and manipulate the chart content, potentially leading to data theft or user deception through UI redressing attacks.

Suggested change ∙ Feature Preview

Change the behavior to deny all domains by default instead of allow all. For example:

@property def allowed_domains(self) -> list[str]: """A list of domains which are allowed to embed the chart. An empty list means no domains can embed (secure by default). """ return self.allow_domain_list.split(",") if self.allow_domain_list else ["DENY_ALL"]

Provide feedback to improve future suggestions

_{💬 Looking for more details? Reply to this comment to chat with Korbit.}

superset/models/embedded_chart.py

+    __tablename__ = "embedded_charts"
+
+    uuid = Column(UUIDType(binary=True), default=uuid.uuid4, primary_key=True)
+    allow_domain_list = Column(Text)


superset-frontend/src/explore/reducers/datasourcesReducer.ts

+  if (action.type === HYDRATE_EMBEDDED) {
+    // @ts-ignore
+    return { ...action.data.datasources };


superset-frontend/src/explore/reducers/datasourcesReducer.ts

+    // @ts-ignore
+    return { ...action.data.datasources };


superset-frontend/src/explore/reducers/datasourcesReducer.ts

+  if (action.type === HYDRATE_EMBEDDED) {
+    // @ts-ignore
+    return { ...action.data.datasources };
+  }


superset-frontend/src/dashboard/reducers/datasources.ts

+  if (action.type === HYDRATE_EMBEDDED) {
+    return {
+      ...action.data.datasources,
+    };
+  }


korbit-ai · 2025-05-14T19:10:50Z

superset-frontend/src/dashboard/reducers/dashboardState.js

+    [HYDRATE_EMBEDDED]() {
+      return { ...state, ...action.data.dashboardState };
+    },


Duplicate Hydration Logic for Embedded Charts

Tell me more

What is the issue?

The HYDRATE_EMBEDDED action handler is exactly the same as HYDRATE_DASHBOARD, which could lead to inconsistent state management if embedded charts require different hydration logic.

Why this matters

If embedded charts have unique state requirements or need special handling during hydration, using the same logic as dashboard hydration could cause incorrect behavior or state inconsistencies in embedded contexts.

Suggested change ∙ Feature Preview

Consider whether embedded charts need different hydration logic and modify accordingly. If they truly need the same logic, consider using a shared function:

const hydrateState = data => ({ ...state, ...data.dashboardState }); [HYDRATE_DASHBOARD]() { return hydrateState(action.data); }, [HYDRATE_EMBEDDED]() { return hydrateState(action.data); }

Provide feedback to improve future suggestions

_{💬 Looking for more details? Reply to this comment to chat with Korbit.}

superset/migrations/versions/2025-05-14_03-40_67dd9e3429b2_add_embedded_charts_table.py

+        sa.Column("created_on", sa.DateTime(), nullable=True),
+        sa.Column("changed_on", sa.DateTime(), nullable=True),


mistercrunch · 2025-05-14T20:06:19Z

I commented on the SIP back in October, #30075 (comment), but why not embedding a single-chart-dashboard?

There's a related idea which is allowing to embed parts of the Explore experience, potentaly allowing embedded use cases for light data exploration. Wondering if that's in-scope here (?) The idea would be to allow/limit part of the Explore experience, say I may want to hide/show different panels and/or controls... I'm guessing the idea here is more to simply embed a single chart, without interactions.

amaannawab923 · 2025-05-14T20:15:29Z

I commented on the SIP back in October, #30075 (comment), but why not embedding a single-chart-dashboard?

There's a related idea which is allowing to embed parts of the Explore experience, potentaly allowing embedded use cases for light data exploration. Wondering if that's in-scope here (?) The idea would be to allow/limit part of the Explore experience, say I may want to hide/show different panels and/or controls... I'm guessing the idea here is more to simply embed a single chart, without interactions.

This pr deals with embedding a single chart with normal dashboard interactons

What i understood from the previous comment of the sip was #30075 (comment) we need to have chart creation within dashboard ... I have implemented the same in a private fork , we used to call it easy charts

1.User can place a chart container on the grid <- completely empty which will have a button +add chart on it
2. It opens up a control panel in a popover with 3 controls , Groupby , metric & dataset & a top bar for selecting viz type
3. When the user saves the chart ... it gets saved to slices & gets absorbed by the chart container & the easy charts default attributes can also be edited via the chartlist
This allowed for flexibility for creating charts on the fly & more customisations via proper control panel if the end user wants to

We can connect on this , if easy charts are implemented in a seperate sip , we can bring those anytime here in embedded charts

@mistercrunch

amaannawab923 · 2025-05-14T20:54:02Z

Something like this @mistercrunch , Some level of explore controls in dashboard for the chart

Or something where its metric centric & the user can select metrics & create instant charts within dashboard like below

Or something where the user can just change the query groupby just by hitting a dropdown & selecting from a list of Groupbys like Display by departments like the below

Curious to know , whats the idea will fit best with superset so we can implement it

@mistercrunch

github-actions · 2025-05-15T23:35:41Z

@mistercrunch Processing your ephemeral environment request here. Action: up. More information on how to use or configure ephemeral environments

github-actions · 2025-05-15T23:43:40Z

@mistercrunch Ephemeral environment spinning up at http://35.87.137.37:8080. Credentials are 'admin'/'admin'. Please allow several minutes for bootstrapping and startup.

mistercrunch · 2025-05-15T23:52:59Z

Complex topic. We should probably talk.

Some thoughts related to all this:

it would be really great to be able to "edit chart", or "explore data" within a dashboard. Idea here is that within a dashboard, if you "edit chart" or "explore chart", we pop a large Modal with what is currently in the explore page, while keeping the user in the dashboard. Here there needs to be different options depending on the user level of access (do they have access to edit/modify the chart?). If we allow them to explore the data, what controls do we expose? Metric? Filters? Groupby? Filters? All? In the context of embedded, the person embedding needs to be able to define what it allows the user to do, if anything, within that modal.
it would be great to be able to embed a single chart, yes, and offer some options. Which controls do you want to expose? Do you allow the user to switch the metric? apply filters? ...
it would be great to allow "embedders" to externally control the chart, so that the host application can emit events inside the embedded chart, things like "group by something else", "switch the metric to this other metric", "apply this filter", ...

amaannawab923 · 2025-05-16T08:26:24Z

Complex topic. We should probably talk.

Some thoughts related to all this:

it would be really great to be able to "edit chart", or "explore data" within a dashboard. Idea here is that within a dashboard, if you "edit chart" or "explore chart", we pop a large Modal with what is currently in the explore page, while keeping the user in the dashboard. Here there needs to be different options depending on the user level of access (do they have access to edit/modify the chart?). If we allow them to explore the data, what controls do we expose? Metric? Filters? Groupby? Filters? All? In the context of embedded, the person embedding needs to be able to define what it allows the user to do, if anything, within that modal.

it would be great to be able to embed a single chart, yes, and offer some options. Which controls do you want to expose? Do you allow the user to switch the metric? apply filters? ...

it would be great to allow "embedders" to externally control the chart, so that the host application can emit events inside the embedded chart, things like "group by something else", "switch the metric to this other metric", "apply this filter", ...

Yes , i somewhat got the idea , we can connect on this ,

#33448

i have created an sip for the same , would include points from the ones mentioned above
@mistercrunch

rusackas · 2025-09-10T16:09:45Z

This needs a big rebase... do we still want to carry this through? The SIP is already approved, so it just needs to be completed, or the SIP may (eventually) be discarded due to inactivity.

Add "Embed chart" option to chart header dropdown menu on dashboards. When clicked, opens a modal that generates embed code (iframe + guest token) using the existing permalink + guest token infrastructure. Changes: - Add POST /api/v1/embedded_chart/ endpoint to create embeddable charts - Add EmbeddedChartModal component with allowed domains and TTL settings - Add "Embed chart" menu item to SliceHeaderControls - Add EmbedChart to MenuKeys enum This brings UI parity with PR apache#33424's approach while using our simpler ephemeral permalink-based architecture (no database model needed). 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>

nelsondrew and others added 9 commits April 9, 2025 16:13

Test fork commit

7a9f687

Merge branch 'master' of https://github.com/apache/superset

1cec095

Merge branch 'master' of https://github.com/apache/superset

696d5d9

Merge branch 'master' of https://github.com/apache/superset

672c16f

Merge branch 'master' of https://github.com/apache/superset

3df058e

Merge branch 'master' of https://github.com/apache/superset

dc5820d

Merge branch 'master' of https://github.com/apache/superset

dce9fe3

Merge branch 'master' of https://github.com/apache/superset

7f51dca

embeddable charts

18b944f

pull-request-size bot added the size/L label May 13, 2025

amaannawab923 added 2 commits May 14, 2025 02:43

Using dimensions of app

7ecfb4b

Resize glitch

3f3fc34

amaannawab923 changed the title ~~Feat(Embedding) : Embeddable Charts as per SIP~~ feat(Embedding) : Embeddable Charts as per SIP May 13, 2025

Embedded chart migration & tables

be5fab4

github-actions bot added the risk:db-migration PRs that require a DB migration label May 13, 2025

amaannawab923 added 3 commits May 14, 2025 11:42

Immediate hydration

3d72912

Resolving ts errors for datasources

d39b43e

Removing log

9215c2a

amaannawab923 changed the title ~~feat(Embedding) : Embeddable Charts as per SIP~~ feat(Embedding): Embeddable Charts as per SIP May 14, 2025

Apache headers

5250941

pull-request-size bot added size/XL and removed size/L labels May 14, 2025

Embedded get endpoint for chart

c92f484

github-actions bot added the api Related to the REST API label May 14, 2025

amaannawab923 added 4 commits May 14, 2025 17:59

embed chart post end point

6808c67

router correction

d7b804b

Delete embedded chart api

f8220a1

Embed chart controls

c999231

github-actions bot added the packages label May 14, 2025

hydrate embedded improvement

196aa28

rusackas added the review:draft label May 14, 2025

amaannawab923 added 2 commits May 14, 2025 23:05

dashboard info correction

4290d34

view . py changes to support both dashboards & charts

ce3958b

pull-request-size bot added size/XXL and removed size/XL labels May 14, 2025

amaannawab923 marked this pull request as ready for review May 14, 2025 18:41

amaannawab923 requested review from betodealmeida, eschutho, michael-s-molina and mistercrunch as code owners May 14, 2025 18:41

dosubot bot added the embedded label May 14, 2025

korbit-ai bot reviewed May 14, 2025

View reviewed changes

rusackas removed the review:draft label May 15, 2025

mistercrunch added the testenv-up label May 15, 2025

Enabling embedding in config.py

e3a65ba

github-actions bot removed the embedded label May 20, 2025

aminghadersohi mentioned this pull request Jan 8, 2026

feat(mcp): add embeddable charts with guest token authentication #36933

Open

6 tasks

		sa.Column("created_on", sa.DateTime(), nullable=True),
		sa.Column("changed_on", sa.DateTime(), nullable=True),

feat(Embedding): Embeddable Charts as per SIP #33424

Are you sure you want to change the base?

feat(Embedding): Embeddable Charts as per SIP #33424

Uh oh!

Conversation

amaannawab923 commented May 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

SUMMARY

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

TESTING INSTRUCTIONS

ADDITIONAL INFORMATION

Uh oh!

korbit-ai bot commented May 13, 2025

Uh oh!

codecov bot commented May 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

korbit-ai bot left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Review by Korbit AI

Korbit automatically attempts to detect when you fix issues in new commits.

Uh oh!

This comment was marked as resolved.

Uh oh!

This comment was marked as resolved.

Uh oh!

korbit-ai bot May 14, 2025

Choose a reason for hiding this comment

Insecure Default Embedding Policy

What is the issue?

Why this matters

Suggested change ∙ Feature Preview

Provide feedback to improve future suggestions

Uh oh!

This comment was marked as resolved.

Uh oh!

This comment was marked as resolved.

Uh oh!

This comment was marked as resolved.

Uh oh!

This comment was marked as resolved.

Uh oh!

This comment was marked as resolved.

Uh oh!

korbit-ai bot May 14, 2025

Choose a reason for hiding this comment

Duplicate Hydration Logic for Embedded Charts

What is the issue?

Why this matters

Suggested change ∙ Feature Preview

Provide feedback to improve future suggestions

Uh oh!

This comment was marked as resolved.

Uh oh!

mistercrunch commented May 14, 2025

Uh oh!

amaannawab923 commented May 14, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

amaannawab923 commented May 14, 2025

Uh oh!

github-actions bot commented May 15, 2025

Uh oh!

github-actions bot commented May 15, 2025

Uh oh!

mistercrunch commented May 15, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

amaannawab923 commented May 16, 2025

Uh oh!

rusackas commented Sep 10, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

amaannawab923 commented May 13, 2025 •

edited

Loading

codecov bot commented May 13, 2025 •

edited

Loading

korbit-ai bot left a comment •

edited

Loading

amaannawab923 commented May 14, 2025 •

edited

Loading

mistercrunch commented May 15, 2025 •

edited

Loading