Skip to content

feat(editor): auto-close left sidebar when TOC is empty #651

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
backnotprop merged 2 commits into from
May 2, 2026
Merged

feat(editor): auto-close left sidebar when TOC is empty #651

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
7c50d77
feat(editor): auto-close left sidebar when TOC is empty
backnotprop May 2, 2026
5e37b17
fix(editor): hoist hasTocEntries above the effects that read it
backnotprop May 2, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 24 additions & 3 deletions packages/editor/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -210,6 +210,14 @@ const App: React.FC = () => {
// Sidebar (shared TOC + Version Browser)
const sidebar = useSidebar(getUIPreferences().tocEnabled);

// Whether the document has any TOC-eligible headings (level <= 3, matching
// buildTocHierarchy). Drives the empty-doc auto-close behavior below — must
// be declared before the effects that reference it (TDZ in dep arrays).
const hasTocEntries = useMemo(
() => blocks.some(b => b.type === 'heading' && (b.level ?? 0) <= 3),
[blocks]
);

const exitWideMode = useCallback((options?: {
restore?: boolean;
sidebarTab?: SidebarTab;
Expand Down Expand Up @@ -268,9 +276,22 @@ const App: React.FC = () => {
if (wideModeType !== null) return;
if (lastAppliedTocEnabledRef.current === uiPrefs.tocEnabled) return;
lastAppliedTocEnabledRef.current = uiPrefs.tocEnabled;
if (uiPrefs.tocEnabled) sidebar.open('toc');
else sidebar.close();
}, [wideModeType, sidebar.close, sidebar.open, uiPrefs.tocEnabled]);
if (uiPrefs.tocEnabled && hasTocEntries) sidebar.open('toc');
else if (!uiPrefs.tocEnabled) sidebar.close();
}, [wideModeType, sidebar.close, sidebar.open, uiPrefs.tocEnabled, hasTocEntries]);

// Auto-close the sidebar when blocks parse with no TOC entries. Fires
// only on blocks/hasTocEntries change (not on sidebar state) so a user
// who manually re-opens the empty sidebar is left alone — until the
// document changes again (e.g. picking a new file in annotate-folder).
useEffect(() => {
if (blocks.length === 0) return;
if (hasTocEntries) return;
if (sidebar.activeTab === 'toc' && sidebar.isOpen) {
sidebar.close();
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [blocks, hasTocEntries]);

// Clear diff view when switching away from versions tab
useEffect(() => {
Expand Down