fix: page mode toggle no longer overwrites default preference (#1996)

The header edit/read toggle now controls only the current session's mode
without saving it as the user's preference. The saved preference (set in
profile settings) is applied once on initial load and sticks across page
navigations within the session, so navigating to a new page no longer
resets the mode mid-session.

Fixes #1693

apps/client/public/locales/en-US/translation.json

@@ -361,6 +361,8 @@
   "Create block quote.": "Create block quote.",
   "Insert code snippet.": "Insert code snippet.",
   "Insert horizontal rule divider": "Insert horizontal rule divider",
+  "Page break": "Page break",
+  "Insert a page break for printing.": "Insert a page break for printing.",
   "Upload any image from your device.": "Upload any image from your device.",
   "Upload any video from your device.": "Upload any video from your device.",
   "Upload any audio from your device.": "Upload any audio from your device.",

apps/client/src/ee/components/sso-login.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { useWorkspacePublicDataQuery } from "@/features/workspace/queries/workspace-query.ts";
 import { Button, Divider, Stack } from "@mantine/core";
 import { IconLock, IconServer } from "@tabler/icons-react";
@@ -7,15 +7,37 @@ import { buildSsoLoginUrl } from "@/ee/security/sso.utils.ts";
 import { SSO_PROVIDER } from "@/ee/security/contants.ts";
 import { GoogleIcon } from "@/components/icons/google-icon.tsx";
 import { LdapLoginModal } from "@/ee/components/ldap-login-modal.tsx";
+import { getRedirectParam } from "@/lib/app-route.ts";
+import useCurrentUser from "@/features/user/hooks/use-current-user.ts";
+
+const SSO_AUTO_ATTEMPT_KEY = "docmost:ssoAutoAttempt";
+const SSO_AUTO_ATTEMPT_TTL_MS = 5 * 60_000;
+
+function recentAutoAttempt(): boolean {
+  try {
+    const raw = window.sessionStorage.getItem(SSO_AUTO_ATTEMPT_KEY);
+    if (!raw) return false;
+    const ts = Number(raw);
+    return Number.isFinite(ts) && Date.now() - ts < SSO_AUTO_ATTEMPT_TTL_MS;
+  } catch {
+    return false;
+  }
+}
+
+function markAutoAttempt(): void {
+  try {
+    window.sessionStorage.setItem(SSO_AUTO_ATTEMPT_KEY, String(Date.now()));
+  } catch {
+    /* sessionStorage unavailable (private mode, etc.) — best effort */
+  }
+}
 
 export default function SsoLogin() {
   const { data, isLoading } = useWorkspacePublicDataQuery();
+  const { data: currentUser } = useCurrentUser();
   const [ldapModalOpened, setLdapModalOpened] = useState(false);
   const [selectedLdapProvider, setSelectedLdapProvider] = useState<IAuthProvider | null>(null);
-
+  const autoRedirectedRef = useRef(false);
-  if (!data?.authProviders || data?.authProviders?.length === 0) {
-    return null;
-  }
 
   const handleSsoLogin = (provider: IAuthProvider) => {
     if (provider.type === SSO_PROVIDER.LDAP) {
@@ -28,10 +50,47 @@ export default function SsoLogin() {
         providerId: provider.id,
         type: provider.type,
         workspaceId: data.id,
+        redirect: getRedirectParam() ?? undefined,
       });
     }
   };
 
