Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(Canvas): base canBeDisabled functionality in the Processor catalog #1991

Closed
wants to merge 1 commit into from
Closed

fix(Canvas): base canBeDisabled functionality in the Processor catalog #1991

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 20 additions & 1 deletion packages/ui/src/camel-utils/camel-to-tile.adapter.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { CatalogKind, ICamelComponentDefinition, ICamelProcessorDefinition, IKameletDefinition } from '../models';
import { camelComponentToTile, camelProcessorToTile, kameletToTile } from './camel-to-tile.adapter';
import { camelComponentToTile, camelEntityToTile, camelProcessorToTile, kameletToTile } from './camel-to-tile.adapter';

describe('camelComponentToTile', () => {
it('should return a tile with the correct type', () => {
Expand Down Expand Up @@ -114,6 +114,25 @@ describe('camelProcessorToTile', () => {
});
});

describe('camelEntityToTile', () => {
it('should return a tile with the correct type', () => {
const processorDef = {
model: {
name: 'my-entity',
title: 'My Entity',
description: 'My Entity Description',
label: 'label1,label2',
},
} as ICamelProcessorDefinition;

const tile = camelEntityToTile(processorDef);

expect(tile.type).toEqual(CatalogKind.Entity);
expect(tile.name).toEqual('my-entity');
expect(tile.description).toEqual('My Entity Description');
});
});

describe('kameletToTile', () => {
it('should return a tile with the correct type', () => {
const kameletDef = {
Expand Down
8 changes: 8 additions & 0 deletions packages/ui/src/camel-utils/camel-to-tile.adapter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,14 @@ export const camelProcessorToTile = (processorDef: ICamelProcessorDefinition): I
};
};

export const camelEntityToTile = (processorDef: ICamelProcessorDefinition): ITile => {
const entityTile = camelProcessorToTile(processorDef);
entityTile.type = CatalogKind.Entity;
entityTile.headerTags = ['Entity'];

return entityTile;
};

export const kameletToTile = (kameletDef: IKameletDefinition): ITile => {
const headerTags: string[] = ['Kamelet'];
if (kameletDef.metadata.annotations['camel.apache.org/kamelet.support.level']) {
Expand Down
1,832 changes: 806 additions & 1,026 deletions packages/ui/src/components/Form/__snapshots__/CustomAutoFields.test.tsx.snap
View file
Open in desktop

Large diffs are not rendered by default.

19 changes: 12 additions & 7 deletions packages/ui/src/components/PropertiesModal/PropertiesModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,17 +25,22 @@ export const PropertiesModal: FunctionComponent<IPropertiesModalProps> = (props)
const catalogService = useContext(CatalogContext);
const tabs = useMemo(() => {
switch (props.tile.type) {
case CatalogKind.Component: {
case CatalogKind.Component:
return transformCamelComponentIntoTab(catalogService.getComponent(CatalogKind.Component, props.tile.name));
}
case CatalogKind.Processor: {

case CatalogKind.Processor:
return transformCamelProcessorComponentIntoTab(
catalogService.getComponent(CatalogKind.Processor, props.tile.name),
);
}
case CatalogKind.Kamelet: {

case CatalogKind.Entity:
return transformCamelProcessorComponentIntoTab(
catalogService.getComponent(CatalogKind.Entity, props.tile.name),
);

case CatalogKind.Kamelet:
return transformKameletComponentIntoTab(catalogService.getComponent(CatalogKind.Kamelet, props.tile.name));
}

default:
throw Error('Unknown CatalogKind during rendering modal: ' + props.tile.type);
}
Expand All @@ -52,7 +57,7 @@ export const PropertiesModal: FunctionComponent<IPropertiesModalProps> = (props)
setActiveTab(tabs[tabIndex as number]);
setActiveTabKey(tabIndex as number);
};
const nodeIconType = capitalize(props.tile.type === 'processor' ? 'EIP' : props.tile.type);
const nodeIconType = capitalize(props.tile.type === 'processor' ? NodeIconType.EIP : props.tile.type);
const iconName = nodeIconType === NodeIconType.Kamelet ? `kamelet:${props.tile.name}` : props.tile.name;

const title: ReactElement = (
Expand Down
192 changes: 101 additions & 91 deletions packages/ui/src/components/Visualization/Canvas/Form/__snapshots__/CanvasForm.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -167,120 +167,130 @@ exports[`CanvasForm should render 1`] = `
class="pf-v6-c-card__body canvas-form__body"
>
<form
autocomplete="new-password"
class="pf-v6-c-form"
data-testid="autoform"
class="pf-v6-c-form kaoto-form kaoto-form__label"
novalidate=""
>
<div>
<div
class="pf-v6-c-form__group"
>
<div
class="pf-v6-c-form__group"
data-fieldname="message"
data-testid="wrapper-field"
group="common"
class="pf-v6-c-form__group-label"
>
<div
class="pf-v6-c-form__group-label"
<label
class="pf-v6-c-form__label"
for="#.message"
>
<label
class="pf-v6-c-form__label"
for="uniforms-0000-0005"
<span
class="pf-v6-c-form__label-text"
>
<span
class="pf-v6-c-form__label-text"
>
Message
</span>
<span
aria-hidden="true"
class="pf-v6-c-form__label-required"
>

*
</span>
</label>

Message
</span>
<span
class="pf-v6-c-form__group-label-help"
aria-hidden="true"
class="pf-v6-c-form__label-required"
>

*
</span>
</label>

<span
class="pf-v6-c-form__group-label-help"
>
<div
style="display: contents;"
>
<div
style="display: contents;"
<span
aria-disabled="false"
aria-label="More info for Message field"
class="pf-v6-c-button pf-m-plain pf-m-no-padding"
data-ouia-component-id="OUIA-Generated-Button-plain-2"
data-ouia-component-type="PF6/Button"
data-ouia-safe="true"
role="button"
tabindex="0"
type="button"
>
<button
aria-disabled="false"
aria-label="More info for field"
class="pf-v6-c-button pf-m-plain field-hint-button"
data-ouia-component-id="OUIA-Generated-Button-plain-3"
data-ouia-component-type="PF6/Button"
data-ouia-safe="true"
data-testid="field-hint-button"
type="button"
<span
class="pf-v6-c-button__icon"
>
<span
class="pf-v6-c-button__icon"
<svg
aria-hidden="true"
class="pf-v6-svg"
fill="currentColor"
height="1em"
role="img"
viewBox="0 0 512 512"
width="1em"
>
<svg
aria-hidden="true"
class="pf-v6-svg"
fill="currentColor"
height="1em"
role="img"
viewBox="0 0 1024 1024"
width="1em"
>
<path
d="M521.3,576 C627.5,576 713.7,502 713.7,413.7 C713.7,325.4 627.6,253.6 521.3,253.6 C366,253.6 334.5,337.7 329.2,407.2 C329.2,414.3 335.2,416 343.5,416 L445,416 C450.5,416 458,415.5 460.8,406.5 C460.8,362.6 582.9,357.1 582.9,413.6 C582.9,441.9 556.2,470.9 521.3,473 C486.4,475.1 447.3,479.8 447.3,521.7 L447.3,553.8 C447.3,570.8 456.1,576 472,576 C487.9,576 521.3,576 521.3,576 M575.3,751.3 L575.3,655.3 C575.313862,651.055109 573.620137,646.982962 570.6,644 C567.638831,640.947672 563.552355,639.247987 559.3,639.29884 L463.3,639.29884 C459.055109,639.286138 454.982962,640.979863 452,644 C448.947672,646.961169 447.247987,651.047645 447.29884,655.3 L447.29884,751.3 C447.286138,755.544891 448.979863,759.617038 452,762.6 C454.961169,765.652328 459.047645,767.352013 463.3,767.30116 L559.3,767.30116 C563.544891,767.313862 567.617038,765.620137 570.6,762.6 C573.659349,759.643612 575.360354,755.553963 575.3,751.3 M512,896 C300.2,896 128,723.9 128,512 C128,300.3 300.2,128 512,128 C723.8,128 896,300.2 896,512 C896,723.8 723.7,896 512,896 M512.1,0 C229.7,0 0,229.8 0,512 C0,794.2 229.8,1024 512.1,1024 C794.4,1024 1024,794.3 1024,512 C1024,229.7 794.4,0 512.1,0"
/>
</svg>
</span>
</button>
</div>
</span>
</div>
<path
d="M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zM262.655 90c-54.497 0-89.255 22.957-116.549 63.758-3.536 5.286-2.353 12.415 2.715 16.258l34.699 26.31c5.205 3.947 12.621 3.008 16.665-2.122 17.864-22.658 30.113-35.797 57.303-35.797 20.429 0 45.698 13.148 45.698 32.958 0 14.976-12.363 22.667-32.534 33.976C247.128 238.528 216 254.941 216 296v4c0 6.627 5.373 12 12 12h56c6.627 0 12-5.373 12-12v-1.333c0-28.462 83.186-29.647 83.186-106.667 0-58.002-60.165-102-116.531-102zM256 338c-25.365 0-46 20.635-46 46 0 25.364 20.635 46 46 46s46-20.636 46-46c0-25.365-20.635-46-46-46z"
/>
</svg>
</span>
</span>
</div>
</span>
</div>
<div
class="pf-v6-c-form__group-control"
>
<div
class="pf-v6-c-form__group-control"
class="pf-v6-c-text-input-group"
>
<span
class="pf-v6-c-form-control"
<div
aria-describedby="#.message-popover"
class="pf-v6-c-text-input-group__main"
id="#.message"
>
<input
aria-invalid="false"
aria-label="uniforms text field"
data-ouia-component-id="OUIA-Generated-TextInputBase-2"
data-ouia-component-type="PF6/TextInput"
data-ouia-safe="true"
data-testid="text-field"
description="Sets the log message (uses simple language)"
group="common"
id="uniforms-0000-0005"
label="Message"
name="message"
type="text"
value="We got a one."
/>
</span>
<span
class="pf-v6-c-text-input-group__text"
>
<input
aria-label="Type to filter"
class="pf-v6-c-text-input-group__text-input"
name="#.message"
type="text"
value="We got a one."
/>
</span>
</div>
<div
class="pf-v6-c-form__helper-text"
class="pf-v6-c-text-input-group__utilities"
>
<div
class="pf-v6-c-helper-text"
<button
aria-disabled="false"
aria-label="Clear #.message field"
class="pf-v6-c-button pf-m-plain"
data-ouia-component-id="OUIA-Generated-Button-plain-3"
data-ouia-component-type="PF6/Button"
data-ouia-safe="true"
title="Clear #.message field"
type="button"
>
<div
class="pf-v6-c-helper-text__item"
<span
class="pf-v6-c-button__icon"
>
<span
class="pf-v6-c-helper-text__item-text"
/>
</div>
</div>
<svg
aria-hidden="true"
class="pf-v6-svg"
fill="currentColor"
height="1em"
role="img"
viewBox="0 0 352 512"
width="1em"
>
<path
d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
/>
</svg>
</span>
</button>
</div>
</div>
</div>
</div>
</form>
<div
data-testid="root-form-placeholder"
/>
</div>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion .../ui/src/components/Visualization/Canvas/FormV2/fields/PropertiesField/PropertiesField.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export const PropertiesField: FunctionComponent<FieldProps> = ({ propName, requi
{schema.title} <Badge title={`${items.length} properties`}>{items.length}</Badge>
</>
}
type="boolean"
type="object"
description={schema.description}
defaultValue={schema.default?.toString()}
>
Expand Down
Loading
Loading