Merge pull request #1568 from merico-dev/1567-emotion-cache-is-not-av…

…ailable-in-context-make-sure-that-you-have-mantineemotionprovider-in-the-component-tree 1567 emotion cache is not available in context make sure that you have mantineemotionprovider in the component tree
merico-dev · Nov 11, 2024 · 21c4f8f · 21c4f8f
2 parents e9e324b + e877355
commit 21c4f8f
Show file tree

Hide file tree

Showing 7 changed files with 93 additions and 87 deletions.
diff --git a/api/package.json b/api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/api",
-  "version": "13.43.9",
+  "version": "13.43.10",
   "description": "",
   "main": "index.js",
   "scripts": {

diff --git a/dashboard/package.json b/dashboard/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/dashboard",
-  "version": "13.43.9",
+  "version": "13.43.10",
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public",

diff --git a/dashboard/src/dashboard-editor/dashboard-editor.tsx b/dashboard/src/dashboard-editor/dashboard-editor.tsx
@@ -29,6 +29,7 @@ import { DashboardContentDBType, IDashboard } from '../types/dashboard';
 import './dashboard-editor.css';
 import { DashboardEditorHeader, DashboardEditorNavbar, EditorSpotlight, Settings } from './ui';
 import { useLoadMonacoEditor } from './utils/load-monaco-editor';
+import { MantineEmotionProvider } from '@mantine/emotion';
 
 registerThemes();
 registerECharts();
@@ -157,57 +158,59 @@ const _DashboardEditor = (
     lang,
   });
   return (
-    <I18nextContextProvider lang={lang}>
-      <ModalsProvider>
-        <DatesProvider>
-          <DashboardThemeContextProvider value={{ searchButtonProps: config.searchButtonProps }}>
-            <DashboardModelContextProvider value={model}>
-              <ContentModelContextProvider value={model.content}>
-                <LayoutStateContext.Provider
-                  value={{
-                    inEditMode: true,
-                  }}
-                >
-                  <EditorSpotlight />
-                  <PluginContext.Provider value={pluginContext}>
-                    <ServiceLocatorProvider configure={configureServices}>
-                      <AppShell
-                        padding={0}
-                        navbar={{
-                          width: { base: 200, xs: 200, sm: 200, md: 220, lg: 240, xl: 260 },
-                          breakpoint: 'xxs', //FIXME(leto): not sure
-                        }}
-                        styles={AppShellStyles}
-                      >
-                        <DashboardEditorHeader
-                          onExit={onExit}
-                          saveDashboardChanges={saveDashboardChanges}
-                          headerSlot={headerSlot}
-                        />
-                        <DashboardEditorNavbar />
-                        <AppShell.Main>
-                          <Box
-                            className={`${className} dashboard-root`}
-                            sx={{
-                              position: 'relative',
-                            }}
-                          >
-                            {model.content.views.visibleViews.map((view) => (
-                              <DashboardViewEditor key={view.id} view={view} />
-                            ))}
-                          </Box>
-                        </AppShell.Main>
-                      </AppShell>
-                      <Settings />
-                    </ServiceLocatorProvider>
-                  </PluginContext.Provider>
-                </LayoutStateContext.Provider>
-              </ContentModelContextProvider>
-            </DashboardModelContextProvider>
-          </DashboardThemeContextProvider>
-        </DatesProvider>
-      </ModalsProvider>
-    </I18nextContextProvider>
+    <MantineEmotionProvider>
+      <I18nextContextProvider lang={lang}>
+        <ModalsProvider>
+          <DatesProvider>
+            <DashboardThemeContextProvider value={{ searchButtonProps: config.searchButtonProps }}>
+              <DashboardModelContextProvider value={model}>
+                <ContentModelContextProvider value={model.content}>
+                  <LayoutStateContext.Provider
+                    value={{
+                      inEditMode: true,
+                    }}
+                  >
+                    <EditorSpotlight />
+                    <PluginContext.Provider value={pluginContext}>
+                      <ServiceLocatorProvider configure={configureServices}>
+                        <AppShell
+                          padding={0}
+                          navbar={{
+                            width: { base: 200, xs: 200, sm: 200, md: 220, lg: 240, xl: 260 },
+                            breakpoint: 'xxs', //FIXME(leto): not sure
+                          }}
+                          styles={AppShellStyles}
+                        >
+                          <DashboardEditorHeader
+                            onExit={onExit}
+                            saveDashboardChanges={saveDashboardChanges}
+                            headerSlot={headerSlot}
+                          />
+                          <DashboardEditorNavbar />
+                          <AppShell.Main>
+                            <Box
+                              className={`${className} dashboard-root`}
+                              sx={{
+                                position: 'relative',
+                              }}
+                            >
+                              {model.content.views.visibleViews.map((view) => (
+                                <DashboardViewEditor key={view.id} view={view} />
+                              ))}
+                            </Box>
+                          </AppShell.Main>
+                        </AppShell>
+                        <Settings />
+                      </ServiceLocatorProvider>
+                    </PluginContext.Provider>
+                  </LayoutStateContext.Provider>
+                </ContentModelContextProvider>
+              </DashboardModelContextProvider>
+            </DashboardThemeContextProvider>
+          </DatesProvider>
+        </ModalsProvider>
+      </I18nextContextProvider>
+    </MantineEmotionProvider>
   );
 };
 

