Hide preview banner on deployed pages (#630)

mui · Jul 6, 2022 · 6d4a209 · 6d4a209
1 parent 3e578c9
commit 6d4a209
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 7 deletions.
diff --git a/packages/toolpad-app/src/runtime/AppCanvas/index.tsx b/packages/toolpad-app/src/runtime/AppCanvas/index.tsx
@@ -56,7 +56,6 @@ export default function AppCanvas({ basename }: AppCanvasProps) {
 
   const editorHooks: EditorHooks = React.useMemo(() => {
     return {
-      hidePreviewBanner: true,
       navigateToPage(pageNodeId) {
         fireEvent({ type: 'pageNavigationRequest', pageNodeId });
       },
@@ -66,6 +65,7 @@ export default function AppCanvas({ basename }: AppCanvasProps) {
   return state ? (
     <EditorHooksContext.Provider value={editorHooks}>
       <ToolpadApp
+        hidePreviewBanner
         dom={state.dom}
         version="preview"
         appId={state.appId}

diff --git a/packages/toolpad-app/src/runtime/ToolpadApp.tsx b/packages/toolpad-app/src/runtime/ToolpadApp.tsx
@@ -61,7 +61,6 @@ export interface NavigateToPage {
 
 export interface EditorHooks {
   navigateToPage?: NavigateToPage;
-  hidePreviewBanner?: boolean;
 }
 
 export const EditorHooksContext = React.createContext<EditorHooks>({});
@@ -567,18 +566,23 @@ function AppError({ error }: FallbackProps) {
 }
 
 export interface ToolpadAppProps {
+  hidePreviewBanner?: boolean;
   basename: string;
   appId: string;
   version: VersionOrPreview;
   dom: appDom.AppDom;
 }
 
-export default function ToolpadApp({ basename, appId, version, dom }: ToolpadAppProps) {
+export default function ToolpadApp({
+  basename,
+  appId,
+  version,
+  dom,
+  hidePreviewBanner,
+}: ToolpadAppProps) {
   const root = appDom.getApp(dom);
   const { pages = [], themes = [] } = appDom.getChildNodes(dom, root);
 
-  const { hidePreviewBanner } = React.useContext(EditorHooksContext);
-
   const theme = themes.length > 0 ? themes[0] : null;
 
   const appContext = React.useMemo(() => ({ appId, version }), [appId, version]);
@@ -605,9 +609,9 @@ export default function ToolpadApp({ basename, appId, version, dom }: ToolpadApp
         <DomContextProvider value={dom}>
           <AppThemeProvider node={theme}>
             <CssBaseline />
-            {hidePreviewBanner ? null : (
+            {version === 'preview' && !hidePreviewBanner ? (
               <Alert severity="info">This is a preview version of the application.</Alert>
-            )}
+            ) : null}
             <ErrorBoundary FallbackComponent={AppError}>
               <ResetNodeErrorsKeyProvider value={resetNodeErrorsKey}>
                 <React.Suspense fallback={<AppLoading />}>