diff --git a/apps/geolibre-desktop/src/components/panels/PluginRightPanel.tsx b/apps/geolibre-desktop/src/components/panels/PluginRightPanel.tsx
index 70f60d190..361eb3952 100644
--- a/apps/geolibre-desktop/src/components/panels/PluginRightPanel.tsx
+++ b/apps/geolibre-desktop/src/components/panels/PluginRightPanel.tsx
@@ -2,6 +2,7 @@ import {
closeRightPanel,
collapseRightPanel,
getRightPanel,
+ listRightPanels,
moveActiveRightPanelDock,
openRightPanel,
type RightPanelDock,
@@ -15,10 +16,8 @@ import {
Combine,
PanelLeft,
PanelLeftClose,
- PanelLeftOpen,
PanelRight,
PanelRightClose,
- PanelRightOpen,
X,
} from "lucide-react";
import {
@@ -81,7 +80,7 @@ interface PluginRightPanelProps {
*/
export function PluginRightPanel({ dock, contentEl, width, onWidthChange }: PluginRightPanelProps) {
const { t } = useTranslation();
- const { activeId, collapsed, dock: activeDock } = useRightPanelState();
+ const { activeId, collapsed, dock: activeDock, panelDocks } = useRightPanelState();
const contentRef = useRef(null);
const panel = activeId ? getRightPanel(activeId) : undefined;
@@ -96,6 +95,17 @@ export function PluginRightPanel({ dock, contentEl, width, onWidthChange }: Plug
// move buttons and no rail of its own; its collapsed entry lives in that single
// shared rail instead.
const isSharedRail = dock === "replace-style" || dock === "replace-layers";
+ // Every panel docked here that is not currently expanded: the displaced ones
+ // plus the active panel when it is collapsed to this rail. The expanded panel
+ // is excluded — it renders in full below, so a rail entry would duplicate it
+ // and be announced as collapsed when it is not.
+ const dockPanels = isSharedRail
+ ? []
+ : listRightPanels().filter((candidate) =>
+ candidate.id === activeId
+ ? activeDock === dock && collapsed
+ : panelDocks[candidate.id] === dock,
+ );
// Adopt the shared content host (rendered once by the shell) into this slot
// while it owns the panel. appendChild moves the element, so stepping the
@@ -112,10 +122,48 @@ export function PluginRightPanel({ dock, contentEl, width, onWidthChange }: Plug
wrapper.appendChild(contentEl);
}, [matched, contentEl, collapsed]);
- if (!matched || !panel) return null;
+ const panelRail =
+ dockPanels.length > 0 ? (
+
+ ) : null;
+
+ if (!matched || !panel) return panelRail;
// When collapsed in shared-rail mode the host's single shared rail shows this
// panel's entry, so render nothing here (no second rail beside Style).
if (isSharedRail && collapsed) return null;
+ // Collapsed at a positional dock: `panelRail` already carries this panel's
+ // entry (alongside any other panel docked here), so nothing else renders and
+ // everything below this point runs expanded.
+ if (collapsed) return panelRail;
const handleResizeStart = (event: ReactPointerEvent) => {
event.preventDefault();
@@ -147,15 +195,6 @@ export function PluginRightPanel({ dock, contentEl, width, onWidthChange }: Plug
el.addEventListener("pointercancel", handleEnd);
};
- const railIcon =
- panel.icon && isImageSource(panel.icon) ? (
- 
- ) : isLayersSide ? (
- >;
/** Monotonic counter bumped on every registry mutation. */
version: number;
}
@@ -92,17 +98,28 @@ let collapsed = false;
// Where the active panel currently docks; reset when the active panel changes
// so each panel starts from its own declared `dock`.
let activeDock: RightPanelDock | null = null;
+const visibleIds = new Set();
+const panelDocks = new Map();
let version = 0;
let snapshot: RightPanelSnapshot = {
activeId: null,
collapsed: false,
dock: null,
+ visibleIds: [],
+ panelDocks: {},
version: 0,
};
function emit(): void {
version += 1;
- snapshot = { activeId, collapsed, dock: activeDock, version };
+ snapshot = {
+ activeId,
+ collapsed,
+ dock: activeDock,
+ visibleIds: [...visibleIds],
+ panelDocks: Object.fromEntries(panelDocks),
+ version,
+ };
for (const listener of listeners) {
listener();
}
@@ -172,6 +189,8 @@ export function unregisterRightPanel(id: string): void {
collapsed = false;
activeDock = null;
}
+ visibleIds.delete(id);
+ panelDocks.delete(id);
registry.delete(id);
titleResolver.delete(id);
emit();
@@ -190,6 +209,9 @@ export function openRightPanel(id: string): boolean {
return false;
}
if (activeId === id && !collapsed) return true;
+ const wasVisible = visibleIds.has(id);
+ visibleIds.add(id);
+ if (!wasVisible) panelDocks.set(id, normalizeDock(panel.dock));
const wasInactive = activeId !== id;
// A different panel taking over displaces the current owner; release it
// (onClose) so a plugin can free resources allocated for its panel.
@@ -199,8 +221,10 @@ export function openRightPanel(id: string): boolean {
if (displacedId !== null) {
runHook(displacedId, "onClose", registry.get(displacedId)?.onClose);
}
- // A new panel starts from its own declared dock, not the previous user move.
- if (wasInactive) activeDock = normalizeDock(panel.dock);
+ // A panel taking over restores the dock it was last at (set just above from
+ // its declared `dock` the first time it becomes visible), not the dock the
+ // panel it displaced happened to be moved to.
+ if (wasInactive) activeDock = panelDocks.get(id) ?? normalizeDock(panel.dock);
activeId = id;
collapsed = false;
emit();
@@ -226,7 +250,12 @@ export function collapseRightPanel(id: string): void {
* Close the active panel. No-op unless `id` is active.
*/
export function closeRightPanel(id: string): void {
- if (activeId !== id) return;
+ if (!visibleIds.delete(id)) return;
+ panelDocks.delete(id);
+ if (activeId !== id) {
+ emit();
+ return;
+ }
activeId = null;
collapsed = false;
activeDock = null;
@@ -246,6 +275,7 @@ export function setActiveRightPanelDock(dock: RightPanelDock): void {
return;
}
activeDock = dock;
+ panelDocks.set(activeId, dock);
emit();
}
@@ -262,6 +292,7 @@ export function moveActiveRightPanelDock(direction: "left" | "right"): void {
const nextIndex = direction === "left" ? index - 1 : index + 1;
if (nextIndex < 0 || nextIndex >= RIGHT_PANEL_DOCKS.length) return;
activeDock = RIGHT_PANEL_DOCKS[nextIndex];
+ panelDocks.set(activeId, activeDock);
emit();
}
@@ -280,6 +311,11 @@ export function isRightPanelCollapsed(): boolean {
return collapsed;
}
+/** Whether a registered panel is enabled in a dock rail. */
+export function isRightPanelVisible(id: string): boolean {
+ return visibleIds.has(id);
+}
+
/**
* Look up a registered right panel by id. Title is always resolved to a string
* by re-running the panel's title resolver on every call. The registry does
@@ -329,6 +365,15 @@ export function __resetRightPanelRegistryForTests(): void {
activeId = null;
collapsed = false;
activeDock = null;
+ visibleIds.clear();
+ panelDocks.clear();
version = 0;
- snapshot = { activeId: null, collapsed: false, dock: null, version: 0 };
+ snapshot = {
+ activeId: null,
+ collapsed: false,
+ dock: null,
+ visibleIds: [],
+ panelDocks: {},
+ version: 0,
+ };
}
diff --git a/packages/plugins/src/types.ts b/packages/plugins/src/types.ts
index dfe7b2bc9..6c95e21f1 100644
--- a/packages/plugins/src/types.ts
+++ b/packages/plugins/src/types.ts
@@ -859,8 +859,8 @@ export interface GeoLibreRightPanelRegistration {
title: string | (() => string);
/**
* Where the panel docks initially: one of the four positional docks
- * (`left-of-layers`, `right-of-layers`, `left-of-style`, or `right-of-style`,
- * the default), or a shared-rail mode (`replace-style` / `replace-layers`).
+ * (`left-of-layers`, `right-of-layers`, `left-of-style`, or `right-of-style`),
+ * or a shared-rail mode (`replace-style`, the default, or `replace-layers`).
* With a positional dock the built-in panel on the docked side (Layers on the
* left, Style on the right) collapses to its rail while the plugin panel is
* expanded next to it, and the user can move the panel between positions at
diff --git a/tests/right-panel-registry.test.ts b/tests/right-panel-registry.test.ts
index bad7340a7..bc1923e51 100644
--- a/tests/right-panel-registry.test.ts
+++ b/tests/right-panel-registry.test.ts
@@ -106,12 +106,46 @@ describe("right-panel registry", () => {
assert.deepEqual(calls, ["a:close", "b:open"]);
});
- it("defaults to right-of-style and honors a declared dock", () => {
+ it("keeps displaced panels visible in their rails until explicitly closed", () => {
+ registerRightPanel(testPanel({ id: "browser", title: "Browser", dock: "replace-layers" }));
+ registerRightPanel(testPanel({ id: "comments", title: "Comments", dock: "replace-style" }));
+
+ openRightPanel("browser");
+ openRightPanel("comments");
+
+ assert.equal(getActiveRightPanel(), "comments");
+ assert.deepEqual(getRightPanelSnapshot().visibleIds, ["browser", "comments"]);
+
+ closeRightPanel("browser");
+ assert.equal(getActiveRightPanel(), "comments");
+ assert.deepEqual(getRightPanelSnapshot().visibleIds, ["comments"]);
+ // Closing also forgets the panel's remembered dock, so re-enabling it later
+ // starts from its declared dock rather than wherever it was last moved.
+ assert.equal("browser" in getRightPanelSnapshot().panelDocks, false);
+ });
+
+ it("preserves each visible panel's merged dock while another panel is active", () => {
+ registerRightPanel(testPanel({ id: "comments", title: "Comments", dock: "replace-style" }));
+ registerRightPanel(testPanel({ id: "catalog", title: "Catalog", dock: "right-of-style" }));
+
+ openRightPanel("comments");
+ openRightPanel("catalog");
+ setActiveRightPanelDock("replace-style");
+ openRightPanel("comments");
+
+ assert.equal(getActiveRightPanel(), "comments");
+ assert.equal(getRightPanelSnapshot().panelDocks.comments, "replace-style");
+ assert.equal(getRightPanelSnapshot().panelDocks.catalog, "replace-style");
+ // Re-activating a still-visible panel restores its remembered dock.
+ assert.equal(getActiveRightPanelDock(), "replace-style");
+ });
+
+ it("defaults to the shared Style rail and honors a declared dock", () => {
registerRightPanel(testPanel({ id: "r", title: "R" }));
registerRightPanel(testPanel({ id: "l", title: "L", dock: "left-of-layers" }));
openRightPanel("r");
- assert.equal(getActiveRightPanelDock(), "right-of-style");
- assert.equal(getRightPanelSnapshot().dock, "right-of-style");
+ assert.equal(getActiveRightPanelDock(), "replace-style");
+ assert.equal(getRightPanelSnapshot().dock, "replace-style");
openRightPanel("l");
assert.equal(getActiveRightPanelDock(), "left-of-layers");
});
@@ -120,7 +154,7 @@ describe("right-panel registry", () => {
registerRightPanel(testPanel({ id: "a", title: "A" }));
registerRightPanel(testPanel({ id: "b", title: "B" }));
openRightPanel("a");
- assert.equal(getActiveRightPanelDock(), "right-of-style");
+ assert.equal(getActiveRightPanelDock(), "replace-style");
setActiveRightPanelDock("left-of-style");
assert.equal(getActiveRightPanelDock(), "left-of-style");
@@ -142,7 +176,7 @@ describe("right-panel registry", () => {
// Opening another panel resets to that panel's declared dock.
openRightPanel("b");
- assert.equal(getActiveRightPanelDock(), "right-of-style");
+ assert.equal(getActiveRightPanelDock(), "replace-style");
// Closing clears the dock entirely.
closeRightPanel("b");
assert.equal(getActiveRightPanelDock(), null);
@@ -191,14 +225,14 @@ describe("right-panel registry", () => {
assert.equal(getActiveRightPanelDock(), "right-of-layers");
});
- it("falls back to right-of-style for an unknown declared dock", () => {
+ it("falls back to the shared Style rail for an unknown declared dock", () => {
registerRightPanel(
testPanel({
dock: "nonsense" as unknown as GeoLibreRightPanelRegistration["dock"],
}),
);
openRightPanel("workbench");
- assert.equal(getActiveRightPanelDock(), "right-of-style");
+ assert.equal(getActiveRightPanelDock(), "replace-style");
});
it("ignores dock changes when no panel is active", () => {