@peers-app/peers-ui 0.25.2 → 0.25.3

package/dist/tabs-layout/network-status-indicator.js

@@ -12,6 +12,7 @@ exports.TabsStripIndicators = TabsStripIndicators;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const moment_1 = __importDefault(require("moment"));
 const react_1 = require("react");
+const identity_routes_1 = require("../screens/identity/identity-routes");
 const network_viewer_ipc_1 = require("../screens/network-viewer/network-viewer-ipc");
 const tabs_state_1 = require("./tabs-state");
 const use_network_status_1 = require("./use-network-status");
@@ -189,8 +190,8 @@ function ConnectedDevicesList({ loadState }) {
     }
     return ((0, jsx_runtime_1.jsx)("ul", { className: "small mb-0 ps-0", style: { maxHeight: "180px", overflowY: "auto" }, children: loadState.connections.map((connection) => ((0, jsx_runtime_1.jsx)(ConnectedDeviceRow, { connection: connection }, connection.deviceId))) }));
 }
-function NetworkStatusDetails({ detailsId, status, unavailable, connectionsLoadState, onOpenViewer, }) {
-    return ((0, jsx_runtime_1.jsx)("div", { id: detailsId, role: "dialog", "aria-label": "Network status details", className: "card shadow position-absolute end-0 mt-1", style: { top: "100%", width: "320px", zIndex: 1100 }, children: (0, jsx_runtime_1.jsxs)("div", { className: "card-body p-3", children: [(0, jsx_runtime_1.jsx)("h6", { className: "card-title mb-2", children: "Network status" }), unavailable || !status ? ((0, jsx_runtime_1.jsx)("p", { className: "small text-muted mb-3", children: "Network diagnostics are temporarily unavailable. The local host may still be starting or reconnecting." })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("dl", { className: "row small mb-2", children: [(0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Connections" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.connectionCount }), (0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Syncing contexts" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.syncingContextCount }), (0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Sync errors" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.errorCount }), (0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Groups connected" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.connectedContextCount }), (0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Groups offline" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.disconnectedContextCount }), status.lastSuccessfulSyncAt != null && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Last sync" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end text-truncate", title: new Date(status.lastSuccessfulSyncAt).toLocaleString(), children: formatRelativeSyncTime(status.lastSuccessfulSyncAt) })] }))] }), status.errors.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "alert alert-danger py-2 px-2 small mb-2", children: [status.errors[0].message, status.errors.length > 1 && ` (+${status.errors.length - 1} more)`] })), (0, jsx_runtime_1.jsxs)("div", { className: "border-top pt-2 mt-1 mb-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "small text-muted mb-1", children: "Devices" }), (0, jsx_runtime_1.jsx)(ConnectedDevicesList, { loadState: connectionsLoadState })] })] })), (0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn btn-sm btn-outline-primary w-100", onClick: onOpenViewer, children: "Open Network Viewer" })] }) }));
+function NetworkStatusDetails({ detailsId, status, unavailable, connectionsLoadState, onUseInvite, onOpenIdentity, onOpenViewer, }) {
+    return ((0, jsx_runtime_1.jsx)("div", { id: detailsId, role: "dialog", "aria-label": "Network status details", className: "card shadow position-absolute end-0 mt-1", style: { top: "100%", width: "320px", zIndex: 1100 }, children: (0, jsx_runtime_1.jsxs)("div", { className: "card-body p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "d-flex gap-2 mb-3", children: [(0, jsx_runtime_1.jsxs)("button", { type: "button", className: "btn btn-sm btn-outline-primary flex-fill", onClick: onUseInvite, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-qr-code me-1", "aria-hidden": "true" }), "Use Invite"] }), (0, jsx_runtime_1.jsxs)("button", { type: "button", className: "btn btn-sm btn-outline-primary flex-fill", onClick: onOpenIdentity, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-person-badge me-1", "aria-hidden": "true" }), "Identity"] })] }), (0, jsx_runtime_1.jsx)("h6", { className: "card-title mb-2", children: "Network status" }), unavailable || !status ? ((0, jsx_runtime_1.jsx)("p", { className: "small text-muted mb-3", children: "Network diagnostics are temporarily unavailable. The local host may still be starting or reconnecting." })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("dl", { className: "row small mb-2", children: [(0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Connections" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.connectionCount }), (0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Syncing contexts" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.syncingContextCount }), (0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Sync errors" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.errorCount }), (0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Groups connected" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.connectedContextCount }), (0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Groups offline" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end", children: status.disconnectedContextCount }), status.lastSuccessfulSyncAt != null && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("dt", { className: "col-7", children: "Last sync" }), (0, jsx_runtime_1.jsx)("dd", { className: "col-5 text-end text-truncate", title: new Date(status.lastSuccessfulSyncAt).toLocaleString(), children: formatRelativeSyncTime(status.lastSuccessfulSyncAt) })] }))] }), status.errors.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "alert alert-danger py-2 px-2 small mb-2", children: [status.errors[0].message, status.errors.length > 1 && ` (+${status.errors.length - 1} more)`] })), (0, jsx_runtime_1.jsxs)("div", { className: "border-top pt-2 mt-1 mb-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "small text-muted mb-1", children: "Devices" }), (0, jsx_runtime_1.jsx)(ConnectedDevicesList, { loadState: connectionsLoadState })] })] })), (0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn btn-sm btn-outline-primary w-100", onClick: onOpenViewer, children: "Open Network Viewer" })] }) }));
 }
 /** Accessible reactive network status button and details popover. */
 function NetworkStatusIndicator({ compact = false }) {
@@ -305,7 +306,13 @@ function NetworkStatusIndicator({ compact = false }) {
                                     fontWeight: 700,
                                     right: "-0.28rem",
                                     bottom: "-0.32rem",
-                                }, "aria-hidden": "true", children: presentation.disconnectedGroupsOverlay.count }))] }), !compact && ((0, jsx_runtime_1.jsxs)("span", { className: "small", children: [viewState.status?.connectionCount ?? 0, (0, jsx_runtime_1.jsx)("span", { className: "visually-hidden", children: " connections" })] }))] }), open && ((0, jsx_runtime_1.jsx)(NetworkStatusDetails, { detailsId: detailsId, status: viewState.status, unavailable: viewState.availability !== "ready", connectionsLoadState: connectionsLoadState, onOpenViewer: () => {
+                                }, "aria-hidden": "true", children: presentation.disconnectedGroupsOverlay.count }))] }), !compact && ((0, jsx_runtime_1.jsxs)("span", { className: "small", children: [viewState.status?.connectionCount ?? 0, (0, jsx_runtime_1.jsx)("span", { className: "visually-hidden", children: " connections" })] }))] }), open && ((0, jsx_runtime_1.jsx)(NetworkStatusDetails, { detailsId: detailsId, status: viewState.status, unavailable: viewState.availability !== "ready", connectionsLoadState: connectionsLoadState, onUseInvite: () => {
+                    setOpen(false);
+                    (0, tabs_state_1.goToTabPath)(identity_routes_1.IDENTITY_ACCEPT_PATH);
+                }, onOpenIdentity: () => {
+                    setOpen(false);
+                    (0, tabs_state_1.goToTabPath)(identity_routes_1.IDENTITY_ACCOUNT_PATH);
+                }, onOpenViewer: () => {
                     setOpen(false);
                     (0, tabs_state_1.goToTabPath)("network-viewer");
                 } }))] }));

