From 44ed72f94700ae285200f361a87ff748237fa9a1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=95=B7=E7=94=B0=E8=8B=B1=E5=B9=B8?= Date: Sat, 15 Nov 2025 12:33:25 +0900 Subject: [PATCH 1/2] Fix: Close inter-use-case demo popup when navigating away - Added logic to automatically close the inter-use-case demo popup when navigating to pages outside the demo flow - Normalized path comparison to handle paths with or without leading slash - Prevents demo header from remaining visible after navigation Fixes the issue where the demo header stays visible when clicking Home or other navigation items while the demo is active. --- packages/web/src/App.tsx | 41 +++++++++++++++++++++++----------------- 1 file changed, 24 insertions(+), 17 deletions(-) diff --git a/packages/web/src/App.tsx b/packages/web/src/App.tsx index 9a805842c..92c341c51 100644 --- a/packages/web/src/App.tsx +++ b/packages/web/src/App.tsx @@ -46,15 +46,12 @@ const inlineAgents: boolean = import.meta.env.VITE_APP_INLINE_AGENTS === 'true'; const mcpEnabled: boolean = import.meta.env.VITE_APP_MCP_ENABLED === 'true'; const agentCoreEnabled: boolean = import.meta.env.VITE_APP_AGENT_CORE_ENABLED === 'true'; -const agentBuilderEnabled: boolean = - import.meta.env.VITE_APP_AGENT_CORE_AGENT_BUILDER_ENABLED === 'true'; - const { visionEnabled, imageGenModelIds, videoGenModelIds, speechToSpeechModelIds, - agents, + agentNames, flowChatEnabled, } = MODELS; @@ -123,10 +120,10 @@ const App: React.FC = () => { } : null, ...(agentEnabled && inlineAgents - ? agents.map((agent) => { + ? agentNames.map((name: string) => { return { - label: agent.displayName, - to: `/agent/${agent.displayName}`, + label: name, + to: `/agent/${name}`, icon: , display: 'usecase' as const, sub: 'Agent', @@ -151,15 +148,6 @@ const App: React.FC = () => { sub: 'Experimental', } : null, - agentBuilderEnabled - ? { - label: 'Agent Builder', - to: '/agent-builder', - icon: , - display: 'usecase' as const, - sub: 'Experimental', - } - : null, flowChatEnabled ? { label: t('navigation.flowChat'), @@ -290,6 +278,25 @@ const App: React.FC = () => { } }, [pathname, screen, notifyScreen]); + // Close inter-use-cases demo popup when navigating away from demo pages + const { setIsShow: setInterUseCasesShow, useCases } = useInterUseCases(); + useEffect(() => { + // Only check if demo is currently shown and useCases are loaded + // Skip if useCases is empty to avoid closing during initialization + if (isShow && useCases.length > 0) { + const isInDemoFlow = useCases.some((useCase) => { + // Normalize paths by ensuring they start with / + const useCasePath = useCase.path.startsWith('/') ? useCase.path : `/${useCase.path}`; + // Check if current path matches any use case path + return pathname === useCasePath || pathname.startsWith(useCasePath + '/'); + }); + if (!isInDemoFlow) { + setInterUseCasesShow(false); + } + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [pathname, isShow]); + return (
{
- {label} + {pathname !== '/' ? label : ''} {/* Dummy block to center the label */}
From 7c4069535319d559a677fec61eb04c037420e2e2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=95=B7=E7=94=B0=E8=8B=B1=E5=B9=B8?= Date: Tue, 16 Dec 2025 06:41:46 +0900 Subject: [PATCH 2/2] fix: Remove unnecessary changes, keep only demo popup fix - Restore agentBuilderEnabled variable and menu item - Revert agents variable name changes (agentNames -> agents) - Restore original label display logic - Keep only the inter-use-case demo popup closing functionality Addresses reviewer feedback about unnecessary changes in PR #1355 --- packages/web/src/App.tsx | 30 +++++++++++++++++++++++------- 1 file changed, 23 insertions(+), 7 deletions(-) diff --git a/packages/web/src/App.tsx b/packages/web/src/App.tsx index 92c341c51..4bba8f234 100644 --- a/packages/web/src/App.tsx +++ b/packages/web/src/App.tsx @@ -46,12 +46,15 @@ const inlineAgents: boolean = import.meta.env.VITE_APP_INLINE_AGENTS === 'true'; const mcpEnabled: boolean = import.meta.env.VITE_APP_MCP_ENABLED === 'true'; const agentCoreEnabled: boolean = import.meta.env.VITE_APP_AGENT_CORE_ENABLED === 'true'; +const agentBuilderEnabled: boolean = + import.meta.env.VITE_APP_AGENT_CORE_AGENT_BUILDER_ENABLED === 'true'; + const { visionEnabled, imageGenModelIds, videoGenModelIds, speechToSpeechModelIds, - agentNames, + agents, flowChatEnabled, } = MODELS; @@ -120,10 +123,10 @@ const App: React.FC = () => { } : null, ...(agentEnabled && inlineAgents - ? agentNames.map((name: string) => { + ? agents.map((agent) => { return { - label: name, - to: `/agent/${name}`, + label: agent.displayName, + to: `/agent/${agent.displayName}`, icon: , display: 'usecase' as const, sub: 'Agent', @@ -148,6 +151,15 @@ const App: React.FC = () => { sub: 'Experimental', } : null, + agentBuilderEnabled + ? { + label: 'Agent Builder', + to: '/agent-builder', + icon: , + display: 'usecase' as const, + sub: 'Experimental', + } + : null, flowChatEnabled ? { label: t('navigation.flowChat'), @@ -286,9 +298,13 @@ const App: React.FC = () => { if (isShow && useCases.length > 0) { const isInDemoFlow = useCases.some((useCase) => { // Normalize paths by ensuring they start with / - const useCasePath = useCase.path.startsWith('/') ? useCase.path : `/${useCase.path}`; + const useCasePath = useCase.path.startsWith('/') + ? useCase.path + : `/${useCase.path}`; // Check if current path matches any use case path - return pathname === useCasePath || pathname.startsWith(useCasePath + '/'); + return ( + pathname === useCasePath || pathname.startsWith(useCasePath + '/') + ); }); if (!isInDemoFlow) { setInterUseCasesShow(false); @@ -314,7 +330,7 @@ const App: React.FC = () => {
- {pathname !== '/' ? label : ''} + {label} {/* Dummy block to center the label */}