You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@camel.apache.org by ma...@apache.org on 2022/10/28 23:11:55 UTC

[camel-karavan] branch main updated (0ea8ff1 -> 99f93b6)

This is an automated email from the ASF dual-hosted git repository.

marat pushed a change to branch main
in repository https://gitbox.apache.org/repos/asf/camel-karavan.git


    from 0ea8ff1  Fix pipeline name
     new 9c41df0  Filter by environment
     new 99f93b6  Add Swagger UI for testing

The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 .../src/main/resources/application.properties      |  2 +
 .../main/webapp/src/dashboard/DashboardPage.tsx    | 56 +++++++++++++++-------
 .../src/main/webapp/src/projects/ProjectInfo.tsx   |  1 -
 .../src/main/webapp/src/projects/ProjectPage.tsx   |  4 +-
 4 files changed, 43 insertions(+), 20 deletions(-)


[camel-karavan] 01/02: Filter by environment

Posted by ma...@apache.org.
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 9c41df05bce28e3f743ee7e680a067f4b1356f04
Author: Marat Gubaidullin <ma...@gmail.com>
AuthorDate: Fri Oct 28 19:10:09 2022 -0400

    Filter by environment
---
 .../main/webapp/src/dashboard/DashboardPage.tsx    | 56 +++++++++++++++-------
 .../src/main/webapp/src/projects/ProjectInfo.tsx   |  1 -
 .../src/main/webapp/src/projects/ProjectPage.tsx   |  4 +-
 3 files changed, 41 insertions(+), 20 deletions(-)

diff --git a/karavan-app/src/main/webapp/src/dashboard/DashboardPage.tsx b/karavan-app/src/main/webapp/src/dashboard/DashboardPage.tsx
index 3488bec..a682fd0 100644
--- a/karavan-app/src/main/webapp/src/dashboard/DashboardPage.tsx
+++ b/karavan-app/src/main/webapp/src/dashboard/DashboardPage.tsx
@@ -7,7 +7,7 @@ import {
     PageSection,
     Text,
     TextContent,
-    TextInput,
+    TextInput, ToggleGroup, ToggleGroupItem,
     Toolbar,
     ToolbarContent,
     ToolbarItem, Tooltip
@@ -22,7 +22,6 @@ import {KaravanApi} from "../api/KaravanApi";
 import Icon from "../Logo";
 import UpIcon from "@patternfly/react-icons/dist/esm/icons/check-circle-icon";
 import DownIcon from "@patternfly/react-icons/dist/esm/icons/error-circle-o-icon";
-import QuestionIcon from "@patternfly/react-icons/dist/esm/icons/outlined-question-circle-icon";
 
 interface Props {
     config: any,
@@ -43,6 +42,7 @@ interface State {
     name: string,
     description: string,
     projectId: string,
+    selectedEnv: string[]
 }
 
 export class DashboardPage extends React.Component<Props, State> {
@@ -58,6 +58,7 @@ export class DashboardPage extends React.Component<Props, State> {
         name: '',
         description: '',
         projectId: '',
+        selectedEnv: this.getEnvironments()
     };
     interval: any;
 
@@ -81,17 +82,36 @@ export class DashboardPage extends React.Component<Props, State> {
                 this.setState({serviceStatuses: statuses});
             });
         });
+    }
 