package/dist/tabs-layout/network-status-indicator.test.js

@@ -7,6 +7,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const peers_sdk_1 = require("@peers-app/peers-sdk");
 const react_1 = require("@testing-library/react");
 const moment_1 = __importDefault(require("moment"));
+const identity_routes_1 = require("../screens/identity/identity-routes");
 const network_status_indicator_1 = require("./network-status-indicator");
 const goToTabPath = jest.fn();
 const getConnections = jest.fn();
@@ -424,6 +425,20 @@ describe("NetworkStatusIndicator", () => {
             expect(view.getByRole("dialog")).toHaveTextContent("Couldn't load devices");
         });
     });
+    it("offers shortcuts to use an invite and open the Identity account", () => {
+        mockViewState = { availability: "ready", status: status({ state: "synced" }) };
+        const view = (0, react_1.render)((0, jsx_runtime_1.jsx)(network_status_indicator_1.NetworkStatusIndicator, {}));
+        react_1.fireEvent.click(view.getByRole("button", { name: /Network synced/ }));
+        expect(view.getByRole("button", { name: "Use Invite" }).querySelector(".bi-qr-code")).toBeTruthy();
+        expect(view.getByRole("button", { name: "Identity" }).querySelector(".bi-person-badge")).toBeTruthy();
+        react_1.fireEvent.click(view.getByRole("button", { name: "Use Invite" }));
+        expect(goToTabPath).toHaveBeenCalledWith(identity_routes_1.IDENTITY_ACCEPT_PATH);
+        expect(view.queryByRole("dialog", { name: "Network status details" })).toBeNull();
+        react_1.fireEvent.click(view.getByRole("button", { name: /Network synced/ }));
+        react_1.fireEvent.click(view.getByRole("button", { name: "Identity" }));
+        expect(goToTabPath).toHaveBeenCalledWith(identity_routes_1.IDENTITY_ACCOUNT_PATH);
+        expect(view.queryByRole("dialog", { name: "Network status details" })).toBeNull();
+    });
     it("updates on rerender and opens details before navigating to Network Viewer", async () => {
         const view = (0, react_1.render)((0, jsx_runtime_1.jsx)(network_status_indicator_1.NetworkStatusIndicator, {}));
         expect(view.getByRole("button", { name: /loading/ })).toBeTruthy();

package/dist/tabs-layout/tabs-layout.js

@@ -44,6 +44,7 @@ const group_switcher_1 = require("../components/group-switcher");
 const router_1 = require("../components/router");
 const globals_1 = require("../globals");
 const hooks_1 = require("../hooks");
+const identity_routes_1 = require("../screens/identity/identity-routes");
 const color_mode_dropdown_1 = require("../screens/settings/color-mode-dropdown");
 const system_apps_1 = require("../system-apps");
 const routes_loader_1 = require("../ui-router/routes-loader");
@@ -281,7 +282,8 @@ const TabContentRenderer = react_1.default.memo(({ tab, isMobile }) => {
     // System apps use the main Router (which reads from mainContentPath)
     // Package apps use UIRouter with explicit path
     const isSystemApp = tab.packageId === "system-apps";
-    return ((0, jsx_runtime_1.jsx)("div", { className: `h-100 overflow-auto ${isMobile ? "p-2" : "p-3"}`, children: isSystemApp ? ((0, jsx_runtime_1.jsx)(router_1.Router, { path: tab.path })) : ((0, jsx_runtime_1.jsx)(ui_loader_1.UIRouter, { path: tab.path, uiCategory: "screen", props: {} })) }));
+    const identityApp = isSystemApp && (0, identity_routes_1.isIdentityPath)(tab.path);
+    return ((0, jsx_runtime_1.jsx)("div", { className: `h-100 ${identityApp ? "overflow-hidden" : "overflow-auto"} ${identityApp ? "" : isMobile ? "p-2" : "p-3"}`, children: isSystemApp ? ((0, jsx_runtime_1.jsx)(router_1.Router, { path: tab.path })) : ((0, jsx_runtime_1.jsx)(ui_loader_1.UIRouter, { path: tab.path, uiCategory: "screen", props: {} })) }));
 }, (prevProps, nextProps) => {
     // Only re-render if the tab or isMobile changed
     return (prevProps.tab.tabId === nextProps.tab.tabId &&

package/dist/tabs-layout/tabs-state.d.ts

@@ -1,5 +1,6 @@
 import { type IAppNav, type Observable } from "@peers-app/peers-sdk";
 import { type IPackageWithNavs } from "../ui-router/routes-loader";
+/** One top-level app tab. */
 export interface TabState {
     tabId: string;
     packageId?: string;
@@ -7,24 +8,92 @@ export interface TabState {
     title: string;
     iconClassName?: string;
 }
+/** The app launcher tab. It is always present and cannot be closed. */
 export declare const launcherApp: TabState;
+/** Open tabs. Writes through to device storage after the initial restore. */
 export declare const activeTabs: Observable<TabState[]> & {
     loadingPromise: Promise<void>;
 };
+/** Id of the tab whose path is showing. */
 export declare const activeTabId: Observable<string> & {
     loadingPromise: Promise<void>;
 };
+/** App roots recently opened from the launcher, newest first. */
 export declare const recentlyUsedApps: Observable<string[]> & {
     loadingPromise: Promise<void>;
 };
+/** Tab ids whose bodies have been mounted at least once. */
 export declare const initializedTabs: Set<string>;
+/** Options for {@link navigateTo}. */
+export interface NavigateOptions {
+    /**
+     * When the requested path is an app's root and that app is already open,
+     * activate the existing tab without resetting its section.
+     */
+    preserveSectionOnAppRoot?: boolean;
+}
+/**
+ * Open a path in the tab that owns its app.
+ *
+ * Legacy identity aliases are rewritten first. A route owned by the current
+ * app replaces that tab's path. A route owned by another open app activates
+ * that app's tab. Otherwise a new tab is opened.
+ *
+ * @param rawPath - Requested route, with or without a query string.
+ * @param options - App-root behavior. Launcher opens preserve the current section.
+ */
+export declare function navigateTo(rawPath: string, options?: NavigateOptions): void;
+/**
+ * Open an app or path from the launcher.
+ *
+ * Choosing an app that is already open keeps the section the user was on.
+ *
+ * @param path - App root or deep link.
+ */
 export declare function goToTabPath(path: string): void;
-export declare const handleMainPathChanged: (oldPath: string, newPath: string, setNewMainPath: (path: string) => void) => void;
+/**
+ * Apply a {@link mainContentPath} write to the open tabs.
+ *
+ * @param _oldPath - Previous route. Retained for existing call sites.
+ * @param newPath - Requested route.
+ * @param _setNewMainPath - Direct path setter. Navigation updates the path itself.
+ */
+export declare const handleMainPathChanged: (_oldPath: string, newPath: string, _setNewMainPath: (path: string) => void) => void;
+/**
+ * Rewrite stored tabs onto canonical routes.
+ *
+ * Contacts, Groups, and Devices tabs from before the Identity app become one
+ * Identity tab. The active tab is kept when it is one of those duplicates.
+ *
+ * @param tabs - Persisted tabs.
+ * @param activeId - Persisted active tab id.
+ */
+export declare function restoreNavigationState(tabs: TabState[], activeId: string): {
+    tabs: TabState[];
+    activeId: string;
+};
+/**
+ * Map a stored recent-app path onto the current app root.
+ *
+ * @param path - Persisted recent path, possibly a legacy alias.
+ */
+export declare function migrateRecentPath(path: string): string;
 type AppInfo = {
     navItem: IAppNav;
     package: IPackageWithNavs;
 };
+/**
+ * Resolve the app that owns a route.
+ *
+ * @param path - Route, with or without a query string.
+ * @returns The matching app, the launcher for an empty path, or `undefined`.
+ */
 export declare function determineAppFromPath(path: string): AppInfo | undefined;
+/**
+ * Set the active tab's title.
+ *
+ * @param newTitle - Title shown on the tab strip.
+ */
 export declare const updateActiveTabTitle: (newTitle: string) => void;
 /**
  * Enable or disable single-tab mode.
@@ -36,8 +105,17 @@ export declare const updateActiveTabTitle: (newTitle: string) => void;
  * and disable it on unmount.
  */
 export declare const setSingleTabMode: (enabled: boolean) => void;
+/**
+ * Open a tab, or activate an existing tab with the same package and path.
+ *
+ * @param tab - Tab contents. `tabId` is assigned here.
+ * @param forceNew - When true, always append a tab instead of reusing one.
+ */
 export declare const openNewTab: (tab: Omit<TabState, "tabId">, forceNew?: boolean) => void;
+/** Close the active tab. The launcher tab stays open. */
 export declare const closeCurrentTab: () => void;
+/** Activate the next open tab, wrapping around. */
 export declare const switchToNextTab: () => void;
+/** Activate the previous open tab, wrapping around. */
 export declare const switchToPreviousTab: () => void;
 export {};

package/dist/tabs-layout/tabs-state.js

@@ -1,12 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.switchToPreviousTab = exports.switchToNextTab = exports.closeCurrentTab = exports.openNewTab = exports.setSingleTabMode = exports.updateActiveTabTitle = exports.handleMainPathChanged = exports.initializedTabs = exports.recentlyUsedApps = exports.activeTabId = exports.activeTabs = exports.launcherApp = void 0;
+exports.navigateTo = navigateTo;
 exports.goToTabPath = goToTabPath;
+exports.restoreNavigationState = restoreNavigationState;
+exports.migrateRecentPath = migrateRecentPath;
 exports.determineAppFromPath = determineAppFromPath;
 const peers_sdk_1 = require("@peers-app/peers-sdk");
 const globals_1 = require("../globals");
+const identity_routes_1 = require("../screens/identity/identity-routes");
 const system_apps_1 = require("../system-apps");
 const routes_loader_1 = require("../ui-router/routes-loader");
+/** The app launcher tab. It is always present and cannot be closed. */
 exports.launcherApp = {
     tabId: "launcher",
     packageId: "launcher",
@@ -24,109 +29,163 @@ const _persistentActiveTabId = (0, peers_sdk_1.groupDeviceVar)("activeTabId", {
 const _persistentRecentlyUsedApps = (0, peers_sdk_1.groupUserVar)("recentlyUsedApps", {
     defaultValue: [],
 });
+let finishNavigationRestore = () => { };
+const navigationReady = new Promise((resolve) => {
+    finishNavigationRestore = resolve;
+});
 // In-memory observables for UI state (loaded once, then write-through to persistent vars)
+/** Open tabs. Writes through to device storage after the initial restore. */
 exports.activeTabs = (() => {
     const obs = (0, peers_sdk_1.observable)([exports.launcherApp]);
     // Write-through to persistent var on change
     obs.subscribe((value) => {
         _persistentActiveTabs(value);
     });
-    // Load initial value once
-    const loadingPromise = _persistentActiveTabs.loadingPromise.then(() => {
-        obs(_persistentActiveTabs());
-    });
-    return Object.assign(obs, { loadingPromise });
+    return Object.assign(obs, { loadingPromise: navigationReady });
 })();
+/** Id of the tab whose path is showing. */
 exports.activeTabId = (() => {
     const obs = (0, peers_sdk_1.observable)("launcher");
     // Write-through to persistent var on change
     obs.subscribe((value) => {
         _persistentActiveTabId(value);
     });
-    // Load initial value once
-    const loadingPromise = _persistentActiveTabId.loadingPromise.then(() => {
-        obs(_persistentActiveTabId());
-    });
-    return Object.assign(obs, { loadingPromise });
+    return Object.assign(obs, { loadingPromise: navigationReady });
 })();
+/** App roots recently opened from the launcher, newest first. */
 exports.recentlyUsedApps = (() => {
     const obs = (0, peers_sdk_1.observable)([]);
     // Write-through to persistent var on change
     obs.subscribe((value) => {
         _persistentRecentlyUsedApps(value);
     });
-    // Load initial value once
-    const loadingPromise = _persistentRecentlyUsedApps.loadingPromise.then(() => {
-        obs(_persistentRecentlyUsedApps());
-    });
-    return Object.assign(obs, { loadingPromise });
+    return Object.assign(obs, { loadingPromise: navigationReady });
 })();
-exports.initializedTabs = new Set();
-function goToTabPath(path) {
-    const tab = (0, exports.activeTabs)().find((t) => t.path === path);
-    if (tab) {
-        (0, exports.activeTabId)(tab.tabId);
+void Promise.all([
+    _persistentActiveTabs.loadingPromise,
+    _persistentActiveTabId.loadingPromise,
+    _persistentRecentlyUsedApps.loadingPromise,
+]).then(() => {
+    const restored = restoreNavigationState(_persistentActiveTabs(), _persistentActiveTabId());
+    (0, exports.activeTabs)(restored.tabs);
+    if ((0, exports.activeTabId)() !== restored.activeId) {
+        (0, exports.activeTabId)(restored.activeId);
     }
-    else {
-        const appInfo = determineAppFromPath(path);
-        if (appInfo) {
-            (0, exports.openNewTab)({
-                path: path,
-                title: appInfo.navItem.displayName || appInfo.navItem.name,
-                packageId: appInfo.package.packageId,
-                iconClassName: appInfo.navItem.iconClassName,
-            });
+    (0, exports.recentlyUsedApps)(migrateRecentPaths(_persistentRecentlyUsedApps()));
+    finishNavigationRestore();
+});
+/** Tab ids whose bodies have been mounted at least once. */
+exports.initializedTabs = new Set();
+/**
+ * Open a path in the tab that owns its app.
+ *
+ * Legacy identity aliases are rewritten first. A route owned by the current
+ * app replaces that tab's path. A route owned by another open app activates
+ * that app's tab. Otherwise a new tab is opened.
+ *
+ * @param rawPath - Requested route, with or without a query string.
+ * @param options - App-root behavior. Launcher opens preserve the current section.
+ */
+function navigateTo(rawPath, options) {
+    const requestedPathname = (0, identity_routes_1.parseRoute)(rawPath).pathname;
+    if (!requestedPathname) {
+        const launcher = (0, exports.activeTabs)().find((tab) => tab.tabId === "launcher") ?? (0, exports.activeTabs)()[0];
+        if (launcher && (0, exports.activeTabId)() !== launcher.tabId) {
+            (0, exports.activeTabId)(launcher.tabId);
         }
-        else {
-            // No app matched — navigate by updating the active tab's path (e.g. deep link).
-            // Must replace the tab object (immutable): TabContentRenderer is memoized on tab.path,
-            // and mutating in place makes prev/next props compare equal so Router never re-renders.
-            const currentTabId = (0, exports.activeTabId)();
-            const currentTabs = (0, exports.activeTabs)();
-            const idx = currentTabs.findIndex((t) => t.tabId === currentTabId);
-            if (idx >= 0 && currentTabs[idx].path !== "") {
-                const prev = currentTabs[idx];
-                const newTabs = [...currentTabs];
-                newTabs[idx] = { ...prev, path };
-                (0, exports.activeTabs)(newTabs);
-                if (prev.packageId !== "launcher") {
-                    (0, globals_1._mainContentPath)(path);
-                }
-            }
-            else {
-                (0, exports.openNewTab)({
-                    path: path,
-                    title: "New Tab",
-                    packageId: "system-apps",
-                    iconClassName: "bi-question-circle",
-                });
+        return;
+    }
+    const next = (0, identity_routes_1.canonicalizeRoute)(rawPath);
+    const app = determineAppFromPath(next);
+    if (options?.preserveSectionOnAppRoot && app && isAppRootRequest(requestedPathname, app)) {
+        const existing = findTabForApp(app);
+        if (existing) {
+            if ((0, exports.activeTabId)() !== existing.tabId) {
+                (0, exports.activeTabId)(existing.tabId);
             }
+            rememberRecentApp(existing.path);
+            return;
         }
     }
-}
-const handleMainPathChanged = (oldPath, newPath, setNewMainPath) => {
-    const oldPathPart = oldPath.toLowerCase().trim().split("?")[0];
-    const newPathPart = newPath.toLowerCase().trim().split("?")[0];
-    const currentTab = (0, exports.activeTabs)().find((t) => t.tabId === (0, exports.activeTabId)());
-    if (oldPathPart === newPathPart || (currentTab && currentTab.path === newPath)) {
-        // nothing to do
-        setNewMainPath(newPath);
+    if (!app || app.package.packageId === "launcher") {
+        openUnresolved(next);
         return;
     }
-    const appInfo = determineAppFromPath(newPath);
-    if (appInfo && oldPath !== "") {
-        (0, exports.openNewTab)({
-            path: newPath,
-            title: appInfo.navItem.displayName || appInfo.navItem.name,
-            packageId: appInfo.package.packageId,
-            iconClassName: appInfo.navItem.iconClassName,
-        });
+    const current = (0, exports.activeTabs)().find((tab) => tab.tabId === (0, exports.activeTabId)());
+    const currentApp = current ? determineAppFromPath(current.path) : undefined;
+    if (current && current.packageId !== "launcher" && currentApp && sameApp(currentApp, app)) {
+        showTab(current.tabId, next);
+        return;
     }
-    else {
-        setNewMainPath(newPath);
+    const existing = findTabForApp(app);
+    if (existing) {
+        showTab(existing.tabId, next);
+        return;
     }
+    (0, exports.openNewTab)({
+        path: next,
+        title: app.navItem.displayName || app.navItem.name,
+        packageId: app.package.packageId,
+        iconClassName: app.navItem.iconClassName,
+    });
+}
+/**
+ * Open an app or path from the launcher.
+ *
+ * Choosing an app that is already open keeps the section the user was on.
+ *
+ * @param path - App root or deep link.
+ */
+function goToTabPath(path) {
+    navigateTo(path, { preserveSectionOnAppRoot: true });
+}
+/**
+ * Apply a {@link mainContentPath} write to the open tabs.
+ *
+ * @param _oldPath - Previous route. Retained for existing call sites.
+ * @param newPath - Requested route.
+ * @param _setNewMainPath - Direct path setter. Navigation updates the path itself.
+ */
+const handleMainPathChanged = (_oldPath, newPath, _setNewMainPath) => {
+    navigateTo(newPath);
 };
 exports.handleMainPathChanged = handleMainPathChanged;
+/**
+ * Rewrite stored tabs onto canonical routes.
+ *
+ * Contacts, Groups, and Devices tabs from before the Identity app become one
+ * Identity tab. The active tab is kept when it is one of those duplicates.
+ *
+ * @param tabs - Persisted tabs.
+ * @param activeId - Persisted active tab id.
+ */
+function restoreNavigationState(tabs, activeId) {
+    const migrated = (tabs.length > 0 ? tabs : [exports.launcherApp]).map(migrateStoredTab);
+    const merged = mergeIdentityTabs(migrated, activeId);
+    const activeExists = merged.tabs.some((tab) => tab.tabId === merged.activeId);
+    return {
+        tabs: merged.tabs,
+        activeId: activeExists ? merged.activeId : merged.tabs[0].tabId,
+    };
+}
+/**
+ * Map a stored recent-app path onto the current app root.
+ *
+ * @param path - Persisted recent path, possibly a legacy alias.
+ */
+function migrateRecentPath(path) {
+    const canonical = (0, identity_routes_1.canonicalizeRoute)(path);
+    if ((0, identity_routes_1.isIdentityPath)(canonical)) {
+        return identity_routes_1.IDENTITY_APP_PATH;
+    }
+    return canonical;
+}
+/**
+ * Resolve the app that owns a route.
+ *
+ * @param path - Route, with or without a query string.
+ * @returns The matching app, the launcher for an empty path, or `undefined`.
+ */
 function determineAppFromPath(path) {
     const launcherInfo = {
         navItem: {
@@ -192,7 +251,123 @@ function determineAppFromPath(path) {
     console.warn(`No app found for path: ${path}`);
     return undefined;
 }
-// Utility function for detail screens to update the active tab's title
+function appKey(app) {
+    const nav = app.navItem.navigationPath || app.navItem.name.toLowerCase();
+    return `${app.package.packageId}:${nav}`;
+}
+function sameApp(left, right) {
+    return appKey(left) === appKey(right);
+}
+function isAppRootRequest(pathname, app) {
+    const nav = (app.navItem.navigationPath || app.navItem.name).toLowerCase();
+    return pathname.toLowerCase() === nav;
+}
+function findTabForApp(app) {
+    const key = appKey(app);
+    return (0, exports.activeTabs)().find((tab) => {
+        const info = determineAppFromPath(tab.path);
+        return info ? appKey(info) === key : false;
+    });
+}
+/**
+ * Replace a tab's path immutably so the memoized tab body re-renders.
+ * Activating a different tab lets the tab subscription publish the path.
+ */
+function showTab(tabId, path) {
+    const tabs = (0, exports.activeTabs)();
+    const index = tabs.findIndex((tab) => tab.tabId === tabId);
+    if (index < 0) {
+        return;
+    }
+    const current = tabs[index];
+    if (current.path !== path) {
+        const nextTabs = [...tabs];
+        nextTabs[index] = { ...current, path };
+        (0, exports.activeTabs)(nextTabs);
+    }
+    if ((0, exports.activeTabId)() !== tabId) {
+        (0, exports.activeTabId)(tabId);
+    }
+    else if ((0, globals_1._mainContentPath)() !== path) {
+        (0, globals_1._mainContentPath)(path);
+    }
+    rememberRecentApp(path);
+}
+function openUnresolved(path) {
+    const current = (0, exports.activeTabs)().find((tab) => tab.tabId === (0, exports.activeTabId)());
+    if (current && current.packageId === "system-apps") {
+        showTab(current.tabId, path);
+        return;
+    }
+    (0, exports.openNewTab)({
+        path,
+        title: "New Tab",
+        packageId: "system-apps",
+        iconClassName: "bi-question-circle",
+    });
+}
+function rememberRecentApp(path) {
+    const app = determineAppFromPath((0, identity_routes_1.canonicalizeRoute)(path));
+    if (!app || app.package.packageId === "launcher") {
+        return;
+    }
+    const recentPath = app.package.packageId === system_apps_1.systemPackage.packageId ? app.navItem.navigationPath || path : path;
+    if (!recentPath) {
+        return;
+    }
+    const recent = (0, exports.recentlyUsedApps)();
+    const filtered = recent.filter((entry) => entry !== recentPath);
+    const next = [recentPath, ...filtered].slice(0, 8);
+    if (next.length === recent.length && next.every((entry, index) => entry === recent[index])) {
+        return;
+    }
+    (0, exports.recentlyUsedApps)(next);
+}
+function migrateStoredTab(tab) {
+    const path = (0, identity_routes_1.canonicalizeRoute)(tab.path);
+    if (path === tab.path) {
+        return tab;
+    }
+    const app = determineAppFromPath(path);
+    const identity = app?.navItem.navigationPath === identity_routes_1.IDENTITY_APP_PATH;
+    return {
+        ...tab,
+        path,
+        packageId: app?.package.packageId ?? tab.packageId,
+        title: identity ? app?.navItem.displayName || app?.navItem.name || tab.title : tab.title,
+        iconClassName: identity ? app?.navItem.iconClassName || tab.iconClassName : tab.iconClassName,
+    };
+}
+function mergeIdentityTabs(tabs, activeId) {
+    const identityTabs = tabs.filter((tab) => (0, identity_routes_1.isIdentityPath)(tab.path));
+    if (identityTabs.length <= 1) {
+        return { tabs, activeId };
+    }
+    const keeper = identityTabs.find((tab) => tab.tabId === activeId) ?? identityTabs[0];
+    const remove = new Set(identityTabs.filter((tab) => tab.tabId !== keeper.tabId).map((tab) => tab.tabId));
+    return {
+        tabs: tabs.filter((tab) => !remove.has(tab.tabId)),
+        activeId: remove.has(activeId) ? keeper.tabId : activeId,
+    };
+}
+function migrateRecentPaths(paths) {
+    const seen = new Set();
+    const next = [];
+    for (const path of paths) {
+        const migrated = migrateRecentPath(path);
+        if (!migrated || seen.has(migrated)) {
+            continue;
+        }
+        seen.add(migrated);
+        next.push(migrated);
+    }
+    return next.slice(0, 8);
+}
+/**
+ * Set the active tab's title.
+ *
+ * @param newTitle - Title shown on the tab strip.
+ */
 const updateActiveTabTitle = (newTitle) => {
     // TODO Fix this to use a more reliable update mechanism
     //      using setTimeout to get around a race condition for setting title on new tabs
@@ -222,7 +397,12 @@ const setSingleTabMode = (enabled) => {
     singleTabModeEnabled = enabled;
 };
 exports.setSingleTabMode = setSingleTabMode;
-// Global function to open content in new tab
+/**
+ * Open a tab, or activate an existing tab with the same package and path.
+ *
+ * @param tab - Tab contents. `tabId` is assigned here.
+ * @param forceNew - When true, always append a tab instead of reusing one.
+ */
 const openNewTab = (tab, forceNew = false) => {
     const newTab = {
         ...tab,
@@ -255,15 +435,12 @@ const openNewTab = (tab, forceNew = false) => {
         (0, exports.activeTabs)([...currentTabs, newTab]);
         (0, exports.activeTabId)(newTab.tabId);
     }
-    // Update recently used (track by path instead of packageId)
     if (tab.path && tab.packageId !== "launcher") {
-        const recent = (0, exports.recentlyUsedApps)();
-        const filtered = recent.filter((path) => path !== tab.path);
-        (0, exports.recentlyUsedApps)([tab.path, ...filtered].slice(0, 8));
+        rememberRecentApp(tab.path);
     }
 };
 exports.openNewTab = openNewTab;
-// Close the current active tab (but not launcher)
+/** Close the active tab. The launcher tab stays open. */
 const closeCurrentTab = () => {
     const currentTabs = (0, exports.activeTabs)();
     const _activeTabId = (0, exports.activeTabId)();
@@ -285,7 +462,7 @@ const closeCurrentTab = () => {
     }
 };
 exports.closeCurrentTab = closeCurrentTab;
-// Navigate to next tab
+/** Activate the next open tab, wrapping around. */
 const switchToNextTab = () => {
     const currentTabs = (0, exports.activeTabs)();
     const activeTab = (0, exports.activeTabId)();
@@ -296,7 +473,7 @@ const switchToNextTab = () => {
     (0, exports.activeTabId)(currentTabs[nextIndex].tabId);
 };
 exports.switchToNextTab = switchToNextTab;
-// Navigate to previous tab
+/** Activate the previous open tab, wrapping around. */
 const switchToPreviousTab = () => {
     const currentTabs = (0, exports.activeTabs)();
     const activeTab = (0, exports.activeTabId)();

package/dist/tabs-layout/tabs-state.test.d.ts

@@ -0,0 +1 @@
+export {};