This is an automated email from the ASF dual-hosted git repository. marat pushed a commit to branch main in repository https://gitbox.apache.org/repos/asf/camel-karavan.git
commit c4800d289f245cb8300826f972d191fadcb78fc6 Author: Marat Gubaidullin <[email protected]> AuthorDate: Fri Apr 3 13:51:51 2026 -0400 Karavan App Menu --- .../webui/src/ui/app/navigation/NavigationMenu.tsx | 34 ++++++++-------------- .../webui/src/ui/app/navigation/PageNavigation.css | 9 +++--- .../webui/src/ui/app/navigation/PageNavigation.tsx | 6 ++-- .../webui/src/ui/app/navigation/PlatformLogo.tsx | 7 ++--- 4 files changed, 21 insertions(+), 35 deletions(-) diff --git a/karavan-app/src/main/webui/src/ui/app/navigation/NavigationMenu.tsx b/karavan-app/src/main/webui/src/ui/app/navigation/NavigationMenu.tsx index e72b842c..7329d64a 100644 --- a/karavan-app/src/main/webui/src/ui/app/navigation/NavigationMenu.tsx +++ b/karavan-app/src/main/webui/src/ui/app/navigation/NavigationMenu.tsx @@ -16,45 +16,35 @@ export class MenuItem { } } -export function getNavigationFirstMenu(masActivated: boolean): MenuItem[] { +export function getNavigationFirstMenu(environment: string, infrastructure: string): MenuItem[] { + const iconInfra = infrastructure === 'kubernetes' ? KubernetesIcon("infra-icon-k8s") : <DockerIcon className='infra-icon-docker'/>; const menus = [ new MenuItem("dashboard", "Dashboard", SvgNavigationIcon({icon: 'dashboard'})), new MenuItem("projects", "Projects", SvgNavigationIcon({icon: 'apps'})), - new MenuItem("events", "Events", SvgNavigationIcon({icon: 'landscape'})), - new MenuItem("schemas", "Schemas", SvgNavigationIcon({icon: 'json-schema'})), - new MenuItem("apis", "APIs", SvgNavigationIcon({icon: 'api'})), ] - if (masActivated) { - menus.push( - new MenuItem("mcp", "MCP", SvgNavigationIcon({icon: 'mcp'})), - new MenuItem("agents", "Agents", SvgNavigationIcon({icon: 'agents'})) - ) - } menus.push( new MenuItem("settings", "Settings", SvgNavigationIcon({icon: 'settings'})) ) - return menus; -} - - -export function getNavigationSecondMenu(environment: string, infrastructure: string): MenuItem[] { - const iconInfra = infrastructure === 'kubernetes' ? KubernetesIcon("infra-icon-k8s") : <DockerIcon className='infra-icon-docker'/>; - - const pages: MenuItem[] = [] - if (environment === 'dev') { - pages.push(new MenuItem("documentation", "Learn", SvgNavigationIcon({icon: 'documentation'}))); + menus.push(new MenuItem("documentation", "Learn", SvgNavigationIcon({icon: 'documentation'}))); } if (getCurrentUser()?.roles?.includes('platform-admin')) { - pages.push(new MenuItem("system", "System", iconInfra)); + menus.push(new MenuItem("system", "System", iconInfra)); } if (AuthApi.authType === 'session') { - pages.push(new MenuItem("acl", "Access", SvgNavigationIcon({icon: 'access'}))); + menus.push(new MenuItem("acl", "Access", SvgNavigationIcon({icon: 'access'}))); } + return menus; +} + +export function getNavigationSecondMenu(environment: string, infrastructure: string): MenuItem[] { + const iconInfra = infrastructure === 'kubernetes' ? KubernetesIcon("infra-icon-k8s") : <DockerIcon className='infra-icon-docker'/>; + + const pages: MenuItem[] = [] pages.push(new MenuItem("logout", "Logout", SvgNavigationIcon({icon: 'logout'}))); return pages; diff --git a/karavan-app/src/main/webui/src/ui/app/navigation/PageNavigation.css b/karavan-app/src/main/webui/src/ui/app/navigation/PageNavigation.css index d3899c66..d057c166 100644 --- a/karavan-app/src/main/webui/src/ui/app/navigation/PageNavigation.css +++ b/karavan-app/src/main/webui/src/ui/app/navigation/PageNavigation.css @@ -56,10 +56,11 @@ } .karavan .nav-buttons .logo { - margin-top: 16px; - margin-bottom: 16px; - width: 32px; - height: 32px; + margin-top: 6px; + margin-bottom: -6px; + margin-left: 12px; + width: 64px; + height: 64px; } .karavan .nav-buttons .pf-v6-c-button svg { diff --git a/karavan-app/src/main/webui/src/ui/app/navigation/PageNavigation.tsx b/karavan-app/src/main/webui/src/ui/app/navigation/PageNavigation.tsx index ddf9185d..4d88f618 100644 --- a/karavan-app/src/main/webui/src/ui/app/navigation/PageNavigation.tsx +++ b/karavan-app/src/main/webui/src/ui/app/navigation/PageNavigation.tsx @@ -1,5 +1,5 @@ import React, {useContext, useState} from 'react'; -import {Badge, Button,} from '@patternfly/react-core'; +import {Button,} from '@patternfly/react-core'; import './PageNavigation.css'; import {useAppConfigStore, useDevModeStore, useFileStore} from "@stores/ProjectStore"; import {shallow} from "zustand/shallow"; @@ -25,8 +25,7 @@ function PageNavigation() { const navigate = useNavigate(); const location = useLocation(); const {reload} = useContext(AuthContext); - const masActivated = config?.advanced?.mas === "true"; - const firstMenu = getNavigationFirstMenu(masActivated); + const firstMenu = getNavigationFirstMenu(config.environment, config.infrastructure); const secondMenu = getNavigationSecondMenu(config.environment, config.infrastructure); React.useEffect(() => { @@ -104,7 +103,6 @@ function PageNavigation() { {customLogo && Logo(customLogo)} </div> <div style={{alignSelf: 'center'}} className='environment-wrapper'> - <Badge isRead className='environment'>{config.environment}</Badge> </div> {getMenu(firstMenu)} <div style={{flex: 2}}/> diff --git a/karavan-app/src/main/webui/src/ui/app/navigation/PlatformLogo.tsx b/karavan-app/src/main/webui/src/ui/app/navigation/PlatformLogo.tsx index e7218e55..949a4457 100644 --- a/karavan-app/src/main/webui/src/ui/app/navigation/PlatformLogo.tsx +++ b/karavan-app/src/main/webui/src/ui/app/navigation/PlatformLogo.tsx @@ -17,11 +17,8 @@ import {KaravanIcon} from "@features/project/designer/icons/KaravanIcons"; -export function PlatformLogoBase64(customLogo?: string) { - - return customLogo - ? customLogo - : 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMzM3LjY1OSAzNDAuNzU5Ij48ZGVmcz48Y2lyY2xlIGlkPSJwYXRoLTEiIGN4PSIxMjgiIGN5PSIxMjgiIHI9IjEyOCI+PC9jaXJjbGU+PGxpbmVhckdyYWRpZW50IHgxPSItMjYuMDUxIiB4Mj0iMjU0LjMxNiIgeTE9IjI3MS4zMzEiIHkyPSIwLjA0OCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29 [...] +export function PlatformLogoBase64() { + return 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgICAgICB3aWR0aD0iMzYwLjEzODg1IgogICAgICAgIGhlaWdodD0iMzYwLjEzODg1IgogICAgICAgIHZpZXdCb3g9IjAgMCAzNjAuMTM4ODUgMzYwLjEzODg1IgogICAgICAgIHZlcnNpb249IjEuMSIKICAgICAgICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCIKICAgICAgICBpZD0ic3ZnNTAiCiAgICAgICAgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiCiAgICAgICAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZGVmcwogIC [...] } export function PlatformLogo(classNames?: string) {