+    selectEnvironment(name: string, selected: boolean) {
+        if (selected && !this.state.selectedEnv.includes(name)) {
+            this.setState((state) => {
+                state.selectedEnv.push(name);
+                return state;
+            })
+        } else if (!selected && this.state.selectedEnv.includes(name)) {
+            this.setState((prevState) => ({
+                selectedEnv: prevState.selectedEnv.filter(e => e !== name)
+            }));
+        }
     }
 
     tools = () => (<Toolbar id="toolbar-group-types">
         <ToolbarContent>
             <ToolbarItem>
-                <Button variant="link" icon={<RefreshIcon/>} onClick={e => this.onGetProjects()}/>
+                <ToggleGroup aria-label="Default with single selectable">
+                    {this.getEnvironments().map(env => (
+                        <ToggleGroupItem text={env} buttonId={env} isSelected={this.state.selectedEnv.includes(env)} onChange={selected => this.selectEnvironment(env, selected)}/>
+                    ))}
+                </ToggleGroup>
             </ToolbarItem>
+            {/*<ToolbarItem>*/}
+            {/*    <Button variant="link" icon={<RefreshIcon/>} onClick={e => this.onGetProjects()}/>*/}
+            {/*</ToolbarItem>*/}
             <ToolbarItem>
                 <TextInput className="text-field" type="search" id="search" name="search"
-                           autoComplete="off" placeholder="Search by name"
+                           autoComplete="off" placeholder="Search deployment by name"
                            value={this.state.filter}
                            onChange={e => this.setState({filter: e})}/>
             </ToolbarItem>
@@ -102,13 +122,17 @@ export class DashboardPage extends React.Component<Props, State> {
         <Text component="h1">Dashboard</Text>
     </TextContent>);
 
-    getEnvironments(): string []{
+    getEnvironments(): string [] {
         return this.props.config.environments && Array.isArray(this.props.config.environments) ? Array.from(this.props.config.environments) : [];
     }
 
+    getSelectedEnvironments(): string [] {
+        return this.getEnvironments().filter(e => this.state.selectedEnv.includes(e));
+    }
+
     getDeploymentEnvironments(name: string): [string, boolean] [] {
         const deps = this.state.deploymentStatuses;
-        return this.getEnvironments().map(e => {
+        return this.getSelectedEnvironments().map(e => {
             const env: string = e as string;
             const dep = deps.find(d => d.name === name && d.env === env);
             const deployed: boolean = dep !== undefined && dep.replicas > 0 && dep.replicas === dep.readyReplicas;
@@ -118,7 +142,7 @@ export class DashboardPage extends React.Component<Props, State> {
 
     getDeploymentByEnvironments(name: string): [string, DeploymentStatus | undefined] [] {
         const deps = this.state.deploymentStatuses;
-        return this.getEnvironments().map(e => {
+        return this.getSelectedEnvironments().map(e => {
             const env: string = e as string;
             const dep = deps.find(d => d.name === name && d.env === env);
             return [env, dep];
@@ -127,7 +151,7 @@ export class DashboardPage extends React.Component<Props, State> {
 
     getServiceByEnvironments(name: string): [string, ServiceStatus | undefined] [] {
         const services = this.state.serviceStatuses;
-        return this.getEnvironments().map(e => {
+        return this.getSelectedEnvironments().map(e => {
             const env: string = e as string;
             const service = services.find(d => d.name === name && d.env === env);
             return [env, service];
@@ -170,7 +194,7 @@ export class DashboardPage extends React.Component<Props, State> {
                 <Tooltip content={"No information"} position={"right"}>
                     <Label color={"grey"}>???</Label>
                 </Tooltip>
-                    );
+            );
         }
     }
 
@@ -199,27 +223,27 @@ export class DashboardPage extends React.Component<Props, State> {
                         <Tbody>
                             {deployments.map(deployment => (
                                 <Tr key={deployment}>
-                                    <Td  style={{verticalAlign:"middle"}}>
+                                    <Td style={{verticalAlign: "middle"}}>
                                         {this.isKaravan(deployment) ? Icon("icon") : CamelUi.getIconFromSource(camelIcon)}
                                     </Td>
-                                    <Td  style={{ verticalAlign:"middle"}}>
+                                    <Td style={{verticalAlign: "middle"}}>
                                         <Button style={{padding: '6px'}} variant={"link"}>{deployment}</Button>
                                     </Td>
-                                    <Td  style={{verticalAlign:"middle"}}>
+                                    <Td style={{verticalAlign: "middle"}}>
                                         <HelperText>
                                             <HelperTextItem>{this.getProject(deployment)?.name || ""}</HelperTextItem>
                                             <HelperTextItem>{this.getProject(deployment)?.description || "Camel project"}</HelperTextItem>
                                         </HelperText>
                                     </Td>
-                                    <Td  >
+                                    <Td>
                                         <Flex direction={{default: "column"}}>
                                             {this.getDeploymentEnvironments(deployment).map(value => (
                                                 <FlexItem className="badge-flex-item" key={value[0]}><Badge className="badge"
-                                                    isRead={!value[1]}>{value[0]}</Badge></FlexItem>
+                                                                                                            isRead={!value[1]}>{value[0]}</Badge></FlexItem>
                                             ))}
                                         </Flex>
                                     </Td>
-                                    <Td >
+                                    <Td>
                                         <Flex direction={{default: "column"}}>
                                             {this.getDeploymentByEnvironments(deployment).map(value => (
                                                 <FlexItem className="badge-flex-item" key={value[0]}>
@@ -230,7 +254,7 @@ export class DashboardPage extends React.Component<Props, State> {
                                             ))}
                                         </Flex>
                                     </Td>
-                                    <Td >
+                                    <Td>
                                         <Flex direction={{default: "column"}}>
                                             {this.getDeploymentByEnvironments(deployment).map(value => (
                                                 <FlexItem className="badge-flex-item" key={value[0]}>{this.getReplicasPanel(value[1])}</FlexItem>
diff --git a/karavan-app/src/main/webapp/src/projects/ProjectInfo.tsx b/karavan-app/src/main/webapp/src/projects/ProjectInfo.tsx
index d8e25fd..132d4dc 100644
--- a/karavan-app/src/main/webapp/src/projects/ProjectInfo.tsx
+++ b/karavan-app/src/main/webapp/src/projects/ProjectInfo.tsx
@@ -115,7 +115,6 @@ export class ProjectInfo extends React.Component<Props, State> {
     build = () => {
         this.setState({isBuilding: true});
         KaravanApi.pipelineRun(this.props.project, this.state.environment, res => {
-            console.log(res)
             if (res.status === 200 || res.status === 201) {
                 this.setState({isBuilding: false});
                 this.onRefresh();
diff --git a/karavan-app/src/main/webapp/src/projects/ProjectPage.tsx b/karavan-app/src/main/webapp/src/projects/ProjectPage.tsx
index cc3a708..643b9fc 100644
--- a/karavan-app/src/main/webapp/src/projects/ProjectPage.tsx
+++ b/karavan-app/src/main/webapp/src/projects/ProjectPage.tsx
@@ -98,9 +98,7 @@ export class ProjectPage extends React.Component<Props, State> {
                 })
             });
             KaravanApi.getFiles(this.props.project.projectId, (files: []) => {
-                this.setState({
-                    files: files
-                })
+                this.setState({files: files})
             });
             KubernetesAPI.inKubernetes = true;
             KaravanApi.getConfigMaps(this.state.environment, (any: []) => {


[camel-karavan] 02/02: Add Swagger UI for testing

Posted by ma...@apache.org.
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 99f93b6db9a8b4669e06fa2d1cb9a2adc9743b48
Author: Marat Gubaidullin <ma...@gmail.com>
AuthorDate: Fri Oct 28 19:11:48 2022 -0400

    Add Swagger UI for testing
---
 karavan-app/src/main/resources/application.properties | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/karavan-app/src/main/resources/application.properties b/karavan-app/src/main/resources/application.properties
index 3bae5dc..0e1b568 100644
--- a/karavan-app/src/main/resources/application.properties
+++ b/karavan-app/src/main/resources/application.properties
@@ -95,3 +95,5 @@ quarkus.container-image.builder=docker
 
 quarkus.kubernetes-client.connection-timeout=2000
 quarkus.kubernetes-client.request-timeout=10000
+
+quarkus.swagger-ui.always-include=true
\ No newline at end of file