You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@camel.apache.org by ma...@apache.org on 2023/12/18 19:47:25 UTC

(camel-karavan) branch main updated (759707ce -> 77ea9ae5)

This is an automated email from the ASF dual-hosted git repository.

marat pushed a change to branch main
in repository https://gitbox.apache.org/repos/asf/camel-karavan.git


    from 759707ce Kubernetes icon
     new 18be1af3 REST and Bean #1012
     new 77ea9ae5 Fix #1036

The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 karavan-designer/public/example/demo.camel.yaml    | 18 +++++++++++++
 karavan-designer/src/designer/KaravanDesigner.tsx  |  3 ++-
 karavan-designer/src/designer/beans/BeanCard.tsx   |  4 +--
 .../src/designer/beans/BeansDesigner.tsx           | 12 ++++++---
 karavan-designer/src/designer/rest/RestCard.tsx    |  7 +++--
 .../src/designer/rest/RestConfigurationCard.tsx    |  4 +--
 .../src/designer/rest/RestDesigner.tsx             | 13 +++++++---
 .../src/designer/rest/RestMethodCard.tsx           |  4 +--
 .../src/designer/route/RouteDesigner.tsx           |  4 ++-
 .../src/designer/route/element/DslElement.css      | 14 ----------
 .../src/designer/route/element/DslElement.tsx      |  2 +-
 .../designer/route/element/DslElementHeader.tsx    |  2 +-
 .../src/designer/utils/ElementIcon.css             | 30 +++++++++-------------
 .../DslElementIcons.tsx => utils/ElementIcons.tsx} |  2 +-
 14 files changed, 66 insertions(+), 53 deletions(-)
 copy karavan-web/karavan-app/src/main/webui/src/project/devmode.css => karavan-designer/src/designer/utils/ElementIcon.css (70%)
 rename karavan-designer/src/designer/{route/element/DslElementIcons.tsx => utils/ElementIcons.tsx} (99%)


(camel-karavan) 01/02: REST and Bean #1012

Posted by ma...@apache.org.
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 18be1af329ec8d95a196d1165a0f06c9edf7b28e
Author: Marat Gubaidullin <ma...@talismancloud.io>
AuthorDate: Mon Dec 18 12:31:23 2023 -0500

    REST and Bean #1012
---
 karavan-designer/public/example/demo.camel.yaml    | 18 ++++++++++++
 karavan-designer/src/designer/beans/BeanCard.tsx   |  4 +--
 karavan-designer/src/designer/rest/RestCard.tsx    |  7 ++---
 .../src/designer/rest/RestConfigurationCard.tsx    |  4 +--
 .../src/designer/rest/RestMethodCard.tsx           |  4 +--
 .../src/designer/route/element/DslElement.css      | 14 ---------
 .../src/designer/route/element/DslElement.tsx      |  2 +-
 .../designer/route/element/DslElementHeader.tsx    |  2 +-
 .../src/designer/utils/ElementIcon.css             | 33 ++++++++++++++++++++++
 .../DslElementIcons.tsx => utils/ElementIcons.tsx} |  2 +-
 10 files changed, 63 insertions(+), 27 deletions(-)

diff --git a/karavan-designer/public/example/demo.camel.yaml b/karavan-designer/public/example/demo.camel.yaml
index 224de986..2e125534 100644
--- a/karavan-designer/public/example/demo.camel.yaml
+++ b/karavan-designer/public/example/demo.camel.yaml
@@ -4,6 +4,24 @@
     from:
       uri: timer
       id: from-cfa5
+      steps:
+        - choice:
+            when:
+              - expression:
+                  simple:
+                    id: simple-d546
+                id: when-f549
+            otherwise:
+              id: otherwise-cda7
+            id: choice-50fe
+- rest:
+    id: rest-2333
+    put:
+      - id: put-5a13
+- beans:
+    - constructors: {}
+    - constructors: {}
+
 #      steps:
 #        - marshal:
 #            id: marshal-b68c
