@robosystems/core 0.8.2 → 0.8.4

package/auth-core/config.d.ts

@@ -24,4 +24,6 @@ export declare const getAppConfig: (appName: string) => AppConfig;
  */
 export declare const LOGIN_HOME_APP: AppName;
 export declare const getLoginHomeUrl: () => string;
+/** Product-facing name of the login home, for "managed on X" copy. */
+export declare const getLoginHomeName: () => string;
 export declare const isLoginHome: () => boolean;

package/auth-core/config.js

@@ -61,4 +61,6 @@ export const getAppConfig = (appName) => {
  */
 export const LOGIN_HOME_APP = process.env.NEXT_PUBLIC_LOGIN_HOME_APP || 'robosystems';
 export const getLoginHomeUrl = () => getAppConfig(LOGIN_HOME_APP).url;
+/** Product-facing name of the login home, for "managed on X" copy. */
+export const getLoginHomeName = () => getAppConfig(LOGIN_HOME_APP).displayName;
 export const isLoginHome = () => CURRENT_APP === LOGIN_HOME_APP;

package/auth-core/sso.d.ts

@@ -1,4 +1,17 @@
 import type { AppConfig, AuthUser } from './types';
+export interface SSORedirectUrlOptions {
+    /**
+     * Mirror the target app / return URL into this tab's sessionStorage as a
+     * same-domain fallback for `handleSSOLogin`. Default true.
+     *
+     * Pass false when the URL is being handed to a *different* tab: the hints
+     * are unreadable there (separate tab, separate origin) and would linger in
+     * this tab, where a later same-tab SSO completion with no `returnUrl`
+     * param would pick up the stale path and redirect somewhere the user
+     * never asked to go.
+     */
+    persistSessionHints?: boolean;
+}
 export declare class SSOManager {
     private authClient;
     constructor(apiUrl: string);
@@ -13,7 +26,7 @@ export declare class SSOManager {
     /**
      * Get SSO redirect URL using secure POST-based flow
      */
-    getSSORedirectUrl(targetApp: string, returnUrl?: string): Promise<string>;
+    getSSORedirectUrl(targetApp: string, returnUrl?: string, options?: SSORedirectUrlOptions): Promise<string>;
     /**
      * Handle SSO login using secure POST-based flow
      */
@@ -37,6 +50,7 @@ export declare class SSOManager {
 export declare function useSSO(apiUrl: string): {
     checkSSOAuthentication: () => Promise<AuthUser>;
     handleSSOLogin: () => Promise<AuthUser>;
+    getSSORedirectUrl: (targetApp: string, returnUrl?: string, options?: SSORedirectUrlOptions) => Promise<string>;
     navigateToApp: (targetApp: string, returnUrl?: string) => Promise<void>;
     getAvailableApps: () => AppConfig[];
 };

package/auth-core/sso.js

@@ -33,7 +33,8 @@ export class SSOManager {
     /**
      * Get SSO redirect URL using secure POST-based flow
      */
-    async getSSORedirectUrl(targetApp, returnUrl) {
+    async getSSORedirectUrl(targetApp, returnUrl, options = {}) {
+        const { persistSessionHints = true } = options;
         const ssoData = await this.generateSSOToken();
         const appConfig = APP_CONFIGS[targetApp];
         if (!appConfig) {
@@ -50,15 +51,17 @@ export class SSOManager {
         }
         // Store only non-sensitive metadata in sessionStorage as backup for same-domain cases
         // Note: We avoid storing the session_id in sessionStorage for security
-        try {
-            sessionStorage.setItem('sso_target_app', targetApp);
-            if (returnUrl) {
-                sessionStorage.setItem('sso_return_url', returnUrl);
+        if (persistSessionHints) {
+            try {
+                sessionStorage.setItem('sso_target_app', targetApp);
+                if (returnUrl) {
+                    sessionStorage.setItem('sso_return_url', returnUrl);
+                }
+            }
+            catch (error) {
+                // Storage error - continue without backup storage
+                debugLog('sessionStorage write failed during SSO URL generation', error);
             }
-        }
-        catch (error) {
-            // Storage error - continue without backup storage
-            debugLog('sessionStorage write failed during SSO URL generation', error);
         }
         return url.toString();
     }
@@ -273,6 +276,7 @@ export function useSSO(apiUrl) {
     return useMemo(() => ({
         checkSSOAuthentication: () => ssoManager.checkSSOAuthentication(),
         handleSSOLogin: () => ssoManager.handleSSOLogin(),
+        getSSORedirectUrl: (targetApp, returnUrl, options) => ssoManager.getSSORedirectUrl(targetApp, returnUrl, options),
         navigateToApp: (targetApp, returnUrl) => ssoManager.navigateToApp(targetApp, returnUrl),
         getAvailableApps: () => ssoManager.getAvailableApps(),
     }), [ssoManager]);

package/components/console/ConsoleContent.js

@@ -90,7 +90,8 @@ export function ConsoleContent({ config }) {
             (config.enableRecall
                 ? `  /recall     - Recall semantic memories\n`
                 : '') +
-            `  /mcp        - Show MCP connection setup\n` +
+            `  /mcp        - Connect an MCP client (sign in — no key)\n` +
+            `  /mcp key    - Mint a graph-scoped API key for header-only clients\n` +
             `  /help       - Show this help message\n` +
             `  /clear      - Clear console history\n` +
             `  /examples   - Show example queries`;
@@ -405,32 +406,54 @@ export function ConsoleContent({ config }) {
             }
         }
     };
-    const showMcpSetup = async () => {
-        addSystemMessage('Creating graph-scoped connector key...', true);
+    const showMcpSetup = async (mode) => {
         const apiUrl = process.env.NEXT_PUBLIC_ROBOSYSTEMS_API_URL ||
             'https://api.robosystems.ai';
         const { mcp } = config;
         const contextId = graphId || mcp.contextIdFallback;
+        const endpoint = `${apiUrl}/v1/graphs/${contextId}/mcp`;
+        const connectorName = `${mcp.serverName}-${contextId}`;
+        const exampleLines = mcp.exampleQuestions
+            .map((q) => `  • "${q}"`)
+            .join('\n');
+        // The graph id lives in the URL path and never becomes a tool argument,
+        // so one connection is anchored to exactly one graph. OAuth on the
+        // per-graph URL shows this graph preselected on the consent screen; no
+        // key is minted unless asked for, so a sign-in user never leaves an
+        // unused credential behind in Settings → API Keys.
+        if (mode !== 'key') {
+            addSystemMessage(`MCP — connect ${contextId}\n` +
+                `═══════════════════════════════════════════════════════════════\n\n` +
+                `Sign in to connect (recommended). Paste the URL; the client sends\n` +
+                `you to sign in, and this graph is already selected on the consent\n` +
+                `screen. Nothing to copy, store, or rotate.\n\n` +
+                `Claude (claude.ai / Desktop)\n` +
+                `  Settings → Connectors → Add custom connector\n` +
+                `  ${endpoint}\n\n` +
+                `Claude Code (then /mcp to sign in)\n` +
+                `  claude mcp add --transport http ${connectorName} ${endpoint}\n\n` +
+                `Cursor / VS Code (mcp.json)\n` +
+                `  "${connectorName}": { "url": "${endpoint}" }\n\n` +
+                `Any graph from one address: ${apiUrl}/v1/mcp — pick the graph at\n` +
+                `sign-in.\n\n` +
+                `Scripts, CI, or a client that can't sign in? Type /mcp key to mint\n` +
+                `an API key scoped to this graph, with the header snippets filled in.\n\n` +
+                `Once connected, ask questions like:\n` +
+                `${exampleLines}\n\n` +
+                `Clients without HTTP transport support can use the stdio bridge\n` +
+                `in proxy mode: https://github.com/RoboFinSystems/robosystems-mcp-client`, true);
+            return;
+        }
+        addSystemMessage('Creating graph-scoped API key...', true);
         try {
             const { createMcpConnectorUrl } = await import('../../lib/mcp-connector');
-            // The graph id lives in the URL path and never becomes a tool argument,
-            // so one connector is anchored to exactly one graph. Multi-graph users
-            // add one connector per graph, which is why the name carries the id.
-            // The key is graph-scoped: valid only for this graph, revocable in
-            // Settings → API Keys, and rejected on every account-level surface.
+            // Graph-scoped: valid only for this graph and its subgraphs, rejected on
+            // every account-level surface, revocable in Settings → API Keys.
             const connector = await createMcpConnectorUrl(contextId, { apiUrl });
-            const connectorName = `${mcp.serverName}-${contextId}`;
-            const exampleLines = mcp.exampleQuestions
-                .map((q) => `  • "${q}"`)
-                .join('\n');
-            addSystemMessage(`MCP Setup Instructions:\n` +
+            addSystemMessage(`API key for ${contextId}\n` +
                 `═══════════════════════════════════════════════════════════════\n\n` +
-                `Graph-scoped API key created — it works only for ${contextId}\n` +
-                `and can be revoked anytime in Settings → API Keys.\n\n` +
-                `Claude (claude.ai / Desktop)\n` +
-                `  Settings → Connectors → Add custom connector, then paste this\n` +
-                `  URL (the key rides inside it — no header field needed):\n` +
-                `  ${connector.url}\n\n` +
+                `Scoped to this graph only; revoke it anytime in Settings → API Keys.\n` +
+                `It goes in the X-API-Key header — never in the URL.\n\n` +
                 `Claude Code\n` +
                 `  claude mcp add --transport http ${connectorName} \\\n` +
                 `    ${connector.endpoint} \\\n` +
@@ -440,16 +463,12 @@ export function ConsoleContent({ config }) {
                 `    "url": "${connector.endpoint}",\n` +
                 `    "headers": { "X-API-Key": "${connector.apiKey}" }\n` +
                 `  }\n\n` +
-                `Once connected, ask Claude questions like:\n` +
-                `${exampleLines}\n\n` +
-                `Clients without HTTP transport support can use the stdio bridge\n` +
-                `in proxy mode: https://github.com/RoboFinSystems/robosystems-mcp-client\n\n` +
-                `The connector URL contains the key — treat it like a password.`, true);
+                `Treat the key like a password. Shown once.`, true);
         }
         catch (error) {
-            addErrorMessage(`Failed to create connector key: ${error.message || 'Unknown error'}\n\n` +
-                `You can create an API key in Settings and connect with:\n` +
-                `  URL:    ${apiUrl}/v1/graphs/${contextId}/mcp\n` +
+            addErrorMessage(`Failed to create API key: ${error.message || 'Unknown error'}\n\n` +
+                `You can create a key in Settings and connect with:\n` +
+                `  URL:    ${endpoint}\n` +
                 `  Header: X-API-Key: <your key>`);
         }
     };
@@ -602,7 +621,7 @@ export function ConsoleContent({ config }) {
                     return;
                 }
                 case '/mcp':
-                    await showMcpSetup();
+                    await showMcpSetup(command.slice(cmd.length).trim().toLowerCase());
                     return;
                 default:
                     addErrorMessage(`Unknown command: ${cmd}\n\nType /help for available commands.`);

package/hooks/index.d.ts

@@ -1,4 +1,5 @@
 export { useApiError } from './use-api-error';
+export { useCrossAppLink, type CrossAppTarget, type OpenCrossAppOptions, type UseCrossAppLinkResult, } from './use-cross-app-link';
 export { useMediaQuery } from './use-media-query';
 export { useStreamingQuery } from './use-streaming-query';
 export { useToast, type ToastMessage } from './use-toast';

package/hooks/index.js

@@ -1,4 +1,5 @@
 export { useApiError } from './use-api-error';
+export { useCrossAppLink, } from './use-cross-app-link';
 export { useMediaQuery } from './use-media-query';
 export { useStreamingQuery } from './use-streaming-query';
 export { useToast } from './use-toast';

package/hooks/use-cross-app-link.d.ts

@@ -0,0 +1,38 @@
+export type CrossAppTarget = '_blank' | '_self';
+export interface OpenCrossAppOptions {
+    /** Relative path on the target app, e.g. `/settings`. */
+    path?: string;
+    /**
+     * `_blank` (default) hands the destination to a new tab, leaving the
+     * current app exactly where it was — right for a *detour* (account
+     * settings, graph creation), where the user is coming back.
+     *
+     * `_self` navigates in place — right when leaving *is* the intent, as in
+     * the app switcher.
+     */
+    target?: CrossAppTarget;
+}
+export interface UseCrossAppLinkResult {
+    /** Resolves true once the destination has been handed off. */
+    openApp: (targetApp: string, options?: OpenCrossAppOptions) => Promise<boolean>;
+    /** Convenience wrapper targeting the configured login home. */
+    openLoginHome: (options?: OpenCrossAppOptions) => Promise<boolean>;
+    /** True while the SSO handoff is in flight. */
+    isOpening: boolean;
+}
+/**
+ * Open another RoboSystems app at a specific path, in one click.
+ *
+ * Cross-app navigation can't be a plain `<a href>`: the destination doesn't
+ * exist until an SSO token is minted and exchanged for a session ID, two
+ * round-trips deep. The apps sit on separate registrable domains, so a naked
+ * link to the target would drop the user on a login screen instead.
+ *
+ * That async gap is also why the new tab is claimed *synchronously*, before
+ * the first await. A `window.open()` issued after an await is outside the
+ * user-gesture stack and popup blockers swallow it; opening `about:blank`
+ * inside the gesture and pointing it at the URL afterwards is the standard
+ * way around that. If the open is refused anyway (popups hard-blocked), we
+ * degrade to a same-tab navigation rather than dead-ending the click.
+ */
+export declare function useCrossAppLink(apiUrl?: string): UseCrossAppLinkResult;

package/hooks/use-cross-app-link.js

@@ -0,0 +1,56 @@
+'use client';
+import { useCallback, useMemo, useState } from 'react';
+import { LOGIN_HOME_APP } from '../auth-core/config';
+import { SSOManager } from '../auth-core/sso';
+const DEFAULT_API_URL = process.env.NEXT_PUBLIC_ROBOSYSTEMS_API_URL || 'http://localhost:8000';
+/**
+ * Open another RoboSystems app at a specific path, in one click.
+ *
+ * Cross-app navigation can't be a plain `<a href>`: the destination doesn't
+ * exist until an SSO token is minted and exchanged for a session ID, two
+ * round-trips deep. The apps sit on separate registrable domains, so a naked
+ * link to the target would drop the user on a login screen instead.
+ *
+ * That async gap is also why the new tab is claimed *synchronously*, before
+ * the first await. A `window.open()` issued after an await is outside the
+ * user-gesture stack and popup blockers swallow it; opening `about:blank`
+ * inside the gesture and pointing it at the URL afterwards is the standard
+ * way around that. If the open is refused anyway (popups hard-blocked), we
+ * degrade to a same-tab navigation rather than dead-ending the click.
+ */
+export function useCrossAppLink(apiUrl = DEFAULT_API_URL) {
+    const ssoManager = useMemo(() => new SSOManager(apiUrl), [apiUrl]);
+    const [isOpening, setIsOpening] = useState(false);
+    const openApp = useCallback(async (targetApp, options = {}) => {
+        const { path, target = '_blank' } = options;
+        // Claim the tab inside the gesture — see the note above.
+        const childWindow = target === '_blank' ? window.open('', '_blank') : null;
+        const openedNewTab = childWindow !== null;
+        setIsOpening(true);
+        try {
+            const url = await ssoManager.getSSORedirectUrl(targetApp, path, {
+                persistSessionHints: !openedNewTab,
+            });
+            if (childWindow) {
+                childWindow.location.href = url;
+            }
+            else {
+                window.location.href = url;
+            }
+            return true;
+        }
+        catch (error) {
+            // Leaving a blank tab behind is worse than no tab at all.
+            childWindow === null || childWindow === void 0 ? void 0 : childWindow.close();
+            if (process.env.NODE_ENV === 'development') {
+                console.error(`[SSO] Failed to open ${targetApp}${path ? path : ''}:`, error);
+            }
+            return false;
+        }
+        finally {
+            setIsOpening(false);
+        }
+    }, [ssoManager]);
+    const openLoginHome = useCallback((options) => openApp(LOGIN_HOME_APP, options), [openApp]);
+    return { openApp, openLoginHome, isOpening };
+}

package/lib/mcp-connector.d.ts

@@ -1,7 +1,5 @@
 export interface McpConnectorUrl {
-    /** Pasteable connector URL with the graph-scoped key embedded as `?token=` */
-    url: string;
-    /** Bare MCP endpoint URL (no credential) — for header-capable clients */
+    /** Bare per-graph MCP endpoint URL (no credential) */
     endpoint: string;
     /** The plaintext graph-scoped API key (returned once at mint) */
     apiKey: string;
@@ -10,18 +8,16 @@ export interface McpConnectorUrl {
     graphId: string;
 }
 /**
- * Mint a graph-scoped API key and assemble the MCP connector URL for it.
+ * Mint a graph-scoped API key for the per-graph MCP endpoint.
  *
- * The URL is for clients that cannot send custom headers (claude.ai /
- * Claude Desktop custom connectors): the scoped key travels as a `token`
- * query parameter, which the server honors only on the MCP endpoint and
- * only for keys scoped to that URL's graph — account-wide keys are
- * rejected there. The key works for exactly this graph (and its
- * subgraphs), is rejected on every account-level surface, and can be
- * revoked from Settings → API Keys like any other key.
- *
- * Header-capable clients (Claude Code, Cursor, VS Code) should use the
- * bare `endpoint` with the key in an `X-API-Key` header instead.
+ * For clients that cannot sign in (scripts, CI, editors without OAuth):
+ * the key goes in an `X-API-Key` header on `endpoint`. It works for
+ * exactly this graph (and its subgraphs), is rejected on every
+ * account-level surface, and can be revoked from Settings → API Keys like
+ * any other key. Credentials never travel in the URL — the `?token=`
+ * connector URL was the bridge to OAuth and the server no longer honors
+ * it. OAuth-capable clients need no key at all: they add `endpoint` (or
+ * the graph-agnostic `/v1/mcp`) and sign in.
  */
 export declare function createMcpConnectorUrl(graphId: string, options?: {
     apiUrl?: string;

package/lib/mcp-connector.js

@@ -1,17 +1,15 @@
 const DEFAULT_API_URL = 'https://api.robosystems.ai';
 /**
- * Mint a graph-scoped API key and assemble the MCP connector URL for it.
+ * Mint a graph-scoped API key for the per-graph MCP endpoint.
  *
- * The URL is for clients that cannot send custom headers (claude.ai /
- * Claude Desktop custom connectors): the scoped key travels as a `token`
- * query parameter, which the server honors only on the MCP endpoint and
- * only for keys scoped to that URL's graph — account-wide keys are
- * rejected there. The key works for exactly this graph (and its
- * subgraphs), is rejected on every account-level surface, and can be
- * revoked from Settings → API Keys like any other key.
- *
- * Header-capable clients (Claude Code, Cursor, VS Code) should use the
- * bare `endpoint` with the key in an `X-API-Key` header instead.
+ * For clients that cannot sign in (scripts, CI, editors without OAuth):
+ * the key goes in an `X-API-Key` header on `endpoint`. It works for
+ * exactly this graph (and its subgraphs), is rejected on every
+ * account-level surface, and can be revoked from Settings → API Keys like
+ * any other key. Credentials never travel in the URL — the `?token=`
+ * connector URL was the bridge to OAuth and the server no longer honors
+ * it. OAuth-capable clients need no key at all: they add `endpoint` (or
+ * the graph-agnostic `/v1/mcp`) and sign in.
  */
 export async function createMcpConnectorUrl(graphId, options = {}) {
     var _a, _b;
@@ -26,7 +24,6 @@ export async function createMcpConnectorUrl(graphId, options = {}) {
     }
     const endpoint = `${apiUrl}/v1/graphs/${graphId}/mcp`;
     return {
-        url: `${endpoint}?token=${response.data.key}`,
         endpoint,
         apiKey: response.data.key,
         keyName,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@robosystems/core",
-  "version": "0.8.2",
+  "version": "0.8.4",
   "description": "Shared RoboSystems frontend core library (auth, contexts, task monitoring, UI components) for the RoboSystems Next.js apps",
   "license": "MIT",
   "private": false,

package/ui-components/layout/CoreNavbar.js

@@ -2,13 +2,14 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { DarkThemeToggle, Dropdown, DropdownDivider, DropdownHeader, DropdownItem, Navbar as FlowbiteNavbar, NavbarBrand, Tooltip, } from 'flowbite-react';
 import Link from 'next/link';
-import { HiMenuAlt1, HiUserCircle, HiX } from 'react-icons/hi';
+import { HiExternalLink, HiMenuAlt1, HiUserCircle, HiX } from 'react-icons/hi';
 import { AppSwitcher } from '../../auth-components';
 import { useAuth } from '../../auth-components/AuthProvider';
 import { useSidebarContext } from '../../contexts';
 import { useMediaQuery, useUser } from '../../hooks';
 import { customTheme } from '../../theme';
 import { LogoBadge } from '../Logo';
+import { useAccountSettingsLink } from './account-settings';
 import { ThemeToggle } from './ThemeToggle';
 export function CoreNavbar({ appName, currentApp, apiUrl = process.env.NEXT_PUBLIC_ROBOSYSTEMS_API_URL ||
     'http://localhost:8000', homeHref = '/home', logoAltText, additionalComponents, className = '', borderColorClass = 'dark:border-gray-700', useCustomThemeToggle = true, showAppSwitcherFirst = false, }) {
@@ -43,10 +44,13 @@ export function CoreNavbar({ appName, currentApp, apiUrl = process.env.NEXT_PUBL
         return (_jsxs(_Fragment, { children: [_jsx("div", { className: "hidden dark:block", children: _jsx(Tooltip, { content: "Toggle light mode", theme: customTheme.tooltip, children: _jsx(DarkThemeToggle, {}) }) }), _jsx("div", { className: "dark:hidden", children: _jsx(Tooltip, { content: "Toggle dark mode", theme: customTheme.tooltip, children: _jsx(DarkThemeToggle, {}) }) })] }));
     };
     const renderAppSwitcher = () => (_jsx(Tooltip, { content: "Switch apps", theme: customTheme.tooltip, children: _jsx(AppSwitcher, { apiUrl: apiUrl, currentApp: currentApp }) }));
-    return (_jsx(FlowbiteNavbar, { fluid: true, theme: customTheme.navbar, className: `fixed top-0 z-30 w-full border-b border-gray-200 p-0 ${borderColorClass} bg-white sm:p-0 dark:bg-black ${className}`, children: _jsx("div", { className: "w-full p-3 pr-4", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center", children: [_jsxs("button", { onClick: handleToggleSidebar, className: "mr-3 cursor-pointer rounded-sm p-2 text-gray-600 hover:bg-zinc-100 hover:text-gray-900 dark:text-gray-400 dark:hover:bg-zinc-700 dark:hover:text-white", children: [_jsx("span", { className: "sr-only", children: "Toggle sidebar" }), _jsx("div", { className: "lg:hidden", children: sidebar.mobile.isOpen ? (_jsx(HiX, { className: "h-6 w-6" })) : (_jsx(HiMenuAlt1, { className: "h-6 w-6" })) }), _jsx("div", { className: "hidden lg:block", children: _jsx(HiMenuAlt1, { className: "h-6 w-6" }) })] }), _jsxs(NavbarBrand, { as: Link, href: homeHref, className: "mr-14", children: [_jsx(LogoBadge, { app: currentApp, animate: "once", className: "mr-2 h-10 w-10" }), _jsx("span", { className: "font-heading mt-2 ml-1 self-center text-2xl font-semibold whitespace-nowrap text-gray-900 dark:text-white", children: appName })] })] }), _jsx("div", { className: "flex items-center lg:gap-3", children: _jsxs("div", { className: "flex items-center", children: [additionalComponents && (_jsx("div", { className: "mr-2 hidden md:block", children: additionalComponents })), _jsxs("div", { className: "flex items-center space-x-2", children: [showAppSwitcherFirst && renderAppSwitcher(), renderThemeToggle(), !showAppSwitcherFirst && renderAppSwitcher(), _jsx(UserDropdown, { user: user, onLogout: handleLogout })] })] }) })] }) }) }));
+    return (_jsx(FlowbiteNavbar, { fluid: true, theme: customTheme.navbar, className: `fixed top-0 z-30 w-full border-b border-gray-200 p-0 ${borderColorClass} bg-white sm:p-0 dark:bg-black ${className}`, children: _jsx("div", { className: "w-full p-3 pr-4", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center", children: [_jsxs("button", { onClick: handleToggleSidebar, className: "mr-3 cursor-pointer rounded-sm p-2 text-gray-600 hover:bg-zinc-100 hover:text-gray-900 dark:text-gray-400 dark:hover:bg-zinc-700 dark:hover:text-white", children: [_jsx("span", { className: "sr-only", children: "Toggle sidebar" }), _jsx("div", { className: "lg:hidden", children: sidebar.mobile.isOpen ? (_jsx(HiX, { className: "h-6 w-6" })) : (_jsx(HiMenuAlt1, { className: "h-6 w-6" })) }), _jsx("div", { className: "hidden lg:block", children: _jsx(HiMenuAlt1, { className: "h-6 w-6" }) })] }), _jsxs(NavbarBrand, { as: Link, href: homeHref, className: "mr-14", children: [_jsx(LogoBadge, { app: currentApp, animate: "once", className: "mr-2 h-10 w-10" }), _jsx("span", { className: "font-heading mt-2 ml-1 self-center text-2xl font-semibold whitespace-nowrap text-gray-900 dark:text-white", children: appName })] })] }), _jsx("div", { className: "flex items-center lg:gap-3", children: _jsxs("div", { className: "flex items-center", children: [additionalComponents && (_jsx("div", { className: "mr-2 hidden md:block", children: additionalComponents })), _jsxs("div", { className: "flex items-center space-x-2", children: [showAppSwitcherFirst && renderAppSwitcher(), renderThemeToggle(), !showAppSwitcherFirst && renderAppSwitcher(), _jsx(UserDropdown, { user: user, apiUrl: apiUrl, onLogout: handleLogout })] })] }) })] }) }) }));
 }
-function UserDropdown({ user, onLogout }) {
-    return (_jsx("div", { className: "relative", children: _jsxs(Dropdown, { theme: Object.assign(Object.assign({}, customTheme.dropdown), { floating: Object.assign(Object.assign({}, customTheme.dropdown.floating), { base: `${customTheme.dropdown.floating.base} z-50! w-64` }) }), arrowIcon: false, inline: true, label: _jsxs("span", { className: "inline-flex h-10 w-10 items-center justify-center rounded-lg text-sm text-gray-500 hover:bg-zinc-100 focus:ring-2 focus:ring-gray-200 focus:outline-hidden dark:text-gray-400 dark:hover:bg-zinc-700 dark:focus:ring-gray-600", children: [_jsx("span", { className: "sr-only", children: "User menu" }), _jsx(HiUserCircle, { className: "h-6 w-6" })] }), children: [_jsxs(DropdownHeader, { theme: { header: customTheme.dropdown.floating.header }, className: "px-4 py-3", children: [_jsx("div", { className: "block text-sm font-medium text-gray-900 dark:text-white", children: (user === null || user === void 0 ? void 0 : user.name) || 'User' }), (user === null || user === void 0 ? void 0 : user.email) && (_jsx("div", { className: "block truncate text-sm text-gray-500 dark:text-gray-400", children: user.email }))] }), _jsx(DropdownItem, { theme: customTheme.dropdown.floating.item, as: Link, href: "/settings", className: "flex w-full items-center space-x-3 p-3", children: "User Settings" }), _jsx(DropdownDivider, { theme: { divider: customTheme.dropdown.floating.divider } }), _jsx(DropdownItem, { theme: customTheme.dropdown.floating.item, onClick: () => {
+function UserDropdown({ user, apiUrl, onLogout }) {
+    const settings = useAccountSettingsLink(apiUrl);
+    return (_jsx("div", { className: "relative", children: _jsxs(Dropdown, { theme: Object.assign(Object.assign({}, customTheme.dropdown), { floating: Object.assign(Object.assign({}, customTheme.dropdown.floating), { base: `${customTheme.dropdown.floating.base} z-50! w-64` }) }), arrowIcon: false, inline: true, label: _jsxs("span", { className: "inline-flex h-10 w-10 items-center justify-center rounded-lg text-sm text-gray-500 hover:bg-zinc-100 focus:ring-2 focus:ring-gray-200 focus:outline-hidden dark:text-gray-400 dark:hover:bg-zinc-700 dark:focus:ring-gray-600", children: [_jsx("span", { className: "sr-only", children: "User menu" }), _jsx(HiUserCircle, { className: "h-6 w-6" })] }), children: [_jsxs(DropdownHeader, { theme: { header: customTheme.dropdown.floating.header }, className: "px-4 py-3", children: [_jsx("div", { className: "block text-sm font-medium text-gray-900 dark:text-white", children: (user === null || user === void 0 ? void 0 : user.name) || 'User' }), (user === null || user === void 0 ? void 0 : user.email) && (_jsx("div", { className: "block truncate text-sm text-gray-500 dark:text-gray-400", children: user.email }))] }), settings.isCrossApp ? (_jsxs(DropdownItem, { theme: customTheme.dropdown.floating.item, onClick: () => {
+                        void settings.open();
+                    }, title: settings.description, className: "flex w-full items-center justify-between p-3", children: [_jsx("span", { children: "User Settings" }), _jsx(HiExternalLink, { "aria-hidden": "true", className: "ml-3 h-4 w-4 shrink-0 text-gray-400 dark:text-gray-500" }), _jsx("span", { className: "sr-only", children: ` (opens ${settings.hostAppName} in a new tab)` })] })) : (_jsx(DropdownItem, { theme: customTheme.dropdown.floating.item, as: Link, href: settings.href, className: "flex w-full items-center space-x-3 p-3", children: "User Settings" })), _jsx(DropdownDivider, { theme: { divider: customTheme.dropdown.floating.divider } }), _jsx(DropdownItem, { theme: customTheme.dropdown.floating.item, onClick: () => {
                         onLogout();
                     }, className: "flex w-full items-center space-x-3 p-3", children: "Sign out" })] }) }));
 }

package/ui-components/layout/CoreSidebar.js

@@ -7,6 +7,7 @@ import { HiCog, HiOfficeBuilding } from 'react-icons/hi';
 import { twMerge } from 'tailwind-merge';
 import { useOrg, useSidebarContext } from '../../contexts';
 import { customTheme } from '../../theme';
+import { useAccountSettingsLink } from './account-settings';
 export function CoreSidebar({ navigationItems, features = {}, bottomMenuActions = [], additionalMobileComponents, className = '', borderColorClass = 'dark:border-gray-700', }) {
     return (_jsxs(_Fragment, { children: [_jsx("div", { className: "lg:hidden", children: _jsx(MobileSidebar, { navigationItems: navigationItems, features: features, bottomMenuActions: bottomMenuActions, additionalMobileComponents: additionalMobileComponents, borderColorClass: borderColorClass }) }), _jsx("div", { className: `hidden lg:block ${className}`, children: _jsx(DesktopSidebar, { navigationItems: navigationItems, features: features, bottomMenuActions: bottomMenuActions, borderColorClass: borderColorClass }) })] }));
 }
@@ -57,6 +58,19 @@ function OrgSection({ isCollapsed, showOrgSection = true, }) {
                 ? 'bg-zinc-100 text-gray-900 dark:bg-zinc-800 dark:text-gray-200'
                 : '', children: _jsx("span", { className: "truncate text-sm", children: currentOrg.name }) }) }));
 }
+/**
+ * The account-settings cog. A plain link on the login home; on the product
+ * apps an SSO handoff into a new tab, so this app keeps its place.
+ */
+function SettingsButton() {
+    const settings = useAccountSettingsLink();
+    if (!settings.isCrossApp) {
+        return (_jsx(Tooltip, { content: settings.description, theme: customTheme.tooltip, children: _jsx(Button, { as: Link, href: settings.href, color: "ghost", className: "rounded-lg p-2 hover:bg-gray-100 dark:hover:bg-gray-700", children: _jsx(HiCog, { className: "text-lg text-gray-500 dark:text-gray-400" }) }) }));
+    }
+    return (_jsx(Tooltip, { content: settings.description, theme: customTheme.tooltip, children: _jsx(Button, { onClick: () => {
+                void settings.open();
+            }, disabled: settings.isOpening, color: "ghost", "aria-label": settings.description, className: "rounded-lg p-2 hover:bg-gray-100 disabled:opacity-50 dark:hover:bg-gray-700", children: _jsx(HiCog, { className: "text-lg text-gray-500 dark:text-gray-400" }) }) }));
+}
 function BottomMenu({ isCollapsed, features, bottomMenuActions, }) {
-    return (_jsxs("div", { className: `flex items-center justify-center border-t border-gray-200 px-4 py-4 dark:border-gray-700 ${isCollapsed ? 'flex-col gap-y-2' : 'gap-x-5'}`, children: [_jsx(Tooltip, { content: "Settings", theme: customTheme.tooltip, children: _jsx(Button, { as: Link, href: "/settings", color: "ghost", className: "rounded-lg p-2 hover:bg-gray-100 dark:hover:bg-gray-700", children: _jsx(HiCog, { className: "text-lg text-gray-500 dark:text-gray-400" }) }) }), bottomMenuActions.map((action, index) => (_jsx(Tooltip, { content: action.tooltip, theme: customTheme.tooltip, children: _jsx(Button, { onClick: action.onClick, color: "ghost", className: "rounded-lg p-2 hover:bg-gray-100 dark:hover:bg-gray-700", children: _jsx(action.icon, { className: "text-lg text-gray-500 dark:text-gray-400" }) }) }, index)))] }));
+    return (_jsxs("div", { className: `flex items-center justify-center border-t border-gray-200 px-4 py-4 dark:border-gray-700 ${isCollapsed ? 'flex-col gap-y-2' : 'gap-x-5'}`, children: [_jsx(SettingsButton, {}), bottomMenuActions.map((action, index) => (_jsx(Tooltip, { content: action.tooltip, theme: customTheme.tooltip, children: _jsx(Button, { onClick: action.onClick, color: "ghost", className: "rounded-lg p-2 hover:bg-gray-100 dark:hover:bg-gray-700", children: _jsx(action.icon, { className: "text-lg text-gray-500 dark:text-gray-400" }) }) }, index)))] }));
 }

package/ui-components/layout/account-settings.d.ts

@@ -0,0 +1,33 @@
+/** Where the account surface lives, on whichever app hosts it. */
+export declare const ACCOUNT_SETTINGS_PATH = "/settings";
+interface AccountSettingsLinkBase {
+    isOpening: boolean;
+    /** Name of the app hosting the account surface, e.g. "RoboSystems". */
+    hostAppName: string;
+    /** Tooltip / accessible description, honest about leaving the app. */
+    description: string;
+}
+/**
+ * Exactly one of `href` / `open` is meaningful, and the discriminant says
+ * which — so a caller can't render a link to a destination that needs an
+ * SSO handoff, or a button where a plain anchor belongs.
+ */
+export type AccountSettingsLink = AccountSettingsLinkBase & ({
+    isCrossApp: false;
+    href: string;
+    open?: never;
+} | {
+    isCrossApp: true;
+    href?: never;
+    open: () => Promise<boolean>;
+});
+/**
+ * Resolve how this app should reach account settings.
+ *
+ * Identity, password, passkeys and API keys are account-global and live on
+ * one app — the login home. On that app the cog is an ordinary link; on the
+ * product apps it's an SSO handoff into a new tab, so the user's place here
+ * (a half-written journal entry, a loaded report) survives the detour.
+ */
+export declare function useAccountSettingsLink(apiUrl?: string): AccountSettingsLink;
+export {};

package/ui-components/layout/account-settings.js

@@ -0,0 +1,33 @@
+'use client';
+import { getLoginHomeName, isLoginHome } from '../../auth-core/config';
+import { useCrossAppLink } from '../../hooks/use-cross-app-link';
+/** Where the account surface lives, on whichever app hosts it. */
+export const ACCOUNT_SETTINGS_PATH = '/settings';
+/**
+ * Resolve how this app should reach account settings.
+ *
+ * Identity, password, passkeys and API keys are account-global and live on
+ * one app — the login home. On that app the cog is an ordinary link; on the
+ * product apps it's an SSO handoff into a new tab, so the user's place here
+ * (a half-written journal entry, a loaded report) survives the detour.
+ */
+export function useAccountSettingsLink(apiUrl) {
+    const { openLoginHome, isOpening } = useCrossAppLink(apiUrl);
+    const hostAppName = getLoginHomeName();
+    if (isLoginHome()) {
+        return {
+            isCrossApp: false,
+            href: ACCOUNT_SETTINGS_PATH,
+            isOpening,
+            hostAppName,
+            description: 'Settings',
+        };
+    }
+    return {
+        isCrossApp: true,
+        open: () => openLoginHome({ path: ACCOUNT_SETTINGS_PATH, target: '_blank' }),
+        isOpening,
+        hostAppName,
+        description: `Settings (opens ${hostAppName} in a new tab)`,
+    };
+}

package/ui-components/layout/index.d.ts

@@ -1,3 +1,4 @@
+export { ACCOUNT_SETTINGS_PATH, useAccountSettingsLink, type AccountSettingsLink, } from './account-settings';
 export { CoreNavbar } from './CoreNavbar';
 export { CoreSidebar, type SidebarItemData } from './CoreSidebar';
 export { LandingFooter, type FooterLink, type LandingFooterProps, } from './LandingFooter';

package/ui-components/layout/index.js

@@ -1,3 +1,4 @@
+export { ACCOUNT_SETTINGS_PATH, useAccountSettingsLink, } from './account-settings';
 export { CoreNavbar } from './CoreNavbar';
 export { CoreSidebar } from './CoreSidebar';
 export { LandingFooter, } from './LandingFooter';