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 c30132c8 Vertx as internal navigation component
c30132c8 is described below

commit c30132c86876a5afca4459c3ac4f88f7fb5d7881
Author: Marat Gubaidullin <ma...@talismancloud.io>
AuthorDate: Fri Aug 23 17:24:35 2024 -0400

    Vertx as internal navigation component
---
 .../main/webui/src/designer/icons/OtherIcons.tsx   | 18 +-------
 .../src/main/webui/src/designer/utils/CamelUi.tsx  |  1 -
 .../src/main/webui/src/project/ProjectPanel.tsx    |  2 +-
 .../src/main/webui/src/topology/CustomNode.tsx     | 23 +++++++---
 .../src/main/webui/src/topology/TopologyApi.tsx    | 51 ++++++++++++----------
 karavan-core/src/core/api/TopologyUtils.ts         | 34 ++++-----------
 karavan-designer/src/designer/icons/OtherIcons.tsx | 18 +-------
 karavan-designer/src/designer/utils/CamelUi.tsx    |  1 -
 karavan-designer/src/topology/CustomNode.tsx       | 23 +++++++---
 karavan-designer/src/topology/TopologyApi.tsx      | 51 ++++++++++++----------
 karavan-space/src/designer/icons/OtherIcons.tsx    | 18 +-------
 karavan-space/src/designer/utils/CamelUi.tsx       |  1 -
 karavan-space/src/topology/CustomNode.tsx          | 23 +++++++---
 karavan-space/src/topology/TopologyApi.tsx         | 51 ++++++++++++----------
 14 files changed, 145 insertions(+), 170 deletions(-)