diff --git a/karavan-designer/src/designer/beans/BeanCard.tsx b/karavan-designer/src/designer/beans/BeanCard.tsx
index e38ed2c1..7a6d77b0 100644
--- a/karavan-designer/src/designer/beans/BeanCard.tsx
+++ b/karavan-designer/src/designer/beans/BeanCard.tsx
@@ -20,9 +20,9 @@ import {
 } from '@patternfly/react-core';
 import './bean.css';
 import {RegistryBeanDefinition} from "karavan-core/lib/model/CamelDefinition";
-import DeleteIcon from "@patternfly/react-icons/dist/js/icons/times-circle-icon";
 import {useDesignerStore} from "../DesignerStore";
 import {shallow} from "zustand/shallow";
+import {DeleteElementIcon} from "../utils/ElementIcons";
 
 interface Props {
     bean: RegistryBeanDefinition
@@ -55,7 +55,7 @@ export function BeanCard (props: Props) {
             <FlexItem flex={{default:"flex_3"}} align={{default: "alignRight"}} className="description">{bean.type}</FlexItem>
             <FlexItem>
                 <Button variant="link" className="delete-button" onClick={e => onDelete(e)}>
-                    <DeleteIcon/>
+                    {DeleteElementIcon()}
                 </Button>
             </FlexItem>
         </Flex>
diff --git a/karavan-designer/src/designer/rest/RestCard.tsx b/karavan-designer/src/designer/rest/RestCard.tsx
index ae6a24d2..6c8da6fb 100644
--- a/karavan-designer/src/designer/rest/RestCard.tsx
+++ b/karavan-designer/src/designer/rest/RestCard.tsx
@@ -23,8 +23,7 @@ import '../karavan.css';
 import {CamelElement, Integration} from "karavan-core/lib/model/IntegrationDefinition";
 import {GetDefinition, RestDefinition} from "karavan-core/lib/model/CamelDefinition";
 import {RestMethodCard} from "./RestMethodCard";
-import DeleteIcon from "@patternfly/react-icons/dist/js/icons/times-circle-icon";
-import AddIcon from "@patternfly/react-icons/dist/js/icons/plus-circle-icon";
+import {AddElementIcon, DeleteElementIcon} from "../utils/ElementIcons";
 
 interface Props {
     rest: RestDefinition
@@ -62,10 +61,10 @@ export function RestCard(props: Props) {
                 <div className="title">{rest.path}</div>
                 <div className="description">{rest.description}</div>
                 <Tooltip position={"bottom"} content={<div>Add REST method</div>}>
-                    <Button variant={"link"} icon={<AddIcon/>} aria-label="Add" onClick={e => selectMethod(e)}
+                    <Button variant={"link"} icon={AddElementIcon()} aria-label="Add" onClick={e => selectMethod(e)}
                             className="add-button">Add method</Button>
                 </Tooltip>
-                <Button variant="link" className="delete-button" onClick={e => onDelete(e)}><DeleteIcon/></Button>
+                <Button variant="link" className="delete-button" onClick={e => onDelete(e)}>{DeleteElementIcon()}</Button>
             </div>
             <div className="rest-content" key={Math.random().toString()}>
                 {rest.get?.map((get: GetDefinition) =>
diff --git a/karavan-designer/src/designer/rest/RestConfigurationCard.tsx b/karavan-designer/src/designer/rest/RestConfigurationCard.tsx
index 3c11153d..4ef01261 100644
--- a/karavan-designer/src/designer/rest/RestConfigurationCard.tsx
+++ b/karavan-designer/src/designer/rest/RestConfigurationCard.tsx
@@ -19,8 +19,8 @@ import {Button} from '@patternfly/react-core';
 import './rest.css';
 import '../karavan.css';
 import {CamelElement} from "karavan-core/lib/model/IntegrationDefinition";
-import DeleteIcon from "@patternfly/react-icons/dist/js/icons/times-circle-icon";
 import {RestConfigurationDefinition} from "karavan-core/lib/model/CamelDefinition";
+import {DeleteElementIcon} from "../utils/ElementIcons";
 
 interface Props {
     restConfig: RestConfigurationDefinition
@@ -53,7 +53,7 @@ export function RestConfigurationCard (props: Props) {
             <div className="description">{desc}</div>
             <Button variant="link" className="delete-button"
                     onClick={e => onDelete(e)}>
-                <DeleteIcon/>
+                {DeleteElementIcon()}
             </Button>
         </div>
     )
diff --git a/karavan-designer/src/designer/rest/RestMethodCard.tsx b/karavan-designer/src/designer/rest/RestMethodCard.tsx
index 2af666bf..51a24d49 100644
--- a/karavan-designer/src/designer/rest/RestMethodCard.tsx
+++ b/karavan-designer/src/designer/rest/RestMethodCard.tsx
@@ -18,9 +18,9 @@ import React from 'react';
 import {Button} from '@patternfly/react-core';
 import '../karavan.css';
 import {CamelElement} from "karavan-core/lib/model/IntegrationDefinition";
-import DeleteIcon from "@patternfly/react-icons/dist/js/icons/times-circle-icon";
 import {useDesignerStore} from "../DesignerStore";
 import {shallow} from "zustand/shallow";
+import {DeleteElementIcon} from "../utils/ElementIcons";
 
 interface Props<T extends CamelElement> {
     method: T
@@ -50,7 +50,7 @@ export function RestMethodCard<T extends CamelElement> (props: Props<T>) {
                 <div className="title">{method.path}</div>
                 <div className="description">{method.description}</div>
             </div>
-            <Button variant="link" className="delete-button" onClick={e => onDelete(e)}><DeleteIcon/></Button>
+            <Button variant="link" className="delete-button" onClick={e => onDelete(e)}>{DeleteElementIcon()}</Button>
         </div>
     )
 }
\ No newline at end of file
diff --git a/karavan-designer/src/designer/route/element/DslElement.css b/karavan-designer/src/designer/route/element/DslElement.css
index 61cc5af3..edaebc54 100644
--- a/karavan-designer/src/designer/route/element/DslElement.css
+++ b/karavan-designer/src/designer/route/element/DslElement.css
@@ -209,17 +209,3 @@
 .dsl-element:hover .menu-button {
     visibility: visible;
 }
-
-.add-button-icon, .insert-button-icon {
-    fill: var(--pf-v5-global--primary-color--100);
-    width: 20px;
-    height: 20px;
-    background: white;
-}
-
-.delete-button-icon {
-    fill: var(--pf-v5-global--danger-color--100);
-    width: 20px;
-    height: 20px;
-    background: white;
-}
diff --git a/karavan-designer/src/designer/route/element/DslElement.tsx b/karavan-designer/src/designer/route/element/DslElement.tsx
index 967d3321..6f5ab5b5 100644
--- a/karavan-designer/src/designer/route/element/DslElement.tsx
+++ b/karavan-designer/src/designer/route/element/DslElement.tsx
@@ -25,7 +25,7 @@ import {CamelDisplayUtil} from "karavan-core/lib/api/CamelDisplayUtil";
 import {useDesignerStore, useIntegrationStore} from "../../DesignerStore";
 import {shallow} from "zustand/shallow";
 import {useRouteDesignerHook} from "../useRouteDesignerHook";
-import {AddElementIcon} from "./DslElementIcons";
+import {AddElementIcon} from "../../utils/ElementIcons";
 import {DslElementHeader} from "./DslElementHeader";
 
 interface Props {
diff --git a/karavan-designer/src/designer/route/element/DslElementHeader.tsx b/karavan-designer/src/designer/route/element/DslElementHeader.tsx
index c850e514..36c25c53 100644
--- a/karavan-designer/src/designer/route/element/DslElementHeader.tsx
+++ b/karavan-designer/src/designer/route/element/DslElementHeader.tsx
@@ -26,7 +26,7 @@ import {CamelDisplayUtil} from "karavan-core/lib/api/CamelDisplayUtil";
 import {useDesignerStore} from "../../DesignerStore";
 import {shallow} from "zustand/shallow";
 import {useRouteDesignerHook} from "../useRouteDesignerHook";
-import {AddElementIcon, DeleteElementIcon, InsertElementIcon} from "./DslElementIcons";
+import {AddElementIcon, DeleteElementIcon, InsertElementIcon} from "../../utils/ElementIcons";
 import { RouteConfigurationDefinition} from "karavan-core/lib/model/CamelDefinition";
 
 interface Props {
diff --git a/karavan-designer/src/designer/utils/ElementIcon.css b/karavan-designer/src/designer/utils/ElementIcon.css
new file mode 100644
index 00000000..15f2dbe3
--- /dev/null
+++ b/karavan-designer/src/designer/utils/ElementIcon.css
@@ -0,0 +1,33 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+.add-button-icon, .insert-button-icon {
+    fill: var(--pf-v5-global--primary-color--100);
+    width: 20px;
+    height: 20px;
+    background: white;
+    vertical-align: text-bottom;
+}
+
+.delete-button-icon {
+    fill: var(--pf-v5-global--danger-color--100);
+    width: 20px;
+    height: 20px;
+    background: white;
+    vertical-align: text-bottom;
+}
diff --git a/karavan-designer/src/designer/route/element/DslElementIcons.tsx b/karavan-designer/src/designer/utils/ElementIcons.tsx
similarity index 99%
rename from karavan-designer/src/designer/route/element/DslElementIcons.tsx
rename to karavan-designer/src/designer/utils/ElementIcons.tsx
index af25ba55..2d44bc5e 100644
--- a/karavan-designer/src/designer/route/element/DslElementIcons.tsx
+++ b/karavan-designer/src/designer/utils/ElementIcons.tsx
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import "./DslElement.css"
+import "./ElementIcon.css"
 import React from 'react'
 
 export function DeleteElementIcon() {


(camel-karavan) 02/02: Fix #1036

Posted by ma...@apache.org.
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 77ea9ae5a1f225ad617c236969ffdf5ff73bbb88
Author: Marat Gubaidullin <ma...@talismancloud.io>
AuthorDate: Mon Dec 18 14:47:17 2023 -0500

    Fix #1036
---
 karavan-designer/src/designer/KaravanDesigner.tsx     |  3 ++-
 karavan-designer/src/designer/beans/BeansDesigner.tsx | 12 +++++++++---
 karavan-designer/src/designer/rest/RestDesigner.tsx   | 13 ++++++++++---
 karavan-designer/src/designer/route/RouteDesigner.tsx |  4 +++-
 4 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/karavan-designer/src/designer/KaravanDesigner.tsx b/karavan-designer/src/designer/KaravanDesigner.tsx
index 7e56de60..626f984b 100644
--- a/karavan-designer/src/designer/KaravanDesigner.tsx
+++ b/karavan-designer/src/designer/KaravanDesigner.tsx
@@ -41,6 +41,7 @@ import {BeansDesigner} from "./beans/BeansDesigner";
 import {CodeEditor} from "./editor/CodeEditor";
 import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
 import {KameletDesigner} from "./kamelet/KameletDesigner";
+import {v4 as uuidv4} from "uuid";
 
 interface Props {
     onSave: (filename: string, yaml: string, propertyOnly: boolean) => void
@@ -75,9 +76,9 @@ export function KaravanDesigner(props: Props) {
         let designerTab = i.kind === 'Kamelet' ? 'kamelet' : props.tab;
         if (designerTab === undefined) {
             const counts = CamelUi.getFlowCounts(i);
+            designerTab = (counts.get('routes') || 0) > 0 ? 'routes' : designerTab;
             designerTab = (counts.get('rest') || 0) > 0 ? 'rest' : designerTab;
             designerTab = (counts.get('beans') || 0) > 0 ? 'beans' : designerTab;
-            designerTab = (counts.get('routes') || 0) > 0 ? 'routes' : designerTab;
         }
         setTab(designerTab || 'routes')
         reset();
diff --git a/karavan-designer/src/designer/beans/BeansDesigner.tsx b/karavan-designer/src/designer/beans/BeansDesigner.tsx
index 2e7b67e0..ceca2c21 100644
--- a/karavan-designer/src/designer/beans/BeansDesigner.tsx
+++ b/karavan-designer/src/designer/beans/BeansDesigner.tsx
@@ -14,7 +14,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import React from 'react';
+import React, {useEffect} from 'react';
 import {
     Button,
     Drawer,
@@ -39,9 +39,15 @@ import {shallow} from "zustand/shallow";
 export function BeansDesigner() {
 
     const [integration, setIntegration] = useIntegrationStore((s) => [s.integration, s.setIntegration], shallow)
-    const [dark, selectedStep, showDeleteConfirmation, setShowDeleteConfirmation, setSelectedStep] = useDesignerStore((s) =>
-        [s.dark, s.selectedStep, s.showDeleteConfirmation, s.setShowDeleteConfirmation, s.setSelectedStep], shallow)
+    const [dark, selectedStep, showDeleteConfirmation, setShowDeleteConfirmation, setSelectedStep, setNotification]
+        = useDesignerStore((s) =>
+        [s.dark, s.selectedStep, s.showDeleteConfirmation, s.setShowDeleteConfirmation, s.setSelectedStep, s.setNotification], shallow)
 
+    useEffect(() => {
+        return () => {
+            setNotification(false, ['', '']);
+        }
+    }, []);
 
     function onShowDeleteConfirmation(bean: RegistryBeanDefinition) {
         setSelectedStep(bean);
diff --git a/karavan-designer/src/designer/rest/RestDesigner.tsx b/karavan-designer/src/designer/rest/RestDesigner.tsx
index 51ce51af..303e6bb8 100644
--- a/karavan-designer/src/designer/rest/RestDesigner.tsx
+++ b/karavan-designer/src/designer/rest/RestDesigner.tsx
@@ -14,7 +14,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import React from 'react';
+import React, {useEffect} from 'react';
 import {
     Button, Drawer, DrawerContent, DrawerContentBody, DrawerPanelContent, Flex, FlexItem, Gallery, GalleryItem, Modal,
     PageSection
@@ -43,11 +43,18 @@ import {shallow} from "zustand/shallow";
 export function RestDesigner() {
 
     const [integration, setIntegration] = useIntegrationStore((state) => [state.integration, state.setIntegration], shallow)
-    const [dark, selectedStep, showDeleteConfirmation, setShowDeleteConfirmation, setPosition, width, height, top, left, hideLogDSL, setSelectedStep] = useDesignerStore((s) =>
-        [s.dark, s.selectedStep, s.showDeleteConfirmation, s.setShowDeleteConfirmation, s.setPosition, s.width, s.height, s.top, s.left, s.hideLogDSL, s.setSelectedStep], shallow)
+    const [selectedStep, showDeleteConfirmation, setShowDeleteConfirmation, setSelectedStep, setNotification]
+        = useDesignerStore((s) =>
+        [s.selectedStep, s.showDeleteConfirmation, s.setShowDeleteConfirmation, s.setSelectedStep, s.setNotification], shallow)
 
     const [showSelector, setShowSelector] = useSelectorStore((s) => [s.showSelector, s.setShowSelector], shallow)
 
+    useEffect(() => {
+        return () => {
+            setNotification(false, ['', '']);
+        }
+    }, []);
+
     function selectElement(element: CamelElement) {
         setSelectedStep(element);
     }
diff --git a/karavan-designer/src/designer/route/RouteDesigner.tsx b/karavan-designer/src/designer/route/RouteDesigner.tsx
index b02ed20b..3719d3c6 100644
--- a/karavan-designer/src/designer/route/RouteDesigner.tsx
+++ b/karavan-designer/src/designer/route/RouteDesigner.tsx
@@ -60,7 +60,9 @@ export function RouteDesigner() {
         if (flowRef && flowRef.current) {
             const el = flowRef.current;
             const rect = el.getBoundingClientRect();
-            setPosition(rect.width, rect.height, rect.top, rect.left)
+            if (width !== rect.width || height !== rect.height || top !== rect.top || left !== rect.left) {
+                setPosition(rect.width, rect.height, rect.top, rect.left)
+            }
         }
     }