Fix (left pane toggle logic): properly handle both synced and current window visibility states

This commit is contained in:
SiriusXT 2025-05-18 10:22:49 +08:00
parent 7e64e31dfe
commit c65f0d4249
2 changed files with 12 additions and 4 deletions

View File

@ -19,10 +19,10 @@ export default class LeftPaneToggleWidget extends CommandButtonWidget {
return "bx-sidebar"; return "bx-sidebar";
} }
return options.is("leftPaneVisible") ? "bx-chevrons-left" : "bx-chevrons-right"; return this.currentLeftPaneVisible ? "bx-chevrons-left" : "bx-chevrons-right";
}; };
this.settings.title = () => (options.is("leftPaneVisible") ? t("left_pane_toggle.hide_panel") : t("left_pane_toggle.show_panel")); this.settings.title = () => (this.currentLeftPaneVisible ? t("left_pane_toggle.hide_panel") : t("left_pane_toggle.show_panel"));
this.settings.command = () => (this.currentLeftPaneVisible ? "hideLeftPane" : "showLeftPane"); this.settings.command = () => (this.currentLeftPaneVisible ? "hideLeftPane" : "showLeftPane");
@ -38,7 +38,9 @@ export default class LeftPaneToggleWidget extends CommandButtonWidget {
entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) { entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) {
if (loadResults.isOptionReloaded("leftPaneVisible") && document.hasFocus()) { if (loadResults.isOptionReloaded("leftPaneVisible") && document.hasFocus()) {
this.currentLeftPaneVisible = options.is("leftPaneVisible"); // options.is("leftPaneVisible") changed — it may or may not be the same as currentLeftPaneVisible, but as long as the window is focused, the left pane visibility should be toggled.
// See PR description for detailed explanation of multi-window edge cases: https://github.com/TriliumNext/Notes/pull/1962
this.currentLeftPaneVisible = !this.currentLeftPaneVisible;
this.refreshIcon(); this.refreshIcon();
} }
} }

View File

@ -4,20 +4,26 @@ import appContext, { type EventData } from "../../components/app_context.js";
import type Component from "../../components/component.js"; import type Component from "../../components/component.js";
export default class LeftPaneContainer extends FlexContainer<Component> { export default class LeftPaneContainer extends FlexContainer<Component> {
private currentLeftPaneVisible: boolean;
constructor() { constructor() {
super("column"); super("column");
this.currentLeftPaneVisible = options.is("leftPaneVisible");
this.id("left-pane"); this.id("left-pane");
this.css("height", "100%"); this.css("height", "100%");
this.collapsible(); this.collapsible();
} }
isEnabled() { isEnabled() {
return super.isEnabled() && options.is("leftPaneVisible"); return super.isEnabled() && this.currentLeftPaneVisible;
} }
entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) { entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) {
if (loadResults.isOptionReloaded("leftPaneVisible") && document.hasFocus()) { if (loadResults.isOptionReloaded("leftPaneVisible") && document.hasFocus()) {
// options.is("leftPaneVisible") changed — it may or may not be the same as currentLeftPaneVisible, but as long as the window is focused, the left pane visibility should be toggled.
this.currentLeftPaneVisible = !this.currentLeftPaneVisible;
const visible = this.isEnabled(); const visible = this.isEnabled();
this.toggleInt(visible); this.toggleInt(visible);