diff --git a/karavan-app/src/main/webui/src/designer/icons/OtherIcons.tsx 
b/karavan-app/src/main/webui/src/designer/icons/OtherIcons.tsx
index 21368f3d..a3c62d4f 100644
--- a/karavan-app/src/main/webui/src/designer/icons/OtherIcons.tsx
+++ b/karavan-app/src/main/webui/src/designer/icons/OtherIcons.tsx
@@ -19,14 +19,7 @@ import React from 'react';
 export function AutoStartupIcon() {
     return (
         <svg xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 32 32" 
className="icon" width="24px" height="24px">
-            <path d="M16 4A12 12 0 1 1 4 16 12.035 12.035 0 0 1 16 4m0-2a14 14 
0 1 0 14 14A14.041 14.041 0 0 0 16 2Z"/>
-            <path
-                d="M0 0h32v32H0z"
-                data-name="&lt;Transparent Rectangle&gt;"
-                style={{
-                    fill: "none",
-                }}
-            />
+            <circle cx="16" cy="16" r="13" fill="white" stroke="black" 
strokeWidth="1px"/>
             <path d="M19.88 21.847h2l-5-12h-2l-5 12h2l1.24-3h5.53zm-5.93-5 
1.82-4.42h.25l1.86 4.42z"/>
         </svg>
     );
@@ -35,14 +28,7 @@ export function AutoStartupIcon() {
 export function ErrorHandlerIcon() {
     return (
         <svg xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 32 32" 
className="icon" width="24px" height="24px">
-            <path d="M16 4A12 12 0 1 1 4 16 12.035 12.035 0 0 1 16 4m0-2a14 14 
0 1 0 14 14A14.041 14.041 0 0 0 16 2Z"/>
-            <path
-                d="M0 0h32v32H0z"
-                data-name="&lt;Transparent Rectangle&gt;"
-                style={{
-                    fill: "none",
-                }}
-            />
+            <circle cx="16" cy="16" r="13" fill="white" stroke="black" 
strokeWidth="1px"/>
             <path d="m19.264 14.98-3.998 7-1.736-1 2.287-4h-3.889l3.993-7 
1.737 1-2.284 4z"/>
         </svg>
     );
diff --git a/karavan-app/src/main/webui/src/designer/utils/CamelUi.tsx 
b/karavan-app/src/main/webui/src/designer/utils/CamelUi.tsx
index 4f1d010b..2d54a27c 100644
--- a/karavan-app/src/main/webui/src/designer/utils/CamelUi.tsx
+++ b/karavan-app/src/main/webui/src/designer/utils/CamelUi.tsx
@@ -203,7 +203,6 @@ export class CamelUi {
             .reduce((accumulator, value) => accumulator.concat(value), [])
             .filter((nav, i, arr) => arr.findIndex(l => l === nav) === i)
             .filter((nav, i, arr) => !['dataformat'].includes(nav));
-        console.log(navs);
         const connectorNavs = [INTEGRATION_PATTERNS, "kamelet", "component"];
         const eipLabels = connectorNavs.filter(n => navs.includes(n));
         return eipLabels.map(label => [label, 
this.getSelectorModelsForParentFiltered(parentDsl, label, true)
diff --git a/karavan-app/src/main/webui/src/project/ProjectPanel.tsx 
b/karavan-app/src/main/webui/src/project/ProjectPanel.tsx
index 9b46a45c..3aeb34ca 100644
--- a/karavan-app/src/main/webui/src/project/ProjectPanel.tsx
+++ b/karavan-app/src/main/webui/src/project/ProjectPanel.tsx
@@ -49,11 +49,11 @@ export function ProjectPanel() {
 
     useEffect(() => {
         onRefresh();
-        return () => setFiles([]);
     }, [project.projectId]);
 
     function onRefresh() {
         if (project.projectId) {
+            setFiles([]);
             ProjectService.refreshProjectData(project.projectId);
             setTab(project.type !== ProjectType.normal ? 'files' : tab);
         }
diff --git a/karavan-app/src/main/webui/src/topology/CustomNode.tsx 
b/karavan-app/src/main/webui/src/topology/CustomNode.tsx
index e0a022d0..2d0b63da 100644
--- a/karavan-app/src/main/webui/src/topology/CustomNode.tsx
+++ b/karavan-app/src/main/webui/src/topology/CustomNode.tsx
@@ -22,6 +22,8 @@ import {DefaultNode, observer} from 
'@patternfly/react-topology';
 import {getDesignerIcon} from "../designer/icons/KaravanIcons";
 import {CamelUi} from "../designer/utils/CamelUi";
 import './topology.css';
+import {RouteDefinition} from "karavan-core/lib/model/CamelDefinition";
+import {AutoStartupIcon, ErrorHandlerIcon} from "../designer/icons/OtherIcons";
 
 function getIcon(data: any) {
     if (['route', 'rest', 'routeConfiguration'].includes(data.icon)) {
@@ -41,15 +43,22 @@ function getIcon(data: any) {
 }
 
 function getAttachments(data: any) {
-    if (data?.step?.dslName === 'RouteDefinition' && data?.step?.autoStartup 
!== false) {
-        const x = 0;
-        const y = 0;
-        const rx = x + 9;
-        const ry = y + 9;
+    if (data && data?.step?.dslName === 'RouteDefinition') {
+        const route: RouteDefinition = data?.step;
+        const autoStartup =  route?.autoStartup !== false;
+        const errorHandler =  route?.errorHandler !== undefined;
         return (
             <g className="pf-topology__node__label__badge auto-start" 
transform="translate(-4, -4)">
-                <rect className="badge" x={x} width="22" y={y} height="17" 
rx={rx} ry={ry}></rect>
-                <text className='text' x={rx + 2} y={ry} textAnchor="middle" 
dy="0.35em">A</text>
+                {errorHandler &&
+                    <g className="" transform="translate(13, -4)">
+                        {ErrorHandlerIcon()}
+                    </g>
+                }
+                {autoStartup &&
+                    <g className="" transform="translate(-4, -4)">
+                        {AutoStartupIcon()}
+                    </g>
+                }
             </g>
         )
     } else <></>
diff --git a/karavan-app/src/main/webui/src/topology/TopologyApi.tsx 
b/karavan-app/src/main/webui/src/topology/TopologyApi.tsx
index a5342a37..3416f83b 100644
--- a/karavan-app/src/main/webui/src/topology/TopologyApi.tsx
+++ b/karavan-app/src/main/webui/src/topology/TopologyApi.tsx
@@ -36,6 +36,7 @@ import {TopologyUtils} from 
"karavan-core/lib/api/TopologyUtils";
 import {TopologyIncomingNode, TopologyOutgoingNode, TopologyRestNode, 
TopologyRouteConfigurationNode, TopologyRouteNode} from 
"karavan-core/lib/model/TopologyDefinition";
 import CustomEdge from "./CustomEdge";
 import CustomGroup from "./CustomGroup";
+import {INTERNAL_COMPONENTS} from "karavan-core/lib/api/ComponentApi";
 
 const NODE_DIAMETER = 60;
 
@@ -247,8 +248,10 @@ export function getInternalEdges(tons: 
TopologyOutgoingNode[], tins: TopologyInc
             if (target) result.push(node);
         } else {
             const uri: string = (ton.step as any).uri;
-            if (uri?.startsWith("direct") || uri?.startsWith("seda")) {
-                const name = (ton.step as any).parameters.name;
+            const component = uri?.split(":")?.[0];
+            if (INTERNAL_COMPONENTS.includes(component)) {
+                const step = (ton.step as any);
+                const name = step.parameters.name || step.parameters.address;
                 const target = TopologyUtils.getRouteIdByUriAndName(tins, uri, 
name);
                 const node: EdgeModel = {
                     id: 'internal-' + ton.id + '-' + index,
@@ -323,28 +326,28 @@ export function getModel(files: IntegrationFile[], 
grouping?: boolean): Model {
     } else {
         const externalEdges = getExternalEdges(tons,tins);
         edges.push(...externalEdges);
-        const uniqueGroups: Map<string, string[]> = new Map();
-
-        externalEdges.forEach(edge => {
-            const groupName =  edge.data.groupName;
-            const children = uniqueGroups.get(groupName) || [];
-            if (edge.source) children.push(edge.source)
-            if (edge.target) children.push(edge.target)
-            uniqueGroups.set(groupName, [...new Set(children)]);
-        });
-
-        uniqueGroups.forEach((children, groupName) => {
-            groups.push({
-                id: groupName + '-group',
-                children: children,
-                type: 'group',
-                group: true,
-                // label: edge.id + ' group',
-                style: {
-                    padding: 20,
-                }
-            })
-        })
+        // const uniqueGroups: Map<string, string[]> = new Map();
+        //
+        // externalEdges.forEach(edge => {
+        //     const groupName =  edge.data.groupName;
+        //     const children = uniqueGroups.get(groupName) || [];
+        //     if (edge.source) children.push(edge.source)
+        //     if (edge.target) children.push(edge.target)
+        //     uniqueGroups.set(groupName, [...new Set(children)]);
+        // });
+        //
+        // uniqueGroups.forEach((children, groupName) => {
+        //     groups.push({
+        //         id: groupName + '-group',
+        //         children: children,
+        //         type: 'group',
+        //         group: true,
+        //         // label: edge.id + ' group',
+        //         style: {
+        //             padding: 20,
+        //         }
+        //     })
+        // })
     }
     nodes.push(...groups)
 
diff --git a/karavan-core/src/core/api/TopologyUtils.ts 
b/karavan-core/src/core/api/TopologyUtils.ts
index 32c43ba0..01c45845 100644
--- a/karavan-core/src/core/api/TopologyUtils.ts
+++ b/karavan-core/src/core/api/TopologyUtils.ts
@@ -55,29 +55,10 @@ export class TopologyUtils {
     static isElementInternalComponent = (element: CamelElement): boolean => {
         const uri = (element as any).uri;
         const component = ComponentApi.findByName(uri);
+        if (INTERNAL_COMPONENTS.includes(uri?.split(':')?.[0])) return true;
         return component !== undefined && component.component.remote !== true;
     }
 
-    static isComponentInternal = (label: string): boolean => {
-        const labels = label.split(",");
-        if (labels.includes('core') && (
-            labels.includes('transformation')
-            || labels.includes('testing')
-            || labels.includes('scheduling')
-            || labels.includes('monitoring')
-            || labels.includes('transformation')
-            || labels.includes('java')
-            || labels.includes('endpoint')
-            || labels.includes('script')
-            || labels.includes('validation')
-        )) {
-            return true;
-        } else if (label === 'transformation') {
-            return true;
-        }
-        return false;
-    }
-
     static getConnectorType = (element: CamelElement): 'component' | 'kamelet' 
=> {
         return CamelUtil.isKameletComponent(element) ? 'kamelet' : 'component';
     }
@@ -292,9 +273,8 @@ export class TopologyUtils {
                     const e = rc.errorHandler?.deadLetterChannel
                     const id = 'outgoing-' + rc.id + '-' + e.id;
                     const title = CamelDisplayUtil.getStepDescription(e);
-                    const type = (e?.deadLetterUri?.startsWith('direct:') || 
e?.deadLetterUri?.startsWith('seda:') )
-                        ? 'internal'
-                        : 'external';
+                    const comp = e?.deadLetterUri?.split(':')?.[0];
+                    const type = INTERNAL_COMPONENTS.includes(comp) ? 
'internal' : 'external';
                     const connectorType = 'component';
                     const uniqueUri = e?.deadLetterUri
                     result.push(new TopologyOutgoingNode(id, type, 
connectorType, rc.id || 'undefined', title, filename, e, uniqueUri));
@@ -336,7 +316,9 @@ export class TopologyUtils {
     static getNodeIdByUriAndName(tins: TopologyIncomingNode[], uri: string, 
name: string): string | undefined {
         if (uri && name) {
             const node =  tins
-                .filter(r => r.from.uri === uri && r?.from?.parameters?.name 
=== name).at(0);
+                .filter(r => r.from.uri === uri
+                    && (r?.from?.parameters?.name === name || 
r?.from?.parameters?.address === name)
+                ).at(0);
             if (node) {
                 return node.id;
             }
@@ -353,7 +335,9 @@ export class TopologyUtils {
     static getRouteIdByUriAndName(tins: TopologyIncomingNode[], uri: string, 
name: string): string | undefined {
         if (uri && name) {
             const node =  tins
-                .filter(r => r.from.uri === uri && r?.from?.parameters?.name 
=== name).at(0);
+                .filter(r => r.from.uri === uri
+                    && (r?.from?.parameters?.name === name || 
r?.from?.parameters?.address === name)
+                ).at(0);
             if (node) {
                 return 'route-' + node.routeId;
             }
diff --git a/karavan-designer/src/designer/icons/OtherIcons.tsx 
b/karavan-designer/src/designer/icons/OtherIcons.tsx
index 21368f3d..a3c62d4f 100644
--- a/karavan-designer/src/designer/icons/OtherIcons.tsx
+++ b/karavan-designer/src/designer/icons/OtherIcons.tsx
@@ -19,14 +19,7 @@ import React from 'react';
 export function AutoStartupIcon() {
     return (
         <svg xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 32 32" 
className="icon" width="24px" height="24px">
-            <path d="M16 4A12 12 0 1 1 4 16 12.035 12.035 0 0 1 16 4m0-2a14 14 
0 1 0 14 14A14.041 14.041 0 0 0 16 2Z"/>
-            <path
-                d="M0 0h32v32H0z"
-                data-name="&lt;Transparent Rectangle&gt;"
-                style={{
-                    fill: "none",
-                }}
-            />
+            <circle cx="16" cy="16" r="13" fill="white" stroke="black" 
strokeWidth="1px"/>
             <path d="M19.88 21.847h2l-5-12h-2l-5 12h2l1.24-3h5.53zm-5.93-5 
1.82-4.42h.25l1.86 4.42z"/>
         </svg>
     );
@@ -35,14 +28,7 @@ export function AutoStartupIcon() {
 export function ErrorHandlerIcon() {
     return (
         <svg xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 32 32" 
className="icon" width="24px" height="24px">
-            <path d="M16 4A12 12 0 1 1 4 16 12.035 12.035 0 0 1 16 4m0-2a14 14 
0 1 0 14 14A14.041 14.041 0 0 0 16 2Z"/>
-            <path
-                d="M0 0h32v32H0z"
-                data-name="&lt;Transparent Rectangle&gt;"
-                style={{
-                    fill: "none",
-                }}
-            />
+            <circle cx="16" cy="16" r="13" fill="white" stroke="black" 
strokeWidth="1px"/>
             <path d="m19.264 14.98-3.998 7-1.736-1 2.287-4h-3.889l3.993-7 
1.737 1-2.284 4z"/>
         </svg>
     );
diff --git a/karavan-designer/src/designer/utils/CamelUi.tsx 
b/karavan-designer/src/designer/utils/CamelUi.tsx
index 4f1d010b..2d54a27c 100644
--- a/karavan-designer/src/designer/utils/CamelUi.tsx
+++ b/karavan-designer/src/designer/utils/CamelUi.tsx
@@ -203,7 +203,6 @@ export class CamelUi {
             .reduce((accumulator, value) => accumulator.concat(value), [])
             .filter((nav, i, arr) => arr.findIndex(l => l === nav) === i)
             .filter((nav, i, arr) => !['dataformat'].includes(nav));
-        console.log(navs);
         const connectorNavs = [INTEGRATION_PATTERNS, "kamelet", "component"];
         const eipLabels = connectorNavs.filter(n => navs.includes(n));
         return eipLabels.map(label => [label, 
this.getSelectorModelsForParentFiltered(parentDsl, label, true)
diff --git a/karavan-designer/src/topology/CustomNode.tsx 
b/karavan-designer/src/topology/CustomNode.tsx
index e0a022d0..2d0b63da 100644
--- a/karavan-designer/src/topology/CustomNode.tsx
+++ b/karavan-designer/src/topology/CustomNode.tsx
@@ -22,6 +22,8 @@ import {DefaultNode, observer} from 
'@patternfly/react-topology';
 import {getDesignerIcon} from "../designer/icons/KaravanIcons";
 import {CamelUi} from "../designer/utils/CamelUi";
 import './topology.css';
+import {RouteDefinition} from "karavan-core/lib/model/CamelDefinition";
+import {AutoStartupIcon, ErrorHandlerIcon} from "../designer/icons/OtherIcons";
 
 function getIcon(data: any) {
     if (['route', 'rest', 'routeConfiguration'].includes(data.icon)) {
@@ -41,15 +43,22 @@ function getIcon(data: any) {
 }
 
 function getAttachments(data: any) {
-    if (data?.step?.dslName === 'RouteDefinition' && data?.step?.autoStartup 
!== false) {
-        const x = 0;
-        const y = 0;
-        const rx = x + 9;
-        const ry = y + 9;
+    if (data && data?.step?.dslName === 'RouteDefinition') {
+        const route: RouteDefinition = data?.step;
+        const autoStartup =  route?.autoStartup !== false;
+        const errorHandler =  route?.errorHandler !== undefined;
         return (
             <g className="pf-topology__node__label__badge auto-start" 
transform="translate(-4, -4)">
-                <rect className="badge" x={x} width="22" y={y} height="17" 
rx={rx} ry={ry}></rect>
-                <text className='text' x={rx + 2} y={ry} textAnchor="middle" 
dy="0.35em">A</text>
+                {errorHandler &&
+                    <g className="" transform="translate(13, -4)">
+                        {ErrorHandlerIcon()}
+                    </g>
+                }
+                {autoStartup &&
+                    <g className="" transform="translate(-4, -4)">
+                        {AutoStartupIcon()}
+                    </g>
+                }
             </g>
         )
     } else <></>
diff --git a/karavan-designer/src/topology/TopologyApi.tsx 
b/karavan-designer/src/topology/TopologyApi.tsx
index a5342a37..3416f83b 100644
--- a/karavan-designer/src/topology/TopologyApi.tsx
+++ b/karavan-designer/src/topology/TopologyApi.tsx
@@ -36,6 +36,7 @@ import {TopologyUtils} from 
"karavan-core/lib/api/TopologyUtils";
 import {TopologyIncomingNode, TopologyOutgoingNode, TopologyRestNode, 
TopologyRouteConfigurationNode, TopologyRouteNode} from 
"karavan-core/lib/model/TopologyDefinition";
 import CustomEdge from "./CustomEdge";
 import CustomGroup from "./CustomGroup";
+import {INTERNAL_COMPONENTS} from "karavan-core/lib/api/ComponentApi";
 
 const NODE_DIAMETER = 60;
 
@@ -247,8 +248,10 @@ export function getInternalEdges(tons: 
TopologyOutgoingNode[], tins: TopologyInc
             if (target) result.push(node);
         } else {
             const uri: string = (ton.step as any).uri;
-            if (uri?.startsWith("direct") || uri?.startsWith("seda")) {
-                const name = (ton.step as any).parameters.name;
+            const component = uri?.split(":")?.[0];
+            if (INTERNAL_COMPONENTS.includes(component)) {
+                const step = (ton.step as any);
+                const name = step.parameters.name || step.parameters.address;
                 const target = TopologyUtils.getRouteIdByUriAndName(tins, uri, 
name);
                 const node: EdgeModel = {
                     id: 'internal-' + ton.id + '-' + index,
@@ -323,28 +326,28 @@ export function getModel(files: IntegrationFile[], 
grouping?: boolean): Model {
     } else {
         const externalEdges = getExternalEdges(tons,tins);
         edges.push(...externalEdges);
-        const uniqueGroups: Map<string, string[]> = new Map();
-
-        externalEdges.forEach(edge => {
-            const groupName =  edge.data.groupName;
-            const children = uniqueGroups.get(groupName) || [];
-            if (edge.source) children.push(edge.source)
-            if (edge.target) children.push(edge.target)
-            uniqueGroups.set(groupName, [...new Set(children)]);
-        });
-
-        uniqueGroups.forEach((children, groupName) => {
-            groups.push({
-                id: groupName + '-group',
-                children: children,
-                type: 'group',
-                group: true,
-                // label: edge.id + ' group',
-                style: {
-                    padding: 20,
-                }
-            })
-        })
+        // const uniqueGroups: Map<string, string[]> = new Map();
+        //
+        // externalEdges.forEach(edge => {
+        //     const groupName =  edge.data.groupName;
+        //     const children = uniqueGroups.get(groupName) || [];
+        //     if (edge.source) children.push(edge.source)
+        //     if (edge.target) children.push(edge.target)
+        //     uniqueGroups.set(groupName, [...new Set(children)]);
+        // });
+        //
+        // uniqueGroups.forEach((children, groupName) => {
+        //     groups.push({
+        //         id: groupName + '-group',
+        //         children: children,
+        //         type: 'group',
+        //         group: true,
+        //         // label: edge.id + ' group',
+        //         style: {
+        //             padding: 20,
+        //         }
+        //     })
+        // })
     }
     nodes.push(...groups)
 
diff --git a/karavan-space/src/designer/icons/OtherIcons.tsx 
b/karavan-space/src/designer/icons/OtherIcons.tsx
index 21368f3d..a3c62d4f 100644
--- a/karavan-space/src/designer/icons/OtherIcons.tsx
+++ b/karavan-space/src/designer/icons/OtherIcons.tsx
@@ -19,14 +19,7 @@ import React from 'react';
 export function AutoStartupIcon() {
     return (
         <svg xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 32 32" 
className="icon" width="24px" height="24px">
-            <path d="M16 4A12 12 0 1 1 4 16 12.035 12.035 0 0 1 16 4m0-2a14 14 
0 1 0 14 14A14.041 14.041 0 0 0 16 2Z"/>
-            <path
-                d="M0 0h32v32H0z"
-                data-name="&lt;Transparent Rectangle&gt;"
-                style={{
-                    fill: "none",
-                }}
-            />
+            <circle cx="16" cy="16" r="13" fill="white" stroke="black" 
strokeWidth="1px"/>
             <path d="M19.88 21.847h2l-5-12h-2l-5 12h2l1.24-3h5.53zm-5.93-5 
1.82-4.42h.25l1.86 4.42z"/>
         </svg>
     );
@@ -35,14 +28,7 @@ export function AutoStartupIcon() {
 export function ErrorHandlerIcon() {
     return (
         <svg xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 32 32" 
className="icon" width="24px" height="24px">
-            <path d="M16 4A12 12 0 1 1 4 16 12.035 12.035 0 0 1 16 4m0-2a14 14 
0 1 0 14 14A14.041 14.041 0 0 0 16 2Z"/>
-            <path
-                d="M0 0h32v32H0z"
-                data-name="&lt;Transparent Rectangle&gt;"
-                style={{
-                    fill: "none",
-                }}
-            />
+            <circle cx="16" cy="16" r="13" fill="white" stroke="black" 
strokeWidth="1px"/>
             <path d="m19.264 14.98-3.998 7-1.736-1 2.287-4h-3.889l3.993-7 
1.737 1-2.284 4z"/>
         </svg>
     );
diff --git a/karavan-space/src/designer/utils/CamelUi.tsx 
b/karavan-space/src/designer/utils/CamelUi.tsx
index 4f1d010b..2d54a27c 100644
--- a/karavan-space/src/designer/utils/CamelUi.tsx
+++ b/karavan-space/src/designer/utils/CamelUi.tsx
@@ -203,7 +203,6 @@ export class CamelUi {
             .reduce((accumulator, value) => accumulator.concat(value), [])
             .filter((nav, i, arr) => arr.findIndex(l => l === nav) === i)
             .filter((nav, i, arr) => !['dataformat'].includes(nav));
-        console.log(navs);
         const connectorNavs = [INTEGRATION_PATTERNS, "kamelet", "component"];
         const eipLabels = connectorNavs.filter(n => navs.includes(n));
         return eipLabels.map(label => [label, 
this.getSelectorModelsForParentFiltered(parentDsl, label, true)
diff --git a/karavan-space/src/topology/CustomNode.tsx 
b/karavan-space/src/topology/CustomNode.tsx
index e0a022d0..2d0b63da 100644
--- a/karavan-space/src/topology/CustomNode.tsx
+++ b/karavan-space/src/topology/CustomNode.tsx
@@ -22,6 +22,8 @@ import {DefaultNode, observer} from 
'@patternfly/react-topology';
 import {getDesignerIcon} from "../designer/icons/KaravanIcons";
 import {CamelUi} from "../designer/utils/CamelUi";
 import './topology.css';
+import {RouteDefinition} from "karavan-core/lib/model/CamelDefinition";
+import {AutoStartupIcon, ErrorHandlerIcon} from "../designer/icons/OtherIcons";
 
 function getIcon(data: any) {
     if (['route', 'rest', 'routeConfiguration'].includes(data.icon)) {
@@ -41,15 +43,22 @@ function getIcon(data: any) {
 }
 
 function getAttachments(data: any) {
-    if (data?.step?.dslName === 'RouteDefinition' && data?.step?.autoStartup 
!== false) {
-        const x = 0;
-        const y = 0;
-        const rx = x + 9;
-        const ry = y + 9;
+    if (data && data?.step?.dslName === 'RouteDefinition') {
+        const route: RouteDefinition = data?.step;
+        const autoStartup =  route?.autoStartup !== false;
+        const errorHandler =  route?.errorHandler !== undefined;
         return (
             <g className="pf-topology__node__label__badge auto-start" 
transform="translate(-4, -4)">
-                <rect className="badge" x={x} width="22" y={y} height="17" 
rx={rx} ry={ry}></rect>
-                <text className='text' x={rx + 2} y={ry} textAnchor="middle" 
dy="0.35em">A</text>
+                {errorHandler &&
+                    <g className="" transform="translate(13, -4)">
+                        {ErrorHandlerIcon()}
+                    </g>
+                }
+                {autoStartup &&
+                    <g className="" transform="translate(-4, -4)">
+                        {AutoStartupIcon()}
+                    </g>
+                }
             </g>
         )
     } else <></>
diff --git a/karavan-space/src/topology/TopologyApi.tsx 
b/karavan-space/src/topology/TopologyApi.tsx
index a5342a37..3416f83b 100644
--- a/karavan-space/src/topology/TopologyApi.tsx
+++ b/karavan-space/src/topology/TopologyApi.tsx
@@ -36,6 +36,7 @@ import {TopologyUtils} from 
"karavan-core/lib/api/TopologyUtils";
 import {TopologyIncomingNode, TopologyOutgoingNode, TopologyRestNode, 
TopologyRouteConfigurationNode, TopologyRouteNode} from 
"karavan-core/lib/model/TopologyDefinition";
 import CustomEdge from "./CustomEdge";
 import CustomGroup from "./CustomGroup";
+import {INTERNAL_COMPONENTS} from "karavan-core/lib/api/ComponentApi";
 
 const NODE_DIAMETER = 60;
 
@@ -247,8 +248,10 @@ export function getInternalEdges(tons: 
TopologyOutgoingNode[], tins: TopologyInc
             if (target) result.push(node);
         } else {
             const uri: string = (ton.step as any).uri;
-            if (uri?.startsWith("direct") || uri?.startsWith("seda")) {
-                const name = (ton.step as any).parameters.name;
+            const component = uri?.split(":")?.[0];
+            if (INTERNAL_COMPONENTS.includes(component)) {
+                const step = (ton.step as any);
+                const name = step.parameters.name || step.parameters.address;
                 const target = TopologyUtils.getRouteIdByUriAndName(tins, uri, 
name);
                 const node: EdgeModel = {
                     id: 'internal-' + ton.id + '-' + index,
@@ -323,28 +326,28 @@ export function getModel(files: IntegrationFile[], 
grouping?: boolean): Model {
     } else {
         const externalEdges = getExternalEdges(tons,tins);
         edges.push(...externalEdges);
-        const uniqueGroups: Map<string, string[]> = new Map();
-
-        externalEdges.forEach(edge => {
-            const groupName =  edge.data.groupName;
-            const children = uniqueGroups.get(groupName) || [];
-            if (edge.source) children.push(edge.source)
-            if (edge.target) children.push(edge.target)
-            uniqueGroups.set(groupName, [...new Set(children)]);
-        });
-
-        uniqueGroups.forEach((children, groupName) => {
-            groups.push({
-                id: groupName + '-group',
-                children: children,
-                type: 'group',
-                group: true,
-                // label: edge.id + ' group',
-                style: {
-                    padding: 20,
-                }
-            })
-        })
+        // const uniqueGroups: Map<string, string[]> = new Map();
+        //
+        // externalEdges.forEach(edge => {
+        //     const groupName =  edge.data.groupName;
+        //     const children = uniqueGroups.get(groupName) || [];
+        //     if (edge.source) children.push(edge.source)
+        //     if (edge.target) children.push(edge.target)
+        //     uniqueGroups.set(groupName, [...new Set(children)]);
+        // });
+        //
+        // uniqueGroups.forEach((children, groupName) => {
+        //     groups.push({
+        //         id: groupName + '-group',
+        //         children: children,
+        //         type: 'group',
+        //         group: true,
+        //         // label: edge.id + ' group',
+        //         style: {
+        //             padding: 20,
+        //         }
+        //     })
+        // })
     }
     nodes.push(...groups)
 

Reply via email to