Merge pull request #13176 from ToolJet/fix/pages-disable-module

Fix: disable pages on modules
This commit is contained in:
Johnson Cherian 2025-07-03 20:30:55 +05:30 committed by GitHub
commit 105b1a4b19
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 20 additions and 15 deletions

@ -1 +1 @@
Subproject commit 0ae5dac299e4a72e219243255722fbea2f530808
Subproject commit a2aaf14252bfe033d52c37675bfc75aa03bf9389

View file

@ -182,7 +182,7 @@ export const AppCanvas = ({ appId, isViewer = false, switchDarkMode, darkMode })
)}
style={canvasContainerStyles}
>
{showOnDesktop && (
{showOnDesktop && appType !== 'module' && (
<PagesSidebarNavigation
showHeader={showHeader}
isMobileDevice={currentLayout === 'mobile'}
@ -202,6 +202,7 @@ export const AppCanvas = ({ appId, isViewer = false, switchDarkMode, darkMode })
scrollbarWidth: 'none',
overflow: 'auto',
width: currentMode === 'view' ? `calc(100% - ${isViewerSidebarPinned ? '0px' : '0px'})` : '100%',
...(appType === 'module' && isModuleMode && { height: 'inherit' }),
}}
className={`app-${appId} _tooljet-page-${getPageId()}`}
>
@ -213,7 +214,7 @@ export const AppCanvas = ({ appId, isViewer = false, switchDarkMode, darkMode })
{environmentLoadingState !== 'loading' && (
<div>
<Container
id="canvas"
id={moduleId}
gridWidth={gridWidth}
canvasWidth={canvasWidth}
canvasHeight={canvasHeight}

View file

@ -6,6 +6,7 @@ import Tooltip from 'react-bootstrap/Tooltip';
import './rightSidebarToggle.scss';
import SolidIcon from '@/_ui/Icon/SolidIcons';
import { RIGHT_SIDE_BAR_TAB } from '@/AppBuilder/RightSideBar/rightSidebarConstants';
import { useModuleContext } from '@/AppBuilder/_contexts/ModuleContext';
import { SidebarItem } from './SidebarItem';
const RightSidebarToggle = ({ darkMode = false }) => {
@ -13,6 +14,7 @@ const RightSidebarToggle = ({ darkMode = false }) => {
(state) => [state.isRightSidebarOpen, state.setRightSidebarOpen],
shallow
);
const { appType } = useModuleContext();
const setActiveRightSideBarTab = useStore((state) => state.setActiveRightSideBarTab);
const activeRightSideBarTab = useStore((state) => state.activeRightSideBarTab);
const isRightSidebarPinned = useStore((state) => state.isRightSidebarPinned);
@ -50,16 +52,18 @@ const RightSidebarToggle = ({ darkMode = false }) => {
className={`left-sidebar-item left-sidebar-layout left-sidebar-inspector`}
tip="Component properties"
/>
<SidebarItem
selectedSidebarItem={activeRightSideBarTab === RIGHT_SIDE_BAR_TAB.PAGES}
onClick={() => {
handleToggle(RIGHT_SIDE_BAR_TAB.PAGES);
}}
darkMode={darkMode}
icon="file01"
className={`left-sidebar-item left-sidebar-layout left-sidebar-inspector`}
tip="Page settings"
/>
{appType !== 'module' && (
<SidebarItem
selectedSidebarItem={activeRightSideBarTab === RIGHT_SIDE_BAR_TAB.PAGES}
onClick={() => {
handleToggle(RIGHT_SIDE_BAR_TAB.PAGES);
}}
darkMode={darkMode}
icon="file01"
className={`left-sidebar-item left-sidebar-layout left-sidebar-inspector`}
tip="Page settings"
/>
)}
</div>
);
};

View file

@ -13,7 +13,7 @@ export const ModuleProvider = ({ moduleId, isModuleMode, appType, isModuleEditor
export const useModuleContext = () => {
const context = useContext(ModuleContext);
if (!context) {
throw new Error('useModuleContext must be used within a ModuleProvider');
return { moduleId: 'canvas', isModuleMode: false, isModuleEditor: false };
}
return context;
};
@ -21,7 +21,7 @@ export const useModuleContext = () => {
export const useModuleId = () => {
const context = useContext(ModuleContext);
if (!context) {
throw new Error('useModuleId must be used within a ModuleProvider');
return 'canvas';
}
return context.moduleId;