feat(layout): implement hide/show pane

This commit is contained in:
Elian Doran 2025-01-19 20:41:05 +02:00
parent 2883942d87
commit d74c5ea2a1
No known key found for this signature in database
4 changed files with 15 additions and 8 deletions

View File

@ -104,6 +104,8 @@ export type CommandMappings = {
openNoteInNewWindow: CommandData; openNoteInNewWindow: CommandData;
hideLeftPane: CommandData; hideLeftPane: CommandData;
showLeftPane: CommandData; showLeftPane: CommandData;
toggleLeftPane: CommandData;
toggleRightPane: CommandData;
openInTab: ContextMenuCommandData; openInTab: ContextMenuCommandData;
openNoteInSplit: ContextMenuCommandData; openNoteInSplit: ContextMenuCommandData;

View File

@ -86,6 +86,10 @@ export default class RootCommandExecutor extends Component {
options.toggle("leftPaneVisible"); options.toggle("leftPaneVisible");
} }
toggleRightPaneCommand() {
options.toggle("rightPaneVisible");
}
async showBackendLogCommand() { async showBackendLogCommand() {
await appContext.tabManager.openTabWithNoteWithHoisting("_backendLog", { activate: true }); await appContext.tabManager.openTabWithNoteWithHoisting("_backendLog", { activate: true });
} }

View File

@ -8,6 +8,7 @@ export default class RightPaneToggleWidget extends CommandButtonWidget {
this.class("toggle-button"); this.class("toggle-button");
this.css("transform", "scaleX(-1)"); this.css("transform", "scaleX(-1)");
this.settings.icon = "bx-sidebar"; this.settings.icon = "bx-sidebar";
this.settings.command = "toggleRightPane";
} }
} }

View File

@ -2,9 +2,9 @@ import FlexContainer from "./flex_container.js";
import splitService from "../../services/resizer.js"; import splitService from "../../services/resizer.js";
import type RightPanelWidget from "../right_panel_widget.js"; import type RightPanelWidget from "../right_panel_widget.js";
import type { EventData, EventNames } from "../../components/app_context.js"; import type { EventData, EventNames } from "../../components/app_context.js";
import options from "../../services/options.js";
export default class RightPaneContainer extends FlexContainer<RightPanelWidget> { export default class RightPaneContainer extends FlexContainer<RightPanelWidget> {
private rightPaneHidden: boolean;
constructor() { constructor() {
super("column"); super("column");
@ -12,12 +12,10 @@ export default class RightPaneContainer extends FlexContainer<RightPanelWidget>
this.id("right-pane"); this.id("right-pane");
this.css("height", "100%"); this.css("height", "100%");
this.collapsible(); this.collapsible();
this.rightPaneHidden = false;
} }
isEnabled() { isEnabled() {
return super.isEnabled() && !this.rightPaneHidden; return super.isEnabled() && options.is("rightPaneVisible");
} }
handleEventInChildren<T extends EventNames>(name: T, data: EventData<T>): Promise<unknown[] | unknown> | null { handleEventInChildren<T extends EventNames>(name: T, data: EventData<T>): Promise<unknown[] | unknown> | null {
@ -50,9 +48,11 @@ export default class RightPaneContainer extends FlexContainer<RightPanelWidget>
} }
} }
toggleRightPaneEvent() { entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) {
this.rightPaneHidden = !this.rightPaneHidden; if (loadResults.isOptionReloaded("rightPaneVisible")) {
const visible = this.isEnabled();
this.reEvaluateRightPaneVisibilityCommand(); this.toggleInt(visible);
}
} }
} }