GitHub user dosubot[bot] added a comment to the discussion: Embedding Dashboard
<!-- Greeting --> Hi @FluxBee1! I'm [Dosu](https://go.dosu.dev/dosubot) and Iām helping the superset team. <!-- Answer --> Superset provides the [`@superset-ui/embedded-sdk`](https://github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-embedded-sdk/README.md) npm package for embedding dashboards in React apps: ```javascript import { embedDashboard } from "@superset-ui/embedded-sdk"; embedDashboard({ id: "abc123", supersetDomain: "https://superset.example.com";, mountPoint: document.getElementById("my-superset-container"), fetchGuestToken: () => fetchGuestTokenFromBackend(), dashboardUiConfig: { hideTitle: true, filters: { expanded: true } } }); ``` **However, layout modification is not supported in embedded mode.** [Embedded dashboards are strictly read-only](https://github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/Header/index.jsx#L505-L595) ā the code detects embedded mode and disables edit capabilities. The `dashboardUiConfig` only controls [visibility of UI elements](https://github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-embedded-sdk/src/index.ts#L36-L70) (hiding titles, tabs, chart controls) but cannot enable editing. [There's no way to allow editing specific dashboard properties without full edit access](https://github.com/apache/superset/discussions/33981#discussioncomment-13566755) ā the permission model is all-or-nothing. **What you can do:** - Use `dashboardUiConfig` to show/hide elements like filters, titles, and tabs - Subscribe to filter changes via `observeDataMask()` - Apply theming dynamically with `setThemeConfig()` If you need users to modify layouts, they would need to do so through the main Superset UI with proper authenticated access rather than the embedded view. <!-- Dosu Comment Footer --> *To reply, just mention [@dosu](https://go.dosu.dev/dosubot).* --- <sup>How did I do? [Good](https://app.dosu.dev/response-feedback/df47461a-71a7-4b7d-bd13-8c2698c922df?feedback_type=great_response) | [Irrelevant](https://app.dosu.dev/response-feedback/df47461a-71a7-4b7d-bd13-8c2698c922df?feedback_type=irrelevant_answer) | [Incorrect](https://app.dosu.dev/response-feedback/df47461a-71a7-4b7d-bd13-8c2698c922df?feedback_type=incorrect_sources) | [Verbose](https://app.dosu.dev/response-feedback/df47461a-71a7-4b7d-bd13-8c2698c922df?feedback_type=too_verbose) | [Hallucination](https://app.dosu.dev/response-feedback/df47461a-71a7-4b7d-bd13-8c2698c922df?feedback_type=hallucination) | [Report š](https://app.dosu.dev/response-feedback/df47461a-71a7-4b7d-bd13-8c2698c922df?feedback_type=bug_report) | [Other](https://app.dosu.dev/response-feedback/df47461a-71a7-4b7d-bd13-8c2698c922df?feedback_type=other)</sup> [](https://app.dosu.dev/a28d3c7e-a9d3-459e-9fb6-3a6f9ff4f357/ask?utm_source=github) [](https://cursor.com/link/prompt?text=Superset%20provides%20the%20%5B%60%40superset-ui/embedded-sdk%60%5D%28https%3A//github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-embedded-sdk/README.md%29%20npm%20package%20for%20embedding%20dashboards%20in%20React%20apps%3A%0A%0A%60%60%60javascript%0Aimport%20%7B%20embedDashboard%20%7D%20from%20%22%40superset-ui/embedded-sdk%22%3B%0A%0AembedDashboard%28%7B%0A%20%20id%3A%20%22abc123%22%2C%0A%20%20supersetDomain%3A%20%22https%3A//superset.example.com%22%2C%0A%20%20mountPoint%3A%20document.getElementById%28%22my-superset-container%22%29%2C%0A%20%20fetchGuestToken%3A%20%28%29%20%3D%3E%20fetchGuestTokenFromBackend%28%29%2C%0A%20%20dashboardUiConfig%3A%20%7B%0A%20%20%20%20hideTitle%3A%20true%2C%0A%20%20%20%20filters%3A%20%7 B%20expanded%3A%20true%20%7D%0A%20%20%7D%0A%7D%29%3B%0A%60%60%60%0A%0A%2A%2AHowever%2C%20layout%20modification%20is%20not%20supported%20in%20embedded%20mode.%2A%2A%20%5BEmbedded%20dashboards%20are%20strictly%20read-only%5D%28https%3A//github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-frontend/src/dashboard/components/Header/index.jsx%23L505-L595%29%20%E2%80%94%20the%20code%20detects%20embedded%20mode%20and%20disables%20edit%20capabilities.%20The%20%60dashboardUiConfig%60%20only%20controls%20%5Bvisibility%20of%20UI%20elements%5D%28https%3A//github.com/apache/superset/blob/829e4d92d91ceae4b43b1ed3b063ffe45377799c/superset-embedded-sdk/src/index.ts%23L36-L70%29%20%28hiding%20titles%2C%20tabs%2C%20chart%20controls%29%20but%20cannot%20enable%20editing.%0A%0A%5BThere%27s%20no%20way%20to%20allow%20editing%20specific%20dashboard%20properties%20without%20full%20edit%20access%5D%28https%3A//github.com/apache/superset/discussions/33981%23discussioncomment-135667 55%29%20%E2%80%94%20the%20permission%20model%20is%20all-or-nothing.%0A%0A%2A%2AWhat%20you%20can%20do%3A%2A%2A%0A-%20Use%20%60dashboardUiConfig%60%20to%20show/hide%20elements%20like%20filters%2C%20titles%2C%20and%20tabs%0A-%20Subscribe%20to%20filter%20changes%20via%20%60observeDataMask%28%29%60%0A-%20Apply%20theming%20dynamically%20with%20%60setThemeConfig%28%29%60%0A%0AIf%20you%20need%20users%20to%20modify%20layouts%2C%20they%20would%20need%20to%20do%20so%20through%20the%20main%20Superset%20UI%20with%20proper%20authenticated%20access%20rather%20than%20the%20embedded%20view.) [](https://go.dosu.dev/discord-bot) [](https://twitter.com/intent/tweet?text=%40dosu_ai%20helped%20me%20solve%20this%20issue!&url=https%3A//github.com/apache/superset/discussions/38166) GitHub link: https://github.com/apache/superset/discussions/38166#discussioncomment-15889667 ---- This is an automatically sent email for [email protected]. To unsubscribe, please send an email to: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
