diff --git a/superset-frontend/src/components/Menu/Menu.tsx b/superset-frontend/src/components/Menu/Menu.tsx
index 3337bc84a6ef8..01e0c1c5e3dd6 100644
--- a/superset-frontend/src/components/Menu/Menu.tsx
+++ b/superset-frontend/src/components/Menu/Menu.tsx
@@ -29,7 +29,7 @@ import Icons from 'src/components/Icons';
 import { URL_PARAMS } from 'src/constants';
 import RightMenu from './MenuRight';
 import { Languages } from './LanguagePicker';
-import { useEmbedded } from '../Emmbedded';
+import { useUiConfig } from '../UiConfigContext';
 
 interface BrandProps {
   path: string;
@@ -178,7 +178,7 @@ export function Menu({
 }: MenuProps) {
   const [showMenu, setMenu] = useState<MenuMode>('horizontal');
   const screens = useBreakpoint();
-  const embedded = useEmbedded();
+  const uiConig = useUiConfig();
 
   useEffect(() => {
     function handleResize() {
@@ -193,7 +193,7 @@ export function Menu({
   }, []);
 
   const standalone = getUrlParam(URL_PARAMS.standalone);
-  if (standalone || embedded.hideNav) return <></>;
+  if (standalone || uiConig.hideNav) return <></>;
 
   const renderSubMenu = ({
     label,
diff --git a/superset-frontend/src/components/Emmbedded/index.tsx b/superset-frontend/src/components/UiConfigContext/index.tsx
similarity index 61%
rename from superset-frontend/src/components/Emmbedded/index.tsx
rename to superset-frontend/src/components/UiConfigContext/index.tsx
index 9eca8ccd697f0..b5c2f53f27dc1 100644
--- a/superset-frontend/src/components/Emmbedded/index.tsx
+++ b/superset-frontend/src/components/UiConfigContext/index.tsx
@@ -17,41 +17,42 @@
  * under the License.
  */
 import React, { createContext, useContext, useState } from 'react';
+import { URL_PARAMS } from 'src/constants';
+import { getUrlParam } from 'src/utils/urlUtils';
 
-interface EmbeddedConfigType {
+interface UiConfigType {
   hideTitle: boolean;
   hideTab: boolean;
   hideNav: boolean;
-  hideChartFilter: boolean;
+  hideChartControls: boolean;
 }
-interface EmbeddedProviderProps {
+interface EmbeddedUiConfigProviderProps {
   children: JSX.Element;
-  config: number;
 }
 
-export const EmbeddedContext = createContext<EmbeddedConfigType>({
+export const UiConfigContext = createContext<UiConfigType>({
   hideTitle: false,
   hideTab: false,
   hideNav: false,
-  hideChartFilter: false,
+  hideChartControls: false,
 });
 
-export const useEmbedded = () => useContext(EmbeddedContext);
+export const useUiConfig = () => useContext(UiConfigContext);
 
-export const EmbeddedProvider: React.FC<EmbeddedProviderProps> = ({
+export const EmbeddedUiConfigProvider: React.FC<EmbeddedUiConfigProviderProps> = ({
   children,
-  config,
 }) => {
-  const formattedConfig = (config >>> 0).toString(2);
+  const config = getUrlParam(URL_PARAMS.uiConfig);
   const [embeddedConfig] = useState({
-    hideTitle: formattedConfig[0] === '1',
-    hideTab: formattedConfig[1] === '1',
-    hideNav: formattedConfig[2] === '1',
-    hideChartFilter: formattedConfig[3] === '1',
+    hideTitle: (config & 1) !== 0,
+    hideTab: (config & 2) !== 0,
+    hideNav: (config & 4) !== 0,
+    hideChartControls: (config & 8) !== 0,
   });
+
   return (
-    <EmbeddedContext.Provider value={embeddedConfig}>
+    <UiConfigContext.Provider value={embeddedConfig}>
       {children}
-    </EmbeddedContext.Provider>
+    </UiConfigContext.Provider>
   );
 };
diff --git a/superset-frontend/src/constants.ts b/superset-frontend/src/constants.ts
index cf04875ad7a2d..25ca890a1e062 100644
--- a/superset-frontend/src/constants.ts
+++ b/superset-frontend/src/constants.ts
@@ -27,8 +27,8 @@ export const URL_PARAMS = {
     name: 'standalone',
     type: 'number',
   },
-  embedded: {
-    name: 'embedded',
+  uiConfig: {
+    name: 'uiConfig',
     type: 'number',
   },
   preselectFilters: {
diff --git a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
index ce03d0320aa13..db5c0a60475d8 100644
--- a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
+++ b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
@@ -49,7 +49,7 @@ import {
 import FilterBar from 'src/dashboard/components/nativeFilters/FilterBar';
 import Loading from 'src/components/Loading';
 import { Global } from '@emotion/react';
-import { useEmbedded } from 'src/components/Emmbedded';
+import { useUiConfig } from 'src/components/UiConfigContext';
 import { shouldFocusTabs, getRootLevelTabsComponent } from './utils';
 import DashboardContainer from './DashboardContainer';
 import { useNativeFilters } from './state';
@@ -200,7 +200,7 @@ const StyledDashboardContent = styled.div<{
 
 const DashboardBuilder: FC<DashboardBuilderProps> = () => {
   const dispatch = useDispatch();
-  const embedded = useEmbedded();
+  const uiConfig = useUiConfig();
 
   const dashboardLayout = useSelector<RootState, DashboardLayout>(
     state => state.dashboardLayout.present,
@@ -246,8 +246,8 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
   const standaloneMode = getUrlParam(URL_PARAMS.standalone);
   const isReport = standaloneMode === DashboardStandaloneMode.REPORT;
   const hideDashboardHeader =
-    embedded.hideTitle ||
-    StandaloneMode === DashboardStandaloneMode.HIDE_NAV_AND_TITLE ||
+    uiConfig.hideTitle ||
+    standaloneMode === DashboardStandaloneMode.HIDE_NAV_AND_TITLE ||
     isReport;
 
   const barTopOffset =
@@ -293,7 +293,7 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
       <div>
         {!hideDashboardHeader && <DashboardHeader />}
         {dropIndicatorProps && <div {...dropIndicatorProps} />}
-        {!isReport && topLevelTabs && embedded.hideNav && (
+        {!isReport && topLevelTabs && uiConfig.hideNav && (
           <WithPopoverMenu
             shouldFocus={shouldFocusTabs}
             menuItems={[
@@ -326,7 +326,7 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
       hideDashboardHeader,
       isReport,
       topLevelTabs,
-      embedded.hideNav,
+      uiConfig.hideNav,
     ],
   );
 
diff --git a/superset-frontend/src/dashboard/components/SliceHeader/index.tsx b/superset-frontend/src/dashboard/components/SliceHeader/index.tsx
index 1cdf539b04722..a92fcc47a6683 100644
--- a/superset-frontend/src/dashboard/components/SliceHeader/index.tsx
+++ b/superset-frontend/src/dashboard/components/SliceHeader/index.tsx
@@ -18,7 +18,7 @@
  */
 import React, { FC, useMemo } from 'react';
 import { styled, t } from '@superset-ui/core';
-import { useEmbedded } from 'src/components/Emmbedded';
+import { useUiConfig } from 'src/components/UiConfigContext';
 import { Tooltip } from 'src/components/Tooltip';
 import { useDispatch, useSelector } from 'react-redux';
 import EditableTitle from 'src/components/EditableTitle';
@@ -84,7 +84,7 @@ const SliceHeader: FC<SliceHeaderProps> = ({
   formData,
 }) => {
   const dispatch = useDispatch();
-  const embedded = useEmbedded();
+  const uiConfig = useUiConfig();
   // TODO: change to indicator field after it will be implemented
   const crossFilterValue = useSelector<RootState, any>(
     state => state.dataMask[slice?.slice_id]?.filterState?.value,
@@ -158,10 +158,10 @@ const SliceHeader: FC<SliceHeaderProps> = ({
                 />
               </Tooltip>
             )}
-            {!embedded.hideChartFilter && (
+            {!uiConfig.hideChartControls && (
               <FiltersBadge chartId={slice.slice_id} />
             )}
-            {!embedded.hideChartFilter && (
+            {!uiConfig.hideChartControls && (
               <SliceHeaderControls
                 slice={slice}
                 isCached={isCached}
diff --git a/superset-frontend/src/views/App.tsx b/superset-frontend/src/views/App.tsx
index f6275fc4e5acc..605ed207861a4 100644
--- a/superset-frontend/src/views/App.tsx
+++ b/superset-frontend/src/views/App.tsx
@@ -29,11 +29,9 @@ import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 import { QueryParamProvider } from 'use-query-params';
 import { initFeatureFlags } from 'src/featureFlags';
-import { URL_PARAMS } from 'src/constants';
 import { ThemeProvider } from '@superset-ui/core';
 import { DynamicPluginProvider } from 'src/components/DynamicPlugins';
-import { EmbeddedProvider } from 'src/components/Emmbedded';
-import { getUrlParam } from 'src/utils/urlUtils';
+import { EmbeddedUiConfigProvider } from 'src/components/UiConfigContext';
 import ErrorBoundary from 'src/components/ErrorBoundary';
 import Loading from 'src/components/Loading';
 import Menu from 'src/components/Menu/Menu';
@@ -66,14 +64,12 @@ const RootContextProviders: React.FC = ({ children }) => {
     lastLocationPathname = location.pathname;
   }, [location.pathname]);
 
-  const config = getUrlParam(URL_PARAMS.embedded);
-
   return (
     <ThemeProvider theme={theme}>
       <ReduxProvider store={store}>
         <DndProvider backend={HTML5Backend}>
           <FlashProvider messages={common.flash_messages}>
-            <EmbeddedProvider config={config}>
+            <EmbeddedUiConfigProvider>
               <DynamicPluginProvider>
                 <QueryParamProvider
                   ReactRouterRoute={Route}
@@ -82,7 +78,7 @@ const RootContextProviders: React.FC = ({ children }) => {
                   {children}
                 </QueryParamProvider>
               </DynamicPluginProvider>
-            </EmbeddedProvider>
+            </EmbeddedUiConfigProvider>
           </FlashProvider>
         </DndProvider>
       </ReduxProvider>