@promptbook/cli 0.112.0-99 → 0.112.0

package/apps/agents-server/src/components/FileUploadAvailability/FileUploadUnavailableNotice.tsx

@@ -0,0 +1,45 @@
+'use client';
+
+import { AlertTriangle } from 'lucide-react';
+import Link from 'next/link';
+import { useFileUploadAvailability } from './FileUploadAvailabilityContext';
+
+/**
+ * Props consumed by `FileUploadUnavailableNotice`.
+ */
+type FileUploadUnavailableNoticeProps = {
+    /**
+     * Optional classes appended to the notice root.
+     */
+    readonly className?: string;
+};
+
+/**
+ * Shows a shared notice when file uploads are disabled for the current server.
+ *
+ * @param props - Notice props.
+ * @returns Upload notice or `null` when uploads are available.
+ */
+export function FileUploadUnavailableNotice({ className }: FileUploadUnavailableNoticeProps) {
+    const fileUploadAvailability = useFileUploadAvailability();
+
+    if (fileUploadAvailability.isUploadAvailable || !fileUploadAvailability.message) {
+        return null;
+    }
+
+    return (
+        <div
+            className={`flex items-start gap-3 rounded-lg border border-amber-200 bg-amber-50 px-4 py-3 text-sm text-amber-900 ${
+                className || ''
+            }`}
+        >
+            <AlertTriangle className="mt-0.5 h-4 w-4 flex-shrink-0" aria-hidden="true" />
+            <div className="space-y-1">
+                <p className="font-medium">{fileUploadAvailability.message}</p>
+                <Link href="/admin/servers" className="inline-flex font-semibold underline underline-offset-2">
+                    Open server/domain settings
+                </Link>
+            </div>
+        </div>
+    );
+}

package/apps/agents-server/src/components/Footer/Footer.tsx

@@ -1,9 +1,10 @@
 'use client';
 
-import { NEXT_PUBLIC_VERCEL_GIT_COMMIT_REF } from '@/config';
+import { NEXT_PUBLIC_VERCEL_GIT_COMMIT_REF, NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA } from '@/config';
 import { CLAIM, NAME, PROMPTBOOK_ENGINE_VERSION } from '@promptbook-local/core';
 import { useServerLanguage } from '../ServerLanguage/ServerLanguageProvider';
 import { HeadlessLink } from '../_utils/headlessParam';
+import { getCommitFooterEmoji } from './getCommitFooterEmoji';
 
 /**
  * Title/url pair used to extend the footer via metadata.
@@ -34,18 +35,18 @@ export function Footer(props: FooterProps) {
     const { t } = useServerLanguage();
 
     return (
-        <footer className="border-t bg-white">
+        <footer className="border-t border-gray-200 bg-white dark:border-slate-700 dark:bg-slate-950">
             <div className="container mx-auto px-6 py-12">
                 <div className="grid grid-cols-1 md:grid-cols-5 gap-8">
                     {/* Company Info */}
                     <div className="space-y-4">
-                        <h3 className="font-bold">{NAME}</h3>
+                        <h3 className="font-bold text-gray-900 dark:text-slate-100">{NAME}</h3>
                         <p className="text-sm text-muted-foreground text-gray-500">{CLAIM}</p>
                     </div>
 
                     {/* Products */}
                     <div className="space-y-4">
-                        <h3 className="font-bold">{t('footer.productSectionTitle')}</h3>
+                        <h3 className="font-bold text-gray-900 dark:text-slate-100">{t('footer.productSectionTitle')}</h3>
                         <ul className="space-y-2 text-sm">
                             <li>
                                 <HeadlessLink href="/get-started" className="text-gray-500 hover:text-gray-900">