+  // Auto-redirect when SSO is enforced and there is exactly one non-LDAP
+  // provider. The user has no other option, so skip the extra click.
+  useEffect(() => {
+    if (autoRedirectedRef.current) return;
+    if (!data?.enforceSso) return;
+    if (!data.authProviders || data.authProviders.length !== 1) return;
+    const onlyProvider = data.authProviders[0];
+    if (onlyProvider.type === SSO_PROVIDER.LDAP) return;
+
+    // Already signed in: let useRedirectIfAuthenticated handle navigation
+    // instead of racing it through the IdP.
+    if (currentUser?.user) return;
+
+    // Explicit logout: don't immediately bounce them back to the IdP.
+    const params = new URLSearchParams(window.location.search);
+    if (params.has("logout")) return;
+
+    // Circuit-breaker: if we already auto-redirected within the TTL, the
+    // user came back (likely from an IdP failure). Show the page so they
+    // can read errors or pick a different account.
+    if (recentAutoAttempt()) return;
+
+    autoRedirectedRef.current = true;
+    markAutoAttempt();
+    window.location.href = buildSsoLoginUrl({
+      providerId: onlyProvider.id,
+      type: onlyProvider.type,
+      workspaceId: data.id,
+      redirect: getRedirectParam() ?? undefined,
+    });
+  }, [data, currentUser]);
+
+  if (!data?.authProviders || data?.authProviders?.length === 0) {
+    return null;
+  }
+
   const getProviderIcon = (provider: IAuthProvider) => {
     if (provider.type === SSO_PROVIDER.GOOGLE) {
       return <GoogleIcon size={16} />;

apps/client/src/ee/security/sso.utils.ts

@@ -18,14 +18,21 @@ export function buildSsoLoginUrl(opts: {
   providerId: string;
   type: SSO_PROVIDER;
   workspaceId?: string;
+  redirect?: string;
 }): string {
-  const { providerId, type, workspaceId } = opts;
+  const { providerId, type, workspaceId, redirect } = opts;
   const domain = getAppUrl();
 
+  const params = new URLSearchParams();
+  if (redirect) params.set("redirect", redirect);
+
   if (type === SSO_PROVIDER.GOOGLE) {
-    return `${getServerAppUrl()}/api/sso/${type}/login?workspaceId=${workspaceId}`;
+    if (workspaceId) params.set("workspaceId", workspaceId);
+    return `${getServerAppUrl()}/api/sso/${type}/login?${params.toString()}`;
   }
-  return `${domain}/api/sso/${type}/${providerId}/login`;
+  const query = params.toString();
+  const base = `${domain}/api/sso/${type}/${providerId}/login`;
+  return query ? `${base}?${query}` : base;
 }
 
 export function getGoogleSignupUrl(): string {

apps/client/src/features/auth/hooks/use-auth.ts

@@ -166,7 +166,7 @@ export default function useAuth() {
   const handleLogout = async () => {
     setCurrentUser(RESET);
     await logout();
-    window.location.replace(APP_ROUTE.AUTH.LOGIN);
+    window.location.replace(`${APP_ROUTE.AUTH.LOGIN}?logout=1`);
   };
 
   const handleForgotPassword = async (data: IForgotPassword) => {

apps/client/src/features/editor/atoms/editor-atoms.ts

@@ -1,5 +1,6 @@
 import { atom } from "jotai";
 import { Editor } from "@tiptap/core";
+import { PageEditMode } from "@/features/user/types/user.types.ts";
 
 export const pageEditorAtom = atom<Editor | null>(null);
 
@@ -12,3 +13,7 @@ export const yjsConnectionStatusAtom = atom<string>("");
 export const showAiMenuAtom = atom(false);
 
 export const showLinkMenuAtom = atom(false);
+
+// Current page's edit mode — initialized from the user's saved preference on
+// first load, can be toggled locally without persisting to the server.
+export const currentPageEditModeAtom = atom<PageEditMode>(PageEditMode.Edit);

apps/client/src/features/editor/components/fixed-toolbar/groups/block-type-group.tsx

@@ -10,6 +10,7 @@ import {
   IconH2,
   IconH3,
   IconMenu4,
+  IconPageBreak,
   IconTypography,
 } from "@tabler/icons-react";
 import { useTranslation } from "react-i18next";
@@ -102,6 +103,12 @@ export const BlockTypeGroup: FC<Props> = ({ editor }) => {
         >
           {t("Divider")}
         </Menu.Item>
+        <Menu.Item
+          leftSection={<IconPageBreak size={16} />}
+          onClick={() => editor.chain().focus().setPageBreak().run()}
+        >
+          {t("Page break")}
+        </Menu.Item>
       </Menu.Dropdown>
     </Menu>
   );

apps/client/src/features/editor/components/slash-menu/menu-items.ts

@@ -19,6 +19,7 @@ import {
   IconTable,
   IconTypography,
   IconMenu4,
+  IconPageBreak,
   IconCalendar,
   IconAppWindow,
   IconSitemap,
@@ -164,6 +165,14 @@ const CommandGroups: SlashMenuGroupedItemsType = {
       command: ({ editor, range }: CommandProps) =>
         editor.chain().focus().deleteRange(range).setHorizontalRule().run(),
     },
+    {
+      title: "Page break",
+      description: "Insert a page break for printing.",
+      searchTerms: ["page", "break", "pagebreak", "print"],
+      icon: IconPageBreak,
+      command: ({ editor, range }: CommandProps) =>
+        editor.chain().focus().deleteRange(range).setPageBreak().run(),
+    },
     {
       title: "Image",
       description: "Upload any image from your device.",

apps/client/src/features/editor/components/transclusion/transclusion-reference-view.tsx

@@ -35,6 +35,7 @@ export default function TransclusionReferenceView(props: NodeViewProps) {
   return (
     <NodeViewWrapper
       className={classes.includeWrap}
+      data-editable={isEditable ? "true" : "false"}
       data-focused={isEditable && props.selected ? "true" : "false"}
       data-menu-open={openMenus > 0 ? "true" : "false"}
       contentEditable={false}

apps/client/src/features/editor/components/transclusion/transclusion-view.tsx

@@ -62,6 +62,7 @@ export default function TransclusionView(props: NodeViewProps) {
   return (
     <NodeViewWrapper
       className={classes.transclusionWrap}
+      data-editable={isEditable ? "true" : "false"}
       data-menu-open={openMenus > 0 ? "true" : "false"}
       data-id={transclusionId ?? undefined}
     >

apps/client/src/features/editor/components/transclusion/transclusion.module.css

@@ -44,8 +44,29 @@
   transition: border 0.3s;
 }
 
-.transclusionWrap:hover,
+.transclusionWrap[data-editable="false"],
-.transclusionWrap:focus-within {
+.includeWrap[data-editable="false"] {
+  margin-left: 0;
+  margin-right: 0;
+  width: 100%;
+  padding: 0;
+}
+
+/* Cancel the wrapping .react-renderer's vertical spacing in read-only mode
+   so the synced block sits flush with surrounding paragraphs (whose own
+   margins already provide the right rhythm). */
+:global(.react-renderer.node-transclusionSource):has(
+    .transclusionWrap[data-editable="false"]
+  ),
+:global(.react-renderer.node-transclusionReference):has(
+    .includeWrap[data-editable="false"]
+  ) {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.transclusionWrap[data-editable="true"]:hover,
+.transclusionWrap[data-editable="true"]:focus-within {
   border: 2px solid
     light-dark(
       var(--mantine-color-orange-2),
@@ -114,9 +135,9 @@
   transition: border 0.3s;
 }
 
-.includeWrap:hover,
+.includeWrap[data-editable="true"]:hover,
-.includeWrap[data-focused="true"],
+.includeWrap[data-editable="true"][data-focused="true"],
-.includeWrap[data-menu-open="true"] {
+.includeWrap[data-editable="true"][data-menu-open="true"] {
   border: 2px solid
     light-dark(
       var(--mantine-color-orange-2),

apps/client/src/features/editor/extensions/extensions.ts

@@ -42,6 +42,7 @@ import {
   Excalidraw,
   Embed,
   TiptapPdf,
+  PageBreak,
   SearchAndReplace,
   Mention,
   TableDndExtension,
@@ -366,6 +367,7 @@ export const mainExtensions = [
   TiptapPdf.configure({
     view: PdfView,
   }),
+  PageBreak,
   Subpages.configure({
     view: SubpagesView,
   }),

apps/client/src/features/editor/full-editor.tsx

@@ -1,5 +1,5 @@
 import classes from "@/features/editor/styles/editor.module.css";
-import React from "react";
+import React, { useEffect } from "react";
 import { TitleEditor } from "@/features/editor/title-editor";
 import PageEditor from "@/features/editor/page-editor";
 import {
@@ -24,6 +24,7 @@ import { FixedToolbar } from "@/features/editor/components/fixed-toolbar/fixed-t
 import { PageEditMode } from "@/features/user/types/user.types.ts";
 import useToggleAside from "@/hooks/use-toggle-aside.tsx";
 import clsx from "clsx";
+import { currentPageEditModeAtom } from "@/features/editor/atoms/editor-atoms.ts";
 
 const MemoizedTitleEditor = React.memo(TitleEditor);
 const MemoizedPageEditor = React.memo(PageEditor);
@@ -34,6 +35,10 @@ type PageCreator = {
   avatarUrl: string;
 };
 
+// Module-level flag: survives component unmount/remount on page navigation,
+// reset only on full page reload (i.e. a new app session).
+let defaultEditModeApplied = false;
+
 export interface FullEditorProps {
   pageId: string;
   slugId: string;
@@ -61,9 +66,19 @@ export function FullEditor({
   const fullPageWidth = user.settings?.preferences?.fullPageWidth;
   const editorToolbarEnabled =
     user.settings?.preferences?.editorToolbar ?? false;
+  const [currentPageEditMode, setCurrentPageEditMode] = useAtom(currentPageEditModeAtom);
   const userPageEditMode =
     user.settings?.preferences?.pageEditMode ?? PageEditMode.Edit;
-  const isEditMode = userPageEditMode === PageEditMode.Edit;
+  const isEditMode = currentPageEditMode === PageEditMode.Edit;
+
+  // Apply the user's saved preference only once on initial load, not on every
+  // page navigation — so the mode sticks across navigations within a session.
+  useEffect(() => {
+    if (!defaultEditModeApplied) {
+      setCurrentPageEditMode(userPageEditMode);
+      defaultEditModeApplied = true;
+    }
+  }, [userPageEditMode, setCurrentPageEditMode]);
 
   return (
     <Container

apps/client/src/features/editor/page-editor.tsx

@@ -26,10 +26,11 @@ import {
   collabExtensions,
   mainExtensions,
 } from "@/features/editor/extensions/extensions";
-import { useAtom } from "jotai";
+import { useAtom, useAtomValue } from "jotai";
 import useCollaborationUrl from "@/features/editor/hooks/use-collaboration-url";
 import { currentUserAtom } from "@/features/user/atoms/current-user-atom";
 import {
+  currentPageEditModeAtom,
   pageEditorAtom,
   yjsConnectionStatusAtom,
 } from "@/features/editor/atoms/editor-atoms";
@@ -112,8 +113,7 @@ export default function PageEditor({
   const documentState = useDocumentVisibility();
   const { pageSlug } = useParams();
   const slugId = extractPageSlugId(pageSlug);
-  const userPageEditMode =
+  const currentPageEditMode = useAtomValue(currentPageEditModeAtom);
-    currentUser?.user?.settings?.preferences?.pageEditMode ?? PageEditMode.Edit;
   const canScroll = useCallback(
     () => Boolean(isComponentMounted.current && editorRef.current),
     [isComponentMounted],
@@ -373,19 +373,9 @@ export default function PageEditor({
     return () => clearTimeout(timeout);
   }, [yjsConnectionStatus, isSynced]);
   useEffect(() => {
-    // Only honor user default page edit mode preference and permissions
+    if (!editor) return;
-    if (editor) {
+    editor.setEditable(editable && currentPageEditMode === PageEditMode.Edit);
-      if (userPageEditMode && editable) {
+  }, [currentPageEditMode, editor, editable]);
-        if (userPageEditMode === PageEditMode.Edit) {
-          editor.setEditable(true);
-        } else if (userPageEditMode === PageEditMode.Read) {
-          editor.setEditable(false);
-        }
-      } else {
-        editor.setEditable(false);
-      }
-    }
-  }, [userPageEditMode, editor, editable]);
 
   const hasConnectedOnceRef = useRef(false);
   const [showStatic, setShowStatic] = useState(true);

apps/client/src/features/editor/styles/index.css

@@ -9,6 +9,7 @@
 @import "./media.css";
 @import "./code.css";
 @import "./print.css";
+@import "./page-break.css";
 @import "./find.css";
 @import "./mention.css";
 @import "./ordered-list.css";

apps/client/src/features/editor/styles/page-break.css

@@ -0,0 +1,50 @@
+.ProseMirror .page-break {
+  position: relative;
+  margin: 1.5rem 0;
+  border-top: 1px dashed var(--mantine-color-default-border);
+  height: 0;
+  user-select: none;
+}
+
+.ProseMirror[contenteditable="false"] .page-break {
+  margin: 0;
+  border: none;
+  height: 0;
+}
+
+.ProseMirror[contenteditable="false"] .page-break::after {
+  content: none;
+}
+
+.ProseMirror .page-break::after {
+  content: "Page break";
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  padding: 0 0.5rem;
+  background: var(--mantine-color-body);
+  color: var(--mantine-color-dimmed);
+  font-size: 0.75rem;
+  line-height: 1;
+  letter-spacing: 0.02em;
+  text-transform: uppercase;
+}
+
+.ProseMirror .page-break.ProseMirror-selectednode {
+  border-top-color: var(--mantine-primary-color-filled);
+}
+
+@media print {
+  .ProseMirror .page-break {
+    break-before: always;
+    page-break-before: always;
+    visibility: hidden;
+    border: none;
+    margin: 0;
+  }
+
+  .ProseMirror .page-break::after {
+    content: none;
+  }
+}

apps/client/src/features/editor/title-editor.tsx

@@ -7,6 +7,7 @@ import { Text } from "@tiptap/extension-text";
 import { Placeholder } from "@tiptap/extension-placeholder";
 import { useAtomValue } from "jotai";
 import {
+  currentPageEditModeAtom,
   pageEditorAtom,
   titleEditorAtom,
 } from "@/features/editor/atoms/editor-atoms";
@@ -24,7 +25,6 @@ import { useTranslation } from "react-i18next";
 import EmojiCommand from "@/features/editor/extensions/emoji-command.ts";
 import { UpdateEvent } from "@/features/websocket/types";
 import localEmitter from "@/lib/local-emitter.ts";
-import { currentUserAtom } from "@/features/user/atoms/current-user-atom.ts";
 import { PageEditMode } from "@/features/user/types/user.types.ts";
 import { searchSpotlight } from "@/features/search/constants.ts";
 import { platformModifierKey } from "@/lib";
@@ -52,9 +52,7 @@ export function TitleEditor({
   const emit = useQueryEmit();
   const navigate = useNavigate();
   const [activePageId, setActivePageId] = useState(pageId);
-  const [currentUser] = useAtom(currentUserAtom);
+  const currentPageEditMode = useAtomValue(currentPageEditModeAtom);
-  const userPageEditMode =
-    currentUser?.user?.settings?.preferences?.pageEditMode ?? PageEditMode.Edit;
 
   const titleEditor = useEditor({
     extensions: [
@@ -172,18 +170,9 @@ export function TitleEditor({
   }, [pageId]);
 
   useEffect(() => {
-    if (titleEditor) {
+    if (!titleEditor) return;
-      if (userPageEditMode && editable) {
+    titleEditor.setEditable(editable && currentPageEditMode === PageEditMode.Edit);
-        if (userPageEditMode === PageEditMode.Edit) {
+  }, [currentPageEditMode, titleEditor, editable]);
-          titleEditor.setEditable(true);
-        } else if (userPageEditMode === PageEditMode.Read) {
-          titleEditor.setEditable(false);
-        }
-      } else {
-        titleEditor.setEditable(false);
-      }
-    }
-  }, [userPageEditMode, titleEditor, editable]);
 
   const openSearchDialog = () => {
     const event = new CustomEvent("openFindDialogFromEditor", {});

apps/client/src/features/page/components/header/page-header-menu.tsx

@@ -40,7 +40,7 @@ import {
   yjsConnectionStatusAtom,
 } from "@/features/editor/atoms/editor-atoms.ts";
 import { formattedDate } from "@/lib/time.ts";
-import { PageStateSegmentedControl } from "@/features/user/components/page-state-pref.tsx";
+import { PageEditModeToggle } from "@/features/user/components/page-state-pref.tsx";
 import MovePageModal from "@/features/page/components/move-page-modal.tsx";
 import { useTimeAgo } from "@/hooks/use-time-ago.tsx";
 import { PageShareModal } from "@/ee/page-permission";
@@ -91,7 +91,7 @@ export default function PageHeaderMenu({ readOnly }: PageHeaderMenuProps) {
     <>
       <ConnectionWarning />
 
-      {!readOnly && <PageStateSegmentedControl size="xs" />}
+      {!readOnly && <PageEditModeToggle size="xs" />}
 
       <PageShareModal readOnly={readOnly} />
 

apps/client/src/features/share/atoms/shared-page-atom.ts

@@ -1,6 +1,11 @@
 import { atom } from "jotai";
+import { atomWithStorage } from "jotai/utils";
 import { ISharedPageTree } from "@/features/share/types/share.types";
 import { SharedPageTreeNode } from "@/features/share/utils";
 
 export const sharedPageTreeAtom = atom<ISharedPageTree | null>(null);
-export const sharedTreeDataAtom = atom<SharedPageTreeNode[] | null>(null);
+export const sharedTreeDataAtom = atom<SharedPageTreeNode[] | null>(null);
+export const sharedPageFullWidthAtom = atomWithStorage<boolean>(
+  "sharedPageFullWidth",
+  false,
+);

apps/client/src/features/share/components/share-shell.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useMemo } from "react";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
   ActionIcon,
   AppShell,
@@ -14,11 +14,16 @@ import { readOnlyEditorAtom } from "@/features/editor/atoms/editor-atoms.ts";
 import { ThemeToggle } from "@/components/theme-toggle.tsx";
 import { useAtomValue, useSetAtom } from "jotai";
 import { useAtom } from "jotai";
-import { sharedPageTreeAtom, sharedTreeDataAtom } from "@/features/share/atoms/shared-page-atom";
+import {
+  sharedPageFullWidthAtom,
+  sharedPageTreeAtom,
+  sharedTreeDataAtom,
+} from "@/features/share/atoms/shared-page-atom";
 import { buildSharedPageTree } from "@/features/share/utils";
 import {
   desktopSidebarAtom,
   mobileSidebarAtom,
+  sidebarWidthAtom,
 } from "@/components/layouts/global/hooks/atoms/sidebar-atom.ts";
 import SidebarToggle from "@/components/ui/sidebar-toggle-button.tsx";
 import { useTranslation } from "react-i18next";
@@ -27,7 +32,7 @@ import {
   mobileTableOfContentAsideAtom,
   tableOfContentAsideAtom,
 } from "@/features/share/atoms/sidebar-atom.ts";
-import { IconList } from "@tabler/icons-react";
+import { IconArrowsHorizontal, IconList } from "@tabler/icons-react";
 import { useToggleToc } from "@/features/share/hooks/use-toggle-toc.ts";
 import classes from "./share.module.css";
 import {
@@ -55,6 +60,46 @@ export default function ShareShell({
   const [mobileTocOpened] = useAtom(mobileTableOfContentAsideAtom);
   const toggleTocMobile = useToggleToc(mobileTableOfContentAsideAtom);
   const toggleToc = useToggleToc(tableOfContentAsideAtom);
+  const [fullWidth, setFullWidth] = useAtom(sharedPageFullWidthAtom);
+  const [sidebarWidth, setSidebarWidth] = useAtom(sidebarWidthAtom);
+  const [isResizing, setIsResizing] = useState(false);
+  const sidebarRef = useRef<HTMLElement | null>(null);
+
+  const startResizing = useCallback((e: React.MouseEvent) => {
+    e.preventDefault();
+    setIsResizing(true);
+  }, []);
+
+  const stopResizing = useCallback(() => {
+    setIsResizing(false);
+  }, []);
+
+  const resize = useCallback(
+    (e: MouseEvent) => {
+      if (!isResizing || !sidebarRef.current) return;
+      const newWidth =
+        e.clientX - sidebarRef.current.getBoundingClientRect().left;
+      if (newWidth < 220) {
+        setSidebarWidth(220);
+        return;
+      }
+      if (newWidth > 600) {
+        setSidebarWidth(600);
+        return;
+      }
+      setSidebarWidth(newWidth);
+    },
+    [isResizing, setSidebarWidth],
+  );
+
+  useEffect(() => {
+    window.addEventListener("mousemove", resize);
+    window.addEventListener("mouseup", stopResizing);
+    return () => {
+      window.removeEventListener("mousemove", resize);
+      window.removeEventListener("mouseup", stopResizing);
+    };
+  }, [resize, stopResizing]);
 
   const { shareId } = useParams();
   const { data } = useGetSharedPageTreeQuery(shareId);
@@ -81,7 +126,7 @@ export default function ShareShell({
       header={{ height: 50 }}
       {...(data?.pageTree?.length > 1 && {
         navbar: {
-          width: 300,
+          width: sidebarWidth,
           breakpoint: "sm",
           collapsed: {
             mobile: !mobileOpened,
@@ -166,6 +211,20 @@ export default function ShareShell({
                   <IconList size={20} stroke={2} />
                 </ActionIcon>
               </Tooltip>
+
+              <Tooltip label={t("Full width")} withArrow>
+                <ActionIcon
+                  variant={fullWidth ? "light" : "default"}
+                  style={fullWidth ? undefined : { border: "none" }}
+                  aria-label={t("Full width")}
+                  aria-pressed={fullWidth}
+                  onClick={() => setFullWidth((v) => !v)}
+                  visibleFrom="sm"
+                  size="sm"
+                >
+                  <IconArrowsHorizontal size={20} stroke={2} />
+                </ActionIcon>
+              </Tooltip>
             </>
 
             <ThemeToggle />
@@ -174,7 +233,11 @@ export default function ShareShell({
       </AppShell.Header>
 
       {data?.pageTree?.length > 1 && (
-        <AppShell.Navbar p="md" className={classes.navbar}>
+        <AppShell.Navbar p="md" className={classes.navbar} ref={sidebarRef}>
+          <div
+            className={classes.resizeHandle}
+            onMouseDown={startResizing}
+          />
           <MemoizedSharedTree sharedPageTree={data} />
         </AppShell.Navbar>
       )}

apps/client/src/features/share/components/share.module.css

@@ -10,6 +10,7 @@
 .treeNode {
   text-decoration: none;
   user-select: none;
+  padding-bottom: 0;
 }
 
 .navbar,
@@ -18,3 +19,26 @@
     width: 350px;
   }
 }
+
+.resizeHandle {
+  width: 3px;
+  cursor: col-resize;
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  z-index: 1;
+
+  &:hover,
+  &:active {
+    width: 5px;
+    background: light-dark(
+      var(--mantine-color-gray-4),
+      var(--mantine-color-dark-5)
+    );
+  }
+
+  @media (max-width: $mantine-breakpoint-sm) {
+    display: none;
+  }
+}

apps/client/src/features/user/components/page-state-pref.tsx

@@ -6,6 +6,7 @@ import React, { useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { PageEditMode } from "@/features/user/types/user.types.ts";
 import { ResponsiveSettingsRow, ResponsiveSettingsContent, ResponsiveSettingsControl } from "@/components/ui/responsive-settings-row";
+import { currentPageEditModeAtom } from "@/features/editor/atoms/editor-atoms.ts";
 
 export default function PageStatePref() {
   const { t } = useTranslation();
@@ -71,3 +72,24 @@ export function PageStateSegmentedControl({
     />
   );
 }
+
+// Header variant: updates the current page's mode locally without persisting
+// the preference to the server.
+export function PageEditModeToggle({ size }: { size?: MantineSize }) {
+  const { t } = useTranslation();
+  const [currentPageEditMode, setCurrentPageEditMode] = useAtom(
+    currentPageEditModeAtom,
+  );
+
+  return (
+    <SegmentedControl
+      size={size}
+      value={currentPageEditMode}
+      onChange={(v) => setCurrentPageEditMode(v as PageEditMode)}
+      data={[
+        { label: t("Edit"), value: PageEditMode.Edit },
+        { label: t("Read"), value: PageEditMode.Read },
+      ]}
+    />
+  );
+}

apps/client/src/lib/app-route.ts

@@ -31,20 +31,38 @@ const APP_ROUTE = {
   },
 };
 
+export function safeRedirectPath(input: unknown): string | null {
+  if (typeof input !== "string") return null;
+  if (input.length === 0 || input.length > 2048) return null;
+  // Reject whitespace, backslash, and any Unicode "Other" category char
+  // (ASCII controls, zero-width space, BOM, bidi marks, etc).
+  if (/[\s\\]|\p{C}/u.test(input)) return null;
+  if (!input.startsWith("/") || input.startsWith("//")) return null;
+  if (input.toLowerCase().includes("://")) return null;
+  if (/^\/[a-z][a-z0-9+\-.]*:/i.test(input)) return null;
+  try {
+    const resolved = new URL(input, window.location.origin);
+    if (resolved.origin !== window.location.origin) return null;
+    return resolved.pathname + resolved.search + resolved.hash;
+  } catch {
+    return null;
+  }
+}
+
 export function getPostLoginRedirect(): string {
   const params = new URLSearchParams(window.location.search);
-  const redirect = params.get("redirect");
+  return safeRedirectPath(params.get("redirect")) ?? APP_ROUTE.HOME;
-  if (redirect) {
+}
-    try {
+
-      const resolved = new URL(redirect, window.location.origin);
+/**
-      if (resolved.origin === window.location.origin) {
+ * Returns the `?redirect=` value from the current URL only when it is a safe
-        return resolved.pathname + resolved.search + resolved.hash;
+ * same-origin path. Unlike {@link getPostLoginRedirect} this returns `null`
-      }
+ * (not `/home`) when no redirect is present, so callers can distinguish
-    } catch {
+ * "user came here directly" from "user was bounced from a deep link".
-      // malformed URL, fall through to default
+ */
-    }
+export function getRedirectParam(): string | null {
-  }
+  const params = new URLSearchParams(window.location.search);
-  return APP_ROUTE.HOME;
+  return safeRedirectPath(params.get("redirect"));
 }
 
 export default APP_ROUTE;

apps/client/src/pages/share/shared-page.tsx

@@ -9,7 +9,10 @@ import { extractPageSlugId } from "@/lib";
 import { Error404 } from "@/components/ui/error-404.tsx";
 import ShareBranding from "@/features/share/components/share-branding.tsx";
 import { useAtomValue } from "jotai";
-import { sharedTreeDataAtom } from "@/features/share/atoms/shared-page-atom.ts";
+import {
+  sharedPageFullWidthAtom,
+  sharedTreeDataAtom,
+} from "@/features/share/atoms/shared-page-atom.ts";
 import { isPageInTree } from "@/features/share/utils.ts";
 
 export default function SharedPage() {
@@ -23,6 +26,7 @@ export default function SharedPage() {
   });
 
   const sharedTreeData = useAtomValue(sharedTreeDataAtom);
+  const fullWidth = useAtomValue(sharedPageFullWidthAtom);
 
   useEffect(() => {
     if (shareId && data) {
@@ -59,7 +63,7 @@ export default function SharedPage() {
         )}
       </Helmet>
 
-      <Container size={900} p={0}>
+      <Container fluid={fullWidth} size={fullWidth ? undefined : 900} p={0}>
         <ReadonlyPageEditor
           key={data.page.id}
           title={data.page.title}

apps/server/package.json

@@ -42,7 +42,7 @@
     "@fastify/multipart": "^10.0.0",
     "@fastify/static": "^9.1.3",
     "@keyv/redis": "^5.1.6",
-    "@langchain/core": "1.1.39",
+    "@langchain/core": "1.1.46",
     "@langchain/textsplitters": "1.0.1",
     "@modelcontextprotocol/sdk": "^1.29.0",
     "@nest-lab/throttler-storage-redis": "^1.2.0",
@@ -81,7 +81,7 @@
     "ioredis": "^5.10.1",
     "js-tiktoken": "^1.0.21",
     "jsonwebtoken": "^9.0.3",
-    "kysely": "^0.28.14",
+    "kysely": "^0.28.17",
     "kysely-migration-cli": "^0.4.2",
     "kysely-postgres-js": "^3.0.0",
     "ldapts": "^8.1.7",

apps/server/src/collaboration/collaboration.util.ts

@@ -26,6 +26,7 @@ import {
   TiptapVideo,
   TiptapAudio,
   TiptapPdf,
+  PageBreak,
   TrailingNode,
   Attachment,
   Drawio,
@@ -94,6 +95,7 @@ export const tiptapExtensions = [
   TiptapVideo,
   TiptapAudio,
   TiptapPdf,
+  PageBreak,
   Callout,
   Attachment,
   CustomCodeBlock,

apps/server/src/common/helpers/cache-keys.ts

@@ -1,3 +1,11 @@
 export const CacheKey = {
   LICENSE_VALID: (workspaceId: string) => `license:valid:${workspaceId}`,
+  SPACE_ROLES: (userId: string, spaceId: string) =>
+    `perm:space-roles:${userId}:${spaceId}`,
+  PAGE_CAN_EDIT: (userId: string, pageId: string) =>
+    `perm:can-edit:${userId}:${pageId}`,
 };
+
+// Permission caches dedupe repeated checks within and across short request bursts.
+// 5s keeps staleness on revocations bounded.
+export const PERMISSION_CACHE_TTL_MS = 5_000;

apps/server/src/common/helpers/with-cache.ts

@@ -0,0 +1,27 @@
+import { Cache } from 'cache-manager';
+
+export async function withCache<T>(
+  cacheManager: Cache,
+  key: string,
+  ttlMs: number,
+  fn: () => Promise<T>,
+): Promise<T> {
+  try {
+    const cached = await cacheManager.get<{ v: T }>(key);
+    if (cached !== undefined && cached !== null) {
+      return cached.v;
+    }
+  } catch (err) {
+    console.warn(`[withCache] get failed for "${key}", falling back to source`, err);
+  }
+
+  const value = await fn();
+
+  try {
+    await cacheManager.set(key, { v: value }, ttlMs);
+  } catch (err) {
+    console.warn(`[withCache] set failed for "${key}"`, err);
+  }
+
+  return value;
+}

apps/server/src/database/repos/page/page-permission.repo.ts

@@ -1,4 +1,6 @@
-import { Injectable } from '@nestjs/common';
+import { Inject, Injectable } from '@nestjs/common';
+import { CACHE_MANAGER } from '@nestjs/cache-manager';
+import { Cache } from 'cache-manager';
 import { InjectKysely } from 'nestjs-kysely';
 import { KyselyDB, KyselyTransaction } from '@docmost/db/types/kysely.types';
 import { dbOrTx } from '@docmost/db/utils';
@@ -17,6 +19,11 @@ import {
   executeWithCursorPagination,
 } from '@docmost/db/pagination/cursor-pagination';
 import { PagePermissionMember } from './types/page-permission.types';
+import { withCache } from '../../../common/helpers/with-cache';
+import {
+  CacheKey,
+  PERMISSION_CACHE_TTL_MS,
+} from '../../../common/helpers/cache-keys';
 
 export { PagePermissionMember } from './types/page-permission.types';
 
@@ -25,6 +32,7 @@ export class PagePermissionRepo {
   constructor(
     @InjectKysely() private readonly db: KyselyDB,
     private readonly groupRepo: GroupRepo,
+    @Inject(CACHE_MANAGER) private readonly cacheManager: Cache,
   ) {}
 
   async findPageAccessByPageId(
@@ -361,40 +369,8 @@ export class PagePermissionRepo {
    * Check if user can access a page by verifying they have permission on ALL restricted ancestors.
    */
   async canUserAccessPage(userId: string, pageId: string): Promise<boolean> {
-    const deniedAncestor = await this.db
+    const { canAccess } = await this.canUserEditPage(userId, pageId);
-      .withRecursive('ancestors', (qb) =>
+    return canAccess;
-        qb
-          .selectFrom('pages')
-          .select(['pages.id as ancestorId', 'pages.parentPageId'])
-          .where('pages.id', '=', pageId)
-          .unionAll((eb) =>
-            eb
-              .selectFrom('pages')
-              .innerJoin('ancestors', 'ancestors.parentPageId', 'pages.id')
-              .select(['pages.id as ancestorId', 'pages.parentPageId']),
-          ),
-      )
-      .selectFrom('ancestors')
-      .innerJoin('pageAccess', 'pageAccess.pageId', 'ancestors.ancestorId')
-      .leftJoin('pagePermissions', (join) =>
-        join
-          .onRef('pagePermissions.pageAccessId', '=', 'pageAccess.id')
-          .on((eb) =>
-            eb.or([
-              eb('pagePermissions.userId', '=', userId),
-              eb(
-                'pagePermissions.groupId',
-                'in',
-                this.userGroupIdsSubquery(eb, userId),
-              ),
-            ]),
-          ),
-      )
-      .select('pageAccess.pageId')
-      .where('pagePermissions.id', 'is', null)
-      .executeTakeFirst();
-
-    return !deniedAncestor;
   }
 
   /**
@@ -412,43 +388,50 @@ export class PagePermissionRepo {
     canAccess: boolean;
     canEdit: boolean;
   }> {
-    const result = await sql<{
+    return withCache(
-      canAccess: boolean | null;
+      this.cacheManager,
-      canEdit: boolean | null;
+      CacheKey.PAGE_CAN_EDIT(userId, pageId),
-    }>`
+      PERMISSION_CACHE_TTL_MS,
-      WITH RECURSIVE ancestors AS (
+      async () => {
-        SELECT id AS ancestor_id, parent_page_id, 0 AS depth
+        const result = await sql<{
-        FROM pages
+          canAccess: boolean | null;
-        WHERE id = ${pageId}::uuid
+          canEdit: boolean | null;
-        UNION ALL
+        }>`
-        SELECT p.id, p.parent_page_id, a.depth + 1
+          WITH RECURSIVE ancestors AS (
-        FROM pages p
+            SELECT id AS ancestor_id, parent_page_id, 0 AS depth
-        JOIN ancestors a ON a.parent_page_id = p.id
+            FROM pages
-      )
+            WHERE id = ${pageId}::uuid
-      SELECT
+            UNION ALL
-        bool_and(pp.id IS NOT NULL) AS "canAccess",
+            SELECT p.id, p.parent_page_id, a.depth + 1
-        -- nearest restricted ancestor's highest role wins (DESC: 'writer' > 'reader', NULLS LAST: no-permission after real roles)
+            FROM pages p
-        (array_agg(pp.role ORDER BY a.depth ASC, pp.role DESC NULLS LAST))[1] = 'writer' AS "canEdit"
+            JOIN ancestors a ON a.parent_page_id = p.id
-      FROM ancestors a
-      JOIN page_access pa ON pa.page_id = a.ancestor_id
-      LEFT JOIN page_permissions pp ON pp.page_access_id = pa.id
-        AND (
-          pp.user_id = ${userId}::uuid
-          OR pp.group_id IN (
-            SELECT gu.group_id FROM group_users gu WHERE gu.user_id = ${userId}::uuid
           )
-        )
+          SELECT
-    `.execute(this.db);
+            bool_and(pp.id IS NOT NULL) AS "canAccess",
+            -- nearest restricted ancestor's highest role wins (DESC: 'writer' > 'reader', NULLS LAST: no-permission after real roles)
+            (array_agg(pp.role ORDER BY a.depth ASC, pp.role DESC NULLS LAST))[1] = 'writer' AS "canEdit"
+          FROM ancestors a
+          JOIN page_access pa ON pa.page_id = a.ancestor_id
+          LEFT JOIN page_permissions pp ON pp.page_access_id = pa.id
+            AND (
+              pp.user_id = ${userId}::uuid
+              OR pp.group_id IN (
+                SELECT gu.group_id FROM group_users gu WHERE gu.user_id = ${userId}::uuid
+              )
+            )
+        `.execute(this.db);
 
-    const row = result.rows[0];
+        const row = result.rows[0];
-    if (!row || row.canAccess === null) {
+        if (!row || row.canAccess === null) {
-      return { hasAnyRestriction: false, canAccess: true, canEdit: true };
+          return { hasAnyRestriction: false, canAccess: true, canEdit: true };
-    }
+        }
-    return {
+        return {
-      hasAnyRestriction: true,
+          hasAnyRestriction: true,
-      canAccess: row.canAccess,
+          canAccess: row.canAccess,
-      canEdit: row.canAccess && (row.canEdit ?? false),
+          canEdit: row.canAccess && (row.canEdit ?? false),
-    };
+        };
+      },
+    );
   }
 
   /**

apps/server/src/database/repos/space/space-member.repo.ts

@@ -1,4 +1,6 @@
-import { BadRequestException, Injectable } from '@nestjs/common';
+import { BadRequestException, Inject, Injectable } from '@nestjs/common';
+import { CACHE_MANAGER } from '@nestjs/cache-manager';
+import { Cache } from 'cache-manager';
 import { InjectKysely } from 'nestjs-kysely';
 import { KyselyDB, KyselyTransaction } from '@docmost/db/types/kysely.types';
 import { dbOrTx } from '@docmost/db/utils';
@@ -13,6 +15,11 @@ import { MemberInfo, UserSpaceRole } from './types';
 import { executeWithCursorPagination } from '@docmost/db/pagination/cursor-pagination';
 import { GroupRepo } from '@docmost/db/repos/group/group.repo';
 import { SpaceRepo } from '@docmost/db/repos/space/space.repo';
+import { withCache } from '../../../common/helpers/with-cache';
+import {
+  CacheKey,
+  PERMISSION_CACHE_TTL_MS,
+} from '../../../common/helpers/cache-keys';
 
 @Injectable()
 export class SpaceMemberRepo {
@@ -20,6 +27,7 @@ export class SpaceMemberRepo {
     @InjectKysely() private readonly db: KyselyDB,
     private readonly groupRepo: GroupRepo,
     private readonly spaceRepo: SpaceRepo,
+    @Inject(CACHE_MANAGER) private readonly cacheManager: Cache,
   ) {}
 
   async insertSpaceMember(
@@ -214,25 +222,36 @@ export class SpaceMemberRepo {
     userId: string,
     spaceId: string,
   ): Promise<UserSpaceRole[]> {
-    const roles = await this.db
+    return withCache(
-      .selectFrom('spaceMembers')
+      this.cacheManager,
-      .select(['userId', 'role'])
+      CacheKey.SPACE_ROLES(userId, spaceId),
-      .where('userId', '=', userId)
+      PERMISSION_CACHE_TTL_MS,
-      .where('spaceId', '=', spaceId)
+      async () => {
-      .unionAll(
+        const roles = await this.db
-        this.db
           .selectFrom('spaceMembers')
-          .innerJoin('groupUsers', 'groupUsers.groupId', 'spaceMembers.groupId')
+          .select(['userId', 'role'])
-          .select(['groupUsers.userId', 'spaceMembers.role'])
+          .where('userId', '=', userId)
-          .where('groupUsers.userId', '=', userId)
+          .where('spaceId', '=', spaceId)
-          .where('spaceMembers.spaceId', '=', spaceId),
+          .unionAll(
-      )
+            this.db
-      .execute();
+              .selectFrom('spaceMembers')
+              .innerJoin(
+                'groupUsers',
+                'groupUsers.groupId',
+                'spaceMembers.groupId',
+              )
+              .select(['groupUsers.userId', 'spaceMembers.role'])
+              .where('groupUsers.userId', '=', userId)
+              .where('spaceMembers.spaceId', '=', spaceId),
+          )
+          .execute();
 
-    if (!roles || roles.length === 0) {
+        if (!roles || roles.length === 0) {
-      return undefined;
+          return undefined;
-    }
+        }
-    return roles;
+        return roles;
+      },
+    );
   }
 
   async getUserIdsWithSpaceAccess(

package.json

@@ -104,8 +104,8 @@
       "ws": "8.20.0",
       "dompurify": "3.4.1",
       "tmp": "0.2.5",
-      "hono": "4.12.14",
+      "hono": "4.12.18",
-      "mermaid": "11.13.0",
+      "mermaid": "11.15.0",
       "nanoid@^3": "3.3.8",
       "socket.io-parser": "4.2.6",
       "serialize-javascript": "7.0.3",
@@ -131,9 +131,10 @@
       "@xmldom/xmldom": "0.8.13",
       "handlebars": "4.7.9",
       "axios": "1.16.0",
-      "langsmith": "0.5.19",
+      "langsmith": "0.7.0",
       "follow-redirects": "1.16.0",
-      "protobufjs":  "7.5.5"
+      "protobufjs":  "7.5.6",
+      "ip-address":  "10.1.1"
     },
     "neverBuiltDependencies": []
   }

packages/editor-ext/src/index.ts

@@ -31,5 +31,6 @@ export * from "./lib/recreate-transform";
 export * from "./lib/columns";
 export * from "./lib/status";
 export * from "./lib/pdf";
+export * from "./lib/page-break";
 export * from "./lib/resizable-nodeview";
 

packages/editor-ext/src/lib/page-break/index.ts

@@ -0,0 +1 @@
+export * from "./page-break";

packages/editor-ext/src/lib/page-break/page-break.ts

@@ -0,0 +1,60 @@
+import { mergeAttributes, Node } from "@tiptap/core";
+
+export interface PageBreakOptions {
+  HTMLAttributes: Record<string, any>;
+}
+
+declare module "@tiptap/core" {
+  interface Commands<ReturnType> {
+    pageBreak: {
+      setPageBreak: () => ReturnType;
+    };
+  }
+}
+
+export const PageBreak = Node.create<PageBreakOptions>({
+  name: "pageBreak",
+
+  group: "block",
+
+  atom: true,
+
+  selectable: true,
+
+  addOptions() {
+    return {
+      HTMLAttributes: {},
+    };
+  },
+
+  parseHTML() {
+    return [
+      {
+        tag: `div[data-type="${this.name}"]`,
+      },
+    ];
+  },
+
+  renderHTML({ HTMLAttributes }) {
+    return [
+      "div",
+      mergeAttributes(
+        { "data-type": this.name, class: "page-break" },
+        this.options.HTMLAttributes,
+        HTMLAttributes,
+      ),
+    ];
+  },
+
+  addCommands() {
+    return {
+      setPageBreak:
+        () =>
+        ({ chain }) =>
+          chain()
+            .insertContent({ type: this.name })
+            .focus()
+            .run(),
+    };
+  },
+});