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
The following commit(s) were added to refs/heads/main by this push:
new fd0da9f Kubernetes selector for bean field values (#433)
fd0da9f is described below
commit fd0da9f7322950f4ddd6a52963c7c04feb3bbaa3
Author: Marat Gubaidullin <[email protected]>
AuthorDate: Thu Jul 28 21:10:10 2022 -0400
Kubernetes selector for bean field values (#433)
---
.../src/designer/beans/BeanProperties.tsx | 52 ++++++++++++++++++++--
1 file changed, 48 insertions(+), 4 deletions(-)
diff --git a/karavan-designer/src/designer/beans/BeanProperties.tsx
b/karavan-designer/src/designer/beans/BeanProperties.tsx
index 8f197bb..3832a49 100644
--- a/karavan-designer/src/designer/beans/BeanProperties.tsx
+++ b/karavan-designer/src/designer/beans/BeanProperties.tsx
@@ -18,7 +18,7 @@ import React from 'react';
import {
Form,
FormGroup,
- TextInput, Button, Title, Tooltip, Popover,
+ TextInput, Button, Title, Tooltip, Popover, InputGroup,
} from '@patternfly/react-core';
import '../karavan.css';
import "@patternfly/patternfly/patternfly.css";
@@ -33,6 +33,10 @@ 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 KubernetesIcon from
"@patternfly/react-icons/dist/js/icons/openshift-icon";
+import {KubernetesAPI} from "../utils/KubernetesAPI";
+
interface Props {
integration: Integration
@@ -45,7 +49,10 @@ interface Props {
interface State {
bean?: NamedBeanDefinition
properties: Map<string, [string, string]>
- key: string
+ key: string,
+ showKubernetesSelector: boolean
+ kubernetesSelectorUuid?: string
+ kubernetesSelectorProperty?: string
}
export class BeanProperties extends React.Component<Props, State> {
@@ -59,6 +66,7 @@ export class BeanProperties extends React.Component<Props,
State> {
public state: State = {
bean: this.props.bean,
key: '',
+ showKubernetesSelector: false,
properties: this.props.bean?.properties ?
this.preparePropertiesMap(this.props.bean?.properties) : new Map<string,
[string, string]>()
};
@@ -106,6 +114,33 @@ export class BeanProperties extends React.Component<Props,
State> {
})
}
+ selectKubernetes = (value: string) => {
+ const propertyId = this.state.kubernetesSelectorProperty;
+ const uuid = this.state.kubernetesSelectorUuid;
+ if (propertyId && uuid){
+ if (value.startsWith("config") || value.startsWith("secret"))
value = "{{" + value + "}}";
+ this.propertyChanged(uuid, propertyId, value);
+ this.setState({showKubernetesSelector: false,
kubernetesSelectorProperty: undefined})
+ }
+ }
+
+ openKubernetesSelector = (uuid: string, propertyName: string) => {
+ this.setState({kubernetesSelectorUuid: uuid,
kubernetesSelectorProperty: propertyName, showKubernetesSelector: true});
+ }
+
+ closeKubernetesSelector = () => {
+ this.setState({showKubernetesSelector: false})
+ }
+
+ getKubernetesSelectorModal() {
+ return (
+ <KubernetesSelector
+ dark={false}
+ isOpen={this.state.showKubernetesSelector}
+ onClose={() => this.closeKubernetesSelector()}
+ onSelect={this.selectKubernetes}/>)
+ }
+
cloneBean = () => {
if (this.state.bean) {
const bean = CamelUtil.cloneBean(this.state.bean);
@@ -161,8 +196,16 @@ export class BeanProperties extends React.Component<Props,
State> {
const value = v[1][1];
return (
<div key={"key-" + i} className="bean-property">
- <TextInput className="text-field" isRequired
type="text" id="key" name="key" value={key} onChange={e =>
this.propertyChanged(i, e, value)}/>
- <TextInput className="text-field" isRequired
type="text" id="value" name="value" value={value} onChange={e =>
this.propertyChanged(i, key, e)}/>
+ <TextInput placeholder="Bean Field Name"
className="text-field" isRequired type="text" id="key" name="key" value={key}
onChange={e => this.propertyChanged(i, e, value)}/>
+ <InputGroup>
+ {KubernetesAPI.inKubernetes &&
+ <Tooltip position="bottom-end"
content="Select value from Kubernetes">
+ <Button variant="control" onClick={e
=> this.openKubernetesSelector(i, key)}>
+ <KubernetesIcon/>
+ </Button>
+ </Tooltip>}
+ <TextInput placeholder="Bean Field Value"
className="text-field" isRequired type="text" id="value" name="value"
value={value} onChange={e => this.propertyChanged(i, key, e)}/>
+ </InputGroup>
<Button variant="link"
className="delete-button" onClick={e =>
this.propertyDeleted(i)}><DeleteIcon/></Button>
</div>
)
@@ -180,6 +223,7 @@ export class BeanProperties extends React.Component<Props,
State> {
{this.state.bean === undefined && <IntegrationHeader
integration={this.props.integration}/>}
{this.state.bean !== undefined && this.getBeanForm()}
</Form>
+ {this.getKubernetesSelectorModal()}
</div>
)
}
