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 bef05933c33672a6040fe2181255a7ca2a5c5e7a Author: Marat Gubaidullin <marat.gubaidul...@gmail.com> AuthorDate: Thu Jul 13 12:54:53 2023 -0400 Infrastructure definition #817 --- .../camel/karavan/api/ConfigurationResource.java | 2 +- ...esResource.java => InfrastructureResource.java} | 36 ++++++++++++++-------- .../karavan-app/src/main/webui/src/Main.tsx | 8 +++-- .../src/main/webui/src/api/KaravanApi.tsx | 34 ++++++++++---------- .../src/main/webui/src/api/ProjectModels.ts | 2 +- .../src/main/webui/src/api/ProjectService.ts | 24 ++++++--------- .../webui/src/designer/beans/BeanProperties.tsx | 13 +++++--- .../route/property/ComponentParameterField.tsx | 16 +++++----- .../designer/route/property/DslPropertyField.tsx | 17 +++++----- .../route/property/InfrastructureSelector.tsx | 16 +++++----- .../route/property/KameletPropertyField.tsx | 17 +++++----- .../designer/route/property/KubernetesSelector.tsx | 8 ++--- .../{KubernetesAPI.ts => InfrastructureAPI.ts} | 4 +-- .../src/designer/beans/BeanProperties.tsx | 13 +++++--- .../route/property/ComponentParameterField.tsx | 16 +++++----- .../designer/route/property/DslPropertyField.tsx | 17 +++++----- .../route/property/InfrastructureSelector.tsx | 16 +++++----- .../route/property/KameletPropertyField.tsx | 17 +++++----- .../{KubernetesAPI.ts => InfrastructureAPI.ts} | 4 +-- 19 files changed, 154 insertions(+), 126 deletions(-) diff --git a/karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/ConfigurationResource.java b/karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/ConfigurationResource.java index 486e8fba..3bd0f2de 100644 --- a/karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/ConfigurationResource.java +++ b/karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/ConfigurationResource.java @@ -57,7 +57,7 @@ public class ConfigurationResource { return Response.ok( Map.of( "version", version, - "inKubernetes", kubernetesService.inKubernetes(), + "infrastructure", kubernetesService.inKubernetes() ? "kubernetes" : "docker", "environment", environment, "environments", datagridService.getEnvironments().stream() .map(e -> e.getName()) diff --git a/karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/KubernetesResource.java b/karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/InfrastructureResource.java similarity index 87% rename from karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/KubernetesResource.java rename to karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/InfrastructureResource.java index 6ff1020e..d2749563 100644 --- a/karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/KubernetesResource.java +++ b/karavan-cloud/karavan-app/src/main/java/org/apache/camel/karavan/api/InfrastructureResource.java @@ -36,8 +36,8 @@ import java.util.Comparator; import java.util.List; import java.util.stream.Collectors; -@Path("/api/kubernetes") -public class KubernetesResource { +@Path("/api/infrastructure") +public class InfrastructureResource { @Inject EventBus eventBus; @@ -51,7 +51,7 @@ public class KubernetesResource { @ConfigProperty(name = "karavan.environment") String environment; - private static final Logger LOGGER = Logger.getLogger(KubernetesResource.class.getName()); + private static final Logger LOGGER = Logger.getLogger(InfrastructureResource.class.getName()); @POST @Produces(MediaType.APPLICATION_JSON) @@ -176,23 +176,35 @@ public class KubernetesResource { @GET @Produces(MediaType.APPLICATION_JSON) - @Path("/configmap/{env}") - public Response getConfigMaps(@PathParam("env") String env) throws Exception { - return Response.ok(kubernetesService.getConfigMaps(kubernetesService.getNamespace())).build(); + @Path("/configmaps") + public Response getConfigMaps() throws Exception { + if (kubernetesService.inKubernetes()) { + return Response.ok(kubernetesService.getConfigMaps(kubernetesService.getNamespace())).build(); + } else { + return Response.ok(List.of()).build(); + } } @GET @Produces(MediaType.APPLICATION_JSON) - @Path("/secret/{env}") - public Response getSecrets(@PathParam("env") String env) throws Exception { - return Response.ok(kubernetesService.getSecrets(kubernetesService.getNamespace())).build(); + @Path("/secrets") + public Response getSecrets() throws Exception { + if (kubernetesService.inKubernetes()) { + return Response.ok(kubernetesService.getSecrets(kubernetesService.getNamespace())).build(); + } else { + return Response.ok(List.of()).build(); + } } @GET @Produces(MediaType.APPLICATION_JSON) - @Path("/service/{env}") - public Response getServices(@PathParam("env") String env) throws Exception { - return Response.ok(kubernetesService.getServices(kubernetesService.getNamespace())).build(); + @Path("/services") + public Response getServices() throws Exception { + if (kubernetesService.inKubernetes()) { + return Response.ok(kubernetesService.getServices(kubernetesService.getNamespace())).build(); + } else { + return Response.ok(List.of()).build(); + } } // TODO: implement log watch 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 cf61f783..a2de26fa 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/Main.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/Main.tsx @@ -28,10 +28,11 @@ import {MainLogin} from "./MainLogin"; import {DashboardPage} from "./dashboard/DashboardPage"; import {Subscription} from "rxjs"; import {ProjectEventBus} from "./api/ProjectEventBus"; -import {PodStatus, Project, ToastMessage} from "./api/ProjectModels"; +import {AppConfig, PodStatus, Project, ToastMessage} from "./api/ProjectModels"; import {ProjectPage} from "./project/ProjectPage"; import {useAppConfigStore, useDevModeStore, useFileStore, useProjectStore} from "./api/ProjectStore"; import {Notification} from "./Notification"; +import {InfrastructureAPI} from "./designer/utils/InfrastructureAPI"; class MenuItem { pageId: string = ''; @@ -111,9 +112,10 @@ export class Main extends React.Component<Props, State> { } getData() { - KaravanApi.getConfiguration((config: any) => { + KaravanApi.getConfiguration((config: AppConfig) => { this.setState({config: config, request: uuidv4()}); - useAppConfigStore.setState({config: config}) + useAppConfigStore.setState({config: config}); + InfrastructureAPI.infrastructure = config.infrastructure; }); this.updateKamelets(); this.updateComponents(); diff --git a/karavan-cloud/karavan-app/src/main/webui/src/api/KaravanApi.tsx b/karavan-cloud/karavan-app/src/main/webui/src/api/KaravanApi.tsx index f1549a3a..747808e1 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/api/KaravanApi.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/api/KaravanApi.tsx @@ -349,7 +349,7 @@ export class KaravanApi { } static async pipelineRun(project: Project, environment: string, after: (res: AxiosResponse<any>) => void) { - instance.post('/api/kubernetes/pipeline/' + environment, project) + instance.post('/api/infrastructure/pipeline/' + environment, project) .then(res => { after(res); }).catch(err => { @@ -358,7 +358,7 @@ export class KaravanApi { } static async getPipelineLog(environment: string, pipelineRunName: string, after: (res: AxiosResponse<any>) => void) { - instance.get('/api/kubernetes/pipeline/log/' + environment + "/" + pipelineRunName) + instance.get('/api/infrastructure/pipeline/log/' + environment + "/" + pipelineRunName) .then(res => { if (res.status === 200) { after(res.data); @@ -369,7 +369,7 @@ export class KaravanApi { } static async stopPipelineRun(environment: string, pipelineRunName: string, after: (res: AxiosResponse<any>) => void) { - instance.delete('/api/kubernetes/pipelinerun/' + environment + "/" + pipelineRunName) + instance.delete('/api/infrastructure/pipelinerun/' + environment + "/" + pipelineRunName) .then(res => { if (res.status === 200) { after(res.data); @@ -380,7 +380,7 @@ export class KaravanApi { } static async getContainerLog(environment: string, name: string, after: (res: AxiosResponse<string>) => void) { - instance.get('/api/kubernetes/container/log/' + environment + "/" + name) + instance.get('/api/infrastructure/container/log/' + environment + "/" + name) .then(res => { if (res.status === 200) { after(res.data); @@ -391,7 +391,7 @@ export class KaravanApi { } static async getAllServiceStatuses(after: (statuses: ServiceStatus[]) => void) { - instance.get('/api/kubernetes/service') + instance.get('/api/infrastructure/service') .then(res => { if (res.status === 200) { after(res.data); @@ -402,7 +402,7 @@ export class KaravanApi { } static async getAllDeploymentStatuses(after: (statuses: DeploymentStatus[]) => void) { - instance.get('/api/kubernetes/deployment') + instance.get('/api/infrastructure/deployment') .then(res => { if (res.status === 200) { after(res.data); @@ -413,7 +413,7 @@ export class KaravanApi { } static async getDeploymentStatuses(env: string, after: (statuses: DeploymentStatus[]) => void) { - instance.get('/api/kubernetes/deployment/' + env) + instance.get('/api/infrastructure/deployment/' + env) .then(res => { if (res.status === 200) { after(res.data); @@ -424,7 +424,7 @@ export class KaravanApi { } static async rolloutDeployment(name: string, environment: string, after: (res: AxiosResponse<any>) => void) { - instance.post('/api/kubernetes/deployment/rollout/' + environment + '/' + name, "") + instance.post('/api/infrastructure/deployment/rollout/' + environment + '/' + name, "") .then(res => { after(res); }).catch(err => { @@ -433,7 +433,7 @@ export class KaravanApi { } static async deleteDeployment(environment: string, name: string, after: (res: AxiosResponse<any>) => void) { - instance.delete('/api/kubernetes/deployment/' + environment + '/' + name) + instance.delete('/api/infrastructure/deployment/' + environment + '/' + name) .then(res => { after(res); }).catch(err => { @@ -442,7 +442,7 @@ export class KaravanApi { } static async getProjectPodStatuses(project: string, env: string, after: (statuses: PodStatus[]) => void) { - instance.get('/api/kubernetes/pod/' + project + "/" + env) + instance.get('/api/infrastructure/pod/' + project + "/" + env) .then(res => { if (res.status === 200) { after(res.data); @@ -453,7 +453,7 @@ export class KaravanApi { } static async deletePod(environment: string, name: string, after: (res: AxiosResponse<any>) => void) { - instance.delete('/api/kubernetes/pod/' + environment + '/' + name) + instance.delete('/api/infrastructure/pod/' + environment + '/' + name) .then(res => { after(res); }).catch(err => { @@ -461,8 +461,8 @@ export class KaravanApi { }); } - static async getConfigMaps(environment: string, after: (any: []) => void) { - instance.get('/api/kubernetes/configmap/' + environment) + static async getConfigMaps(after: (any: []) => void) { + instance.get('/api/infrastructure/configmaps/') .then(res => { if (res.status === 200) { after(res.data); @@ -472,8 +472,8 @@ export class KaravanApi { }); } - static async getSecrets(environment: string, after: (any: []) => void) { - instance.get('/api/kubernetes/secret/' + environment) + static async getSecrets(after: (any: []) => void) { + instance.get('/api/infrastructure/secrets') .then(res => { if (res.status === 200) { after(res.data); @@ -483,8 +483,8 @@ export class KaravanApi { }); } - static async getServices(environment: string, after: (any: []) => void) { - instance.get('/api/kubernetes/service/' + environment) + static async getServices(after: (any: []) => void) { + instance.get('/api/infrastructure/services') .then(res => { if (res.status === 200) { after(res.data); diff --git a/karavan-cloud/karavan-app/src/main/webui/src/api/ProjectModels.ts b/karavan-cloud/karavan-app/src/main/webui/src/api/ProjectModels.ts index 66ebe79b..8f54d1e2 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/api/ProjectModels.ts +++ b/karavan-cloud/karavan-app/src/main/webui/src/api/ProjectModels.ts @@ -2,7 +2,7 @@ import {v4 as uuidv4} from "uuid"; export class AppConfig { version: string = ''; - inKubernetes: boolean = true; + infrastructure: 'kubernetes' | 'docker' | 'local' = 'local'; environment: string = ''; environments: string[] = []; runtime: string = ''; diff --git a/karavan-cloud/karavan-app/src/main/webui/src/api/ProjectService.ts b/karavan-cloud/karavan-app/src/main/webui/src/api/ProjectService.ts index d3a60eb2..dba7ffd8 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/api/ProjectService.ts +++ b/karavan-cloud/karavan-app/src/main/webui/src/api/ProjectService.ts @@ -1,7 +1,7 @@ import {KaravanApi} from "./KaravanApi"; import {DeploymentStatus, PodStatus, Project, ProjectFile, ToastMessage} from "./ProjectModels"; import {TemplateApi} from "karavan-core/lib/api/TemplateApi"; -import {KubernetesAPI} from "../designer/utils/KubernetesAPI"; +import {InfrastructureAPI} from "../designer/utils/InfrastructureAPI"; import {unstable_batchedUpdates} from 'react-dom' import { useAppConfigStore, @@ -174,7 +174,6 @@ export class ProjectService { public static refreshProjectData() { const project = useProjectStore.getState().project; - const environment = useAppConfigStore.getState().config.environment; KaravanApi.getProject(project.projectId, (project: Project) => { // ProjectEventBus.selectProject(project); KaravanApi.getTemplatesFiles((files: ProjectFile[]) => { @@ -190,17 +189,14 @@ export class ProjectService { useFilesStore.setState({files: files}); }); - KubernetesAPI.inKubernetes = true; - if (environment) { - KaravanApi.getConfigMaps(environment, (any: []) => { - KubernetesAPI.setConfigMaps(any); - }); - KaravanApi.getSecrets(environment, (any: []) => { - KubernetesAPI.setSecrets(any); - }); - KaravanApi.getServices(environment, (any: []) => { - KubernetesAPI.setServices(any); - }); - } + KaravanApi.getConfigMaps((any: []) => { + InfrastructureAPI.setConfigMaps(any); + }); + KaravanApi.getSecrets((any: []) => { + InfrastructureAPI.setSecrets(any); + }); + KaravanApi.getServices((any: []) => { + InfrastructureAPI.setServices(any); + }); } } \ No newline at end of file diff --git a/karavan-cloud/karavan-app/src/main/webui/src/designer/beans/BeanProperties.tsx b/karavan-cloud/karavan-app/src/main/webui/src/designer/beans/BeanProperties.tsx index 78f475f4..b7ab5532 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/designer/beans/BeanProperties.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/designer/beans/BeanProperties.tsx @@ -34,11 +34,12 @@ import AddIcon from "@patternfly/react-icons/dist/js/icons/plus-circle-icon"; import {IntegrationHeader} from "../utils/KaravanComponents"; import CloneIcon from '@patternfly/react-icons/dist/esm/icons/clone-icon' import HelpIcon from "@patternfly/react-icons/dist/js/icons/help-icon"; -import {KubernetesSelector} from "../route/property/KubernetesSelector"; +import {InfrastructureSelector} from "../route/property/InfrastructureSelector"; import KubernetesIcon from "@patternfly/react-icons/dist/js/icons/openshift-icon"; -import {KubernetesAPI} from "../utils/KubernetesAPI"; +import {InfrastructureAPI} from "../utils/InfrastructureAPI"; import ShowIcon from "@patternfly/react-icons/dist/js/icons/eye-icon"; import HideIcon from "@patternfly/react-icons/dist/js/icons/eye-slash-icon"; +import DockerIcon from "@patternfly/react-icons/dist/js/icons/docker-icon"; interface Props { @@ -137,7 +138,7 @@ export class BeanProperties extends React.Component<Props, State> { getKubernetesSelectorModal() { return ( - <KubernetesSelector + <InfrastructureSelector dark={false} isOpen={this.state.showKubernetesSelector} onClose={() => this.closeKubernetesSelector()} @@ -199,15 +200,17 @@ export class BeanProperties extends React.Component<Props, State> { const value = v[1][1]; const showPassword = v[1][2]; const isSecret = key !== undefined && SensitiveKeys.includes(key.toLowerCase()); + const inInfrastructure = InfrastructureAPI.infrastructure !== 'local'; + const icon = InfrastructureAPI.infrastructure === 'kubernetes' ? <KubernetesIcon/> : <DockerIcon/> return ( <div key={"key-" + i} className="bean-property"> <TextInput placeholder="Bean Field Name" className="text-field" isRequired type="text" id="key" name="key" value={key} onChange={e => this.propertyChanged(i, e, value, showPassword)}/> <InputGroup> - {KubernetesAPI.inKubernetes && + {inInfrastructure && <Tooltip position="bottom-end" content="Select value from Kubernetes"> <Button variant="control" onClick={e => this.openKubernetesSelector(i, key)}> - <KubernetesIcon/> + {icon} </Button> </Tooltip>} <TextInput diff --git a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/ComponentParameterField.tsx b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/ComponentParameterField.tsx index e9c6d02f..39817f7c 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/ComponentParameterField.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/ComponentParameterField.tsx @@ -34,9 +34,10 @@ import {CamelElement, Integration} from "karavan-core/lib/model/IntegrationDefin import {ToDefinition} from "karavan-core/lib/model/CamelDefinition"; import CompressIcon from "@patternfly/react-icons/dist/js/icons/compress-icon"; import ExpandIcon from "@patternfly/react-icons/dist/js/icons/expand-icon"; -import {KubernetesSelector} from "./KubernetesSelector"; -import {KubernetesAPI} from "../../utils/KubernetesAPI"; +import {InfrastructureSelector} from "./InfrastructureSelector"; +import {InfrastructureAPI} from "../../utils/InfrastructureAPI"; import KubernetesIcon from "@patternfly/react-icons/dist/js/icons/openshift-icon"; +import DockerIcon from "@patternfly/react-icons/dist/js/icons/docker-icon"; import ShowIcon from "@patternfly/react-icons/dist/js/icons/eye-icon"; import HideIcon from "@patternfly/react-icons/dist/js/icons/eye-slash-icon"; import PlusIcon from "@patternfly/react-icons/dist/esm/icons/plus-icon"; @@ -206,7 +207,7 @@ export class ComponentParameterField extends React.Component<Props, State> { getKubernetesSelectorModal() { return ( - <KubernetesSelector + <InfrastructureSelector dark={false} isOpen={this.state.showKubernetesSelector} onClose={() => this.closeKubernetesSelector()} @@ -215,13 +216,14 @@ export class ComponentParameterField extends React.Component<Props, State> { getStringInput(property: ComponentProperty, value: any) { const {showEditor, showPassword} = this.state; - const inKubernetes = KubernetesAPI.inKubernetes; - const noKubeSelectorButton = ["uri", "id", "description", "group"].includes(property.name); + const inInfrastructure = InfrastructureAPI.infrastructure !== 'local'; + const noInfraSelectorButton = ["uri", "id", "description", "group"].includes(property.name); + const icon = InfrastructureAPI.infrastructure === 'kubernetes' ? <KubernetesIcon/> : <DockerIcon/> return <InputGroup> - {inKubernetes && !showEditor && !noKubeSelectorButton && + {inInfrastructure && !showEditor && !noInfraSelectorButton && <Tooltip position="bottom-end" content="Select from Kubernetes"> <Button variant="control" onClick={e => this.openKubernetesSelector(property.name)}> - <KubernetesIcon/> + {icon} </Button> </Tooltip>} {(!showEditor || property.secret) && diff --git a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/DslPropertyField.tsx b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/DslPropertyField.tsx index fb81df12..e11ee485 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/DslPropertyField.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/DslPropertyField.tsx @@ -60,13 +60,13 @@ import {ComponentProperty} from "karavan-core/lib/model/ComponentModels"; import CompressIcon from "@patternfly/react-icons/dist/js/icons/compress-icon"; import ExpandIcon from "@patternfly/react-icons/dist/js/icons/expand-icon"; import KubernetesIcon from "@patternfly/react-icons/dist/js/icons/openshift-icon"; -import {KubernetesSelector} from "./KubernetesSelector"; -import {KubernetesAPI} from "../../utils/KubernetesAPI"; +import {InfrastructureSelector} from "./InfrastructureSelector"; +import {InfrastructureAPI} from "../../utils/InfrastructureAPI"; import EditorIcon from "@patternfly/react-icons/dist/js/icons/code-icon"; import {TemplateApi} from "karavan-core/lib/api/TemplateApi"; import {ModalEditor} from "./ModalEditor"; import {KaravanInstance} from "../../KaravanDesigner"; -import {ComponentApi} from "karavan-core/lib/api/ComponentApi"; +import DockerIcon from "@patternfly/react-icons/dist/js/icons/docker-icon"; interface Props { property: PropertyMeta, @@ -204,7 +204,7 @@ export class DslPropertyField extends React.Component<Props, State> { getKubernetesSelectorModal() { return ( - <KubernetesSelector + <InfrastructureSelector dark={false} isOpen={this.state.showKubernetesSelector} onClose={() => this.closeKubernetesSelector()} @@ -213,13 +213,14 @@ export class DslPropertyField extends React.Component<Props, State> { getStringInput = (property: PropertyMeta, value: any) => { const showEditor = this.state.showEditor; - const inKubernetes = KubernetesAPI.inKubernetes; - const noKubeSelectorButton = ["uri", "id", "description", "group"].includes(property.name); + const inInfrastructure = InfrastructureAPI.infrastructure !== 'local'; + const noInfraSelectorButton = ["uri", "id", "description", "group"].includes(property.name); + const icon = InfrastructureAPI.infrastructure === 'kubernetes' ? <KubernetesIcon/> : <DockerIcon/> return (<InputGroup> - {inKubernetes && !showEditor && !noKubeSelectorButton && + {inInfrastructure && !showEditor && !noInfraSelectorButton && <Tooltip position="bottom-end" content="Select from Kubernetes"> <Button variant="control" onClick={e => this.openKubernetesSelector(property.name)}> - <KubernetesIcon/> + {icon} </Button> </Tooltip>} {(!showEditor || property.secret) && <TextInput diff --git a/karavan-designer/src/designer/route/property/KubernetesSelector.tsx b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/InfrastructureSelector.tsx similarity index 95% rename from karavan-designer/src/designer/route/property/KubernetesSelector.tsx rename to karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/InfrastructureSelector.tsx index a6091575..04c8d43a 100644 --- a/karavan-designer/src/designer/route/property/KubernetesSelector.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/InfrastructureSelector.tsx @@ -17,13 +17,13 @@ import React from 'react'; import { Badge, - Button, Flex, FlexItem, + Button, capitalize, Flex, FlexItem, Form, FormGroup, Modal, PageSection, Tab, Tabs, TabTitleText, TextInput, } from '@patternfly/react-core'; import '../../karavan.css'; import {TableComposable, Tbody, Td, Th, Thead, Tr} from "@patternfly/react-table"; -import {KubernetesAPI} from "../../utils/KubernetesAPI"; +import {InfrastructureAPI} from "../../utils/InfrastructureAPI"; interface Props { onSelect: (value: string) => void, @@ -40,13 +40,13 @@ interface State { services: string[] } -export class KubernetesSelector extends React.Component<Props, State> { +export class InfrastructureSelector extends React.Component<Props, State> { public state: State = { tabIndex: "configMap", - configMaps: KubernetesAPI.configMaps, - secrets: KubernetesAPI.secrets, - services: KubernetesAPI.services + configMaps: InfrastructureAPI.configMaps, + secrets: InfrastructureAPI.secrets, + services: InfrastructureAPI.services }; selectTab = (evt: React.MouseEvent<HTMLElement, MouseEvent>, eventKey: string | number) => { @@ -210,7 +210,7 @@ export class KubernetesSelector extends React.Component<Props, State> { const tabIndex = this.state.tabIndex; return ( <Modal - aria-label="Select from Kubernetes" + aria-label="Select from Infrastructure" width={'50%'} className='dsl-modal' isOpen={this.props.isOpen} @@ -218,7 +218,7 @@ export class KubernetesSelector extends React.Component<Props, State> { header={ <Flex direction={{default: "column"}}> <FlexItem> - <h3>{"Select from Kubernetes"}</h3> + <h3>{"Select from " + capitalize(InfrastructureAPI.infrastructure)}</h3> {this.searchInput()} </FlexItem> <FlexItem> diff --git a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KameletPropertyField.tsx b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KameletPropertyField.tsx index cda5ac3f..8beed690 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KameletPropertyField.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KameletPropertyField.tsx @@ -27,11 +27,12 @@ import HelpIcon from "@patternfly/react-icons/dist/js/icons/help-icon"; import ExpandIcon from "@patternfly/react-icons/dist/js/icons/expand-icon"; import CompressIcon from "@patternfly/react-icons/dist/js/icons/compress-icon"; import {Property} from "karavan-core/lib/model/KameletModels"; -import {KubernetesSelector} from "./KubernetesSelector"; -import {KubernetesAPI} from "../../utils/KubernetesAPI"; +import {InfrastructureSelector} from "./InfrastructureSelector"; +import {InfrastructureAPI} from "../../utils/InfrastructureAPI"; import KubernetesIcon from "@patternfly/react-icons/dist/js/icons/openshift-icon"; import ShowIcon from "@patternfly/react-icons/dist/js/icons/eye-icon"; import HideIcon from "@patternfly/react-icons/dist/js/icons/eye-slash-icon"; +import DockerIcon from "@patternfly/react-icons/dist/js/icons/docker-icon"; interface Props { property: Property, @@ -96,7 +97,7 @@ export class KameletPropertyField extends React.Component<Props, State> { getKubernetesSelectorModal() { return ( - <KubernetesSelector + <InfrastructureSelector dark={false} isOpen={this.state.showKubernetesSelector} onClose={() => this.closeKubernetesSelector()} @@ -108,13 +109,15 @@ export class KameletPropertyField extends React.Component<Props, State> { const {property, value} = this.props; const prefix = "parameters"; const id = prefix + "-" + property.id; - const noKubeSelectorButton = ["uri", "id", "description", "group"].includes(property.id); - const showKubeSelectorButton = KubernetesAPI.inKubernetes && !showEditor && !noKubeSelectorButton + const inInfrastructure = InfrastructureAPI.infrastructure !== 'local'; + const noInfraSelectorButton = ["uri", "id", "description", "group"].includes(property.id); + const icon = InfrastructureAPI.infrastructure === 'kubernetes' ? <KubernetesIcon/> : <DockerIcon/> + const showInfraSelectorButton = inInfrastructure && !showEditor && !noInfraSelectorButton return <InputGroup> - {showKubeSelectorButton && + {showInfraSelectorButton && <Tooltip position="bottom-end" content="Select from Kubernetes"> <Button variant="control" onClick={e => this.openKubernetesSelector(property.id)}> - <KubernetesIcon/> + {icon} </Button> </Tooltip>} {(!showEditor || property.format === "password") && diff --git a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KubernetesSelector.tsx b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KubernetesSelector.tsx index a6091575..b7997eda 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KubernetesSelector.tsx +++ b/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KubernetesSelector.tsx @@ -23,7 +23,7 @@ import { } from '@patternfly/react-core'; import '../../karavan.css'; import {TableComposable, Tbody, Td, Th, Thead, Tr} from "@patternfly/react-table"; -import {KubernetesAPI} from "../../utils/KubernetesAPI"; +import {InfrastructureAPI} from "../../utils/InfrastructureAPI"; interface Props { onSelect: (value: string) => void, @@ -44,9 +44,9 @@ export class KubernetesSelector extends React.Component<Props, State> { public state: State = { tabIndex: "configMap", - configMaps: KubernetesAPI.configMaps, - secrets: KubernetesAPI.secrets, - services: KubernetesAPI.services + configMaps: InfrastructureAPI.configMaps, + secrets: InfrastructureAPI.secrets, + services: InfrastructureAPI.services }; selectTab = (evt: React.MouseEvent<HTMLElement, MouseEvent>, eventKey: string | number) => { diff --git a/karavan-cloud/karavan-app/src/main/webui/src/designer/utils/KubernetesAPI.ts b/karavan-cloud/karavan-app/src/main/webui/src/designer/utils/InfrastructureAPI.ts similarity index 77% rename from karavan-cloud/karavan-app/src/main/webui/src/designer/utils/KubernetesAPI.ts rename to karavan-cloud/karavan-app/src/main/webui/src/designer/utils/InfrastructureAPI.ts index 5168bc3c..8b182dc1 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/designer/utils/KubernetesAPI.ts +++ b/karavan-cloud/karavan-app/src/main/webui/src/designer/utils/InfrastructureAPI.ts @@ -1,6 +1,6 @@ -export class KubernetesAPI { +export class InfrastructureAPI { - static inKubernetes: boolean = false; + static infrastructure: 'kubernetes' | 'docker' | 'local' = 'local'; static configMaps: string[] = []; static secrets: string[] = []; static services: string[] = []; diff --git a/karavan-designer/src/designer/beans/BeanProperties.tsx b/karavan-designer/src/designer/beans/BeanProperties.tsx index 78f475f4..b7ab5532 100644 --- a/karavan-designer/src/designer/beans/BeanProperties.tsx +++ b/karavan-designer/src/designer/beans/BeanProperties.tsx @@ -34,11 +34,12 @@ import AddIcon from "@patternfly/react-icons/dist/js/icons/plus-circle-icon"; import {IntegrationHeader} from "../utils/KaravanComponents"; import CloneIcon from '@patternfly/react-icons/dist/esm/icons/clone-icon' import HelpIcon from "@patternfly/react-icons/dist/js/icons/help-icon"; -import {KubernetesSelector} from "../route/property/KubernetesSelector"; +import {InfrastructureSelector} from "../route/property/InfrastructureSelector"; import KubernetesIcon from "@patternfly/react-icons/dist/js/icons/openshift-icon"; -import {KubernetesAPI} from "../utils/KubernetesAPI"; +import {InfrastructureAPI} from "../utils/InfrastructureAPI"; import ShowIcon from "@patternfly/react-icons/dist/js/icons/eye-icon"; import HideIcon from "@patternfly/react-icons/dist/js/icons/eye-slash-icon"; +import DockerIcon from "@patternfly/react-icons/dist/js/icons/docker-icon"; interface Props { @@ -137,7 +138,7 @@ export class BeanProperties extends React.Component<Props, State> { getKubernetesSelectorModal() { return ( - <KubernetesSelector + <InfrastructureSelector dark={false} isOpen={this.state.showKubernetesSelector} onClose={() => this.closeKubernetesSelector()} @@ -199,15 +200,17 @@ export class BeanProperties extends React.Component<Props, State> { const value = v[1][1]; const showPassword = v[1][2]; const isSecret = key !== undefined && SensitiveKeys.includes(key.toLowerCase()); + const inInfrastructure = InfrastructureAPI.infrastructure !== 'local'; + const icon = InfrastructureAPI.infrastructure === 'kubernetes' ? <KubernetesIcon/> : <DockerIcon/> return ( <div key={"key-" + i} className="bean-property"> <TextInput placeholder="Bean Field Name" className="text-field" isRequired type="text" id="key" name="key" value={key} onChange={e => this.propertyChanged(i, e, value, showPassword)}/> <InputGroup> - {KubernetesAPI.inKubernetes && + {inInfrastructure && <Tooltip position="bottom-end" content="Select value from Kubernetes"> <Button variant="control" onClick={e => this.openKubernetesSelector(i, key)}> - <KubernetesIcon/> + {icon} </Button> </Tooltip>} <TextInput diff --git a/karavan-designer/src/designer/route/property/ComponentParameterField.tsx b/karavan-designer/src/designer/route/property/ComponentParameterField.tsx index e9c6d02f..39817f7c 100644 --- a/karavan-designer/src/designer/route/property/ComponentParameterField.tsx +++ b/karavan-designer/src/designer/route/property/ComponentParameterField.tsx @@ -34,9 +34,10 @@ import {CamelElement, Integration} from "karavan-core/lib/model/IntegrationDefin import {ToDefinition} from "karavan-core/lib/model/CamelDefinition"; import CompressIcon from "@patternfly/react-icons/dist/js/icons/compress-icon"; import ExpandIcon from "@patternfly/react-icons/dist/js/icons/expand-icon"; -import {KubernetesSelector} from "./KubernetesSelector"; -import {KubernetesAPI} from "../../utils/KubernetesAPI"; +import {InfrastructureSelector} from "./InfrastructureSelector"; +import {InfrastructureAPI} from "../../utils/InfrastructureAPI"; import KubernetesIcon from "@patternfly/react-icons/dist/js/icons/openshift-icon"; +import DockerIcon from "@patternfly/react-icons/dist/js/icons/docker-icon"; import ShowIcon from "@patternfly/react-icons/dist/js/icons/eye-icon"; import HideIcon from "@patternfly/react-icons/dist/js/icons/eye-slash-icon"; import PlusIcon from "@patternfly/react-icons/dist/esm/icons/plus-icon"; @@ -206,7 +207,7 @@ export class ComponentParameterField extends React.Component<Props, State> { getKubernetesSelectorModal() { return ( - <KubernetesSelector + <InfrastructureSelector dark={false} isOpen={this.state.showKubernetesSelector} onClose={() => this.closeKubernetesSelector()} @@ -215,13 +216,14 @@ export class ComponentParameterField extends React.Component<Props, State> { getStringInput(property: ComponentProperty, value: any) { const {showEditor, showPassword} = this.state; - const inKubernetes = KubernetesAPI.inKubernetes; - const noKubeSelectorButton = ["uri", "id", "description", "group"].includes(property.name); + const inInfrastructure = InfrastructureAPI.infrastructure !== 'local'; + const noInfraSelectorButton = ["uri", "id", "description", "group"].includes(property.name); + const icon = InfrastructureAPI.infrastructure === 'kubernetes' ? <KubernetesIcon/> : <DockerIcon/> return <InputGroup> - {inKubernetes && !showEditor && !noKubeSelectorButton && + {inInfrastructure && !showEditor && !noInfraSelectorButton && <Tooltip position="bottom-end" content="Select from Kubernetes"> <Button variant="control" onClick={e => this.openKubernetesSelector(property.name)}> - <KubernetesIcon/> + {icon} </Button> </Tooltip>} {(!showEditor || property.secret) && diff --git a/karavan-designer/src/designer/route/property/DslPropertyField.tsx b/karavan-designer/src/designer/route/property/DslPropertyField.tsx index fb81df12..e11ee485 100644 --- a/karavan-designer/src/designer/route/property/DslPropertyField.tsx +++ b/karavan-designer/src/designer/route/property/DslPropertyField.tsx @@ -60,13 +60,13 @@ import {ComponentProperty} from "karavan-core/lib/model/ComponentModels"; import CompressIcon from "@patternfly/react-icons/dist/js/icons/compress-icon"; import ExpandIcon from "@patternfly/react-icons/dist/js/icons/expand-icon"; import KubernetesIcon from "@patternfly/react-icons/dist/js/icons/openshift-icon"; -import {KubernetesSelector} from "./KubernetesSelector"; -import {KubernetesAPI} from "../../utils/KubernetesAPI"; +import {InfrastructureSelector} from "./InfrastructureSelector"; +import {InfrastructureAPI} from "../../utils/InfrastructureAPI"; import EditorIcon from "@patternfly/react-icons/dist/js/icons/code-icon"; import {TemplateApi} from "karavan-core/lib/api/TemplateApi"; import {ModalEditor} from "./ModalEditor"; import {KaravanInstance} from "../../KaravanDesigner"; -import {ComponentApi} from "karavan-core/lib/api/ComponentApi"; +import DockerIcon from "@patternfly/react-icons/dist/js/icons/docker-icon"; interface Props { property: PropertyMeta, @@ -204,7 +204,7 @@ export class DslPropertyField extends React.Component<Props, State> { getKubernetesSelectorModal() { return ( - <KubernetesSelector + <InfrastructureSelector dark={false} isOpen={this.state.showKubernetesSelector} onClose={() => this.closeKubernetesSelector()} @@ -213,13 +213,14 @@ export class DslPropertyField extends React.Component<Props, State> { getStringInput = (property: PropertyMeta, value: any) => { const showEditor = this.state.showEditor; - const inKubernetes = KubernetesAPI.inKubernetes; - const noKubeSelectorButton = ["uri", "id", "description", "group"].includes(property.name); + const inInfrastructure = InfrastructureAPI.infrastructure !== 'local'; + const noInfraSelectorButton = ["uri", "id", "description", "group"].includes(property.name); + const icon = InfrastructureAPI.infrastructure === 'kubernetes' ? <KubernetesIcon/> : <DockerIcon/> return (<InputGroup> - {inKubernetes && !showEditor && !noKubeSelectorButton && + {inInfrastructure && !showEditor && !noInfraSelectorButton && <Tooltip position="bottom-end" content="Select from Kubernetes"> <Button variant="control" onClick={e => this.openKubernetesSelector(property.name)}> - <KubernetesIcon/> + {icon} </Button> </Tooltip>} {(!showEditor || property.secret) && <TextInput diff --git a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KubernetesSelector.tsx b/karavan-designer/src/designer/route/property/InfrastructureSelector.tsx similarity index 95% copy from karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KubernetesSelector.tsx copy to karavan-designer/src/designer/route/property/InfrastructureSelector.tsx index a6091575..04c8d43a 100644 --- a/karavan-cloud/karavan-app/src/main/webui/src/designer/route/property/KubernetesSelector.tsx +++ b/karavan-designer/src/designer/route/property/InfrastructureSelector.tsx @@ -17,13 +17,13 @@ import React from 'react'; import { Badge, - Button, Flex, FlexItem, + Button, capitalize, Flex, FlexItem, Form, FormGroup, Modal, PageSection, Tab, Tabs, TabTitleText, TextInput, } from '@patternfly/react-core'; import '../../karavan.css'; import {TableComposable, Tbody, Td, Th, Thead, Tr} from "@patternfly/react-table"; -import {KubernetesAPI} from "../../utils/KubernetesAPI"; +import {InfrastructureAPI} from "../../utils/InfrastructureAPI"; interface Props { onSelect: (value: string) => void, @@ -40,13 +40,13 @@ interface State { services: string[] } -export class KubernetesSelector extends React.Component<Props, State> { +export class InfrastructureSelector extends React.Component<Props, State> { public state: State = { tabIndex: "configMap", - configMaps: KubernetesAPI.configMaps, - secrets: KubernetesAPI.secrets, - services: KubernetesAPI.services + configMaps: InfrastructureAPI.configMaps, + secrets: InfrastructureAPI.secrets, + services: InfrastructureAPI.services }; selectTab = (evt: React.MouseEvent<HTMLElement, MouseEvent>, eventKey: string | number) => { @@ -210,7 +210,7 @@ export class KubernetesSelector extends React.Component<Props, State> { const tabIndex = this.state.tabIndex; return ( <Modal - aria-label="Select from Kubernetes" + aria-label="Select from Infrastructure" width={'50%'} className='dsl-modal' isOpen={this.props.isOpen} @@ -218,7 +218,7 @@ export class KubernetesSelector extends React.Component<Props, State> { header={ <Flex direction={{default: "column"}}> <FlexItem> - <h3>{"Select from Kubernetes"}</h3> + <h3>{"Select from " + capitalize(InfrastructureAPI.infrastructure)}</h3> {this.searchInput()} </FlexItem> <FlexItem> diff --git a/karavan-designer/src/designer/route/property/KameletPropertyField.tsx b/karavan-designer/src/designer/route/property/KameletPropertyField.tsx index cda5ac3f..8beed690 100644 --- a/karavan-designer/src/designer/route/property/KameletPropertyField.tsx +++ b/karavan-designer/src/designer/route/property/KameletPropertyField.tsx @@ -27,11 +27,12 @@ import HelpIcon from "@patternfly/react-icons/dist/js/icons/help-icon"; import ExpandIcon from "@patternfly/react-icons/dist/js/icons/expand-icon"; import CompressIcon from "@patternfly/react-icons/dist/js/icons/compress-icon"; import {Property} from "karavan-core/lib/model/KameletModels"; -import {KubernetesSelector} from "./KubernetesSelector"; -import {KubernetesAPI} from "../../utils/KubernetesAPI"; +import {InfrastructureSelector} from "./InfrastructureSelector"; +import {InfrastructureAPI} from "../../utils/InfrastructureAPI"; import KubernetesIcon from "@patternfly/react-icons/dist/js/icons/openshift-icon"; import ShowIcon from "@patternfly/react-icons/dist/js/icons/eye-icon"; import HideIcon from "@patternfly/react-icons/dist/js/icons/eye-slash-icon"; +import DockerIcon from "@patternfly/react-icons/dist/js/icons/docker-icon"; interface Props { property: Property, @@ -96,7 +97,7 @@ export class KameletPropertyField extends React.Component<Props, State> { getKubernetesSelectorModal() { return ( - <KubernetesSelector + <InfrastructureSelector dark={false} isOpen={this.state.showKubernetesSelector} onClose={() => this.closeKubernetesSelector()} @@ -108,13 +109,15 @@ export class KameletPropertyField extends React.Component<Props, State> { const {property, value} = this.props; const prefix = "parameters"; const id = prefix + "-" + property.id; - const noKubeSelectorButton = ["uri", "id", "description", "group"].includes(property.id); - const showKubeSelectorButton = KubernetesAPI.inKubernetes && !showEditor && !noKubeSelectorButton + const inInfrastructure = InfrastructureAPI.infrastructure !== 'local'; + const noInfraSelectorButton = ["uri", "id", "description", "group"].includes(property.id); + const icon = InfrastructureAPI.infrastructure === 'kubernetes' ? <KubernetesIcon/> : <DockerIcon/> + const showInfraSelectorButton = inInfrastructure && !showEditor && !noInfraSelectorButton return <InputGroup> - {showKubeSelectorButton && + {showInfraSelectorButton && <Tooltip position="bottom-end" content="Select from Kubernetes"> <Button variant="control" onClick={e => this.openKubernetesSelector(property.id)}> - <KubernetesIcon/> + {icon} </Button> </Tooltip>} {(!showEditor || property.format === "password") && diff --git a/karavan-designer/src/designer/utils/KubernetesAPI.ts b/karavan-designer/src/designer/utils/InfrastructureAPI.ts similarity index 77% rename from karavan-designer/src/designer/utils/KubernetesAPI.ts rename to karavan-designer/src/designer/utils/InfrastructureAPI.ts index 5168bc3c..8b182dc1 100644 --- a/karavan-designer/src/designer/utils/KubernetesAPI.ts +++ b/karavan-designer/src/designer/utils/InfrastructureAPI.ts @@ -1,6 +1,6 @@ -export class KubernetesAPI { +export class InfrastructureAPI { - static inKubernetes: boolean = false; + static infrastructure: 'kubernetes' | 'docker' | 'local' = 'local'; static configMaps: string[] = []; static secrets: string[] = []; static services: string[] = [];