diff --git a/frontend/src/AppBuilder/Viewer/DesktopHeader.jsx b/frontend/src/AppBuilder/Viewer/DesktopHeader.jsx
index 43bb7acb4f..0c297b862c 100644
--- a/frontend/src/AppBuilder/Viewer/DesktopHeader.jsx
+++ b/frontend/src/AppBuilder/Viewer/DesktopHeader.jsx
@@ -19,13 +19,10 @@ const DesktopHeader = ({
isAppLoaded,
changeToDarkMode,
}) => {
- const { editingVersion, showDarkModeToggle, isReleasedVersionId } = useStore(
+ const { showDarkModeToggle, isReleasedVersionId } = useStore(
(state) => ({
- editingVersion: state?.editingVersion,
- isReleasedVersionId: state?.releasedVersionId == state.editingVersion || state.isVersionReleased,
- switchDarkMode: state.switchDarkMode,
+ isReleasedVersionId: state?.releasedVersionId == state.selectedVersion?.id || state.isVersionReleased,
showDarkModeToggle: state.globalSettings.appMode === 'auto' || !state.globalSettings.appMode,
- appMode: state.globalSettings.appMode,
}),
shallow
);
diff --git a/frontend/src/AppBuilder/_hooks/useAppData.js b/frontend/src/AppBuilder/_hooks/useAppData.js
index 604339f9e1..e216cbadad 100644
--- a/frontend/src/AppBuilder/_hooks/useAppData.js
+++ b/frontend/src/AppBuilder/_hooks/useAppData.js
@@ -190,7 +190,7 @@ const useAppData = (appId, moduleId, mode = 'edit', { environmentId, versionId }
);
setPages(pages, moduleId);
- setPageSettings(deepCamelCase(appData?.editing_version?.page_settings));
+ setPageSettings(deepCamelCase(appData?.editing_version?.page_settings || appData?.page_settings));
// set starting page as homepage initially
let startingPage = appData.pages.find((page) => page.id === homePageId);
diff --git a/frontend/src/_components/DarkModeToggle.jsx b/frontend/src/_components/DarkModeToggle.jsx
index 56a7639842..2f0ef8474c 100644
--- a/frontend/src/_components/DarkModeToggle.jsx
+++ b/frontend/src/_components/DarkModeToggle.jsx
@@ -102,7 +102,9 @@ export const DarkModeToggle = function DarkModeToggle({
{showText && (
- Switch to {!darkMode ? 'dark mode' : 'light mode'}
+
+ Switch to {!darkMode ? 'dark mode' : 'light mode'}
+
)}
diff --git a/frontend/src/_hooks/useAppDarkMode.js b/frontend/src/_hooks/useAppDarkMode.js
index c89fb204ed..7e5b33f87b 100644
--- a/frontend/src/_hooks/useAppDarkMode.js
+++ b/frontend/src/_hooks/useAppDarkMode.js
@@ -1,31 +1,17 @@
-import { useCallback, useMemo } from 'react';
+import { useMemo } from 'react';
import { shallow } from 'zustand/shallow';
-import { useEditorStore } from '@/_stores/editorStore';
-import { useAppDataStore } from '@/_stores/appDataStore';
+import useStore from '@/AppBuilder/_stores/store';
const useAppDarkMode = () => {
- const { appMode, setAppMode } = useEditorStore(
- (state) => ({
- appMode: state.appMode,
- setAppMode: state.actions.setAppMode,
- }),
- shallow
- );
-
- const { isTJDarkMode } = useAppDataStore(
+ const { appMode, globalSettingsChanged, isTJDarkMode } = useStore(
(state) => ({
+ appMode: state.globalSettings.appMode,
+ globalSettingsChanged: state.globalSettingsChanged,
isTJDarkMode: state.isTJDarkMode,
}),
shallow
);
- const handleAppModeChange = useCallback(
- (appMode = 'auto') => {
- setAppMode(appMode);
- },
- [setAppMode]
- );
-
const isAppDarkMode = useMemo(() => {
if (appMode === 'light') {
return false;
@@ -37,7 +23,7 @@ const useAppDarkMode = () => {
}, [appMode, isTJDarkMode]);
return {
- onAppModeChange: handleAppModeChange,
+ onAppModeChange: globalSettingsChanged,
appMode,
isAppDarkMode,
};
diff --git a/server/src/controllers/apps.controller.v2.ts b/server/src/controllers/apps.controller.v2.ts
index 00ef864b35..746e0fdca0 100644
--- a/server/src/controllers/apps.controller.v2.ts
+++ b/server/src/controllers/apps.controller.v2.ts
@@ -153,6 +153,7 @@ export class AppsControllerV2 {
homePageId: versionToLoad.homePageId,
globalSettings: { ...versionToLoad.globalSettings, theme: appTheme },
showViewerNavigation: versionToLoad.showViewerNavigation,
+ pageSettings: versionToLoad?.pageSettings,
};
}