@@ -80,7 +81,7 @@ export function Footer(props: FooterProps) {
 
                     {/* Company */}
                     <div className="space-y-4">
-                        <h3 className="font-bold">{t('footer.companySectionTitle')}</h3>
+                        <h3 className="font-bold text-gray-900 dark:text-slate-100">{t('footer.companySectionTitle')}</h3>
                         <ul className="space-y-2 text-sm">
                             <li>
                                 <a
@@ -110,7 +111,7 @@ export function Footer(props: FooterProps) {
 
                     {/* Social */}
                     <div className="space-y-4">
-                        <h3 className="font-bold">{t('footer.connectSectionTitle')}</h3>
+                        <h3 className="font-bold text-gray-900 dark:text-slate-100">{t('footer.connectSectionTitle')}</h3>
                         <ul className="space-y-2 text-sm">
                             <li>
                                 <a
@@ -144,7 +145,7 @@ export function Footer(props: FooterProps) {
                     {/* Extra Links from Metadata */}
                     {extraLinks.length > 0 && (
                         <div className="space-y-4">
-                            <h3 className="font-bold">{t('footer.linksSectionTitle')}</h3>
+                            <h3 className="font-bold text-gray-900 dark:text-slate-100">{t('footer.linksSectionTitle')}</h3>
                             <ul className="space-y-2 text-sm">
                                 {extraLinks.map((link, index) => (
                                     <li key={index}>
@@ -163,13 +164,13 @@ export function Footer(props: FooterProps) {
                     )}
                 </div>
 
-                <div className="border-t mt-8 pt-8 text-center text-sm text-gray-500">
+                <div className="border-t border-gray-200 mt-8 pt-8 text-center text-sm text-gray-500 dark:border-slate-700 dark:text-slate-400">
                     <p>
                         &copy; {new Date().getFullYear()} Promptbook
                         <br />
                         {t('footer.allRightsReserved')}
                         <br />
-                        {t('footer.madeInCzechRepublic')}
+                        {t('footer.madeInCzechRepublic', { emoji: getCommitFooterEmoji(NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA) })}
                         {/* <- TODO: !!!!!!!! Put here Prague outline */}
                     </p>
                     <p className="mt-2 text-xs text-gray-400">

package/apps/agents-server/src/components/Footer/getCommitFooterEmoji.ts

@@ -0,0 +1,112 @@
+/**
+ * Curated list of positive or neutral emojis displayed in the footer's "Made with {emoji} in Europe" line.
+ *
+ * The order of this list is part of the deterministic mapping from commit SHA to emoji, so existing
+ * entries should not be reordered. New emojis can be appended at the end without affecting the
+ * indexes of existing ones, but each commit SHA will then map to a different emoji.
+ *
+ * Hearts, cute animals, plants, fruits, sweets, and celebratory symbols are intentionally chosen so
+ * that the footer never shows anything aggressive, scary, or negative.
+ */
+const POSITIVE_FOOTER_EMOJIS = [
+    '❤️',
+    '🧡',
+    '💛',
+    '💚',
+    '💙',
+    '💜',
+    '🤍',
+    '💖',
+    '💝',
+    '🐙',
+    '🦄',
+    '🐶',
+    '🐱',
+    '🐰',
+    '🦊',
+    '🐻',
+    '🐼',
+    '🐨',
+    '🐯',
+    '🦁',
+    '🐸',
+    '🐵',
+    '🐧',
+    '🦉',
+    '🐢',
+    '🦋',
+    '🐝',
+    '🐞',
+    '🐳',
+    '🐬',
+    '🦒',
+    '🐘',
+    '🌸',
+    '🌻',
+    '🌷',
+    '🌹',
+    '🌈',
+    '🌟',
+    '✨',
+    '☀️',
+    '🌙',
+    '🍀',
+    '🌳',
+    '🍎',
+    '🍓',
+    '🍑',
+    '🍒',
+    '🍋',
+    '🍊',
+    '🍇',
+    '🍉',
+    '🍰',
+    '🍪',
+    '🍩',
+    '🍕',
+    '🍔',
+    '🍦',
+    '🍫',
+    '🎉',
+    '🎈',
+    '🎁',
+    '🎨',
+    '🚀',
+    '⭐',
+    '💎',
+    '🪐',
+    '🎵',
+] as const;
+
+/**
+ * Default emoji used in the footer when no commit SHA is available (for example during local
+ * development outside Vercel). Kept as the historic `❤️` so the footer text does not look
+ * unusual when the deployment metadata is missing.
+ */
+const DEFAULT_FOOTER_EMOJI: string = POSITIVE_FOOTER_EMOJIS[0]!;
+
+/**
+ * Derives a stable emoji from a commit SHA using a small djb2-style string hash.
+ *
+ * The same SHA always produces the same emoji, so users can spot a server update by noticing that
+ * the footer emoji changed. The result is taken modulo the curated list, so it is always one of
+ * the positive/neutral emojis in {@link POSITIVE_FOOTER_EMOJIS}.
+ *
+ * @param commitSha - Full or short commit SHA. May be `null` or `undefined` when running outside
+ *                    a Vercel deployment, in which case {@link DEFAULT_FOOTER_EMOJI} is returned.
+ * @returns One emoji from {@link POSITIVE_FOOTER_EMOJIS}.
+ * @private Internal to `apps/agents-server`
+ */
+export function getCommitFooterEmoji(commitSha: string | null | undefined): string {
+    if (!commitSha) {
+        return DEFAULT_FOOTER_EMOJI;
+    }
+
+    let hash = 0;
+    for (let characterIndex = 0; characterIndex < commitSha.length; characterIndex++) {
+        hash = (hash * 31 + commitSha.charCodeAt(characterIndex)) | 0;
+    }
+
+    const emojiIndex = Math.abs(hash) % POSITIVE_FOOTER_EMOJIS.length;
+    return POSITIVE_FOOTER_EMOJIS[emojiIndex]!;
+}

package/apps/agents-server/src/components/Header/ActiveAgentBreadcrumbContext.tsx

@@ -0,0 +1,82 @@
+'use client';
+
+import { createContext, useContext, useEffect, useMemo, useState, type ReactNode } from 'react';
+import type { AgentBasicInformation } from '../../../../../src/book-2.0/agent-source/AgentBasicInformation';
+
+/**
+ * Subset of agent information that the Header breadcrumb needs to render an agent's name (and avatar)
+ * even when the active agent is not part of the loaded organization list.
+ *
+ * @private mechanism of Agents Server header
+ */
+export type ActiveAgentBreadcrumbInfo = Pick<
+    AgentBasicInformation,
+    'agentName' | 'agentHash' | 'permanentId' | 'meta'
+>;
+
+/**
+ * Internal shape of the active-agent breadcrumb context.
+ *
+ * @private type of Header
+ */
+type ActiveAgentBreadcrumbContextValue = {
+    readonly activeAgentBreadcrumbInfo: ActiveAgentBreadcrumbInfo | null;
+    readonly setActiveAgentBreadcrumbInfo: (info: ActiveAgentBreadcrumbInfo | null) => void;
+};
+
+/**
+ * Context that lets agent pages share the active agent's display info with the Header.
+ *
+ * @private mechanism of Agents Server header
+ */
+const ActiveAgentBreadcrumbContext = createContext<ActiveAgentBreadcrumbContextValue | null>(null);
+
+/**
+ * Provides storage for the active agent's breadcrumb info to the Header.
+ *
+ * @private function of Header
+ */
+export function ActiveAgentBreadcrumbProvider({ children }: { readonly children: ReactNode }) {
+    const [activeAgentBreadcrumbInfo, setActiveAgentBreadcrumbInfo] = useState<ActiveAgentBreadcrumbInfo | null>(null);
+
+    const value = useMemo<ActiveAgentBreadcrumbContextValue>(
+        () => ({ activeAgentBreadcrumbInfo, setActiveAgentBreadcrumbInfo }),
+        [activeAgentBreadcrumbInfo],
+    );
+
+    return <ActiveAgentBreadcrumbContext.Provider value={value}>{children}</ActiveAgentBreadcrumbContext.Provider>;
+}
+
+/**
+ * Reads the active agent's breadcrumb info, used by the Header to render the agent's name in
+ * the breadcrumb whenever the agent is not present in the loaded organization list.
+ *
+ * @private function of Header
+ */
+export function useActiveAgentBreadcrumbInfo(): ActiveAgentBreadcrumbInfo | null {
+    return useContext(ActiveAgentBreadcrumbContext)?.activeAgentBreadcrumbInfo ?? null;
+}
+
+/**
+ * Registers the active agent's breadcrumb info while the calling component is mounted.
+ * Pages that have loaded the agent profile call this hook so the Header breadcrumb can show
+ * the agent's name instead of falling back to its identifier.
+ *
+ * @private function of Header
+ */
+export function useRegisterActiveAgentBreadcrumbInfo(info: ActiveAgentBreadcrumbInfo | null): void {
+    const context = useContext(ActiveAgentBreadcrumbContext);
+    const setter = context?.setActiveAgentBreadcrumbInfo;
+
+    useEffect(() => {
+        if (!setter) {
+            return;
+        }
+
+        setter(info);
+
+        return () => {
+            setter(null);
+        };
+    }, [info, setter]);
+}

package/apps/agents-server/src/components/Header/Header.tsx

@@ -2,14 +2,13 @@
 
 import { logoutAction } from '@/src/app/actions';
 import { PROMPTBOOK_COLOR } from '@promptbook-local/core';
-import { ArrowRight } from 'lucide-react';
+import { ArrowRight, TriangleAlert } from 'lucide-react';
 import { usePathname, useRouter } from 'next/navigation';
 import { useCallback, useMemo, useState } from 'react';
 import { HamburgerMenu } from '../../../../../src/book-components/_common/HamburgerMenu/HamburgerMenu';
 import { useMenuHoisting } from '../../../../../src/book-components/_common/MenuHoisting/MenuHoistingContext';
 import { just } from '../../../../../src/utils/organization/just';
 import { getVisibleCommitmentDefinitions } from '../../utils/getVisibleCommitmentDefinitions';
-import { pushWithHeadless, useIsHeadless } from '../_utils/headlessParam';
 import { useInstallPromptState, type AgentContextMenuRenamePayload } from '../AgentContextMenu/AgentContextMenu';
 import { useAgentNaming } from '../AgentNaming/AgentNamingContext';
 import { QrCodeModal } from '../AgentProfile/QrCodeModal';
@@ -56,12 +55,11 @@ export function Header(props: HeaderProps) {
         federatedServers,
         isExperimental = false,
         feedbackMode = 'stars',
+        shibbolethAuthenticationStatus,
     } = props;
-
     const [isChangePasswordOpen, setIsChangePasswordOpen] = useState(false);
     const router = useRouter();
     const pathname = usePathname();
-    const isHeadless = useIsHeadless();
     const menuHoisting = useMenuHoisting();
     const mobileMenuHoisting = useMobileMenuHoisting();
     const { naming } = useAgentNaming();
@@ -72,13 +70,6 @@ export function Header(props: HeaderProps) {
         () => buildDocumentationDropdownItems(visibleDocumentationCommitments, t),
         [t, visibleDocumentationCommitments],
     );
-
-    const fallbackNavigateToHref = useCallback(
-        (href: string) => {
-            pushWithHeadless(router, href, isHeadless);
-        },
-        [isHeadless, router],
-    );
     const hoistedMobileMenuItems = mobileMenuHoisting?.menuItems || EMPTY_HOISTED_MOBILE_MENU_ITEMS;
     const {
         cancelMenuClose,
@@ -200,7 +191,6 @@ export function Header(props: HeaderProps) {
         isAdmin,
         isAuthenticated: Boolean(currentUser),
         isInstalled,
-        navigateToHref: fallbackNavigateToHref,
         namingPlural: naming.plural,
         namingSingular: naming.singular,
         onAgentRenamed: handleAgentRenamedFromHeader,
@@ -248,6 +238,9 @@ export function Header(props: HeaderProps) {
     );
 
     const hasMenuAccess = Boolean(currentUser || isAdmin);
+    const isShibbolethConfigurationWarningShown = Boolean(
+        shibbolethAuthenticationStatus?.isActive && !shibbolethAuthenticationStatus.isConfigured,
+    );
     const systemMenuEntries = useMemo(
         () =>
             buildHeaderSystemMenuItems({
@@ -257,8 +250,21 @@ export function Header(props: HeaderProps) {
                 isGlobalAdmin,
                 isExperimental,
                 feedbackMode,
+                shibbolethAuthenticationStatus,
             }),
-        [currentUser, feedbackMode, isAdmin, isExperimental, isGlobalAdmin, t],
+        [currentUser, feedbackMode, isAdmin, isExperimental, isGlobalAdmin, shibbolethAuthenticationStatus, t],
+    );
+    const systemLabel = useMemo(
+        () =>
+            isShibbolethConfigurationWarningShown ? (
+                <span className="inline-flex items-center gap-2">
+                    {t('header.systemMenuLabel')}
+                    <TriangleAlert className="h-4 w-4 text-amber-500" aria-label="Warning" />
+                </span>
+            ) : (
+                t('header.systemMenuLabel')
+            ),
+        [isShibbolethConfigurationWarningShown, t],
     );
     const menuItems = useMemo(
         () =>
@@ -274,7 +280,7 @@ export function Header(props: HeaderProps) {
                 setIsMobileDocsOpen,
                 setIsMobileSystemOpen,
                 setIsSystemOpen,
-                systemLabel: t('header.systemMenuLabel'),
+                systemLabel,
                 systemMenuEntries,
             }),
         [
@@ -288,6 +294,7 @@ export function Header(props: HeaderProps) {
             setIsMobileDocsOpen,
             setIsMobileSystemOpen,
             setIsSystemOpen,
+            systemLabel,
             systemMenuEntries,
             t,
         ],
@@ -389,7 +396,9 @@ export function Header(props: HeaderProps) {
                                         key={index}
                                         onClick={item.onClick}
                                         className={`rounded-md p-2 text-gray-600 transition-colors hover:bg-gray-100 hover:text-gray-900 dark:text-slate-300 dark:hover:bg-slate-800 dark:hover:text-slate-100 ${
-                                            item.isActive ? 'bg-gray-100 text-gray-900 dark:bg-slate-800 dark:text-slate-100' : ''
+                                            item.isActive
+                                                ? 'bg-gray-100 text-gray-900 dark:bg-slate-800 dark:text-slate-100'
+                                                : ''
                                         }`}
                                         title={item.name}
                                     >

package/apps/agents-server/src/components/Header/HeaderTypes.ts

@@ -2,6 +2,7 @@ import type { ReactNode } from 'react';
 import type { AgentOrganizationAgent, AgentOrganizationFolder } from '../../utils/agentOrganization/types';
 import type { ChatFeedbackMode } from '../../utils/chatFeedbackMode';
 import type { UserInfo } from '../../utils/getCurrentUser';
+import type { ShibbolethAuthenticationMenuStatus } from '../../constants/shibbolethAuth';
 import type { SubMenuItem } from './SubMenuItem';
 
 /**
@@ -57,6 +58,11 @@ export type HeaderProps = {
      * Determines which chat feedback mode is active.
      */
     feedbackMode?: ChatFeedbackMode;
+
+    /**
+     * Shibboleth authentication status used to show login-method menu entries and warnings.
+     */
+    shibbolethAuthenticationStatus?: ShibbolethAuthenticationMenuStatus;
 };
 
 /**

package/apps/agents-server/src/components/Header/buildHeaderSystemMenuItems.ts

@@ -5,11 +5,15 @@ import {
     KeyRound,
     RefreshCw,
     Settings2,
+    ShieldCheck,
+    TriangleAlert,
     UserRound,
     Wrench,
     type LucideIcon,
 } from 'lucide-react';
+import { createElement } from 'react';
 import type { ServerTranslationKey } from '../../languages/ServerTranslationKeys';
+import type { ShibbolethAuthenticationMenuStatus } from '../../constants/shibbolethAuth';
 import type { ChatFeedbackMode } from '../../utils/chatFeedbackMode';
 import type { UserInfo } from '../../utils/getCurrentUser';
 import type { SubMenuItem } from './SubMenuItem';
@@ -31,6 +35,7 @@ type SystemCategoryLabel =
     | 'Utilities'
     | 'Super Admin'
     | 'Administration'
+    | 'Login Methods'
     | 'Monitoring & Usage'
     | 'Integrations & Keys'
     | 'Developer / Debug'
@@ -48,6 +53,7 @@ type BuildHeaderSystemMenuItemsOptions = {
     readonly isGlobalAdmin: boolean;
     readonly isExperimental: boolean;
     readonly feedbackMode: ChatFeedbackMode;
+    readonly shibbolethAuthenticationStatus?: ShibbolethAuthenticationMenuStatus;
 };
 
 /**
@@ -58,6 +64,7 @@ const SYSTEM_CATEGORY_ICON_MAP: Record<SystemCategoryLabel, LucideIcon> = {
     Utilities: Wrench,
     'Super Admin': Settings2,
     Administration: Settings2,
+    'Login Methods': KeyRound,
     'Monitoring & Usage': BarChart3,
     'Integrations & Keys': KeyRound,
     'Developer / Debug': Code2,
@@ -72,6 +79,7 @@ const SYSTEM_CATEGORY_TRANSLATION_KEY_MAP: Record<SystemCategoryLabel, ServerTra
     Utilities: 'header.utilities',
     'Super Admin': 'header.superAdmin',
     Administration: 'header.administration',
+    'Login Methods': 'header.loginMethods',
     'Monitoring & Usage': 'header.monitoringAndUsage',
     'Integrations & Keys': 'header.integrationsAndKeys',
     'Developer / Debug': 'header.developerDebug',
@@ -95,6 +103,21 @@ function applyFallbackSubMenuIcon(
     });
 }
 
+/**
+ * Decorates a menu label with the warning indicator used for misconfigured login methods.
+ */
+function createWarningMenuLabel(label: string) {
+    return createElement(
+        'span',
+        { className: 'inline-flex items-center gap-2' },
+        label,
+        createElement(TriangleAlert, {
+            className: 'h-4 w-4 text-amber-500',
+            'aria-label': 'Warning',
+        }),
+    );
+}
+
 /**
  * Creates one category entry inside the System dropdown when there are items to show.
  */
@@ -102,6 +125,7 @@ function createSystemCategory(
     label: SystemCategoryLabel,
     items: ReadonlyArray<SubMenuItem>,
     translate: HeaderTranslate,
+    isWarningShown = false,
 ): SubMenuItem[] {
     if (items.length === 0) {
         return [];
@@ -110,7 +134,9 @@ function createSystemCategory(
     const categoryIcon = SYSTEM_CATEGORY_ICON_MAP[label];
     return [
         {
-            label: translate(SYSTEM_CATEGORY_TRANSLATION_KEY_MAP[label]),
+            label: isWarningShown
+                ? createWarningMenuLabel(translate(SYSTEM_CATEGORY_TRANSLATION_KEY_MAP[label]))
+                : translate(SYSTEM_CATEGORY_TRANSLATION_KEY_MAP[label]),
             icon: categoryIcon,
             items: applyFallbackSubMenuIcon(items, categoryIcon),
         },
@@ -129,6 +155,7 @@ export function buildHeaderSystemMenuItems({
     isGlobalAdmin,
     isExperimental,
     feedbackMode,
+    shibbolethAuthenticationStatus,
 }: BuildHeaderSystemMenuItemsOptions): SubMenuItem[] {
     const userAccountSystemItems: SubMenuItem[] = [
         {
@@ -274,6 +301,23 @@ export function buildHeaderSystemMenuItems({
         },
     ];
 
+    const isShibbolethConfigurationWarningShown = Boolean(
+        shibbolethAuthenticationStatus?.isActive && !shibbolethAuthenticationStatus.isConfigured,
+    );
+    const loginMethodsSystemItems: SubMenuItem[] = shibbolethAuthenticationStatus?.isActive
+        ? [
+              {
+                  label: isShibbolethConfigurationWarningShown
+                      ? createWarningMenuLabel(translate('header.shibboleth'))
+                      : translate('header.shibboleth'),
+                  href: isShibbolethConfigurationWarningShown
+                      ? '/admin/login-methods/shibboleth#setup-instructions'
+                      : '/admin/login-methods/shibboleth',
+                  icon: ShieldCheck,
+              },
+          ]
+        : [];
+
     const monitoringAndUsageSystemItems: SubMenuItem[] = [
         {
             label: translate('header.usageAnalytics'),
@@ -345,6 +389,12 @@ export function buildHeaderSystemMenuItems({
         ...createSystemCategory('Utilities', utilitiesSystemItems, translate),
         ...createSystemCategory('Super Admin', superAdminSystemItems, translate),
         ...createSystemCategory('Administration', administrationSystemItems, translate),
+        ...createSystemCategory(
+            'Login Methods',
+            loginMethodsSystemItems,
+            translate,
+            isShibbolethConfigurationWarningShown,
+        ),
         ...createSystemCategory('Monitoring & Usage', monitoringAndUsageSystemItems, translate),
         ...createSystemCategory('Integrations & Keys', integrationsAndKeysSystemItems, translate),
         ...createSystemCategory('Developer / Debug', developerDebugSystemItems, translate),

package/apps/agents-server/src/components/Header/useHeaderActiveAgent.ts

@@ -5,6 +5,7 @@ import { buildAgentFolderContext, type AgentFolderContext } from '../../utils/ag
 import type { AgentOrganizationAgent } from '../../utils/agentOrganization/types';
 import { buildAgentProfileHref, buildFreshAgentChatHref } from '../../utils/agentRouting/agentRouteHrefs';
 import type { ServerTranslationKey } from '../../languages/ServerTranslationKeys';
+import { useActiveAgentBreadcrumbInfo, type ActiveAgentBreadcrumbInfo } from './ActiveAgentBreadcrumbContext';
 import type { HeaderAgentMenuFolder } from './AgentMenuStructure';
 import { buildAgentMenuStructure } from './buildAgentMenuStructure';
 import { createAgentViewLabel } from './createAgentViewLabel';
@@ -137,11 +138,17 @@ function createActiveAgentHref(activeAgentNavigationId: string | null): string {
 /**
  * Resolves the breadcrumb label shown for the active agent.
  *
+ * The agent's identifier (its `agentName` or `permanentId`) must never leak into the breadcrumb
+ * because the URL form is opaque to the user. When the agent cannot be resolved from the loaded
+ * organization list (typical for anonymous users browsing a public agent), the Header falls back
+ * to the breadcrumb info registered by the agent page; if that is also missing, a generic label
+ * is shown instead of the raw identifier.
+ *
  * @private function of Header
  */
 function createActiveAgentLabel(
     activeAgent: AgentOrganizationAgent | null,
-    activeAgentIdentifier: string | null,
+    activeAgentBreadcrumbInfo: ActiveAgentBreadcrumbInfo | null,
     agentFolderById: Map<number, HeaderAgentMenuFolder>,
     namingPlural: string,
     translate: HeaderTranslate,
@@ -150,7 +157,11 @@ function createActiveAgentLabel(
         return createAgentHierarchyLabel(activeAgent, agentFolderById);
     }
 
-    return activeAgentIdentifier || translate('header.agentsLabelFallback', { agentsPlural: namingPlural });
+    if (activeAgentBreadcrumbInfo) {
+        return activeAgentBreadcrumbInfo.meta?.fullname || activeAgentBreadcrumbInfo.agentName;
+    }
+
+    return translate('header.agentsLabelFallback', { agentsPlural: namingPlural });
 }
 
 /**
@@ -218,11 +229,12 @@ export function useHeaderActiveAgent({
         () => resolveActiveAgent(activeAgentNavigation, agentByIdentifier),
         [activeAgentNavigation, agentByIdentifier],
     );
+    const activeAgentBreadcrumbInfo = useActiveAgentBreadcrumbInfo();
     const activeAgentNavigationId = resolveActiveAgentNavigationId(activeAgent, activeAgentNavigation.agentIdentifier);
     const activeAgentHref = createActiveAgentHref(activeAgentNavigationId);
     const activeAgentLabel = createActiveAgentLabel(
         activeAgent,
-        activeAgentNavigation.agentIdentifier,
+        activeAgentBreadcrumbInfo,
         agentFolderById,
         namingPlural,
         translate,
@@ -239,10 +251,17 @@ export function useHeaderActiveAgent({
         [activeAgentMenuAgent.folderId, activeAgentMenuAgent.visibility, agentFolderById],
     );
     const { origin, hostname } = readWindowLocationState();
-    const activeAgentAvatarUrl = useMemo(
-        () => (activeAgent ? resolveAgentAvatarImageUrl({ agent: activeAgent }) : null),
-        [activeAgent],
-    );
+    const activeAgentAvatarUrl = useMemo(() => {
+        if (activeAgent) {
+            return resolveAgentAvatarImageUrl({ agent: activeAgent });
+        }
+
+        if (activeAgentBreadcrumbInfo) {
+            return resolveAgentAvatarImageUrl({ agent: activeAgentBreadcrumbInfo });
+        }
+
+        return null;
+    }, [activeAgent, activeAgentBreadcrumbInfo]);
 
     return {
         activeAgent,

package/apps/agents-server/src/components/Header/useHeaderAgentMenus.tsx

@@ -44,7 +44,6 @@ type UseHeaderAgentMenusOptions = {
     readonly isAdmin: boolean;
     readonly isAuthenticated: boolean;
     readonly isInstalled: boolean;
-    readonly navigateToHref: (href: string) => void;
     readonly namingPlural: string;
     readonly namingSingular: string;
     readonly onAgentRenamed: (payload: AgentContextMenuRenamePayload) => void;
@@ -160,7 +159,6 @@ export function useHeaderAgentMenus({
     isAdmin,
     isAuthenticated,
     isInstalled,
-    navigateToHref,
     namingPlural,
     namingSingular,
     onAgentRenamed,
@@ -214,9 +212,6 @@ export function useHeaderAgentMenus({
         openNewAgentDialog,
         dialog: newAgentDialog,
     } = useNewAgentDialog({
-        onCreated: ({ targetPath }) => {
-            navigateToHref(targetPath);
-        },
         onCreateFailed: async (error) => {
             await showNewAgentFailure('Failed to create agent:', error, namingSingular, translate);
         },