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 93bce3c6 Fix #800
93bce3c6 is described below
commit 93bce3c6e29dbb739f68c3f6b31a6274880b9398
Author: Marat Gubaidullin <[email protected]>
AuthorDate: Sat Jun 24 14:26:27 2023 -0400
Fix #800
---
.../src/designer/route/DslConnections.tsx | 1 -
karavan-space/src/designer/route/DslProperties.tsx | 17 ++++++----------
.../route/property/ComponentParameterField.tsx | 23 +++++++++++-----------
.../designer/route/property/DslPropertyField.tsx | 13 ++++++------
karavan-space/src/designer/utils/CamelUi.tsx | 9 +++++++--
5 files changed, 32 insertions(+), 31 deletions(-)
diff --git a/karavan-space/src/designer/route/DslConnections.tsx
b/karavan-space/src/designer/route/DslConnections.tsx
index f18866e1..7ccfe8fe 100644
--- a/karavan-space/src/designer/route/DslConnections.tsx
+++ b/karavan-space/src/designer/route/DslConnections.tsx
@@ -147,7 +147,6 @@ export class DslConnections extends React.Component<Props,
State> {
while (this.hasOverlap(outs)) {
outs = this.addGap(outs);
}
- // console.log(outs);
return outs;
}
diff --git a/karavan-space/src/designer/route/DslProperties.tsx
b/karavan-space/src/designer/route/DslProperties.tsx
index f0000bc1..41fe2d3e 100644
--- a/karavan-space/src/designer/route/DslProperties.tsx
+++ b/karavan-space/src/designer/route/DslProperties.tsx
@@ -89,17 +89,12 @@ export class DslProperties extends React.Component<Props,
State> {
parametersChanged = (parameter: string, value: string | number | boolean |
any, pathParameter?: boolean, newRoute?: RouteToCreate) => {
if (this.state.step && this.state.step) {
- if (pathParameter) {
- const uri = ComponentApi.buildComponentUri((this.state.step as
any).uri, parameter, value);
- this.propertyChanged("uri", uri, newRoute);
- } else {
- const clone = (CamelUtil.cloneStep(this.state.step));
- const parameters: any = {...(clone as any).parameters};
- parameters[parameter] = value;
- (clone as any).parameters = parameters;
- this.setStep(clone);
- this.props.onPropertyUpdate?.call(this, clone);
- }
+ const clone = (CamelUtil.cloneStep(this.state.step));
+ const parameters: any = {...(clone as any).parameters};
+ parameters[parameter] = value;
+ (clone as any).parameters = parameters;
+ this.setStep(clone);
+ this.props.onPropertyUpdate?.call(this, clone);
}
}
diff --git
a/karavan-space/src/designer/route/property/ComponentParameterField.tsx
b/karavan-space/src/designer/route/property/ComponentParameterField.tsx
index faad51c8..e9c6d02f 100644
--- a/karavan-space/src/designer/route/property/ComponentParameterField.tsx
+++ b/karavan-space/src/designer/route/property/ComponentParameterField.tsx
@@ -59,6 +59,7 @@ interface State {
showKubernetesSelector: boolean
kubernetesSelectorProperty?: string
ref: any
+ id: string
}
export class ComponentParameterField extends React.Component<Props, State> {
@@ -69,6 +70,7 @@ export class ComponentParameterField extends
React.Component<Props, State> {
showPassword: false,
showKubernetesSelector: false,
ref: React.createRef(),
+ id: prefix + "-" + this.props.property.name
}
parametersChanged = (parameter: string, value: string | number | boolean |
any, pathParameter?: boolean, newRoute?: RouteToCreate) => {
@@ -93,6 +95,7 @@ export class ComponentParameterField extends
React.Component<Props, State> {
}
return (
<Select
+ id={this.state.id} name={this.state.id}
variant={SelectVariant.single}
aria-label={property.name}
onToggle={isExpanded => {
@@ -142,8 +145,9 @@ export class ComponentParameterField extends
React.Component<Props, State> {
selectOptions.push(...uris.map((value: string) =>
<SelectOption key={value} value={value.trim()}/>));
}
- return <InputGroup>
+ return <InputGroup id={this.state.id} name={this.state.id}>
<Select
+ id={this.state.id} name={this.state.id}
placeholderText="Select or type an URI"
variant={SelectVariant.typeahead}
aria-label={property.name}
@@ -212,7 +216,6 @@ export class ComponentParameterField extends
React.Component<Props, State> {
getStringInput(property: ComponentProperty, value: any) {
const {showEditor, showPassword} = this.state;
const inKubernetes = KubernetesAPI.inKubernetes;
- const id = prefix + "-" + property.name;
const noKubeSelectorButton = ["uri", "id", "description",
"group"].includes(property.name);
return <InputGroup>
{inKubernetes && !showEditor && !noKubeSelectorButton &&
@@ -224,14 +227,14 @@ export class ComponentParameterField extends
React.Component<Props, State> {
{(!showEditor || property.secret) &&
<TextInput className="text-field" isRequired
ref={this.state.ref}
type={property.secret && !showPassword ? "password"
: "text"}
- id={id} name={id}
+ id={this.state.id} name={this.state.id}
value={value !== undefined ? value :
property.defaultValue}
onChange={e =>
this.parametersChanged(property.name, e, property.kind === 'path')}/>}
{showEditor && !property.secret &&
<TextArea autoResize={true} ref={this.state.ref}
className="text-field" isRequired
type="text"
- id={id} name={id}
+ id={this.state.id} name={this.state.id}
value={value !== undefined ? value :
property.defaultValue}
onChange={e => this.parametersChanged(property.name,
e, property.kind === 'path')}/>}
{!property.secret &&
@@ -252,12 +255,11 @@ export class ComponentParameterField extends
React.Component<Props, State> {
}
getTextInput = (property: ComponentProperty, value: any) => {
- const id = prefix + "-" + property.name;
return (
<TextInput
className="text-field" isRequired
type={['integer', 'int', 'number'].includes(property.type) ?
'number' : (property.secret ? "password" : "text")}
- id={id} name={id}
+ id={this.state.id} name={this.state.id}
value={value !== undefined ? value : property.defaultValue}
onChange={e => this.parametersChanged(property.name,
['integer', 'int', 'number'].includes(property.type) ? Number(e) : e,
property.kind === 'path')}/>
)
@@ -271,6 +273,7 @@ export class ComponentParameterField extends
React.Component<Props, State> {
}
return (
<Select
+ id={this.state.id} name={this.state.id}
variant={SelectVariant.single}
aria-label={property.name}
onToggle={isExpanded => {
@@ -288,12 +291,11 @@ export class ComponentParameterField extends
React.Component<Props, State> {
}
getSwitch = (property: ComponentProperty, value: any) => {
- const id = prefix + "-" + property.name;
return (
<Switch
- id={id} name={id}
+ id={this.state.id} name={this.state.id}
value={value?.toString()}
- aria-label={id}
+ aria-label={this.state.id}
isChecked={value !== undefined ? Boolean(value) :
property.defaultValue !== undefined && property.defaultValue === 'true'}
onChange={e => this.parametersChanged(property.name,
!Boolean(value))}/>
)
@@ -302,12 +304,11 @@ export class ComponentParameterField extends
React.Component<Props, State> {
render() {
const property: ComponentProperty = this.props.property;
const value = this.props.value;
- const id = prefix + "-" + property.name;
+ const id = this.state.id;
return (
<FormGroup
key={id}
label={property.displayName}
- fieldId={id}
isRequired={property.required}
labelIcon={
<Popover
diff --git a/karavan-space/src/designer/route/property/DslPropertyField.tsx
b/karavan-space/src/designer/route/property/DslPropertyField.tsx
index ba20f174..fb81df12 100644
--- a/karavan-space/src/designer/route/property/DslPropertyField.tsx
+++ b/karavan-space/src/designer/route/property/DslPropertyField.tsx
@@ -66,6 +66,7 @@ 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";
interface Props {
property: PropertyMeta,
@@ -141,7 +142,7 @@ export class DslPropertyField extends
React.Component<Props, State> {
const newValue = this.state.arrayValues.get(fieldId);
const property: PropertyMeta = this.props.property;
let value = this.props.value;
- if (property.isArray && property.type === 'string') {
+ if (newValue !== undefined && newValue.length > 0 && property.isArray
&& property.type === 'string') {
if (value) (value as any).push(newValue)
else value = [newValue];
}
@@ -300,7 +301,8 @@ export class DslPropertyField extends
React.Component<Props, State> {
autoResize
className="text-field" isRequired
type={"text"}
- id={property.name} name={property.name}
+ id={property.name}
+ name={property.name}
height={"100px"}
value={value?.toString()}
onChange={e => this.propertyChanged(property.name, e)}/>
@@ -402,6 +404,7 @@ export class DslPropertyField extends
React.Component<Props, State> {
onSelect={(e, value, isPlaceholder) =>
this.propertyChanged(property.name, (!isPlaceholder ? value : undefined))}
selections={value}
isOpen={this.isSelectOpen(property.name)}
+ id={property.name}
aria-labelledby={property.name}
direction={SelectDirection.down}
>
@@ -599,14 +602,13 @@ export class DslPropertyField extends
React.Component<Props, State> {
return (
<div className="parameters">
{properties.map(kp => {
- // console.log(kp);
- //
console.log(CamelDefinitionApiExt.getParametersValue(this.props.element,
kp.name, kp.kind === 'path'));
+ const value =
CamelDefinitionApiExt.getParametersValue(this.props.element, kp.name, kp.kind
=== 'path');
return (<ComponentParameterField
key={kp.name}
property={kp}
element={this.props.element}
integration={this.props.integration}
-
value={CamelDefinitionApiExt.getParametersValue(this.props.element, kp.name,
kp.kind === 'path')}
+ value={value}
onParameterChange={this.props.onParameterChange}
/>)
})}
@@ -697,7 +699,6 @@ export class DslPropertyField extends
React.Component<Props, State> {
<FormGroup
label={this.props.hideLabel ? undefined :
this.getLabel(property, value)}
isRequired={property.required}
- fieldId={property.name}
labelIcon={this.getLabelIcon(property)}>
{value && ["ExpressionDefinition",
"ExpressionSubElementDefinition"].includes(property.type)
&& this.getExpressionField(property, value)}
diff --git a/karavan-space/src/designer/utils/CamelUi.tsx
b/karavan-space/src/designer/utils/CamelUi.tsx
index 41e4edb7..a577a069 100644
--- a/karavan-space/src/designer/utils/CamelUi.tsx
+++ b/karavan-space/src/designer/utils/CamelUi.tsx
@@ -39,6 +39,7 @@ const StepElements: string[] = [
"CircuitBreakerDefinition",
"ClaimCheckDefinition",
"ConvertBodyDefinition",
+ "DelayDefinition",
"DynamicRouterDefinition",
"EnrichDefinition",
// "ErrorHandlerDefinition",
@@ -247,8 +248,10 @@ export class CamelUi {
integration.spec.flows?.filter(f => f.dslName === 'RouteDefinition')
.filter((r: RouteDefinition) =>
r.from.uri.startsWith(componentName))
.forEach((r: RouteDefinition) => {
- if (showComponentName) result.push(r.from.uri)
- else result.push(r.from.uri.replace(componentName+":", ""));
+ const uri = r.from.uri;
+ const name = r.from.parameters.name;
+ if (showComponentName) result.push(uri + ":" + name);
+ else result.push(name);
});
return result;
}
@@ -462,6 +465,8 @@ export class CamelUi {
return
"data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MT
[...]
case "IdempotentConsumerDefinition":
return
"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzJweCIgaGVpZ2h0PSIzMnB4IiB2aWV3Qm94PSIwIDAgMzIgMzIiIGlkPSJpY29uIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDpub25lO308L3N0eWxlPjwvZGVmcz48dGl0bGU+cmVzZWFyY2gtLW1hdHJpeDwvdGl0bGU+PHBvbHlnb24gcG9pbnRzPSIxOCAxMyAxOCA0IDE2IDQgMTYgNiAxMyA2IDEzIDggMTYgOCAxNiAxMyAxMyAxMyAxMyAxNSAyMSAxNSAyMSAxMyAxOCAxMyIvPjxwYXRoIGQ9Ik0xNi41LDIwQTMuNSwzLjUsMCwxLDEsMTMsMjMuNSwzLjUsMy41LDAsMCwxLDE2LjUsMjBtMC0yQT
[...]
+ case "DelayDefinition":
+ return
"data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIEdlbmVyYXRvcjogU1ZHIFJlcG8gTWl4ZXIgVG9vbHMgLS0+Cjxzdmcgd2lkdGg9IjgwMHB4IiBoZWlnaHQ9IjgwMHB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0ibm9uZSI+Cg08ZyBmaWxsPSIjMDAwMDAwIj4KDTxwYXRoIGQ9Ik0xLjUgOGE2LjUgNi41IDAgMDE2Ljc0NC02LjQ5Ni43NS43NSAwIDEwLjA1NS0xLjQ5OSA4IDggMCAxMDcuMDM2IDExLjE5My43NS43NS
[...]
default:
return camelIcon;
}
