feat(Embedding): Embeddable Charts as per SIP

[amaannawab923]

SUMMARY

This pr implements Embeddable Charts as per SIP https://github.com/apache/superset/issues/30075#issue-2498101831 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[bot]]

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[bot]]

Codecov Report

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

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

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%)	:arrow_down:
javascript	?
presto	52.74% <63.79%> (-1.06%)	:arrow_down:
python	65.73% <63.79%> (+2.23%)	:arrow_up:
unit	61.32% <63.79%> (+3.69%)	:arrow_up:

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

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

:rocket: New features to boost your workflow:

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

[mistercrunch]

I commented on the SIP back in October, https://github.com/apache/superset/issues/30075#issuecomment-2442801379, 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]

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 https://github.com/apache/superset/issues/30075#issuecomment-2442801379 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]

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[bot]]

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

[github-actions[bot]]

@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]

Complex topic. We should probably talk.

Some thoughts related to all this:

1. 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.
2. 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? ...
3. 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]

Complex topic. We should probably talk.

Some thoughts related to all this:

1. 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.
2. 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? ...
3. 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 ,

https://github.com/apache/superset/issues/33448

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

[rusackas]

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.