diff --git a/dashboard/src/dashboard-render/dashboard-render.tsx b/dashboard/src/dashboard-render/dashboard-render.tsx
@@ -26,6 +26,7 @@ import { useTopLevelServices } from '../components/plugins/service/use-top-level
 import { DashboardContentDBType, IDashboard } from '../types/dashboard';
 import './dashboard-render.css';
 import { createDashboardRenderModel } from './model';
+import { MantineEmotionProvider } from '@mantine/emotion';
 
 registerThemes();
 registerECharts();
@@ -130,40 +131,42 @@ const _ReadOnlyDashboard = ({
     lang,
   });
   return (
-    <I18nextContextProvider lang={lang}>
-      <ModalsProvider>
-        <DatesProvider>
-          <DashboardThemeContextProvider value={{ searchButtonProps: config.searchButtonProps }}>
-            <DashboardModelContextProvider value={model}>
-              <ContentModelContextProvider value={model.content}>
-                <FullScreenPanelContext.Provider
-                  value={{
-                    fullScreenPanelID,
-                    setFullScreenPanelID,
-                  }}
-                >
-                  <LayoutStateContext.Provider
+    <MantineEmotionProvider>
+      <I18nextContextProvider lang={lang}>
+        <ModalsProvider>
+          <DatesProvider>
+            <DashboardThemeContextProvider value={{ searchButtonProps: config.searchButtonProps }}>
+              <DashboardModelContextProvider value={model}>
+                <ContentModelContextProvider value={model.content}>
+                  <FullScreenPanelContext.Provider
                     value={{
-                      inEditMode: false,
+                      fullScreenPanelID,
+                      setFullScreenPanelID,
                     }}
                   >
-                    <Box className={`${className} dashboard-root`}>
-                      <PluginContext.Provider value={pluginContext}>
-                        <ServiceLocatorProvider configure={configureServices}>
-                          {model.content.views.visibleViews.map((view) => (
-                            <DashboardViewRender key={view.id} view={view} />
-                          ))}
-                        </ServiceLocatorProvider>
-                      </PluginContext.Provider>
-                    </Box>
-                  </LayoutStateContext.Provider>
-                </FullScreenPanelContext.Provider>
-              </ContentModelContextProvider>
-            </DashboardModelContextProvider>
-          </DashboardThemeContextProvider>
-        </DatesProvider>
-      </ModalsProvider>
-    </I18nextContextProvider>
+                    <LayoutStateContext.Provider
+                      value={{
+                        inEditMode: false,
+                      }}
+                    >
+                      <Box className={`${className} dashboard-root`}>
+                        <PluginContext.Provider value={pluginContext}>
+                          <ServiceLocatorProvider configure={configureServices}>
+                            {model.content.views.visibleViews.map((view) => (
+                              <DashboardViewRender key={view.id} view={view} />
+                            ))}
+                          </ServiceLocatorProvider>
+                        </PluginContext.Provider>
+                      </Box>
+                    </LayoutStateContext.Provider>
+                  </FullScreenPanelContext.Provider>
+                </ContentModelContextProvider>
+              </DashboardModelContextProvider>
+            </DashboardThemeContextProvider>
+          </DatesProvider>
+        </ModalsProvider>
+      </I18nextContextProvider>
+    </MantineEmotionProvider>
   );
 };
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/root",
-  "version": "13.43.9",
+  "version": "13.43.10",
   "private": true,
   "workspaces": [
     "api",

diff --git a/settings-form/package.json b/settings-form/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devtable/settings-form",
-  "version": "13.43.9",
+  "version": "13.43.10",
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public",

diff --git a/website/package.json b/website/package.json
@@ -2,7 +2,7 @@
   "name": "@devtable/website",
   "private": true,
   "license": "Apache-2.0",
-  "version": "13.43.9",
+  "version": "13.43.10",
   "scripts": {
     "dev": "vite",
     "preview": "vite preview"