dosubot[bot] commented on issue #30374:
URL: https://github.com/apache/superset/issues/30374#issuecomment-2371256794
<!-- Answer -->
To make the applied filters visible on charts using the
`@superset-ui/embedded-sdk` package without showing the chart controls, you
need to ensure that the `FiltersBadge` component is always rendered. The
current configuration might not be sufficient due to conditional checks within
the `FiltersBadge` component.
Here is a more detailed approach:
1. Ensure that `filters.visible` is set to `true` in the `dashboardUiConfig`.
2. Modify the `FiltersBadge` component to always render, regardless of the
`hideChartControls` setting.
Here is the updated code snippet:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Superset Embedding POC</title>
<style>
iframe {
width: 100%;
height: 100%;
border: none;
}
</style>
<script src="https://unpkg.com/@superset-ui/embedded-sdk"></script>
</head>
<body>
<div style="width: 100%; height: 800px;" id="my-superset-container"></div>
<script>
const dashboardConfig = {
hideTab: true,
hideTitle: true,
hideChartControls: true,
filters: {
visible: true, // Ensure this is set to true
expanded: false,
}
};
supersetEmbeddedSdk.embedDashboard({
id: 'embedded-id',
supersetDomain: 'domain',
mountPoint: document.getElementById("my-superset-container"),
fetchGuestToken: () => 'guest-token',
dashboardUiConfig: dashboardConfig,
});
</script>
</body>
</html>
```
Additionally, ensure that the `FiltersBadge` component is not conditionally
hidden based on the `hideChartControls` setting. The `FiltersBadge` should
always be rendered to display the applied filters:
```tsx
<FiltersBadge chartId={slice.slice_id} />
{!uiConfig.hideChartControls && (
<SliceHeaderControls
slice={slice}
isCached={isCached}
isExpanded={isExpanded}
cachedDttm={cachedDttm}
updatedDttm={updatedDttm}
toggleExpandSlice={toggleExpandSlice}
forceRefresh={forceRefresh}
logExploreChart={logExploreChart}
logEvent={logEvent}
exportCSV={exportCSV}
exportPivotCSV={exportPivotCSV}
exportFullCSV={exportFullCSV}
exportXLSX={exportXLSX}
exportFullXLSX={exportFullXLSX}
supersetCanExplore={supersetCanExplore}
supersetCanShare={supersetCanShare}
supersetCanCSV={supersetCanCSV}
componentId={componentId}
dashboardId={dashboardId}
addSuccessToast={addSuccessToast}
addDangerToast={addDangerToast}
handleToggleFullSize={handleToggleFullSize}
isFullSize={isFullSize}
isDescriptionExpanded={isExpanded}
chartStatus={chartStatus}
formData={formData}
exploreUrl={exploreUrl}
crossFiltersEnabled={isCrossFiltersEnabled}
/>
)}
```
By ensuring that the `FiltersBadge` is always rendered, you can make the
applied filters visible on the charts without showing the chart controls
<sup>[[1]](https://github.com/apache/superset/blob/master/superset-frontend/src/dashboard/components/SliceHeader/index.tsx)</sup><sup>[[2]](https://github.com/apache/superset/blob/master/superset-frontend/src/dashboard/components/FiltersBadge/index.tsx)</sup>.
<!-- Dosu Comment Footer -->
*To continue talking to [Dosu](https://dosu.dev), mention @dosu.*
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]