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 d57e1eb2a94f997853f102b50b33ae687148304e Author: Marat Gubaidullin <marat.gubaidul...@gmail.com> AuthorDate: Thu Jul 13 12:09:52 2023 -0400 Trace In docker #817 --- .../karavan-app/src/main/webui/src/Main.tsx | 6 +++-- .../src/main/webui/src/project/DevModeToolbar.tsx | 26 ++++++++++++++-------- .../src/main/webui/src/project/ProjectToolbar.tsx | 14 ++---------- .../webui/src/project/dashboard/DashboardTab.tsx | 2 +- .../main/webui/src/project/dashboard/InfoPod.tsx | 17 +------------- .../src/main/webui/src/project/trace/TraceTab.tsx | 2 +- 6 files changed, 26 insertions(+), 41 deletions(-) diff --git a/karavan-cloud/karavan-app/src/main/webui/src/Main.tsx b/karavan-cloud/karavan-app/src/main/webui/src/Main.tsx index 89e1a728..cf61f783 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/Main.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/Main.tsx @@ -28,9 +28,9 @@ import {MainLogin} from "./MainLogin"; import {DashboardPage} from "./dashboard/DashboardPage"; import {Subscription} from "rxjs"; import {ProjectEventBus} from "./api/ProjectEventBus"; -import {Project, ToastMessage} from "./api/ProjectModels"; +import {PodStatus, Project, ToastMessage} from "./api/ProjectModels"; import {ProjectPage} from "./project/ProjectPage"; -import {useAppConfigStore, useFileStore} from "./api/ProjectStore"; +import {useAppConfigStore, useDevModeStore, useFileStore, useProjectStore} from "./api/ProjectStore"; import {Notification} from "./Notification"; class MenuItem { @@ -175,6 +175,8 @@ export class Main extends React.Component<Props, State> { className={this.state.pageId === page.pageId ? "nav-button-selected" : ""} onClick={event => { useFileStore.setState({operation:'none', file: undefined}) + useDevModeStore.setState({podName: undefined, status: "none"}) + useProjectStore.setState({podStatus: new PodStatus({}), }) this.setState({pageId: page.pageId}); }} /> diff --git a/karavan-cloud/karavan-app/src/main/webui/src/project/DevModeToolbar.tsx b/karavan-cloud/karavan-app/src/main/webui/src/project/DevModeToolbar.tsx index ee9e2c8b..99bff60e 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/project/DevModeToolbar.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/project/DevModeToolbar.tsx @@ -1,16 +1,13 @@ import React, {useState} from 'react'; -import { - Button, FlexItem, Switch, - Tooltip, - TooltipPosition -} from '@patternfly/react-core'; +import {Button, Flex, FlexItem, Label, Switch, Tooltip, TooltipPosition} from '@patternfly/react-core'; import '../designer/karavan.css'; import RocketIcon from "@patternfly/react-icons/dist/esm/icons/rocket-icon"; import ReloadIcon from "@patternfly/react-icons/dist/esm/icons/bolt-icon"; import DeleteIcon from "@patternfly/react-icons/dist/esm/icons/times-circle-icon"; -import {useProjectStore, useDevModeStore} from "../api/ProjectStore"; +import {useDevModeStore, useLogStore, useProjectStore} from "../api/ProjectStore"; import {ProjectService} from "../api/ProjectService"; import {shallow} from "zustand/shallow"; +import UpIcon from "@patternfly/react-icons/dist/esm/icons/check-circle-icon"; interface Props { @@ -20,14 +17,25 @@ interface Props { export const DevModeToolbar = (props: Props) => { const [status] = useDevModeStore((state) => [state.status], shallow) - const [project] = useProjectStore((state) => [state.project], shallow) + const [project,podStatus ] = useProjectStore((state) => [state.project, state.podStatus], shallow) const [verbose, setVerbose] = useState(false); const isRunning = status === "running"; const isStartingPod = status === "starting"; const isReloadingPod = status === "reloading"; const isDeletingPod = status === "deleting"; - return (<> + return (<Flex className="toolbar" direction={{default: "row"}} alignItems={{default: "alignItemsCenter"}}> + {isRunning && <FlexItem> + <Label icon={<UpIcon/>} color={"green"}> + <Tooltip content={"Show log"} position={TooltipPosition.bottom}> + <Button variant="link" + onClick={e => + useLogStore.setState({showLog: true, type: 'container', podName: podStatus.name})}> + {podStatus.name} + </Button> + </Tooltip> + </Label> + </FlexItem>} {(isRunning || isDeletingPod) && !isReloadingPod && props.reloadOnly !== true && <FlexItem> <Tooltip content="Stop devmode" position={TooltipPosition.bottom}> <Button isLoading={isDeletingPod ? true : undefined} @@ -73,5 +81,5 @@ export const DevModeToolbar = (props: Props) => { </Button> </Tooltip> </FlexItem>} - </>); + </Flex>); } diff --git a/karavan-cloud/karavan-app/src/main/webui/src/project/ProjectToolbar.tsx b/karavan-cloud/karavan-app/src/main/webui/src/project/ProjectToolbar.tsx index c65d5ced..4e6c5704 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/project/ProjectToolbar.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/project/ProjectToolbar.tsx @@ -1,16 +1,10 @@ -import React, {useEffect, useState} from 'react'; +import React, {useEffect} from 'react'; import { Button, Checkbox, Flex, FlexItem, - Form, - FormGroup, - FormHelperText, Label, - Modal, - ModalVariant, - TextInput, ToggleGroup, ToggleGroupItem, Toolbar, @@ -125,15 +119,11 @@ export const ProjectToolbar = (props: Props) => { function getProjectToolbar() { return (<Toolbar id="toolbar-group-types"> <ToolbarContent> - <Flex className="toolbar" direction={{default: "row"}} alignItems={{default: "alignItemsCenter"}}> - {isRunnable() && <DevModeToolbar/>} - </Flex> + {isRunnable() && <DevModeToolbar/>} </ToolbarContent> </Toolbar>) } - - function isKameletsProject(): boolean { return project.projectId === 'kamelets'; } diff --git a/karavan-cloud/karavan-app/src/main/webui/src/project/dashboard/DashboardTab.tsx b/karavan-cloud/karavan-app/src/main/webui/src/project/dashboard/DashboardTab.tsx index 0c065908..1831dd65 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/project/dashboard/DashboardTab.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/project/dashboard/DashboardTab.tsx @@ -36,7 +36,7 @@ export const DashboardTab = () => { useEffect(() => { const interval = setInterval(() => { onRefreshStatus(); - }, 2000); + }, 1000); return () => { clearInterval(interval) }; diff --git a/karavan-cloud/karavan-app/src/main/webui/src/project/dashboard/InfoPod.tsx b/karavan-cloud/karavan-app/src/main/webui/src/project/dashboard/InfoPod.tsx index af24bde5..5e544ac1 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/project/dashboard/InfoPod.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/project/dashboard/InfoPod.tsx @@ -21,21 +21,6 @@ interface Props { export const InfoPod = (props: Props) => { - function getPodInfo() { - const podStatus = props.podStatus; - return ( - <Label icon={getIcon()} color={getColor()}> - <Tooltip content={"Show log"}> - <Button variant="link" - onClick={e => - useLogStore.setState({showLog: true, type: 'container', podName: podStatus.name})}> - {podStatus.name} - </Button> - </Tooltip> - </Label> - ) - } - function getPodInfoLabel(info: string) { return ( <Label icon={getIcon()} color={getColor()}> @@ -62,7 +47,7 @@ export const InfoPod = (props: Props) => { <DescriptionListGroup> <DescriptionListTerm>Pod</DescriptionListTerm> <DescriptionListDescription> - {getPodInfo()} + {getPodInfoLabel(podStatus.name)} </DescriptionListDescription> </DescriptionListGroup> <DescriptionListGroup> diff --git a/karavan-cloud/karavan-app/src/main/webui/src/project/trace/TraceTab.tsx b/karavan-cloud/karavan-app/src/main/webui/src/project/trace/TraceTab.tsx index aa076f81..f10bf0ab 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/project/trace/TraceTab.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/project/trace/TraceTab.tsx @@ -57,7 +57,7 @@ export const TraceTab = () => { if (refreshTrace) { KaravanApi.getDevModeStatus(projectId, "trace", res => { if (res.status === 200) { - setTrace(res.data); + setTrace(JSON.parse(res.data.status)); } else { setTrace({}); }